- From: Klas Jersevi via GitHub <sysbot+gh@w3.org>
- Date: Mon, 06 May 2024 21:58:10 +0000
- To: public-css-archive@w3.org
I've been struggling with shadow parts for a little while now in a project with many nested web components that we want to provide external styling for. The current definition requires a lot of bloated extra code for us to achieve external styling possibilities. ## exportparts For nested components, this is very messy way of making sure everything is exported all the way to the root. A general simpler (default) way would increase the developer experience a lot. As a workaround to avoid maintenance hell, we are using a mixin that finds parts and exportparts in the subtree and forwards them on the component if needed. ## parts are not selectable within the shadow dom When defining a part name, why not make it selectable from stylesheets within the shadow dom? To select a part you have to use something like `:host::part(my-part)` or an attribute selector `[part~=my-part]` instead of simply just using `::part(my-part)`. It would also be easier for our third-party component users (developers) if they could just see and use the same selector as they would find in the web inspector to modify a part. It would also be easier to document. ## part names vs class names For us, the part names and our class names have the same semantical meaning and we don't want to repeat the names in two attributes like `<my-component class="my-name my-other-name" part="my-name my-other-name"></my-component>` so we switched from class names to part names only instead (and use an attribute selector internally). For this case it would have made more sense to just be able to export the class names right away. ## Use ShadowRoot mode settings It would be great if the exportparts were aligned with the mode provided for the shadow root, so that part names were accessible the same way as the shadow dom nodes are accessible in javascript via *closed* or *open*. -- GitHub Notification of comment by klasjersevi Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3467#issuecomment-2096993578 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Monday, 6 May 2024 21:58:11 UTC