@qwik.dev/core 2.0.0-alpha.4 → 2.0.0-alpha.5

package/dist/core.prod.mjs

@@ -1,6 +1,6 @@
 /**
  * @license
- * @qwik.dev/core 2.0.0-alpha.4-dev+374e0d6
+ * @qwik.dev/core 2.0.0-alpha.5-dev+cb53bbd
  * Copyright QwikDev. 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://github.com/QwikDev/qwik/blob/main/LICENSE
@@ -717,7 +717,7 @@ class StoreHandler {
         return this.$flags$ & StoreFlags.RECURSIVE && "object" == typeof value && null !== value && !Object.isFrozen(value) && !isStore(value) && !Object.isFrozen(target) ? getOrCreateStore(value, this.$flags$, this.$container$) : value;
     }
     set(target, prop, value) {
-        if (target = unwrapDeserializerProxy(target), "symbol" == typeof prop) {
+        if ("symbol" == typeof prop) {
             return target[prop] = value, !0;
         }
         const newValue = this.$flags$ & StoreFlags.RECURSIVE ? unwrapStore(value) : value;
@@ -762,7 +762,8 @@ class StoreHandler {
 function addEffect(target, prop, store, effectSubscriber) {
     const effectsMap = store.$effects$ ||= {};
     const effects = Object.prototype.hasOwnProperty.call(effectsMap, prop) && effectsMap[prop] || (effectsMap[prop] = []);
-    ensureContainsEffect(effects, effectSubscriber), ensureContains(effectSubscriber, target);
+    ensureContainsEffect(effects, effectSubscriber), ensureContains(effectSubscriber, target), 
+    ensureEffectContainsSubscriber(effectSubscriber[EffectSubscriptionsProp.EFFECT], target, store.$container$);
 }
 
 function setNewValueAndTriggerEffects(prop, value, target, currentStore) {
@@ -806,26 +807,35 @@ function clearVNodeEffectDependencies(container, value) {
     const effects = vnode_getProp(value, "q:subs", container.$getObjectById$);
     if (effects) {
         for (let i = effects.length - 1; i >= 0; i--) {
-            clearEffects(effects[i], value) && effects.splice(i, 1);
+            clearEffects(effects[i], value, effects, i, container);
         }
+        0 === effects.length && vnode_setProp(value, "q:subs", null);
     }
 }
 
-function clearSubscriberEffectDependencies(value) {
+function clearSubscriberEffectDependencies(container, value) {
     if (value.$effectDependencies$) {
         for (let i = value.$effectDependencies$.length - 1; i >= 0; i--) {
-            clearEffects(value.$effectDependencies$[i], value) && value.$effectDependencies$.splice(i, 1);
+            clearEffects(value.$effectDependencies$[i], value, value.$effectDependencies$, i, container);
         }
+        0 === value.$effectDependencies$.length && (value.$effectDependencies$ = null);
     }
 }
 
-function clearEffects(subscriber, value) {
-    if (!isSignal(subscriber)) {
-        return !1;
-    }
+function clearEffects(subscriber, value, effectArray, indexToRemove, container) {
+    let subscriptionRemoved = !1;
+    const seenSet = new Set;
+    if (subscriber instanceof WrappedSignal) {
+        subscriptionRemoved = clearSignalEffects(subscriber, value, seenSet);
+    } else if (container.$storeProxyMap$.has(subscriber)) {
+        const store = container.$storeProxyMap$.get(subscriber);
+        subscriptionRemoved = clearStoreEffects(getStoreHandler(store), value);
+    }
+    subscriptionRemoved && effectArray.splice(indexToRemove, 1);
+}
+
+function clearSignalEffects(subscriber, value, seenSet) {
     const effectSubscriptions = subscriber.$effects$;
-    const hostElement = subscriber.$hostElement$;
-    hostElement && hostElement === value && (subscriber.$hostElement$ = null);
     let subscriptionRemoved = !1;
     if (effectSubscriptions) {
         for (let i = effectSubscriptions.length - 1; i >= 0; i--) {
@@ -833,15 +843,55 @@ function clearEffects(subscriber, value) {
             subscriptionRemoved = !0);
         }
     }
-    const args = subscriber.$args$;
-    if (args) {
-        for (let i = args.length - 1; i >= 0; i--) {
-            clearEffects(args[i], subscriber);
+    if (subscriber instanceof WrappedSignal) {
+        const hostElement = subscriber.$hostElement$;
+        hostElement && hostElement === value && (subscriber.$hostElement$ = null);
+        const args = subscriber.$args$;
+        args && clearArgsEffects(args, subscriber, seenSet);
+    }
+    return subscriptionRemoved;
+}
+
+function clearStoreEffects(storeHandler, value) {
+    const effectSubscriptions = storeHandler.$effects$;
+    if (!effectSubscriptions) {
+        return !1;
+    }
+    let subscriptionRemoved = !1;
+    for (const key in effectSubscriptions) {
+        const effects = effectSubscriptions[key];
+        for (let i = effects.length - 1; i >= 0; i--) {
+            effects[i][EffectSubscriptionsProp.EFFECT] === value && (effects.splice(i, 1), subscriptionRemoved = !0);
         }
+        0 === effects.length && delete effectSubscriptions[key];
     }
     return subscriptionRemoved;
 }
 
+function clearArgsEffects(args, subscriber, seenSet) {
+    for (let i = args.length - 1; i >= 0; i--) {
+        clearArgEffect(args[i], subscriber, seenSet);
+    }
+}
+
+function clearArgEffect(arg, subscriber, seenSet) {
+    if (!seenSet.has(arg)) {
+        if (seenSet.add(arg), isSignal(arg)) {
+            clearSignalEffects(arg, subscriber, seenSet);
+        } else if ("object" == typeof arg && null !== arg) {
+            if (isStore(arg)) {
+                clearStoreEffects(getStoreHandler(arg), subscriber);
+            } else {
+                for (const key in arg) {
+                    clearArgEffect(arg[key], subscriber, seenSet);
+                }
+            }
+        } else {
+            Array.isArray(arg) && clearArgsEffects(arg, subscriber, seenSet);
+        }
+    }
+}
+
 const useResourceQrl = (qrl, opts) => {
     const {val, set, i, iCtx} = useSequentialScope();
     if (null != val) {
@@ -861,7 +911,18 @@ function getResourceValueAsPromise(props) {
     if (isResourceReturn(resource)) {
         if (!isServerPlatform()) {
             const state = resource._state;
-            return "pending" === state && props.onPending ? Promise.resolve(props.onPending()) : "rejected" === state && props.onRejected ? Promise.resolve(resource._error).then(props.onRejected) : Promise.resolve(untrack((() => resource._resolved))).then(props.onResolved);
+            if ("pending" === state && props.onPending) {
+                return Promise.resolve().then(useBindInvokeContext(props.onPending));
+            }
+            if ("rejected" === state && props.onRejected) {
+                return Promise.resolve(resource._error).then(useBindInvokeContext(props.onRejected));
+            }
+            {
+                const resolvedValue = untrack((() => resource._resolved));
+                if (void 0 !== resolvedValue) {
+                    return Promise.resolve(resolvedValue).then(useBindInvokeContext(props.onResolved));
+                }
+            }
         }
         return resource.value.then(useBindInvokeContext(props.onResolved), useBindInvokeContext(props.onRejected));
     }
@@ -890,7 +951,7 @@ const runResource = (task, container, host) => {
     task.$flags$ &= ~TaskFlags.DIRTY, cleanupTask(task);
     const iCtx = newInvokeContext(container.$locale$, host, void 0, "qResource");
     iCtx.$container$ = container;
-    const taskFn = task.$qrl$.getFn(iCtx, (() => clearSubscriberEffectDependencies(task)));
+    const taskFn = task.$qrl$.getFn(iCtx, (() => clearSubscriberEffectDependencies(container, task)));
     const resource = task.$state$;
     assertDefined(resource, 'useResource: when running a resource, "task.resource" must be a defined.', task);
     const cleanups = [];
@@ -1299,6 +1360,14 @@ function escapeHTML(html) {
     return 0 === lastIdx ? html : escapedHTML + html.substring(lastIdx);
 }
 
+function getFileLocationFromJsx(jsxDev) {
+    if (!jsxDev) {
+        return null;
+    }
+    const sanitizedFileName = jsxDev.fileName?.replace(/\\/g, "/");
+    return sanitizedFileName ? `${sanitizedFileName}:${jsxDev.lineNumber}:${jsxDev.columnNumber}` : null;
+}
+
 const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
     let journal = container.$journal$;
     const stack = [];
@@ -1459,7 +1528,7 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
             advanceToNextSibling(), vnode_remove(journal, vParent, toRemove, !0);
         }
     }
-    function createNewElement(jsx, elementName) {
+    function createNewElement(jsx, elementName, currentFile) {
         const element = function(elementName) {
             const domParentVNode = vnode_getDomParentVNode(vParent);
             const {elementNamespace, elementNamespaceFlag} = getNewElementNamespaceData(domParentVNode, elementName);
@@ -1487,6 +1556,7 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                             value(element);
                             continue;
                         }
+                        throw qError(QError.invalidRefValue, [ currentFile ]);
                     }
                     if (isSignal(value)) {
                         const signalData = new EffectPropData({
@@ -1499,13 +1569,13 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                         if ("textarea" !== elementName || "value" !== key) {
                             value = serializeAttribute(key, value, scopedStyleIdPrefix), null != value && element.setAttribute(key, String(value));
                         } else {
-                            if ("string" != typeof value) {
+                            if (value && "string" != typeof value) {
                                 if (isDev) {
-                                    throw qError(QError.wrongTextareaValue);
+                                    throw qError(QError.wrongTextareaValue, [ currentFile, value ]);
                                 }
                                 continue;
                             }
-                            element.value = escapeHTML(value);
+                            element.value = escapeHTML(value || "");
                         }
                     } else {
                         element.innerHTML = value, element.setAttribute("q:container", QContainerValue.HTML);
@@ -1522,17 +1592,19 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
         const isSameElementName = vCurrent && vnode_isElementVNode(vCurrent) && elementName === vnode_getElementName(vCurrent);
         const jsxKey = jsx.key;
         let needsQDispatchEventPatch = !1;
+        const currentFile = getFileLocationFromJsx(jsx.dev);
         isSameElementName && jsxKey === getKey(vCurrent) || (vNewNode = retrieveChildWithKey(elementName, jsxKey), 
-        null === vNewNode ? needsQDispatchEventPatch = createNewElement(jsx, elementName) : vnode_insertBefore(journal, vParent, vNewNode, vCurrent));
+        null === vNewNode ? needsQDispatchEventPatch = createNewElement(jsx, elementName) : (vnode_insertBefore(journal, vParent, vNewNode, vCurrent), 
+        vCurrent = vNewNode, vNewNode = null, null !== vSiblings && (vSiblingsIdx -= SiblingsArray.Size)));
         const jsxAttrs = [];
         const props = jsx.varProps;
         for (const key in props) {
-            let value = props[key];
-            value = serializeAttribute(key, value, scopedStyleIdPrefix), null != value && mapArray_set(jsxAttrs, key, value, 0);
+            const value = props[key];
+            null != value && mapArray_set(jsxAttrs, key, value, 0);
         }
         null !== jsxKey && mapArray_set(jsxAttrs, "q:key", jsxKey, 0);
         const vNode = vNewNode || vCurrent;
-        if (needsQDispatchEventPatch = function(vnode, srcAttrs) {
+        if (needsQDispatchEventPatch = function(vnode, srcAttrs, currentFile) {
             vnode_ensureElementInflated(vnode);
             const dstAttrs = vnode;
             let srcIdx = 0;
@@ -1554,8 +1626,16 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                         if ("function" == typeof value) {
                             return void value(element);
                         }
+                        throw qError(QError.invalidRefValue, [ currentFile ]);
+                    }
+                    if (isSignal(value)) {
+                        const signalData = new EffectPropData({
+                            $scopedStyleIdPrefix$: scopedStyleIdPrefix,
+                            $isConst$: !1
+                        });
+                        value = trackSignalAndAssignHost(value, vnode, key, container, signalData);
                     }
-                    isSignal(value) && (value = untrack((() => value.value))), vnode_setAttr(journal, vnode, key, value), 
+                    vnode_setAttr(journal, vnode, key, serializeAttribute(key, value, scopedStyleIdPrefix)), 
                     null === value && (dstLength = dstAttrs.length);
                 }
             };
@@ -1576,7 +1656,7 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                     dstIdx--), dstKey = dstIdx < dstLength ? dstAttrs[dstIdx++] : null;
                 } else if (null == dstKey) {
                     isJsxPropertyAnEventName(srcKey) ? (patchEventDispatch = !0, recordJsxEvent(srcKey, srcAttrs[srcIdx])) : record(srcKey, srcAttrs[srcIdx]), 
-                    srcIdx++, srcKey = srcIdx < srcLength ? srcAttrs[srcIdx++] : null;
+                    srcIdx++, srcKey = srcIdx < srcLength ? srcAttrs[srcIdx++] : null, dstIdx++, dstKey = dstIdx < dstLength ? dstAttrs[dstIdx++] : null;
                 } else if (srcKey == dstKey) {
                     const srcValue = srcAttrs[srcIdx++];
                     srcValue !== dstAttrs[dstIdx++] && record(dstKey, srcValue), srcKey = srcIdx < srcLength ? srcAttrs[srcIdx++] : null, 
@@ -1589,7 +1669,7 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
                 }
             }
             return patchEventDispatch;
-        }(vNode, jsxAttrs) || needsQDispatchEventPatch, needsQDispatchEventPatch) {
+        }(vNode, jsxAttrs, currentFile) || needsQDispatchEventPatch, needsQDispatchEventPatch) {
             const element = vnode_getNode(vNode);
             element.qDispatchEvent || (element.qDispatchEvent = (event, scope) => {
                 const eventName = event.type;
@@ -1633,7 +1713,7 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
     function expectVirtual(type, jsxKey) {
         vCurrent && vnode_isVirtualVNode(vCurrent) && getKey(vCurrent) === jsxKey || (null === jsxKey || (vNewNode = retrieveChildWithKey(null, jsxKey), 
         null == vNewNode) ? (vnode_insertBefore(journal, vParent, vNewNode = vnode_newVirtual(), vCurrent && getInsertBefore()), 
-        vnode_setProp(vNewNode, "q:key", jsxKey), isDev && vnode_setProp(vNewNode || vCurrent, "q:type", type)) : vnode_insertBefore(journal, vParent, vNewNode = vnode_newVirtual(), vCurrent && getInsertBefore()));
+        vnode_setProp(vNewNode, "q:key", jsxKey), isDev && vnode_setProp(vNewNode || vCurrent, "q:type", type)) : vnode_insertBefore(journal, vParent, vNewNode, vCurrent && getInsertBefore()));
     }
     function expectComponent(component) {
         const componentMeta = component[SERIALIZABLE_STATE];
@@ -1775,7 +1855,7 @@ function cleanup(container, vNode) {
                         const obj = seq[i];
                         if (isTask(obj)) {
                             const task = obj;
-                            clearSubscriberEffectDependencies(task), task.$flags$ & TaskFlags.VISIBLE_TASK ? container.$scheduler$(ChoreType.CLEANUP_VISIBLE, task) : cleanupTask(task);
+                            clearSubscriberEffectDependencies(container, task), task.$flags$ & TaskFlags.VISIBLE_TASK ? container.$scheduler$(ChoreType.CLEANUP_VISIBLE, task) : cleanupTask(task);
                         }
                     }
                 }
@@ -1906,12 +1986,12 @@ const createScheduler = (container, scheduleDrain, journalFlush) => {
             $returnValue$: null,
             $executed$: !1
         };
-        chore.$promise$ = new Promise((resolve => chore.$resolve$ = resolve)), chore = sortedInsert(choreQueue, chore), 
+        chore.$promise$ = new Promise((resolve => chore.$resolve$ = resolve)), chore = sortedInsert(choreQueue, chore, container.rootVNode || null), 
         !journalFlushScheduled && runLater && (journalFlushScheduled = !0, schedule(ChoreType.JOURNAL_FLUSH), 
         scheduleDrain());
-        return runLater ? chore.$promise$ : drainUpTo(chore);
+        return runLater ? chore.$promise$ : drainUpTo(chore, container.rootVNode || null);
     };
-    function drainUpTo(runUptoChore) {
+    function drainUpTo(runUptoChore, rootVNode) {
         if (runUptoChore.$executed$) {
             return runUptoChore.$returnValue$;
         }
@@ -1920,7 +2000,7 @@ const createScheduler = (container, scheduleDrain, journalFlush) => {
         }
         for (;choreQueue.length; ) {
             const nextChore = choreQueue.shift();
-            const order = choreComparator(nextChore, runUptoChore, !1);
+            const order = choreComparator(nextChore, runUptoChore, rootVNode, !1);
             if (null === order) {
                 continue;
             }
@@ -1932,7 +2012,7 @@ const createScheduler = (container, scheduleDrain, journalFlush) => {
             }
             const returnValue = executeChore(nextChore);
             if (isPromise(returnValue)) {
-                return returnValue.then((() => drainUpTo(runUptoChore)));
+                return returnValue.then((() => drainUpTo(runUptoChore, rootVNode)));
             }
         }
         return runUptoChore.$returnValue$;
@@ -2028,7 +2108,7 @@ function vNodeAlreadyDeleted(chore) {
     return !!(chore.$host$ && vnode_isVNode(chore.$host$) && chore.$host$[VNodeProps.flags] & VNodeFlags.Deleted);
 }
 
-function choreComparator(a, b, shouldThrowOnHostMismatch) {
+function choreComparator(a, b, rootVNode, shouldThrowOnHostMismatch) {
     const macroTypeDiff = (a.$type$ & ChoreType.MACRO) - (b.$type$ & ChoreType.MACRO);
     if (0 !== macroTypeDiff) {
         return macroTypeDiff;
@@ -2045,7 +2125,7 @@ function choreComparator(a, b, shouldThrowOnHostMismatch) {
                 return logWarn(errorMessage), null;
             }
             {
-                const hostDiff = vnode_documentPosition(aHost, bHost);
+                const hostDiff = vnode_documentPosition(aHost, bHost, rootVNode);
                 if (0 !== hostDiff) {
                     return hostDiff;
                 }
@@ -2066,12 +2146,12 @@ function choreComparator(a, b, shouldThrowOnHostMismatch) {
     return 0;
 }
 
-function sortedFindIndex(sortedArray, value) {
+function sortedFindIndex(sortedArray, value, rootVNode) {
     let bottom = 0;
     let top = sortedArray.length;
     for (;bottom < top; ) {
         const middle = bottom + (top - bottom >> 1);
-        const comp = choreComparator(value, sortedArray[middle], !0);
+        const comp = choreComparator(value, sortedArray[middle], rootVNode, !0);
         if (comp < 0) {
             top = middle;
         } else {
@@ -2084,8 +2164,8 @@ function sortedFindIndex(sortedArray, value) {
     return ~bottom;
 }
 
-function sortedInsert(sortedArray, value) {
-    const idx = sortedFindIndex(sortedArray, value);
+function sortedInsert(sortedArray, value, rootVNode) {
+    const idx = sortedFindIndex(sortedArray, value, rootVNode);
     if (idx < 0) {
         return sortedArray.splice(~idx, 0, value), value;
     }
@@ -2135,7 +2215,7 @@ const runTask = (task, container, host) => {
     task.$flags$ &= ~TaskFlags.DIRTY, cleanupTask(task);
     const iCtx = newInvokeContext(container.$locale$, host, void 0, "qTask");
     iCtx.$container$ = container;
-    const taskFn = task.$qrl$.getFn(iCtx, (() => clearSubscriberEffectDependencies(task)));
+    const taskFn = task.$qrl$.getFn(iCtx, (() => clearSubscriberEffectDependencies(container, task)));
     const handleError = reason => container.handleError(reason, host);
     let cleanupFns = null;
     const cleanup = fn => {
@@ -2552,7 +2632,7 @@ function processJSXNode(ssr, enqueue, value, options) {
             if ("string" == typeof type) {
                 appendClassIfScopedStyleExists(jsx, options.styleScoped);
                 let qwikInspectorAttrValue = null;
-                isDev && jsx.dev && "head" !== jsx.type && (qwikInspectorAttrValue = getQwikInspectorAttributeValue(jsx.dev));
+                isDev && jsx.dev && "head" !== jsx.type && (qwikInspectorAttrValue = getFileLocationFromJsx(jsx.dev));
                 const innerHTML = ssr.openElement(type, varPropsToSsrAttrs(jsx.varProps, jsx.constProps, ssr.serializationCtx, options.styleScoped, jsx.key), constPropsToSsrAttrs(jsx.constProps, jsx.varProps, ssr.serializationCtx, options.styleScoped), qwikInspectorAttrValue);
                 innerHTML && ssr.htmlNode(innerHTML), enqueue(ssr.closeElement), "head" === type ? (enqueue(ssr.additionalHeadNodes), 
                 enqueue(ssr.emitQwikLoaderAtTopIfNeeded)) : "body" === type && enqueue(ssr.additionalBodyNodes);
@@ -2716,11 +2796,6 @@ function getSlotName(host, jsx, ssr) {
     return directGetPropsProxyProp(jsx, "name") || "";
 }
 
-function getQwikInspectorAttributeValue(jsxDev) {
-    const sanitizedFileName = jsxDev.fileName?.replace(/\\/g, "/");
-    return sanitizedFileName ? `${sanitizedFileName}:${jsxDev.lineNumber}:${jsxDev.columnNumber}` : null;
-}
-
 function appendQwikInspectorAttribute(jsx, qwikInspectorAttrValue) {
     !qwikInspectorAttrValue || jsx.constProps && qwikInspectorAttr in jsx.constProps || ((jsx.constProps ||= {})[qwikInspectorAttr] = qwikInspectorAttrValue);
 }
@@ -2730,7 +2805,7 @@ function appendClassIfScopedStyleExists(jsx, styleScoped) {
     jsx.constProps.class = "");
 }
 
-const version = "2.0.0-alpha.4-dev+374e0d6";
+const version = "2.0.0-alpha.5-dev+cb53bbd";
 
 class _SharedContainer {
     $version$;
@@ -3827,7 +3902,7 @@ const vnode_getParent = vnode => vnode[VNodeProps.parent] || null;
 const vnode_getNode = vnode => null === vnode || vnode_isVirtualVNode(vnode) ? null : vnode_isElementVNode(vnode) ? vnode[ElementVNodeProps.element] : (assertTrue(vnode_isTextVNode(vnode), "Expecting Text Node."), 
 vnode[TextVNodeProps.node]);
 
-function vnode_toString(depth = 10, offset = "", materialize = !1, siblings = !1) {
+function vnode_toString(depth = 20, offset = "", materialize = !1, siblings = !1) {
     let vnode = this;
     if (0 === depth) {
         return "...";
@@ -3993,17 +4068,17 @@ const aPath = [];
 
 const bPath = [];
 
-const vnode_documentPosition = (a, b) => {
+const vnode_documentPosition = (a, b, rootVNode) => {
     if (a === b) {
         return 0;
     }
     let aDepth = -1;
     let bDepth = -1;
     for (;a; ) {
-        a = (aPath[++aDepth] = a)[VNodeProps.parent];
+        a = (aPath[++aDepth] = a)[VNodeProps.parent] || rootVNode && vnode_getProp(a, ":", (id => vnode_locate(rootVNode, id)));
     }
     for (;b; ) {
-        b = (bPath[++bDepth] = b)[VNodeProps.parent];
+        b = (bPath[++bDepth] = b)[VNodeProps.parent] || rootVNode && vnode_getProp(b, ":", (id => vnode_locate(rootVNode, id)));
     }
     for (;aDepth >= 0 && bDepth >= 0; ) {
         if ((a = aPath[aDepth]) !== (b = bPath[bDepth])) {
@@ -4019,7 +4094,7 @@ const vnode_documentPosition = (a, b) => {
                     return -1;
                 }
             } while (cursor);
-            return 1;
+            return rootVNode && vnode_getProp(b, ":", (id => vnode_locate(rootVNode, id))) ? -1 : 1;
         }
         aDepth--, bDepth--;
     }
@@ -4030,8 +4105,7 @@ const vnode_getProjectionParentComponent = (vHost, rootVNode) => {
     let projectionDepth = 1;
     for (;projectionDepth--; ) {
         for (;vHost && (!vnode_isVirtualVNode(vHost) || null === vnode_getProp(vHost, "q:renderFn", null)); ) {
-            const qSlotParentProp = vnode_getProp(vHost, ":", null);
-            const qSlotParent = qSlotParentProp && ("string" == typeof qSlotParentProp ? vnode_locate(rootVNode, qSlotParentProp) : qSlotParentProp);
+            const qSlotParent = vnode_getProp(vHost, ":", (id => vnode_locate(rootVNode, id)));
             const vProjectionParent = vnode_isVirtualVNode(vHost) && qSlotParent;
             vProjectionParent && projectionDepth++, vHost = vProjectionParent || vnode_getParent(vHost);
         }
@@ -4497,13 +4571,10 @@ class DomContainer extends _SharedContainer {
                 if (null !== vnode_getProp(vNode, "q:renderFn", null)) {
                     return vNode;
                 }
-                const parent = vnode_getProp(vNode, ":", this.$vnodeLocate$);
-                if (parent) {
-                    vNode = parent;
-                    continue;
-                }
+                vNode = vnode_getParent(vNode) || vnode_getProp(vNode, ":", this.$vnodeLocate$);
+            } else {
+                vNode = vnode_getParent(vNode);
             }
-            vNode = vnode_getParent(vNode);
         }
         return null;
     }
@@ -4581,11 +4652,6 @@ class DomContainer extends _SharedContainer {
 
 const deserializedProxyMap = new WeakMap;
 
-const unwrapDeserializerProxy = value => {
-    const unwrapped = "object" == typeof value && null !== value && value[SERIALIZER_PROXY_UNWRAP];
-    return unwrapped || value;
-};
-
 const isDeserializerProxy = value => "object" == typeof value && null !== value && SERIALIZER_PROXY_UNWRAP in value;
 
 const SERIALIZER_PROXY_UNWRAP = Symbol("UNWRAP");
@@ -4624,9 +4690,10 @@ class DeserializationHandler {
             return value;
         }
         const container = this.$container$;
-        const propValue = allocate(container, typeId, value);
-        return Reflect.set(target, property, propValue), this.$data$[idx] = void 0, this.$data$[idx + 1] = propValue, 
-        typeId >= TypeIds.Error && inflate(container, propValue, typeId, value), propValue;
+        let propValue = allocate(container, typeId, value);
+        return typeId >= TypeIds.Error && (propValue = inflate(container, propValue, typeId, value)), 
+        Reflect.set(target, property, propValue), this.$data$[idx] = void 0, this.$data$[idx + 1] = propValue, 
+        propValue;
     }
     has(target, property) {
         return property === SERIALIZER_PROXY_UNWRAP || Object.prototype.hasOwnProperty.call(target, property);
@@ -4656,181 +4723,184 @@ const _eagerDeserializeArray = (container, data) => {
 const resolvers = new WeakMap;
 
 const inflate = (container, target, typeId, data) => {
-    if (void 0 !== typeId) {
-        switch (typeId !== TypeIds.Object && Array.isArray(data) && (data = _eagerDeserializeArray(container, data)), 
-        typeId) {
-          case TypeIds.Object:
-            for (let i = 0; i < data.length; i += 4) {
-                const key = deserializeData(container, data[i], data[i + 1]);
-                const valType = data[i + 2];
-                const valData = data[i + 3];
-                valType === TypeIds.RootRef || valType >= TypeIds.Error ? Object.defineProperty(target, key, {
-                    get() {
-                        const value = deserializeData(container, valType, valData);
-                        return target[key] = value, value;
-                    },
-                    set(value) {
-                        Object.defineProperty(target, key, {
-                            value,
-                            writable: !0,
-                            enumerable: !0,
-                            configurable: !0
-                        });
-                    },
-                    enumerable: !0,
-                    configurable: !0
-                }) : target[key] = deserializeData(container, valType, valData);
-            }
-            break;
-
-          case TypeIds.QRL:
-            inflateQRL(container, target);
-            break;
+    if (void 0 === typeId) {
+        return target;
+    }
+    switch (typeId !== TypeIds.Object && Array.isArray(data) && (data = _eagerDeserializeArray(container, data)), 
+    typeId) {
+      case TypeIds.Object:
+        for (let i = 0; i < data.length; i += 4) {
+            const key = deserializeData(container, data[i], data[i + 1]);
+            const valType = data[i + 2];
+            const valData = data[i + 3];
+            valType === TypeIds.RootRef || valType >= TypeIds.Error ? Object.defineProperty(target, key, {
+                get() {
+                    const value = deserializeData(container, valType, valData);
+                    return target[key] = value, value;
+                },
+                set(value) {
+                    Object.defineProperty(target, key, {
+                        value,
+                        writable: !0,
+                        enumerable: !0,
+                        configurable: !0
+                    });
+                },
+                enumerable: !0,
+                configurable: !0
+            }) : target[key] = deserializeData(container, valType, valData);
+        }
+        break;
 
-          case TypeIds.Task:
-            const task = target;
-            const v = data;
-            task.$qrl$ = inflateQRL(container, v[0]), task.$flags$ = v[1], task.$index$ = v[2], 
-            task.$el$ = v[3], task.$effectDependencies$ = v[4], task.$state$ = v[5];
-            break;
+      case TypeIds.QRL:
+        inflateQRL(container, target);
+        break;
 
-          case TypeIds.Resource:
-            const [resolved, result, effects] = data;
-            const resource = target;
-            resolved ? (resource.value = Promise.resolve(result), resource._resolved = result, 
-            resource._state = "resolved") : (resource.value = Promise.reject(result), resource._error = result, 
-            resource._state = "rejected"), getStoreHandler(target).$effects$ = effects;
-            break;
+      case TypeIds.Task:
+        const task = target;
+        const v = data;
+        task.$qrl$ = inflateQRL(container, v[0]), task.$flags$ = v[1], task.$index$ = v[2], 
+        task.$el$ = v[3], task.$effectDependencies$ = v[4], task.$state$ = v[5];
+        break;
 
-          case TypeIds.Component:
-            target[SERIALIZABLE_STATE][0] = data[0];
-            break;
+      case TypeIds.Resource:
+        const [resolved, result, effects] = data;
+        const resource = target;
+        resolved ? (resource.value = Promise.resolve(result), resource._resolved = result, 
+        resource._state = "resolved") : (resource.value = Promise.reject(result), resource._error = result, 
+        resource._state = "rejected"), getStoreHandler(target).$effects$ = effects;
+        break;
 
-          case TypeIds.Store:
-          case TypeIds.StoreArray:
-            {
-                const [value, flags, effects, storeEffect] = data;
-                const handler = getStoreHandler(target);
-                handler.$flags$ = flags, Object.assign(getStoreTarget(target), value), storeEffect && (effects[STORE_ARRAY_PROP] = storeEffect), 
-                handler.$effects$ = effects, container.$storeProxyMap$.set(value, target);
-                break;
-            }
+      case TypeIds.Component:
+        target[SERIALIZABLE_STATE][0] = data[0];
+        break;
 
-          case TypeIds.Signal:
-            {
-                const signal = target;
-                const d = data;
-                signal.$untrackedValue$ = d[0], signal.$effects$ = d.slice(1);
-                break;
-            }
+      case TypeIds.Store:
+      case TypeIds.StoreArray:
+        {
+            const [value, flags, effects, storeEffect] = data;
+            const store = getOrCreateStore(value, flags, container);
+            const storeHandler = getStoreHandler(store);
+            storeEffect && (effects[STORE_ARRAY_PROP] = storeEffect), storeHandler.$effects$ = effects, 
+            target = store;
+            break;
+        }
 
-          case TypeIds.WrappedSignal:
-            {
-                const signal = target;
-                const d = data;
-                signal.$func$ = container.getSyncFn(d[0]), signal.$args$ = d[1], signal.$effectDependencies$ = d[2], 
-                signal.$untrackedValue$ = d[3], signal.$hostElement$ = d[4], signal.$effects$ = d.slice(5);
-                break;
-            }
+      case TypeIds.Signal:
+        {
+            const signal = target;
+            const d = data;
+            signal.$untrackedValue$ = d[0], signal.$effects$ = d.slice(1);
+            break;
+        }
 
-          case TypeIds.ComputedSignal:
-            {
-                const computed = target;
-                const d = data;
-                computed.$computeQrl$ = d[0], computed.$effects$ = d[1], 3 === d.length ? computed.$untrackedValue$ = d[2] : (computed.$invalid$ = !0, 
-                computed.$computeQrl$.resolve(), container.$scheduler$?.(ChoreType.QRL_RESOLVE, null, computed.$computeQrl$));
-                break;
-            }
+      case TypeIds.WrappedSignal:
+        {
+            const signal = target;
+            const d = data;
+            signal.$func$ = container.getSyncFn(d[0]), signal.$args$ = d[1], signal.$effectDependencies$ = d[2], 
+            signal.$untrackedValue$ = d[3], signal.$hostElement$ = d[4], signal.$effects$ = d.slice(5);
+            break;
+        }
 
-          case TypeIds.Error:
-            {
-                const d = data;
-                target.message = d[0];
-                const second = d[1];
-                if (second && Array.isArray(second)) {
-                    for (let i = 0; i < second.length; i++) {
-                        target[second[i++]] = d[i];
-                    }
-                    target.stack = d[2];
-                } else {
-                    target.stack = second;
-                }
-                break;
-            }
+      case TypeIds.ComputedSignal:
+        {
+            const computed = target;
+            const d = data;
+            computed.$computeQrl$ = d[0], computed.$effects$ = d[1], 3 === d.length ? computed.$untrackedValue$ = d[2] : (computed.$invalid$ = !0, 
+            computed.$computeQrl$.resolve(), container.$scheduler$?.(ChoreType.QRL_RESOLVE, null, computed.$computeQrl$));
+            break;
+        }
 
-          case TypeIds.FormData:
-            {
-                const formData = target;
-                const d = data;
-                for (let i = 0; i < d.length; i++) {
-                    formData.append(d[i++], d[i]);
+      case TypeIds.Error:
+        {
+            const d = data;
+            target.message = d[0];
+            const second = d[1];
+            if (second && Array.isArray(second)) {
+                for (let i = 0; i < second.length; i++) {
+                    target[second[i++]] = d[i];
                 }
-                break;
-            }
-
-          case TypeIds.JSXNode:
-            {
-                const jsx = target;
-                const [type, varProps, constProps, children, flags, key] = data;
-                jsx.type = type, jsx.varProps = varProps, jsx.constProps = constProps, jsx.children = children, 
-                jsx.flags = flags, jsx.key = key;
-                break;
+                target.stack = d[2];
+            } else {
+                target.stack = second;
             }
+            break;
+        }
 
-          case TypeIds.Set:
-            {
-                const set = target;
-                const d = data;
-                for (let i = 0; i < d.length; i++) {
-                    set.add(d[i]);
-                }
-                break;
+      case TypeIds.FormData:
+        {
+            const formData = target;
+            const d = data;
+            for (let i = 0; i < d.length; i++) {
+                formData.append(d[i++], d[i]);
             }
+            break;
+        }
 
-          case TypeIds.Map:
-            {
-                const map = target;
-                const d = data;
-                for (let i = 0; i < d.length; i++) {
-                    map.set(d[i++], d[i]);
-                }
-                break;
-            }
+      case TypeIds.JSXNode:
+        {
+            const jsx = target;
+            const [type, varProps, constProps, children, flags, key] = data;
+            jsx.type = type, jsx.varProps = varProps, jsx.constProps = constProps, jsx.children = children, 
+            jsx.flags = flags, jsx.key = key;
+            break;
+        }
 
-          case TypeIds.Promise:
-            {
-                const promise = target;
-                const [resolved, result] = data;
-                const [resolve, reject] = resolvers.get(promise);
-                resolved ? resolve(result) : reject(result);
-                break;
+      case TypeIds.Set:
+        {
+            const set = target;
+            const d = data;
+            for (let i = 0; i < d.length; i++) {
+                set.add(d[i]);
             }
+            break;
+        }
 
-          case TypeIds.Uint8Array:
-            const bytes = target;
-            const buf = atob(data);
-            let i = 0;
-            for (const s of buf) {
-                bytes[i++] = s.charCodeAt(0);
+      case TypeIds.Map:
+        {
+            const map = target;
+            const d = data;
+            for (let i = 0; i < d.length; i++) {
+                map.set(d[i++], d[i]);
             }
             break;
+        }
 
-          case TypeIds.PropsProxy:
-            const propsProxy = target;
-            propsProxy[_VAR_PROPS] = 0 === data ? {} : data[0], propsProxy[_CONST_PROPS] = data[1];
+      case TypeIds.Promise:
+        {
+            const promise = target;
+            const [resolved, result] = data;
+            const [resolve, reject] = resolvers.get(promise);
+            resolved ? resolve(result) : reject(result);
             break;
+        }
 
-          case TypeIds.EffectData:
-            {
-                const effectData = target;
-                effectData.data.$scopedStyleIdPrefix$ = data[0], effectData.data.$isConst$ = data[1];
-                break;
-            }
+      case TypeIds.Uint8Array:
+        const bytes = target;
+        const buf = atob(data);
+        let i = 0;
+        for (const s of buf) {
+            bytes[i++] = s.charCodeAt(0);
+        }
+        break;
+
+      case TypeIds.PropsProxy:
+        const propsProxy = target;
+        propsProxy[_VAR_PROPS] = 0 === data ? {} : data[0], propsProxy[_CONST_PROPS] = data[1];
+        break;
 
-          default:
-            throw qError(QError.serializeErrorNotImplemented, [ typeId ]);
+      case TypeIds.EffectData:
+        {
+            const effectData = target;
+            effectData.data.$scopedStyleIdPrefix$ = data[0], effectData.data.$isConst$ = data[1];
+            break;
         }
+
+      default:
+        throw qError(QError.serializeErrorNotImplemented, [ typeId ]);
     }
+    return target;
 };
 
 const _constants = [ void 0, null, !0, !1, "", EMPTY_ARRAY, EMPTY_OBJ, NEEDS_COMPUTATION, Slot, Fragment, NaN, 1 / 0, -1 / 0, Number.MAX_SAFE_INTEGER, Number.MAX_SAFE_INTEGER - 1, Number.MIN_SAFE_INTEGER ];
@@ -4893,10 +4963,8 @@ const allocate = (container, typeId, value) => {
         return new ComputedSignal(container, null);
 
       case TypeIds.Store:
-        return createStore(container, {}, 0);
-
       case TypeIds.StoreArray:
-        return createStore(container, [], 0);
+        return null;
 
       case TypeIds.URLSearchParams:
         return new URLSearchParams(value);
@@ -5424,13 +5492,13 @@ function _deserialize(rawStateData, element) {
     return output;
 }
 
-function deserializeData(container, typeId, propValue) {
+function deserializeData(container, typeId, value) {
     if (void 0 === typeId) {
-        return propValue;
+        return value;
     }
-    const value = allocate(container, typeId, propValue);
-    return typeId >= TypeIds.Error && inflate(container, value, typeId, propValue), 
-    value;
+    let propValue = allocate(container, typeId, value);
+    return typeId >= TypeIds.Error && (propValue = inflate(container, propValue, typeId, value)), 
+    propValue;
 }
 
 function getObjectById(id, stateData) {