@qwik.dev/core 2.0.0-alpha.7 → 2.0.0-alpha.8

package/dist/core.prod.mjs

@@ -1,6 +1,6 @@
 /**
  * @license
- * @qwik.dev/core 2.0.0-alpha.7-dev+a26598a
+ * @qwik.dev/core 2.0.0-alpha.8-dev+66037b5
  * 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
@@ -168,9 +168,7 @@ const ComponentStylesPrefixContent = "⚡️";
 
 const QSlot = "q:slot";
 
-const QSlotParent = ":";
-
-const QSlotRef = "q:sref";
+const QSlotParent = "q:sparent";
 
 const QSlotS = "q:s";
 
@@ -716,7 +714,7 @@ const STORE_TARGET = Symbol("store.target");
 
 const STORE_HANDLER = Symbol("store.handler");
 
-const STORE_ARRAY_PROP = Symbol("store.array");
+const STORE_ALL_PROPS = Symbol("store.all");
 
 var StoreFlags;
 
@@ -772,7 +770,7 @@ class StoreHandler {
                 assertTrue(!ctx.$container$ || ctx.$container$ === this.$container$, "Do not use signals across containers");
             }
             const effectSubscriber = ctx.$effectSubscriber$;
-            effectSubscriber && addEffect(target, Array.isArray(target) ? STORE_ARRAY_PROP : prop, this, effectSubscriber);
+            effectSubscriber && addStoreEffect(target, Array.isArray(target) ? STORE_ALL_PROPS : prop, this, effectSubscriber);
         }
         if ("toString" === prop && value === Object.prototype.toString) {
             return this.toString;
@@ -803,7 +801,7 @@ class StoreHandler {
             const ctx = tryGetInvokeContext();
             if (ctx) {
                 const effectSubscriber = ctx.$effectSubscriber$;
-                effectSubscriber && addEffect(target, Array.isArray(target) ? STORE_ARRAY_PROP : prop, this, effectSubscriber);
+                effectSubscriber && addStoreEffect(target, Array.isArray(target) ? STORE_ALL_PROPS : prop, this, effectSubscriber);
             }
         }
         return Object.prototype.hasOwnProperty.call(target, prop);
@@ -811,7 +809,7 @@ class StoreHandler {
     ownKeys(target) {
         const ctx = tryGetInvokeContext();
         const effectSubscriber = ctx?.$effectSubscriber$;
-        return effectSubscriber && addEffect(target, STORE_ARRAY_PROP, this, effectSubscriber), 
+        return effectSubscriber && addStoreEffect(target, STORE_ALL_PROPS, this, effectSubscriber), 
         Reflect.ownKeys(target);
     }
     getOwnPropertyDescriptor(target, prop) {
@@ -823,7 +821,7 @@ class StoreHandler {
     }
 }
 
-function addEffect(target, prop, store, effectSubscription) {
+function addStoreEffect(target, prop, store, effectSubscription) {
     const effectsMap = store.$effects$ ||= new Map;
     let effects = effectsMap.get(prop);
     effects || (effects = new Set, effectsMap.set(prop, effects)), ensureContainsSubscription(effects, effectSubscription), 
@@ -848,7 +846,7 @@ function getEffects(target, prop, storeEffects) {
             effectsToTrigger = storeEffects.get(prop);
         }
     }
-    const storeArrayValue = storeEffects?.get(STORE_ARRAY_PROP);
+    const storeArrayValue = storeEffects?.get(STORE_ALL_PROPS);
     if (storeArrayValue) {
         effectsToTrigger ||= new Set;
         for (const effect of storeArrayValue) {
@@ -995,6 +993,10 @@ const runTask = (task, container, host) => {
                 if (isSignal(obj)) {
                     return obj.value;
                 }
+                if (isStore(obj)) {
+                    return addStoreEffect(getStoreTarget(obj), STORE_ALL_PROPS, getStoreHandler(obj), ctx.$effectSubscriber$), 
+                    obj;
+                }
                 throw qError(QError.trackObjectWithoutProp);
             }));
         },
@@ -1080,13 +1082,13 @@ var VirtualVNodeProps;
     VirtualVNodeProps[VirtualVNodeProps.PROPS_OFFSET = 6] = "PROPS_OFFSET";
 }(VirtualVNodeProps || (VirtualVNodeProps = {}));
 
-const mapApp_findIndx = (elementVNode, key, start) => {
+const mapApp_findIndx = (array, key, start) => {
     assertTrue(start % 2 == 0, "Expecting even number.");
     let bottom = start >> 1;
-    let top = elementVNode.length - 2 >> 1;
+    let top = array.length - 2 >> 1;
     for (;bottom <= top; ) {
         const mid = bottom + (top - bottom >> 1);
-        const midKey = elementVNode[mid << 1];
+        const midKey = array[mid << 1];
         if (midKey === key) {
             return mid << 1;
         }
@@ -1095,14 +1097,14 @@ const mapApp_findIndx = (elementVNode, key, start) => {
     return ~(bottom << 1);
 };
 
-const mapArray_set = (elementVNode, key, value, start) => {
-    const indx = mapApp_findIndx(elementVNode, key, start);
-    indx >= 0 ? null == value ? elementVNode.splice(indx, 2) : elementVNode[indx + 1] = value : null != value && elementVNode.splice(~indx, 0, key, value);
+const mapArray_set = (array, key, value, start) => {
+    const indx = mapApp_findIndx(array, key, start);
+    indx >= 0 ? null == value ? array.splice(indx, 2) : array[indx + 1] = value : null != value && array.splice(~indx, 0, key, value);
 };
 
-const mapArray_get = (elementVNode, key, start) => {
-    const indx = mapApp_findIndx(elementVNode, key, start);
-    return indx >= 0 ? elementVNode[indx + 1] : null;
+const mapArray_get = (array, key, start) => {
+    const indx = mapApp_findIndx(array, key, start);
+    return indx >= 0 ? array[indx + 1] : null;
 };
 
 const isForeignObjectElement = elementName => isDev ? "foreignobject" === elementName.toLowerCase() : "foreignObject" === elementName;
@@ -1410,10 +1412,6 @@ function isSlotProp(prop) {
     return !prop.startsWith("q:") && !prop.startsWith(":");
 }
 
-function isParentSlotProp(prop) {
-    return prop.startsWith(":");
-}
-
 const _restProps = (props, omit, target = {}) => {
     let constPropsTarget = null;
     const constProps = props[_CONST_PROPS];
@@ -1575,9 +1573,10 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
     function expectProjection() {
         const slotName = jsxValue.key;
         vCurrent = vnode_getProp(vParent, slotName, (id => vnode_locate(container.rootVNode, id))), 
+        vCurrent = vCurrent && vCurrent[VNodeProps.flags] & VNodeFlags.Deleted ? null : vCurrent, 
         null == vCurrent && (vNewNode = vnode_newVirtual(), isDev && vnode_setProp(vNewNode, "q:type", VirtualType.Projection), 
         isDev && vnode_setProp(vNewNode, "q:code", "expectProjection"), vnode_setProp(vNewNode, QSlot, slotName), 
-        vnode_setProp(vNewNode, ":", vParent), vnode_setProp(vParent, slotName, vNewNode));
+        vnode_setProp(vNewNode, "q:sparent", vParent), vnode_setProp(vParent, slotName, vNewNode));
     }
     function expectSlot() {
         const vHost = vnode_getProjectionParentComponent(vParent, container.rootVNode);
@@ -1593,19 +1592,27 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
             return directGetPropsProxyProp(jsxNode, "name") || "";
         }(vHost);
         const vProjectedNode = vHost ? vnode_getProp(vHost, slotNameKey, null) : null;
-        return null == vProjectedNode ? (vnode_insertBefore(journal, vParent, vNewNode = vnode_newVirtual(), vCurrent && getInsertBefore()), 
-        vnode_setProp(vNewNode, QSlot, slotNameKey), vHost && vnode_setProp(vHost, slotNameKey, vNewNode), 
-        isDev && vnode_setProp(vNewNode, "q:type", VirtualType.Projection), isDev && vnode_setProp(vNewNode, "q:code", "expectSlot" + count++), 
-        !1) : (vProjectedNode === vCurrent || (vnode_insertBefore(journal, vParent, vNewNode = vProjectedNode, vCurrent && getInsertBefore()), 
-        vnode_setProp(vNewNode, QSlot, slotNameKey), vHost && vnode_setProp(vHost, slotNameKey, vNewNode), 
-        isDev && vnode_setProp(vNewNode, "q:type", VirtualType.Projection), isDev && vnode_setProp(vNewNode, "q:code", "expectSlot" + count++)), 
-        !0);
+        if (null == vProjectedNode) {
+            return vnode_insertBefore(journal, vParent, vNewNode = vnode_newVirtual(), vCurrent && getInsertBefore()), 
+            vnode_setProp(vNewNode, QSlot, slotNameKey), vHost && vnode_setProp(vHost, slotNameKey, vNewNode), 
+            isDev && vnode_setProp(vNewNode, "q:type", VirtualType.Projection), isDev && vnode_setProp(vNewNode, "q:code", "expectSlot" + count++), 
+            !1;
+        }
+        if (vProjectedNode === vCurrent) {} else {
+            const parent = vnode_getParent(vProjectedNode);
+            !(!parent || vnode_isElementVNode(parent) && vnode_getElementName(parent) === QTemplate) && vParent !== parent && vnode_remove(journal, parent, vProjectedNode, !1), 
+            vnode_insertBefore(journal, vParent, vNewNode = vProjectedNode, vCurrent && getInsertBefore()), 
+            vnode_setProp(vNewNode, QSlot, slotNameKey), vHost && vnode_setProp(vHost, slotNameKey, vNewNode), 
+            isDev && vnode_setProp(vNewNode, "q:type", VirtualType.Projection), isDev && vnode_setProp(vNewNode, "q:code", "expectSlot" + count++);
+        }
+        return !0;
     }
     function expectNoMore() {
         if (assertFalse(vParent === vCurrent, "Parent and current can't be the same"), null !== vCurrent) {
             for (;vCurrent; ) {
                 const toRemove = vCurrent;
-                advanceToNextSibling(), cleanup(container, toRemove), vParent === vnode_getParent(toRemove) && vnode_remove(journal, vParent, toRemove, !0);
+                advanceToNextSibling(), vParent === vnode_getParent(toRemove) && (cleanup(container, toRemove), 
+                vnode_remove(journal, vParent, toRemove, !0));
             }
         }
     }
@@ -1825,7 +1832,7 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
             const vNodeComponentHash = getComponentHash(host, container.$getObjectById$);
             const lookupKey = jsxNode.key || componentHash;
             if (lookupKey === (getKey(host) || vNodeComponentHash) ? componentHash === vNodeComponentHash || (insertNewComponent(host, componentQRL, jsxProps), 
-            vNewNode && (host = vNewNode, shouldRender = !0)) : (vNewNode = retrieveChildWithKey(null, lookupKey), 
+            host = vNewNode, shouldRender = !0) : (vNewNode = retrieveChildWithKey(null, lookupKey), 
             vNewNode ? vnode_insertBefore(journal, vParent, vNewNode, vCurrent) : insertNewComponent(host, componentQRL, jsxProps), 
             host = vNewNode, shouldRender = !0), host) {
                 const vNodeProps = vnode_getProp(host, "q:props", container.$getObjectById$);
@@ -1863,13 +1870,11 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
             }(jsxNode.children, host);
         } else {
             const lookupKey = jsxNode.key;
-            if (lookupKey === getKey(host) || (vNewNode = retrieveChildWithKey(null, lookupKey), 
-            vNewNode ? vnode_insertBefore(journal, vParent, vNewNode, vCurrent) : function() {
-                vnode_insertBefore(journal, vParent, vNewNode = vnode_newVirtual(), vCurrent && getInsertBefore());
-                const jsxNode = jsxValue;
-                isDev && vnode_setProp(vNewNode, "q:type", VirtualType.InlineComponent), vnode_setProp(vNewNode, "q:props", jsxNode.props), 
-                jsxNode.key && vnode_setProp(vNewNode, "q:key", jsxNode.key);
-            }(), host = vNewNode), host) {
+            const lookupKeysAreEqual = lookupKey === getKey(host);
+            const vNodeComponentHash = getComponentHash(host, container.$getObjectById$);
+            if (lookupKeysAreEqual ? null != vNodeComponentHash && (insertNewInlineComponent(), 
+            host = vNewNode) : (vNewNode = retrieveChildWithKey(null, lookupKey), vNewNode ? vnode_insertBefore(journal, vParent, vNewNode, vCurrent) : insertNewInlineComponent(), 
+            host = vNewNode), host) {
                 let componentHost = host;
                 for (;componentHost && (!vnode_isVirtualVNode(componentHost) || null === vnode_getProp(componentHost, "q:renderFn", null)); ) {
                     componentHost = vnode_getParent(componentHost);
@@ -1885,6 +1890,12 @@ const vnode_diff = (container, jsxNode, vStartNode, scopedStyleIdPrefix) => {
         isDev && vnode_setProp(vNewNode, "q:type", VirtualType.Component), container.setHostProp(vNewNode, "q:renderFn", componentQRL), 
         container.setHostProp(vNewNode, "q:props", jsxProps), container.setHostProp(vNewNode, "q:key", jsxNode.key);
     }
+    function insertNewInlineComponent() {
+        vnode_insertBefore(journal, vParent, vNewNode = vnode_newVirtual(), vCurrent && getInsertBefore());
+        const jsxNode = jsxValue;
+        isDev && vnode_setProp(vNewNode, "q:type", VirtualType.InlineComponent), vnode_setProp(vNewNode, "q:props", jsxNode.props), 
+        jsxNode.key && vnode_setProp(vNewNode, "q:key", jsxNode.key);
+    }
     function expectText(text) {
         if (null !== vCurrent) {
             if (3 === vnode_getType(vCurrent)) {
@@ -1940,7 +1951,7 @@ function removePropsKeys(keys, propKeys) {
 function cleanup(container, vNode) {
     let vCursor = vNode;
     if (vnode_isTextVNode(vNode)) {
-        return;
+        return void markVNodeAsDeleted(vCursor);
     }
     let vParent = null;
     for (;;) {
@@ -1961,8 +1972,7 @@ function cleanup(container, vNode) {
             if (type & VNodeFlags.Virtual && null !== vnode_getProp(vCursor, "q:renderFn", null)) {
                 const attrs = vnode_getProps(vCursor);
                 for (let i = 0; i < attrs.length; i += 2) {
-                    const key = attrs[i];
-                    if (!isParentSlotProp(key) && isSlotProp(key)) {
+                    if (isSlotProp(attrs[i])) {
                         const value = attrs[i + 1];
                         if (value) {
                             attrs[i + 1] = null;
@@ -1976,7 +1986,7 @@ function cleanup(container, vNode) {
                     }
                 }
             }
-            if (type & VNodeFlags.Virtual && null !== vnode_getProp(vCursor, QSlot, null)) {
+            if (vnode_isProjection(vCursor)) {
                 if (vCursor === vNode) {
                     const vFirstChild = vnode_getFirstChild(vCursor);
                     if (vFirstChild) {
@@ -1990,6 +2000,8 @@ function cleanup(container, vNode) {
                     continue;
                 }
             }
+        } else {
+            type & VNodeFlags.Text && markVNodeAsDeleted(vCursor);
         }
         if (vCursor === vNode) {
             return;
@@ -2172,10 +2184,10 @@ const vnode_documentPosition = (a, b, rootVNode) => {
     let aDepth = -1;
     let bDepth = -1;
     for (;a; ) {
-        a = (aVNodePath[++aDepth] = a)[VNodeProps.parent] || rootVNode && vnode_getProp(a, ":", (id => vnode_locate(rootVNode, id)));
+        a = (aVNodePath[++aDepth] = a)[VNodeProps.parent] || rootVNode && vnode_getProp(a, "q:sparent", (id => vnode_locate(rootVNode, id)));
     }
     for (;b; ) {
-        b = (bVNodePath[++bDepth] = b)[VNodeProps.parent] || rootVNode && vnode_getProp(b, ":", (id => vnode_locate(rootVNode, id)));
+        b = (bVNodePath[++bDepth] = b)[VNodeProps.parent] || rootVNode && vnode_getProp(b, "q:sparent", (id => vnode_locate(rootVNode, id)));
     }
     for (;aDepth >= 0 && bDepth >= 0; ) {
         if ((a = aVNodePath[aDepth]) !== (b = bVNodePath[bDepth])) {
@@ -2191,7 +2203,7 @@ const vnode_documentPosition = (a, b, rootVNode) => {
                     return -1;
                 }
             } while (cursor);
-            return rootVNode && vnode_getProp(b, ":", (id => vnode_locate(rootVNode, id))) ? -1 : 1;
+            return rootVNode && vnode_getProp(b, "q:sparent", (id => vnode_locate(rootVNode, id))) ? -1 : 1;
         }
         aDepth--, bDepth--;
     }
@@ -2495,6 +2507,16 @@ const DEBUG = !1;
 
 const log = (...args) => console.log("SIGNAL", ...args.map(qwikDebugToString));
 
+var SignalFlags;
+
+var WrappedSignalFlags;
+
+!function(SignalFlags) {
+    SignalFlags[SignalFlags.INVALID = 1] = "INVALID";
+}(SignalFlags || (SignalFlags = {})), function(WrappedSignalFlags) {
+    WrappedSignalFlags[WrappedSignalFlags.UNWRAP = 2] = "UNWRAP";
+}(WrappedSignalFlags || (WrappedSignalFlags = {}));
+
 const throwIfQRLNotResolved = qrl => {
     if (!qrl.resolved) {
         throw qrl.resolve();
@@ -2561,7 +2583,7 @@ class Signal {
         qDev;
     }
     toString() {
-        return `[${this.constructor.name}${this.$invalid$ ? " INVALID" : ""} ${String(this.$untrackedValue$)}]` + (Array.from(this.$effects$ || []).map((e => "\n -> " + pad(qwikDebugToString(e[0]), "    "))).join("\n") || "");
+        return `[${this.constructor.name}${this.$flags$ & SignalFlags.INVALID ? " INVALID" : ""} ${String(this.$untrackedValue$)}]` + (Array.from(this.$effects$ || []).map((e => "\n -> " + pad(qwikDebugToString(e[0]), "    "))).join("\n") || "");
     }
     toJSON() {
         return {
@@ -2630,16 +2652,17 @@ const triggerEffects = (container, signal, effects) => {
 
 class ComputedSignal extends Signal {
     $computeQrl$;
-    $invalid$=!0;
+    $flags$;
     $forceRunEffects$=!1;
-    constructor(container, fn) {
-        super(container, NEEDS_COMPUTATION), this.$computeQrl$ = fn;
+    [_EFFECT_BACK_REF]=null;
+    constructor(container, fn, flags = SignalFlags.INVALID) {
+        super(container, NEEDS_COMPUTATION), this.$computeQrl$ = fn, this.$flags$ = flags;
     }
     $invalidate$() {
-        this.$invalid$ = !0, this.$forceRunEffects$ = !1, this.$container$?.$scheduler$(ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS, null, this);
+        this.$flags$ |= SignalFlags.INVALID, this.$forceRunEffects$ = !1, this.$container$?.$scheduler$(ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS, null, this);
     }
     force() {
-        this.$invalid$ = !0, this.$forceRunEffects$ = !1, triggerEffects(this.$container$, this, this.$effects$);
+        this.$flags$ |= SignalFlags.INVALID, this.$forceRunEffects$ = !1, triggerEffects(this.$container$, this, this.$effects$);
     }
     get untrackedValue() {
         const didChange = this.$computeIfNeeded$();
@@ -2647,7 +2670,7 @@ class ComputedSignal extends Signal {
         this.$untrackedValue$;
     }
     $computeIfNeeded$() {
-        if (!this.$invalid$) {
+        if (!(this.$flags$ & SignalFlags.INVALID)) {
             return !1;
         }
         const computeQrl = this.$computeQrl$;
@@ -2660,7 +2683,7 @@ class ComputedSignal extends Signal {
             if (isPromise(untrackedValue)) {
                 throw qError(QError.computedNotSync, [ computeQrl.dev ? computeQrl.dev.file : "", computeQrl.$hash$ ]);
             }
-            this.$invalid$ = !1;
+            this.$flags$ &= ~SignalFlags.INVALID;
             const didChange = untrackedValue !== this.$untrackedValue$;
             return didChange && (this.$untrackedValue$ = untrackedValue), didChange;
         } finally {
@@ -2679,18 +2702,19 @@ class WrappedSignal extends Signal {
     $args$;
     $func$;
     $funcStr$;
-    $invalid$=!0;
+    $flags$;
     $hostElement$=null;
     $forceRunEffects$=!1;
     [_EFFECT_BACK_REF]=null;
-    constructor(container, fn, args, fnStr) {
-        super(container, NEEDS_COMPUTATION), this.$args$ = args, this.$func$ = fn, this.$funcStr$ = fnStr;
+    constructor(container, fn, args, fnStr, flags = SignalFlags.INVALID | WrappedSignalFlags.UNWRAP) {
+        super(container, NEEDS_COMPUTATION), this.$args$ = args, this.$func$ = fn, this.$funcStr$ = fnStr, 
+        this.$flags$ = flags;
     }
     $invalidate$() {
-        this.$invalid$ = !0, this.$forceRunEffects$ = !1, this.$container$?.$scheduler$(ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS, this.$hostElement$, this);
+        this.$flags$ |= SignalFlags.INVALID, this.$forceRunEffects$ = !1, this.$container$?.$scheduler$(ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS, this.$hostElement$, this);
     }
     force() {
-        this.$invalid$ = !0, this.$forceRunEffects$ = !1, triggerEffects(this.$container$, this, this.$effects$);
+        this.$flags$ |= SignalFlags.INVALID, this.$forceRunEffects$ = !1, triggerEffects(this.$container$, this, this.$effects$);
     }
     get untrackedValue() {
         const didChange = this.$computeIfNeeded$();
@@ -2698,7 +2722,7 @@ class WrappedSignal extends Signal {
         this.$untrackedValue$;
     }
     $computeIfNeeded$() {
-        if (!this.$invalid$) {
+        if (!(this.$flags$ & SignalFlags.INVALID)) {
             return !1;
         }
         const untrackedValue = trackSignal((() => this.$func$(...this.$args$)), this, EffectProperty.VNODE, this.$container$);
@@ -2813,7 +2837,7 @@ function processJSXNode(ssr, enqueue, value, options) {
                     const componentFrame = options.parentComponentFrame || ssr.unclaimedProjectionComponentFrameQueue.shift();
                     if (componentFrame) {
                         const projectionAttrs = isDev ? [ "q:type", VirtualType.Projection ] : [];
-                        projectionAttrs.push(":", componentFrame.componentNode.id || ""), ssr.openProjection(projectionAttrs);
+                        projectionAttrs.push("q:sparent", componentFrame.componentNode.id || ""), ssr.openProjection(projectionAttrs);
                         const host = componentFrame.componentNode;
                         const node = ssr.getLastNode();
                         const slotName = getSlotName(host, jsx, ssr);
@@ -2970,7 +2994,7 @@ function appendClassIfScopedStyleExists(jsx, styleScoped) {
     jsx.constProps.class = "");
 }
 
-const version = "2.0.0-alpha.7-dev+a26598a";
+const version = "2.0.0-alpha.8-dev+66037b5";
 
 class _SharedContainer {
     $version$;
@@ -3009,7 +3033,7 @@ const _wrapProp = (...args) => {
     }
     if (isSignal(obj)) {
         return assertEqual(prop, "value", "Left side is a signal, prop must be value"), 
-        obj instanceof WrappedSignal ? obj : getWrapped(args);
+        obj instanceof WrappedSignal && obj.flags & WrappedSignalFlags.UNWRAP ? obj : getWrapped(args);
     }
     if (isPropsProxy(obj)) {
         const constProps = obj[_CONST_PROPS];
@@ -3026,6 +3050,11 @@ const _wrapProp = (...args) => {
     return getWrapped(args);
 };
 
+const _wrapStore = (obj, prop) => {
+    const value = getStoreTarget(obj)[prop];
+    return isSignal(value) ? value : new WrappedSignal(null, getProp, [ obj, prop ], null, SignalFlags.INVALID);
+};
+
 const _wrapSignal = (obj, prop) => {
     const r = _wrapProp(obj, prop);
     return r === _IMMUTABLE ? obj[prop] : r;
@@ -3154,7 +3183,7 @@ class PropsProxyHandler {
             return this.$children$;
         }
         const value = this.$constProps$ && prop in this.$constProps$ ? this.$constProps$[prop] : this.$varProps$[prop];
-        return value instanceof WrappedSignal ? value.value : value;
+        return value instanceof WrappedSignal && value.$flags$ & WrappedSignalFlags.UNWRAP ? value.value : value;
     }
     set(_, prop, value) {
         return prop === _CONST_PROPS ? (this.$constProps$ = value, !0) : prop === _VAR_PROPS ? (this.$varProps$ = value, 
@@ -3305,8 +3334,8 @@ const VNodeDataChar = {
     ID_CHAR: "=",
     PROPS: 62,
     PROPS_CHAR: ">",
-    SLOT_REF: 63,
-    SLOT_REF_CHAR: "?",
+    SLOT_PARENT: 63,
+    SLOT_PARENT_CHAR: "?",
     KEY: 64,
     KEY_CHAR: "@",
     SEQ: 91,
@@ -3405,6 +3434,11 @@ const vnode_isVirtualVNode = vNode => {
     return (vNode[VNodeProps.flags] & VNodeFlags.Virtual) === VNodeFlags.Virtual;
 };
 
+const vnode_isProjection = vNode => {
+    assertDefined(vNode, "Missing vNode");
+    return (vNode[VNodeProps.flags] & VNodeFlags.Virtual) === VNodeFlags.Virtual && null !== vnode_getProp(vNode, QSlot, null);
+};
+
 const ensureTextVNode = vNode => (assertTrue(vnode_isTextVNode(vNode), "Expecting TextVNode was: " + vnode_getNodeTypeName(vNode)), 
 vNode);
 
@@ -3685,7 +3719,7 @@ const vnode_applyJournal = journal => {
             let key = journal[idx++];
             "className" === key && (key = "class");
             const value = journal[idx++];
-            isBooleanAttr(element, key) ? element[key] = parseBoolean(value) : "value" === key && key in element ? element.value = escapeHTML(String(value)) : key === dangerouslySetInnerHTML ? element.innerHTML = value : null == value || !1 === value ? element.removeAttribute(key) : element.setAttribute(key, String(value));
+            isBooleanAttr(element, key) ? element[key] = parseBoolean(value) : "value" === key && key in element ? element.value = String(value) : key === dangerouslySetInnerHTML ? element.innerHTML = value : null == value || !1 === value ? element.removeAttribute(key) : element.setAttribute(key, String(value));
             break;
 
           case VNodeJournalOpCode.HoistStyles:
@@ -4189,8 +4223,6 @@ function materializeFromVNodeData(vParent, vData, element, child) {
             container.$setRawState$(parseInt(id), vParent), isDev && vnode_setAttr(null, vParent, "q:id", id);
         } else if (peek() === VNodeDataChar.PROPS) {
             vnode_setAttr(null, vParent, "q:props", consumeValue());
-        } else if (peek() === VNodeDataChar.SLOT_REF) {
-            vnode_setAttr(null, vParent, "q:sref", consumeValue());
         } else if (peek() === VNodeDataChar.KEY) {
             vnode_setAttr(null, vParent, "q:key", consumeValue());
         } else if (peek() === VNodeDataChar.SEQ) {
@@ -4199,6 +4231,8 @@ function materializeFromVNodeData(vParent, vData, element, child) {
             vnode_setAttr(null, vParent, "q:seqIdx", consumeValue());
         } else if (peek() === VNodeDataChar.BACK_REFS) {
             container || (container = getDomContainer(element)), setEffectBackRefFromVNodeData(vParent, consumeValue(), container);
+        } else if (peek() === VNodeDataChar.SLOT_PARENT) {
+            vnode_setProp(vParent, "q:sparent", consumeValue());
         } else if (peek() === VNodeDataChar.CONTEXT) {
             vnode_setAttr(null, vParent, "q:ctx", consumeValue());
         } else if (peek() === VNodeDataChar.OPEN) {
@@ -4248,7 +4282,7 @@ const vnode_getProjectionParentComponent = (vHost, rootVNode) => {
     let projectionDepth = 1;
     for (;projectionDepth--; ) {
         for (;vHost && (!vnode_isVirtualVNode(vHost) || null === vnode_getProp(vHost, "q:renderFn", null)); ) {
-            const qSlotParent = vnode_getProp(vHost, ":", (id => vnode_locate(rootVNode, id)));
+            const qSlotParent = vnode_getProp(vHost, "q:sparent", (id => vnode_locate(rootVNode, id)));
             const vProjectionParent = vnode_isVirtualVNode(vHost) && qSlotParent;
             vProjectionParent && projectionDepth++, vHost = vProjectionParent || vnode_getParent(vHost);
         }
@@ -4713,7 +4747,7 @@ class DomContainer extends _SharedContainer {
                 if (null !== vnode_getProp(vNode, "q:renderFn", null)) {
                     return vNode;
                 }
-                vNode = vnode_getParent(vNode) || vnode_getProp(vNode, ":", this.vNodeLocate);
+                vNode = vnode_getParent(vNode) || vnode_getProp(vNode, "q:sparent", this.vNodeLocate);
             } else {
                 vNode = vnode_getParent(vNode);
             }
@@ -4943,7 +4977,8 @@ const inflate = (container, target, typeId, data) => {
             const signal = target;
             const d = data;
             signal.$func$ = container.getSyncFn(d[0]), signal.$args$ = d[1], signal[_EFFECT_BACK_REF] = d[2], 
-            signal.$untrackedValue$ = d[3], signal.$hostElement$ = d[4], signal.$effects$ = new Set(d.slice(5));
+            signal.$untrackedValue$ = d[3], signal.$flags$ = d[4], signal.$hostElement$ = d[5], 
+            signal.$effects$ = new Set(d.slice(6));
             break;
         }
 
@@ -4951,7 +4986,7 @@ const inflate = (container, target, typeId, data) => {
         {
             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$ = d[0], computed.$effects$ = d[1], 3 === d.length ? computed.$untrackedValue$ = d[2] : (computed.$flags$ |= SignalFlags.INVALID, 
             computed.$computeQrl$.resolve(), container.$scheduler$?.(ChoreType.QRL_RESOLVE, null, computed.$computeQrl$));
             break;
         }
@@ -5047,7 +5082,7 @@ const inflate = (container, target, typeId, data) => {
     return target;
 };
 
-const _constants = [ void 0, null, !0, !1, "", EMPTY_ARRAY, EMPTY_OBJ, NEEDS_COMPUTATION, STORE_ARRAY_PROP, Slot, Fragment, NaN, 1 / 0, -1 / 0, Number.MAX_SAFE_INTEGER, Number.MAX_SAFE_INTEGER - 1, Number.MIN_SAFE_INTEGER ];
+const _constants = [ void 0, null, !0, !1, "", EMPTY_ARRAY, EMPTY_OBJ, NEEDS_COMPUTATION, STORE_ALL_PROPS, Slot, Fragment, NaN, 1 / 0, -1 / 0, Number.MAX_SAFE_INTEGER, Number.MAX_SAFE_INTEGER - 1, Number.MIN_SAFE_INTEGER ];
 
 const allocate = (container, typeId, value) => {
     if (void 0 === value) {
@@ -5282,10 +5317,11 @@ const createSerializationContext = (NodeConstructor, DomRefConstructor, symbolTo
                         discoveredValues.push(k, v);
                     }));
                 } else if (obj instanceof Signal) {
-                    const v = obj instanceof WrappedSignal ? obj.untrackedValue : obj instanceof ComputedSignal && (obj.$invalid$ || fastSkipSerialize(obj)) ? NEEDS_COMPUTATION : obj.$untrackedValue$;
-                    v !== NEEDS_COMPUTATION && discoveredValues.push(v), obj.$effects$ && discoveredValues.push(...obj.$effects$), 
+                    const v = obj instanceof WrappedSignal ? obj.untrackedValue : obj instanceof ComputedSignal && (obj.$flags$ & SignalFlags.INVALID || fastSkipSerialize(obj)) ? NEEDS_COMPUTATION : obj.$untrackedValue$;
+                    v !== NEEDS_COMPUTATION && discoveredValues.push(v), obj.$effects$ && discoveredValues.push(obj.$effects$), 
                     obj instanceof WrappedSignal ? (discoverEffectBackRefs(obj[_EFFECT_BACK_REF], discoveredValues), 
-                    obj.$args$ && discoveredValues.push(...obj.$args$), obj.$hostElement$ && discoveredValues.push(obj.$hostElement$)) : obj instanceof ComputedSignal && discoveredValues.push(obj.$computeQrl$);
+                    obj.$args$ && discoveredValues.push(...obj.$args$), obj.$hostElement$ && discoveredValues.push(obj.$hostElement$)) : obj instanceof ComputedSignal && (discoverEffectBackRefs(obj[_EFFECT_BACK_REF], discoveredValues), 
+                    discoveredValues.push(obj.$computeQrl$));
                 } else if (obj instanceof Task) {
                     discoveredValues.push(obj.$el$, obj.$qrl$, obj.$state$), discoverEffectBackRefs(obj[_EFFECT_BACK_REF], discoveredValues);
                 } else if (isSsrNode(obj)) {
@@ -5361,16 +5397,7 @@ const discoverValuesForVNodeData = (vnodeData, discoveredValues) => {
 };
 
 const discoverEffectBackRefs = (effectsBackRefs, discoveredValues) => {
-    if (effectsBackRefs) {
-        let hasBackRefs = !1;
-        for (const [, effect] of effectsBackRefs) {
-            if (effect[EffectSubscriptionProp.BACK_REF]) {
-                hasBackRefs = !0;
-                break;
-            }
-        }
-        hasBackRefs && discoveredValues.push(effectsBackRefs);
-    }
+    effectsBackRefs && discoveredValues.push(effectsBackRefs);
 };
 
 const promiseResults = new WeakMap;
@@ -5440,10 +5467,10 @@ function serialize(serializationContext) {
         } else if (value === NEEDS_COMPUTATION) {
             output(TypeIds.Constant, Constants.NEEDS_COMPUTATION);
         } else {
-            if (value !== STORE_ARRAY_PROP) {
+            if (value !== STORE_ALL_PROPS) {
                 throw qError(QError.serializeErrorUnknownType, [ typeof value ]);
             }
-            output(TypeIds.Constant, Constants.STORE_ARRAY_PROP);
+            output(TypeIds.Constant, Constants.STORE_ALL_PROPS);
         }
     };
     const writeObjectValue = (value, idx) => {
@@ -5501,9 +5528,9 @@ function serialize(serializationContext) {
         } else if ($isDomRef$(value)) {
             value.$ssrNode$.vnodeData[0] |= VNodeDataFlag.SERIALIZE, output(TypeIds.RefVNode, value.$ssrNode$.id);
         } else if (value instanceof Signal) {
-            const v = value instanceof ComputedSignal && (value.$invalid$ || fastSkipSerialize(value.$untrackedValue$)) ? NEEDS_COMPUTATION : value.$untrackedValue$;
+            const v = value instanceof ComputedSignal && (value.$flags$ & SignalFlags.INVALID || fastSkipSerialize(value.$untrackedValue$)) ? NEEDS_COMPUTATION : value.$untrackedValue$;
             if (value instanceof WrappedSignal) {
-                output(TypeIds.WrappedSignal, [ ...serializeWrappingFn(serializationContext, value), filterEffectBackRefs(value[_EFFECT_BACK_REF]), v, value.$hostElement$, ...value.$effects$ || [] ]);
+                output(TypeIds.WrappedSignal, [ ...serializeWrappingFn(serializationContext, value), filterEffectBackRefs(value[_EFFECT_BACK_REF]), v, value.$flags$, value.$hostElement$, ...value.$effects$ || [] ]);
             } else if (value instanceof ComputedSignal) {
                 const out = [ value.$computeQrl$, value.$effects$ ];
                 v !== NEEDS_COMPUTATION && out.push(v), output(TypeIds.ComputedSignal, out);
@@ -5797,7 +5824,7 @@ var Constants;
     Constants[Constants.True = 2] = "True", Constants[Constants.False = 3] = "False", 
     Constants[Constants.EmptyString = 4] = "EmptyString", Constants[Constants.EMPTY_ARRAY = 5] = "EMPTY_ARRAY", 
     Constants[Constants.EMPTY_OBJ = 6] = "EMPTY_OBJ", Constants[Constants.NEEDS_COMPUTATION = 7] = "NEEDS_COMPUTATION", 
-    Constants[Constants.STORE_ARRAY_PROP = 8] = "STORE_ARRAY_PROP", Constants[Constants.Slot = 9] = "Slot", 
+    Constants[Constants.STORE_ALL_PROPS = 8] = "STORE_ALL_PROPS", Constants[Constants.Slot = 9] = "Slot", 
     Constants[Constants.Fragment = 10] = "Fragment", Constants[Constants.NaN = 11] = "NaN", 
     Constants[Constants.PositiveInfinity = 12] = "PositiveInfinity", Constants[Constants.NegativeInfinity = 13] = "NegativeInfinity", 
     Constants[Constants.MaxSafeInt = 14] = "MaxSafeInt", Constants[Constants.AlmostMaxSafeInt = 15] = "AlmostMaxSafeInt", 
@@ -6422,4 +6449,4 @@ const PrefetchGraph = (opts = {}) => {
     }, null, 0, "prefetch-graph");
 };
 
-export { $, Fragment, PrefetchGraph, PrefetchServiceWorker, RenderOnce, Resource, SSRComment, SSRRaw, SSRStream, SSRStreamBlock, SkipRender, Slot, _CONST_PROPS, DomContainer as _DomContainer, _EFFECT_BACK_REF, EMPTY_ARRAY as _EMPTY_ARRAY, SubscriptionData as _EffectData, _IMMUTABLE, _SharedContainer, _VAR_PROPS, _deserialize, _fnSignal, _getContextElement, _getContextEvent, getDomContainer as _getDomContainer, _getQContainerElement, isJSXNode as _isJSXNode, isStringifiable as _isStringifiable, _jsxBranch, _jsxC, _jsxQ, _jsxS, _jsxSorted, _jsxSplit, _noopQrl, _noopQrlDEV, _qrlSync, _regSymbol, _restProps, queueQRL as _run, _serialize, scheduleTask as _task, verifySerializable as _verifySerializable, _waitUntilRendered, _walkJSX, _weakSerialize, _wrapProp, _wrapSignal, component$, componentQrl, createComputed$, createComputedQrl, createContextId, h as createElement, createSignal, event$, eventQrl, getDomContainer, getLocale, getPlatform, h, implicit$FirstArg, inlinedQrl, inlinedQrlDEV, isSignal, jsx, jsxDEV, jsx as jsxs, noSerialize, qrl, qrlDEV, render, setPlatform, sync$, untrack, unwrapStore, useComputed$, useComputedQrl, useConstant, useContext, useContextProvider, useErrorBoundary, useId, useLexicalScope, useOn, useOnDocument, useOnWindow, useResource$, useResourceQrl, useServerData, useSignal, useStore, useStyles$, useStylesQrl, useStylesScoped$, useStylesScopedQrl, useTask$, useTaskQrl, useVisibleTask$, useVisibleTaskQrl, version, withLocale };
+export { $, Fragment, PrefetchGraph, PrefetchServiceWorker, RenderOnce, Resource, SSRComment, SSRRaw, SSRStream, SSRStreamBlock, SkipRender, Slot, _CONST_PROPS, DomContainer as _DomContainer, _EFFECT_BACK_REF, EMPTY_ARRAY as _EMPTY_ARRAY, SubscriptionData as _EffectData, _IMMUTABLE, _SharedContainer, _VAR_PROPS, _deserialize, _fnSignal, _getContextElement, _getContextEvent, getDomContainer as _getDomContainer, _getQContainerElement, isJSXNode as _isJSXNode, isStringifiable as _isStringifiable, _jsxBranch, _jsxC, _jsxQ, _jsxS, _jsxSorted, _jsxSplit, _noopQrl, _noopQrlDEV, _qrlSync, _regSymbol, _restProps, queueQRL as _run, _serialize, scheduleTask as _task, verifySerializable as _verifySerializable, _waitUntilRendered, _walkJSX, _weakSerialize, _wrapProp, _wrapSignal, _wrapStore, component$, componentQrl, createComputed$, createComputedQrl, createContextId, h as createElement, createSignal, event$, eventQrl, getDomContainer, getLocale, getPlatform, h, implicit$FirstArg, inlinedQrl, inlinedQrlDEV, isSignal, jsx, jsxDEV, jsx as jsxs, noSerialize, qrl, qrlDEV, render, setPlatform, sync$, untrack, unwrapStore, useComputed$, useComputedQrl, useConstant, useContext, useContextProvider, useErrorBoundary, useId, useLexicalScope, useOn, useOnDocument, useOnWindow, useResource$, useResourceQrl, useServerData, useSignal, useStore, useStyles$, useStylesQrl, useStylesScoped$, useStylesScopedQrl, useTask$, useTaskQrl, useVisibleTask$, useVisibleTaskQrl, version, withLocale };