@critical-path/svelte 0.2.0 → 0.2.3

package/CHANGELOG.md

@@ -1,10 +1,30 @@
 # @critical-path/svelte
 
-## 0.2.0
+## 0.2.3
 
-### Minor Changes
+### Patch Changes
+
+- 3470b61: add optimistic updates with error rollback to Svelte state classes and React hooks
+
+## 0.2.2
+
+### Patch Changes
+
+- Updated dependencies [df22aad]
+  - @critical-path/core@0.2.1
+  - @critical-path/client@0.1.4
+
+## 0.2.1
+
+### Patch Changes
+
+- 5160802: Publish Svelte 5 Runes state classes on 0.2.x prerelease line.
+
+## 1.0.0
+
+### Major Changes
 
-- a1cd3ed: Modernize `@critical-path/svelte` for Svelte 5 Runes:
+- 283e450: Modernize `@critical-path/svelte` for Svelte 5 Runes:
   - Replaced Svelte 4 legacy stores (`createProjectStore`, `createTaskStore`) with Svelte 5 Runes state classes and factories (`ProjectState`, `createProjectState`, `TaskState`, `createTaskState`).
   - Updated peer dependency requirement to `svelte: ^5.0.0`.
   - Components now access reactive state properties directly (e.g. `taskState.data`, `projectState.loading`) without `$` store auto-subscriptions.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Jack James
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+import { CriticalPathClient, type ClientOptions } from '@critical-path/client';
+export declare function createCriticalPathClient(options: ClientOptions): CriticalPathClient;
+export * from './project-state.svelte.js';
+export * from './task-state.svelte.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,KAAK,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE/E,wBAAgB,wBAAwB,CAAC,OAAO,EAAE,aAAa,GAAG,kBAAkB,CAEnF;AAED,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC"}

package/dist/index.js

@@ -0,0 +1,167 @@
+import { CriticalPathClient as e } from "@critical-path/client";
+import * as t from "svelte/internal/client";
+//#region src/project-state.svelte.ts
+var n = class {
+	client;
+	#e = t.state(t.proxy([]));
+	get data() {
+		return t.get(this.#e);
+	}
+	set data(e) {
+		t.set(this.#e, e, !0);
+	}
+	#t = t.state(!1);
+	get loading() {
+		return t.get(this.#t);
+	}
+	set loading(e) {
+		t.set(this.#t, e, !0);
+	}
+	#n = t.state(null);
+	get error() {
+		return t.get(this.#n);
+	}
+	set error(e) {
+		t.set(this.#n, e, !0);
+	}
+	constructor(e) {
+		this.client = e;
+	}
+	async fetch() {
+		this.loading = !0, this.error = null;
+		try {
+			this.data = await this.client.getProjects();
+		} catch (e) {
+			this.error = e instanceof Error ? e : Error(String(e));
+		} finally {
+			this.loading = !1;
+		}
+	}
+	async createProject(e) {
+		let t = `temp_${Date.now()}_${Math.random().toString(36).substring(2, 7)}`, n = (/* @__PURE__ */ new Date()).toISOString(), r = {
+			...e,
+			id: t,
+			createdAt: n,
+			updatedAt: n
+		};
+		this.data = [...this.data, r];
+		try {
+			let n = await this.client.createProject(e);
+			return this.data = this.data.map((e) => e.id === t ? n : e), n;
+		} catch (e) {
+			this.data = this.data.filter((e) => e.id !== t);
+			let n = e instanceof Error ? e : Error(String(e));
+			throw this.error = n, n;
+		}
+	}
+};
+function r(e) {
+	return new n(e);
+}
+//#endregion
+//#region src/task-state.svelte.ts
+var i = class {
+	client;
+	projectId;
+	#e = t.state(t.proxy([]));
+	get data() {
+		return t.get(this.#e);
+	}
+	set data(e) {
+		t.set(this.#e, e, !0);
+	}
+	#t = t.state(!1);
+	get loading() {
+		return t.get(this.#t);
+	}
+	set loading(e) {
+		t.set(this.#t, e, !0);
+	}
+	#n = t.state(null);
+	get error() {
+		return t.get(this.#n);
+	}
+	set error(e) {
+		t.set(this.#n, e, !0);
+	}
+	constructor(e, t) {
+		this.client = e, this.projectId = t;
+	}
+	async fetch() {
+		this.loading = !0, this.error = null;
+		try {
+			this.data = await this.client.getTasks(this.projectId);
+		} catch (e) {
+			this.error = e instanceof Error ? e : Error(String(e));
+		} finally {
+			this.loading = !1;
+		}
+	}
+	async createTask(e) {
+		let t = `temp_${Date.now()}_${Math.random().toString(36).substring(2, 7)}`, n = (/* @__PURE__ */ new Date()).toISOString(), r = {
+			...e,
+			id: t,
+			createdAt: n,
+			updatedAt: n
+		};
+		this.data = [...this.data, r];
+		try {
+			let n = await this.client.createTask(e);
+			return this.data = this.data.map((e) => e.id === t ? n : e), n;
+		} catch (e) {
+			this.data = this.data.filter((e) => e.id !== t);
+			let n = e instanceof Error ? e : Error(String(e));
+			throw this.error = n, n;
+		}
+	}
+	async updateTaskStatus(e, t) {
+		let n = this.data.findIndex((t) => t.id === e);
+		if (n === -1) return this.client.updateTask(e, { status: t });
+		let r = this.data[n], i = {
+			...r,
+			status: t,
+			updatedAt: (/* @__PURE__ */ new Date()).toISOString()
+		}, a = [...this.data];
+		a[n] = i, this.data = a;
+		try {
+			let n = await this.client.updateTask(e, { status: t }), r = this.data.findIndex((t) => t.id === e);
+			if (r !== -1) {
+				let e = [...this.data];
+				e[r] = n, this.data = e;
+			}
+			return n;
+		} catch (t) {
+			let n = this.data.findIndex((t) => t.id === e);
+			if (n !== -1) {
+				let e = [...this.data];
+				e[n] = r, this.data = e;
+			}
+			let i = t instanceof Error ? t : Error(String(t));
+			throw this.error = i, i;
+		}
+	}
+	async deleteTask(e) {
+		let t = this.data.findIndex((t) => t.id === e);
+		if (t === -1) return this.client.deleteTask(e);
+		let n = this.data[t];
+		this.data = this.data.filter((t) => t.id !== e);
+		try {
+			await this.client.deleteTask(e);
+		} catch (e) {
+			let r = [...this.data];
+			r.splice(t, 0, n), this.data = r;
+			let i = e instanceof Error ? e : Error(String(e));
+			throw this.error = i, i;
+		}
+	}
+};
+function a(e, t) {
+	return new i(e, t);
+}
+//#endregion
+//#region src/index.ts
+function o(t) {
+	return new e(t);
+}
+//#endregion
+export { n as ProjectState, i as TaskState, o as createCriticalPathClient, r as createProjectState, a as createTaskState };

package/dist/index.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=index.test.d.ts.map

package/dist/index.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../src/index.test.ts"],"names":[],"mappings":""}

package/dist/project-state.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { CriticalPathClient } from '@critical-path/client';
+import type { Project } from '@critical-path/core';
+export declare class ProjectState {
+    private client;
+    data: Project[];
+    loading: boolean;
+    error: Error | null;
+    constructor(client: CriticalPathClient);
+    fetch(): Promise<void>;
+    createProject(input: Omit<Project, 'id' | 'createdAt' | 'updatedAt'>): Promise<Project>;
+}
+export declare function createProjectState(client: CriticalPathClient): ProjectState;
+//# sourceMappingURL=project-state.svelte.d.ts.map

package/dist/project-state.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"project-state.svelte.d.ts","sourceRoot":"","sources":["../src/project-state.svelte.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAEnD,qBAAa,YAAY;IAKX,OAAO,CAAC,MAAM;IAJ1B,IAAI,YAAyB;IAC7B,OAAO,UAA0B;IACjC,KAAK,eAA8B;gBAEf,MAAM,EAAE,kBAAkB;IAExC,KAAK;IAYL,aAAa,CAAC,KAAK,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,GAAG,WAAW,GAAG,WAAW,CAAC;CA0B3E;AAED,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,kBAAkB,GAAG,YAAY,CAE3E"}

package/dist/task-state.svelte.d.ts

@@ -0,0 +1,16 @@
+import type { CriticalPathClient } from '@critical-path/client';
+import type { Task, TaskStatus } from '@critical-path/core';
+export declare class TaskState {
+    private client;
+    projectId?: string | undefined;
+    data: Task[];
+    loading: boolean;
+    error: Error | null;
+    constructor(client: CriticalPathClient, projectId?: string | undefined);
+    fetch(): Promise<void>;
+    createTask(input: Omit<Task, 'id' | 'createdAt' | 'updatedAt'>): Promise<Task>;
+    updateTaskStatus(taskId: string, status: TaskStatus): Promise<Task>;
+    deleteTask(taskId: string): Promise<boolean | undefined>;
+}
+export declare function createTaskState(client: CriticalPathClient, projectId?: string): TaskState;
+//# sourceMappingURL=task-state.svelte.d.ts.map

package/dist/task-state.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"task-state.svelte.d.ts","sourceRoot":"","sources":["../src/task-state.svelte.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAE5D,qBAAa,SAAS;IAMlB,OAAO,CAAC,MAAM;IACP,SAAS,CAAC,EAAE,MAAM;IAN3B,IAAI,SAAsB;IAC1B,OAAO,UAA0B;IACjC,KAAK,eAA8B;gBAGzB,MAAM,EAAE,kBAAkB,EAC3B,SAAS,CAAC,EAAE,MAAM,YAAA;IAGrB,KAAK;IAYL,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,GAAG,WAAW,GAAG,WAAW,CAAC;IA2B9D,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU;IAyCnD,UAAU,CAAC,MAAM,EAAE,MAAM;CAuBhC;AAED,wBAAgB,eAAe,CAC7B,MAAM,EAAE,kBAAkB,EAC1B,SAAS,CAAC,EAAE,MAAM,GACjB,SAAS,CAEX"}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@critical-path/svelte",
-  "version": "0.2.0",
+  "version": "0.2.3",
   "description": "Svelte 5 Runes state and reactive integrations for Critical Path headless project management framework",
   "author": "Jack James",
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/Pixerate/Critical-Path.git"
+    "url": "git+https://github.com/Pixerate/critical-path.git"
   },
   "type": "module",
   "main": "./dist/index.js",
@@ -17,14 +17,9 @@
       "types": "./dist/index.d.ts"
     }
   },
-  "scripts": {
-    "build": "vite build && tsc --emitDeclarationOnly",
-    "test": "vitest run",
-    "clean": "rm -rf dist *.tsbuildinfo"
-  },
   "dependencies": {
-    "@critical-path/client": "workspace:*",
-    "@critical-path/core": "workspace:*"
+    "@critical-path/client": "0.1.4",
+    "@critical-path/core": "0.2.1"
   },
   "peerDependencies": {
     "svelte": "^5.0.0"
@@ -39,5 +34,10 @@
   },
   "engines": {
     "node": ">=24.0.0"
+  },
+  "scripts": {
+    "build": "vite build && tsc --emitDeclarationOnly",
+    "test": "vitest run",
+    "clean": "rm -rf dist *.tsbuildinfo"
   }
-}
+}

package/src/index.test.ts

@@ -45,7 +45,7 @@ describe('@critical-path/svelte Svelte 5 Runes Test Suite', () => {
       expect(projectState.error).toBeNull();
     });
 
-    it('creates project and appends to reactive data', async () => {
+    it('creates project optimistically and rolls back on failure', async () => {
       const mockCreated: Project = {
         id: 'proj_2',
         name: 'Project 2',
@@ -62,11 +62,20 @@ describe('@critical-path/svelte Svelte 5 Runes Test Suite', () => {
 
       expect(res).toEqual(mockCreated);
       expect(projectState.data).toEqual([mockCreated]);
+
+      // Test error rollback
+      const failingClient = {
+        createProject: vi.fn().mockRejectedValue(new Error('Network error'))
+      } as unknown as CriticalPathClient;
+      const failingState = new ProjectState(failingClient);
+
+      await expect(failingState.createProject({ name: 'Failed Proj', key: 'FAIL' })).rejects.toThrow('Network error');
+      expect(failingState.data).toEqual([]);
     });
   });
 
   describe('TaskState', () => {
-    it('fetches, creates, updates status, and deletes tasks', async () => {
+    it('fetches, creates, updates status, and deletes tasks with optimistic updates', async () => {
       const mockTask: Task = {
         id: 'task_1',
         projectId: 'proj_1',
@@ -90,11 +99,61 @@ describe('@critical-path/svelte Svelte 5 Runes Test Suite', () => {
 
       expect(taskState.data).toEqual([mockTask]);
 
+      // Update status
       await taskState.updateTaskStatus('task_1', 'in_progress');
       expect(taskState.data[0].status).toBe('in_progress');
 
+      // Delete task
       await taskState.deleteTask('task_1');
       expect(taskState.data).toEqual([]);
     });
+
+    it('rolls back task status update on server error', async () => {
+      const mockTask: Task = {
+        id: 'task_1',
+        projectId: 'proj_1',
+        title: 'Task 1',
+        status: 'todo',
+        priority: 'medium',
+        createdAt: '2026-01-01',
+        updatedAt: '2026-01-01'
+      };
+
+      const failingClient = {
+        getTasks: vi.fn().mockResolvedValue([mockTask]),
+        updateTask: vi.fn().mockRejectedValue(new Error('Server error'))
+      } as unknown as CriticalPathClient;
+
+      const taskState = createTaskState(failingClient, 'proj_1');
+      await taskState.fetch();
+
+      await expect(taskState.updateTaskStatus('task_1', 'in_progress')).rejects.toThrow('Server error');
+      // Should be rolled back to 'todo'
+      expect(taskState.data[0].status).toBe('todo');
+    });
+
+    it('rolls back task deletion on server error', async () => {
+      const mockTask: Task = {
+        id: 'task_1',
+        projectId: 'proj_1',
+        title: 'Task 1',
+        status: 'todo',
+        priority: 'medium',
+        createdAt: '2026-01-01',
+        updatedAt: '2026-01-01'
+      };
+
+      const failingClient = {
+        getTasks: vi.fn().mockResolvedValue([mockTask]),
+        deleteTask: vi.fn().mockRejectedValue(new Error('Delete failed'))
+      } as unknown as CriticalPathClient;
+
+      const taskState = createTaskState(failingClient, 'proj_1');
+      await taskState.fetch();
+
+      await expect(taskState.deleteTask('task_1')).rejects.toThrow('Delete failed');
+      // Should restore deleted task
+      expect(taskState.data).toEqual([mockTask]);
+    });
   });
 });

package/src/project-state.svelte.ts

@@ -22,9 +22,30 @@ export class ProjectState {
   }
 
   async createProject(input: Omit<Project, 'id' | 'createdAt' | 'updatedAt'>) {
-    const created = await this.client.createProject(input);
-    this.data = [...this.data, created];
-    return created;
+    const tempId = `temp_${Date.now()}_${Math.random().toString(36).substring(2, 7)}`;
+    const now = new Date().toISOString();
+    const tempProject: Project = {
+      ...input,
+      id: tempId,
+      createdAt: now,
+      updatedAt: now
+    };
+
+    // Optimistically add temp project
+    this.data = [...this.data, tempProject];
+
+    try {
+      const created = await this.client.createProject(input);
+      // Replace temp project with server created project
+      this.data = this.data.map((p) => (p.id === tempId ? created : p));
+      return created;
+    } catch (err) {
+      // Rollback on error
+      this.data = this.data.filter((p) => p.id !== tempId);
+      const errorObj = err instanceof Error ? err : new Error(String(err));
+      this.error = errorObj;
+      throw errorObj;
+    }
   }
 }
 

package/src/task-state.svelte.ts

@@ -25,23 +25,95 @@ export class TaskState {
   }
 
   async createTask(input: Omit<Task, 'id' | 'createdAt' | 'updatedAt'>) {
-    const created = await this.client.createTask(input);
-    this.data = [...this.data, created];
-    return created;
+    const tempId = `temp_${Date.now()}_${Math.random().toString(36).substring(2, 7)}`;
+    const now = new Date().toISOString();
+    const tempTask: Task = {
+      ...input,
+      id: tempId,
+      createdAt: now,
+      updatedAt: now
+    };
+
+    // Optimistically add temp task
+    this.data = [...this.data, tempTask];
+
+    try {
+      const created = await this.client.createTask(input);
+      // Replace temp task with created task from server
+      this.data = this.data.map((t) => (t.id === tempId ? created : t));
+      return created;
+    } catch (err) {
+      // Rollback on error
+      this.data = this.data.filter((t) => t.id !== tempId);
+      const errorObj = err instanceof Error ? err : new Error(String(err));
+      this.error = errorObj;
+      throw errorObj;
+    }
   }
 
   async updateTaskStatus(taskId: string, status: TaskStatus) {
-    const updated = await this.client.updateTask(taskId, { status });
     const idx = this.data.findIndex((t) => t.id === taskId);
-    if (idx !== -1) {
-      this.data[idx] = updated;
+    if (idx === -1) {
+      return this.client.updateTask(taskId, { status });
+    }
+
+    const previousTask = this.data[idx];
+    const optimisticTask: Task = {
+      ...previousTask,
+      status,
+      updatedAt: new Date().toISOString()
+    };
+
+    // Optimistically update local task status
+    const newData = [...this.data];
+    newData[idx] = optimisticTask;
+    this.data = newData;
+
+    try {
+      const updated = await this.client.updateTask(taskId, { status });
+      const currentIdx = this.data.findIndex((t) => t.id === taskId);
+      if (currentIdx !== -1) {
+        const confirmedData = [...this.data];
+        confirmedData[currentIdx] = updated;
+        this.data = confirmedData;
+      }
+      return updated;
+    } catch (err) {
+      // Rollback to previous task on error
+      const rollbackIdx = this.data.findIndex((t) => t.id === taskId);
+      if (rollbackIdx !== -1) {
+        const rollbackData = [...this.data];
+        rollbackData[rollbackIdx] = previousTask;
+        this.data = rollbackData;
+      }
+      const errorObj = err instanceof Error ? err : new Error(String(err));
+      this.error = errorObj;
+      throw errorObj;
     }
-    return updated;
   }
 
   async deleteTask(taskId: string) {
-    await this.client.deleteTask(taskId);
+    const idx = this.data.findIndex((t) => t.id === taskId);
+    if (idx === -1) {
+      return this.client.deleteTask(taskId);
+    }
+
+    const previousTask = this.data[idx];
+
+    // Optimistically remove task
     this.data = this.data.filter((t) => t.id !== taskId);
+
+    try {
+      await this.client.deleteTask(taskId);
+    } catch (err) {
+      // Rollback on error by re-inserting at previous index
+      const restoredData = [...this.data];
+      restoredData.splice(idx, 0, previousTask);
+      this.data = restoredData;
+      const errorObj = err instanceof Error ? err : new Error(String(err));
+      this.error = errorObj;
+      throw errorObj;
+    }
   }
 }