@pixerate/editor-svelte 0.207.1 → 0.208.1

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

@@ -1,5 +1,7 @@
 import { type XYPosition } from '@xyflow/svelte';
+import { applyGraphDifferences, sanitizeCanvasDocument, type CanvasDocumentOmitOptions } from '@pixerate/editor/canvas';
 import type { CanvasNode, CanvasEdge, GraphDifferences } from './types.js';
+export { applyGraphDifferences, sanitizeCanvasDocument };
 /**
  * Pure calculation of graph differences between a current state and a baseline state.
  */
@@ -9,7 +11,7 @@ export declare function calculateGraphDifferences<TNode extends CanvasNode = Can
 }, baselineState: {
     nodes?: TNode[];
     edges?: TEdge[];
-}): GraphDifferences<TNode, TEdge>;
+}, options?: CanvasDocumentOmitOptions): GraphDifferences<TNode, TEdge>;
 /**
  * Pure function to replace a node in a graph, optionally preserving its connected edges.
  */

package/dist/canvas/createCanvasGraph.svelte.js

@@ -1,32 +1,11 @@
 import { cubicOut } from 'svelte/easing';
+import { applyGraphDifferences, calculateGraphDifferences as calculateCoreGraphDifferences, sanitizeCanvasDocument } from '@pixerate/editor/canvas';
+export { applyGraphDifferences, sanitizeCanvasDocument };
 /**
  * Pure calculation of graph differences between a current state and a baseline state.
  */
-export function calculateGraphDifferences(currentState, baselineState) {
-    const currentNodes = currentState.nodes ?? [];
-    const currentEdges = currentState.edges ?? [];
-    const baselineNodes = baselineState.nodes ?? [];
-    const baselineEdges = baselineState.edges ?? [];
-    // Map baseline for fast O(1) lookup
-    const baselineNodeMap = new Map(baselineNodes.map((n) => [n.id, n]));
-    const baselineEdgeMap = new Map(baselineEdges.map((e) => [e.id, e]));
-    const currentNodeMap = new Map(currentNodes.map((n) => [n.id, n]));
-    const currentEdgeMap = new Map(currentEdges.map((e) => [e.id, e]));
-    const removedNodes = baselineNodes.filter((oldNode) => !currentNodeMap.has(oldNode.id));
-    const removedEdges = baselineEdges.filter((oldEdge) => !currentEdgeMap.has(oldEdge.id));
-    const changedNodes = currentNodes.filter((newNode) => {
-        const oldNode = baselineNodeMap.get(newNode.id);
-        if (!oldNode)
-            return true;
-        return JSON.stringify(newNode) !== JSON.stringify(oldNode);
-    });
-    const changedEdges = currentEdges.filter((newEdge) => {
-        const oldEdge = baselineEdgeMap.get(newEdge.id);
-        if (!oldEdge)
-            return true;
-        return JSON.stringify(newEdge) !== JSON.stringify(oldEdge);
-    });
-    return { changedNodes, changedEdges, removedNodes, removedEdges };
+export function calculateGraphDifferences(currentState, baselineState, options) {
+    return calculateCoreGraphDifferences(currentState, baselineState, options);
 }
 /**
  * Pure function to replace a node in a graph, optionally preserving its connected edges.

package/dist/canvas/index.d.ts

@@ -1,5 +1,5 @@
 export * from './types.js';
-export { createCanvasGraph, calculateGraphDifferences, replaceNodeInGraph, type CreateCanvasGraphOptions } from './createCanvasGraph.svelte.js';
+export { createCanvasGraph, calculateGraphDifferences, applyGraphDifferences, sanitizeCanvasDocument, replaceNodeInGraph, type CreateCanvasGraphOptions } from './createCanvasGraph.svelte.js';
 export { getLayoutedNodes, getCenteredNodePosition, centerNodes, ensureLayout, placeBeside, estimateNodeSize, flowSide } from './createCanvasLayout.js';
 export { createCanvasClipboard, isEventFromTextInput, isValidCanvasNode, isValidUrl, type CreateCanvasClipboardOptions } from './createCanvasClipboard.svelte.js';
 export { createCanvasDocking, type CreateCanvasDockingOptions, type DockStrategy } from './createCanvasDocking.svelte.js';

package/dist/canvas/index.js

@@ -1,7 +1,7 @@
 // Types
 export * from './types.js';
 // Graph management rune & pure functions
-export { createCanvasGraph, calculateGraphDifferences, replaceNodeInGraph } from './createCanvasGraph.svelte.js';
+export { createCanvasGraph, calculateGraphDifferences, applyGraphDifferences, sanitizeCanvasDocument, replaceNodeInGraph } from './createCanvasGraph.svelte.js';
 // Layout calculations
 export { getLayoutedNodes, getCenteredNodePosition, centerNodes, ensureLayout, placeBeside, estimateNodeSize, flowSide } from './createCanvasLayout.js';
 // Clipboard rune & helpers

package/dist/persistence/autosave.svelte.d.ts

@@ -27,6 +27,12 @@ export interface CreateAutosaveOptions<T> {
     recover?: boolean;
     /** Write pending changes on `pagehide` and when the tab is hidden (default `true`). */
     flushOnHide?: boolean;
+    /**
+     * The server / host version of the loaded document, stored with each snapshot. The recovery
+     * check retires snapshots made on an older version instead of offering them, so they never
+     * overwrite newer server state.
+     */
+    baseVersion?: number | (() => number | undefined);
 }
 export interface SvelteAutosave<T> {
     /** Reactive status. */

package/dist/persistence/autosave.svelte.js

@@ -20,6 +20,7 @@ export function createAutosave(options) {
         debounceMs: options.debounceMs,
         retryBaseMs: options.retryBaseMs,
         retryMaxMs: options.retryMaxMs,
+        baseVersion: options.baseVersion,
     });
     const recover = options.recover !== false;
     let status = $state.raw(controller.getStatus());

package/dist/persistence/index.d.ts

@@ -3,4 +3,5 @@ import type RecoveryPromptComponent from "./RecoveryPrompt.svelte";
 export { default as RecoveryPrompt } from "./RecoveryPrompt.svelte";
 export * from "./autosave.svelte.js";
 export * from "./editorAutosave.svelte.js";
+export * from "./remoteSync.svelte.js";
 export type RecoveryPromptProps = ComponentProps<typeof RecoveryPromptComponent>;

package/dist/persistence/index.js

@@ -1,3 +1,4 @@
 export { default as RecoveryPrompt } from "./RecoveryPrompt.svelte";
 export * from "./autosave.svelte.js";
 export * from "./editorAutosave.svelte.js";
+export * from "./remoteSync.svelte.js";

package/dist/persistence/remoteSync.svelte.d.ts

@@ -0,0 +1,27 @@
+import { type EditorDocument, type EditorRemoteSync, type EditorRemoteSyncOptions, type EditorRemoteSyncStatus } from "@pixerate/editor/persistence";
+export interface CreateEditorSyncOptions<TDocument = unknown, TDiff = unknown> extends EditorRemoteSyncOptions<TDocument, TDiff> {
+    /**
+     * Flush pending debounced changes when the tab hides or unloads (`visibilitychange` to
+     * `"hidden"`, `pagehide`; default `true`).
+     */
+    flushOnHide?: boolean;
+}
+export interface SvelteEditorSync<TDocument = unknown, TDiff = unknown> {
+    readonly status: EditorRemoteSyncStatus;
+    readonly version: number;
+    readonly savedVersion: number;
+    readonly dirty: boolean;
+    readonly controller: EditorRemoteSync<TDocument, TDiff>;
+    baseline(): TDocument;
+    notify(): boolean;
+    applyRemote<TResult>(fn: () => TResult, remoteVersion?: number): TResult;
+    resetBaseline(remoteVersion?: number): void;
+    flush(): Promise<boolean>;
+    whenIdle(): Promise<void>;
+    destroy(): void;
+}
+/**
+ * Svelte 5 rune wrapping `createEditorRemoteSync`: subscribes to `doc` and exposes reactive
+ * `status`, `version`, `savedVersion`, and `dirty` fields, plus optional `flushOnHide` listener.
+ */
+export declare function createEditorSync<TDocument = unknown, TDiff = unknown>(doc: EditorDocument<TDocument>, options: CreateEditorSyncOptions<TDocument, TDiff>): SvelteEditorSync<TDocument, TDiff>;

package/dist/persistence/remoteSync.svelte.js

@@ -0,0 +1,56 @@
+import { createEditorRemoteSync, } from "@pixerate/editor/persistence";
+/**
+ * Svelte 5 rune wrapping `createEditorRemoteSync`: subscribes to `doc` and exposes reactive
+ * `status`, `version`, `savedVersion`, and `dirty` fields, plus optional `flushOnHide` listener.
+ */
+export function createEditorSync(doc, options) {
+    const { flushOnHide = true, ...syncOptions } = options;
+    const controller = createEditorRemoteSync(doc, syncOptions);
+    let status = $state(controller.status());
+    const unsubscribe = controller.subscribe((next) => {
+        status = next;
+    });
+    const unsubscribers = [unsubscribe];
+    if (flushOnHide && typeof window !== "undefined") {
+        const onVisibilityChange = () => {
+            if (typeof document !== "undefined" && document.visibilityState === "hidden") {
+                void controller.flush();
+            }
+        };
+        const onPageHide = () => {
+            void controller.flush();
+        };
+        if (typeof document !== "undefined") {
+            document.addEventListener("visibilitychange", onVisibilityChange);
+            unsubscribers.push(() => document.removeEventListener("visibilitychange", onVisibilityChange));
+        }
+        window.addEventListener("pagehide", onPageHide);
+        unsubscribers.push(() => window.removeEventListener("pagehide", onPageHide));
+    }
+    return {
+        get status() {
+            return status;
+        },
+        get version() {
+            return status.version;
+        },
+        get savedVersion() {
+            return status.savedVersion;
+        },
+        get dirty() {
+            return status.dirty;
+        },
+        controller,
+        baseline: () => controller.baseline(),
+        notify: () => controller.notify(),
+        applyRemote: (fn, remoteVersion) => controller.applyRemote(fn, remoteVersion),
+        resetBaseline: (remoteVersion) => controller.resetBaseline(remoteVersion),
+        flush: () => controller.flush(),
+        whenIdle: () => controller.whenIdle(),
+        destroy() {
+            unsubscribers.forEach((fn) => fn());
+            unsubscribers.length = 0;
+            controller.destroy();
+        },
+    };
+}

package/package.json

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