@pixerate/editor-svelte 0.104.0 → 0.105.0

package/README.md

@@ -82,7 +82,7 @@ Tables are on by default in `createRichTextPreset` (`table: false` turns them of
 | `@pixerate/editor-svelte/image-editor` | `ImageEditor`, `createReactiveImageEditor`: crop, rotate/flip, adjustments, annotations, depth masks, Select & Mask (`SelectionOptionsBar`, `RefineEdgePanel`: magic wand, marquees, lasso, Refine Edge, layer masks), and `onInpaint` / `onRemoveBackground` AI hooks |
 | `@pixerate/editor-svelte/paint-editor` | `PaintEditor`, `createReactivePaintEditor`: natural-media painting with `PaintCanvas` (pen pressure, tilt and twist, coalesced and predicted events, palm rejection, view rotation and mirroring), `PaintToolbar` (tools, symmetry, perspective, tracing and reference images, save / open, PNG / JPEG / PSD), `BrushPanel` (library with thumbnails), `PaperPanel`, `ColorPanel` (wheel, harmonies, swatches, mixing pad) and `PaintLayersPanel` |
 | `@pixerate/editor-svelte/commands` | `CommandPalette`, `createCommandPalette` (`hotkey: "Mod+K"`; call `destroy()` when done), `createCommandShortcuts`, `useRegisterCommands` over a `CommandRegistry` from `@pixerate/editor/commands` (also re-exported from the root entry) |
-| `@pixerate/editor-svelte/persistence` | `createAutosave` (crash-recovery snapshots bound to a history / dirty flag, flushed on `pagehide`; call `destroy()` when done) and `<RecoveryPrompt>` (also re-exported from the root entry) |
+| `@pixerate/editor-svelte/persistence` | `createAutosave` (crash-recovery snapshots bound to a history / dirty flag, flushed on `pagehide`; call `destroy()` when done), `createEditorAutosave` (the same for any editor's `EditorDocument`, e.g. `createMermaidDiagram().editorDocument`; `restore` loads the snapshot into the editor) and `<RecoveryPrompt>` (also re-exported from the root entry) |
 | `@pixerate/editor-svelte/generation` | `GenerationSettings` (controls generated from a model's capabilities, reference slots by role, plan adjustments; `onchange` / `onaddreference`), `createGenerationPlan(() => request, () => caps)`, `JobProgress`, `createJobProgress` (call `destroy()` when done) over `@pixerate/editor/generation` (also re-exported from the root entry) |
 | `@pixerate/editor-svelte/vector` | `VectorEditor` (toolbar, canvas and style panel), `VectorCanvas` (SVG canvas forwarding pointer, wheel, keyboard and clipboard events), `VectorToolbar`, `VectorStylePanel`, `VectorSceneNodes`, `VectorGradientDefs`, `createVectorEditor` (call `destroy()` when done) and `useVectorCommands` over `@pixerate/editor/vector` (see [the vector editor guide](../../docs/vector-editor.md)) |
 | `@pixerate/editor-svelte/chart` | `ChartEditor` (toolbar, chart, inspector and data grid), `ChartCanvas` (SVG chart with selection, drag-to-edit and keyboard editing), `ChartDataGrid`, `ChartInspector`, `createChartEditor` (call `destroy()` when done) and `useChartCommands` over `@pixerate/editor/chart` (see [the chart editor guide](../../docs/chart-editor.md)) |

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

@@ -1,4 +1,5 @@
-import { DiagramController, type DiagramActionResult, type DiagramControllerOptions, type DiagramState, type EditOp, type MermaidDocument } from '@pixerate/editor/diagram';
+import { DiagramController, type DiagramActionResult, type DiagramControllerOptions, type DiagramState, type EditOp, type DiagramEditorDocument, type MermaidDocument } from '@pixerate/editor/diagram';
+import type { EditorDocument } from '@pixerate/editor/persistence';
 import { type DiagramLayout, type DiagramLayoutOptions, type DiagramScene, type DiagramSceneTheme, type MermaidFlowEdge, type MermaidFlowNode } from '@pixerate/editor/canvas';
 export interface CreateMermaidDiagramOptions extends DiagramControllerOptions {
     /** Layout spacing and node measuring for new nodes (stored positions always win). */
@@ -16,6 +17,11 @@ type Placed = {
 };
 export interface SvelteMermaidDiagram {
     readonly controller: DiagramController;
+    /**
+     * The save / load / undo contract for this diagram: pass it to `createEditorAutosave`
+     * (`@pixerate/editor-svelte/persistence`) or `createDocumentToolProvider`.
+     */
+    readonly editorDocument: EditorDocument<DiagramEditorDocument>;
     /** The controller's state (reactive). */
     readonly state: DiagramState;
     readonly document: MermaidDocument;

package/dist/canvas/createMermaidDiagram.svelte.js

@@ -1,4 +1,4 @@
-import { DiagramController } from '@pixerate/editor/diagram';
+import { DiagramController, createDiagramEditorDocument } from '@pixerate/editor/diagram';
 import { CSS_VARIABLE_DIAGRAM_SCENE_THEME, DiagramStream, blendDiagramLayout, diagramRenameOp, familySceneFromLayout, easeDiagramTween, mermaidMovesFromCanvas, mermaidToCanvas } from '@pixerate/editor/canvas';
 /**
  * Svelte 5 rune: a Mermaid diagram on a Svelte Flow canvas. Subscribes to a
@@ -19,8 +19,10 @@ view = {}) {
     const unsubscribe = controller.subscribe((next) => {
         state = next;
     });
+    const editorDocument = createDiagramEditorDocument(controller);
     return {
         controller,
+        editorDocument,
         get state() {
             return state;
         },
@@ -68,7 +70,10 @@ view = {}) {
         select: (ids) => controller.select(ids),
         undo: () => void controller.undo(),
         redo: () => void controller.redo(),
-        destroy: unsubscribe
+        destroy: () => {
+            unsubscribe();
+            editorDocument.destroy();
+        }
     };
 }
 /**

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

@@ -0,0 +1,17 @@
+import { type EditorDocument, type EditorDocumentFile, type LoadReport } from "@pixerate/editor/persistence";
+import { type CreateAutosaveOptions, type SvelteAutosave } from "./autosave.svelte.js";
+export interface CreateEditorAutosaveOptions extends Omit<CreateAutosaveOptions<EditorDocumentFile>, "key" | "getSnapshot" | "serialize" | "deserialize" | "history"> {
+    /** Snapshot key (default the document's `kind`). */
+    key?: string;
+}
+export interface SvelteEditorAutosave extends Omit<SvelteAutosave<EditorDocumentFile>, "restore"> {
+    /** Loads the recovered snapshot into the document and starts autosaving. */
+    restore(): LoadReport | undefined;
+}
+/**
+ * `createAutosave` for any editor's `EditorDocument` (e.g.
+ * `createMermaidDiagram(...).editorDocument`): snapshots it as an
+ * `EditorDocumentFile` after each change, and `restore` loads a recovered
+ * snapshot straight into the editor. Status and recovery stay reactive.
+ */
+export declare function createEditorAutosave(doc: EditorDocument, options: CreateEditorAutosaveOptions): SvelteEditorAutosave;

package/dist/persistence/editorAutosave.svelte.js

@@ -0,0 +1,40 @@
+import { parseEditorDocument, toEditorDocumentFile, } from "@pixerate/editor/persistence";
+import { createAutosave } from "./autosave.svelte.js";
+/**
+ * `createAutosave` for any editor's `EditorDocument` (e.g.
+ * `createMermaidDiagram(...).editorDocument`): snapshots it as an
+ * `EditorDocumentFile` after each change, and `restore` loads a recovered
+ * snapshot straight into the editor. Status and recovery stay reactive.
+ */
+export function createEditorAutosave(doc, options) {
+    const autosave = createAutosave({
+        ...options,
+        key: options.key ?? doc.kind,
+        getSnapshot: () => toEditorDocumentFile(doc),
+        deserialize: (text) => parseEditorDocument(text, { kind: doc.kind }),
+        history: doc,
+    });
+    return {
+        get status() {
+            return autosave.status;
+        },
+        get recovery() {
+            return autosave.recovery;
+        },
+        get pendingRecovery() {
+            return autosave.pendingRecovery;
+        },
+        restore() {
+            const snapshot = autosave.restore();
+            return snapshot ? doc.loadDocument(snapshot, { history: "reset" }) : undefined;
+        },
+        discard: () => autosave.discard(),
+        ready: () => autosave.ready(),
+        flushNow: () => autosave.flushNow(),
+        markClean: () => autosave.markClean(),
+        notifyChange: () => autosave.notifyChange(),
+        checked: autosave.checked,
+        controller: autosave.controller,
+        destroy: () => autosave.destroy(),
+    };
+}

package/dist/persistence/index.d.ts

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

package/dist/persistence/index.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pixerate/editor-svelte",
-  "version": "0.104.0",
+  "version": "0.105.0",
   "description": "Svelte bindings and prompt/rich-text components for @pixerate/editor",
   "author": "Pixerate",
   "license": "MIT",
@@ -144,7 +144,7 @@
     "@tiptap/extension-bubble-menu": "^2.27.3",
     "@tiptap/extension-placeholder": "^2.27.3",
     "@tiptap/starter-kit": "^2.27.3",
-    "@pixerate/editor": "0.145.0"
+    "@pixerate/editor": "0.146.0"
   },
   "peerDependencies": {
     "@dagrejs/dagre": "^1.1.4",