search

Silind-Software / direflow

🧩 Use the best of two worlds. Create fast, performant, native Web Components using React.
https://direflow.io
MIT License
501 stars 77 forks source link

Integrate UI libraries with useShadow:true #59

Open lioshi opened 4 years ago

lioshi commented 4 years ago

In app.js of a web component I import materialUi (https://material-ui.com) to use collection of react's components import React from 'react'; import Alert from '@material-ui/lab/Alert'; It works with shadow dom off but how integrate MaterialUI style in component with shadow dom on in direflow component?

JohnDeved commented 4 years ago

in my experience, UI libraries work when you include the CSS outside, and inside the web component. (tested with antdesign)

But, you are better off just using useShadow false right now. This hast not necessarily anything to do with direflow, but is most likely cause by just how the shadow dom works. But be aware that we are currently actively working on a solution for this issue to be included in a future minor version. Direflow will then do a workaround for you in the background to get the UI libraries working in the shadow dom. So its only a matter of time until it will be easy to use UI libraries with shadow dom enabled.

JohnDeved commented 4 years ago

probably related to #34 could be bug + enhancement