@stencil/core 4.18.2 → 4.18.3

package/internal/hydrate/index.js

@@ -1,5 +1,5 @@
 /*
- Stencil Hydrate Platform v4.18.2 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Platform v4.18.3 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -874,6 +874,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
     if ((BUILD10.shadowDom || BUILD10.scoped) && isDef(scopeId) && elm["s-si"] !== scopeId) {
       elm.classList.add(elm["s-si"] = scopeId);
     }
+    if (BUILD10.scoped) {
+      updateElementScopeIds(elm, parentElm);
+    }
     if (newVNode2.$children$) {
       for (i2 = 0; i2 < newVNode2.$children$.length; ++i2) {
         childNode = createElm(oldParentVNode, newVNode2, i2, elm);
@@ -1235,22 +1238,33 @@ var nullifyVNodeRefs = (vNode) => {
 var insertBefore = (parent, newNode, reference) => {
   const inserted = parent == null ? void 0 : parent.insertBefore(newNode, reference);
   if (BUILD10.scoped) {
-    setParentScopeIdAsClassName(newNode, parent);
+    updateElementScopeIds(newNode, parent);
   }
   return inserted;
 };
-var findParentScopeId = (element) => {
-  return element ? element["s-rsc"] || element["s-si"] || element["s-sc"] || findParentScopeId(element.parentElement) : void 0;
+var findScopeIds = (element) => {
+  const scopeIds = [];
+  if (element) {
+    scopeIds.push(
+      ...element["s-scs"] || [],
+      element["s-si"],
+      element["s-sc"],
+      ...findScopeIds(element.parentElement)
+    );
+  }
+  return scopeIds;
 };
-var setParentScopeIdAsClassName = (element, parent) => {
-  var _a, _b, _c;
-  if (element && parent) {
-    const oldRootScopeId = element["s-rsc"];
-    const newRootScopeId = findParentScopeId(parent);
-    oldRootScopeId && ((_a = element.classList) == null ? void 0 : _a.contains(oldRootScopeId)) && element.classList.remove(oldRootScopeId);
-    if (newRootScopeId) {
-      element["s-rsc"] = newRootScopeId;
-      !((_b = element.classList) == null ? void 0 : _b.contains(newRootScopeId)) && ((_c = element.classList) == null ? void 0 : _c.add(newRootScopeId));
+var updateElementScopeIds = (element, parent, iterateChildNodes = false) => {
+  var _a;
+  if (element && parent && element.nodeType === 1 /* ElementNode */) {
+    const scopeIds = new Set(findScopeIds(parent).filter(Boolean));
+    if (scopeIds.size) {
+      (_a = element.classList) == null ? void 0 : _a.add(...element["s-scs"] = [...scopeIds]);
+      if (element["s-ol"] || iterateChildNodes) {
+        for (const childNode of Array.from(element.childNodes)) {
+          updateElementScopeIds(childNode, element, true);
+        }
+      }
     }
   }
 };
@@ -2064,7 +2078,7 @@ var patchCloneNode = (HostElementPrototype) => {
         "s-nr",
         "s-si",
         "s-rf",
-        "s-rsc"
+        "s-scs"
       ];
       for (; i2 < srcNode.childNodes.length; i2++) {
         slotted = srcNode.childNodes[i2]["s-nr"];
@@ -2641,10 +2655,11 @@ var addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) =>
   }
 };
 var hostListenerProxy = (hostRef, methodName) => (ev) => {
+  var _a;
   try {
     if (BUILD20.lazyLoad) {
       if (hostRef.$flags$ & 256 /* isListenReady */) {
-        hostRef.$lazyInstance$[methodName](ev);
+        (_a = hostRef.$lazyInstance$) == null ? void 0 : _a[methodName](ev);
       } else {
         (hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
       }
@@ -2659,7 +2674,8 @@ var getHostListenerTarget = (elm, flags) => {
   if (BUILD20.hostListenerTargetDocument && flags & 4 /* TargetDocument */) return doc;
   if (BUILD20.hostListenerTargetWindow && flags & 8 /* TargetWindow */) return win;
   if (BUILD20.hostListenerTargetBody && flags & 16 /* TargetBody */) return doc.body;
-  if (BUILD20.hostListenerTargetParent && flags & 32 /* TargetParent */) return elm.parentElement;
+  if (BUILD20.hostListenerTargetParent && flags & 32 /* TargetParent */ && elm.parentElement)
+    return elm.parentElement;
   return elm;
 };
 var hostListenerOpts = (flags) => supportsListenerOptions ? {

package/internal/hydrate/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal/hydrate",
-  "version": "4.18.2",
+  "version": "4.18.3",
   "description": "Stencil internal hydrate platform to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "private": true

package/internal/hydrate/runner.js

@@ -1,5 +1,5 @@
 /*
- Stencil Hydrate Runner v4.18.2 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Runner v4.18.3 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -12329,67 +12329,75 @@ var MockUListElement = class extends MockHTMLElement {
     super(ownerDocument, "ul");
   }
 };
+var CanvasRenderingContext = class {
+  constructor(context, contextAttributes) {
+    this.context = context;
+    this.contextAttributes = contextAttributes;
+  }
+  fillRect() {
+    return;
+  }
+  clearRect() {
+  }
+  getImageData(_, __, w, h) {
+    return {
+      data: new Array(w * h * 4)
+    };
+  }
+  toDataURL() {
+    return "data:,";
+  }
+  putImageData() {
+  }
+  createImageData() {
+    return {};
+  }
+  setTransform() {
+  }
+  drawImage() {
+  }
+  save() {
+  }
+  fillText() {
+  }
+  restore() {
+  }
+  beginPath() {
+  }
+  moveTo() {
+  }
+  lineTo() {
+  }
+  closePath() {
+  }
+  stroke() {
+  }
+  translate() {
+  }
+  scale() {
+  }
+  rotate() {
+  }
+  arc() {
+  }
+  fill() {
+  }
+  measureText() {
+    return { width: 0 };
+  }
+  transform() {
+  }
+  rect() {
+  }
+  clip() {
+  }
+};
 var MockCanvasElement = class extends MockHTMLElement {
   constructor(ownerDocument) {
     super(ownerDocument, "canvas");
   }
-  getContext() {
-    return {
-      fillRect() {
-        return;
-      },
-      clearRect() {
-      },
-      getImageData: function(_, __, w, h) {
-        return {
-          data: new Array(w * h * 4)
-        };
-      },
-      putImageData() {
-      },
-      createImageData: function() {
-        return [];
-      },
-      setTransform() {
-      },
-      drawImage() {
-      },
-      save() {
-      },
-      fillText() {
-      },
-      restore() {
-      },
-      beginPath() {
-      },
-      moveTo() {
-      },
-      lineTo() {
-      },
-      closePath() {
-      },
-      stroke() {
-      },
-      translate() {
-      },
-      scale() {
-      },
-      rotate() {
-      },
-      arc() {
-      },
-      fill() {
-      },
-      measureText() {
-        return { width: 0 };
-      },
-      transform() {
-      },
-      rect() {
-      },
-      clip() {
-      }
-    };
+  getContext(context, contextAttributes) {
+    return new CanvasRenderingContext(context, contextAttributes);
   }
 };
 function fullUrl(elm, attrName) {

package/internal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal",
-  "version": "4.18.2",
+  "version": "4.18.3",
   "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-private.d.ts

@@ -964,11 +964,11 @@ export interface HostElement extends HTMLElement {
      */
     ['s-sc']?: string;
     /**
-     * Root Scope Id
-     * The scope id of the root component when using scoped css encapsulation
+     * Scope Ids
+     * All the possible scope ids of this component when using scoped css encapsulation
      * or using shadow dom but the browser doesn't support it
      */
-    ['s-rsc']?: string;
+    ['s-scs']?: string[];
     /**
      * Hot Module Replacement, dev mode only
      *

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

@@ -2370,9 +2370,9 @@ export interface ResolveModuleOptions {
 }
 export interface PrerenderStartOptions {
     buildId?: string;
-    hydrateAppFilePath: string;
-    componentGraph: BuildResultsComponentGraph;
-    srcIndexHtmlPath: string;
+    hydrateAppFilePath?: string;
+    componentGraph?: BuildResultsComponentGraph;
+    srcIndexHtmlPath?: string;
 }
 export interface PrerenderResults {
     buildId: string;

package/internal/testing/index.js

@@ -979,6 +979,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
     if ((import_app_data10.BUILD.shadowDom || import_app_data10.BUILD.scoped) && isDef(scopeId) && elm["s-si"] !== scopeId) {
       elm.classList.add(elm["s-si"] = scopeId);
     }
+    if (import_app_data10.BUILD.scoped) {
+      updateElementScopeIds(elm, parentElm);
+    }
     if (newVNode2.$children$) {
       for (i2 = 0; i2 < newVNode2.$children$.length; ++i2) {
         childNode = createElm(oldParentVNode, newVNode2, i2, elm);
@@ -1340,22 +1343,33 @@ var nullifyVNodeRefs = (vNode) => {
 var insertBefore = (parent, newNode, reference) => {
   const inserted = parent == null ? void 0 : parent.insertBefore(newNode, reference);
   if (import_app_data10.BUILD.scoped) {
-    setParentScopeIdAsClassName(newNode, parent);
+    updateElementScopeIds(newNode, parent);
   }
   return inserted;
 };
-var findParentScopeId = (element) => {
-  return element ? element["s-rsc"] || element["s-si"] || element["s-sc"] || findParentScopeId(element.parentElement) : void 0;
+var findScopeIds = (element) => {
+  const scopeIds = [];
+  if (element) {
+    scopeIds.push(
+      ...element["s-scs"] || [],
+      element["s-si"],
+      element["s-sc"],
+      ...findScopeIds(element.parentElement)
+    );
+  }
+  return scopeIds;
 };
-var setParentScopeIdAsClassName = (element, parent) => {
-  var _a, _b, _c;
-  if (element && parent) {
-    const oldRootScopeId = element["s-rsc"];
-    const newRootScopeId = findParentScopeId(parent);
-    oldRootScopeId && ((_a = element.classList) == null ? void 0 : _a.contains(oldRootScopeId)) && element.classList.remove(oldRootScopeId);
-    if (newRootScopeId) {
-      element["s-rsc"] = newRootScopeId;
-      !((_b = element.classList) == null ? void 0 : _b.contains(newRootScopeId)) && ((_c = element.classList) == null ? void 0 : _c.add(newRootScopeId));
+var updateElementScopeIds = (element, parent, iterateChildNodes = false) => {
+  var _a;
+  if (element && parent && element.nodeType === 1 /* ElementNode */) {
+    const scopeIds = new Set(findScopeIds(parent).filter(Boolean));
+    if (scopeIds.size) {
+      (_a = element.classList) == null ? void 0 : _a.add(...element["s-scs"] = [...scopeIds]);
+      if (element["s-ol"] || iterateChildNodes) {
+        for (const childNode of Array.from(element.childNodes)) {
+          updateElementScopeIds(childNode, element, true);
+        }
+      }
     }
   }
 };
@@ -2169,7 +2183,7 @@ var patchCloneNode = (HostElementPrototype) => {
         "s-nr",
         "s-si",
         "s-rf",
-        "s-rsc"
+        "s-scs"
       ];
       for (; i2 < srcNode.childNodes.length; i2++) {
         slotted = srcNode.childNodes[i2]["s-nr"];
@@ -2746,10 +2760,11 @@ var addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) =>
   }
 };
 var hostListenerProxy = (hostRef, methodName) => (ev) => {
+  var _a;
   try {
     if (import_app_data20.BUILD.lazyLoad) {
       if (hostRef.$flags$ & 256 /* isListenReady */) {
-        hostRef.$lazyInstance$[methodName](ev);
+        (_a = hostRef.$lazyInstance$) == null ? void 0 : _a[methodName](ev);
       } else {
         (hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
       }
@@ -2764,7 +2779,8 @@ var getHostListenerTarget = (elm, flags) => {
   if (import_app_data20.BUILD.hostListenerTargetDocument && flags & 4 /* TargetDocument */) return doc;
   if (import_app_data20.BUILD.hostListenerTargetWindow && flags & 8 /* TargetWindow */) return win;
   if (import_app_data20.BUILD.hostListenerTargetBody && flags & 16 /* TargetBody */) return doc.body;
-  if (import_app_data20.BUILD.hostListenerTargetParent && flags & 32 /* TargetParent */) return elm.parentElement;
+  if (import_app_data20.BUILD.hostListenerTargetParent && flags & 32 /* TargetParent */ && elm.parentElement)
+    return elm.parentElement;
   return elm;
 };
 var hostListenerOpts = (flags) => supportsListenerOptions ? {

package/internal/testing/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal/testing",
-  "version": "4.18.2",
+  "version": "4.18.3",
   "description": "Stencil internal testing platform to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "private": true

package/mock-doc/index.cjs

@@ -1,5 +1,5 @@
 /*!
- Stencil Mock Doc (CommonJS) v4.18.2 | MIT Licensed | https://stenciljs.com
+ Stencil Mock Doc (CommonJS) v4.18.3 | MIT Licensed | https://stenciljs.com
  */
 "use strict";
 var __defProp = Object.defineProperty;
@@ -8202,67 +8202,75 @@ var MockUListElement = class extends MockHTMLElement {
     super(ownerDocument, "ul");
   }
 };
+var CanvasRenderingContext = class {
+  constructor(context, contextAttributes) {
+    this.context = context;
+    this.contextAttributes = contextAttributes;
+  }
+  fillRect() {
+    return;
+  }
+  clearRect() {
+  }
+  getImageData(_, __, w, h) {
+    return {
+      data: new Array(w * h * 4)
+    };
+  }
+  toDataURL() {
+    return "data:,";
+  }
+  putImageData() {
+  }
+  createImageData() {
+    return {};
+  }
+  setTransform() {
+  }
+  drawImage() {
+  }
+  save() {
+  }
+  fillText() {
+  }
+  restore() {
+  }
+  beginPath() {
+  }
+  moveTo() {
+  }
+  lineTo() {
+  }
+  closePath() {
+  }
+  stroke() {
+  }
+  translate() {
+  }
+  scale() {
+  }
+  rotate() {
+  }
+  arc() {
+  }
+  fill() {
+  }
+  measureText() {
+    return { width: 0 };
+  }
+  transform() {
+  }
+  rect() {
+  }
+  clip() {
+  }
+};
 var MockCanvasElement = class extends MockHTMLElement {
   constructor(ownerDocument) {
     super(ownerDocument, "canvas");
   }
-  getContext() {
-    return {
-      fillRect() {
-        return;
-      },
-      clearRect() {
-      },
-      getImageData: function(_, __, w, h) {
-        return {
-          data: new Array(w * h * 4)
-        };
-      },
-      putImageData() {
-      },
-      createImageData: function() {
-        return [];
-      },
-      setTransform() {
-      },
-      drawImage() {
-      },
-      save() {
-      },
-      fillText() {
-      },
-      restore() {
-      },
-      beginPath() {
-      },
-      moveTo() {
-      },
-      lineTo() {
-      },
-      closePath() {
-      },
-      stroke() {
-      },
-      translate() {
-      },
-      scale() {
-      },
-      rotate() {
-      },
-      arc() {
-      },
-      fill() {
-      },
-      measureText() {
-        return { width: 0 };
-      },
-      transform() {
-      },
-      rect() {
-      },
-      clip() {
-      }
-    };
+  getContext(context, contextAttributes) {
+    return new CanvasRenderingContext(context, contextAttributes);
   }
 };
 function fullUrl(elm, attrName) {

package/mock-doc/index.d.ts

@@ -312,38 +312,44 @@ declare class MockTitleElement extends MockHTMLElement {
 declare class MockUListElement extends MockHTMLElement {
   constructor(ownerDocument: any);
 }
+type CanvasContext = '2d' | 'webgl' | 'webgl2' | 'bitmaprenderer';
+declare class CanvasRenderingContext {
+  context: CanvasContext;
+  contextAttributes: WebGLContextAttributes;
+  constructor(context: CanvasContext, contextAttributes?: WebGLContextAttributes);
+  fillRect(): void;
+  clearRect(): void;
+  getImageData(_: number, __: number, w: number, h: number): {
+    data: any[];
+  };
+  toDataURL(): string;
+  putImageData(): void;
+  createImageData(): ImageData;
+  setTransform(): void;
+  drawImage(): void;
+  save(): void;
+  fillText(): void;
+  restore(): void;
+  beginPath(): void;
+  moveTo(): void;
+  lineTo(): void;
+  closePath(): void;
+  stroke(): void;
+  translate(): void;
+  scale(): void;
+  rotate(): void;
+  arc(): void;
+  fill(): void;
+  measureText(): {
+    width: number;
+  };
+  transform(): void;
+  rect(): void;
+  clip(): void;
+}
 declare class MockCanvasElement extends MockHTMLElement {
   constructor(ownerDocument: any);
-  getContext(): {
-    fillRect(): void;
-    clearRect(): void;
-    getImageData: (_: number, __: number, w: number, h: number) => {
-      data: any[];
-    };
-    putImageData(): void;
-    createImageData: () => any[];
-    setTransform(): void;
-    drawImage(): void;
-    save(): void;
-    fillText(): void;
-    restore(): void;
-    beginPath(): void;
-    moveTo(): void;
-    lineTo(): void;
-    closePath(): void;
-    stroke(): void;
-    translate(): void;
-    scale(): void;
-    rotate(): void;
-    arc(): void;
-    fill(): void;
-    measureText(): {
-      width: number;
-    };
-    transform(): void;
-    rect(): void;
-    clip(): void;
-  };
+  getContext(context: CanvasContext, contextAttributes?: WebGLContextAttributes): CanvasRenderingContext;
 }
 declare class MockEvent {
   bubbles: boolean;