rask-ui 0.18.3 → 0.19.0

package/README.md

@@ -48,7 +48,10 @@ RASK provides a set of reactive hooks for building interactive UIs. These hooks
 - **`useState`** - Create reactive state objects
 - **`useEffect`** - Run side effects when dependencies change
 - **`useDerived`** - Derive values from state with automatic caching
-- **`useAsync`** - Manage async operations (fetch, mutations, polling, etc.)
+- **`useAsync`** - Fetch async values with automatic observation and cancellation
+- **`useAction`** - Perform async operations with queuing and retry support
+- **`useSuspend`** - Suspend until multiple async values resolve
+- **`useCatchError`** - Catch and handle component errors (hook-based error boundary)
 - **`useRouter`** - Type-safe client-side routing
 - **`createContext`** / **`useContext`** - Share data through the component tree
 - **`useView`** - Compose state and methods into reusable objects

package/dist/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,EACL,SAAS,EACT,KAAK,EACL,WAAW,EACZ,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAsB,QAAQ,EAAU,MAAM,eAAe,CAAC;AAIrE,MAAM,MAAM,8BAA8B,CAAC,CAAC,SAAS,KAAK,CAAC,GAAG,CAAC,IAC3D,CAAC,MAAM,KAAK,CAAC,GACb,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,KAAK,CAAC,CAAC;AAE1B,qBAAa,sBAAuB,SAAQ,SAAS;IAC3C,QAAQ,EAAE,8BAA8B,CAAC,GAAG,CAAC,CAAC;IACtD,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,aAAa,CAAS;IAC9B,QAAQ,WAML;IACH,OAAO,CAAC,aAAa,CAAc;IAEnC,qBAAqB,IAAI,OAAO;IAMhC,kBAAkB,IAAI,IAAI;IAG1B,yBAAyB,CAAC,SAAS,EAAE,GAAG,GAAG,IAAI;IAe/C,MAAM;CAOP;AAID,wBAAgB,mBAAmB,2CAElC;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,MAAM,IAAI,QAM5C;AAED,wBAAgB,UAAU,CAAC,EAAE,EAAE,MAAM,IAAI,QAMxC;AAED,MAAM,MAAM,6BAA6B,CAAC,CAAC,SAAS,KAAK,CAAC,GAAG,CAAC,IAC1D,CAAC,MAAM,MAAM,KAAK,CAAC,GACnB,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,MAAM,KAAK,CAAC,CAAC;AAEhC,qBAAa,qBAAqB,CAAC,CAAC,SAAS,KAAK,CAAC,GAAG,CAAC,CAAE,SAAQ,SAAS,CAAC,CAAC,CAAC;IACnE,KAAK,EAAE,6BAA6B,CAAC,CAAC,CAAC,CAAC;IAChD,OAAO,CAAC,QAAQ,CAAC,CAAc;IAC/B,OAAO,CAAC,aAAa,CAAC,CAAa;IAwBnC,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,aAAa,CAAS;IAE9B,QAAQ,WAOL;IAEH,WAAW,UAAS;IACpB,OAAO,EAAE,KAAK,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,GAAG,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,CAAM;IAC3D,QAAQ,gBAAa;IACrB,eAAe;IAUf,QAAQ,EAAE,KAAK,CAAC,MAAM,IAAI,CAAC,CAAM;IACjC,UAAU,EAAE,KAAK,CAAC,MAAM,IAAI,CAAC,CAAM;IAEnC,iBAAiB,IAAI,IAAI;IAGzB,oBAAoB,IAAI,IAAI;IAI5B,yBAAyB,CACvB,SAAS,EAAE,QAAQ,CAAC;QAAE,QAAQ,CAAC,EAAE,WAAW,CAAA;KAAE,GAAG,CAAC,CAAC,GAClD,IAAI;IAcP,qBAAqB,IAAI,OAAO;IAMhC,MAAM;CAyCP;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,EAAE,MAAM,SAO9D"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,EACL,SAAS,EACT,KAAK,EACL,WAAW,EACZ,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAsB,QAAQ,EAAU,MAAM,eAAe,CAAC;AAIrE,MAAM,MAAM,8BAA8B,CAAC,CAAC,SAAS,KAAK,CAAC,GAAG,CAAC,IAC3D,CAAC,MAAM,KAAK,CAAC,GACb,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,KAAK,CAAC,CAAC;AAE1B,qBAAa,sBAAuB,SAAQ,SAAS;IAC3C,QAAQ,EAAE,8BAA8B,CAAC,GAAG,CAAC,CAAC;IACtD,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,aAAa,CAAS;IAC9B,QAAQ,WAML;IACH,OAAO,CAAC,aAAa,CAAc;IAEnC,qBAAqB,IAAI,OAAO;IAMhC,kBAAkB,IAAI,IAAI;IAG1B,yBAAyB,CAAC,SAAS,EAAE,GAAG,GAAG,IAAI;IAe/C,MAAM;CAOP;AAID,wBAAgB,mBAAmB,2CAElC;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,MAAM,IAAI,QAM5C;AAED,wBAAgB,UAAU,CAAC,EAAE,EAAE,MAAM,IAAI,QAMxC;AAED,MAAM,MAAM,6BAA6B,CAAC,CAAC,SAAS,KAAK,CAAC,GAAG,CAAC,IAC1D,CAAC,MAAM,MAAM,KAAK,CAAC,GACnB,CAAC,CAAC,KAAK,EAAE,CAAC,KAAK,MAAM,KAAK,CAAC,CAAC;AAEhC,qBAAa,qBAAqB,CAAC,CAAC,SAAS,KAAK,CAAC,GAAG,CAAC,CAAE,SAAQ,SAAS,CAAC,CAAC,CAAC;IACnE,KAAK,EAAE,6BAA6B,CAAC,CAAC,CAAC,CAAC;IAChD,OAAO,CAAC,QAAQ,CAAC,CAAc;IAC/B,OAAO,CAAC,aAAa,CAAC,CAAa;IAwBnC,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,aAAa,CAAS;IAE9B,QAAQ,WAOL;IAEH,WAAW,UAAS;IACpB,OAAO,EAAE,KAAK,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,GAAG,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,CAAM;IAC3D,QAAQ,gBAAa;IACrB,eAAe;IAUf,QAAQ,EAAE,KAAK,CAAC,MAAM,IAAI,CAAC,CAAM;IACjC,UAAU,EAAE,KAAK,CAAC,MAAM,IAAI,CAAC,CAAM;IAEnC,iBAAiB,IAAI,IAAI;IAGzB,oBAAoB,IAAI,IAAI;IAI5B,yBAAyB,CACvB,SAAS,EAAE,QAAQ,CAAC;QAAE,QAAQ,CAAC,EAAE,WAAW,CAAA;KAAE,GAAG,CAAC,CAAC,GAClD,IAAI;IAcP,qBAAqB,IAAI,OAAO;IAMhC,MAAM;CA6CP;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,EAAE,MAAM,SAO9D"}

package/dist/component.js

@@ -1,6 +1,7 @@
 import { createComponentVNode, Component, } from "inferno";
 import { getCurrentObserver, Observer, Signal } from "./observation";
 import { syncBatch } from "./batch";
+import { CatchErrorContext } from "./useCatchError";
 export class RaskStatelessComponent extends Component {
     isNotified = false;
     isReconciling = false;
@@ -157,10 +158,12 @@ export class RaskStatefulComponent extends Component {
             this.isRendering = false;
         }
         catch (error) {
-            if (typeof this.context.notifyError !== "function") {
+            const notifyError = this.contexts.get(CatchErrorContext) ||
+                this.context.getContext?.(CatchErrorContext);
+            if (typeof notifyError !== "function") {
                 throw error;
             }
-            this.context.notifyError(error);
+            notifyError(error);
         }
         finally {
             stopObserving();

package/dist/error.d.ts

@@ -1,16 +1,5 @@
-import { Component, VNode } from "inferno";
-export declare class ErrorBoundary extends Component<{
-    children: any;
-    error: (error: unknown) => VNode;
-}, {
+export declare const CatchErrorContext: import("./createContext").Context<(error: unknown) => void>;
+export declare function useCatchError(): {
     error: unknown;
-}> {
-    getChildContext(): {
-        notifyError: (error: unknown) => void;
-    };
-    state: {
-        error: null;
-    };
-    render(): any;
-}
+};
 //# sourceMappingURL=error.d.ts.map

package/dist/error.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"error.d.ts","sourceRoot":"","sources":["../src/error.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAE3C,qBAAa,aAAc,SAAQ,SAAS,CAC1C;IAAE,QAAQ,EAAE,GAAG,CAAC;IAAC,KAAK,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,KAAK,CAAA;CAAE,EACnD;IAAE,KAAK,EAAE,OAAO,CAAA;CAAE,CACnB;IACC,eAAe;6BAEU,OAAO;;IAKhC,KAAK;;MAAmB;IAExB,MAAM;CAOP"}
+{"version":3,"file":"error.d.ts","sourceRoot":"","sources":["../src/error.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB,4CAAyB,OAAO,KAAK,IAAI,CAAG,CAAC;AAE3E,wBAAgB,aAAa;WAQK,OAAO;EAOxC"}

package/dist/error.js

@@ -1,17 +1,16 @@
-import { Component } from "inferno";
-export class ErrorBoundary extends Component {
-    getChildContext() {
-        return {
-            notifyError: (error) => {
-                this.setState({ error });
-            },
-        };
-    }
-    state = { error: null };
-    render() {
-        if (this.state.error) {
-            return this.props.error(this.state.error);
-        }
-        return this.props.children;
+import { useState } from "./useState";
+import { createContext, useInjectContext } from "./createContext";
+import { getCurrentComponent } from "./component";
+export const CatchErrorContext = createContext();
+export function useCatchError() {
+    const currentComponent = getCurrentComponent();
+    if (!currentComponent || currentComponent.isRendering) {
+        throw new Error("Only use the useCatchError hook in setup");
     }
+    const inject = useInjectContext(CatchErrorContext);
+    const state = useState({
+        error: null,
+    });
+    inject((error) => (state.error = error));
+    return state;
 }

package/dist/index.d.ts

@@ -3,7 +3,9 @@ export { useCleanup, useMountEffect, RaskStatefulComponent, RaskStatelessCompone
 export { createContext, useContext, useInjectContext } from "./createContext";
 export { useState, assignState } from "./useState";
 export { useAsync, Async } from "./useAsync";
-export { ErrorBoundary } from "./error";
+export { useAction, Action } from "./useAction";
+export { useSuspend } from "./useSuspend";
+export { useCatchError } from "./useCatchError";
 export { useRef } from "./useRef";
 export { useView } from "./useView";
 export { useEffect } from "./useEffect";

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EACL,UAAU,EACV,cAAc,EACd,qBAAqB,EACrB,sBAAsB,GACvB,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAC9E,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGhD,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,cAAc,EACd,eAAe,EACf,cAAc,EACd,SAAS,GACV,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EACL,UAAU,EACV,cAAc,EACd,qBAAqB,EACrB,sBAAsB,GACvB,MAAM,aAAa,CAAC;AACrB,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAC9E,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGhD,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,cAAc,EACd,eAAe,EACf,cAAc,EACd,SAAS,GACV,MAAM,SAAS,CAAC"}

package/dist/index.js

@@ -3,7 +3,9 @@ export { useCleanup, useMountEffect, RaskStatefulComponent, RaskStatelessCompone
 export { createContext, useContext, useInjectContext } from "./createContext";
 export { useState, assignState } from "./useState";
 export { useAsync } from "./useAsync";
-export { ErrorBoundary } from "./error";
+export { useAction } from "./useAction";
+export { useSuspend } from "./useSuspend";
+export { useCatchError } from "./useCatchError";
 export { useRef } from "./useRef";
 export { useView } from "./useView";
 export { useEffect } from "./useEffect";

package/dist/useAction.d.ts

@@ -0,0 +1,18 @@
+export type QueuedAction<P> = {
+    params: P;
+    error: Error | null;
+    retry(): void;
+    cancel(): void;
+};
+export type ActionState<P> = {
+    isPending: boolean;
+    queue: QueuedAction<P>[];
+};
+export type Action<P = null> = [
+    ActionState<P>,
+    [
+        P
+    ] extends [null] ? () => void : (params: P) => void
+];
+export declare function useAction<P = null>(fn: [P] extends [null] ? () => Promise<void> : (params: P) => Promise<void>): Action<P>;
+//# sourceMappingURL=useAction.d.ts.map

package/dist/useAction.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAction.d.ts","sourceRoot":"","sources":["../src/useAction.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI;IAC5B,MAAM,EAAE,CAAC,CAAC;IACV,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,KAAK,IAAI,IAAI,CAAC;IACd,MAAM,IAAI,IAAI,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,IAAI;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,MAAM,CAAC,CAAC,GAAG,IAAI,IAAI;IAC7B,WAAW,CAAC,CAAC,CAAC;IACd;QAAC,CAAC;KAAC,SAAS,CAAC,IAAI,CAAC,GAAG,MAAM,IAAI,GAAG,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI;CACtD,CAAC;AAEF,wBAAgB,SAAS,CAAC,CAAC,GAAG,IAAI,EAChC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,GAC1E,MAAM,CAAC,CAAC,CAAC,CAkDX"}

package/dist/useAction.js

@@ -0,0 +1,43 @@
+import { useState } from "./useState";
+export function useAction(fn) {
+    const state = useState({
+        isPending: false,
+        queue: [],
+    });
+    const processQueue = () => {
+        const next = state.queue[0];
+        if (!next) {
+            state.isPending = false;
+            return;
+        }
+        state.isPending = true;
+        fn(next.params)
+            .then(() => {
+            state.queue.shift();
+            processQueue();
+        })
+            .catch((error) => {
+            next.error = error;
+        });
+    };
+    const run = (params) => {
+        params = (params || null);
+        let actionProxy;
+        const index = state.queue.push({
+            params,
+            error: null,
+            retry() {
+                processQueue();
+            },
+            cancel() {
+                state.queue.splice(state.queue.indexOf(actionProxy), 1);
+                processQueue();
+            },
+        }) - 1;
+        actionProxy = state.queue[index];
+        if (index === 0) {
+            processQueue();
+        }
+    };
+    return [state, run];
+}

package/dist/useAsync.d.ts

@@ -1,27 +1,33 @@
-export type AsyncState<P, T, I = null> = {
-    isPending: false;
-    params: null;
-    value: I;
-    error: null;
+export type AsyncState<T> = {
+    error: Error;
+    isLoading: true;
+    isRefreshing: false;
+    value: null;
+} | {
+    error: Error;
+    isLoading: false;
+    isRefreshing: true;
+    value: T;
 } | {
-    isPending: true;
-    value: T | I;
-    params: P;
     error: null;
+    isLoading: true;
+    isRefreshing: false;
+    value: null;
 } | {
-    isPending: false;
-    params: null;
-    value: T;
     error: null;
+    isLoading: false;
+    isRefreshing: true;
+    value: T;
 } | {
-    isPending: false;
-    params: null;
-    value: T | I;
-    error: string;
+    error: null;
+    isLoading: false;
+    isRefreshing: false;
+    value: T;
 };
-export type Async<A, B = never, I = null> = [B] extends [never] ? [AsyncState<null, A, I>, () => void] : [AsyncState<A, B, I>, (params: A) => void];
-export declare function useAsync<T>(initialValue: T, fn: (params: undefined, signal: AbortSignal) => Promise<T>): Async<T, never, T>;
-export declare function useAsync<P, T>(initialValue: T, fn: (params: P, signal: AbortSignal) => Promise<T>): Async<P, T, T>;
-export declare function useAsync<T>(fn: (params: undefined, signal: AbortSignal) => Promise<T>): Async<T>;
-export declare function useAsync<P, T>(fn: (params: P, signal: AbortSignal) => Promise<T>): Async<P, T>;
+export type Async<T extends NonNullable<any>> = [
+    AsyncState<T>,
+    () => Promise<void>
+];
+export declare function isAsync(value: unknown): boolean;
+export declare function useAsync<T extends NonNullable<any>>(fn: (signal?: AbortSignal) => Promise<T>): Async<T>;
 //# sourceMappingURL=useAsync.d.ts.map

package/dist/useAsync.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAsync.d.ts","sourceRoot":"","sources":["../src/useAsync.ts"],"names":[],"mappings":"AAGA,MAAM,MAAM,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,IACjC;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,IAAI,CAAC;IAChB,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC;IACb,MAAM,EAAE,CAAC,CAAC;IACV,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEN,MAAM,MAAM,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,GAAG,IAAI,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,GAC3D,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,IAAI,CAAC,GACpC,CAAC,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI,CAAC,CAAC;AAE/C,wBAAgB,QAAQ,CAAC,CAAC,EACxB,YAAY,EAAE,CAAC,EACf,EAAE,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC,GACzD,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;AACtB,wBAAgB,QAAQ,CAAC,CAAC,EAAE,CAAC,EAC3B,YAAY,EAAE,CAAC,EACf,EAAE,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC,GACjD,KAAK,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;AAClB,wBAAgB,QAAQ,CAAC,CAAC,EACxB,EAAE,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC,GACzD,KAAK,CAAC,CAAC,CAAC,CAAC;AACZ,wBAAgB,QAAQ,CAAC,CAAC,EAAE,CAAC,EAC3B,EAAE,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC,GACjD,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC"}
+{"version":3,"file":"useAsync.d.ts","sourceRoot":"","sources":["../src/useAsync.ts"],"names":[],"mappings":"AAKA,MAAM,MAAM,UAAU,CAAC,CAAC,IACpB;IACE,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,IAAI,CAAC;IAChB,YAAY,EAAE,KAAK,CAAC;IACpB,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,KAAK,CAAC;IACjB,YAAY,EAAE,IAAI,CAAC;IACnB,KAAK,EAAE,CAAC,CAAC;CACV,GACD;IACE,KAAK,EAAE,IAAI,CAAC;IACZ,SAAS,EAAE,IAAI,CAAC;IAChB,YAAY,EAAE,KAAK,CAAC;IACpB,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,KAAK,EAAE,IAAI,CAAC;IACZ,SAAS,EAAE,KAAK,CAAC;IACjB,YAAY,EAAE,IAAI,CAAC;IACnB,KAAK,EAAE,CAAC,CAAC;CACV,GACD;IACE,KAAK,EAAE,IAAI,CAAC;IACZ,SAAS,EAAE,KAAK,CAAC;IACjB,YAAY,EAAE,KAAK,CAAC;IACpB,KAAK,EAAE,CAAC,CAAC;CACV,CAAC;AAEN,MAAM,MAAM,KAAK,CAAC,CAAC,SAAS,WAAW,CAAC,GAAG,CAAC,IAAI;IAC9C,UAAU,CAAC,CAAC,CAAC;IACb,MAAM,OAAO,CAAC,IAAI,CAAC;CACpB,CAAC;AAEF,wBAAgB,OAAO,CAAC,KAAK,EAAE,OAAO,WAWrC;AAED,wBAAgB,QAAQ,CAAC,CAAC,SAAS,WAAW,CAAC,GAAG,CAAC,EACjD,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC,GA0InC,KAAK,CAAC,CAAC,CAAC,CACd"}

package/dist/useAsync.js

@@ -1,72 +1,131 @@
+import { syncBatch } from "./batch";
 import { useCleanup, getCurrentComponent } from "./component";
+import { Observer } from "./observation";
 import { assignState, useState } from "./useState";
-export function useAsync(...args) {
+export function isAsync(value) {
+    if (value === null || typeof value !== "object") {
+        return false;
+    }
+    return Boolean("isLoading" in value &&
+        "isRefreshing" in value &&
+        "error" in value &&
+        "value" in value);
+}
+export function useAsync(fn) {
     const currentComponent = getCurrentComponent();
     if (!currentComponent || currentComponent.isRendering) {
-        throw new Error("Only use useTask in component setup");
+        throw new Error("Only use useAsync in component setup");
     }
-    const value = args.length === 2 ? args[0] : null;
-    const fn = args.length === 2 ? args[1] : args[0];
     const state = useState({
-        isPending: false,
-        value,
+        isLoading: true,
+        isRefreshing: false,
+        value: null,
         error: null,
-        params: null,
     });
+    const refreshResolvers = [];
     let currentAbortController;
-    const fetch = (params) => {
+    const refresh = () => {
         currentAbortController?.abort();
         const abortController = (currentAbortController = new AbortController());
-        const promise = fn(params, abortController.signal);
+        const stopObserving = observer.observe();
+        const promise = fn(abortController.signal);
+        stopObserving();
         promise
             .then((result) => {
             if (abortController.signal.aborted) {
                 return;
             }
-            assignState(state, {
-                isPending: false,
-                value: result,
-                error: null,
-                params: null,
+            syncBatch(() => {
+                assignState(state, {
+                    isLoading: false,
+                    isRefreshing: false,
+                    value: result,
+                    error: null,
+                });
             });
+            refreshResolvers.forEach((resolver) => resolver.resolve());
+            refreshResolvers.length = 0;
         })
             .catch((error) => {
             if (abortController.signal.aborted) {
                 return;
             }
-            assignState(state, {
-                isPending: false,
-                value: state.value,
-                error: String(error),
-                params: null,
+            syncBatch(() => {
+                assignState(state, {
+                    isLoading: state.isLoading,
+                    isRefreshing: state.isRefreshing,
+                    value: state.value,
+                    error,
+                });
             });
+            refreshResolvers.forEach((resolver) => resolver.reject(error));
+            refreshResolvers.length = 0;
         });
         return promise;
     };
-    useCleanup(() => currentAbortController?.abort());
+    const observer = new Observer(() => {
+        syncBatch(() => {
+            if (state.isLoading) {
+                refresh();
+            }
+            else if (state.error && state.value === null) {
+                assignState(state, {
+                    isLoading: true,
+                    isRefreshing: false,
+                    value: state.value,
+                    error: null,
+                });
+                refresh();
+            }
+            else {
+                assignState(state, {
+                    isLoading: false,
+                    isRefreshing: true,
+                    value: state.value,
+                    error: null,
+                });
+                refresh();
+            }
+        });
+    });
+    useCleanup(() => {
+        currentAbortController?.abort();
+        observer.dispose();
+    });
+    refresh();
     return [
-        {
-            get isPending() {
-                return state.isPending;
-            },
-            get value() {
-                return state.value;
-            },
-            get error() {
-                return state.error;
-            },
-            get params() {
-                return state.params;
-            },
-        },
-        (params) => {
-            fetch(params);
-            assignState(state, {
-                isPending: true,
-                value: state.value,
-                error: null,
-                params: (params || null),
+        state,
+        async () => {
+            if (state.isLoading && !state.error) {
+                return;
+            }
+            syncBatch(() => {
+                if (state.error && state.value === null) {
+                    assignState(state, {
+                        isLoading: true,
+                        isRefreshing: false,
+                        value: state.value,
+                        error: null,
+                    });
+                }
+                else {
+                    assignState(state, {
+                        isLoading: false,
+                        isRefreshing: true,
+                        value: state.value,
+                        error: null,
+                    });
+                }
+            });
+            let resolve;
+            let reject;
+            const promise = new Promise((res, rej) => {
+                resolve = res;
+                reject = rej;
             });
+            refreshResolvers.push({ resolve, reject });
+            refresh();
+            return promise;
         },
     ];
 }

package/dist/useCatchError.d.ts

@@ -0,0 +1,5 @@
+export declare const CatchErrorContext: import("./createContext").Context<(error: unknown) => void>;
+export declare function useCatchError(): {
+    error: unknown;
+};
+//# sourceMappingURL=useCatchError.d.ts.map

package/dist/useCatchError.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCatchError.d.ts","sourceRoot":"","sources":["../src/useCatchError.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB,4CAAyB,OAAO,KAAK,IAAI,CAAG,CAAC;AAE3E,wBAAgB,aAAa;WAQK,OAAO;EAOxC"}

package/dist/useCatchError.js

@@ -0,0 +1,16 @@
+import { useState } from "./useState";
+import { createContext, useInjectContext } from "./createContext";
+import { getCurrentComponent } from "./component";
+export const CatchErrorContext = createContext();
+export function useCatchError() {
+    const currentComponent = getCurrentComponent();
+    if (!currentComponent || currentComponent.isRendering) {
+        throw new Error("Only use the useCatchError hook in setup");
+    }
+    const inject = useInjectContext(CatchErrorContext);
+    const state = useState({
+        error: null,
+    });
+    inject((error) => (state.error = error));
+    return state;
+}

package/dist/useSuspend.d.ts

@@ -0,0 +1,40 @@
+import { AsyncState } from "./useAsync";
+type SuspendState<T extends Record<string, () => any>> = {
+    error: Error;
+    isLoading: true;
+    isRefreshing: false;
+    values: {
+        [K in keyof T]: ReturnType<T[K]> extends AsyncState<any> ? ReturnType<T[K]>["value"] : ReturnType<T[K]>;
+    };
+} | {
+    error: Error;
+    isLoading: false;
+    isRefreshing: true;
+    values: {
+        [K in keyof T]: ReturnType<T[K]> extends AsyncState<any> ? NonNullable<ReturnType<T[K]>["value"]> : ReturnType<T[K]>;
+    };
+} | {
+    error: null;
+    isLoading: true;
+    isRefreshing: false;
+    values: {
+        [K in keyof T]: ReturnType<T[K]> extends AsyncState<any> ? ReturnType<T[K]>["value"] : ReturnType<T[K]>;
+    };
+} | {
+    error: null;
+    isLoading: false;
+    isRefreshing: true;
+    values: {
+        [K in keyof T]: ReturnType<T[K]> extends AsyncState<any> ? NonNullable<ReturnType<T[K]>["value"]> : ReturnType<T[K]>;
+    };
+} | {
+    error: null;
+    isLoading: false;
+    isRefreshing: false;
+    values: {
+        [K in keyof T]: ReturnType<T[K]> extends AsyncState<any> ? NonNullable<ReturnType<T[K]>["value"]> : ReturnType<T[K]>;
+    };
+};
+export declare function useSuspend<T extends Record<string, any>>(asyncs: T): SuspendState<T>;
+export {};
+//# sourceMappingURL=useSuspend.d.ts.map

package/dist/useSuspend.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSuspend.d.ts","sourceRoot":"","sources":["../src/useSuspend.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAW,MAAM,YAAY,CAAC;AAIjD,KAAK,YAAY,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,IACjD;IACE,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,IAAI,CAAC;IAChB,YAAY,EAAE,KAAK,CAAC;IACpB,MAAM,EAAE;SACL,CAAC,IAAI,MAAM,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,UAAU,CAAC,GAAG,CAAC,GACpD,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,GACzB,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;KACrB,CAAC;CACH,GACD;IACE,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,KAAK,CAAC;IACjB,YAAY,EAAE,IAAI,CAAC;IACnB,MAAM,EAAE;SACL,CAAC,IAAI,MAAM,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,UAAU,CAAC,GAAG,CAAC,GACpD,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GACtC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;KACrB,CAAC;CACH,GACD;IACE,KAAK,EAAE,IAAI,CAAC;IACZ,SAAS,EAAE,IAAI,CAAC;IAChB,YAAY,EAAE,KAAK,CAAC;IACpB,MAAM,EAAE;SACL,CAAC,IAAI,MAAM,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,UAAU,CAAC,GAAG,CAAC,GACpD,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,GACzB,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;KACrB,CAAC;CACH,GACD;IACE,KAAK,EAAE,IAAI,CAAC;IACZ,SAAS,EAAE,KAAK,CAAC;IACjB,YAAY,EAAE,IAAI,CAAC;IACnB,MAAM,EAAE;SACL,CAAC,IAAI,MAAM,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,UAAU,CAAC,GAAG,CAAC,GACpD,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GACtC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;KACrB,CAAC;CACH,GACD;IACE,KAAK,EAAE,IAAI,CAAC;IACZ,SAAS,EAAE,KAAK,CAAC;IACjB,YAAY,EAAE,KAAK,CAAC;IACpB,MAAM,EAAE;SACL,CAAC,IAAI,MAAM,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,UAAU,CAAC,GAAG,CAAC,GACpD,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,GACtC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;KACrB,CAAC;CACH,CAAC;AAEN,wBAAgB,UAAU,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,mBAsDlE"}

package/dist/useSuspend.js

@@ -0,0 +1,48 @@
+import { isAsync } from "./useAsync";
+import { useEffect } from "./useEffect";
+import { assignState, useState } from "./useState";
+export function useSuspend(asyncs) {
+    const state = useState({
+        isLoading: true,
+        isRefreshing: false,
+        error: null,
+        values: Object.keys(asyncs).reduce((aggr, key) => {
+            let value = asyncs[key]();
+            if (isAsync(value)) {
+                value = value.value;
+            }
+            aggr[key] = value;
+            return aggr;
+        }, {}),
+    });
+    useEffect(() => {
+        let isLoading = false;
+        let isRefreshing = false;
+        let error;
+        const values = {};
+        for (const key in asyncs) {
+            let value = asyncs[key]();
+            if (!isAsync(value)) {
+                values[key] = value;
+                continue;
+            }
+            values[key] = value.value;
+            if (value.isLoading) {
+                isLoading = true;
+            }
+            else if (value.isRefreshing) {
+                isRefreshing = true;
+            }
+            if (value.error) {
+                error = value.error;
+            }
+        }
+        state.isLoading = isLoading;
+        state.isRefreshing = isLoading ? false : isRefreshing;
+        state.error = error || null;
+        if (!state.isLoading && !state.isRefreshing && !error) {
+            assignState(state.values, values);
+        }
+    });
+    return state;
+}

package/dist/useSuspendAsync.d.ts

@@ -0,0 +1,18 @@
+import { AsyncState } from "./useAsync";
+type SuspendAsyncState<T extends Record<string, AsyncState<any>>> = {
+    values: {
+        [K in keyof T]: T[K]["value"];
+    };
+} & ({
+    isPending: true;
+    error: null;
+} | {
+    isPending: false;
+    error: string;
+} | {
+    isPending: false;
+    error: null;
+});
+export declare function useSuspendAsync<T extends Record<string, AsyncState<any>>>(asyncs: T): SuspendAsyncState<T>;
+export {};
+//# sourceMappingURL=useSuspendAsync.d.ts.map

package/dist/useSuspendAsync.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSuspendAsync.d.ts","sourceRoot":"","sources":["../src/useSuspendAsync.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAIxC,KAAK,iBAAiB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,GAAG,CAAC,CAAC,IAAI;IAClE,MAAM,EAAE;SACL,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;KAC9B,CAAC;CACH,GAAG,CACA;IACE,SAAS,EAAE,IAAI,CAAC;IAChB,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;CACf,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,KAAK,EAAE,IAAI,CAAC;CACb,CACJ,CAAC;AAEF,wBAAgB,eAAe,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,GAAG,CAAC,CAAC,EACvE,MAAM,EAAE,CAAC,wBAyCV"}

package/dist/useSuspendAsync.js

@@ -0,0 +1,37 @@
+import { useEffect } from "./useEffect";
+import { useState } from "./useState";
+export function useSuspendAsync(asyncs) {
+    const state = useState({
+        isPending: false,
+        error: null,
+        values: Object.keys(asyncs).reduce((aggr, key) => ({ ...aggr, [key]: asyncs[key].value }), {}),
+    });
+    useEffect(() => {
+        let isPending = false;
+        let error = "";
+        for (const key in asyncs) {
+            if (asyncs[key].error) {
+                error += asyncs[key].error + "\n";
+                continue;
+            }
+            if (asyncs[key].isPending) {
+                isPending = true;
+                continue;
+            }
+        }
+        if (error) {
+            state.isPending = false;
+            state.error = error;
+            return;
+        }
+        if (isPending) {
+            state.isPending = false;
+            state.error = null;
+            return;
+        }
+        for (const key in asyncs) {
+            state.values[key] = asyncs[key].value;
+        }
+    });
+    return state;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rask-ui",
-  "version": "0.18.3",
+  "version": "0.19.0",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",