rask-ui 0.27.0 → 0.28.1

package/dist/compiler.d.ts

@@ -0,0 +1,4 @@
+export { createVNode, createFragment, createTextVNode, normalizeProps, Component, } from "inferno";
+import { VNode } from "inferno";
+export declare function createComponentVNode(_: any, component: any, props: any | undefined, key: any, ref: any): VNode;
+//# sourceMappingURL=compiler.d.ts.map

package/dist/compiler.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"compiler.d.ts","sourceRoot":"","sources":["../src/compiler.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,cAAc,EACd,eAAe,EACf,cAAc,EACd,SAAS,GACV,MAAM,SAAS,CAAC;AAEjB,OAAO,EAGL,KAAK,EACN,MAAM,SAAS,CAAC;AAIjB,wBAAgB,oBAAoB,CAClC,CAAC,EAAE,GAAG,EACN,SAAS,EAAE,GAAG,EACd,KAAK,EAAE,GAAG,YAAK,EACf,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,GACP,KAAK,CASP"}

package/dist/compiler.js

@@ -0,0 +1,7 @@
+export { createVNode, createFragment, createTextVNode, normalizeProps, Component, } from "inferno";
+import { createComponentVNode as infernoCreateComponentVnode, } from "inferno";
+import { RaskComponent } from "./component";
+export function createComponentVNode(_, component, props = {}, key, ref) {
+    props.__component = component;
+    return infernoCreateComponentVnode(4 /* VNodeFlags.ComponentClass */, RaskComponent, props, key, ref);
+}

package/dist/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAC/D,OAAO,EAAsB,QAAQ,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAMrE,wBAAgB,mBAAmB,mCAElC;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,MAAM,IAAI,QAM5C;AAED,wBAAgB,UAAU,CAAC,EAAE,EAAE,MAAM,IAAI,QAMxC;AAED,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,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,aAAa,CAAC,CAAC,SAAS,KAAK,CAAC,GAAG,CAAC,CAAE,SAAQ,SAAS,CAAC,CAAC,CAAC;IAC3D,QAAQ,EAAE,8BAA8B,CAAC,CAAC,CAAC,CAAC;IACpD,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAM;IAC1C,OAAO,CAAC,aAAa,CAAc;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,UAAU,CAAC,OAAO,EAAE,OAAO;IAS3B,eAAe;IAMf,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;CA4CP"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAC/D,OAAO,EAAsB,QAAQ,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAMrE,wBAAgB,mBAAmB,mCAElC;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,MAAM,IAAI,QAM5C;AAED,wBAAgB,UAAU,CAAC,EAAE,EAAE,MAAM,IAAI,QAMxC;AAED,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,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,aAAa,CAAC,CAAC,SAAS,KAAK,CAAC,GAAG,CAAC,CAAE,SAAQ,SAAS,CAAC,CAAC,CAAC;IAC3D,QAAQ,EAAE,8BAA8B,CAAC,CAAC,CAAC,CAAC;IACpD,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAM;IAC1C,OAAO,CAAC,aAAa,CAAc;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,UAAU,CAAC,OAAO,EAAE,OAAO;IAS3B,eAAe;IAMf,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;CAgDP"}

package/dist/component.js

@@ -121,12 +121,17 @@ export class RaskComponent extends Component {
             return result;
         }
         catch (error) {
-            const notifyError = CatchErrorContext.use();
-            if (typeof notifyError !== "function") {
+            try {
+                const notifyError = CatchErrorContext.use();
+                if (typeof notifyError !== "function") {
+                    throw error;
+                }
+                notifyError(error);
+                return null;
+            }
+            catch {
                 throw error;
             }
-            notifyError(error);
-            return null;
         }
         finally {
             stopObserving();

package/dist/createAsync.d.ts

@@ -0,0 +1,39 @@
+type AsyncState<T> = {
+    isPending: true;
+    value: null;
+    error: null;
+} | {
+    isPending: false;
+    value: T;
+    error: null;
+} | {
+    isPending: false;
+    value: null;
+    error: string;
+};
+/**
+ * Creates a reactive async state that tracks the lifecycle of a promise.
+ *
+ * @warning **Do not destructure the returned reactive object!** Destructuring breaks reactivity.
+ * Access properties directly in your render function instead.
+ *
+ * @example
+ * // ❌ Bad - destructuring loses reactivity
+ * function Component() {
+ *   const async = createAsync(fetchData());
+ *   const { isPending, value, error } = async; // Don't do this!
+ *   return () => <div>{isPending ? "Loading..." : value}</div>; // Won't update!
+ * }
+ *
+ * // ✅ Good - access properties directly
+ * function Component() {
+ *   const async = createAsync(fetchData());
+ *   return () => <div>{async.isPending ? "Loading..." : async.value}</div>;
+ * }
+ *
+ * @param promise - The promise to track
+ * @returns Reactive state with isPending, value, and error properties
+ */
+export declare function createAsync<T>(promise: Promise<T>): AsyncState<T>;
+export {};
+//# sourceMappingURL=createAsync.d.ts.map

package/dist/createAsync.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createAsync.d.ts","sourceRoot":"","sources":["../src/createAsync.ts"],"names":[],"mappings":"AAEA,KAAK,UAAU,CAAC,CAAC,IACb;IACE,SAAS,EAAE,IAAI,CAAC;IAChB,KAAK,EAAE,IAAI,CAAC;IACZ,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,KAAK,EAAE,IAAI,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEN;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,iBAwBjD"}

package/dist/createAsync.js

@@ -0,0 +1,47 @@
+import { createState } from "./createState";
+/**
+ * Creates a reactive async state that tracks the lifecycle of a promise.
+ *
+ * @warning **Do not destructure the returned reactive object!** Destructuring breaks reactivity.
+ * Access properties directly in your render function instead.
+ *
+ * @example
+ * // ❌ Bad - destructuring loses reactivity
+ * function Component() {
+ *   const async = createAsync(fetchData());
+ *   const { isPending, value, error } = async; // Don't do this!
+ *   return () => <div>{isPending ? "Loading..." : value}</div>; // Won't update!
+ * }
+ *
+ * // ✅ Good - access properties directly
+ * function Component() {
+ *   const async = createAsync(fetchData());
+ *   return () => <div>{async.isPending ? "Loading..." : async.value}</div>;
+ * }
+ *
+ * @param promise - The promise to track
+ * @returns Reactive state with isPending, value, and error properties
+ */
+export function createAsync(promise) {
+    const state = createState({
+        isPending: true,
+        error: null,
+        value: null,
+    });
+    promise
+        .then((value) => {
+        Object.assign(state, {
+            value,
+            error: null,
+            isPending: false,
+        });
+    })
+        .catch((error) => {
+        Object.assign(state, {
+            value: null,
+            error: String(error),
+            isPending: false,
+        });
+    });
+    return state;
+}

package/dist/createComputed.d.ts

@@ -0,0 +1,4 @@
+export declare function createComputed<T extends Record<string, () => any>>(computed: T): {
+    [K in keyof T]: ReturnType<T[K]>;
+};
+//# sourceMappingURL=createComputed.d.ts.map

package/dist/createComputed.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createComputed.d.ts","sourceRoot":"","sources":["../src/createComputed.ts"],"names":[],"mappings":"AAIA,wBAAgB,cAAc,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,EAChE,QAAQ,EAAE,CAAC,GACV;KACA,CAAC,IAAI,MAAM,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CACjC,CA0EA"}

package/dist/createComputed.js

@@ -0,0 +1,69 @@
+import { getCurrentComponent, createCleanup } from "./component";
+import { INSPECT_MARKER, INSPECTOR_ENABLED } from "./inspect";
+import { getCurrentObserver, Observer, Signal } from "./observation";
+export function createComputed(computed) {
+    const currentComponent = getCurrentComponent();
+    const proxy = {};
+    let notifyInspectorRef = {};
+    for (const prop in computed) {
+        let isDirty = true;
+        let value;
+        const signal = new Signal();
+        const computedObserver = new Observer(() => {
+            isDirty = true;
+            signal.notify();
+            if (INSPECTOR_ENABLED) {
+                notifyInspectorRef.current?.notify({
+                    type: "computed",
+                    path: notifyInspectorRef.current.path.concat(prop),
+                    isDirty: true,
+                    value,
+                });
+            }
+        });
+        createCleanup(() => computedObserver.dispose());
+        Object.defineProperty(proxy, prop, {
+            enumerable: true,
+            configurable: true,
+            get() {
+                const currentObserver = getCurrentObserver();
+                if (currentObserver) {
+                    currentObserver.subscribeSignal(signal);
+                }
+                if (isDirty) {
+                    const stopObserving = computedObserver.observe();
+                    value = computed[prop]();
+                    stopObserving();
+                    isDirty = false;
+                    if (INSPECTOR_ENABLED) {
+                        notifyInspectorRef.current?.notify({
+                            type: "computed",
+                            path: notifyInspectorRef.current.path.concat(prop),
+                            isDirty: false,
+                            value,
+                        });
+                    }
+                    return value;
+                }
+                return value;
+            },
+        });
+    }
+    if (INSPECTOR_ENABLED) {
+        Object.defineProperty(proxy, INSPECT_MARKER, {
+            enumerable: false,
+            configurable: false,
+            get() {
+                return !notifyInspectorRef.current;
+            },
+            set: (value) => {
+                Object.defineProperty(notifyInspectorRef, "current", {
+                    get() {
+                        return value.current;
+                    },
+                });
+            },
+        });
+    }
+    return proxy;
+}

package/dist/createEffect.d.ts

@@ -0,0 +1,2 @@
+export declare function createEffect(cb: () => void | (() => void)): void;
+//# sourceMappingURL=createEffect.d.ts.map

package/dist/createEffect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createEffect.d.ts","sourceRoot":"","sources":["../src/createEffect.ts"],"names":[],"mappings":"AAIA,wBAAgB,YAAY,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,CAAC,MAAM,IAAI,CAAC,QA2BzD"}

package/dist/createEffect.js

@@ -0,0 +1,29 @@
+import { syncBatch } from "./batch";
+import { createCleanup, getCurrentComponent } from "./component";
+import { Observer } from "./observation";
+export function createEffect(cb) {
+    const component = getCurrentComponent();
+    if (!component || component.isRendering) {
+        throw new Error("Only use createEffect in component setup");
+    }
+    let disposer;
+    const observer = new Observer(() => {
+        syncBatch(runEffect);
+    });
+    const runEffect = () => {
+        try {
+            disposer?.();
+        }
+        catch (error) {
+            console.error("Error in effect dispose function:", error);
+        }
+        const stopObserving = observer.observe();
+        disposer = cb();
+        stopObserving();
+    };
+    createCleanup(() => {
+        observer.dispose();
+        disposer?.();
+    });
+    runEffect();
+}

package/dist/createMutation.d.ts

@@ -0,0 +1,43 @@
+type MutationState<T> = {
+    isPending: true;
+    params: T;
+    error: null;
+} | {
+    isPending: false;
+    params: null;
+    error: null;
+} | {
+    isPending: false;
+    params: null;
+    error: string;
+};
+export type Mutation<T> = MutationState<T> & {
+    mutate(): void;
+    mutate(params: T): void;
+};
+/**
+ * Creates a reactive mutation that manages async mutations with loading and error states.
+ *
+ * @warning **Do not destructure the returned reactive object!** Destructuring breaks reactivity.
+ * Access properties directly in your render function instead.
+ *
+ * @example
+ * // ❌ Bad - destructuring loses reactivity
+ * function Component() {
+ *   const mutation = createMutation((params) => updateUser(params));
+ *   const { isPending, error } = mutation; // Don't do this!
+ *   return () => <button disabled={isPending}>Save</button>; // Won't update!
+ * }
+ *
+ * // ✅ Good - access properties directly
+ * function Component() {
+ *   const mutation = createMutation((params) => updateUser(params));
+ *   return () => <button disabled={mutation.isPending}>Save</button>;
+ * }
+ *
+ * @param mutator - Function that performs the mutation and returns a promise
+ * @returns Reactive mutation object with isPending, params, error properties and mutate method
+ */
+export declare function createMutation<T>(mutator: (params: T) => Promise<T>): Mutation<T>;
+export {};
+//# sourceMappingURL=createMutation.d.ts.map

package/dist/createMutation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createMutation.d.ts","sourceRoot":"","sources":["../src/createMutation.ts"],"names":[],"mappings":"AAEA,KAAK,aAAa,CAAC,CAAC,IAChB;IACE,SAAS,EAAE,IAAI,CAAC;IAChB,MAAM,EAAE,CAAC,CAAC;IACV,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEN,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC,GAAG;IAC3C,MAAM,IAAI,IAAI,CAAC;IACf,MAAM,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,CAAC;CACzB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAC9B,OAAO,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,GACjC,QAAQ,CAAC,CAAC,CAAC,CA0Db"}

package/dist/createMutation.js

@@ -0,0 +1,76 @@
+import { createState } from "./createState";
+/**
+ * Creates a reactive mutation that manages async mutations with loading and error states.
+ *
+ * @warning **Do not destructure the returned reactive object!** Destructuring breaks reactivity.
+ * Access properties directly in your render function instead.
+ *
+ * @example
+ * // ❌ Bad - destructuring loses reactivity
+ * function Component() {
+ *   const mutation = createMutation((params) => updateUser(params));
+ *   const { isPending, error } = mutation; // Don't do this!
+ *   return () => <button disabled={isPending}>Save</button>; // Won't update!
+ * }
+ *
+ * // ✅ Good - access properties directly
+ * function Component() {
+ *   const mutation = createMutation((params) => updateUser(params));
+ *   return () => <button disabled={mutation.isPending}>Save</button>;
+ * }
+ *
+ * @param mutator - Function that performs the mutation and returns a promise
+ * @returns Reactive mutation object with isPending, params, error properties and mutate method
+ */
+export function createMutation(mutator) {
+    const state = createState({
+        isPending: false,
+        params: null,
+        error: null,
+    });
+    const assign = (newState) => {
+        Object.assign(state, newState);
+    };
+    let currentAbortController;
+    return {
+        get isPending() {
+            return state.isPending;
+        },
+        get params() {
+            return state.params;
+        },
+        get error() {
+            return state.error;
+        },
+        mutate(params) {
+            currentAbortController?.abort();
+            const abortController = (currentAbortController = new AbortController());
+            assign({
+                isPending: true,
+                params,
+                error: null,
+            });
+            mutator(params)
+                .then(() => {
+                if (abortController.signal.aborted) {
+                    return;
+                }
+                assign({
+                    isPending: false,
+                    params: null,
+                    error: null,
+                });
+            })
+                .catch((error) => {
+                if (abortController.signal.aborted) {
+                    return;
+                }
+                assign({
+                    isPending: false,
+                    params: null,
+                    error: String(error),
+                });
+            });
+        },
+    };
+}

package/dist/createQuery.d.ts

@@ -0,0 +1,42 @@
+type QueryState<T> = {
+    isPending: true;
+    data: T | null;
+    error: null;
+} | {
+    isPending: false;
+    data: T;
+    error: null;
+} | {
+    isPending: false;
+    data: null;
+    error: string;
+};
+export type Query<T> = QueryState<T> & {
+    fetch(force?: boolean): void;
+};
+/**
+ * Creates a reactive query that manages data fetching with loading and error states.
+ *
+ * @warning **Do not destructure the returned reactive object!** Destructuring breaks reactivity.
+ * Access properties directly in your render function instead.
+ *
+ * @example
+ * // ❌ Bad - destructuring loses reactivity
+ * function Component() {
+ *   const query = createQuery(() => fetchUsers());
+ *   const { isPending, data, error } = query; // Don't do this!
+ *   return () => <div>{isPending ? "Loading..." : data.length}</div>; // Won't update!
+ * }
+ *
+ * // ✅ Good - access properties directly
+ * function Component() {
+ *   const query = createQuery(() => fetchUsers());
+ *   return () => <div>{query.isPending ? "Loading..." : query.data.length}</div>;
+ * }
+ *
+ * @param fetcher - Function that returns a promise with the data to fetch
+ * @returns Reactive query object with isPending, data, error properties and fetch method
+ */
+export declare function createQuery<T>(fetcher: () => Promise<T>): Query<T>;
+export {};
+//# sourceMappingURL=createQuery.d.ts.map

package/dist/createQuery.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createQuery.d.ts","sourceRoot":"","sources":["../src/createQuery.ts"],"names":[],"mappings":"AAEA,KAAK,UAAU,CAAC,CAAC,IACb;IACE,SAAS,EAAE,IAAI,CAAC;IAChB,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IACf,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,IAAI,EAAE,CAAC,CAAC;IACR,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,IAAI,EAAE,IAAI,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEN,MAAM,MAAM,KAAK,CAAC,CAAC,IAAI,UAAU,CAAC,CAAC,CAAC,GAAG;IACrC,KAAK,CAAC,KAAK,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CA+DlE"}

package/dist/createQuery.js

@@ -0,0 +1,80 @@
+import { createState } from "./createState";
+/**
+ * Creates a reactive query that manages data fetching with loading and error states.
+ *
+ * @warning **Do not destructure the returned reactive object!** Destructuring breaks reactivity.
+ * Access properties directly in your render function instead.
+ *
+ * @example
+ * // ❌ Bad - destructuring loses reactivity
+ * function Component() {
+ *   const query = createQuery(() => fetchUsers());
+ *   const { isPending, data, error } = query; // Don't do this!
+ *   return () => <div>{isPending ? "Loading..." : data.length}</div>; // Won't update!
+ * }
+ *
+ * // ✅ Good - access properties directly
+ * function Component() {
+ *   const query = createQuery(() => fetchUsers());
+ *   return () => <div>{query.isPending ? "Loading..." : query.data.length}</div>;
+ * }
+ *
+ * @param fetcher - Function that returns a promise with the data to fetch
+ * @returns Reactive query object with isPending, data, error properties and fetch method
+ */
+export function createQuery(fetcher) {
+    const state = createState({
+        isPending: true,
+        data: null,
+        error: null,
+    });
+    const assign = (newState) => {
+        Object.assign(state, newState);
+    };
+    let currentAbortController;
+    const fetch = () => {
+        currentAbortController?.abort();
+        const abortController = (currentAbortController = new AbortController());
+        fetcher()
+            .then((data) => {
+            if (abortController.signal.aborted) {
+                return;
+            }
+            assign({
+                isPending: false,
+                data,
+                error: null,
+            });
+        })
+            .catch((error) => {
+            if (abortController.signal.aborted) {
+                return;
+            }
+            assign({
+                isPending: false,
+                data: null,
+                error: String(error),
+            });
+        });
+    };
+    fetch();
+    return {
+        get isPending() {
+            return state.isPending;
+        },
+        get data() {
+            return state.data;
+        },
+        get error() {
+            return state.error;
+        },
+        fetch(force) {
+            assign({
+                isPending: true,
+                data: force ? null : state.data,
+                error: null,
+            });
+            fetch();
+        },
+    };
+}

package/dist/createRouter.d.ts

@@ -0,0 +1,8 @@
+import { RoutesConfig, TRouter, TRoutes } from "typed-client-router";
+export type Router<T extends RoutesConfig> = Omit<TRouter<T>, "current" | "listen" | "pathname"> & {
+    route?: TRoutes<T>;
+};
+export declare function createRouter<const T extends RoutesConfig>(config: T, options?: {
+    base?: string;
+}): Router<T>;
+//# sourceMappingURL=createRouter.d.ts.map

package/dist/createRouter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createRouter.d.ts","sourceRoot":"","sources":["../src/createRouter.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,YAAY,EACZ,OAAO,EACP,OAAO,EACR,MAAM,qBAAqB,CAAC;AAI7B,MAAM,MAAM,MAAM,CAAC,CAAC,SAAS,YAAY,IAAI,IAAI,CAC/C,OAAO,CAAC,CAAC,CAAC,EACV,SAAS,GAAG,QAAQ,GAAG,UAAU,CAClC,GAAG;IACF,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;CACpB,CAAC;AAEF,wBAAgB,YAAY,CAAC,KAAK,CAAC,CAAC,SAAS,YAAY,EACvD,MAAM,EAAE,CAAC,EACT,OAAO,CAAC,EAAE;IACR,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,GACA,MAAM,CAAC,CAAC,CAAC,CA4BX"}

package/dist/createRouter.js

@@ -0,0 +1,27 @@
+import { createRouter as internalCreateRouter, } from "typed-client-router";
+import { getCurrentObserver, Signal } from "./observation";
+import { createCleanup, getCurrentComponent } from "./component";
+export function createRouter(config, options) {
+    if (!getCurrentComponent()) {
+        throw new Error("Only use createRouter in component setup");
+    }
+    const router = internalCreateRouter(config, options);
+    const signal = new Signal();
+    createCleanup(router.listen(() => signal.notify()));
+    return {
+        get route() {
+            const observer = getCurrentObserver();
+            if (observer) {
+                observer.subscribeSignal(signal);
+            }
+            return router.current;
+        },
+        get queries() {
+            return router.queries;
+        },
+        setQuery: router.setQuery,
+        push: router.push,
+        replace: router.replace,
+        url: router.url,
+    };
+}

package/dist/createState.d.ts

@@ -0,0 +1,28 @@
+export declare function assignState<T extends object>(state: T, newState: T): T;
+/**
+ * Creates a reactive state object that tracks property access and notifies observers on changes.
+ *
+ * @warning **Do not destructure the returned reactive object!** Destructuring breaks reactivity
+ * because it extracts plain values instead of maintaining proxy access. This is the same rule
+ * as Solid.js signals.
+ *
+ * @example
+ * // ❌ Bad - destructuring loses reactivity
+ * function Component(props) {
+ *   const state = createState({ count: 0, name: "foo" });
+ *   const { count, name } = state; // Don't do this!
+ *   return () => <div>{count} {name}</div>; // Won't update!
+ * }
+ *
+ * // ✅ Good - access properties directly in render
+ * function Component(props) {
+ *   const state = createState({ count: 0, name: "foo" });
+ *   return () => <div>{state.count} {state.name}</div>; // Reactive!
+ * }
+ *
+ * @param state - The initial state object to make reactive
+ * @returns A reactive proxy of the state object
+ */
+export declare function createState<T extends object>(state: T): T;
+export declare const PROXY_MARKER: unique symbol;
+//# sourceMappingURL=createState.d.ts.map

package/dist/createState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createState.d.ts","sourceRoot":"","sources":["../src/createState.ts"],"names":[],"mappings":"AAIA,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,EAAE,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,KAElE;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,EAAE,KAAK,EAAE,CAAC,GAAG,CAAC,CAOzD;AAGD,eAAO,MAAM,YAAY,eAAoB,CAAC"}