rask-ui 0.12.1 → 0.12.2

package/README.md

@@ -903,13 +903,13 @@ function TodoList() {
 
 ```tsx
 // Task without parameters - auto-runs on creation
-createTask<T>(task: () => Promise<T>): Task<T> & {
+createTask<T>(task: (params: undefined, signal: AbortSignal) => Promise<T>): Task<T> & {
   run(): Promise<T>;
   rerun(): Promise<T>;
 }
 
 // Task with parameters - manual control
-createTask<P, T>(task: (params: P) => Promise<T>): Task<P, T> & {
+createTask<P, T>(task: (params: P, signal: AbortSignal) => Promise<T>): Task<P, T> & {
   run(params: P): Promise<T>;
   rerun(params: P): Promise<T>;
 }
@@ -966,12 +966,82 @@ Error:
 { isRunning: false, params: null, result: null, error: string }
 ```
 
+**Signal Parameter:**
+
+The task callback receives an `AbortSignal` as the second parameter. This signal is useful for:
+
+- **Passing to fetch requests** - Cancel network requests when the task is aborted
+- **Detecting cancellation** - Check if the task was cancelled after async operations complete
+- **Custom state management** - Detect if the task was rerun and implement your own cleanup logic
+
+```tsx
+function SearchPosts() {
+  const state = createState({ query: "" });
+
+  const search = createTask((query: string, signal: AbortSignal) =>
+    fetch(`/api/search?q=${query}`, { signal }).then((r) => r.json())
+  );
+
+  createEffect(() => {
+    if (state.query) {
+      search.run(state.query);
+    }
+  });
+
+  return () => (
+    <div>
+      <input
+        value={state.query}
+        onInput={(e) => (state.query = e.target.value)}
+      />
+      {search.isRunning && <p>Searching...</p>}
+      {search.result && (
+        <ul>
+          {search.result.map((post) => (
+            <li key={post.id}>{post.title}</li>
+          ))}
+        </ul>
+      )}
+    </div>
+  );
+}
+
+// Detecting cancellation for custom state management
+function CustomStateExample() {
+  const state = createState({ data: null, customLoading: false });
+
+  const task = createTask(async (id: number, signal: AbortSignal) => {
+    state.customLoading = true;
+    const result = await fetch(`/api/data/${id}`).then((r) => r.json());
+
+    // Check if task was cancelled/rerun after the async operation
+    if (signal.aborted) {
+      // Don't update state if the task was cancelled
+      return result;
+    }
+
+    state.data = result;
+    state.customLoading = false;
+    return result;
+  });
+
+  return () => (
+    <div>
+      {state.customLoading && <p>Loading...</p>}
+      {state.data && <p>Data: {JSON.stringify(state.data)}</p>}
+      <button onClick={() => task.run(1)}>Load Data</button>
+    </div>
+  );
+}
+```
+
 **Features:**
 
 - **Automatic cancellation** - Previous executions are cancelled when a new one starts
 - **Flexible control** - Use `run()` to clear old data or `rerun()` to keep it during loading
 - **Type-safe** - Full TypeScript inference for parameters and results
 - **Auto-run support** - Tasks without parameters run automatically on creation
+- **Signal support** - AbortSignal provided for cancellation detection and request cancellation
 - **Generic primitive** - Build your own patterns on top (queries, mutations, etc.)
 
 **Usage Patterns:**

package/dist/createTask.d.ts

@@ -26,6 +26,6 @@ export type Task<A, B = never> = [B] extends [never] ? TaskState<null, A> & {
     run(params: A): Promise<B>;
     rerun(params: A): Promise<B>;
 };
-export declare function createTask<T>(task: () => Promise<T>): Task<T>;
-export declare function createTask<P, T>(task: (params: P) => Promise<T>): Task<P, T>;
+export declare function createTask<T>(task: (params: undefined, signal: AbortSignal) => Promise<T>): Task<T>;
+export declare function createTask<P, T>(task: (params: P, signal: AbortSignal) => Promise<T>): Task<P, T>;
 //# sourceMappingURL=createTask.d.ts.map

package/dist/createTask.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createTask.d.ts","sourceRoot":"","sources":["../src/createTask.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,SAAS,CAAC,CAAC,EAAE,CAAC,IACtB;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,IAAI,CAAC;IAChB,MAAM,EAAE,CAAC,GAAG,IAAI,CAAC;IACjB,MAAM,EAAE,CAAC,CAAC;IACV,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,MAAM,EAAE,CAAC,CAAC;IACV,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEN,MAAM,MAAM,IAAI,CAAC,CAAC,EAAE,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,GAChD,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC,GAAG;IACnB,GAAG,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC;IAClB,KAAK,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC;CACrB,GACD,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IAChB,GAAG,CAAC,MAAM,EAAE,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;IAC3B,KAAK,CAAC,MAAM,EAAE,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;CAC9B,CAAC;AAEN,wBAAgB,UAAU,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;AAC/D,wBAAgB,UAAU,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC"}
+{"version":3,"file":"createTask.d.ts","sourceRoot":"","sources":["../src/createTask.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,SAAS,CAAC,CAAC,EAAE,CAAC,IACtB;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,IAAI,CAAC;IAChB,MAAM,EAAE,CAAC,GAAG,IAAI,CAAC;IACjB,MAAM,EAAE,CAAC,CAAC;IACV,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,MAAM,EAAE,CAAC,CAAC;IACV,KAAK,EAAE,IAAI,CAAC;CACb,GACD;IACE,SAAS,EAAE,KAAK,CAAC;IACjB,MAAM,EAAE,IAAI,CAAC;IACb,MAAM,EAAE,IAAI,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEN,MAAM,MAAM,IAAI,CAAC,CAAC,EAAE,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,GAChD,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC,GAAG;IACnB,GAAG,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC;IAClB,KAAK,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC;CACrB,GACD,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IAChB,GAAG,CAAC,MAAM,EAAE,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;IAC3B,KAAK,CAAC,MAAM,EAAE,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;CAC9B,CAAC;AAEN,wBAAgB,UAAU,CAAC,CAAC,EAC1B,IAAI,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC,GAC3D,IAAI,CAAC,CAAC,CAAC,CAAC;AACX,wBAAgB,UAAU,CAAC,CAAC,EAAE,CAAC,EAC7B,IAAI,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC,GACnD,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC"}

package/dist/createTask.js

@@ -10,7 +10,7 @@ export function createTask(task) {
     const fetch = (params) => {
         currentAbortController?.abort();
         const abortController = (currentAbortController = new AbortController());
-        const promise = task(params);
+        const promise = task(params, abortController.signal);
         promise
             .then((result) => {
             if (abortController.signal.aborted) {

package/package.json

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