@elixpo/lixsketch 5.6.5 → 5.6.6

package/dist/react/{lineTool-ZMR27U5L.js → lineTool-CSAFD7PW.js}

@@ -3,12 +3,12 @@ import {
   handleMouseDown,
   handleMouseMove,
   handleMouseUp
-} from "./chunk-RGMDWLRJ.js";
-import "./chunk-XYUFEIZR.js";
-import "./chunk-6GPEWDRB.js";
+} from "./chunk-UEL2G6D2.js";
+import "./chunk-DWEFPKDO.js";
+import "./chunk-M7GAB24F.js";
 export {
   handleMouseDown as handleMouseDownLine,
   handleMouseMove as handleMouseMoveLine,
   handleMouseUp as handleMouseUpLine
 };
-//# sourceMappingURL=lineTool-ZMR27U5L.js.map
+//# sourceMappingURL=lineTool-CSAFD7PW.js.map

package/dist/react/{rectangleTool-EJKK6UTX.js → rectangleTool-YPD2SIIZ.js}

@@ -3,12 +3,12 @@ import {
   handleMouseDownRect,
   handleMouseMoveRect,
   handleMouseUpRect
-} from "./chunk-7CM5XQDN.js";
-import "./chunk-XYUFEIZR.js";
-import "./chunk-6GPEWDRB.js";
+} from "./chunk-G3DJQY65.js";
+import "./chunk-DWEFPKDO.js";
+import "./chunk-M7GAB24F.js";
 export {
   handleMouseDownRect,
   handleMouseMoveRect,
   handleMouseUpRect
 };
-//# sourceMappingURL=rectangleTool-EJKK6UTX.js.map
+//# sourceMappingURL=rectangleTool-YPD2SIIZ.js.map

package/dist/react/{textTool-S4XXZHZH.js → textTool-VQHMWEFJ.js}

@@ -6,11 +6,11 @@ import {
   handleTextMouseMove,
   handleTextMouseUp,
   updateCodeToggleForShape
-} from "./chunk-GQUZPON4.js";
-import "./chunk-M6TMN76K.js";
+} from "./chunk-F56XUE5S.js";
+import "./chunk-ULPIHUVC.js";
 import "./chunk-PAKA6HUX.js";
-import "./chunk-XYUFEIZR.js";
-import "./chunk-6GPEWDRB.js";
+import "./chunk-DWEFPKDO.js";
+import "./chunk-M7GAB24F.js";
 export {
   deselectElement as deselectTextElement,
   enterEditMode,
@@ -19,4 +19,4 @@ export {
   handleTextMouseUp,
   updateCodeToggleForShape
 };
-//# sourceMappingURL=textTool-S4XXZHZH.js.map
+//# sourceMappingURL=textTool-VQHMWEFJ.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elixpo/lixsketch",
-  "version": "5.6.5",
+  "version": "5.6.6",
   "description": "Open-source SVG whiteboard engine + React canvas component with hand-drawn aesthetics — the core of LixSketch",
   "type": "module",
   "main": "src/index.js",
@@ -82,10 +82,13 @@
     }
   },
   "devDependencies": {
-    "esbuild": "^0.24.0"
+    "esbuild": "^0.24.0",
+    "vitest": "^3.2.4"
   },
   "scripts": {
     "build": "node build.mjs",
+    "test": "npm run test:unit && npm run test:mcp",
+    "test:unit": "vitest run",
     "test:mcp": "node --test test/mcp-*.test.js",
     "prepublishOnly": "npm run build"
   }

package/src/core/AIRenderer.js

@@ -44,8 +44,14 @@ export function parseMermaid(src) {
     const classDefs = new Map();   // classDef name -> { fill, stroke, strokeWidth }
     const classAssigns = [];        // { nodeIds: [...], className }
     const nodeStyles = new Map();   // Mermaid `style A fill:...,stroke:...`
-    const darkTheme = typeof document === 'undefined'
-        || document.body?.classList.contains('theme-dark');
+    const darkTheme = (() => {
+        if (typeof document === 'undefined') return true;
+        if (document.body) {
+            if (document.body.classList.contains('theme-dark')) return true;
+            if (document.body.classList.contains('theme-light')) return false;
+        }
+        return !document.documentElement || document.documentElement.classList.contains('dark');
+    })();
     const palette = darkTheme
         ? [
             { fill: '#352b52', stroke: '#9d86df' },

package/src/core/CanvasSpace.js

@@ -0,0 +1,28 @@
+/* eslint-disable */
+
+// Tool pointer coordinates are already in SVG viewBox space. getCTM() also
+// includes viewport pan/zoom, so controls use these helpers for shape-only
+// translation and rotation.
+export function localToCanvas(point, transform) {
+    const rotation = (Number(transform.rotation) || 0) * Math.PI / 180;
+    const centerX = Number(transform.centerX) || 0;
+    const centerY = Number(transform.centerY) || 0;
+    const dx = point.x - centerX;
+    const dy = point.y - centerY;
+    return {
+        x: (Number(transform.x) || 0) + centerX + dx * Math.cos(rotation) - dy * Math.sin(rotation),
+        y: (Number(transform.y) || 0) + centerY + dx * Math.sin(rotation) + dy * Math.cos(rotation),
+    };
+}
+
+export function canvasToLocal(point, transform) {
+    const rotation = -(Number(transform.rotation) || 0) * Math.PI / 180;
+    const centerX = Number(transform.centerX) || 0;
+    const centerY = Number(transform.centerY) || 0;
+    const dx = point.x - (Number(transform.x) || 0) - centerX;
+    const dy = point.y - (Number(transform.y) || 0) - centerY;
+    return {
+        x: centerX + dx * Math.cos(rotation) - dy * Math.sin(rotation),
+        y: centerY + dx * Math.sin(rotation) + dy * Math.cos(rotation),
+    };
+}

package/src/core/GraphRenderer.js

@@ -17,9 +17,14 @@ const GRAPH_COLORS = [
 // labels stay readable on the warm off-white canvas. The equation
 // curves themselves keep their colours from GRAPH_COLORS.
 function graphThemeTokens() {
-    const isDark = typeof document !== 'undefined'
-        && document.body
-        && document.body.classList.contains('theme-dark');
+    const isDark = (() => {
+        if (typeof document === 'undefined') return true;
+        if (document.body) {
+            if (document.body.classList.contains('theme-dark')) return true;
+            if (document.body.classList.contains('theme-light')) return false;
+        }
+        return !document.documentElement || document.documentElement.classList.contains('dark');
+    })();
     if (isDark) {
         return {
             outerBg:   '#0d1117',

package/src/core/LixScriptParser.js

@@ -50,11 +50,17 @@ function tokenize(source) {
  * Returns { variables, shapes, errors }
  */
 export function parseLixScript(source) {
-  const tokens = tokenize(source)
   const variables = {}
   const shapes = []
   const errors = []
 
+  if (typeof source !== 'string') {
+    errors.push({ line: 0, message: 'LixScript source must be a string' })
+    return { variables, shapes, errors }
+  }
+
+  const tokens = tokenize(source)
+
   let i = 0
 
   while (i < tokens.length) {

package/src/core/MermaidFlowchartRenderer.js

@@ -22,7 +22,11 @@ const FONT_FAMILY = 'lixFont, sans-serif';
 // so a single render call uses whichever palette is active.
 function isThemeDark() {
     if (typeof document === 'undefined') return true;
-    return !!(document.body && document.body.classList.contains('theme-dark'));
+    if (document.body) {
+        if (document.body.classList.contains('theme-dark')) return true;
+        if (document.body.classList.contains('theme-light')) return false;
+    }
+    return !document.documentElement || document.documentElement.classList.contains('dark');
 }
 function nodeStrokeColor() { return isThemeDark() ? '#fff' : '#1a1a2e'; }
 function edgeStrokeColor() { return isThemeDark() ? '#888' : '#444'; }

package/src/core/MermaidSequenceParser.js

@@ -28,6 +28,7 @@ const ARROW_TYPES = {
 const ARROW_PATTERNS = Object.keys(ARROW_TYPES).sort((a, b) => b.length - a.length);
 
 export function parseSequenceDiagram(src) {
+    if (typeof src !== 'string') return null;
     const lines = src.trim().split('\n').map(l => l.trim()).filter(l => l && !l.startsWith('%%'));
     if (lines.length === 0) return null;
 

package/src/core/MermaidSequenceRenderer.js

@@ -32,9 +32,14 @@ const CODE_FONT = 'lixCode, monospace';
 // string preview path (`renderSequenceSVG`), which is rendered inside
 // the modal's preview pane.
 function themeColors() {
-    const isDark = typeof document !== 'undefined'
-        && document.body
-        && document.body.classList.contains('theme-dark');
+    const isDark = (() => {
+        if (typeof document === 'undefined') return true;
+        if (document.body) {
+            if (document.body.classList.contains('theme-dark')) return true;
+            if (document.body.classList.contains('theme-light')) return false;
+        }
+        return !document.documentElement || document.documentElement.classList.contains('dark');
+    })();
     if (isDark) return DARK_THEME;
     return {
         bg: '#fbfaf6',

package/src/core/MermaidStructuredRenderer.js

@@ -37,7 +37,12 @@ function contrastText(fill) {
 }
 
 function isDark() {
-    return typeof document !== 'undefined' && document.body?.classList.contains('theme-dark');
+    if (typeof document === 'undefined') return true;
+    if (document.body) {
+        if (document.body.classList.contains('theme-dark')) return true;
+        if (document.body.classList.contains('theme-light')) return false;
+    }
+    return !document.documentElement || document.documentElement.classList.contains('dark');
 }
 
 function theme() {

package/src/core/SceneSerializer.js

@@ -17,8 +17,14 @@ import { TextShape } from '../shapes/TextShape.js';
 import { CodeShape } from '../shapes/CodeShape.js';
 import { ImageShape } from '../shapes/ImageShape.js';
 import { IconShape } from '../shapes/IconShape.js';
+import { clearUndoHistory, pushCanvasResetAction } from './UndoRedo.js';
 
 const FORMAT_VERSION = 1;
+const GZIP_MAGIC = [0x1f, 0x8b];
+const SUPPORTED_SHAPE_TYPES = new Set([
+    'rectangle', 'circle', 'line', 'arrow', 'freehandStroke',
+    'frame', 'text', 'code', 'image', 'icon',
+]);
 
 // Generate a unique session ID for each scene
 let _sessionID = null;
@@ -413,8 +419,9 @@ export function saveScene(workspaceName = 'Untitled') {
 // LOAD: Deserialize .lixsketch JSON and recreate scene
 // ============================================================
 export function loadScene(sceneData) {
-    if (!sceneData || sceneData.format !== 'lixsketch') {
-        console.error('[SceneSerializer] Invalid scene format');
+    const validation = validateScene(sceneData);
+    if (!validation.valid) {
+        console.error('[SceneSerializer] Invalid scene:', validation.error);
         return false;
     }
 
@@ -525,6 +532,20 @@ export function loadScene(sceneData) {
         }
     }
 
+    // Shape-array order is the scene's z-order. Frames are constructed first
+    // so their clip groups exist before children are attached, but that is an
+    // implementation detail and must not change the saved stacking order.
+    const restoredInSceneOrder = sceneData.shapes
+        .map(data => data.shapeID && idMap.get(data.shapeID))
+        .filter(Boolean);
+    const restoredSet = new Set(restoredInSceneOrder);
+    window.shapes.splice(
+        0,
+        window.shapes.length,
+        ...restoredInSceneOrder,
+        ...window.shapes.filter(shape => !restoredSet.has(shape)),
+    );
+
     // ── Fourth pass: frame containment reconciliation (issue #24 bug #10) ──
     //
     // The pass above attaches each child via `frame.addShapeToFrame(child)`,
@@ -608,21 +629,62 @@ export function loadScene(sceneData) {
 }
 
 // ============================================================
-// DOWNLOAD: Trigger browser download of .lixsketch file
+// DOWNLOAD: Trigger browser download of an optimized .lixjson file
 // ============================================================
-export function downloadScene(workspaceName = 'Untitled') {
+function sceneFileTimestamp(date = new Date()) {
+    const iso = date.toISOString();
+    return `${iso.slice(0, 10).replace(/-/g, '')}-${iso.slice(11, 19).replace(/:/g, '')}`;
+}
+
+function safeWorkspaceFileName(workspaceName) {
+    const safe = String(workspaceName || 'Untitled')
+        .trim()
+        .replace(/[^a-zA-Z0-9_-]+/g, '_')
+        .replace(/^_+|_+$/g, '');
+    return safe || 'Untitled';
+}
+
+export async function encodeSceneFile(scene) {
+    const json = JSON.stringify(scene);
+    if (typeof CompressionStream === 'undefined') {
+        return new Blob([json], { type: 'application/json' });
+    }
+
+    const compressed = new Blob([json])
+        .stream()
+        .pipeThrough(new CompressionStream('gzip'));
+    const buffer = await new Response(compressed).arrayBuffer();
+    return new Blob([buffer], { type: 'application/vnd.lixsketch.scene+gzip' });
+}
+
+export async function decodeSceneFile(buffer) {
+    const bytes = buffer instanceof Uint8Array ? buffer : new Uint8Array(buffer);
+    const isGzip = bytes[0] === GZIP_MAGIC[0] && bytes[1] === GZIP_MAGIC[1];
+    if (!isGzip) return new TextDecoder().decode(bytes);
+    if (typeof DecompressionStream === 'undefined') {
+        throw new Error('This browser cannot open compressed .lixjson files.');
+    }
+
+    const decompressed = new Blob([bytes])
+        .stream()
+        .pipeThrough(new DecompressionStream('gzip'));
+    return new Response(decompressed).text();
+}
+
+export async function downloadScene(workspaceName = 'Untitled') {
     const scene = saveScene(workspaceName);
-    const json = JSON.stringify(scene, null, 2);
-    const blob = new Blob([json], { type: 'application/json' });
+    const blob = await encodeSceneFile(scene);
     const url = URL.createObjectURL(blob);
+    const fileName = `${safeWorkspaceFileName(workspaceName)}-${sceneFileTimestamp()}.lixjson`;
 
     const a = document.createElement('a');
     a.href = url;
-    a.download = `${workspaceName.replace(/[^a-zA-Z0-9_-]/g, '_')}.lixjson`;
+    a.download = fileName;
     document.body.appendChild(a);
     a.click();
     document.body.removeChild(a);
-    URL.revokeObjectURL(url);
+    setTimeout(() => URL.revokeObjectURL(url), 0);
+    return { fileName, sizeBytes: blob.size, compressed: blob.type.includes('gzip') };
 }
 
 // ============================================================
@@ -634,6 +696,15 @@ export function validateScene(data) {
     if (data.format !== 'lixsketch') return { valid: false, error: 'Not a LixSketch scene file (missing format field)' };
     if (!data.version || data.version > FORMAT_VERSION) return { valid: false, error: `Unsupported version: ${data.version}` };
     if (!Array.isArray(data.shapes)) return { valid: false, error: 'Invalid scene: missing shapes array' };
+    for (let index = 0; index < data.shapes.length; index += 1) {
+        const shape = data.shapes[index];
+        if (!shape || typeof shape !== 'object' || Array.isArray(shape)) {
+            return { valid: false, error: `Invalid shape at index ${index}` };
+        }
+        if (!SUPPORTED_SHAPE_TYPES.has(shape.type)) {
+            return { valid: false, error: `Unsupported shape type at index ${index}: ${String(shape.type)}` };
+        }
+    }
     return {
         valid: true,
         name: data.name || 'Untitled',
@@ -648,29 +719,26 @@ export function uploadScene() {
         const input = document.createElement('input');
         input.type = 'file';
         input.accept = '.lixjson,.json';
-        input.onchange = (e) => {
+        input.onchange = async (e) => {
             const file = e.target.files[0];
             if (!file) return resolve(false);
 
-            const reader = new FileReader();
-            reader.onload = (ev) => {
-                try {
-                    const data = JSON.parse(ev.target.result);
-                    const validation = validateScene(data);
-                    if (!validation.valid) {
-                        console.error('[SceneSerializer] Invalid file:', validation.error);
-                        resolve({ success: false, error: validation.error });
-                        return;
-                    }
-                    resetSessionID(); // New session for loaded scene
-                    const result = loadScene(data);
-                    resolve({ success: result, validation });
-                } catch (err) {
-                    console.error('[SceneSerializer] Failed to parse file:', err);
-                    resolve({ success: false, error: 'Failed to parse JSON file' });
+            try {
+                const json = await decodeSceneFile(await file.arrayBuffer());
+                const data = JSON.parse(json);
+                const validation = validateScene(data);
+                if (!validation.valid) {
+                    console.error('[SceneSerializer] Invalid file:', validation.error);
+                    resolve({ success: false, error: validation.error });
+                    return;
                 }
-            };
-            reader.readAsText(file);
+                resetSessionID(); // New session for loaded scene
+                const result = loadScene(data);
+                resolve({ success: result, validation });
+            } catch (err) {
+                console.error('[SceneSerializer] Failed to parse file:', err);
+                resolve({ success: false, error: err.message || 'Failed to parse .lixjson file' });
+            }
         };
         input.click();
     });
@@ -808,12 +876,15 @@ export function exportAsPDF() {
 // ============================================================
 // RESET: Clear the entire canvas
 // ============================================================
-export function resetCanvas() {
+export function resetCanvas({ undoable = true, clearStorage = true, clearHistory = true, workspaceName = 'Untitled' } = {}) {
     const svgEl = window.svg;
     if (!svgEl) return;
 
     // Remove all shape DOM elements + frame clipGroups/clipPaths
     const existingShapes = window.shapes || [];
+    const resetSnapshot = undoable && existingShapes.length > 0
+        ? saveScene(workspaceName)
+        : null;
     existingShapes.forEach(shape => {
         if (shape.shapeName === 'frame') {
             if (shape.clipGroup && shape.clipGroup.parentNode) {
@@ -848,16 +919,28 @@ export function resetCanvas() {
         window.disableAllSideBars();
     }
 
-    // Clear auto-save (both legacy and session-scoped keys)
-    try {
-        localStorage.removeItem('lixsketch-autosave');
-        localStorage.removeItem('lixsketch-autosave-meta');
-        const sid = window.__sessionID;
-        if (sid) {
-            localStorage.removeItem(`lixsketch-autosave-${sid}`);
-            localStorage.removeItem(`lixsketch-autosave-meta-${sid}`);
-        }
-    } catch (_) {}
+    if (clearStorage) {
+        // Clear auto-save (both legacy and session-scoped keys)
+        try {
+            localStorage.removeItem('lixsketch-autosave');
+            localStorage.removeItem('lixsketch-autosave-meta');
+            const sid = window.__sessionID;
+            if (sid) {
+                localStorage.removeItem(`lixsketch-autosave-${sid}`);
+                localStorage.removeItem(`lixsketch-autosave-meta-${sid}`);
+            }
+        } catch (_) {}
+    }
+
+    if (resetSnapshot) {
+        pushCanvasResetAction(
+            resetSnapshot,
+            (snapshot) => loadScene(snapshot),
+            () => resetCanvas({ undoable: false, clearStorage: true, clearHistory: false, workspaceName }),
+        );
+    } else if (clearHistory) {
+        clearUndoHistory();
+    }
 
     console.log('[SceneSerializer] Canvas reset');
     if (typeof window.__collabSceneChanged === 'function') {

package/src/core/Selection.js

@@ -1864,6 +1864,16 @@ document.addEventListener('keydown', (e) => {
 function deleteSelectedShapes() {
     if (multiSelection.selectedShapes.size === 0) return;
 
+    if (
+        Array.isArray(window.shapes) &&
+        window.shapes.length > 0 &&
+        multiSelection.selectedShapes.size >= window.shapes.length &&
+        typeof window.__requestCanvasResetConfirmation === 'function'
+    ) {
+        window.__requestCanvasResetConfirmation();
+        return;
+    }
+
     const shapesToDelete = Array.from(multiSelection.selectedShapes);
     multiSelection.clearSelection();
 
@@ -1938,9 +1948,9 @@ function deleteSelectedShapes() {
         // snapshot so undo can re-attach them.
         try {
             if (childSnapshot) {
-                pushDeleteAction(shape, { childSnapshot });
+                pushDeleteAction(shape, { childSnapshot, shapeIndex: idx });
             } else {
-                pushDeleteAction(shape);
+                pushDeleteAction(shape, { shapeIndex: idx });
             }
         } catch (err) {
             console.warn('[deleteSelectedShapes] pushDeleteAction failed:', err);

package/src/core/UndoRedo.js

@@ -58,6 +58,7 @@ export function pushDeleteAction(shape, meta = null) {
     // when the frame is restored, instead of leaving an empty box.
     const action = { type: 'delete', shape };
     if (meta && meta.childSnapshot) action.childSnapshot = meta.childSnapshot;
+    if (Number.isInteger(meta?.shapeIndex)) action.shapeIndex = meta.shapeIndex;
     undoStack.push(action);
 
     // Clear redo stack when new action is performed
@@ -65,6 +66,30 @@ export function pushDeleteAction(shape, meta = null) {
     notifyCollaboration();
 }
 
+export function pushCanvasResetAction(snapshot, restore, reset) {
+    if (!snapshot || typeof restore !== 'function' || typeof reset !== 'function') return;
+    // A reset is a new history boundary. Older per-shape actions reference
+    // objects that the scene loader will replace, so only the atomic reset
+    // snapshot remains undoable.
+    undoStack.length = 0;
+    redoStack.length = 0;
+    undoStack.push({ type: 'canvasReset', snapshot, restore, reset });
+}
+
+export function invalidateCanvasResetUndo() {
+    for (let index = undoStack.length - 1; index >= 0; index -= 1) {
+        if (undoStack[index]?.type === 'canvasReset') undoStack.splice(index, 1);
+    }
+    for (let index = redoStack.length - 1; index >= 0; index -= 1) {
+        if (redoStack[index]?.type === 'canvasReset') redoStack.splice(index, 1);
+    }
+}
+
+export function clearUndoHistory() {
+    undoStack.length = 0;
+    redoStack.length = 0;
+}
+
 // Enhanced delete action to clean up attached arrows
 export function pushDeleteActionWithAttachments(shape) {
     let affectedArrows = [];
@@ -442,6 +467,15 @@ export function pushOptionsChangeAction(shape, oldOptions, newOptions = null) {
     notifyCollaboration();
 }
 
+function applyOptionsSnapshot(shape, options) {
+    shape.options = { ...options };
+    if (shape.shapeName === 'frame') {
+        shape.fillColor = options.fillColor;
+        shape.fillStyle = options.fillStyle;
+    }
+    shape.draw();
+}
+
 // Issue #34 bug #4: refresh the multi-selection outline + handles so it
 // follows the reverted geometry. Without this the selection rect stays
 // pinned to the pre-undo coordinates and the user sees a ghost rect
@@ -458,6 +492,13 @@ export function undo() {
     if (undoStack.length === 0) return;
     const action = undoStack.pop();
     try {
+    if (action.type === 'canvasReset') {
+        action.restore(action.snapshot);
+        redoStack.push(action);
+        notifyCollaboration();
+        return;
+    }
+
     if (action.type === 'frameTransform') {
         // Handle frame transformation undo
         action.shape.x = action.oldPos.x;
@@ -652,7 +693,12 @@ export function undo() {
             action.shape.restore();
         } else {
             // Handle other shape deletion undo
-            shapes.push(action.shape);
+            if (shapes.indexOf(action.shape) === -1) {
+                const index = Number.isInteger(action.shapeIndex)
+                    ? Math.min(Math.max(action.shapeIndex, 0), shapes.length)
+                    : shapes.length;
+                shapes.splice(index, 0, action.shape);
+            }
             if (svg) {
                 svg.appendChild(action.shape.group);
             }
@@ -959,8 +1005,7 @@ export function undo() {
             action.shape.draw();
         } else {
             // Handle other shape options change undo
-            action.shape.options = action.oldOptions;
-            action.shape.draw();
+            applyOptionsSnapshot(action.shape, action.oldOptions);
         }
         redoStack.push(action);
         return;
@@ -975,6 +1020,13 @@ export function redo() {
     if (redoStack.length === 0) return;
     const action = redoStack.pop();
     try {
+    if (action.type === 'canvasReset') {
+        action.reset();
+        undoStack.push(action);
+        notifyCollaboration();
+        return;
+    }
+
     if (action.type === 'frameTransform') {
         // Handle frame transformation redo
         action.shape.x = action.newPos.x;
@@ -1453,8 +1505,7 @@ export function redo() {
             action.shape.arrowCurveAmount = action.newOptions.arrowCurveAmount;
             action.shape.draw();
         } else {
-            action.shape.options = { ...action.newOptions };
-            action.shape.draw();
+            applyOptionsSnapshot(action.shape, action.newOptions);
         }
         undoStack.push(action);
         return;
@@ -1484,6 +1535,9 @@ document.getElementById('redo')?.addEventListener('click', redo);
 // Expose globally for plain scripts
 window.pushCreateAction = pushCreateAction;
 window.pushDeleteAction = pushDeleteAction;
+window.pushCanvasResetAction = pushCanvasResetAction;
+window.invalidateCanvasResetUndo = invalidateCanvasResetUndo;
+window.clearUndoHistory = clearUndoHistory;
 window.pushDeleteActionWithAttachments = pushDeleteActionWithAttachments;
 window.pushTransformAction = pushTransformAction;
 window.pushOptionsChangeAction = pushOptionsChangeAction;