@qwik.dev/core 2.0.0-beta.19 → 2.0.0-beta.21

package/dist/core-internal.d.ts

@@ -350,35 +350,34 @@ declare interface AriaAttributes {
 /** @public */
 declare type AriaRole = 'alert' | 'alertdialog' | 'application' | 'article' | 'banner' | 'button' | 'cell' | 'checkbox' | 'columnheader' | 'combobox' | 'complementary' | 'contentinfo' | 'definition' | 'dialog' | 'directory' | 'document' | 'feed' | 'figure' | 'form' | 'grid' | 'gridcell' | 'group' | 'heading' | 'img' | 'link' | 'list' | 'listbox' | 'listitem' | 'log' | 'main' | 'marquee' | 'math' | 'menu' | 'menubar' | 'menuitem' | 'menuitemcheckbox' | 'menuitemradio' | 'navigation' | 'none' | 'note' | 'option' | 'presentation' | 'progressbar' | 'radio' | 'radiogroup' | 'region' | 'row' | 'rowgroup' | 'rowheader' | 'scrollbar' | 'search' | 'searchbox' | 'separator' | 'slider' | 'spinbutton' | 'status' | 'switch' | 'tab' | 'table' | 'tablist' | 'tabpanel' | 'term' | 'textbox' | 'timer' | 'toolbar' | 'tooltip' | 'tree' | 'treegrid' | 'treeitem' | (string & {});
 
-declare type AsyncComputedCtx = {
+declare type AsyncCtx = {
     track: Tracker;
     cleanup: (callback: () => void) => void;
 };
 
 /** @public */
-export declare type AsyncComputedFn<T> = (ctx: AsyncComputedCtx) => Promise<T>;
+export declare type AsyncFn<T> = (ctx: AsyncCtx) => Promise<T>;
+
+declare type AsyncQRL<T> = _QRLInternal<AsyncFn<T>>;
 
 /** @public */
-export declare interface AsyncComputedReadonlySignal<T = unknown> extends ComputedSignal<T> {
+export declare interface AsyncSignal<T = unknown> extends ComputedSignal<T> {
     /** Whether the signal is currently loading. */
     loading: boolean;
     /** The error that occurred while computing the signal. */
-    error: Error | null;
+    error: Error | undefined;
     /** A promise that resolves when the value is computed. */
     promise(): Promise<T>;
 }
 
-/** @public */
-export declare type AsyncComputedReturnType<T> = T extends Promise<infer T> ? AsyncComputedReadonlySignal<T> : AsyncComputedReadonlySignal<T>;
-
 /**
  * # ================================
  *
- * AsyncComputedSignalImpl
+ * AsyncSignalImpl
  *
  * # ================================
  */
-declare class AsyncComputedSignalImpl<T> extends ComputedSignalImpl<T | undefined, AsyncComputeQRL<T>> implements BackRef {
+declare class AsyncSignalImpl<T> extends ComputedSignalImpl<T, AsyncQRL<T>> implements BackRef {
     $untrackedLoading$: boolean;
     $untrackedError$: Error | undefined;
     $loadingEffects$: undefined | Set<EffectSubscription>;
@@ -387,7 +386,7 @@ declare class AsyncComputedSignalImpl<T> extends ComputedSignalImpl<T | undefine
     $promiseValue$: T | typeof NEEDS_COMPUTATION;
     private $promise$;
     [_EFFECT_BACK_REF]: Map<EffectProperty | string, EffectSubscription> | undefined;
-    constructor(container: Container | null, fn: AsyncComputeQRL<T>, flags?: SignalFlags | SerializationSignalFlags);
+    constructor(container: _Container | null, fn: AsyncQRL<T>, flags?: SignalFlags | SerializationSignalFlags);
     /**
      * Loading is true if the signal is still waiting for the promise to resolve, false if the promise
      * has resolved or rejected.
@@ -406,8 +405,6 @@ declare class AsyncComputedSignalImpl<T> extends ComputedSignalImpl<T | undefine
     private setValue;
 }
 
-declare type AsyncComputeQRL<T> = _QRLInternal<AsyncComputedFn<T>>;
-
 /**
  * Replace given element's props with custom types and return all props specific to the element. Use
  * this for known props that are incorrect or missing.
@@ -434,12 +431,21 @@ declare type BivariantQrlFn<ARGS extends any[], RETURN> = {
 /** @public */
 declare type Booleanish = boolean | `${boolean}`;
 
+/**
+ * The current captured scope during QRL invocation. This is used to provide the lexical scope for
+ * QRL functions. It is used one time per invocation, synchronously, so it is safe to store it in
+ * module scope.
+ *
+ * @internal
+ */
+export declare let _captures: Readonly<unknown[]> | null;
+
 /**
  * Handles events for bind:checked
  *
  * @internal
  */
-export declare const _chk: (_: any, element: HTMLInputElement) => void;
+export declare function _chk(this: string | undefined, _: any, element: HTMLInputElement): void;
 
 declare const enum ChoreBits {
     NONE = 0,
@@ -466,7 +472,7 @@ declare const enum ChoreBits {
 export declare type ClassList = string | undefined | null | false | Record<string, boolean | string | number | null | undefined> | ClassList[];
 
 /** @internal */
-export declare interface ClientContainer extends Container {
+export declare interface ClientContainer extends _Container {
     document: _QDocument;
     element: _ContainerElement;
     qContainer: string;
@@ -501,11 +507,11 @@ export declare interface ClientContainer extends Container {
  *   step?: number;
  * }
  * export const Counter = component$((props: CounterProps) => {
- *   const state = useStore({ count: props.initialValue || 0 });
+ *   const state = useSignal(props.initialValue || 0);
  *   return (
  *     <div>
- *       <span>{state.count}</span>
- *       <button onClick$={() => (state.count += props.step || 1)}>+</button>
+ *       <span>{state.value}</span>
+ *       <button onClick$={() => (state.value += props.step || 1)}>+</button>
  *     </div>
  *   );
  * });
@@ -575,7 +581,7 @@ export declare type ComputedFn<T> = () => T;
 /** @public */
 export declare interface ComputedOptions {
     serializationStrategy?: SerializationStrategy;
-    container?: Container;
+    container?: _Container;
 }
 
 /** @public */
@@ -616,7 +622,7 @@ declare class ComputedSignalImpl<T, S extends _QRLInternal = ComputeQRL<T>> exte
     $computeQrl$: S;
     $flags$: SignalFlags | SerializationSignalFlags;
     [_EFFECT_BACK_REF]: Map<EffectProperty | string, EffectSubscription> | undefined;
-    constructor(container: Container | null, fn: S, flags?: SignalFlags | SerializationSignalFlags);
+    constructor(container: _Container | null, fn: S, flags?: SignalFlags | SerializationSignalFlags);
     invalidate(): void;
     /**
      * Use this to force running subscribers, for example when the calculated value has mutated but
@@ -625,8 +631,6 @@ declare class ComputedSignalImpl<T, S extends _QRLInternal = ComputeQRL<T>> exte
     force(): void;
     get untrackedValue(): T;
     $computeIfNeeded$(): void;
-    set value(_: any);
-    get value(): any;
 }
 
 declare type ComputeQRL<T> = _QRLInternal<ComputedFn<T>>;
@@ -645,7 +649,8 @@ export declare const _CONST_PROPS: unique symbol;
  */
 declare type Consumer = Task | _VNode | SignalImpl | ISsrNode;
 
-declare interface Container {
+/** @internal */
+export declare interface _Container {
     readonly $version$: string;
     readonly $storeProxyMap$: ObjToProxyMap;
     readonly $locale$: string;
@@ -801,7 +806,7 @@ export declare interface CorePlatform {
      * @param symbol - The name of the symbol to import.
      * @returns A promise that resolves to the imported symbol.
      */
-    importSymbol: (containerEl: Element | undefined, url: string | URL | undefined | null, symbol: string) => ValueOrPromise<any>;
+    importSymbol: (containerEl: Element | undefined, url: string | URL | undefined | null, symbol: string) => ValueOrPromise<unknown>;
     /**
      * Perform operation on next request-animation-frame.
      *
@@ -839,10 +844,10 @@ export declare interface CorrectedToggleEvent extends Event {
  *
  * @public
  */
-export declare const createAsyncComputed$: <T>(qrl: () => Promise<T>, options?: ComputedOptions) => AsyncComputedReturnType<T>;
+export declare const createAsync$: <T>(qrl: () => Promise<T>, options?: ComputedOptions) => AsyncSignal<T>;
 
 /** @internal */
-export declare const createAsyncComputedQrl: <T>(qrl: QRL<(ctx: AsyncComputedCtx) => Promise<T>>, options?: ComputedOptions) => AsyncComputedSignalImpl<T>;
+export declare const createAsyncQrl: <T>(qrl: QRL<(ctx: AsyncCtx) => Promise<T>>, options?: ComputedOptions) => AsyncSignalImpl<T>;
 
 /**
  * Create a computed signal which is calculated from the given QRL. A computed signal is a signal
@@ -852,7 +857,7 @@ export declare const createAsyncComputedQrl: <T>(qrl: QRL<(ctx: AsyncComputedCtx
  * The QRL must be a function which returns the value of the signal. The function must not have side
  * effects, and it must be synchronous.
  *
- * If you need the function to be async, use `useAsyncComputed$` instead.
+ * If you need the function to be async, use `useAsync$` instead.
  *
  * @public
  */
@@ -964,10 +969,9 @@ declare interface DescriptorBase<T = unknown, B = unknown> extends BackRef {
  * Deserialize data from string to an array of objects.
  *
  * @param rawStateData - Data to deserialize
- * @param element - Container element
  * @internal
  */
-export declare function _deserialize(rawStateData: string | null, element?: unknown): unknown[];
+export declare function _deserialize(rawStateData: string | null): unknown[];
 
 declare interface DeserializeContainer {
     $getObjectById$: (id: number | string) => unknown;
@@ -1021,7 +1025,7 @@ declare class DomContainer extends _SharedContainer implements ClientContainer {
      */
     $hoistStyles$(): void;
     $setRawState$(id: number, vParent: _VNode): void;
-    parseQRL<T = unknown>(qrl: string): QRL<T>;
+    parseQRL<T = unknown>(qrlStr: string): QRL<T>;
     handleError(err: any, host: _VNode | null): void;
     setContext<T>(host: _VNode, context: ContextId<T>, value: T): void;
     resolveContext<T>(host: _VNode, contextId: ContextId<T>): T | undefined;
@@ -1185,13 +1189,13 @@ export declare type FunctionComponent<P = unknown> = {
 export declare const _getConstProps: (props: PropsProxy | Record<string, unknown> | null | undefined) => Props | null;
 
 /** @internal */
-export declare const _getContextContainer: () => ClientContainer | undefined;
+export declare const _getContextContainer: () => _Container | undefined;
 
 /** @internal */
-export declare const _getContextElement: () => unknown;
+export declare const _getContextEvent: () => unknown;
 
 /** @internal */
-export declare const _getContextEvent: () => unknown;
+export declare const _getContextHostElement: () => HostElement | undefined;
 
 /** @public */
 declare function getDomContainer(element: Element): ClientContainer;
@@ -1384,10 +1388,10 @@ export declare const implicit$FirstArg: <FIRST, REST extends any[], RET>(fn: (qr
  * @param lexicalScopeCapture - A set of lexically scoped variables to capture.
  * @public
  */
-export declare const inlinedQrl: <T>(symbol: T | null, symbolName: string, lexicalScopeCapture?: any[]) => QRL<T>;
+export declare const inlinedQrl: <T>(symbol: T | null, symbolName: string, lexicalScopeCapture?: Readonly<unknown[]>) => QRL<T>;
 
 /** @internal */
-export declare const inlinedQrlDEV: <T = any>(symbol: T, symbolName: string, opts: QRLDev, lexicalScopeCapture?: any[]) => QRL<T>;
+export declare const inlinedQrlDEV: <T = any>(symbol: T, symbolName: string, opts: QRLDev, lexicalScopeCapture?: Readonly<unknown[]>) => QRL<T>;
 
 /** @public */
 declare interface InlineEntryStrategy {
@@ -1419,20 +1423,15 @@ declare type IntrinsicSVGElements = {
 
 /** The shared state during an invoke() call */
 declare interface InvokeContext {
-    $url$: URL | undefined;
     /** The Virtual parent component for the current component code */
     $hostElement$: HostElement | undefined;
     /** The event we're currently handling */
     $event$: PossibleEvents | undefined;
-    /** The QRL function we're currently executing */
-    $qrl$: QRL | undefined;
     $effectSubscriber$: EffectSubscription | undefined;
     $locale$: string | undefined;
-    $container$: Container | undefined;
+    $container$: _Container | undefined;
 }
 
-declare type InvokeTuple = [Element, Event, URL?];
-
 declare type IsAcceptableDOMValue<T> = T extends boolean | number | string | null | undefined ? ((...args: any[]) => any) extends T ? false : true : false;
 
 declare type IsAny<T> = 0 extends T & 1 ? true : false;
@@ -1585,7 +1584,7 @@ export declare interface JSXNodeInternal<T extends string | FunctionComponent |
      *
      * Does not contain `children` or `key`.
      *
-     * `onEvent$` props are normalized to the html `on:event` version
+     * `onEvent$` props are normalized to the html `q-x:event` version
      */
     varProps: Props;
     /**
@@ -1595,7 +1594,7 @@ export declare interface JSXNodeInternal<T extends string | FunctionComponent |
      *
      * Does not contain `children` or `key`.
      *
-     * `onEvent$` props are normalized to the html `on:event` version
+     * `onEvent$` props are normalized to the html `q-x:event` version
      */
     constProps: Props | null;
     /** The children of the node */
@@ -1781,10 +1780,10 @@ declare interface NodePropData {
 }
 
 /** @internal */
-export declare const _noopQrl: <T>(symbolName: string, lexicalScopeCapture?: any[]) => QRL<T>;
+export declare const _noopQrl: <T>(symbolName: string, lexicalScopeCapture?: Readonly<unknown[]>) => QRL<T>;
 
 /** @internal */
-export declare const _noopQrlDEV: <T>(symbolName: string, opts: QRLDev, lexicalScopeCapture?: any[]) => QRL<T>;
+export declare const _noopQrlDEV: <T>(symbolName: string, opts: QRLDev, lexicalScopeCapture?: Readonly<unknown[]>) => QRL<T>;
 
 /**
  * Returned type of the `noSerialize()` function. It will be TYPE or undefined.
@@ -1997,7 +1996,7 @@ declare type PropsProxy = {
 declare class PropsProxyHandler implements ProxyHandler<any> {
     owner: JSXNodeImpl;
     $effects$: undefined | Map<string | symbol, Set<EffectSubscription>>;
-    $container$: Container | null;
+    $container$: _Container | null;
     constructor(owner: JSXNodeImpl);
     get(_: any, prop: string | symbol): any;
     set(_: any, prop: string | symbol, value: any): boolean;
@@ -2123,7 +2122,7 @@ export declare interface _QDocument extends Document {
  *
  * ```
  * <div q:base="/build/">
- *   <button on:click="./chunk-abc.js#onClick">...</button>
+ *   <button q-e:click="./chunk-abc.js#onClick">...</button>
  * </div>
  * ```
  *
@@ -2146,7 +2145,7 @@ export declare interface _QDocument extends Document {
  */
 export declare type QRL<TYPE = unknown> = {
     __qwik_serializable__?: any;
-    __brand__QRL__: TYPE;
+    __brand__QRL__?: TYPE;
     /** Resolve the QRL and return the actual value. */
     resolve(): Promise<TYPE>;
     /** The resolved value, once `resolve()` returns. */
@@ -2169,7 +2168,7 @@ export declare type QRL<TYPE = unknown> = {
  * @public
  * @see `QRL`, `$(...)`
  */
-export declare const qrl: <T = any>(chunkOrFn: string | (() => Promise<any>), symbol: string, lexicalScopeCapture?: any[], stackOffset?: number) => QRL<T>;
+export declare const qrl: <T = any>(chunkOrFn: string | (() => Promise<any>), symbol: string, lexicalScopeCapture?: Readonly<unknown[]> | null, stackOffset?: number) => QRL<T>;
 
 declare type QrlArgs<T> = T extends (...args: infer ARGS) => any ? ARGS : unknown[];
 
@@ -2181,7 +2180,7 @@ declare interface QRLDev {
 }
 
 /** @internal */
-export declare const qrlDEV: <T = any>(chunkOrFn: string | (() => Promise<any>), symbol: string, opts: QRLDev, lexicalScopeCapture?: any[]) => QRL<T>;
+export declare const qrlDEV: <T = any>(chunkOrFn: string | (() => Promise<any>), symbol: string, opts: QRLDev, lexicalScopeCapture?: Readonly<unknown[]>) => QRL<T>;
 
 /**
  * An event handler for Qwik events, can be a handler QRL or an array of handler QRLs.
@@ -2197,16 +2196,22 @@ declare type QRLInternalMethods<TYPE> = {
     readonly $chunk$: string | null;
     readonly $symbol$: string;
     readonly $hash$: string;
-    $capture$: string[] | null;
-    $captureRef$: unknown[] | null;
+    /** If it's a string it's serialized */
+    $captures$: Readonly<unknown[]> | string | null;
     dev: QRLDev | null;
+    resolve(container?: _Container): Promise<TYPE>;
     resolved: undefined | 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;
+    getFn(currentCtx?: InvokeContext, beforeFn?: () => void): TYPE extends (...args: any) => any ? (...args: Parameters<TYPE>) => ValueOrPromise<ReturnType<TYPE>> : unknown;
+    /**
+     * Needed for deserialization and importing. We don't always have the container while creating
+     * qrls in async sections of code
+     */
+    $container$: _Container | null;
+    /** Only in dev mode */
+    $symbolRef$?: null | ValueOrPromise<TYPE>;
 };
 
 declare type QrlReturn<T> = T extends (...args: any) => infer R ? Awaited<R> : unknown;
@@ -2490,8 +2495,6 @@ export declare type QwikSymbolEvent = CustomEvent<{
     element: Element;
     reqTime: number;
     qBase?: string;
-    qManifest?: string;
-    qVersion?: string;
     href?: string;
 }>;
 
@@ -2731,11 +2734,11 @@ declare interface ResourceReturnInternal<T> {
 export declare const _restProps: (props: PropsProxy, omit?: string[], target?: Props) => Props;
 
 /**
- * This is called by qwik-loader to run a QRL. It has to be synchronous.
+ * This is called by qwik-loader to run a QRL. It has to be synchronous when possible.
  *
  * @internal
  */
-export declare const _run: (...args: unknown[]) => ValueOrPromise<unknown>;
+export declare function _run(this: string, event: Event, element: Element): ValueOrPromise<unknown>;
 
 /** Stores the location of an object. If no parent, it's a root. */
 declare type SeenRef = {
@@ -2792,8 +2795,8 @@ declare interface SerializationContext {
 }
 
 declare const enum SerializationSignalFlags {
-    SERIALIZATION_STRATEGY_NEVER = 16,
-    SERIALIZATION_STRATEGY_ALWAYS = 32
+    SERIALIZATION_STRATEGY_NEVER = 8,
+    SERIALIZATION_STRATEGY_ALWAYS = 16
 }
 
 /** @public */
@@ -2868,7 +2871,7 @@ declare interface SerializerSignal<T> extends ComputedSignal<T> {
  * @public
  */
 declare class SerializerSignalImpl<T, S> extends ComputedSignalImpl<T> {
-    constructor(container: Container | null, argQrl: _QRLInternal<SerializerArg<T, S>>);
+    constructor(container: _Container | null, argQrl: _QRLInternal<SerializerArg<T, S>>);
     $didInitialize$: boolean;
     $computeIfNeeded$(): void;
 }
@@ -2911,7 +2914,7 @@ declare type ServerQwikManifest = Pick<QwikManifest, 'manifestHash' | 'injection
 export declare const setPlatform: (plt: CorePlatform) => CorePlatform;
 
 /** @internal */
-export declare abstract class _SharedContainer implements Container {
+export declare abstract class _SharedContainer implements _Container {
     readonly $version$: string;
     readonly $storeProxyMap$: ObjToProxyMap;
     readonly $locale$: string;
@@ -2970,9 +2973,9 @@ declare class SignalImpl<T = any> implements Signal<T> {
     $untrackedValue$: T;
     /** Store a list of effects which are dependent on this signal. */
     $effects$: undefined | Set<EffectSubscription>;
-    $container$: Container | null;
+    $container$: _Container | null;
     $wrappedSignal$: WrappedSignalImpl<T> | null;
-    constructor(container: Container | null, value: T);
+    constructor(container: _Container | null, value: T);
     /**
      * Use this to force running subscribers, for example when the calculated value has mutated but
      * remained the same object
@@ -2989,6 +2992,8 @@ declare class SignalImpl<T = any> implements Signal<T> {
     };
 }
 
+declare type SimpleSsrAttrValue = string | Signal<SimpleSsrAttrValue> | boolean | object | null;
+
 declare interface SimplifiedServerRequestEvent<T = unknown> {
     url: URL;
     locale: string | undefined;
@@ -3268,14 +3273,14 @@ declare type SsrAttrKey = string;
 
 declare type SsrAttrs = Array<SsrAttrKey | SsrAttrValue>;
 
-declare type SsrAttrValue = string | Signal<any> | Promise<any> | boolean | object | null;
+declare type SsrAttrValue = SimpleSsrAttrValue | Promise<SimpleSsrAttrValue>;
 
 /** @public */
 export declare const SSRComment: FunctionComponent<{
     data: string;
 }>;
 
-declare interface SSRContainer extends Container {
+declare interface SSRContainer extends _Container {
     readonly tag: string;
     readonly isHtml: boolean;
     readonly size: number;
@@ -3689,11 +3694,12 @@ declare class Task<T = unknown, B = T> extends BackRef implements DescriptorBase
 }
 
 /**
- * Used internally as a qrl event handler to schedule a task.
+ * Used internally as a qwikloader event handler to schedule a task. The `this` context is the
+ * captures part of the QRL, provided by qwikloader.
  *
  * @internal
  */
-export declare const _task: (_event: Event, element: Element) => void;
+export declare function _task(this: string, _event: Event, element: Element): void;
 
 /** @public */
 export declare interface TaskCtx {
@@ -3738,6 +3744,8 @@ export declare class _TextVNode extends _VNode {
  *   useTask$(({ track }) => {
  *     // Any signals or stores accessed inside the task will be tracked
  *     const count = track(() => store.count);
+ *     // For stores you can also pass the store and specify the property
+ *     track(store, 'count');
  *     // You can also pass a signal to track() directly
  *     const signalCount = track(signal);
  *     store.doubleCount = count + signalCount;
@@ -3832,19 +3840,30 @@ declare type UnwantedKeys = keyof HTMLAttributesBase | keyof DOMAttributes<any>
 export declare const unwrapStore: <T>(value: T) => T;
 
 /**
- * Creates a computed signal which is calculated from the given function. A computed signal is a
- * signal which is calculated from other signals. When the signals change, the computed signal is
- * recalculated, and if the result changed, all tasks which are tracking the signal will be re-run
- * and all components that read the signal will be re-rendered.
+ * Creates an AsyncSignal which holds the result of the given async function. If the function uses
+ * `track()` to track reactive state, and that state changes, the AsyncSignal is recalculated, and
+ * if the result changed, all tasks which are tracking the AsyncSignal will be re-run and all
+ * subscribers (components, tasks etc) that read the AsyncSignal will be updated.
  *
- * The function must be synchronous and must not have any side effects.
+ * If the async function throws an error, the AsyncSignal will capture the error and set the `error`
+ * property. The error can be cleared by re-running the async function successfully.
+ *
+ * While the async function is running, the `loading` property will be set to `true`. Once the
+ * function completes, `loading` will be set to `false`.
+ *
+ * If the value has not yet been resolved, reading the AsyncSignal will throw a Promise, which will
+ * retry the component or task once the value resolves.
+ *
+ * If the value has been resolved, but the async function is re-running, reading the AsyncSignal
+ * will subscribe to it and return the last resolved value until the new value is ready. As soon as
+ * the new value is ready, the subscribers will be updated.
  *
  * @public
  */
-export declare const useAsyncComputed$: <T>(qrl: AsyncComputedFn<T>, options?: ComputedOptions | undefined) => AsyncComputedReturnType<T>;
+export declare const useAsync$: <T>(qrl: AsyncFn<T>, options?: ComputedOptions | undefined) => AsyncSignal<T>;
 
 /** @internal */
-export declare const useAsyncComputedQrl: <T>(qrl: QRL<AsyncComputedFn<T>>, options?: ComputedOptions) => AsyncComputedReturnType<T>;
+export declare const useAsyncQrl: <T>(qrl: QRL<AsyncFn<T>>, options?: ComputedOptions) => AsyncSignal<T>;
 
 /**
  * Creates a computed signal which is calculated from the given function. A computed signal is a
@@ -3865,11 +3884,23 @@ export declare const useComputedQrl: <T>(qrl: QRL<ComputedFn<T>>, options?: Comp
  * Stores a value which is retained for the lifetime of the component. Subsequent calls to
  * `useConstant` will always return the first value given.
  *
- * If the value is a function, the function is invoked once to calculate the actual value.
+ * If the value is a function, the function is invoked once to calculate the actual value. You can
+ * then also pass arguments to call the function with, so that you don't need to create a new
+ * function on every render.
+ *
+ * @example
+ *
+ * ```tsx
+ * const fixedRandomValue = useConstant(() => Math.random);
+ * const otherFixedRandomValue = useConstant(Math.random);
+ *
+ * const getConfig = (env: string) => { ... }
+ * const config = useConstant(getConfig, environment);
+ * ```
  *
  * @public
  */
-export declare const useConstant: <T>(value: (() => T) | T) => T;
+export declare const useConstant: <T, A extends any[]>(value: ((...args: A) => T) | T, ...args: A) => T;
 
 declare interface UseContext {
     <STATE, T>(context: ContextId<STATE>, transformer: (value: STATE) => T): T;
@@ -3992,6 +4023,7 @@ export declare const useId: () => string;
  * NOTE: `useLexicalScope` method can only be used in the synchronous portion of the callback
  * (before any `await` statements.)
  *
+ * @deprecated Read from `_captures` directly instead.
  * @internal
  */
 export declare const useLexicalScope: <VARS extends any[]>() => VARS;
@@ -4191,7 +4223,7 @@ export declare const useResourceQrl: <T>(qrl: QRL<ResourceFn<T>>, opts?: Resourc
 export declare const useSerializer$: typeof createSerializer$;
 
 /** @internal */
-export declare const useSerializerQrl: <T, S>(qrl: QRL<SerializerArg<T, S>>) => ComputedSignal<unknown>;
+export declare const useSerializerQrl: <T, S>(qrl: QRL<SerializerArg<T, S>>) => SerializerSignalImpl<T, S>;
 
 /** @public */
 export declare function useServerData<T>(key: string): T | undefined;
@@ -4205,14 +4237,61 @@ export declare interface UseSignal {
     <T>(value: T | (() => T)): Signal<T>;
 }
 
-/** @public */
+/**
+ * Creates an object with a single reactive `.value` property, that Qwik can track across
+ * serializations.
+ *
+ * Use it to create state for your application. The object has a getter and setter to track reads
+ * and writes of the `.value` property. When the value changes, any functions that read from it will
+ * re-run.
+ *
+ * Prefer `useSignal` over `useStore` when possible, as it is more efficient.
+ *
+ * ### Example
+ *
+ * ```tsx
+ * const Signals = component$(() => {
+ *   const counter = useSignal(1);
+ *   const text = useSignal('changeme');
+ *   const toggle = useSignal(false);
+ *
+ *   // useSignal() can also accept a function to calculate the initial value
+ *   const state = useSignal(() => {
+ *     return expensiveInitialValue();
+ *   });
+ *
+ *   return (
+ *     <div>
+ *       <button onClick$={() => counter.value++}>Counter: {counter.value}</button>
+ *       {
+ *         // pass signal values as the value, the optimizer will make it pass the signal
+ *       }
+ *       <Child state={state.value} />
+ *       {
+ *         // signals can be bound to inputs. A property named `bind:x` implies that the property
+ * is a signal
+ *       }
+ *       <input type="text" bind:value={text} />
+ *       <input type="checkbox" bind:checked={toggle} />
+ *     </div>
+ *   );
+ * });
+ * ```
+ *
+ * @public
+ */
 export declare const useSignal: UseSignal;
 
 /**
- * Creates an object that Qwik can track across serializations.
+ * Creates a reactive object that Qwik can track across serialization.
+ *
+ * Use it to create state for your application. The returned object is a Proxy that tracks reads and
+ * writes. When any of the properties change, the functions that read those properties will re-run.
+ *
+ * `Store`s are deep by default, meaning that any objects assigned to properties will also become
+ * `Store`s. This includes arrays.
  *
- * Use `useStore` to create a state for your application. The returned object is a proxy that has a
- * unique ID. The ID of the object is used in the `QRL`s to refer to the store.
+ * Prefer `useSignal` over `useStore` when possible, as it is more efficient.
  *
  * ### Example
  *
@@ -4430,7 +4509,7 @@ export declare const useVisibleTaskQrl: (qrl: QRL<TaskFn>, opts?: OnVisibleTaskO
  *
  * @internal
  */
-export declare const _val: (_: any, element: HTMLInputElement) => void;
+export declare function _val(this: string | undefined, _: any, element: HTMLInputElement): void;
 
 /**
  * Type representing a value which is either resolve or a promise.
@@ -4446,7 +4525,7 @@ export declare const _VAR_PROPS: unique symbol;
 export declare const _verifySerializable: <T>(value: T, preMessage?: string) => T;
 
 /**
- * 2.0.0-beta.19-dev+0d046fb
+ * 2.0.0-beta.21-dev+c008e88
  *
  * @public
  */
@@ -4480,10 +4559,10 @@ export declare abstract class _VNode implements BackRef {
 }
 
 /** @internal */
-export declare const _vnode_ensureElementInflated: (vnode: _VNode) => void;
+export declare const _vnode_ensureElementInflated: (container: _Container, vnode: _VNode) => void;
 
 /** @internal */
-export declare const _vnode_getAttrKeys: (vnode: _ElementVNode | _VirtualVNode) => string[];
+export declare const _vnode_getAttrKeys: (container: _Container, vnode: _ElementVNode | _VirtualVNode) => string[];
 
 /** @internal */
 export declare const _vnode_getFirstChild: (vnode: _VNode) => _VNode | null;
@@ -4498,7 +4577,7 @@ export declare const _vnode_isTextVNode: (vNode: _VNode) => vNode is _TextVNode;
 export declare const _vnode_isVirtualVNode: (vNode: _VNode) => vNode is _VirtualVNode;
 
 /** @internal */
-export declare function _vnode_toString(this: _VNode | null, depth?: number, offset?: string, materialize?: boolean, siblings?: boolean, colorize?: boolean): string;
+export declare function _vnode_toString(this: _VNode | null, depth?: number, offset?: string, materialize?: boolean, siblings?: boolean, colorize?: boolean, container?: ClientContainer | null): string;
 
 /**
  * Array of numbers which describes virtual nodes in the tree.
@@ -4573,16 +4652,18 @@ export declare const enum _VNodeFlags {
     Inflated = 8,
     Resolved = 16,
     Deleted = 32,
-    Cursor = 64,
-    NAMESPACE_MASK = 384,
-    NEGATED_NAMESPACE_MASK = -385,
+    HasIterationItems = 64,
+    InflatedIterationItems = 128,
+    Cursor = 256,
+    NAMESPACE_MASK = 1536,
+    NEGATED_NAMESPACE_MASK = -1537,
     NS_html = 0,// http://www.w3.org/1999/xhtml
-    NS_svg = 128,// http://www.w3.org/2000/svg
-    NS_math = 256
+    NS_svg = 512,// http://www.w3.org/2000/svg
+    NS_math = 1024
 }
 
 /** @internal */
-export declare const _waitUntilRendered: (elm: Element) => Promise<void>;
+export declare const _waitUntilRendered: (container: _Container) => Promise<void>;
 
 /** @internal */
 export declare function _walkJSX(ssr: SSRContainer, value: JSXOutput, options: {
@@ -4610,7 +4691,7 @@ declare class WrappedSignalImpl<T> extends SignalImpl<T> implements BackRef {
     $flags$: AllSignalFlags;
     $hostElement$: HostElement | undefined;
     [_EFFECT_BACK_REF]: Map<EffectProperty | string, EffectSubscription> | undefined;
-    constructor(container: Container | null, fn: (...args: any[]) => T, args: any[], fnStr: string | null, flags?: SignalFlags);
+    constructor(container: _Container | null, fn: (...args: any[]) => T, args: any[], fnStr: string | null, flags?: SignalFlags);
     invalidate(): void;
     /**
      * Use this to force running subscribers, for example when the calculated value has mutated but