feat(core): add support for ShadowDOM v1 (#24718)

add a new ViewEncapsulation.ShadowDom option that uses the v1 Shadow DOM API to provide style encapsulation.

PR Close #24718

packages/core/src/metadata/view.ts

@@ -23,14 +23,28 @@ export enum ViewEncapsulation {
    */
   Emulated = 0,
   /**
+   * @deprecated v6.1.0 - use {ViewEncapsulation.ShadowDom} instead.
    * Use the native encapsulation mechanism of the renderer.
    *
-   * For the DOM this means using [Shadow DOM](https://w3c.github.io/webcomponents/spec/shadow/) and
+   * For the DOM this means using the deprecated [Shadow DOM
+   * v0](https://w3c.github.io/webcomponents/spec/shadow/) and
    * creating a ShadowRoot for Component's Host Element.
    */
   Native = 1,
   /**
    * Don't provide any template or style encapsulation.
    */
-  None = 2
+  None = 2,
+
+  /**
+   * Use Shadow DOM to encapsulate styles.
+   *
+   * For the DOM this means using modern [Shadow
+   * DOM](https://w3c.github.io/webcomponents/spec/shadow/) and
+   * creating a ShadowRoot for Component's Host Element.
+   *
+   * ### Example
+   * {@example core/ts/metadata/encapsulation.ts region='longform'}
+   */
+  ShadowDom = 3
 }