@pixerate/editor-svelte 0.181.0 → 0.182.1

package/dist/canvas/createCanvasProposalState.svelte.d.ts

@@ -0,0 +1,39 @@
+import { type CanvasChange, type CanvasChangeFeed, type CanvasChangeFeedOptions, type CanvasEdge, type CanvasEdgeLike, type CanvasNode, type CanvasProposal, type CanvasProposals, type CanvasProposalsOptions } from '@pixerate/editor/canvas';
+export interface CanvasProposalStateRune<TNode extends CanvasNode = CanvasNode, TEdge extends CanvasEdgeLike = CanvasEdge> {
+    /** The framework-free store (for `createCanvasProposalToolProvider` and agents). */
+    readonly store: CanvasProposals<TNode, TEdge>;
+    /** Pending proposals (reactive). */
+    readonly proposals: readonly CanvasProposal<TNode, TEdge>[];
+    /** The canvas with the proposals drawn in as ghosts (reactive): render these instead of your nodes and edges. */
+    readonly view: {
+        nodes: TNode[];
+        edges: TEdge[];
+    };
+    propose: CanvasProposals<TNode, TEdge>['propose'];
+    accept: CanvasProposals<TNode, TEdge>['accept'];
+    reject: CanvasProposals<TNode, TEdge>['reject'];
+    clear: CanvasProposals<TNode, TEdge>['clear'];
+}
+/**
+ * Agent-suggested canvas additions as a Svelte 5 rune: ghosts the user accepts (one undo step
+ * on `history`, made by the proposer) or rejects. Render `view` instead of your nodes and edges so
+ * the ghosts show. The same API as React's `useCanvasProposals`; pass getters and setters for the
+ * canvas state.
+ */
+export declare function createCanvasProposalState<TNode extends CanvasNode = CanvasNode, TEdge extends CanvasEdgeLike = CanvasEdge>(options: CanvasProposalsOptions<TNode, TEdge>): CanvasProposalStateRune<TNode, TEdge>;
+export interface CanvasChangeWatcherOptions<TNode extends CanvasNode = CanvasNode, TEdge extends CanvasEdgeLike = CanvasEdge> extends Omit<CanvasChangeFeedOptions<TNode, TEdge>, 'subscribe'> {
+    /** Called with each change. */
+    onChange?: (change: CanvasChange<TNode, TEdge>) => void;
+}
+export interface CanvasChangeWatcherRune<TNode extends CanvasNode = CanvasNode, TEdge extends CanvasEdgeLike = CanvasEdge> {
+    readonly feed: CanvasChangeFeed<TNode, TEdge>;
+    /** The latest change (reactive). */
+    readonly last: CanvasChange<TNode, TEdge> | null;
+}
+/**
+ * What changed on a canvas, as a Svelte 5 rune: nodes and edges added, removed or edited, the
+ * selection, and who made it, checked whenever `getNodes` / `getEdges` change. For agents that
+ * follow what the user does. Call during component initialisation; the feed stops on unmount.
+ * The same API as React's `useCanvasChangeFeed`.
+ */
+export declare function createCanvasChangeWatcher<TNode extends CanvasNode = CanvasNode, TEdge extends CanvasEdgeLike = CanvasEdge>(options: CanvasChangeWatcherOptions<TNode, TEdge>): CanvasChangeWatcherRune<TNode, TEdge>;

package/dist/canvas/createCanvasProposalState.svelte.js

@@ -0,0 +1,57 @@
+import { createCanvasChangeFeed, createCanvasProposals } from '@pixerate/editor/canvas';
+/**
+ * Agent-suggested canvas additions as a Svelte 5 rune: ghosts the user accepts (one undo step
+ * on `history`, made by the proposer) or rejects. Render `view` instead of your nodes and edges so
+ * the ghosts show. The same API as React's `useCanvasProposals`; pass getters and setters for the
+ * canvas state.
+ */
+export function createCanvasProposalState(options) {
+    const store = createCanvasProposals(options);
+    let state = $state.raw(store.getState());
+    store.subscribe((next) => {
+        state = next;
+    });
+    const view = $derived.by(() => {
+        void state;
+        return store.withGhosts(options.getNodes(), options.getEdges());
+    });
+    return {
+        store,
+        get proposals() {
+            return state.proposals;
+        },
+        get view() {
+            return view;
+        },
+        propose: store.propose,
+        accept: store.accept,
+        reject: store.reject,
+        clear: store.clear
+    };
+}
+/**
+ * What changed on a canvas, as a Svelte 5 rune: nodes and edges added, removed or edited, the
+ * selection, and who made it, checked whenever `getNodes` / `getEdges` change. For agents that
+ * follow what the user does. Call during component initialisation; the feed stops on unmount.
+ * The same API as React's `useCanvasChangeFeed`.
+ */
+export function createCanvasChangeWatcher(options) {
+    const feed = createCanvasChangeFeed(options);
+    let last = $state.raw(null);
+    $effect(() => {
+        options.getNodes();
+        options.getEdges();
+        const change = feed.check();
+        if (!change)
+            return;
+        last = change;
+        options.onChange?.(change);
+    });
+    $effect(() => () => feed.dispose());
+    return {
+        feed,
+        get last() {
+            return last;
+        }
+    };
+}

package/dist/canvas/index.d.ts

@@ -56,3 +56,5 @@ export { createMermaidDiagram, createMermaidStream, type CreateMermaidDiagramOpt
 export { default as MermaidThumbnail } from './MermaidThumbnail.svelte';
 export { default as DiagramPresenceLayer } from './DiagramPresenceLayer.svelte';
 export { createDiagramDirector, type CreateDiagramDirectorOptions, type SvelteDiagramDirector } from './createDiagramDirector.svelte.js';
+export { createCanvasProposalState, createCanvasChangeWatcher, type CanvasProposalStateRune, type CanvasChangeWatcherOptions, type CanvasChangeWatcherRune } from './createCanvasProposalState.svelte.js';
+export { CANVAS_PROPOSAL_CLASS, createCanvasProposals, createCanvasChangeFeed, createCanvasProposalToolProvider, type CanvasProposal, type CanvasProposals, type CanvasProposalsOptions, type CanvasProposalsState, type CanvasProposalInput, type CanvasProposalNodeInput, type CanvasProposalEdgeInput, type CanvasProposalAcceptResult, type CanvasProposalToolProviderOptions, type CanvasChange, type CanvasChangeFeed, type CanvasChangeFeedOptions, type CanvasNodeChange, type CanvasEdgeChange } from '@pixerate/editor/canvas';

package/dist/canvas/index.js

@@ -96,3 +96,6 @@ export { default as MermaidThumbnail } from './MermaidThumbnail.svelte';
 // Agent cursors acting out diagram edits
 export { default as DiagramPresenceLayer } from './DiagramPresenceLayer.svelte';
 export { createDiagramDirector } from './createDiagramDirector.svelte.js';
+// Agent proposals (ghost nodes the user accepts or rejects), the canvas change feed and their agent tools
+export { createCanvasProposalState, createCanvasChangeWatcher } from './createCanvasProposalState.svelte.js';
+export { CANVAS_PROPOSAL_CLASS, createCanvasProposals, createCanvasChangeFeed, createCanvasProposalToolProvider } from '@pixerate/editor/canvas';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pixerate/editor-svelte",
-  "version": "0.181.0",
+  "version": "0.182.1",
   "description": "Svelte bindings and prompt/rich-text components for @pixerate/editor",
   "author": "Pixerate",
   "license": "MIT",
@@ -165,7 +165,7 @@
     "**/*.css"
   ],
   "dependencies": {
-    "@pixerate/editor": "0.244.0"
+    "@pixerate/editor": "0.246.0"
   },
   "peerDependencies": {
     "@dagrejs/dagre": "^1.1.4",