[SPA/React] Render component with wcmmode=disabled

[#1]

Hi, community.

I'm creating SPA site using @adobe/cq-react-editable-components. Is it possible to include some specific component with wcmmode=disabled?

In sightly we can do it like this:

<div data-sly-resource="${'path/to/resource' @ wcmmode='disabled'}"></div>

Can I have something similar in React? Like this:

import {ResponsiveGrid} from '@adobe/cq-react-editable-components';
/* ... */
class App extends React.Component {
  /* ... */
  render() {
    /* ... */
    return (
      <>
        <Header /* ... */>
          <ResponsiveGrid wcmmode="disabled" />
        </Header>
        <Layout>
          <ResponsiveGrid /* ... */ />
        </Layout>
        <Footer /* ... */ >
          <ResponsiveGrid wcmmode="disabled" />
        </Footer>
      </>
    );
  }
}

Regards,

Ivan

[#2 · Accepted solution]

Hi Ivan Andrianovsky​, hope it's not too late.

In the customheaderlibs.html file you defined a meta property cq:wcmmode.

You can read that value in react like the following

Regards