claude-artifact-framework 0.2.0 → 0.2.1

package/README.md

@@ -0,0 +1,96 @@
+# claude-artifact-framework
+
+Utilities for building apps inside Claude Artifacts: platform storage, reactive
+state, and other primitives verified against the real runtime. Zero
+dependencies, no build step — drop it into an artifact straight from a CDN.
+
+## Usage via CDN
+
+Everything is served through [jsDelivr](https://www.jsdelivr.com/), which
+mirrors npm packages automatically.
+
+### As a global script (`<script>` tag)
+
+```html
+<script src="https://cdn.jsdelivr.net/npm/claude-artifact-framework@0.2.0/dist/index.global.js"></script>
+<script>
+  const { storage, createStore, createPersistedStore, createSharedStore } = ArtifactKit;
+</script>
+```
+
+### As an ES module
+
+```html
+<script type="module">
+  import {
+    storage,
+    createStore,
+    createPersistedStore,
+    createSharedStore,
+  } from "https://cdn.jsdelivr.net/npm/claude-artifact-framework@0.2.0/dist/index.esm.js";
+</script>
+```
+
+Pin a version (`@0.2.0`) for reproducible artifacts, or drop the version
+(`claude-artifact-framework/dist/...`) to always get the latest release.
+
+## `storage`
+
+Thin wrapper over `window.storage`, the persistence API Claude injects into a
+**published** Chat Artifact. Values are JSON-serialized for you. Two scopes:
+personal (`storage.*`, one copy per viewer) and shared (`storage.shared.*`,
+one copy for every viewer of the artifact).
+
+```js
+await storage.set("theme", "dark");
+await storage.get("theme", "light"); // "dark" — second arg is the fallback
+await storage.list();                // ["theme", ...]
+await storage.delete("theme");
+
+await storage.shared.set("board", { count: 0 });
+await storage.shared.get("board", null);
+
+storage.available(); // false in draft mode / outside a Chat Artifact
+```
+
+## `createStore(initialState)`
+
+In-memory reactive store. No persistence.
+
+```js
+const counter = createStore(0);
+counter.subscribe((value) => console.log("count is now", value));
+counter.set((n) => n + 1);
+counter.get(); // 1
+```
+
+## `createPersistedStore(key, initialState, options?)`
+
+Same as `createStore`, but loads from `storage` once on creation and saves
+(debounced) on every change. Personal scope only.
+
+```js
+const prefs = createPersistedStore("prefs", { theme: "light" });
+await prefs.ready;           // resolves once the initial load finishes
+prefs.set({ theme: "dark" }); // persisted automatically
+```
+
+`options.debounceMs` (default `300`) controls how long to wait after the last
+change before writing to storage.
+
+## `createSharedStore(key, initialState, options?)`
+
+Same as `createPersistedStore`, but backed by `storage.shared` and polled on
+an interval, so every viewer of a published artifact converges on the same
+state.
+
+```js
+const board = createSharedStore("board", { count: 0 }, { pollMs: 2000 });
+await board.ready;
+board.set({ count: board.get().count + 1 }); // pushed to every viewer
+board.stop(); // stop polling, e.g. on teardown
+```
+
+Conflict handling is last-write-wins: if two viewers change the same key
+within one poll window, whichever write reaches storage last overwrites the
+other. There is no merge/CRDT logic.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-artifact-framework",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "description": "Utilities for building apps inside Claude Artifacts: platform storage, chat tool-calling loops, and other primitives verified against the real runtime.",
   "type": "module",
   "main": "./dist/index.esm.js",