Customize location where style tag is injected? (useful for shadow DOM)

[sastan]

Discussed in #332

^{Originally posted by vedantroy May 28, 2022}
Is it possible to customize where the style tag will be injected? For example, if I'm running a React app inside of a shadow DOM.

Use case: https://dev.to/tryeladd/preact-in-the-shadow-dom-ao8

[sastan]

We have new integration package for web components: @twind/with-web-components. It supports modern and legacy browsers.

Maybe that solves the problem?

You can view a preview of the docs here: https://next.twind-style.pages.dev/with-web-components. I have added a Lit example as well in case you are using that: https://next.twind-style.pages.dev/with-lit

This will be released soon (#417). Until is released you can use the pre-release version (for example @twind/with-web-components@next, @twind/core@next or @twind/preset-tailwind@next).

If you have any issues or questions please re-open this issue.