@qwik.dev/core 2.0.0-beta.1 → 2.0.0-beta.3

package/dist/build/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qwik.dev/core/build",
-  "version": "2.0.0-beta.1-dev+495e8d9",
+  "version": "2.0.0-beta.3-dev+aa098fc",
   "main": "index.mjs",
   "types": "index.d.ts",
   "private": true,

package/dist/cli.cjs

@@ -1,6 +1,6 @@
 /**
  * @license
- * @qwik.dev/core/cli 2.0.0-beta.1-dev+495e8d9
+ * @qwik.dev/core/cli 2.0.0-beta.3-dev+aa098fc
  * 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
@@ -5536,7 +5536,7 @@ async function printHelp(app) {
   await runCommand2(Object.assign(app, { task: args[0], args }));
 }
 function printVersion() {
-  console.log("2.0.0-beta.1-dev+495e8d9");
+  console.log("2.0.0-beta.3-dev+aa098fc");
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/core-internal.d.ts

@@ -2049,13 +2049,12 @@ declare type QRLInternalMethods<TYPE> = {
     $captureRef$: unknown[] | null;
     dev: QRLDev | null;
     resolved: undefined | TYPE;
-    resolve(): Promise<TYPE>;
+    resolve(containerEl?: Element): Promise<TYPE>;
     getSymbol(): string;
     getHash(): string;
     getCaptured(): unknown[] | null;
     getFn(currentCtx?: InvokeContext | InvokeTuple, beforeFn?: () => void): TYPE extends (...args: any) => any ? (...args: Parameters<TYPE>) => ValueOrPromise<ReturnType<TYPE>> : unknown;
     $setContainer$(containerEl: Element | undefined): Element | undefined;
-    $resolveLazy$(containerEl?: Element): ValueOrPromise<TYPE>;
 };
 
 declare type QrlReturn<T> = T extends (...args: any) => infer R ? Awaited<R> : unknown;
@@ -4250,7 +4249,7 @@ export declare const _VAR_PROPS: unique symbol;
 export declare const _verifySerializable: <T>(value: T, preMessage?: string) => T;
 
 /**
- * 2.0.0-beta.1-dev+495e8d9
+ * 2.0.0-beta.3-dev+aa098fc
  *
  * @public
  */

package/dist/core.cjs

@@ -1,6 +1,6 @@
 /**
  * @license
- * @qwik.dev/core 2.0.0-beta.1-dev+495e8d9
+ * @qwik.dev/core 2.0.0-beta.3-dev+aa098fc
  * 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
@@ -644,8 +644,6 @@
         $invalidate$() {
             this.$flags$ |= 1 /* SignalFlags.INVALID */;
             this.$forceRunEffects$ = false;
-            // We should only call subscribers if the calculation actually changed.
-            // Therefore, we need to calculate the value now.
             this.$container$?.$scheduler$(7 /* ChoreType.RECOMPUTE_AND_SCHEDULE_EFFECTS */, this.$hostElement$, this, this.$effects$);
         }
         /**
@@ -1232,7 +1230,7 @@
      *
      * @public
      */
-    const version = "2.0.0-beta.1-dev+495e8d9";
+    const version = "2.0.0-beta.3-dev+aa098fc";
 
     /** @internal */
     const EMPTY_ARRAY = [];
@@ -2423,7 +2421,6 @@
             if (!isInlineComponent) {
                 container.setHostProp(renderHost, ELEMENT_SEQ_IDX, null);
                 container.setHostProp(renderHost, USE_ON_LOCAL_SEQ_IDX, null);
-                container.setHostProp(renderHost, ELEMENT_PROPS, props);
             }
             if (vnode_isVNode(renderHost)) {
                 clearAllEffects(container, renderHost);
@@ -4542,16 +4539,36 @@
                     shouldRender = true;
                 }
                 if (host) {
-                    const vNodeProps = vnode_getProp(host, ELEMENT_PROPS, container.$getObjectById$);
-                    shouldRender = shouldRender || propsDiffer(jsxProps, vNodeProps);
+                    let vNodeProps = vnode_getProp(host, ELEMENT_PROPS, container.$getObjectById$);
+                    const propsAreDifferent = propsDiffer(jsxProps, vNodeProps);
+                    shouldRender = shouldRender || propsAreDifferent;
                     if (shouldRender) {
+                        if (propsAreDifferent) {
+                            if (vNodeProps) {
+                                // Reuse the same props instance, qrls can use the current props instance
+                                // as a capture ref, so we can't change it.
+                                // We need to do this directly, because normally we would subscribe to the signals
+                                // if any signal is there.
+                                vNodeProps[_CONST_PROPS] = jsxProps[_CONST_PROPS];
+                                vNodeProps[_VAR_PROPS] = jsxProps[_VAR_PROPS];
+                            }
+                            else if (jsxProps) {
+                                // If there is no props instance, create a new one.
+                                // We can do this because we are not using the props instance for anything else.
+                                vnode_setProp(host, ELEMENT_PROPS, jsxProps);
+                                vNodeProps = jsxProps;
+                            }
+                        }
+                        // Assign the new QRL instance to the host.
+                        // Unfortunately it is created every time, something to fix in the optimizer.
+                        vnode_setProp(host, OnRenderProp, componentQRL);
                         /**
                          * Mark host as not deleted. The host could have been marked as deleted if it there was a
                          * cleanup run. Now we found it and want to reuse it, so we need to mark it as not
                          * deleted.
                          */
                         host[0 /* VNodeProps.flags */] &= -33 /* VNodeFlags.Deleted */;
-                        container.$scheduler$(6 /* ChoreType.COMPONENT */, host, componentQRL, jsxProps);
+                        container.$scheduler$(6 /* ChoreType.COMPONENT */, host, componentQRL, vNodeProps);
                     }
                 }
                 descendContentToProject(jsxNode.children, host);
@@ -5511,22 +5528,23 @@
                         {
                             const target = chore.$target$;
                             const effects = chore.$payload$;
+                            const ctx = newInvokeContext();
+                            ctx.$container$ = container;
                             if (target instanceof ComputedSignalImpl || target instanceof WrappedSignalImpl) {
                                 const forceRunEffects = target.$forceRunEffects$;
                                 target.$forceRunEffects$ = false;
-                                if (!target.$effects$?.size) {
+                                if (!effects?.size) {
                                     break;
                                 }
-                                returnValue = retryOnPromise(() => {
-                                    if (target.$computeIfNeeded$() || forceRunEffects) {
-                                        triggerEffects(container, target, effects);
+                                // needed for computed signals and throwing QRLs
+                                returnValue = maybeThen(retryOnPromise(() => invoke.call(target, ctx, target.$computeIfNeeded$)), (didChange) => {
+                                    if (didChange || forceRunEffects) {
+                                        return retryOnPromise(() => triggerEffects(container, target, effects));
                                     }
                                 });
                             }
                             else {
-                                returnValue = retryOnPromise(() => {
-                                    triggerEffects(container, target, effects);
-                                });
+                                returnValue = retryOnPromise(() => triggerEffects(container, target, effects));
                             }
                         }
                         break;
@@ -5608,7 +5626,10 @@
                 return idxDiff;
             }
             // If the host is the same (or missing), and the type is the same,  we need to compare the target.
-            if (a.$target$ !== b.$target$ || a.$payload$ !== b.$payload$) {
+            if (a.$target$ !== b.$target$) {
+                if (isQrl(a.$target$) && isQrl(b.$target$) && a.$target$.$hash$ === b.$target$.$hash$) {
+                    return 0;
+                }
                 // 1 means that we are going to process chores as FIFO
                 return 1;
             }
@@ -5656,7 +5677,7 @@
              * multiple times during component execution. For this reason it is necessary for us to update
              * the chore with the latest result of the signal.
              */
-            if (existing.$type$ === 4 /* ChoreType.NODE_DIFF */) {
+            if (existing.$payload$ !== value.$payload$) {
                 existing.$payload$ = value.$payload$;
             }
             if (existing.$executed$) {
@@ -7788,12 +7809,15 @@
         let nextToConsumeIdx = 0;
         let ch = 0;
         let peekCh = 0;
+        const getChar = (idx) => {
+            return idx < vData.length ? vData.charCodeAt(idx) : 0;
+        };
         const peek = () => {
             if (peekCh !== 0) {
                 return peekCh;
             }
             else {
-                return (peekCh = nextToConsumeIdx < vData.length ? vData.charCodeAt(nextToConsumeIdx) : 0);
+                return (peekCh = getChar(nextToConsumeIdx));
             }
         };
         const consume = () => {
@@ -7814,7 +7838,7 @@
             return vData.substring(start, nextToConsumeIdx);
         };
         while (peek() !== 0) {
-            callback(peek, consumeValue, consume, nextToConsumeIdx);
+            callback(peek, consumeValue, consume, getChar, nextToConsumeIdx);
         }
     };
     const vnode_getNextSibling = (vnode) => {
@@ -8028,21 +8052,19 @@
         let textIdx = 0;
         let combinedText = null;
         let container = null;
-        processVNodeData(vData, (peek, consumeValue, consume, nextToConsumeIdx) => {
+        processVNodeData(vData, (peek, consumeValue, consume, getChar, nextToConsumeIdx) => {
             if (isNumber(peek())) {
                 // Element counts get encoded as numbers.
-                while (!isElement(child)) {
+                while (!isElement(child) ||
+                    // We pretend that style element's don't exist as they can get moved out.
+                    // skip over style elements, as those need to be moved to the head
+                    // and are not included in the counts.
+                    isQStyleElement(child)) {
                     child = fastNextSibling(child);
                     if (!child) {
                         throw qError(27 /* QError.materializeVNodeDataError */, [vData, peek(), nextToConsumeIdx]);
                     }
                 }
-                // We pretend that style element's don't exist as they can get moved out.
-                while (isQStyleElement(child)) {
-                    // skip over style elements, as those need to be moved to the head
-                    // and are not included in the counts.
-                    child = fastNextSibling(child);
-                }
                 combinedText = null;
                 previousTextNode = null;
                 let value = 0;
@@ -8074,7 +8096,17 @@
                 vnode_setAttr(null, vParent, ELEMENT_PROPS, consumeValue());
             }
             else if (peek() === VNodeDataChar.KEY) {
-                vnode_setAttr(null, vParent, ELEMENT_KEY, consumeValue());
+                const isEscapedValue = getChar(nextToConsumeIdx + 1) === VNodeDataChar.SEPARATOR;
+                let value;
+                if (isEscapedValue) {
+                    consume();
+                    value = decodeURI(consumeValue());
+                    consume();
+                }
+                else {
+                    value = consumeValue();
+                }
+                vnode_setAttr(null, vParent, ELEMENT_KEY, value);
             }
             else if (peek() === VNodeDataChar.SEQ) {
                 vnode_setAttr(null, vParent, ELEMENT_SEQ, consumeValue());
@@ -8120,6 +8152,10 @@
                 vnode_setAttr(null, vParent, QSlot, consumeValue());
             }
             else {
+                // skip over style elements in front of text nodes, where text node is the first child (except the style node)
+                while (isQStyleElement(child)) {
+                    child = fastNextSibling(child);
+                }
                 const textNode = child && fastNodeType(child) === /* Node.TEXT_NODE */ 3 ? child : null;
                 // must be alphanumeric
                 if (combinedText === null) {
@@ -10078,6 +10114,7 @@
     const SerializerSymbol = Symbol('serialize');
 
     // keep these imports above the rest to prevent circular dep issues
+    const resolvedSymbol = Symbol('resolved');
     const createQRL = (chunk, symbol, symbolRef, symbolFn, capture, captureRef) => {
         if (qDev && qSerialize) {
             if (captureRef) {
@@ -10130,9 +10167,6 @@
             };
             return bound;
         }
-        const resolveLazy = (containerEl) => {
-            return symbolRef !== null ? symbolRef : resolve(containerEl);
-        };
         // Wrap functions to provide their lexical scope
         const wrapFn = (fn) => {
             if (typeof fn !== 'function' || (!capture?.length && !captureRef?.length)) {
@@ -10161,45 +10195,58 @@
                 return invoke.call(this, context, fn, ...args);
             };
         };
-        const resolve = async (containerEl) => {
-            if (symbolRef !== null) {
-                // Resolving (Promise) or already resolved (value)
+        // Retrieve memoized result from symbolFn
+        if (symbolFn && resolvedSymbol in symbolFn) {
+            symbolRef = symbolFn[resolvedSymbol];
+        }
+        const resolve = symbolRef
+            ? async () => symbolRef
+            : async (containerEl) => {
+                if (symbolRef !== null) {
+                    // Resolving (Promise) or already resolved (value)
+                    return symbolRef;
+                }
+                if (containerEl) {
+                    setContainer(containerEl);
+                }
+                if (chunk === '') {
+                    // Sync QRL
+                    assertDefined(_containerEl, 'Sync QRL must have container element');
+                    const hash = _containerEl.getAttribute(QInstanceAttr);
+                    const doc = _containerEl.ownerDocument;
+                    const qFuncs = getQFuncs(doc, hash);
+                    // No need to wrap, syncQRLs can't have captured scope
+                    return (qrl.resolved = symbolRef = qFuncs[Number(symbol)]);
+                }
+                if (build.isBrowser && chunk) {
+                    /** We run the QRL, so now the probability of the chunk is 100% */
+                    preloader.p(chunk, 1);
+                }
+                const start = now();
+                const ctx = tryGetInvokeContext();
+                if (symbolFn !== null) {
+                    symbolRef = symbolFn().then((module) => {
+                        const resolved = wrapFn((symbolRef = module[symbol]));
+                        // We memoize the result on the symbolFn
+                        symbolFn[resolvedSymbol] = resolved;
+                        qrl.resolved = resolved;
+                        return resolved;
+                    });
+                }
+                else {
+                    // TODO cache the imported symbol but watch out for dev mode
+                    const imported = getPlatform().importSymbol(_containerEl, chunk, symbol);
+                    symbolRef = maybeThen(imported, (ref) => (qrl.resolved = wrapFn((symbolRef = ref))));
+                }
+                if (isPromise(symbolRef)) {
+                    symbolRef.then(() => emitUsedSymbol(symbol, ctx?.$element$, start), (err) => {
+                        console.error(`qrl ${symbol} failed to load`, err);
+                        // We shouldn't cache rejections, we can try again later
+                        symbolRef = null;
+                    });
+                }
                 return symbolRef;
-            }
-            if (containerEl) {
-                setContainer(containerEl);
-            }
-            if (chunk === '') {
-                // Sync QRL
-                assertDefined(_containerEl, 'Sync QRL must have container element');
-                const hash = _containerEl.getAttribute(QInstanceAttr);
-                const doc = _containerEl.ownerDocument;
-                const qFuncs = getQFuncs(doc, hash);
-                // No need to wrap, syncQRLs can't have captured scope
-                return (qrl.resolved = symbolRef = qFuncs[Number(symbol)]);
-            }
-            if (build.isBrowser && chunk) {
-                /** We run the QRL, so now the probability of the chunk is 100% */
-                preloader.p(chunk, 1);
-            }
-            const start = now();
-            const ctx = tryGetInvokeContext();
-            if (symbolFn !== null) {
-                symbolRef = symbolFn().then((module) => (qrl.resolved = wrapFn((symbolRef = module[symbol]))));
-            }
-            else {
-                const imported = getPlatform().importSymbol(_containerEl, chunk, symbol);
-                symbolRef = maybeThen(imported, (ref) => (qrl.resolved = wrapFn((symbolRef = ref))));
-            }
-            if (typeof symbolRef === 'object' && isPromise(symbolRef)) {
-                symbolRef.then(() => emitUsedSymbol(symbol, ctx?.$element$, start), (err) => {
-                    console.error(`qrl ${symbol} failed to load`, err);
-                    // We shouldn't cache rejections, we can try again later
-                    symbolRef = null;
-                });
-            }
-            return symbolRef;
-        };
+            };
         const createOrReuseInvocationContext = (invoke) => {
             if (invoke == null) {
                 return newInvokeContext();
@@ -10217,7 +10264,6 @@
             getHash: () => hash,
             getCaptured: () => captureRef,
             resolve,
-            $resolveLazy$: resolveLazy,
             $setContainer$: setContainer,
             $chunk$: chunk,
             $symbol$: symbol,
@@ -11058,13 +11104,13 @@
         const styleId = styleKey(styleQrl, i);
         const host = iCtx.$hostElement$;
         set(styleId);
-        const value = styleQrl.$resolveLazy$(iCtx.$element$);
-        if (isPromise(value)) {
-            value.then((val) => iCtx.$container$.$appendStyle$(transform(val, styleId), styleId, host, scoped));
-            throw value;
+        if (styleQrl.resolved) {
+            iCtx.$container$.$appendStyle$(transform(styleQrl.resolved, styleId), styleId, host, scoped);
         }
         else {
-            iCtx.$container$.$appendStyle$(transform(value, styleId), styleId, host, scoped);
+            throw styleQrl
+                .resolve()
+                .then((val) => iCtx.$container$.$appendStyle$(transform(val, styleId), styleId, host, scoped));
         }
         return styleId;
     };
@@ -11355,7 +11401,7 @@
         set(task);
         useRunTask(task, eagerness);
         if (!isServerPlatform()) {
-            qrl.$resolveLazy$(iCtx.$element$);
+            qrl.resolve(iCtx.$element$);
             iCtx.$container$.$scheduler$(32 /* ChoreType.VISIBLE */, task);
         }
     };