Repository navigation
feat: ::part support in Angular's Emulated CSS parser #22515
Description
I'm submitting a...
[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report
[x ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
Current behavior
Angular has no real replacement for the deprecated /deep/ (aka >>> and ::ng-deep) which are all marked as deprecated.
Expected behavior
Angular should be at the forefront of web technology and provide today the technologies of tomorrow.
::part and ::theme provide a controlled and safe way to style components from outside without allowing abuse to the encapsulation that Shadow DOM is meant to provide.
Explaining article
Spec Draft
I would believe that such declared parts can be treated almost like @input variables that trigger change detection. Although declared on the @component style part they will be compiled into the .ngstyle and be incoparated in the view. when another component uses the ::part annotated component the styles are propagated.
What is the motivation / use case for changing the behavior?
a component needs to allow external users to style its inner parts, let say a dropdown needs to have it's button, drop-down list & selection hover styleable.
Angular version: 5.2.6
Browser: Any, it should compile away to allow browsers to support it today.
Activity
[-]css ::part &::theme support in Angular's Emulated CSS parser [/-][+]css ::part & ::theme support in Angular's Emulated CSS parser [/+]trotyl commentedon May 31, 2018
Supersedes #7251?
karptonite commentedon May 23, 2019
Looks like
::themehas been removed from the draft standard, so at most, this should be supporting just::partnow. w3c/csswg-drafts@141fedf#diff-6c51ca844ad036fddb3fddd14d4f834fThe latest draft is here (at the moment): https://drafts.csswg.org/css-shadow-parts/
lacolaco commentedon Nov 12, 2019
Shadow Part has been shipped by Safari Technical Preview 94 so it is implemented by most major browsers except Edge/IE natively. Today it is enough standard to adopt by Angular's emulated encapsulation.
perjerz commentedon Nov 20, 2020
https://caniuse.com
It's work all majors browsers now except IE 11.
[-]css ::part & ::theme support in Angular's Emulated CSS parser [/-][+]feat: `::part` support in Angular's Emulated CSS parser [/+]vytautas-pranskunas- commentedon Jun 16, 2022
watching
mangelozzi commentedon Jul 11, 2024
This is the problem with emulating the whole browser's CSS parser, one can never keep up with it.
jyounce-aim commentedon Dec 14, 2024
Any progress on adding support for ::part()?
This would be very useful. Along with eliminating the need for deprecated ::ng-deep, I think it would tremendously reduce the amount of component css variables.