@stencil/core 4.25.3 → 4.26.0-dev.1739336513.3b47de6

package/internal/hydrate/runner.js

@@ -1,5 +1,5 @@
 /*
- Stencil Hydrate Runner v4.25.3 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Runner v4.26.0-dev.1739336513.3b47de6 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -1447,6 +1447,7 @@ var EntityDecoder = class {
       case EntityDecoderState.NamedEntity: {
         return this.result !== 0 && (this.decodeMode !== DecodingMode.Attribute || this.result === this.treeIndex) ? this.emitNotTerminatedNamedEntity() : 0;
       }
+      // Otherwise, emit a numeric entity if we have one.
       case EntityDecoderState.NumericDecimal: {
         return this.emitNumericEntity(0, 2);
       }
@@ -8494,6 +8495,7 @@ function endTagInSelectInTable(p, token) {
 }
 function startTagInTemplate(p, token) {
   switch (token.tagID) {
+    // First, handle tags that can start without a mode change
     case TAG_ID.BASE:
     case TAG_ID.BASEFONT:
     case TAG_ID.BGSOUND:
@@ -8507,6 +8509,7 @@ function startTagInTemplate(p, token) {
       startTagInHead(p, token);
       break;
     }
+    // Re-process the token in the appropriate mode
     case TAG_ID.CAPTION:
     case TAG_ID.COLGROUP:
     case TAG_ID.TBODY:
@@ -10416,7 +10419,7 @@ function normalizeSerializationOptions(opts = {}) {
     removeAttributeQuotes: typeof opts.removeAttributeQuotes !== "boolean" ? false : opts.removeAttributeQuotes,
     removeBooleanAttributeQuotes: typeof opts.removeBooleanAttributeQuotes !== "boolean" ? false : opts.removeBooleanAttributeQuotes,
     removeHtmlComments: typeof opts.removeHtmlComments !== "boolean" ? false : opts.removeHtmlComments,
-    serializeShadowRoot: typeof opts.serializeShadowRoot !== "boolean" ? true : opts.serializeShadowRoot,
+    serializeShadowRoot: typeof opts.serializeShadowRoot === "undefined" ? "declarative-shadow-dom" : opts.serializeShadowRoot,
     fullDocument: typeof opts.fullDocument !== "boolean" ? true : opts.fullDocument
   };
 }
@@ -10545,7 +10548,7 @@ style="${cssText}">`;
     }
     if (EMPTY_ELEMENTS.has(tagName) === false) {
       const shadowRoot = node.shadowRoot;
-      if (shadowRoot != null && opts.serializeShadowRoot) {
+      if (shadowRoot != null && opts.serializeShadowRoot !== false) {
         output.indent = output.indent + ((_c = opts.indentSpaces) != null ? _c : 0);
         yield* streamToHtml(shadowRoot, opts, output);
         output.indent = output.indent - ((_d = opts.indentSpaces) != null ? _d : 0);
@@ -14342,6 +14345,31 @@ import { BUILD as BUILD11 } from "@stencil/core/internal/app-data";
 // src/runtime/initialize-component.ts
 import { BUILD as BUILD23 } from "@stencil/core/internal/app-data";
 
+// src/utils/shadow-css.ts
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ *
+ * This file is a port of shadowCSS from `webcomponents.js` to TypeScript.
+ * https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js
+ * https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts
+ */
+var _polyfillHost = "-shadowcsshost";
+var _polyfillSlotted = "-shadowcssslotted";
+var _polyfillHostContext = "-shadowcsscontext";
+var _parenSuffix = ")(?:\\(((?:\\([^)(]*\\)|[^)(]*)+?)\\))?([^,{]*)";
+var _cssColonHostRe = new RegExp("(" + _polyfillHost + _parenSuffix, "gim");
+var _cssColonHostContextRe = new RegExp("(" + _polyfillHostContext + _parenSuffix, "gim");
+var _cssColonSlottedRe = new RegExp("(" + _polyfillSlotted + _parenSuffix, "gim");
+var _polyfillHostNoCombinator = _polyfillHost + "-no-combinator";
+var createSupportsRuleRe = (selector) => new RegExp(`((?<!(^@supports(.*)))|(?<={.*))(${selector}\\b)`, "gim");
+var _colonSlottedRe = createSupportsRuleRe("::slotted");
+var _colonHostRe = createSupportsRuleRe(":host");
+var _colonHostContextRe = createSupportsRuleRe(":host-context");
+
 // src/runtime/mode.ts
 var setMode = (handler) => modeResolutionChain.push(handler);
 
@@ -15569,7 +15597,7 @@ function renderToString(html, options, asStream) {
   const opts = normalizeHydrateOptions(options);
   opts.serializeToHtml = true;
   opts.fullDocument = typeof opts.fullDocument === "boolean" ? opts.fullDocument : true;
-  opts.serializeShadowRoot = typeof opts.serializeShadowRoot === "boolean" ? opts.serializeShadowRoot : true;
+  opts.serializeShadowRoot = typeof opts.serializeShadowRoot === "undefined" ? "declarative-shadow-dom" : opts.serializeShadowRoot;
   opts.constrainTimeouts = false;
   return hydrateDocument(html, opts, asStream);
 }

package/internal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal",
-  "version": "4.25.3",
+  "version": "4.26.0-dev.1739336513.3b47de6",
   "description": "Stencil internals only to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "types": "./index.d.ts",

package/internal/stencil-public-compiler.d.ts

@@ -849,12 +849,29 @@ export interface SerializeDocumentOptions extends HydrateDocumentOptions {
      */
     removeHtmlComments?: boolean;
     /**
-     * If set to `true` the component will be rendered within a Declarative Shadow DOM.
-     * If set to `false` Stencil will ignore the contents of the shadow root and render the
-     * element as given in provided template.
-     * @default true
-     */
-    serializeShadowRoot?: boolean;
+     * Configure how Stencil serializes the components shadow root.
+     * - If set to `declarative-shadow-dom` the component will be rendered within a Declarative Shadow DOM.
+     * - If set to `scoped` Stencil will render the contents of the shadow root as a `scoped: true` component
+     *   and the shadow DOM will be created during client-side hydration.
+     * - Alternatively you can mix and match the two by providing an object with `declarative-shadow-dom` and `scoped` keys,
+     * the value arrays containing the tag names of the components that should be rendered in that mode.
+     *
+     * Examples:
+     * - `{ 'declarative-shadow-dom': ['my-component-1', 'another-component'], default: 'scoped' }`
+     * Render all components as `scoped` apart from `my-component-1` and `another-component`
+     * -  `{ 'scoped': ['an-option-component'], default: 'declarative-shadow-dom' }`
+     * Render all components within `declarative-shadow-dom` apart from `an-option-component`
+     * - `'scoped'` Render all components as `scoped`
+     * - `false` disables shadow root serialization
+     *
+     * *NOTE* `true` has been deprecated in favor of `declarative-shadow-dom` and `scoped`
+     * @default 'declarative-shadow-dom'
+     */
+    serializeShadowRoot?: 'declarative-shadow-dom' | 'scoped' | {
+        'declarative-shadow-dom'?: string[];
+        scoped?: string[];
+        default: 'declarative-shadow-dom' | 'scoped';
+    } | boolean;
     /**
      * The `fullDocument` flag determines the format of the rendered output. Set it to true to
      * generate a complete HTML document, or false to render only the component.