preact-custom-element icon indicating copy to clipboard operation
preact-custom-element copied to clipboard

feat: inject template styles to shadow dom

Open loberbichler opened this issue 5 years ago • 0 comments

What does this PR do

The goal of this PR is to allow the use of shadow dom and still be able to style elements and children via "normal" classnames.

Also installs libharfbuzz-icu0 libenchant1c2a to the host system as the ubuntu lts changed from 18.04 to 20.04.

Why is this PR needed

As web components with shadow dom are isolated, global styles do not apply, the styles need to be available inside the components shadow dom. This PR adds the possibility to pass styles to the options object of the register method. If given styles, the method appends a <template> element (if it does not exist already) with the given styles to the <head> and appends a copy to the components _root.

Example

I've created an example to showcase the feature CodeSandbox preact-custom-element style-injection

loberbichler avatar Feb 25 '21 17:02 loberbichler