@datafn/svelte 0.0.2

package/README.md

@@ -0,0 +1,290 @@
+# @datafn/svelte
+
+Svelte bindings for DataFn. Converts DataFn reactive signals into Svelte readable stores for seamless integration with Svelte 3, 4, and 5 components.
+
+## Installation
+
+```bash
+npm install @datafn/svelte @datafn/core
+# Peer dependency
+npm install svelte
+```
+
+## Features
+
+- **Seamless Reactivity** — Mutations and sync changes in DataFn automatically update your Svelte components
+- **Automatic Cleanup** — Store subscriptions are cleaned up when components are destroyed
+- **State Properties** — Stores expose `data`, `loading`, `error`, and `refreshing` for complete UI control
+- **Derived Store Support** — Returns standard Svelte `Readable`, composable with `derived` stores
+- **Svelte 3 / 4 / 5 Compatible** — Works with reactive declarations (`$:`) and runes
+
+---
+
+## Quick Start
+
+```svelte
+<script lang="ts">
+  import { createDatafnClient, IndexedDbStorageAdapter } from "@datafn/client";
+  import { toSvelteStore } from "@datafn/svelte";
+
+  const client = createDatafnClient({
+    schema: mySchema,
+    clientId: "device-1",
+    storage: new IndexedDbStorageAdapter("my-db"),
+    sync: { remote: "http://localhost:3000/datafn" },
+  });
+
+  // Create a DataFn signal (reactive query)
+  const signal = client.table("tasks").signal({
+    filters: { completed: false },
+    sort: ["-createdAt"],
+  });
+
+  // Convert to Svelte store
+  const tasks = toSvelteStore(signal);
+</script>
+
+{#if $tasks.loading}
+  <p>Loading...</p>
+{:else if $tasks.error}
+  <p>Error: {$tasks.error.message}</p>
+{:else}
+  {#each $tasks.data || [] as task (task.id)}
+    <div>{task.title}</div>
+  {/each}
+{/if}
+```
+
+---
+
+## API
+
+### toSvelteStore\<T\>(signal): DatafnSvelteStore\<T\>
+
+Converts a DataFn `Signal<T>` into a Svelte `Readable` store that wraps the signal value with state properties.
+
+**Parameters:**
+
+| Parameter | Type | Description |
+|-----------|------|-------------|
+| `signal` | `DatafnSignal<T>` | A signal from `table.signal()` or `client.kv.signal()` |
+
+**Returns:**
+
+A `Readable<{ data: T; loading: boolean; error: DatafnError | null; refreshing: boolean }>`.
+
+| Property | Type | Description |
+|----------|------|-------------|
+| `data` | `T` | The current signal value (query results, KV value, etc.) |
+| `loading` | `boolean` | `true` while the initial fetch is in progress |
+| `error` | `DatafnError \| null` | Non-null if the last fetch/refresh failed |
+| `refreshing` | `boolean` | `true` while a background refresh is in progress |
+
+**Type:**
+
+```typescript
+type DatafnSvelteStore<T> = Readable<{
+  data: T;
+  loading: boolean;
+  error: DatafnError | null;
+  refreshing: boolean;
+}>;
+```
+
+---
+
+## Usage Patterns
+
+### Table Query Signals
+
+```svelte
+<script lang="ts">
+  import { toSvelteStore } from "@datafn/svelte";
+  import { client } from "./lib/datafn";
+
+  // All tasks
+  const allTasks = toSvelteStore(
+    client.table("tasks").signal({ sort: ["-createdAt"] })
+  );
+
+  // Filtered tasks
+  const activeTasks = toSvelteStore(
+    client.table("tasks").signal({
+      filters: { completed: false },
+      sort: ["priority", "-createdAt"],
+    })
+  );
+
+  // With select and limit
+  const recentTasks = toSvelteStore(
+    client.table("tasks").signal({
+      select: ["id", "title"],
+      sort: ["-createdAt"],
+      limit: 5,
+    })
+  );
+</script>
+
+<h2>Active Tasks ({($activeTasks.data || []).length})</h2>
+{#each $activeTasks.data || [] as task (task.id)}
+  <div>{task.title}</div>
+{/each}
+```
+
+### KV Signal Stores
+
+```svelte
+<script lang="ts">
+  import { toSvelteStore } from "@datafn/svelte";
+  import { client } from "./lib/datafn";
+
+  // Reactive KV preference
+  const theme = toSvelteStore(
+    client.kv.signal<string>("pref:theme", { defaultValue: "dark" })
+  );
+
+  async function toggleTheme() {
+    const next = $theme.data === "dark" ? "light" : "dark";
+    await client.kv.set("pref:theme", next);
+    // Store auto-updates — no manual refresh needed
+  }
+</script>
+
+<button on:click={toggleTheme}>
+  Theme: {$theme.data}
+</button>
+```
+
+### Derived Stores
+
+Since `toSvelteStore` returns a standard Svelte `Readable`, you can compose it with `derived`:
+
+```typescript
+import { derived } from "svelte/store";
+import { toSvelteStore } from "@datafn/svelte";
+
+const allTasks = toSvelteStore(client.table("tasks").signal({}));
+
+// Compute statistics from the live data
+const stats = derived(allTasks, ($tasks) => {
+  const data = $tasks.data || [];
+  return {
+    total: data.length,
+    completed: data.filter((t: any) => t.completed).length,
+    active: data.filter((t: any) => !t.completed).length,
+  };
+});
+```
+
+```svelte
+<p>{$stats.total} tasks — {$stats.active} active, {$stats.completed} done</p>
+```
+
+### Reactive Query Parameters (Svelte 3/4)
+
+Re-create the store when a reactive variable changes:
+
+```svelte
+<script>
+  import { toSvelteStore } from "@datafn/svelte";
+  import { client } from "./lib/datafn";
+
+  export let categoryId;
+
+  // Re-creates the store whenever categoryId changes
+  $: tasks = toSvelteStore(
+    client.table("tasks").signal({
+      filters: { categoryId },
+      sort: ["-createdAt"],
+    })
+  );
+</script>
+
+{#each $tasks.data || [] as task (task.id)}
+  <div>{task.title}</div>
+{/each}
+```
+
+### Loading & Error States
+
+Handle all states for a polished UX:
+
+```svelte
+<script>
+  import { toSvelteStore } from "@datafn/svelte";
+  import { client } from "./lib/datafn";
+
+  const tasks = toSvelteStore(
+    client.table("tasks").signal({ sort: ["-createdAt"] })
+  );
+</script>
+
+{#if $tasks.loading}
+  <div class="skeleton">Loading tasks...</div>
+{:else if $tasks.error}
+  <div class="error">
+    <p>Failed to load tasks: {$tasks.error.message}</p>
+    <code>{$tasks.error.code}</code>
+  </div>
+{:else}
+  <ul>
+    {#each $tasks.data || [] as task (task.id)}
+      <li>{task.title}</li>
+    {/each}
+  </ul>
+
+  {#if $tasks.refreshing}
+    <small>Refreshing...</small>
+  {/if}
+{/if}
+```
+
+### Multiple Stores in a Component
+
+```svelte
+<script lang="ts">
+  import { toSvelteStore } from "@datafn/svelte";
+  import { client } from "./lib/datafn";
+
+  const todos = toSvelteStore(client.table("todos").signal({ sort: ["-createdAt"] }));
+  const categories = toSvelteStore(client.table("categories").signal({ sort: ["name"] }));
+  const theme = toSvelteStore(client.kv.signal("pref:theme", { defaultValue: "dark" }));
+</script>
+
+<main class={$theme.data}>
+  <h1>Todos ({($todos.data || []).length})</h1>
+  <!-- ... -->
+  <aside>
+    <h2>Categories ({($categories.data || []).length})</h2>
+    <!-- ... -->
+  </aside>
+</main>
+```
+
+---
+
+## How It Works
+
+1. `toSvelteStore(signal)` creates a Svelte `readable` store
+2. On first subscriber, the store subscribes to the DataFn signal
+3. When the signal value changes (mutation, sync, or refresh), the store updates
+4. The store reads `signal.loading`, `signal.error`, and `signal.refreshing` on each update
+5. When the last subscriber unsubscribes (component destroyed), the signal subscription is cleaned up
+
+This means:
+- **Lazy**: No data is fetched until a component subscribes
+- **Shared**: Multiple components using the same signal share a single cached query
+- **Auto-updating**: Mutations to the underlying resource trigger automatic signal refresh
+
+---
+
+## Exports
+
+```typescript
+export { toSvelteStore }
+export type { DatafnSvelteStore }
+```
+
+## License
+
+MIT

package/dist/index.cjs

@@ -0,0 +1,100 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  toSvelteStore: () => toSvelteStore
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/toSvelteStore.ts
+var import_store = require("svelte/store");
+function toSvelteStore(signalOrClientRef, signalFactory) {
+  if (signalFactory !== void 0) {
+    return toSvelteStoreFactory(signalOrClientRef, signalFactory);
+  }
+  return toSvelteStoreDirect(signalOrClientRef);
+}
+function toSvelteStoreDirect(signal) {
+  return (0, import_store.readable)(
+    {
+      data: signal.get(),
+      loading: signal.loading,
+      error: signal.error,
+      refreshing: signal.refreshing,
+      nextCursor: signal.nextCursor ?? null
+    },
+    (set) => {
+      const unsub = signal.subscribe((value) => {
+        set({
+          data: value,
+          loading: signal.loading,
+          error: signal.error,
+          refreshing: signal.refreshing,
+          nextCursor: signal.nextCursor ?? null
+        });
+      });
+      return () => {
+        unsub();
+      };
+    }
+  );
+}
+function toSvelteStoreFactory(clientRef, signalFactory) {
+  return (0, import_store.readable)(
+    { data: void 0, loading: true, error: null, refreshing: false, nextCursor: null },
+    (set) => {
+      let currentSignal = null;
+      let currentUnsubSignal = null;
+      const unsubClient = clientRef.subscribe((client) => {
+        currentUnsubSignal?.();
+        currentSignal?.dispose();
+        currentSignal = signalFactory(client);
+        set({
+          data: currentSignal.get(),
+          loading: currentSignal.loading,
+          error: currentSignal.error,
+          refreshing: currentSignal.refreshing,
+          nextCursor: currentSignal.nextCursor ?? null
+        });
+        currentUnsubSignal = currentSignal.subscribe((value) => {
+          set({
+            data: value,
+            loading: currentSignal.loading,
+            error: currentSignal.error,
+            refreshing: currentSignal.refreshing,
+            nextCursor: currentSignal.nextCursor ?? null
+          });
+        });
+      });
+      return () => {
+        unsubClient();
+        currentUnsubSignal?.();
+        currentSignal?.dispose();
+        currentSignal = null;
+      };
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  toSvelteStore
+});
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/toSvelteStore.ts"],"sourcesContent":["/**\n * @datafn/svelte public API\n */\n\nexport { toSvelteStore } from \"./toSvelteStore.js\";\nexport type { DatafnSvelteStore, ClientRef } from \"./toSvelteStore.js\";\n","/**\n * Convert DataFn signal to Svelte store\n */\n\nimport type { DatafnSignal, DatafnError } from \"@datafn/core\";\nimport type { Readable } from \"svelte/store\";\nimport { readable } from \"svelte/store\";\n\n/**\n * A client reference that can notify subscribers when the underlying client\n * changes. Compatible with `{ subscribe: client.subscribeClient }` from a\n * unified `createDatafnClient`, or any Svelte writable store holding a client.\n */\nexport type ClientRef<C> = {\n  subscribe(fn: (client: C) => void): () => void;\n};\n\n/**\n * Store type that wraps signal value with state properties.\n * Returned by both overloads.\n */\nexport type DatafnSvelteStore<T> = Readable<{\n  data: T;\n  loading: boolean;\n  error: DatafnError | null;\n  refreshing: boolean;\n  nextCursor?: string | null;\n}>;\n\n/**\n * Convert a lifecycle-aware DataFn signal directly to a Svelte readable store.\n *\n * Signals from `createDatafnClient` are lifecycle-aware — they survive\n * `switchContext()` and rebind automatically. No factory pattern or `clientRef`\n * is needed.\n *\n * ```typescript\n * const todosStore = toSvelteStore(\n *   client.todos.signal({ sort: [\"-createdAt\"] })\n * );\n * // Template: {#each $todosStore.data ?? [] as todo}\n * // Also: {#if $todosStore.loading} Loading... {/if}\n * ```\n */\nexport function toSvelteStore<T>(signal: DatafnSignal<T>): DatafnSvelteStore<T>;\n\n/**\n * Convert a DataFn signal factory to a reactive Svelte readable store.\n *\n * Accepts a `clientRef` (anything with a `subscribe(fn)` API) and a\n * `signalFactory` that creates a new signal from the current client. The store\n * automatically disposes the old signal and creates a fresh one whenever the\n * client changes, preventing memory leaks and ensuring signals are always\n * bound to the active client.\n */\nexport function toSvelteStore<T, C>(\n  clientRef: ClientRef<C>,\n  signalFactory: (client: C) => DatafnSignal<T>,\n): DatafnSvelteStore<T>;\n\nexport function toSvelteStore<T, C = any>(\n  signalOrClientRef: DatafnSignal<T> | ClientRef<C>,\n  signalFactory?: (client: C) => DatafnSignal<T>,\n): DatafnSvelteStore<T> {\n  if (signalFactory !== undefined) {\n    return toSvelteStoreFactory(signalOrClientRef as ClientRef<C>, signalFactory);\n  }\n  return toSvelteStoreDirect(signalOrClientRef as DatafnSignal<T>);\n}\n\n/**\n * Direct signal overload: wraps a DatafnSignal as a Svelte readable store.\n * The store emits `{ data, loading, error, refreshing }` on each update.\n * Does NOT call signal.dispose() on teardown — the signal's lifecycle is\n * managed by the LiveSignalRegistry, allowing multiple stores to share a\n * deduplicated signal safely.\n */\nfunction toSvelteStoreDirect<T>(signal: DatafnSignal<T>): DatafnSvelteStore<T> {\n  return readable(\n    {\n      data: signal.get(),\n      loading: signal.loading,\n      error: signal.error,\n      refreshing: signal.refreshing,\n      nextCursor: signal.nextCursor ?? null,\n    },\n    (set) => {\n      const unsub = signal.subscribe((value: T) => {\n        set({\n          data: value,\n          loading: signal.loading,\n          error: signal.error,\n          refreshing: signal.refreshing,\n          nextCursor: signal.nextCursor ?? null,\n        });\n      });\n      return () => {\n        unsub();\n      };\n    },\n  );\n}\n\n/**\n * Factory overload: subscribes to clientRef, creates/disposes signal on each\n * client change. Returns a DatafnSvelteStore with { data, loading, error, refreshing }.\n */\nfunction toSvelteStoreFactory<T, C>(\n  clientRef: ClientRef<C>,\n  signalFactory: (client: C) => DatafnSignal<T>,\n): DatafnSvelteStore<T> {\n  return readable(\n    { data: undefined as unknown as T, loading: true as boolean, error: null as DatafnError | null, refreshing: false as boolean, nextCursor: null as string | null },\n    (set) => {\n      let currentSignal: DatafnSignal<T> | null = null;\n      let currentUnsubSignal: (() => void) | null = null;\n\n      const unsubClient = clientRef.subscribe((client) => {\n        // Tear down previous signal\n        currentUnsubSignal?.();\n        currentSignal?.dispose();\n\n        // Create a fresh signal from the new client\n        currentSignal = signalFactory(client);\n\n        // Emit the initial value immediately\n        set({\n          data: currentSignal.get(),\n          loading: currentSignal.loading,\n          error: currentSignal.error,\n          refreshing: currentSignal.refreshing,\n          nextCursor: currentSignal.nextCursor ?? null,\n        });\n\n        // Subscribe to future updates\n        currentUnsubSignal = currentSignal.subscribe((value: T) => {\n          set({\n            data: value,\n            loading: currentSignal!.loading,\n            error: currentSignal!.error,\n            refreshing: currentSignal!.refreshing,\n            nextCursor: currentSignal!.nextCursor ?? null,\n          });\n        });\n      });\n\n      // Cleanup when all Svelte subscribers unsubscribe\n      return () => {\n        unsubClient();\n        currentUnsubSignal?.();\n        currentSignal?.dispose();\n        currentSignal = null;\n      };\n    },\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACMA,mBAAyB;AAsDlB,SAAS,cACd,mBACA,eACsB;AACtB,MAAI,kBAAkB,QAAW;AAC/B,WAAO,qBAAqB,mBAAmC,aAAa;AAAA,EAC9E;AACA,SAAO,oBAAoB,iBAAoC;AACjE;AASA,SAAS,oBAAuB,QAA+C;AAC7E,aAAO;AAAA,IACL;AAAA,MACE,MAAM,OAAO,IAAI;AAAA,MACjB,SAAS,OAAO;AAAA,MAChB,OAAO,OAAO;AAAA,MACd,YAAY,OAAO;AAAA,MACnB,YAAY,OAAO,cAAc;AAAA,IACnC;AAAA,IACA,CAAC,QAAQ;AACP,YAAM,QAAQ,OAAO,UAAU,CAAC,UAAa;AAC3C,YAAI;AAAA,UACF,MAAM;AAAA,UACN,SAAS,OAAO;AAAA,UAChB,OAAO,OAAO;AAAA,UACd,YAAY,OAAO;AAAA,UACnB,YAAY,OAAO,cAAc;AAAA,QACnC,CAAC;AAAA,MACH,CAAC;AACD,aAAO,MAAM;AACX,cAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACF;AAMA,SAAS,qBACP,WACA,eACsB;AACtB,aAAO;AAAA,IACL,EAAE,MAAM,QAA2B,SAAS,MAAiB,OAAO,MAA4B,YAAY,OAAkB,YAAY,KAAsB;AAAA,IAChK,CAAC,QAAQ;AACP,UAAI,gBAAwC;AAC5C,UAAI,qBAA0C;AAE9C,YAAM,cAAc,UAAU,UAAU,CAAC,WAAW;AAElD,6BAAqB;AACrB,uBAAe,QAAQ;AAGvB,wBAAgB,cAAc,MAAM;AAGpC,YAAI;AAAA,UACF,MAAM,cAAc,IAAI;AAAA,UACxB,SAAS,cAAc;AAAA,UACvB,OAAO,cAAc;AAAA,UACrB,YAAY,cAAc;AAAA,UAC1B,YAAY,cAAc,cAAc;AAAA,QAC1C,CAAC;AAGD,6BAAqB,cAAc,UAAU,CAAC,UAAa;AACzD,cAAI;AAAA,YACF,MAAM;AAAA,YACN,SAAS,cAAe;AAAA,YACxB,OAAO,cAAe;AAAA,YACtB,YAAY,cAAe;AAAA,YAC3B,YAAY,cAAe,cAAc;AAAA,UAC3C,CAAC;AAAA,QACH,CAAC;AAAA,MACH,CAAC;AAGD,aAAO,MAAM;AACX,oBAAY;AACZ,6BAAqB;AACrB,uBAAe,QAAQ;AACvB,wBAAgB;AAAA,MAClB;AAAA,IACF;AAAA,EACF;AACF;","names":[]}

package/dist/index.d.cts

@@ -0,0 +1,54 @@
+import { DatafnSignal, DatafnError } from '@datafn/core';
+import { Readable } from 'svelte/store';
+
+/**
+ * Convert DataFn signal to Svelte store
+ */
+
+/**
+ * A client reference that can notify subscribers when the underlying client
+ * changes. Compatible with `{ subscribe: client.subscribeClient }` from a
+ * unified `createDatafnClient`, or any Svelte writable store holding a client.
+ */
+type ClientRef<C> = {
+    subscribe(fn: (client: C) => void): () => void;
+};
+/**
+ * Store type that wraps signal value with state properties.
+ * Returned by both overloads.
+ */
+type DatafnSvelteStore<T> = Readable<{
+    data: T;
+    loading: boolean;
+    error: DatafnError | null;
+    refreshing: boolean;
+    nextCursor?: string | null;
+}>;
+/**
+ * Convert a lifecycle-aware DataFn signal directly to a Svelte readable store.
+ *
+ * Signals from `createDatafnClient` are lifecycle-aware — they survive
+ * `switchContext()` and rebind automatically. No factory pattern or `clientRef`
+ * is needed.
+ *
+ * ```typescript
+ * const todosStore = toSvelteStore(
+ *   client.todos.signal({ sort: ["-createdAt"] })
+ * );
+ * // Template: {#each $todosStore.data ?? [] as todo}
+ * // Also: {#if $todosStore.loading} Loading... {/if}
+ * ```
+ */
+declare function toSvelteStore<T>(signal: DatafnSignal<T>): DatafnSvelteStore<T>;
+/**
+ * Convert a DataFn signal factory to a reactive Svelte readable store.
+ *
+ * Accepts a `clientRef` (anything with a `subscribe(fn)` API) and a
+ * `signalFactory` that creates a new signal from the current client. The store
+ * automatically disposes the old signal and creates a fresh one whenever the
+ * client changes, preventing memory leaks and ensuring signals are always
+ * bound to the active client.
+ */
+declare function toSvelteStore<T, C>(clientRef: ClientRef<C>, signalFactory: (client: C) => DatafnSignal<T>): DatafnSvelteStore<T>;
+
+export { type ClientRef, type DatafnSvelteStore, toSvelteStore };

package/dist/index.d.ts

@@ -0,0 +1,54 @@
+import { DatafnSignal, DatafnError } from '@datafn/core';
+import { Readable } from 'svelte/store';
+
+/**
+ * Convert DataFn signal to Svelte store
+ */
+
+/**
+ * A client reference that can notify subscribers when the underlying client
+ * changes. Compatible with `{ subscribe: client.subscribeClient }` from a
+ * unified `createDatafnClient`, or any Svelte writable store holding a client.
+ */
+type ClientRef<C> = {
+    subscribe(fn: (client: C) => void): () => void;
+};
+/**
+ * Store type that wraps signal value with state properties.
+ * Returned by both overloads.
+ */
+type DatafnSvelteStore<T> = Readable<{
+    data: T;
+    loading: boolean;
+    error: DatafnError | null;
+    refreshing: boolean;
+    nextCursor?: string | null;
+}>;
+/**
+ * Convert a lifecycle-aware DataFn signal directly to a Svelte readable store.
+ *
+ * Signals from `createDatafnClient` are lifecycle-aware — they survive
+ * `switchContext()` and rebind automatically. No factory pattern or `clientRef`
+ * is needed.
+ *
+ * ```typescript
+ * const todosStore = toSvelteStore(
+ *   client.todos.signal({ sort: ["-createdAt"] })
+ * );
+ * // Template: {#each $todosStore.data ?? [] as todo}
+ * // Also: {#if $todosStore.loading} Loading... {/if}
+ * ```
+ */
+declare function toSvelteStore<T>(signal: DatafnSignal<T>): DatafnSvelteStore<T>;
+/**
+ * Convert a DataFn signal factory to a reactive Svelte readable store.
+ *
+ * Accepts a `clientRef` (anything with a `subscribe(fn)` API) and a
+ * `signalFactory` that creates a new signal from the current client. The store
+ * automatically disposes the old signal and creates a fresh one whenever the
+ * client changes, preventing memory leaks and ensuring signals are always
+ * bound to the active client.
+ */
+declare function toSvelteStore<T, C>(clientRef: ClientRef<C>, signalFactory: (client: C) => DatafnSignal<T>): DatafnSvelteStore<T>;
+
+export { type ClientRef, type DatafnSvelteStore, toSvelteStore };

package/dist/index.js

@@ -0,0 +1,73 @@
+// src/toSvelteStore.ts
+import { readable } from "svelte/store";
+function toSvelteStore(signalOrClientRef, signalFactory) {
+  if (signalFactory !== void 0) {
+    return toSvelteStoreFactory(signalOrClientRef, signalFactory);
+  }
+  return toSvelteStoreDirect(signalOrClientRef);
+}
+function toSvelteStoreDirect(signal) {
+  return readable(
+    {
+      data: signal.get(),
+      loading: signal.loading,
+      error: signal.error,
+      refreshing: signal.refreshing,
+      nextCursor: signal.nextCursor ?? null
+    },
+    (set) => {
+      const unsub = signal.subscribe((value) => {
+        set({
+          data: value,
+          loading: signal.loading,
+          error: signal.error,
+          refreshing: signal.refreshing,
+          nextCursor: signal.nextCursor ?? null
+        });
+      });
+      return () => {
+        unsub();
+      };
+    }
+  );
+}
+function toSvelteStoreFactory(clientRef, signalFactory) {
+  return readable(
+    { data: void 0, loading: true, error: null, refreshing: false, nextCursor: null },
+    (set) => {
+      let currentSignal = null;
+      let currentUnsubSignal = null;
+      const unsubClient = clientRef.subscribe((client) => {
+        currentUnsubSignal?.();
+        currentSignal?.dispose();
+        currentSignal = signalFactory(client);
+        set({
+          data: currentSignal.get(),
+          loading: currentSignal.loading,
+          error: currentSignal.error,
+          refreshing: currentSignal.refreshing,
+          nextCursor: currentSignal.nextCursor ?? null
+        });
+        currentUnsubSignal = currentSignal.subscribe((value) => {
+          set({
+            data: value,
+            loading: currentSignal.loading,
+            error: currentSignal.error,
+            refreshing: currentSignal.refreshing,
+            nextCursor: currentSignal.nextCursor ?? null
+          });
+        });
+      });
+      return () => {
+        unsubClient();
+        currentUnsubSignal?.();
+        currentSignal?.dispose();
+        currentSignal = null;
+      };
+    }
+  );
+}
+export {
+  toSvelteStore
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/toSvelteStore.ts"],"sourcesContent":["/**\n * Convert DataFn signal to Svelte store\n */\n\nimport type { DatafnSignal, DatafnError } from \"@datafn/core\";\nimport type { Readable } from \"svelte/store\";\nimport { readable } from \"svelte/store\";\n\n/**\n * A client reference that can notify subscribers when the underlying client\n * changes. Compatible with `{ subscribe: client.subscribeClient }` from a\n * unified `createDatafnClient`, or any Svelte writable store holding a client.\n */\nexport type ClientRef<C> = {\n  subscribe(fn: (client: C) => void): () => void;\n};\n\n/**\n * Store type that wraps signal value with state properties.\n * Returned by both overloads.\n */\nexport type DatafnSvelteStore<T> = Readable<{\n  data: T;\n  loading: boolean;\n  error: DatafnError | null;\n  refreshing: boolean;\n  nextCursor?: string | null;\n}>;\n\n/**\n * Convert a lifecycle-aware DataFn signal directly to a Svelte readable store.\n *\n * Signals from `createDatafnClient` are lifecycle-aware — they survive\n * `switchContext()` and rebind automatically. No factory pattern or `clientRef`\n * is needed.\n *\n * ```typescript\n * const todosStore = toSvelteStore(\n *   client.todos.signal({ sort: [\"-createdAt\"] })\n * );\n * // Template: {#each $todosStore.data ?? [] as todo}\n * // Also: {#if $todosStore.loading} Loading... {/if}\n * ```\n */\nexport function toSvelteStore<T>(signal: DatafnSignal<T>): DatafnSvelteStore<T>;\n\n/**\n * Convert a DataFn signal factory to a reactive Svelte readable store.\n *\n * Accepts a `clientRef` (anything with a `subscribe(fn)` API) and a\n * `signalFactory` that creates a new signal from the current client. The store\n * automatically disposes the old signal and creates a fresh one whenever the\n * client changes, preventing memory leaks and ensuring signals are always\n * bound to the active client.\n */\nexport function toSvelteStore<T, C>(\n  clientRef: ClientRef<C>,\n  signalFactory: (client: C) => DatafnSignal<T>,\n): DatafnSvelteStore<T>;\n\nexport function toSvelteStore<T, C = any>(\n  signalOrClientRef: DatafnSignal<T> | ClientRef<C>,\n  signalFactory?: (client: C) => DatafnSignal<T>,\n): DatafnSvelteStore<T> {\n  if (signalFactory !== undefined) {\n    return toSvelteStoreFactory(signalOrClientRef as ClientRef<C>, signalFactory);\n  }\n  return toSvelteStoreDirect(signalOrClientRef as DatafnSignal<T>);\n}\n\n/**\n * Direct signal overload: wraps a DatafnSignal as a Svelte readable store.\n * The store emits `{ data, loading, error, refreshing }` on each update.\n * Does NOT call signal.dispose() on teardown — the signal's lifecycle is\n * managed by the LiveSignalRegistry, allowing multiple stores to share a\n * deduplicated signal safely.\n */\nfunction toSvelteStoreDirect<T>(signal: DatafnSignal<T>): DatafnSvelteStore<T> {\n  return readable(\n    {\n      data: signal.get(),\n      loading: signal.loading,\n      error: signal.error,\n      refreshing: signal.refreshing,\n      nextCursor: signal.nextCursor ?? null,\n    },\n    (set) => {\n      const unsub = signal.subscribe((value: T) => {\n        set({\n          data: value,\n          loading: signal.loading,\n          error: signal.error,\n          refreshing: signal.refreshing,\n          nextCursor: signal.nextCursor ?? null,\n        });\n      });\n      return () => {\n        unsub();\n      };\n    },\n  );\n}\n\n/**\n * Factory overload: subscribes to clientRef, creates/disposes signal on each\n * client change. Returns a DatafnSvelteStore with { data, loading, error, refreshing }.\n */\nfunction toSvelteStoreFactory<T, C>(\n  clientRef: ClientRef<C>,\n  signalFactory: (client: C) => DatafnSignal<T>,\n): DatafnSvelteStore<T> {\n  return readable(\n    { data: undefined as unknown as T, loading: true as boolean, error: null as DatafnError | null, refreshing: false as boolean, nextCursor: null as string | null },\n    (set) => {\n      let currentSignal: DatafnSignal<T> | null = null;\n      let currentUnsubSignal: (() => void) | null = null;\n\n      const unsubClient = clientRef.subscribe((client) => {\n        // Tear down previous signal\n        currentUnsubSignal?.();\n        currentSignal?.dispose();\n\n        // Create a fresh signal from the new client\n        currentSignal = signalFactory(client);\n\n        // Emit the initial value immediately\n        set({\n          data: currentSignal.get(),\n          loading: currentSignal.loading,\n          error: currentSignal.error,\n          refreshing: currentSignal.refreshing,\n          nextCursor: currentSignal.nextCursor ?? null,\n        });\n\n        // Subscribe to future updates\n        currentUnsubSignal = currentSignal.subscribe((value: T) => {\n          set({\n            data: value,\n            loading: currentSignal!.loading,\n            error: currentSignal!.error,\n            refreshing: currentSignal!.refreshing,\n            nextCursor: currentSignal!.nextCursor ?? null,\n          });\n        });\n      });\n\n      // Cleanup when all Svelte subscribers unsubscribe\n      return () => {\n        unsubClient();\n        currentUnsubSignal?.();\n        currentSignal?.dispose();\n        currentSignal = null;\n      };\n    },\n  );\n}\n"],"mappings":";AAMA,SAAS,gBAAgB;AAsDlB,SAAS,cACd,mBACA,eACsB;AACtB,MAAI,kBAAkB,QAAW;AAC/B,WAAO,qBAAqB,mBAAmC,aAAa;AAAA,EAC9E;AACA,SAAO,oBAAoB,iBAAoC;AACjE;AASA,SAAS,oBAAuB,QAA+C;AAC7E,SAAO;AAAA,IACL;AAAA,MACE,MAAM,OAAO,IAAI;AAAA,MACjB,SAAS,OAAO;AAAA,MAChB,OAAO,OAAO;AAAA,MACd,YAAY,OAAO;AAAA,MACnB,YAAY,OAAO,cAAc;AAAA,IACnC;AAAA,IACA,CAAC,QAAQ;AACP,YAAM,QAAQ,OAAO,UAAU,CAAC,UAAa;AAC3C,YAAI;AAAA,UACF,MAAM;AAAA,UACN,SAAS,OAAO;AAAA,UAChB,OAAO,OAAO;AAAA,UACd,YAAY,OAAO;AAAA,UACnB,YAAY,OAAO,cAAc;AAAA,QACnC,CAAC;AAAA,MACH,CAAC;AACD,aAAO,MAAM;AACX,cAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACF;AAMA,SAAS,qBACP,WACA,eACsB;AACtB,SAAO;AAAA,IACL,EAAE,MAAM,QAA2B,SAAS,MAAiB,OAAO,MAA4B,YAAY,OAAkB,YAAY,KAAsB;AAAA,IAChK,CAAC,QAAQ;AACP,UAAI,gBAAwC;AAC5C,UAAI,qBAA0C;AAE9C,YAAM,cAAc,UAAU,UAAU,CAAC,WAAW;AAElD,6BAAqB;AACrB,uBAAe,QAAQ;AAGvB,wBAAgB,cAAc,MAAM;AAGpC,YAAI;AAAA,UACF,MAAM,cAAc,IAAI;AAAA,UACxB,SAAS,cAAc;AAAA,UACvB,OAAO,cAAc;AAAA,UACrB,YAAY,cAAc;AAAA,UAC1B,YAAY,cAAc,cAAc;AAAA,QAC1C,CAAC;AAGD,6BAAqB,cAAc,UAAU,CAAC,UAAa;AACzD,cAAI;AAAA,YACF,MAAM;AAAA,YACN,SAAS,cAAe;AAAA,YACxB,OAAO,cAAe;AAAA,YACtB,YAAY,cAAe;AAAA,YAC3B,YAAY,cAAe,cAAc;AAAA,UAC3C,CAAC;AAAA,QACH,CAAC;AAAA,MACH,CAAC;AAGD,aAAO,MAAM;AACX,oBAAY;AACZ,6BAAqB;AACrB,uBAAe,QAAQ;AACvB,wBAAgB;AAAA,MAClB;AAAA,IACF;AAAA,EACF;AACF;","names":[]}

package/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@datafn/svelte",
+  "version": "0.0.2",
+  "type": "module",
+  "description": "Svelte adapter for DataFn signals",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "scripts": {
+    "build": "tsup",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
+  "dependencies": {
+    "@datafn/core": "*",
+    "svelte": "^4.0.0"
+  },
+  "devDependencies": {
+    "tsup": "^8.0.0",
+    "typescript": "^5.3.0",
+    "vitest": "^1.0.0"
+  },
+  "peerDependencies": {
+    "svelte": "^3.0.0 || ^4.0.0"
+  },
+  "files": [
+    "dist"
+  ],
+  "author": "21n",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/21nCo/super-functions/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/21nCo/super-functions.git",
+    "directory": "datafn/svelte"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}