@rededor/cura 0.5.0 → 0.5.2

package/dist/esm/{index-9af0cdbd.js → index-d99da69e.js}

@@ -30,6 +30,13 @@ const uniqueTime = (key, measureText) => {
         };
     }
 };
+const CONTENT_REF_ID = 'r';
+const ORG_LOCATION_ID = 'o';
+const SLOT_NODE_ID = 's';
+const TEXT_NODE_ID = 't';
+const HYDRATE_ID = 's-id';
+const HYDRATED_STYLE_ID = 'sty-id';
+const HYDRATE_CHILD_ID = 'c-id';
 const HYDRATED_CSS = '{visibility:hidden}.hydrated{visibility:inherit}';
 const XLINK_NS = 'http://www.w3.org/1999/xlink';
 /**
@@ -167,6 +174,211 @@ const Host = {};
  * @returns whether it's a Host node or not
  */
 const isHost = (node) => node && node.$tag$ === Host;
+const initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
+    const endHydrate = createTime('hydrateClient', tagName);
+    const shadowRoot = hostElm.shadowRoot;
+    const childRenderNodes = [];
+    const slotNodes = [];
+    const shadowRootNodes = shadowRoot ? [] : null;
+    const vnode = (hostRef.$vnode$ = newVNode(tagName, null));
+    if (!plt.$orgLocNodes$) {
+        initializeDocumentHydrate(doc.body, (plt.$orgLocNodes$ = new Map()));
+    }
+    hostElm[HYDRATE_ID] = hostId;
+    hostElm.removeAttribute(HYDRATE_ID);
+    clientHydrate(vnode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, hostElm, hostId);
+    childRenderNodes.map((c) => {
+        const orgLocationId = c.$hostId$ + '.' + c.$nodeId$;
+        const orgLocationNode = plt.$orgLocNodes$.get(orgLocationId);
+        const node = c.$elm$;
+        if (orgLocationNode && supportsShadow && orgLocationNode['s-en'] === '') {
+            orgLocationNode.parentNode.insertBefore(node, orgLocationNode.nextSibling);
+        }
+        if (!shadowRoot) {
+            node['s-hn'] = tagName;
+            if (orgLocationNode) {
+                node['s-ol'] = orgLocationNode;
+                node['s-ol']['s-nr'] = node;
+            }
+        }
+        plt.$orgLocNodes$.delete(orgLocationId);
+    });
+    if (shadowRoot) {
+        shadowRootNodes.map((shadowRootNode) => {
+            if (shadowRootNode) {
+                shadowRoot.appendChild(shadowRootNode);
+            }
+        });
+    }
+    endHydrate();
+};
+const clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node, hostId) => {
+    let childNodeType;
+    let childIdSplt;
+    let childVNode;
+    let i;
+    if (node.nodeType === 1 /* NODE_TYPE.ElementNode */) {
+        childNodeType = node.getAttribute(HYDRATE_CHILD_ID);
+        if (childNodeType) {
+            // got the node data from the element's attribute
+            // `${hostId}.${nodeId}.${depth}.${index}`
+            childIdSplt = childNodeType.split('.');
+            if (childIdSplt[0] === hostId || childIdSplt[0] === '0') {
+                childVNode = {
+                    $flags$: 0,
+                    $hostId$: childIdSplt[0],
+                    $nodeId$: childIdSplt[1],
+                    $depth$: childIdSplt[2],
+                    $index$: childIdSplt[3],
+                    $tag$: node.tagName.toLowerCase(),
+                    $elm$: node,
+                    $attrs$: null,
+                    $children$: null,
+                    $key$: null,
+                    $name$: null,
+                    $text$: null,
+                };
+                childRenderNodes.push(childVNode);
+                node.removeAttribute(HYDRATE_CHILD_ID);
+                // this is a new child vnode
+                // so ensure its parent vnode has the vchildren array
+                if (!parentVNode.$children$) {
+                    parentVNode.$children$ = [];
+                }
+                // add our child vnode to a specific index of the vnode's children
+                parentVNode.$children$[childVNode.$index$] = childVNode;
+                // this is now the new parent vnode for all the next child checks
+                parentVNode = childVNode;
+                if (shadowRootNodes && childVNode.$depth$ === '0') {
+                    shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
+                }
+            }
+        }
+        // recursively drill down, end to start so we can remove nodes
+        for (i = node.childNodes.length - 1; i >= 0; i--) {
+            clientHydrate(parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node.childNodes[i], hostId);
+        }
+        if (node.shadowRoot) {
+            // keep drilling down through the shadow root nodes
+            for (i = node.shadowRoot.childNodes.length - 1; i >= 0; i--) {
+                clientHydrate(parentVNode, childRenderNodes, slotNodes, shadowRootNodes, hostElm, node.shadowRoot.childNodes[i], hostId);
+            }
+        }
+    }
+    else if (node.nodeType === 8 /* NODE_TYPE.CommentNode */) {
+        // `${COMMENT_TYPE}.${hostId}.${nodeId}.${depth}.${index}`
+        childIdSplt = node.nodeValue.split('.');
+        if (childIdSplt[1] === hostId || childIdSplt[1] === '0') {
+            // comment node for either the host id or a 0 host id
+            childNodeType = childIdSplt[0];
+            childVNode = {
+                $flags$: 0,
+                $hostId$: childIdSplt[1],
+                $nodeId$: childIdSplt[2],
+                $depth$: childIdSplt[3],
+                $index$: childIdSplt[4],
+                $elm$: node,
+                $attrs$: null,
+                $children$: null,
+                $key$: null,
+                $name$: null,
+                $tag$: null,
+                $text$: null,
+            };
+            if (childNodeType === TEXT_NODE_ID) {
+                childVNode.$elm$ = node.nextSibling;
+                if (childVNode.$elm$ && childVNode.$elm$.nodeType === 3 /* NODE_TYPE.TextNode */) {
+                    childVNode.$text$ = childVNode.$elm$.textContent;
+                    childRenderNodes.push(childVNode);
+                    // remove the text comment since it's no longer needed
+                    node.remove();
+                    if (!parentVNode.$children$) {
+                        parentVNode.$children$ = [];
+                    }
+                    parentVNode.$children$[childVNode.$index$] = childVNode;
+                    if (shadowRootNodes && childVNode.$depth$ === '0') {
+                        shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
+                    }
+                }
+            }
+            else if (childVNode.$hostId$ === hostId) {
+                // this comment node is specifcally for this host id
+                if (childNodeType === SLOT_NODE_ID) {
+                    // `${SLOT_NODE_ID}.${hostId}.${nodeId}.${depth}.${index}.${slotName}`;
+                    childVNode.$tag$ = 'slot';
+                    if (childIdSplt[5]) {
+                        node['s-sn'] = childVNode.$name$ = childIdSplt[5];
+                    }
+                    else {
+                        node['s-sn'] = '';
+                    }
+                    node['s-sr'] = true;
+                    if (shadowRootNodes) {
+                        // browser support shadowRoot and this is a shadow dom component
+                        // create an actual slot element
+                        childVNode.$elm$ = doc.createElement(childVNode.$tag$);
+                        if (childVNode.$name$) {
+                            // add the slot name attribute
+                            childVNode.$elm$.setAttribute('name', childVNode.$name$);
+                        }
+                        // insert the new slot element before the slot comment
+                        node.parentNode.insertBefore(childVNode.$elm$, node);
+                        // remove the slot comment since it's not needed for shadow
+                        node.remove();
+                        if (childVNode.$depth$ === '0') {
+                            shadowRootNodes[childVNode.$index$] = childVNode.$elm$;
+                        }
+                    }
+                    slotNodes.push(childVNode);
+                    if (!parentVNode.$children$) {
+                        parentVNode.$children$ = [];
+                    }
+                    parentVNode.$children$[childVNode.$index$] = childVNode;
+                }
+                else if (childNodeType === CONTENT_REF_ID) {
+                    // `${CONTENT_REF_ID}.${hostId}`;
+                    if (shadowRootNodes) {
+                        // remove the content ref comment since it's not needed for shadow
+                        node.remove();
+                    }
+                    else {
+                        hostElm['s-cr'] = node;
+                        node['s-cn'] = true;
+                    }
+                }
+            }
+        }
+    }
+    else if (parentVNode && parentVNode.$tag$ === 'style') {
+        const vnode = newVNode(null, node.textContent);
+        vnode.$elm$ = node;
+        vnode.$index$ = '0';
+        parentVNode.$children$ = [vnode];
+    }
+};
+const initializeDocumentHydrate = (node, orgLocNodes) => {
+    if (node.nodeType === 1 /* NODE_TYPE.ElementNode */) {
+        let i = 0;
+        for (; i < node.childNodes.length; i++) {
+            initializeDocumentHydrate(node.childNodes[i], orgLocNodes);
+        }
+        if (node.shadowRoot) {
+            for (i = 0; i < node.shadowRoot.childNodes.length; i++) {
+                initializeDocumentHydrate(node.shadowRoot.childNodes[i], orgLocNodes);
+            }
+        }
+    }
+    else if (node.nodeType === 8 /* NODE_TYPE.CommentNode */) {
+        const childIdSplt = node.nodeValue.split('.');
+        if (childIdSplt[0] === ORG_LOCATION_ID) {
+            orgLocNodes.set(childIdSplt[1] + '.' + childIdSplt[2], node);
+            node.nodeValue = '';
+            // useful to know if the original location is
+            // the root light-dom of a shadow dom component
+            node['s-en'] = childIdSplt[3];
+        }
+    }
+};
 /**
  * Parse a new property value for a given property type.
  *
@@ -260,7 +472,12 @@ const addStyle = (styleContainerNode, cmpMeta, mode, hostElm) => {
                 rootAppliedStyles.set(styleContainerNode, (appliedStyles = new Set()));
             }
             if (!appliedStyles.has(scopeId)) {
-                {
+                if (styleContainerNode.host &&
+                    (styleElm = styleContainerNode.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId}"]`))) {
+                    // This is only happening on native shadow-dom, do not needs CSS var shim
+                    styleElm.innerHTML = style;
+                }
+                else {
                     // TODO(STENCIL-659): Remove code implementing the CSS variable shim
                     if (plt.$cssShim$) {
                         // TODO(STENCIL-659): Remove code implementing the CSS variable shim
@@ -319,6 +536,7 @@ const attachStyles = (hostRef) => {
     endAttachStyles();
 };
 const getScopeId = (cmp, mode) => 'sc-' + (cmp.$tagName$);
+const convertScopedToShadow = (css) => css.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g, '$1{');
 /**
  * Production setAccessor() function based on Preact by
  * Jason Miller (@developit)
@@ -1667,7 +1885,18 @@ const connectedCallback = (elm) => {
         if (!(hostRef.$flags$ & 1 /* HOST_FLAGS.hasConnected */)) {
             // first time this component has connected
             hostRef.$flags$ |= 1 /* HOST_FLAGS.hasConnected */;
+            let hostId;
             {
+                hostId = elm.getAttribute(HYDRATE_ID);
+                if (hostId) {
+                    if (supportsShadow && cmpMeta.$flags$ & 1 /* CMP_FLAGS.shadowDomEncapsulation */) {
+                        const scopeId = addStyle(elm.shadowRoot, cmpMeta);
+                        elm.classList.remove(scopeId + '-h', scopeId + '-s');
+                    }
+                    initializeClientHydrate(elm, cmpMeta.$tagName$, hostId, hostRef);
+                }
+            }
+            if (!hostId) {
                 // initUpdate
                 // if the slot polyfill is required we'll need to put some nodes
                 // in here to act as original content anchors as we move nodes around
@@ -1684,7 +1913,10 @@ const connectedCallback = (elm) => {
                 while ((ancestorComponent = ancestorComponent.parentNode || ancestorComponent.host)) {
                     // climb up the ancestors looking for the first
                     // component that hasn't finished its lifecycle update yet
-                    if (ancestorComponent['s-p']) {
+                    if ((ancestorComponent.nodeType === 1 /* NODE_TYPE.ElementNode */ &&
+                        ancestorComponent.hasAttribute('s-id') &&
+                        ancestorComponent['s-p']) ||
+                        ancestorComponent['s-p']) {
                         // we found this components first ancestor component
                         // keep a reference to this component's ancestor component
                         attachToAncestor(hostRef, (hostRef.$ancestorComponent$ = ancestorComponent));
@@ -1750,10 +1982,22 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
     const metaCharset = /*@__PURE__*/ head.querySelector('meta[charset]');
     const visibilityStyle = /*@__PURE__*/ doc.createElement('style');
     const deferredConnectedCallbacks = [];
+    const styles = /*@__PURE__*/ doc.querySelectorAll(`[${HYDRATED_STYLE_ID}]`);
     let appLoadFallback;
     let isBootstrapping = true;
+    let i = 0;
     Object.assign(plt, options);
     plt.$resourcesUrl$ = new URL(options.resourcesUrl || './', doc.baseURI).href;
+    {
+        // If the app is already hydrated there is not point to disable the
+        // async queue. This will improve the first input delay
+        plt.$flags$ |= 2 /* PLATFORM_FLAGS.appLoaded */;
+    }
+    {
+        for (; i < styles.length; i++) {
+            registerStyle(styles[i].getAttribute(HYDRATED_STYLE_ID), convertScopedToShadow(styles[i].innerHTML), true);
+        }
+    }
     lazyBundles.map((lazyBundle) => {
         lazyBundle[1].map((compactMeta) => {
             const cmpMeta = {
@@ -1969,4 +2213,4 @@ const writeTask = /*@__PURE__*/ queueTask(queueDomWrites, true);
 
 export { CSS as C, Host as H, promiseResolve as a, bootstrapLazy as b, getElement as g, h, plt as p, registerInstance as r, setNonce as s, win as w };
 
-//# sourceMappingURL=index-9af0cdbd.js.map
+//# sourceMappingURL=index-d99da69e.js.map