kritzel-stencil 0.1.0 → 0.1.2

package/dist/esm/{index-BqhmuUH2.js → index-OLdaFN6W.js}

@@ -2,7 +2,7 @@ const NAMESPACE = 'stencil';
 const BUILD = /* stencil */ { hotModuleReplacement: false, hydratedSelectorName: "hydrated", lazyLoad: true, propChangeCallback: true, state: true, updatable: true};
 
 /*
- Stencil Client Platform v4.40.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Platform v4.41.0 | MIT Licensed | https://stenciljs.com
  */
 var __create = Object.create;
 var __defProp = Object.defineProperty;
@@ -348,10 +348,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
           }
           switch(bundleId) {
               
-                case 'kritzel-color_22':
+                case 'kritzel-color_24':
                     return import(
                       /* webpackMode: "lazy" */
-                      './kritzel-color_22.entry.js').then(processMod, consoleError);
+                      './kritzel-color_24.entry.js').then(processMod, consoleError);
                 case 'kritzel-brush-style':
                     return import(
                       /* webpackMode: "lazy" */
@@ -1894,6 +1894,43 @@ function createShadowRoot(cmpMeta) {
     }
   }
 }
+function getHostSlotNodes(childNodes, hostName, slotName) {
+  let i2 = 0;
+  let slottedNodes = [];
+  let childNode;
+  for (; i2 < childNodes.length; i2++) {
+    childNode = childNodes[i2];
+    if (childNode["s-sr"] && (!hostName || childNode["s-hn"] === hostName) && (slotName === void 0 || getSlotName(childNode) === slotName)) {
+      slottedNodes.push(childNode);
+      if (typeof slotName !== "undefined") return slottedNodes;
+    }
+    slottedNodes = [...slottedNodes, ...getHostSlotNodes(childNode.childNodes, hostName, slotName)];
+  }
+  return slottedNodes;
+}
+var getSlotName = (node) => typeof node["s-sn"] === "string" ? node["s-sn"] : node.nodeType === 1 && node.getAttribute("slot") || void 0;
+function dispatchSlotChangeEvent(elm) {
+  elm.dispatchEvent(new CustomEvent("slotchange", { bubbles: false, cancelable: false, composed: false }));
+}
+function findSlotFromSlottedNode(slottedNode, parentHost) {
+  var _a;
+  parentHost = parentHost || ((_a = slottedNode["s-ol"]) == null ? void 0 : _a.parentElement);
+  if (!parentHost) return { slotNode: null, slotName: "" };
+  const slotName = slottedNode["s-sn"] = getSlotName(slottedNode) || "";
+  const childNodes = internalCall(parentHost, "childNodes");
+  const slotNode = getHostSlotNodes(childNodes, parentHost.tagName, slotName)[0];
+  return { slotNode, slotName };
+}
+function internalCall(node, method) {
+  if ("__" + method in node) {
+    const toReturn = node["__" + method];
+    if (typeof toReturn !== "function") return toReturn;
+    return toReturn.bind(node);
+  } else {
+    if (typeof node[method] !== "function") return node[method];
+    return node[method].bind(node);
+  }
+}
 var createTime = (fnName, tagName = "") => {
   {
     return () => {
@@ -2291,6 +2328,7 @@ function sortedAttrNames(attrNames) {
   );
 }
 var hostTagName;
+var useNativeShadowDom = false;
 var isSvgMode = false;
 var createElm = (oldParentVNode, newParentVNode, childIndex) => {
   const newVNode2 = newParentVNode.$children$[childIndex];
@@ -2338,6 +2376,25 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
   elm["s-hn"] = hostTagName;
   return elm;
 };
+var relocateToHostRoot = (parentElm) => {
+  plt.$flags$ |= 1 /* isTmpDisconnected */;
+  const host = parentElm.closest(hostTagName.toLowerCase());
+  if (host != null) {
+    const contentRefNode = Array.from(host.__childNodes || host.childNodes).find(
+      (ref) => ref["s-cr"]
+    );
+    const childNodeArray = Array.from(
+      parentElm.__childNodes || parentElm.childNodes
+    );
+    for (const childNode of contentRefNode ? childNodeArray.reverse() : childNodeArray) {
+      if (childNode["s-sh"] != null) {
+        insertBefore(host, childNode, contentRefNode != null ? contentRefNode : null);
+        childNode["s-sh"] = void 0;
+      }
+    }
+  }
+  plt.$flags$ &= -2 /* isTmpDisconnected */;
+};
 var addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
   let containerElm = parentElm;
   let childNode;
@@ -2477,6 +2534,12 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
       isSvgMode = tag === "svg" ? true : tag === "foreignObject" ? false : isSvgMode;
     }
     {
+      if (tag === "slot" && !useNativeShadowDom) {
+        if (oldVNode.$name$ !== newVNode2.$name$) {
+          newVNode2.$elm$["s-sn"] = newVNode2.$name$ || "";
+          relocateToHostRoot(newVNode2.$elm$.parentElement);
+        }
+      }
       updateElement(oldVNode, newVNode2, isSvgMode);
     }
     if (oldChildren !== null && newChildren !== null) {
@@ -2505,13 +2568,22 @@ var nullifyVNodeRefs = (vNode) => {
     vNode.$children$ && vNode.$children$.map(nullifyVNodeRefs);
   }
 };
-var insertBefore = (parent, newNode, reference) => {
-  {
+var insertBefore = (parent, newNode, reference, isInitialLoad) => {
+  if (typeof newNode["s-sn"] === "string") {
+    parent.insertBefore(newNode, reference);
+    const { slotNode } = findSlotFromSlottedNode(newNode);
+    if (slotNode && true) dispatchSlotChangeEvent(slotNode);
+    return newNode;
+  }
+  if (parent.__insertBefore) {
+    return parent.__insertBefore(newNode, reference);
+  } else {
     return parent == null ? void 0 : parent.insertBefore(newNode, reference);
   }
 };
 var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
   const hostElm = hostRef.$hostElement$;
+  const cmpMeta = hostRef.$cmpMeta$;
   const oldVNode = hostRef.$vnode$ || newVNode(null, null);
   const isHostElement = isHost(renderFnResults);
   const rootVnode = isHostElement ? renderFnResults : h(null, null, renderFnResults);
@@ -2527,6 +2599,7 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
   rootVnode.$flags$ |= 4 /* isHost */;
   hostRef.$vnode$ = rootVnode;
   rootVnode.$elm$ = oldVNode.$elm$ = hostElm.shadowRoot || hostElm ;
+  useNativeShadowDom = !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) && !(cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */);
   patch(oldVNode, rootVnode, isInitialLoad);
 };
 
@@ -2959,7 +3032,9 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
         hostRef.$flags$ |= 128 /* isWatchReady */;
       }
       endNewInstance();
-      fireConnectedCallback(hostRef.$lazyInstance$, elm);
+      {
+        fireConnectedCallback(hostRef.$lazyInstance$, elm);
+      }
     } else {
       Cstr = elm.constructor;
       const cmpTag = elm.localName;
@@ -3108,10 +3183,12 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
       }
       const tagName = transformTag(cmpMeta.$tagName$);
       const HostElement = class extends HTMLElement {
+        ["s-p"];
+        ["s-rc"];
+        hasRegisteredEventListeners = false;
         // StencilLazyHost
         constructor(self) {
           super(self);
-          this.hasRegisteredEventListeners = false;
           self = this;
           registerHost(self, cmpMeta);
           if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {

package/dist/esm/index.js

@@ -1,5 +1,5 @@
-import { w as writeVarUint, a as writeVarUint8Array, t as toUint8Array, r as readVarUint, b as readVarUint8Array, e as encodeStateAsUpdate, c as applyUpdate, d as encodeStateVector, f as createEncoder, g as createDecoder, s as setIfUndefined, h as create, i as fromBase64, v as varStorage, j as toBase64, o as onChange, k as createUint8ArrayFromArrayBuffer, l as offChange, m as readVarString, O as Observable, n as floor, p as getUnixTime, q as equalityDeep, u as writeVarString, x as map, y as ObservableV2, z as length, A as isNode, B as min, C as pow, H as HocuspocusProvider, D as HocuspocusProviderWebsocket } from './default-line-tool.config-CD5sTKH-.js';
-export { W as DEFAULT_BRUSH_CONFIG, Y as DEFAULT_LINE_TOOL_CONFIG, X as DEFAULT_TEXT_CONFIG, S as IndexedDBSyncProvider, V as KritzelAnchorManager, T as KritzelAppStateMap, J as KritzelBrushTool, Q as KritzelCursorHelper, M as KritzelEraserTool, I as KritzelGroup, F as KritzelImage, N as KritzelImageTool, G as KritzelLine, L as KritzelLineTool, E as KritzelPath, R as KritzelSelectionTool, K as KritzelText, P as KritzelTextTool, U as KritzelWorkspace } from './default-line-tool.config-CD5sTKH-.js';
+import { w as writeVarUint, a as writeVarUint8Array, t as toUint8Array, r as readVarUint, b as readVarUint8Array, e as encodeStateAsUpdate, c as applyUpdate, d as encodeStateVector, f as createEncoder, g as createDecoder, s as setIfUndefined, h as create, i as fromBase64, v as varStorage, j as toBase64, o as onChange, k as createUint8ArrayFromArrayBuffer, l as offChange, m as readVarString, O as Observable, n as floor, p as getUnixTime, q as equalityDeep, u as writeVarString, x as map, y as ObservableV2, z as length, A as isNode, B as min, C as pow, H as HocuspocusProvider, D as HocuspocusProviderWebsocket } from './default-line-tool.config-DLpNl6R9.js';
+export { W as DEFAULT_BRUSH_CONFIG, Y as DEFAULT_LINE_TOOL_CONFIG, X as DEFAULT_TEXT_CONFIG, S as IndexedDBSyncProvider, V as KritzelAnchorManager, T as KritzelAppStateMap, J as KritzelBrushTool, Q as KritzelCursorHelper, M as KritzelEraserTool, I as KritzelGroup, F as KritzelImage, N as KritzelImageTool, G as KritzelLine, L as KritzelLineTool, E as KritzelPath, R as KritzelSelectionTool, K as KritzelText, P as KritzelTextTool, U as KritzelWorkspace } from './default-line-tool.config-DLpNl6R9.js';
 
 /**
  * BroadcastChannel sync provider for cross-tab synchronization

package/dist/esm/kritzel-brush-style.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-BqhmuUH2.js';
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-OLdaFN6W.js';
 
 const kritzelBrushStyleCss = () => `:host{display:flex;align-items:flex-start;gap:8px;padding:8px;box-sizing:border-box;width:100%}.brush-style-button{display:flex;justify-content:center;align-items:center;width:42px;height:32px;padding:0;border:none;outline:none;background:none;border-radius:0;color:var(--control-text-color);font-weight:bold;-webkit-tap-highlight-color:transparent}.font-style-button:not(:last-child){border-right:1px solid #333333}.font-style-button:hover{background-color:var(--control-hover-bg)}.font-style-button:active{background-color:var(--control-active-bg)}.font-style-button.selected,.font-style-button.selected:hover,.font-style-button.selected:active{background-color:var(--control-selected-bg);color:var(--control-selected-color)}`;