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

package/dist/build/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qwik.dev/core/build",
-  "version": "2.0.0-alpha.8-dev+66037b5",
+  "version": "2.0.0-alpha.9-dev+56ed5bd",
   "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-alpha.8-dev+66037b5
+ * @qwik.dev/core/cli 2.0.0-alpha.9-dev+56ed5bd
  * 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-alpha.8-dev+66037b5");
+  console.log("2.0.0-alpha.9-dev+56ed5bd");
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/core-internal.d.ts

@@ -2,7 +2,10 @@ import * as CSS_2 from 'csstype';
 import { isBrowser } from './build';
 import { isDev } from './build';
 import { isServer } from './build';
+import { QRL as QRL_2 } from './qrl.public';
+import { ReadonlySignal as ReadonlySignal_2 } from '..';
 import type { StreamWriter as StreamWriter_2 } from '.';
+import { ValueOrPromise as ValueOrPromise_2 } from '..';
 
 /**
  * Qwik Optimizer marker function.
@@ -87,6 +90,7 @@ declare type AllEventMapRaw = HTMLElementEventMap & DocumentEventMap & WindowEve
     qinit: QwikInitEvent;
     qsymbol: QwikSymbolEvent;
     qvisible: QwikVisibleEvent;
+    qviewTransition: QwikViewTransitionEvent;
 };
 
 declare type AllEventsMap = Omit<AllEventMapRaw, keyof EventCorrectionMap> & EventCorrectionMap;
@@ -413,7 +417,6 @@ export declare interface ClientContainer extends Container {
     document: _QDocument;
     element: _ContainerElement;
     qContainer: string;
-    qBase: string;
     $locale$: string;
     qManifestHash: string;
     rootVNode: _ElementVNode;
@@ -528,6 +531,37 @@ export declare interface ComputedSignal<T> extends ReadonlySignal<T> {
     force(): void;
 }
 
+/**
+ * A signal which is computed from other signals.
+ *
+ * The value is available synchronously, but the computation is done lazily.
+ */
+declare class ComputedSignalImpl<T> extends SignalImpl<T> implements BackRef {
+    /**
+     * The compute function is stored here.
+     *
+     * The computed functions must be executed synchronously (because of this we need to eagerly
+     * resolve the QRL during the mark dirty phase so that any call to it will be synchronous). )
+     */
+    $computeQrl$: ComputeQRL<T>;
+    $flags$: SignalFlags;
+    $forceRunEffects$: boolean;
+    [_EFFECT_BACK_REF]: Map<EffectProperty | string, EffectSubscription> | null;
+    constructor(container: Container | null, fn: ComputeQRL<T>, flags?: SignalFlags);
+    $invalidate$(): void;
+    /**
+     * Use this to force running subscribers, for example when the calculated value has mutated but
+     * remained the same object
+     */
+    force(): void;
+    get untrackedValue(): T;
+    $computeIfNeeded$(): boolean;
+    set value(_: any);
+    get value(): any;
+}
+
+declare type ComputeQRL<T> = QRLInternal<() => T>;
+
 /** @internal */
 export declare const _CONST_PROPS: unique symbol;
 
@@ -540,7 +574,7 @@ export declare const _CONST_PROPS: unique symbol;
  * - `VNode` and `ISsrNode`: Either a component or `<Signal>`
  * - `Signal2`: A derived signal which contains a computation function.
  */
-declare type Consumer = Task | _VNode | ISsrNode | Signal_2;
+declare type Consumer = Task | _VNode | ISsrNode | SignalImpl;
 
 declare interface Container {
     readonly $version$: string;
@@ -550,6 +584,7 @@ declare interface Container {
     readonly $getObjectById$: (id: number | string) => any;
     readonly $serverData$: Record<string, any>;
     $currentUniqueId$: number;
+    $buildBase$: string | null;
     handleError(err: any, $host$: HostElement): void;
     getParentHost(host: HostElement): HostElement | null;
     setContext<T>(host: HostElement, context: ContextId<T>, value: T): void;
@@ -735,7 +770,7 @@ export declare interface CorrectedToggleEvent extends Event {
  * recalculated.
  *
  * The QRL must be a function which returns the value of the signal. The function must not have side
- * effects, and it mus be synchronous.
+ * effects, and it must be synchronous.
  *
  * If you need the function to be async, use `useSignal` and `useTask$` instead.
  *
@@ -744,7 +779,7 @@ export declare interface CorrectedToggleEvent extends Event {
 export declare const createComputed$: <T>(qrl: () => T) => T extends Promise<any> ? never : ComputedSignal<T>;
 
 /** @internal */
-export declare const createComputedQrl: <T>(qrl: QRL<() => T>) => T extends Promise<any> ? never : ComputedSignal<T>;
+export declare const createComputedQrl: <T>(qrl: QRL<() => T>) => ComputedSignalImpl<T>;
 
 /**
  * Create a context ID to be used in your application. The name should be written with no spaces.
@@ -811,6 +846,21 @@ declare const createScheduler: (container: Container, scheduleDrain: () => void,
     (type: ChoreType.CLEANUP_VISIBLE, task: Task): ValueOrPromise<JSXOutput>;
 };
 
+/**
+ * Create a signal that holds a custom serializable value. See {@link useSerializer$} for more
+ * details.
+ *
+ * @public
+ */
+export declare const createSerializer$: <T, S>(arg: SerializerArg<T, S>) => T extends Promise<any> ? never : SerializerSignal<T>;
+
+/** @internal */
+export declare const createSerializerQrl: <T, S>(arg: QRL<{
+    serialize: (data: S | undefined) => T;
+    deserialize: (data: T) => S;
+    initial?: S;
+}>) => SerializerSignalImpl<T, S>;
+
 /**
  * Creates a Signal with the given value. If no value is given, the signal is created with
  * `undefined`.
@@ -874,7 +924,6 @@ declare interface DOMAttributesBase<EL extends Element> extends QwikIntrinsicAtt
 declare class DomContainer extends _SharedContainer implements ClientContainer {
     element: _ContainerElement;
     qContainer: string;
-    qBase: string;
     qManifestHash: string;
     rootVNode: _ElementVNode;
     document: _QDocument;
@@ -903,6 +952,8 @@ declare class DomContainer extends _SharedContainer implements ClientContainer {
     $getObjectById$: (id: number | string) => unknown;
     getSyncFn(id: number): (...args: unknown[]) => unknown;
     $appendStyle$(content: string, styleId: string, host: _VirtualVNode, scoped: boolean): void;
+    /** Set the server data for the Qwik Router. */
+    private $setServerData$;
 }
 export { DomContainer }
 export { DomContainer as _DomContainer }
@@ -966,7 +1017,7 @@ Consumer,
 // EffectSubscriptionProp.CONSUMER
 EffectProperty | string,
 // EffectSubscriptionProp.PROPERTY or string for attributes
-Set<Signal_2 | TargetType> | null,
+Set<SignalImpl | TargetType> | null,
 // EffectSubscriptionProp.BACK_REF
 _EffectData | null
 ];
@@ -1001,7 +1052,7 @@ export declare interface ErrorBoundaryStore {
 }
 
 /** @public */
-export declare const event$: <T>(qrl: T) => QRL<T>;
+export declare const event$: <T>(qrl: T) => QRL_2<T>;
 
 declare type EventCorrectionMap = {
     auxclick: PointerEvent;
@@ -1548,6 +1599,14 @@ export declare type NoSerialize<T> = (T & {
  */
 export declare const noSerialize: <T extends object | undefined>(input: T) => NoSerialize<T>;
 
+/**
+ * If an object has this property, it will not be serialized. Use this on prototypes to avoid having
+ * to call `noSerialize()` on every object.
+ *
+ * @public
+ */
+export declare const NoSerializeSymbol: unique symbol;
+
 /** @public */
 declare type Numberish = number | `${number}`;
 
@@ -2070,6 +2129,9 @@ export declare type QwikTransitionEvent<T = Element> = NativeTransitionEvent;
 /** @public @deprecated Use `UIEvent` and use the second argument to the handler function for the current event target */
 export declare type QwikUIEvent<T = Element> = NativeUIEvent;
 
+/** Emitted by qwik-core on document when the a view transition start @public */
+declare type QwikViewTransitionEvent = CustomEvent<ViewTransition>;
+
 /** Emitted by qwik-loader when an element becomes visible. Used by `useVisibleTask$` @public */
 export declare type QwikVisibleEvent = CustomEvent<IntersectionObserverEntry>;
 
@@ -2274,7 +2336,7 @@ export declare const _restProps: (props: PropsProxy, omit: string[], target?: Pr
  *
  * @internal
  */
-export declare const _run: (...args: unknown[]) => ValueOrPromise<void>;
+export declare const _run: (...args: unknown[]) => ValueOrPromise_2<void>;
 
 declare type Scheduler = ReturnType<typeof createScheduler>;
 
@@ -2335,6 +2397,90 @@ declare interface SerializationContext {
  */
 export declare function _serialize(data: unknown[]): Promise<string>;
 
+/**
+ * Serialize and deserialize custom objects.
+ *
+ * If you need to use scoped state, you can pass a function instead of an object. The function will
+ * be called with the current value, and you can return a new value.
+ *
+ * @public
+ */
+declare type SerializerArg<T, S> = SerializerArgObject<T, S> | (() => SerializerArgObject<T, S> & {
+    /**
+     * This gets called when reactive state used during `deserialize` changes. You may mutate the
+     * current object, or return a new object.
+     *
+     * If it returns a value, that will be used as the new value, and listeners will be triggered.
+     * If no change happened, don't return anything.
+     *
+     * If you mutate the current object, you must return it so that it will trigger listeners.
+     */
+    update?: (current: T) => T | void;
+});
+
+/** @public */
+declare type SerializerArgObject<T, S> = {
+    /**
+     * This will be called with initial or serialized data to reconstruct an object. If no
+     * `initialData` is provided, it will be called with `undefined`.
+     *
+     * This must not return a Promise.
+     */
+    deserialize: (data: Awaited<S>) => T;
+    /** The initial value to use when deserializing. */
+    initial?: S | undefined;
+    /**
+     * This will be called with the object to get the serialized data. You can return a Promise if you
+     * need to do async work.
+     *
+     * The result may be anything that Qwik can serialize.
+     *
+     * If you do not provide it, the object will be serialized as `undefined`. However, if the object
+     * has a `[SerializerSymbol]` property, that will be used as the serializer instead.
+     */
+    serialize?: (obj: T) => S;
+};
+
+/**
+ * A serializer signal holds a custom serializable value. See `useSerializer$` for more details.
+ *
+ * @public
+ */
+declare interface SerializerSignal<T> extends ComputedSignal<T> {
+    /** Fake property to make the serialization linter happy */
+    __no_serialize__: true;
+}
+
+/**
+ * A signal which provides a non-serializable value. It works like a computed signal, but it is
+ * handled slightly differently during serdes.
+ *
+ * @public
+ */
+declare class SerializerSignalImpl<T, S> extends ComputedSignalImpl<T> {
+    constructor(container: Container | null, argQrl: QRLInternal<SerializerArg<T, S>>);
+    $didInitialize$: boolean;
+    $computeIfNeeded$(): boolean;
+}
+
+/**
+ * If an object has this property as a function, it will be called with the object and should return
+ * a serializable value.
+ *
+ * This can be used to clean up, integrate with other libraries, etc.
+ *
+ * The type your object should conform to is:
+ *
+ * ```ts
+ * {
+ *   [SerializerSymbol]: (this: YourType, toSerialize: YourType) => YourSerializableType;
+ * }
+ * ```
+ *
+ * @public
+ */
+export declare const SerializerSymbol: unique symbol;
+
 /**
  * Sets the `CorePlatform`.
  *
@@ -2357,6 +2503,7 @@ export declare abstract class _SharedContainer implements Container {
     $serverData$: Record<string, any>;
     $currentUniqueId$: number;
     $instanceHash$: string | null;
+    $buildBase$: string | null;
     constructor(scheduleDrain: () => void, journalFlush: () => void, serverData: Record<string, any>, locale: string);
     trackSignalValue<T>(signal: Signal, subscriber: HostElement, property: string, data: _EffectData): T;
     serializationCtxFactory(NodeConstructor: {
@@ -2395,7 +2542,11 @@ export declare interface Signal<T = any> extends ReadonlySignal<T> {
     value: T;
 }
 
-declare class Signal_2<T = any> implements Signal<T> {
+declare const enum SignalFlags {
+    INVALID = 1
+}
+
+declare class SignalImpl<T = any> implements Signal<T> {
     $untrackedValue$: T;
     /** Store a list of effects which are dependent on this signal. */
     $effects$: null | Set<EffectSubscription>;
@@ -2412,10 +2563,6 @@ declare class Signal_2<T = any> implements Signal<T> {
     };
 }
 
-declare const enum SignalFlags {
-    INVALID = 1
-}
-
 declare interface SimplifiedServerRequestEvent<T = unknown> {
     url: URL;
     locale: string | undefined;
@@ -2696,7 +2843,6 @@ declare interface SSRContainer extends Container {
     readonly prefetchResources: PrefetchResource[];
     readonly serializationCtx: SerializationContext;
     readonly symbolToChunkResolver: SymbolToChunkResolver;
-    readonly buildBase: string;
     additionalHeadNodes: Array<JSXNodeInternal>;
     additionalBodyNodes: Array<JSXNodeInternal>;
     unclaimedProjectionComponentFrameQueue: ISsrComponentFrame[];
@@ -3359,7 +3505,7 @@ export declare const useContext: UseContext;
 export declare const useContextProvider: <STATE>(context: ContextId<STATE>, newValue: STATE) => void;
 
 /** @public */
-export declare const useErrorBoundary: () => Readonly<ErrorBoundaryStore>;
+export declare const useErrorBoundary: () => ErrorBoundaryStore;
 
 /** @public */
 export declare const useId: () => string;
@@ -3501,6 +3647,72 @@ export declare const useResource$: <T>(generatorFn: ResourceFn<T>, opts?: Resour
 /** @internal */
 export declare const useResourceQrl: <T>(qrl: QRL<ResourceFn<T>>, opts?: ResourceOptions) => ResourceReturn<T>;
 
+/**
+ * Creates a signal which holds a custom serializable value. It requires that the value implements
+ * the `CustomSerializable` type, which means having a function under the `[SerializeSymbol]`
+ * property that returns a serializable value when called.
+ *
+ * The `fn` you pass is called with the result of the serialization (in the browser, only when the
+ * value is needed), or `undefined` when not yet initialized. If you refer to other signals, `fn`
+ * will be called when those change just like computed signals, and then the argument will be the
+ * previous output, not the serialized result.
+ *
+ * This is useful when using third party libraries that use custom objects that are not
+ * serializable.
+ *
+ * Note that the `fn` is called lazily, so it won't impact container resume.
+ *
+ * @example
+ *
+ * ```tsx
+ * class MyCustomSerializable {
+ *   constructor(public n: number) {}
+ *   inc() {
+ *     this.n++;
+ *   }
+ * }
+ * const Cmp = component$(() => {
+ *   const custom = useSerializer$({
+ *     deserialize: (data) => new MyCustomSerializable(data),
+ *     serialize: (data) => data.n,
+ *     initial: 2,
+ *   });
+ *   return <div onClick$={() => custom.value.inc()}>{custom.value.n}</div>;
+ * });
+ * ```
+ *
+ * @example
+ *
+ * When using a Signal as the data to create the object, you need to pass the configuration as a
+ * function, and you can then also provide the `update` function to update the object when the
+ * signal changes.
+ *
+ * By returning an object from `update`, you signal that the listeners have to be notified. You can
+ * mutate the current object but you should return it so that it will trigger listeners.
+ *
+ * ```tsx
+ * const Cmp = component$(() => {
+ *   const n = useSignal(2);
+ *   const custom = useSerializer$(() =>
+ *     ({
+ *       deserialize: () => new MyCustomSerializable(n.value),
+ *       update: (current) => {
+ *         current.n = n.value;
+ *         return current;
+ *       }
+ *     })
+ *   );
+ *   return <div onClick$={() => n.value++}>{custom.value.n}</div>;
+ * });
+ * ```
+ *
+ * @public
+ */
+export declare const useSerializer$: typeof createSerializer$;
+
+/** @internal */
+export declare const useSerializerQrl: <T, S>(qrl: QRL<SerializerArg<T, S>>) => ReadonlySignal_2<unknown>;
+
 /** @public */
 export declare function useServerData<T>(key: string): T | undefined;
 
@@ -3700,7 +3912,7 @@ export declare const useStylesScopedQrl: (styles: QRL<string>) => UseStylesScope
  * @public
  * @see `Tracker`
  */
-export declare const useTask$: (qrl: TaskFn) => void;
+export declare const useTask$: (fn: TaskFn) => void;
 
 /** @internal */
 export declare const useTaskQrl: (qrl: QRL<TaskFn>) => void;
@@ -3728,7 +3940,7 @@ export declare const useTaskQrl: (qrl: QRL<TaskFn>) => void;
  *
  * @public
  */
-export declare const useVisibleTask$: (qrl: TaskFn, opts?: OnVisibleTaskOptions | undefined) => void;
+export declare const useVisibleTask$: (fn: TaskFn, opts?: OnVisibleTaskOptions) => void;
 
 /** @internal */
 export declare const useVisibleTaskQrl: (qrl: QRL<TaskFn>, opts?: OnVisibleTaskOptions) => void;
@@ -3747,7 +3959,7 @@ export declare const _VAR_PROPS: unique symbol;
 export declare const _verifySerializable: <T>(value: T, preMessage?: string) => T;
 
 /**
- * 2.0.0-alpha.8-dev+66037b5
+ * 2.0.0-alpha.9-dev+56ed5bd
  *
  * @public
  */
@@ -3894,7 +4106,7 @@ export declare const _weakSerialize: <T extends object>(input: T) => Partial<T>;
  */
 export declare function withLocale<T>(locale: string, fn: () => T): T;
 
-declare class WrappedSignal<T> extends Signal_2<T> implements BackRef {
+declare class WrappedSignal<T> extends SignalImpl<T> implements BackRef {
     $args$: any[];
     $func$: (...args: any[]) => T;
     $funcStr$: string | null;
@@ -3906,13 +4118,13 @@ declare class WrappedSignal<T> extends Signal_2<T> implements BackRef {
     $invalidate$(): void;
     /**
      * Use this to force running subscribers, for example when the calculated value has mutated but
-     * remained the same object
+     * remained the same object.
      */
     force(): void;
     get untrackedValue(): T;
     $computeIfNeeded$(): boolean;
-    get value(): any;
     set value(_: any);
+    get value(): any;
 }
 
 declare const enum WrappedSignalFlags {
@@ -3930,7 +4142,7 @@ declare const enum WrappedSignalFlags {
  *
  * @internal
  */
-export declare const _wrapProp: <T extends Record<any, any>, P extends keyof T>(args_0: T, args_1?: P | undefined) => any;
+export declare const _wrapProp: <T extends Record<any, any>, P extends keyof T>(...args: [T, P?]) => any;
 
 /** @internal @deprecated v1 compat */
 export declare const _wrapSignal: <T extends Record<any, any>, P extends keyof T>(obj: T, prop: P) => any;