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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -92,7 +92,7 @@ declare type AllEventsMap = Omit<AllEventMapRaw, keyof EventCorrectionMap> & Eve
92
92
 
93
93
  declare type _AllowPlainQrl<Q> = QRLEventHandlerMulti<any, any> extends Q ? Q extends QRLEventHandlerMulti<infer EV, infer EL> ? Q | (EL extends Element ? EventHandler<EV, EL> : never) : Q : Q extends QRL<infer U> ? Q | U : NonNullable<Q> extends never ? Q : QRL<Q> | Q;
94
94
 
95
- declare type AllSignalFlags = SignalFlags | WrappedSignalFlags | SerializationSignalFlags;
95
+ declare type AllSignalFlags = SignalFlags | WrappedSignalFlags | SerializationSignalFlags | AsyncSignalFlags;
96
96
 
97
97
  /**
98
98
  * TS defines these with the React syntax which is not compatible with Qwik. E.g. `ariaAtomic`
@@ -350,24 +350,85 @@ declare interface AriaAttributes {
350
350
  /** @public */
351
351
  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 & {});
352
352
 
353
- declare type AsyncCtx = {
353
+ declare type AsyncCtx<T = unknown> = {
354
354
  track: Tracker;
355
- cleanup: (callback: () => void) => void;
355
+ /**
356
+ * Register a cleanup callback to be called when the async computation is aborted or completed.
357
+ * The next invocation will await the previous cleanup. If you do not want this, do not return a
358
+ * Promise.
359
+ */
360
+ cleanup: (callback: () => void | Promise<void>) => void;
361
+ /**
362
+ * A lazily created AbortSignal, for interrupting the async computation when needed, e.g. when the
363
+ * component is unmounted or the computation is invalidated. Pass it to `fetch` or other APIs that
364
+ * support it to ensure that unnecessary work is not performed.
365
+ */
366
+ readonly abortSignal: AbortSignal;
367
+ /** The result of the previous computation, if any */
368
+ readonly previous: T | undefined;
356
369
  };
357
370
 
358
- /** @public */
359
- export declare type AsyncFn<T> = (ctx: AsyncCtx) => Promise<T>;
371
+ /**
372
+ * Note, we don't pass the generic type to AsyncCtx because it causes TypeScript to not infer the
373
+ * type of the resource correctly. The type is only used for the `previous` property, which is not
374
+ * commonly used, and can be easily cast if needed.
375
+ *
376
+ * @public
377
+ */
378
+ export declare type AsyncFn<T> = (ctx: AsyncCtx) => ValueOrPromise<T>;
379
+
380
+ /** Retains job metadata and also serves as the argument for the compute function */
381
+ declare class AsyncJob<T> implements AsyncCtx<T> {
382
+ readonly $signal$: AsyncSignalImpl<T>;
383
+ /** First holds the compute promise and then the cleanup promise */
384
+ $promise$: Promise<void> | null;
385
+ $cleanupRequested$: boolean;
386
+ $canWrite$: boolean;
387
+ $track$: AsyncCtx<T>['track'] | undefined;
388
+ $cleanups$: Parameters<AsyncCtx<T>['cleanup']>[0][] | undefined;
389
+ $abortController$: AbortController | undefined;
390
+ constructor($signal$: AsyncSignalImpl<T>);
391
+ get track(): AsyncCtx<T>['track'];
392
+ get abortSignal(): AbortSignal;
393
+ /** Backward compatible cache method for resource */
394
+ cache(): void;
395
+ get previous(): T | undefined;
396
+ cleanup(callback: () => void): void;
397
+ }
360
398
 
361
399
  declare type AsyncQRL<T> = _QRLInternal<AsyncFn<T>>;
362
400
 
363
401
  /** @public */
364
402
  export declare interface AsyncSignal<T = unknown> extends ComputedSignal<T> {
365
- /** Whether the signal is currently loading. */
403
+ /**
404
+ * Whether the signal is currently loading. This will trigger lazy loading of the signal, so you
405
+ * can use it like this:
406
+ *
407
+ * ```tsx
408
+ * signal.loading ? <Loading /> : signal.error ? <Error /> : <Component
409
+ * value={signal.value} />
410
+ * ```
411
+ */
366
412
  loading: boolean;
367
- /** The error that occurred while computing the signal. */
413
+ /**
414
+ * The error that occurred while computing the signal, if any. This will be cleared when the
415
+ * signal is successfully computed.
416
+ */
368
417
  error: Error | undefined;
369
- /** A promise that resolves when the value is computed. */
370
- promise(): Promise<T>;
418
+ /**
419
+ * Poll interval in ms. Writable and immediately effective when the signal has consumers. If set
420
+ * to `0`, polling stops.
421
+ */
422
+ interval: number;
423
+ /** A promise that resolves when the value is computed or rejected. */
424
+ promise(): Promise<void>;
425
+ /** Abort the current computation and run cleanups if needed. */
426
+ abort(reason?: any): void;
427
+ }
428
+
429
+ declare const enum AsyncSignalFlags {
430
+ EAGER_CLEANUP = 32,
431
+ AWAIT_PREVIOUS = 64
371
432
  }
372
433
 
373
434
  /**
@@ -377,19 +438,26 @@ export declare interface AsyncSignal<T = unknown> extends ComputedSignal<T> {
377
438
  *
378
439
  * # ================================
379
440
  */
380
- declare class AsyncSignalImpl<T> extends ComputedSignalImpl<T, AsyncQRL<T>> implements BackRef {
441
+ declare class AsyncSignalImpl<T> extends ComputedSignalImpl<T, AsyncQRL<T>> implements BackRef, AsyncSignal<T> {
381
442
  $untrackedLoading$: boolean;
382
443
  $untrackedError$: Error | undefined;
383
444
  $loadingEffects$: undefined | Set<EffectSubscription>;
384
445
  $errorEffects$: undefined | Set<EffectSubscription>;
385
- $destroy$: NoSerialize<() => void> | null;
386
- $promiseValue$: T | typeof NEEDS_COMPUTATION;
387
- private $promise$;
446
+ $current$: AsyncJob<T> | null;
447
+ $jobs$: AsyncJob<T>[];
448
+ $concurrency$: number;
449
+ $interval$: number;
450
+ $pollTimeoutId$: ReturnType<typeof setTimeout> | undefined;
451
+ $timeoutMs$: number | undefined;
452
+ $computationTimeoutId$: ReturnType<typeof setTimeout> | undefined;
388
453
  [_EFFECT_BACK_REF]: Map<EffectProperty | string, EffectSubscription> | undefined;
389
- constructor(container: _Container | null, fn: AsyncQRL<T>, flags?: SignalFlags | SerializationSignalFlags);
454
+ constructor(container: _Container | null, fn: AsyncQRL<T>, flags?: SignalFlags | SerializationSignalFlags, options?: AsyncSignalOptions<T>);
390
455
  /**
391
456
  * Loading is true if the signal is still waiting for the promise to resolve, false if the promise
392
457
  * has resolved or rejected.
458
+ *
459
+ * Accessing .loading will trigger computation if needed, since it's often used like
460
+ * `signal.loading ? <Loading /> : signal.value`.
393
461
  */
394
462
  get loading(): boolean;
395
463
  set untrackedLoading(value: boolean);
@@ -398,11 +466,71 @@ declare class AsyncSignalImpl<T> extends ComputedSignalImpl<T, AsyncQRL<T>> impl
398
466
  get error(): Error | undefined;
399
467
  set untrackedError(value: Error | undefined);
400
468
  get untrackedError(): Error | undefined;
401
- invalidate(): void;
402
- promise(): Promise<T>;
403
- $computeIfNeeded$(): Promise<void> | undefined;
404
- private $promiseComputation$;
405
- private setValue;
469
+ get interval(): number;
470
+ set interval(value: number);
471
+ /** Invalidates the signal, causing it to re-compute its value. */
472
+ invalidate(): Promise<void>;
473
+ /** Abort the current computation and run cleanups if needed. */
474
+ abort(reason?: any): void;
475
+ /** Schedule eager cleanup on next macro task if no subscribers remain. */
476
+ $scheduleEagerCleanup$(): void;
477
+ /** Returns a promise resolves when the signal finished computing. */
478
+ promise(): Promise<void>;
479
+ /** Run the computation if needed */
480
+ $computeIfNeeded$(): void;
481
+ $runComputation$(running: AsyncJob<T>): Promise<void>;
482
+ /** Called after SSR/unmount */
483
+ $destroy$(): Promise<void>;
484
+ get untrackedValue(): T;
485
+ private $clearNextPoll$;
486
+ private $scheduleNextPoll$;
487
+ private $hasSubscribers$;
488
+ $requestCleanups$(job: AsyncJob<T>, reason?: any): Promise<void | null>;
489
+ /** Clean up and trigger signal compute once complete */
490
+ $runCleanups$(job: AsyncJob<T>): Promise<void>;
491
+ }
492
+
493
+ /** @public */
494
+ export declare interface AsyncSignalOptions<T> extends ComputedOptions {
495
+ /** Like useSignal's `initial`; prevents the throw on first read when uninitialized */
496
+ initial?: T | (() => T);
497
+ /**
498
+ * Maximum number of concurrent computations. Use `0` for unlimited.
499
+ *
500
+ * Defaults to `1`.
501
+ */
502
+ concurrency?: number;
503
+ /**
504
+ * When subscribers drop to 0, run cleanup in the next tick, instead of waiting for the function
505
+ * inputs to change.
506
+ *
507
+ * Defaults to `false`, meaning cleanup happens only when inputs change.
508
+ */
509
+ eagerCleanup?: boolean;
510
+ /**
511
+ * Wait for previous invocation to complete before running again.
512
+ *
513
+ * Defaults to `true`.
514
+ *
515
+ * @deprecated Not implemented yet
516
+ */
517
+ awaitPrevious?: boolean;
518
+ /**
519
+ * In the browser, re-run the function after `interval` ms if subscribers exist, even when no
520
+ * input state changed. If `0`, does not poll.
521
+ *
522
+ * Defaults to `0`.
523
+ */
524
+ interval?: number;
525
+ /**
526
+ * Maximum time in milliseconds to wait for the async computation to complete. If exceeded, the
527
+ * computation is aborted and an error is thrown.
528
+ *
529
+ * If `0`, no timeout is applied.
530
+ *
531
+ * Defaults to `0`.
532
+ */
533
+ timeout?: number;
406
534
  }
407
535
 
408
536
  /**
@@ -624,11 +752,6 @@ declare class ComputedSignalImpl<T, S extends _QRLInternal = ComputeQRL<T>> exte
624
752
  [_EFFECT_BACK_REF]: Map<EffectProperty | string, EffectSubscription> | undefined;
625
753
  constructor(container: _Container | null, fn: S, flags?: SignalFlags | SerializationSignalFlags);
626
754
  invalidate(): void;
627
- /**
628
- * Use this to force running subscribers, for example when the calculated value has mutated but
629
- * remained the same object
630
- */
631
- force(): void;
632
755
  get untrackedValue(): T;
633
756
  $computeIfNeeded$(): void;
634
757
  }
@@ -660,8 +783,8 @@ export declare interface _Container {
660
783
  $buildBase$: string | null;
661
784
  $renderPromise$: Promise<void> | null;
662
785
  $resolveRenderPromise$: (() => void) | null;
663
- $cursorCount$: number;
664
- $pausedCursorCount$: number;
786
+ $pendingCount$: number;
787
+ $checkPendingCount$(): void;
665
788
  handleError(err: any, $host$: HostElement | null): void;
666
789
  getParentHost(host: HostElement): HostElement | null;
667
790
  setContext<T>(host: HostElement, context: ContextId<T>, value: T): void;
@@ -835,19 +958,15 @@ export declare interface CorrectedToggleEvent extends Event {
835
958
  }
836
959
 
837
960
  /**
838
- * Create an async computed signal which is calculated from the given QRL. A computed signal is a
839
- * signal which is calculated from other signals or async operation. When the signals change, the
840
- * computed signal is recalculated.
841
- *
842
- * The QRL must be a function which returns the value of the signal. The function must not have side
843
- * effects, and it can be async.
961
+ * Create a signal holding a `.value` which is calculated from the given async function (QRL). The
962
+ * standalone version of `useAsync$`.
844
963
  *
845
964
  * @public
846
965
  */
847
- export declare const createAsync$: <T>(qrl: () => Promise<T>, options?: ComputedOptions) => AsyncSignal<T>;
966
+ export declare const createAsync$: <T>(qrl: (arg: AsyncCtx<T>) => Promise<T>, options?: AsyncSignalOptions<T>) => AsyncSignal<T>;
848
967
 
849
968
  /** @internal */
850
- export declare const createAsyncQrl: <T>(qrl: QRL<(ctx: AsyncCtx) => Promise<T>>, options?: ComputedOptions) => AsyncSignalImpl<T>;
969
+ export declare const createAsyncQrl: <T>(qrl: QRL<AsyncFn<T>>, options?: AsyncSignalOptions<T>) => AsyncSignalImpl<T>;
851
970
 
852
971
  /**
853
972
  * Create a computed signal which is calculated from the given QRL. A computed signal is a signal
@@ -857,7 +976,7 @@ export declare const createAsyncQrl: <T>(qrl: QRL<(ctx: AsyncCtx) => Promise<T>>
857
976
  * The QRL must be a function which returns the value of the signal. The function must not have side
858
977
  * effects, and it must be synchronous.
859
978
  *
860
- * If you need the function to be async, use `useAsync$` instead.
979
+ * If you need the function to be async, use `createAsync$` instead (don't forget to use `track()`).
861
980
  *
862
981
  * @public
863
982
  */
@@ -918,6 +1037,21 @@ export declare const createComputedQrl: <T>(qrl: QRL<() => T>, options?: Compute
918
1037
  */
919
1038
  export declare const createContextId: <STATE = unknown>(name: string) => ContextId<STATE>;
920
1039
 
1040
+ /**
1041
+ * Creates a QRL instance to represent a lazily loaded value. Normally this is a function, but it
1042
+ * can be any value.
1043
+ *
1044
+ * When the value is a function, calling the returned qrl will load the underlying code when
1045
+ * invoked, and call it with the captured scope. This always returns a promise since the code may
1046
+ * not be loaded yet.
1047
+ *
1048
+ * To get the underlying function without invoking it, await `qrl.resolve()` and then `qrl.resolved`
1049
+ * holds the loaded function, wrapped with the captured scope.
1050
+ *
1051
+ * @internal
1052
+ */
1053
+ export declare const _createQRL: <TYPE>(chunk: string | null, symbol: string, symbolRef?: null | ValueOrPromise<TYPE>, symbolFn?: null | (() => Promise<Record<string, TYPE>>), captures?: Readonly<unknown[]> | string | null) => _QRLInternal<TYPE>;
1054
+
921
1055
  /**
922
1056
  * Create a signal that holds a custom serializable value. See {@link useSerializer$} for more
923
1057
  * details.
@@ -962,7 +1096,7 @@ declare interface DescriptorBase<T = unknown, B = unknown> extends BackRef {
962
1096
  $el$: HostElement;
963
1097
  $qrl$: _QRLInternal<T>;
964
1098
  $state$: B | undefined;
965
- $destroy$: NoSerialize<() => void> | null;
1099
+ $destroy$: (() => void) | null;
966
1100
  }
967
1101
 
968
1102
  /**
@@ -971,7 +1105,7 @@ declare interface DescriptorBase<T = unknown, B = unknown> extends BackRef {
971
1105
  * @param rawStateData - Data to deserialize
972
1106
  * @internal
973
1107
  */
974
- export declare function _deserialize(rawStateData: string | null): unknown[];
1108
+ export declare function _deserialize<T>(rawStateData: string): T;
975
1109
 
976
1110
  declare interface DeserializeContainer {
977
1111
  $getObjectById$: (id: number | string) => unknown;
@@ -1768,12 +1902,6 @@ export declare type NativeUIEvent = UIEvent;
1768
1902
  /** @public @deprecated Use `WheelEvent` and use the second argument to the handler function for the current event target */
1769
1903
  export declare type NativeWheelEvent = WheelEvent;
1770
1904
 
1771
- /**
1772
- * Special value used to mark that a given signal needs to be computed. This is essentially a
1773
- * "marked as dirty" flag.
1774
- */
1775
- declare const NEEDS_COMPUTATION: any;
1776
-
1777
1905
  declare interface NodePropData {
1778
1906
  $scopedStyleIdPrefix$: string | null;
1779
1907
  $isConst$: boolean;
@@ -1866,7 +1994,7 @@ declare type PascalCaseNames = 'AnimationEnd' | 'AnimationIteration' | 'Animatio
1866
1994
 
1867
1995
  declare type PopoverTargetAction = 'hide' | 'show' | 'toggle';
1868
1996
 
1869
- declare type PossibleEvents = Event | SimplifiedServerRequestEvent | typeof TaskEvent | typeof RenderEvent | typeof ResourceEvent;
1997
+ declare type PossibleEvents = Event | SimplifiedServerRequestEvent | typeof TaskEvent | typeof RenderEvent;
1870
1998
 
1871
1999
  /**
1872
2000
  * @deprecated This is no longer needed as the preloading happens automatically in qrl-class. You
@@ -2228,6 +2356,12 @@ declare type QrlReturn<T> = T extends (...args: any) => infer R ? Awaited<R> : u
2228
2356
  */
2229
2357
  export declare const _qrlSync: <TYPE extends Function>(fn: TYPE, serializedFn?: string) => SyncQRL<TYPE>;
2230
2358
 
2359
+ /** @internal */
2360
+ export declare function _qrlToString(serializationContext: SerializationContext, qrl: _QRLInternal | SyncQRLInternal): string;
2361
+
2362
+ /** @internal */
2363
+ export declare function _qrlToString(serializationContext: SerializationContext, qrl: _QRLInternal | SyncQRLInternal, raw: true): [string, string, string | null];
2364
+
2231
2365
  /** @public @deprecated Use `AnimationEvent` and use the second argument to the handler function for the current event target */
2232
2366
  export declare type QwikAnimationEvent<T = Element> = NativeAnimationEvent;
2233
2367
 
@@ -2595,6 +2729,14 @@ export declare interface RenderSSROptions {
2595
2729
  manifestHash: string;
2596
2730
  }
2597
2731
 
2732
+ /**
2733
+ * Resumes selected state (e.g. polling AsyncSignals) by deserializing captures. Used for
2734
+ * document:onQIdle to resume async signals with active polling.
2735
+ *
2736
+ * @internal
2737
+ */
2738
+ export declare function _res(this: string | undefined, _: any, element: Element): void;
2739
+
2598
2740
  /** @internal */
2599
2741
  export declare const _resolveContextWithoutSequentialScope: <STATE>(context: ContextId<STATE>) => STATE | undefined;
2600
2742
 
@@ -2607,73 +2749,49 @@ declare interface ResolvedManifest {
2607
2749
  }
2608
2750
 
2609
2751
  /**
2610
- * This method works like an async memoized function that runs whenever some tracked value changes
2611
- * and returns some data.
2612
- *
2613
- * `useResource` however returns immediate a `ResourceReturn` object that contains the data and a
2614
- * state that indicates if the data is available or not.
2615
- *
2616
- * The status can be one of the following:
2617
- *
2618
- * - `pending` - the data is not yet available.
2619
- * - `resolved` - the data is available.
2620
- * - `rejected` - the data is not available due to an error or timeout.
2621
- *
2622
- * Be careful when using a `try/catch` statement in `useResource$`. If you catch the error and don't
2623
- * re-throw it (or a new Error), the resource status will never be `rejected`.
2624
- *
2625
- * ### Example
2626
- *
2627
- * Example showing how `useResource` to perform a fetch to request the weather, whenever the input
2628
- * city name changes.
2629
- *
2630
2752
  * ```tsx
2631
2753
  * const Cmp = component$(() => {
2632
- * const cityS = useSignal('');
2754
+ * const city = useSignal('');
2633
2755
  *
2634
- * const weatherResource = useResource$(async ({ track, cleanup }) => {
2635
- * const cityName = track(cityS);
2636
- * const abortController = new AbortController();
2637
- * cleanup(() => abortController.abort('cleanup'));
2756
+ * const weather = useAsync$(async ({ track, cleanup, abortSignal }) => {
2757
+ * const cityName = track(city);
2638
2758
  * const res = await fetch(`http://weatherdata.com?city=${cityName}`, {
2639
- * signal: abortController.signal,
2759
+ * signal: abortSignal,
2640
2760
  * });
2641
- * const data = await res.json();
2642
- * return data as { temp: number };
2761
+ * const temp = (await res.json()) as { temp: number };
2762
+ * return temp;
2643
2763
  * });
2644
2764
  *
2645
2765
  * return (
2646
2766
  * <div>
2647
- * <input name="city" bind:value={cityS} />
2648
- * <Resource
2649
- * value={weatherResource}
2650
- * onResolved={(weather) => {
2651
- * return <div>Temperature: {weather.temp}</div>;
2652
- * }}
2653
- * />
2767
+ * <input name="city" bind:value={city} />
2768
+ * <div>
2769
+ * Temperature:{' '}
2770
+ * {weather.loading
2771
+ * ? 'Loading...'
2772
+ * : weather.error
2773
+ * ? `Error: ${weather.error.message}`
2774
+ * : weather.value.temp}
2775
+ * </div>
2654
2776
  * </div>
2655
2777
  * );
2656
2778
  * });
2657
2779
  * ```
2658
2780
  *
2781
+ * @deprecated Use `useAsync$` instead, which is more efficient, and has a more flexible API. Just
2782
+ * read the `loading` and `error` properties from the returned signal to determine the status.
2659
2783
  * @public
2660
- * @see Resource
2661
- * @see ResourceReturn
2662
2784
  */
2663
- export declare const Resource: <T>(props: ResourceProps<T>) => JSXOutput;
2785
+ export declare const Resource: <T>({ value, onResolved, onPending, onRejected, }: ResourceProps<T>) => JSXOutput;
2664
2786
 
2665
2787
  /** @public */
2666
- export declare interface ResourceCtx<T> {
2667
- readonly track: Tracker;
2668
- cleanup(callback: () => void): void;
2788
+ export declare interface ResourceCtx<T = unknown> extends AsyncCtx<T> {
2789
+ /** @deprecated Does not do anything */
2669
2790
  cache(policyOrMilliseconds: number | 'immutable'): void;
2670
- readonly previous: T | undefined;
2671
2791
  }
2672
2792
 
2673
- declare const ResourceEvent = "qResource";
2674
-
2675
2793
  /** @public */
2676
- export declare type ResourceFn<T> = (ctx: ResourceCtx<unknown>) => ValueOrPromise<T>;
2794
+ export declare type ResourceFn<T> = (ctx: ResourceCtx) => ValueOrPromise<T>;
2677
2795
 
2678
2796
  /**
2679
2797
  * Options to pass to `useResource$()`
@@ -2690,10 +2808,7 @@ export declare interface ResourceOptions {
2690
2808
  }
2691
2809
 
2692
2810
  /** @public */
2693
- export declare interface ResourcePending<T> {
2694
- readonly value: Promise<T>;
2695
- readonly loading: boolean;
2696
- }
2811
+ export declare type ResourcePending<T> = ResourceReturn<T>;
2697
2812
 
2698
2813
  /** @public */
2699
2814
  export declare interface ResourceProps<T> {
@@ -2704,35 +2819,38 @@ export declare interface ResourceProps<T> {
2704
2819
  }
2705
2820
 
2706
2821
  /** @public */
2707
- export declare interface ResourceRejected<T> {
2708
- readonly value: Promise<T>;
2709
- readonly loading: boolean;
2710
- }
2822
+ export declare type ResourceRejected<T> = ResourceReturn<T>;
2711
2823
 
2712
2824
  /** @public */
2713
- export declare interface ResourceResolved<T> {
2714
- readonly value: Promise<T>;
2715
- readonly loading: boolean;
2716
- }
2825
+ export declare type ResourceResolved<T> = ResourceReturn<T>;
2717
2826
 
2718
2827
  /** @public */
2719
- export declare type ResourceReturn<T> = ResourcePending<T> | ResourceResolved<T> | ResourceRejected<T>;
2828
+ export declare type ResourceReturn<T> = {
2829
+ readonly value: Promise<T>;
2830
+ readonly loading: boolean;
2831
+ };
2720
2832
 
2721
2833
  declare interface ResourceReturnInternal<T> {
2722
2834
  __brand: 'resource';
2723
- _state: 'pending' | 'resolved' | 'rejected';
2724
- _resolved: T | undefined;
2725
- _error: Error | undefined;
2726
- _cache: number;
2727
- _timeout: number;
2728
- _generation: number;
2729
2835
  value: Promise<T>;
2730
2836
  loading: boolean;
2837
+ signal: AsyncSignal<{
2838
+ r: T;
2839
+ }>;
2731
2840
  }
2732
2841
 
2733
2842
  /** @internal */
2734
2843
  export declare const _restProps: (props: PropsProxy, omit?: string[], target?: Props) => Props;
2735
2844
 
2845
+ /**
2846
+ * The resource function wrapper
2847
+ *
2848
+ * @internal
2849
+ */
2850
+ export declare const _rsc: <T>(arg: ResourceCtx<T>) => Promise<{
2851
+ r: T;
2852
+ }>;
2853
+
2736
2854
  /**
2737
2855
  * This is called by qwik-loader to run a QRL. It has to be synchronous when possible.
2738
2856
  *
@@ -2753,7 +2871,7 @@ declare interface SegmentEntryStrategy {
2753
2871
  }
2754
2872
 
2755
2873
  declare interface SerializationContext {
2756
- $serialize$: () => void;
2874
+ $serialize$: () => ValueOrPromise<void>;
2757
2875
  $symbolToChunkResolver$: SymbolToChunkResolver;
2758
2876
  /**
2759
2877
  * Map from object to parent and index reference.
@@ -2787,9 +2905,10 @@ declare interface SerializationContext {
2787
2905
  $syncFns$: string[];
2788
2906
  $eventQrls$: Set<QRL>;
2789
2907
  $eventNames$: Set<string>;
2790
- $resources$: Set<ResourceReturnInternal<unknown>>;
2791
2908
  $renderSymbols$: Set<string>;
2792
2909
  $storeProxyMap$: ObjToProxyMap;
2910
+ $eagerResume$: Set<unknown>;
2911
+ $resources$: Set<ResourceReturnInternal<any>>;
2793
2912
  $getProp$: (obj: any, prop: string) => any;
2794
2913
  $setProp$: (obj: any, prop: string, value: any) => void;
2795
2914
  }
@@ -2799,16 +2918,30 @@ declare const enum SerializationSignalFlags {
2799
2918
  SERIALIZATION_STRATEGY_ALWAYS = 16
2800
2919
  }
2801
2920
 
2802
- /** @public */
2921
+ /**
2922
+ * Serialization strategy for computed and async signals. This determines whether to serialize their
2923
+ * value during SSR.
2924
+ *
2925
+ * - `never`: The value is never serialized. When the component is resumed, the value will be
2926
+ * recalculated when it is first read.
2927
+ * - `always`: The value is always serialized. This is the default.
2928
+ *
2929
+ * **IMPORTANT**: When you use `never`, your serialized HTML is smaller, but the recalculation will
2930
+ * trigger subscriptions, meaning that other signals using this signal will recalculate, even if
2931
+ * this signal didn't change.
2932
+ *
2933
+ * This is normally not a problem, but for async signals it may mean fetching something again.
2934
+ *
2935
+ * @public
2936
+ */
2803
2937
  export declare type SerializationStrategy = 'never' | 'always';
2804
2938
 
2805
2939
  /**
2806
2940
  * Serialize data to string using SerializationContext.
2807
2941
  *
2808
- * @param data - Data to serialize
2809
2942
  * @internal
2810
2943
  */
2811
- export declare function _serialize(data: unknown[]): Promise<string>;
2944
+ export declare function _serialize<T>(data: T): Promise<string>;
2812
2945
 
2813
2946
  /**
2814
2947
  * Serialize and deserialize custom objects.
@@ -2925,8 +3058,7 @@ export declare abstract class _SharedContainer implements _Container {
2925
3058
  $buildBase$: string | null;
2926
3059
  $renderPromise$: Promise<void> | null;
2927
3060
  $resolveRenderPromise$: (() => void) | null;
2928
- $cursorCount$: number;
2929
- $pausedCursorCount$: number;
3061
+ $pendingCount$: number;
2930
3062
  constructor(serverData: Record<string, any>, locale: string);
2931
3063
  trackSignalValue<T>(signal: Signal, subscriber: HostElement, property: string, data: _SubscriptionData): T;
2932
3064
  serializationCtxFactory(NodeConstructor: {
@@ -2938,6 +3070,7 @@ export declare abstract class _SharedContainer implements _Container {
2938
3070
  __brand__: 'DomRef';
2939
3071
  };
2940
3072
  } | null, symbolToChunkResolver: SymbolToChunkResolver, writer?: StreamWriter): SerializationContext;
3073
+ $checkPendingCount$(): void;
2941
3074
  abstract ensureProjectionResolved(host: HostElement): void;
2942
3075
  abstract handleError(err: any, $host$: HostElement | null): void;
2943
3076
  abstract getParentHost(host: HostElement): HostElement | null;
@@ -3669,6 +3802,8 @@ declare type SymbolToChunkResolver = (symbol: string) => string;
3669
3802
  */
3670
3803
  export declare const sync$: <T extends Function>(fn: T) => SyncQRL<T>;
3671
3804
 
3805
+ declare const SYNC_QRL = "<sync>";
3806
+
3672
3807
  /** @public */
3673
3808
  export declare type SyncQRL<TYPE extends Function> = QRL<TYPE> & {
3674
3809
  __brand__SyncQRL__: TYPE;
@@ -3676,6 +3811,12 @@ export declare type SyncQRL<TYPE extends Function> = QRL<TYPE> & {
3676
3811
  dev?: QRLDev | null;
3677
3812
  } & BivariantQrlFn<QrlArgs<TYPE>, QrlReturn<TYPE>>;
3678
3813
 
3814
+ declare type SyncQRLInternal = _QRLInternal & SyncQRLSymbol;
3815
+
3816
+ declare interface SyncQRLSymbol {
3817
+ $symbol$: typeof SYNC_QRL;
3818
+ }
3819
+
3679
3820
  declare type TableCellSpecialAttrs = {
3680
3821
  align?: 'left' | 'center' | 'right' | 'justify' | 'char' | undefined;
3681
3822
  height?: Size | undefined;
@@ -3683,14 +3824,14 @@ declare type TableCellSpecialAttrs = {
3683
3824
  valign?: 'top' | 'middle' | 'bottom' | 'baseline' | undefined;
3684
3825
  };
3685
3826
 
3686
- declare class Task<T = unknown, B = T> extends BackRef implements DescriptorBase<unknown, Signal<B> | ResourceReturnInternal<B>> {
3827
+ declare class Task<T = unknown, B = T> extends BackRef implements DescriptorBase<unknown, Signal<B>> {
3687
3828
  $flags$: number;
3688
3829
  $index$: number;
3689
3830
  $el$: HostElement;
3690
3831
  $qrl$: _QRLInternal<T>;
3691
- $state$: Signal<B> | ResourceReturnInternal<B> | undefined;
3692
- $destroy$: NoSerialize<() => void> | null;
3693
- constructor($flags$: number, $index$: number, $el$: HostElement, $qrl$: _QRLInternal<T>, $state$: Signal<B> | ResourceReturnInternal<B> | undefined, $destroy$: NoSerialize<() => void> | null);
3832
+ $state$: Signal<B> | undefined;
3833
+ $destroy$: (() => void) | null;
3834
+ constructor($flags$: number, $index$: number, $el$: HostElement, $qrl$: _QRLInternal<T>, $state$: Signal<B> | undefined, $destroy$: (() => void) | null);
3694
3835
  }
3695
3836
 
3696
3837
  /**
@@ -3860,10 +4001,10 @@ export declare const unwrapStore: <T>(value: T) => T;
3860
4001
  *
3861
4002
  * @public
3862
4003
  */
3863
- export declare const useAsync$: <T>(qrl: AsyncFn<T>, options?: ComputedOptions | undefined) => AsyncSignal<T>;
4004
+ export declare const useAsync$: <T>(qrl: AsyncFn<T>, options?: AsyncSignalOptions<T> | undefined) => AsyncSignal<T>;
3864
4005
 
3865
4006
  /** @internal */
3866
- export declare const useAsyncQrl: <T>(qrl: QRL<AsyncFn<T>>, options?: ComputedOptions) => AsyncSignal<T>;
4007
+ export declare const useAsyncQrl: <T>(qrl: QRL<AsyncFn<T>>, options?: AsyncSignalOptions<T>) => AsyncSignal<T>;
3867
4008
 
3868
4009
  /**
3869
4010
  * Creates a computed signal which is calculated from the given function. A computed signal is a
@@ -4023,7 +4164,7 @@ export declare const useId: () => string;
4023
4164
  * NOTE: `useLexicalScope` method can only be used in the synchronous portion of the callback
4024
4165
  * (before any `await` statements.)
4025
4166
  *
4026
- * @deprecated Read from `_captures` directly instead.
4167
+ * @deprecated Use `_captures` instead.
4027
4168
  * @internal
4028
4169
  */
4029
4170
  export declare const useLexicalScope: <VARS extends any[]>() => VARS;
@@ -4116,45 +4257,15 @@ export declare const useOnWindow: <T extends KnownEventNames>(event: T | T[], ev
4116
4257
  * Be careful when using a `try/catch` statement in `useResource$`. If you catch the error and don't
4117
4258
  * re-throw it (or a new Error), the resource status will never be `rejected`.
4118
4259
  *
4119
- * ### Example
4120
- *
4121
- * Example showing how `useResource` to perform a fetch to request the weather, whenever the input
4122
- * city name changes.
4123
- *
4124
- * ```tsx
4125
- * const Cmp = component$(() => {
4126
- * const cityS = useSignal('');
4127
- *
4128
- * const weatherResource = useResource$(async ({ track, cleanup }) => {
4129
- * const cityName = track(cityS);
4130
- * const abortController = new AbortController();
4131
- * cleanup(() => abortController.abort('cleanup'));
4132
- * const res = await fetch(`http://weatherdata.com?city=${cityName}`, {
4133
- * signal: abortController.signal,
4134
- * });
4135
- * const data = await res.json();
4136
- * return data as { temp: number };
4137
- * });
4138
- *
4139
- * return (
4140
- * <div>
4141
- * <input name="city" bind:value={cityS} />
4142
- * <Resource
4143
- * value={weatherResource}
4144
- * onResolved={(weather) => {
4145
- * return <div>Temperature: {weather.temp}</div>;
4146
- * }}
4147
- * />
4148
- * </div>
4149
- * );
4150
- * });
4151
- * ```
4152
- *
4260
+ * @deprecated Use `useAsync$` instead, which is more powerful and flexible. `useResource$` is still
4261
+ * available for backward compatibility but it is recommended to migrate to `useAsync$` for new
4262
+ * code and when updating existing code.
4153
4263
  * @public
4264
+ * @see useAsync$
4154
4265
  * @see Resource
4155
4266
  * @see ResourceReturn
4156
4267
  */
4157
- export declare const useResource$: <T>(generatorFn: ResourceFn<T>, opts?: ResourceOptions) => ResourceReturn<T>;
4268
+ export declare const useResource$: <T>(qrl: ResourceFn<T>, opts?: ResourceOptions | undefined) => ResourceReturn<T>;
4158
4269
 
4159
4270
  /** @internal */
4160
4271
  export declare const useResourceQrl: <T>(qrl: QRL<ResourceFn<T>>, opts?: ResourceOptions) => ResourceReturn<T>;
@@ -4525,7 +4636,7 @@ export declare const _VAR_PROPS: unique symbol;
4525
4636
  export declare const _verifySerializable: <T>(value: T, preMessage?: string) => T;
4526
4637
 
4527
4638
  /**
4528
- * 2.0.0-beta.21-dev+c008e88
4639
+ * 2.0.0-beta.23-dev+03de42d
4529
4640
  *
4530
4641
  * @public
4531
4642
  */
@@ -4577,7 +4688,7 @@ export declare const _vnode_isTextVNode: (vNode: _VNode) => vNode is _TextVNode;
4577
4688
  export declare const _vnode_isVirtualVNode: (vNode: _VNode) => vNode is _VirtualVNode;
4578
4689
 
4579
4690
  /** @internal */
4580
- export declare function _vnode_toString(this: _VNode | null, depth?: number, offset?: string, materialize?: boolean, siblings?: boolean, colorize?: boolean, container?: ClientContainer | null): string;
4691
+ export declare function _vnode_toString(this: _VNode | null, depth?: number, offset?: string, materialize?: boolean, siblings?: boolean, colorize?: boolean, container?: _Container | null): string;
4581
4692
 
4582
4693
  /**
4583
4694
  * Array of numbers which describes virtual nodes in the tree.
@@ -4693,11 +4804,6 @@ declare class WrappedSignalImpl<T> extends SignalImpl<T> implements BackRef {
4693
4804
  [_EFFECT_BACK_REF]: Map<EffectProperty | string, EffectSubscription> | undefined;
4694
4805
  constructor(container: _Container | null, fn: (...args: any[]) => T, args: any[], fnStr: string | null, flags?: SignalFlags);
4695
4806
  invalidate(): void;
4696
- /**
4697
- * Use this to force running subscribers, for example when the calculated value has mutated but
4698
- * remained the same object.
4699
- */
4700
- force(): void;
4701
4807
  get untrackedValue(): T;
4702
4808
  $computeIfNeeded$(): void;
4703
4809
  $unwrapIfSignal$(): SignalImpl<T> | WrappedSignalImpl<T>;