feature(shadow-dom): inject variables in :host instead of :root

[jf-niji]

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Description

Hello,

I'm a french developer and I use your library for my project. We have a use case where we generate tailwind styles with variables and inject them into a shadow DOM. But your library only supports injecting variables into :root, so variables used in the shadow DOM don't work.

I added a new parameter: useHost. If true, we use :host instead of :root for CSS generation.

Additional context

I added the minimal possible to embed this feature. Other features like darkToRoot is possible when using useHost. It's generate something like this:

:host.dark { ... }

This is not something standard (Maybe I'm wrong?) because :host is a virtual node. Maybe you want to add warning at compile to warn users? I'm open to changes and digging into the feature with you.

Regards.

[mertasan]

Thank you, Joris!