@pathscale/ui 2.12.0 → 3.0.0

package/dist/hooks/data/createMutation.d.ts

@@ -1,9 +1,8 @@
-import type { Accessor } from "solid-js";
 /**
  * A write, without a query library. The companion to `createQuery`.
  *
  * Replaces `useMutation`. The same rule applies as there: reading this never
- * suspends and never throws. `mutate` reports failure through `error()`;
+ * suspends and never throws. `mutate` reports failure through `error`;
  * `mutateAsync` rejects, for a caller that wants to await and handle it.
  */
 export interface CreateMutationOptions<TArgs extends unknown[], TResult> {
@@ -13,15 +12,17 @@ export interface CreateMutationOptions<TArgs extends unknown[], TResult> {
     /** Runs after success or failure, like TanStack's `onSettled`. */
     onSettled?: () => void | Promise<void>;
 }
+/** Read as properties, for the same reason as `QueryResult`. */
 export interface MutationResult<TArgs extends unknown[], TResult> {
-    /** Fire and forget. Failure lands on `error()` rather than as a rejection. */
+    /** Fire and forget. Failure lands on `error` rather than as a rejection. */
     mutate: (...args: TArgs) => void;
     /** Fire and await. Rejects on failure. */
     mutateAsync: (...args: TArgs) => Promise<TResult>;
-    isPending: Accessor<boolean>;
-    error: Accessor<unknown>;
+    readonly isPending: boolean;
+    readonly error: unknown;
+    readonly isError: boolean;
     /** The last successful result. */
-    data: Accessor<TResult | undefined>;
+    readonly data: TResult | undefined;
     /** Clear `error` and `data`. */
     reset: () => void;
 }

package/dist/hooks/data/createMutation.js

@@ -29,9 +29,18 @@ const createMutation = (options)=>{
             mutateAsync(...args).catch(()=>{});
         },
         mutateAsync,
-        isPending,
-        error,
-        data,
+        get isPending () {
+            return isPending();
+        },
+        get error () {
+            return error();
+        },
+        get isError () {
+            return void 0 !== error();
+        },
+        get data () {
+            return data();
+        },
         reset: ()=>{
             setError(void 0);
             setData(()=>void 0);

package/dist/hooks/data/createQuery.d.ts

@@ -1,4 +1,3 @@
-import type { Accessor } from "solid-js";
 /**
  * Asynchronous reads, without a query library.
  *
@@ -16,7 +15,7 @@ import type { Accessor } from "solid-js";
  * had nothing to print. That is how a support-chat button that had not
  * connected replaced an entire application with a blank error page.
  *
- * Here, `data()` is `undefined` until there is data, `isLoading()` is true only
+ * Here, `data` is `undefined` until there is data, `isLoading` is true only
  * while a fetch is actually in flight, and neither ever throws. A caller that
  * wants to suspend can do so explicitly; a caller that forgets cannot take the
  * page down.
@@ -32,15 +31,41 @@ export interface CreateQueryOptions<T> {
     /** Held back while false. Default true. */
     enabled?: boolean;
 }
+/**
+ * Read as properties, not as accessors.
+ *
+ * `solid-query` returned a store, so every consumer of it is written
+ * `query.data`, `query.isLoading`, `query.isError` -- roughly three thousand
+ * such reads across these applications. Exposing accessors here would mean
+ * editing all of them to add `()`, turning a migration of the ~300 files that
+ * *define* queries into one that touches every file that reads one.
+ *
+ * These are getters over signals, so a read inside a tracked scope still
+ * subscribes exactly as an accessor call would.
+ */
 export interface QueryResult<T> {
     /** The last value read, or `undefined` before the first one arrives. */
-    data: Accessor<T | undefined>;
+    readonly data: T | undefined;
     /** The last failure, cleared by the next successful read. */
-    error: Accessor<unknown>;
+    readonly error: unknown;
     /** True only while a fetch is in flight. Never true for a disabled query. */
-    isLoading: Accessor<boolean>;
+    readonly isLoading: boolean;
+    /**
+     * Alias of `isLoading`, for call sites carried over from `solid-query`.
+     *
+     * Note the deliberate difference in meaning. There, `isPending` was "has no
+     * data", which stayed true forever for a query held back by `enabled: false`
+     * -- so `if (isPending) return <Spinner/>` spun for the life of the page.
+     * Here it means "a fetch is in flight", so a disabled query reads as not
+     * pending and its consumer renders instead of hanging.
+     */
+    readonly isPending: boolean;
+    /** True when the last read failed. */
+    readonly isError: boolean;
+    /** True when a value has arrived and the last read did not fail. */
+    readonly isSuccess: boolean;
     /** True once a value has arrived at least once. */
-    isReady: Accessor<boolean>;
+    readonly isReady: boolean;
     /** Read again now, regardless of `enabled`. */
     refetch: () => Promise<void>;
 }

package/dist/hooks/data/createQuery.js

@@ -45,10 +45,27 @@ const createQuery = (options)=>{
         generation++;
     });
     return {
-        data,
-        error,
-        isLoading,
-        isReady,
+        get data () {
+            return data();
+        },
+        get error () {
+            return error();
+        },
+        get isLoading () {
+            return isLoading();
+        },
+        get isPending () {
+            return isLoading();
+        },
+        get isError () {
+            return void 0 !== error();
+        },
+        get isSuccess () {
+            return isReady() && void 0 === error();
+        },
+        get isReady () {
+            return isReady();
+        },
         refetch: run
     };
 };

package/dist/hooks/data/createQuery.test.js

@@ -1,5 +1,5 @@
 import { describe, expect, test } from "bun:test";
-import { createRoot, flush } from "solid-js";
+import { createRenderEffect, createRoot, flush } from "solid-js";
 import { createMutation } from "./createMutation.js";
 import { createQuery, invalidateQueries } from "./createQuery.js";
 const tick = ()=>new Promise((resolve)=>setTimeout(resolve, 0));
@@ -17,9 +17,9 @@ describe("createQuery", ()=>{
                         return "value";
                     }
                 }));
-            expect(q.isLoading()).toBe(false);
-            expect(q.data()).toBeUndefined();
-            expect(q.isReady()).toBe(false);
+            expect(q.isLoading).toBe(false);
+            expect(q.data).toBeUndefined();
+            expect(q.isReady).toBe(false);
             return d;
         });
         await tick();
@@ -37,15 +37,15 @@ describe("createQuery", ()=>{
                 }));
             flush();
             const whileLoading = {
-                loading: q.isLoading(),
-                ready: q.isReady()
+                loading: q.isLoading,
+                ready: q.isReady
             };
             resolveFetch?.("hello");
             await tick();
             return {
                 whileLoading,
-                data: q.data(),
-                ready: q.isReady(),
+                data: q.data,
+                ready: q.isReady,
                 dispose
             };
         });
@@ -57,7 +57,7 @@ describe("createQuery", ()=>{
         expect(result.ready).toBe(true);
         result.dispose();
     });
-    test("a failure lands on error() rather than being thrown", async ()=>{
+    test("a failure lands on error rather than being thrown", async ()=>{
         const result = await createRoot(async (dispose)=>{
             const q = createQuery(()=>({
                     key: [
@@ -70,8 +70,8 @@ describe("createQuery", ()=>{
             flush();
             await tick();
             return {
-                error: q.error(),
-                loading: q.isLoading(),
+                error: q.error,
+                loading: q.isLoading,
                 dispose
             };
         });
@@ -134,6 +134,33 @@ describe("createQuery", ()=>{
         expect(calls).toBe(1);
     });
 });
+describe("property reads stay reactive", ()=>{
+    test("a tracked scope re-runs when data lands", async ()=>{
+        let resolveFetch;
+        const seen = [];
+        const result = await createRoot(async (dispose)=>{
+            const q = createQuery(()=>({
+                    key: [
+                        "reactive"
+                    ],
+                    fetcher: ()=>new Promise((r)=>resolveFetch = r)
+                }));
+            createRenderEffect(()=>q.data, (value)=>{
+                seen.push(value);
+            });
+            flush();
+            resolveFetch?.("arrived");
+            await tick();
+            flush();
+            return {
+                dispose
+            };
+        });
+        expect(seen[0]).toBeUndefined();
+        expect(seen.at(-1)).toBe("arrived");
+        result.dispose();
+    });
+});
 describe("createMutation", ()=>{
     test("mutate reports failure without an unhandled rejection", async ()=>{
         const result = await createRoot(async (dispose)=>{
@@ -145,8 +172,8 @@ describe("createMutation", ()=>{
             m.mutate();
             await tick();
             return {
-                error: m.error(),
-                pending: m.isPending(),
+                error: m.error,
+                pending: m.isPending,
                 dispose
             };
         });
@@ -166,7 +193,7 @@ describe("createMutation", ()=>{
             const value = await m.mutateAsync("app");
             return {
                 value,
-                data: m.data(),
+                data: m.data,
                 dispose
             };
         });

package/dist/layouts.manifest.json

@@ -1,7 +1,7 @@
 {
   "format": "solid-layouts-library-v2",
   "package": "@pathscale/ui",
-  "version": "2.12.0",
+  "version": "3.0.0",
   "components": {
     "Accordion": {
       "kind": "embedded"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pathscale/ui",
-  "version": "2.12.0",
+  "version": "3.0.0",
   "author": "pathscale",
   "repository": {
     "type": "git",