Spike | Use web components in a React application

[varunvs]

Context Material Design 3 aka "Material You" library is not available for React yet. Google has open sourced a web components version of it. Until MUI team comes up with v7, we have to find a way to use the web component.

In scope

• [x] Explore options for using a web component in React
• [ ] Come up with an abstraction for easy use of the web components (a framework/process so that any other frontend engineer can use it for converting a web component to a React version

Create a spike repo (convention is spike- to try this out.

Some links for reference:

• https://react-m3-demo.web.app/Home
• https://github.com/material-components/material-web/tree/main/docs/components
• https://stenciljs.com/docs/react

[varunvs]

Additional tasks

• [ ] Move the web components in comms screen that are not available in MUI to Kiowa app
• [ ] Ensure the theme is configured so that both MUI and web components use the same theme. Avoid duplication