@pixerate/editor-react 0.3.13 → 0.5.0

package/dist/index.d.ts

@@ -1,10 +1,10 @@
 import * as _tiptap_core from '@tiptap/core';
 import { Editor } from '@tiptap/core';
 import * as _pixerate_editor from '@pixerate/editor';
-import { Template, ColorGradient, RichTextPresetOptions, SpreadsheetControllerOptions, SpreadsheetDocument, CellCoordinate, CellRange, SpreadsheetController, SpreadsheetColumn, SpreadsheetRow, SpreadsheetDataSource, CellData } from '@pixerate/editor';
-export { ColorGradient, RichTextPresetOptions, Template, TemplateVersion, Token, TokenType } from '@pixerate/editor';
+import { Template, ColorGradient, RichTextPresetOptions, HistoryState, HistoryManager, Command, HistoryManagerOptions, SpreadsheetControllerOptions, SpreadsheetDocument, CellCoordinate, CellRange, SpreadsheetController, SpreadsheetColumn, SpreadsheetRow, SpreadsheetDataSource, CellData } from '@pixerate/editor';
+export { ColorGradient, Command, DirtyTracker, DirtyTrackerOptions, HistoryManager, HistoryManagerOptions, HistoryState, RichTextPresetOptions, Template, TemplateVersion, Token, TokenType, createDirtyTracker, createHistoryManager, defaultIsEqual } from '@pixerate/editor';
 import { UseEditorOptions, EditorContentProps as EditorContentProps$1 } from '@tiptap/react';
-import * as React from 'react';
+import * as React$1 from 'react';
 import React__default from 'react';
 import { BubbleMenuPluginProps } from '@tiptap/extension-bubble-menu';
 
@@ -60,6 +60,99 @@ interface UseRichEditorProps extends UseEditorOptions {
  */
 declare function useEditor(options?: UseRichEditorProps): _tiptap_core.Editor | null;
 
+interface UseNavigationGuardOptions {
+    /** Whether the current form or editor has unsaved changes */
+    isDirty: boolean;
+    /** Whether guarding is enabled (defaults to true) */
+    enabled?: boolean;
+    /** Custom navigation function (e.g. router.push from next/navigation or react-router) */
+    onNavigate?: (url: string) => void;
+    /** Optional callback fired when an internal navigation attempt is intercepted */
+    onBlocked?: (url: string) => void;
+}
+interface UseNavigationGuardReturn {
+    /** Whether the unsaved changes confirmation dialog should be displayed */
+    showConfirm: boolean;
+    /** Setter to manually control the dialog visibility */
+    setShowConfirm: (show: boolean) => void;
+    /** The target URL that the user attempted to navigate to */
+    pendingUrl: string | null;
+    /** Proceeds with the blocked navigation and closes the dialog */
+    confirmLeave: () => void;
+    /** Cancels the navigation attempt and keeps the user on the current page */
+    cancelLeave: () => void;
+}
+/**
+ * Hook to guard against navigation when there are unsaved changes.
+ * Intercepts both external unloads (tab closing/refreshing) and internal link clicks.
+ */
+declare function useNavigationGuard({ isDirty, enabled, onNavigate, onBlocked, }: UseNavigationGuardOptions): UseNavigationGuardReturn;
+
+interface UseDismissGuardOptions {
+    /** Whether there are unsaved changes */
+    isDirty: boolean;
+    /** Whether the dismissal guard is enabled (defaults to true) */
+    enabled?: boolean;
+    /** Callback fired when dismissal is confirmed or when clean dismissal occurs */
+    onDismiss?: () => void;
+}
+interface UseDismissGuardReturn {
+    /** Whether the discard confirmation modal should be shown */
+    showConfirm: boolean;
+    /** Manually update confirmation modal visibility */
+    setShowConfirm: (show: boolean) => void;
+    /** Request dismissal - checks isDirty and shows confirm or executes onDismiss */
+    requestDismiss: () => void;
+    /** Confirm discarding changes and dismiss */
+    confirmDismiss: () => void;
+    /** Cancel discarding and resume editing */
+    cancelDismiss: () => void;
+    /** Helper keydown handler intercepting Escape key */
+    handleKeyDown: (event: React.KeyboardEvent | KeyboardEvent) => boolean;
+}
+/**
+ * Hook to guard against closing or exiting an editor/dialog with uncommitted changes.
+ */
+declare function useDismissGuard({ isDirty, enabled, onDismiss, }: UseDismissGuardOptions): UseDismissGuardReturn;
+
+interface UseHistoryResult extends HistoryState {
+    manager: HistoryManager;
+    undo: () => boolean;
+    redo: () => boolean;
+    clear: () => void;
+    execute: (command: Command) => void;
+    executeMerged: (command: Command, options?: {
+        windowMs?: number;
+    }) => void;
+    batch: (name: string, fn: () => void) => void;
+}
+/**
+ * React hook that subscribes to a HistoryManager instance.
+ * Accepts an existing HistoryManager or config options to create an instance.
+ */
+declare function useHistory(managerOrOptions?: HistoryManager | HistoryManagerOptions): UseHistoryResult;
+
+interface HistoryShortcutsOptions {
+    /**
+     * Whether the keyboard shortcuts are enabled. Defaults to true.
+     */
+    enabled?: boolean;
+    /**
+     * Target element or window to listen on. Defaults to window.
+     */
+    target?: Window | HTMLElement | null;
+    /**
+     * When true (default), shortcuts will not trigger if an <input>, <textarea>,
+     * or [contenteditable] element is currently active / focused.
+     */
+    ignoreEditableElements?: boolean;
+}
+/**
+ * Attaches keyboard listeners for Undo (Mod+Z) and Redo (Mod+Shift+Z / Mod+Y).
+ * Automatically guards against active text inputs and contenteditable editors.
+ */
+declare function useHistoryShortcuts(manager: HistoryManager, options?: HistoryShortcutsOptions): void;
+
 interface EditorContentProps extends EditorContentProps$1 {
     className?: string;
 }
@@ -100,7 +193,7 @@ declare function useSpreadsheetEditor(options?: SpreadsheetControllerOptions): {
     selectedRange: CellRange | null;
     editingCell: CellCoordinate | null;
     draftValue: string;
-    setDraftValue: React.Dispatch<React.SetStateAction<string>>;
+    setDraftValue: React$1.Dispatch<React$1.SetStateAction<string>>;
     controller: SpreadsheetController;
     getCell: (rowId: string, colId: string) => _pixerate_editor.CellData;
     setCellValue: (rowId: string, colId: string, raw: string) => void;
@@ -141,4 +234,4 @@ interface SpreadsheetEditorProps {
 }
 declare const SpreadsheetEditor: React__default.FC<SpreadsheetEditorProps>;
 
-export { BubbleMenu, type BubbleMenuProps, EditorContent, type EditorContentProps, SpreadsheetEditor, type SpreadsheetEditorProps, TemplateRenderer, type TemplateRendererProps, type UsePromptEditorProps, type UseRichEditorProps, useEditor, usePromptEditor, useSpreadsheetEditor };
+export { BubbleMenu, type BubbleMenuProps, EditorContent, type EditorContentProps, type HistoryShortcutsOptions, SpreadsheetEditor, type SpreadsheetEditorProps, TemplateRenderer, type TemplateRendererProps, type UseDismissGuardOptions, type UseDismissGuardReturn, type UseHistoryResult, type UseNavigationGuardOptions, type UseNavigationGuardReturn, type UsePromptEditorProps, type UseRichEditorProps, useDismissGuard, useEditor, useHistory, useHistoryShortcuts, useNavigationGuard, usePromptEditor, useSpreadsheetEditor };

package/dist/index.js

@@ -227,6 +227,226 @@ function useEditor2(options = {}) {
   });
 }
 
+// src/hooks/useNavigationGuard.ts
+import { useState, useEffect as useEffect2, useCallback, useRef as useRef2 } from "react";
+function useNavigationGuard({
+  isDirty,
+  enabled = true,
+  onNavigate,
+  onBlocked
+}) {
+  const [showConfirm, setShowConfirm] = useState(false);
+  const [pendingUrl, setPendingUrl] = useState(null);
+  const onNavigateRef = useRef2(onNavigate);
+  onNavigateRef.current = onNavigate;
+  const onBlockedRef = useRef2(onBlocked);
+  onBlockedRef.current = onBlocked;
+  useEffect2(() => {
+    if (typeof window === "undefined") return;
+    if (!enabled || !isDirty) return;
+    const handleBeforeUnload = (e) => {
+      e.preventDefault();
+      e.returnValue = "";
+    };
+    window.addEventListener("beforeunload", handleBeforeUnload);
+    return () => {
+      window.removeEventListener("beforeunload", handleBeforeUnload);
+    };
+  }, [enabled, isDirty]);
+  useEffect2(() => {
+    if (typeof document === "undefined" || typeof window === "undefined")
+      return;
+    if (!enabled || !isDirty) return;
+    const handleClick = (e) => {
+      const target = e.target;
+      const anchor = target?.closest?.("a");
+      if (!anchor) return;
+      if (anchor.target === "_blank") return;
+      const isInternal = anchor.host === window.location.host;
+      if (!isInternal) return;
+      if (anchor.pathname === window.location.pathname && anchor.search === window.location.search) {
+        return;
+      }
+      e.preventDefault();
+      e.stopPropagation();
+      const href = anchor.href;
+      setPendingUrl(href);
+      setShowConfirm(true);
+      onBlockedRef.current?.(href);
+    };
+    document.addEventListener("click", handleClick, { capture: true });
+    return () => {
+      document.removeEventListener("click", handleClick, { capture: true });
+    };
+  }, [enabled, isDirty]);
+  const confirmLeave = useCallback(() => {
+    setShowConfirm(false);
+    if (pendingUrl) {
+      if (onNavigateRef.current) {
+        onNavigateRef.current(pendingUrl);
+      } else if (typeof window !== "undefined") {
+        window.location.href = pendingUrl;
+      }
+    }
+  }, [pendingUrl]);
+  const cancelLeave = useCallback(() => {
+    setShowConfirm(false);
+    setPendingUrl(null);
+  }, []);
+  return {
+    showConfirm,
+    setShowConfirm,
+    pendingUrl,
+    confirmLeave,
+    cancelLeave
+  };
+}
+
+// src/hooks/useDismissGuard.ts
+import { useState as useState2, useCallback as useCallback2, useRef as useRef3 } from "react";
+function useDismissGuard({
+  isDirty,
+  enabled = true,
+  onDismiss
+}) {
+  const [showConfirm, setShowConfirm] = useState2(false);
+  const onDismissRef = useRef3(onDismiss);
+  onDismissRef.current = onDismiss;
+  const requestDismiss = useCallback2(() => {
+    if (enabled && isDirty) {
+      setShowConfirm(true);
+    } else {
+      onDismissRef.current?.();
+    }
+  }, [enabled, isDirty]);
+  const confirmDismiss = useCallback2(() => {
+    setShowConfirm(false);
+    onDismissRef.current?.();
+  }, []);
+  const cancelDismiss = useCallback2(() => {
+    setShowConfirm(false);
+  }, []);
+  const handleKeyDown = useCallback2(
+    (event) => {
+      if (event.key === "Escape") {
+        if (event.defaultPrevented) return false;
+        event.preventDefault();
+        requestDismiss();
+        return true;
+      }
+      return false;
+    },
+    [requestDismiss]
+  );
+  return {
+    showConfirm,
+    setShowConfirm,
+    requestDismiss,
+    confirmDismiss,
+    cancelDismiss,
+    handleKeyDown
+  };
+}
+
+// src/hooks/useHistory.ts
+import { useSyncExternalStore, useMemo as useMemo2, useCallback as useCallback3 } from "react";
+import {
+  HistoryManager,
+  createHistoryManager
+} from "@pixerate/editor";
+function useHistory(managerOrOptions) {
+  const manager = useMemo2(() => {
+    if (managerOrOptions instanceof HistoryManager) {
+      return managerOrOptions;
+    }
+    return createHistoryManager(managerOrOptions);
+  }, [managerOrOptions]);
+  const state = useSyncExternalStore(
+    useCallback3(
+      (onStoreChange) => manager.subscribe(onStoreChange),
+      [manager]
+    ),
+    () => manager.getState(),
+    () => manager.getState()
+  );
+  const undo = useCallback3(() => manager.undo(), [manager]);
+  const redo = useCallback3(() => manager.redo(), [manager]);
+  const clear = useCallback3(() => manager.clear(), [manager]);
+  const execute = useCallback3(
+    (cmd) => manager.execute(cmd),
+    [manager]
+  );
+  const executeMerged = useCallback3(
+    (cmd, opts) => manager.executeMerged(cmd, opts),
+    [manager]
+  );
+  const batch = useCallback3(
+    (name, fn) => manager.batch(name, fn),
+    [manager]
+  );
+  return {
+    ...state,
+    manager,
+    undo,
+    redo,
+    clear,
+    execute,
+    executeMerged,
+    batch
+  };
+}
+
+// src/hooks/useHistoryShortcuts.ts
+import { useEffect as useEffect3 } from "react";
+function useHistoryShortcuts(manager, options = {}) {
+  const {
+    enabled = true,
+    target,
+    ignoreEditableElements = true
+  } = options;
+  useEffect3(() => {
+    if (!enabled) return;
+    const eventTarget = target ?? (typeof window !== "undefined" ? window : null);
+    if (!eventTarget) return;
+    const handleKeyDown = (event) => {
+      const e = event;
+      const isMac = typeof navigator !== "undefined" && /Mac|iPod|iPhone|iPad/.test(navigator.platform || navigator.userAgent);
+      const modifier = isMac ? e.metaKey : e.ctrlKey;
+      if (!modifier) return;
+      if (ignoreEditableElements && typeof document !== "undefined") {
+        const targetEl = e.target || document.activeElement;
+        if (targetEl && targetEl.tagName) {
+          const tagName = targetEl.tagName.toLowerCase();
+          const isInput = tagName === "input" || tagName === "textarea";
+          const isContentEditable = targetEl.isContentEditable || targetEl.getAttribute?.("contenteditable") === "true";
+          if (isInput || isContentEditable) {
+            return;
+          }
+        }
+      }
+      const key = e.key.toLowerCase();
+      if (key === "z" && !e.shiftKey) {
+        if (manager.getState().canUndo) {
+          e.preventDefault();
+          manager.undo();
+        }
+        return;
+      }
+      const isRedoKey = key === "z" && e.shiftKey || !isMac && key === "y" && !e.shiftKey;
+      if (isRedoKey) {
+        if (manager.getState().canRedo) {
+          e.preventDefault();
+          manager.redo();
+        }
+      }
+    };
+    eventTarget.addEventListener("keydown", handleKeyDown);
+    return () => {
+      eventTarget.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [manager, enabled, target, ignoreEditableElements]);
+}
+
 // src/components/EditorContent.tsx
 import {
   EditorContent as TipTapEditorContent
@@ -241,7 +461,7 @@ var EditorContent = ({
 };
 
 // src/components/BubbleMenu.tsx
-import { useEffect as useEffect2, useRef as useRef2, useState } from "react";
+import { useEffect as useEffect4, useRef as useRef4, useState as useState3 } from "react";
 import { createPortal } from "react-dom";
 import {
   BubbleMenuPlugin
@@ -255,12 +475,12 @@ var BubbleMenu = ({
   pluginKey = "bubbleMenu",
   updateDelay
 }) => {
-  const menuEl = useRef2(null);
-  const [mounted, setMounted] = useState(false);
+  const menuEl = useRef4(null);
+  const [mounted, setMounted] = useState3(false);
   if (!menuEl.current && typeof document !== "undefined") {
     menuEl.current = document.createElement("div");
   }
-  useEffect2(() => {
+  useEffect4(() => {
     if (!editor || !menuEl.current || editor.isDestroyed) {
       return;
     }
@@ -291,7 +511,7 @@ var BubbleMenu = ({
 };
 
 // src/components/TemplateRenderer.tsx
-import { useMemo as useMemo2 } from "react";
+import { useMemo as useMemo3 } from "react";
 import {
   tokenizePrompt,
   resolveTemplates
@@ -306,11 +526,11 @@ var TemplateRenderer = ({
   onTemplateClick,
   onVariableClick
 }) => {
-  const displayText = useMemo2(() => {
+  const displayText = useMemo3(() => {
     if (!resolve || templates.length === 0) return content;
     return resolveTemplates(content, templates);
   }, [content, templates, resolve]);
-  const tokens = useMemo2(() => {
+  const tokens = useMemo3(() => {
     return tokenizePrompt(displayText);
   }, [displayText]);
   return /* @__PURE__ */ jsx2("div", { className, children: tokens.map((token, index) => {
@@ -362,13 +582,22 @@ var TemplateRenderer = ({
   }) });
 };
 
+// src/index.ts
+import {
+  DirtyTracker,
+  createDirtyTracker,
+  defaultIsEqual,
+  HistoryManager as HistoryManager2,
+  createHistoryManager as createHistoryManager2
+} from "@pixerate/editor";
+
 // src/spreadsheet/useSpreadsheetEditor.ts
-import { useState as useState2, useMemo as useMemo3, useCallback } from "react";
+import { useState as useState4, useMemo as useMemo4, useCallback as useCallback4 } from "react";
 import {
   SpreadsheetController
 } from "@pixerate/editor";
 function useSpreadsheetEditor(options = {}) {
-  const [doc, setDoc] = useState2(() => ({
+  const [doc, setDoc] = useState4(() => ({
     id: options.document?.id || `sheet_${Date.now()}`,
     name: options.document?.name || "Sheet 1",
     columns: options.document?.columns || [],
@@ -377,11 +606,11 @@ function useSpreadsheetEditor(options = {}) {
     createdAt: options.document?.createdAt || Date.now(),
     updatedAt: options.document?.updatedAt || Date.now()
   }));
-  const [activeCell, setActiveCell] = useState2(null);
-  const [selectedRange, setSelectedRange] = useState2(null);
-  const [editingCell, setEditingCell] = useState2(null);
-  const [draftValue, setDraftValue] = useState2("");
-  const controller = useMemo3(() => {
+  const [activeCell, setActiveCell] = useState4(null);
+  const [selectedRange, setSelectedRange] = useState4(null);
+  const [editingCell, setEditingCell] = useState4(null);
+  const [draftValue, setDraftValue] = useState4("");
+  const controller = useMemo4(() => {
     return new SpreadsheetController({
       ...options,
       onDocumentChange: (updated) => {
@@ -398,82 +627,82 @@ function useSpreadsheetEditor(options = {}) {
       }
     });
   }, []);
-  const setCellValue = useCallback((rowId, colId, raw) => {
+  const setCellValue = useCallback4((rowId, colId, raw) => {
     controller.setCellValue(rowId, colId, raw);
     setDoc({ ...controller.document });
   }, [controller]);
-  const selectCell = useCallback((row, col, extendSelection = false) => {
+  const selectCell = useCallback4((row, col, extendSelection = false) => {
     controller.selectCell(row, col, extendSelection);
     setActiveCell(controller.activeCell);
     setSelectedRange(controller.selectedRange);
   }, [controller]);
-  const selectRange = useCallback((range) => {
+  const selectRange = useCallback4((range) => {
     controller.selectRange(range);
     setSelectedRange(controller.selectedRange);
   }, [controller]);
-  const startEditing = useCallback((row, col, initialVal) => {
+  const startEditing = useCallback4((row, col, initialVal) => {
     controller.startEditing(row, col, initialVal);
     setActiveCell(controller.activeCell);
     setEditingCell(controller.editingCell);
     setDraftValue(controller.draftValue);
   }, [controller]);
-  const commitEditing = useCallback((val) => {
+  const commitEditing = useCallback4((val) => {
     controller.commitEditing(val);
     setEditingCell(null);
     setDraftValue("");
     setDoc({ ...controller.document });
   }, [controller]);
-  const cancelEditing = useCallback(() => {
+  const cancelEditing = useCallback4(() => {
     controller.cancelEditing();
     setEditingCell(null);
     setDraftValue("");
   }, [controller]);
-  const moveCursor = useCallback((dir, extend = false) => {
+  const moveCursor = useCallback4((dir, extend = false) => {
     controller.moveCursor(dir, extend);
     setActiveCell(controller.activeCell);
     setSelectedRange(controller.selectedRange);
   }, [controller]);
-  const insertColumn = useCallback((index, config) => {
+  const insertColumn = useCallback4((index, config) => {
     controller.insertColumn(index, config);
     setDoc({ ...controller.document });
   }, [controller]);
-  const deleteColumn = useCallback((colId) => {
+  const deleteColumn = useCallback4((colId) => {
     controller.deleteColumn(colId);
     setDoc({ ...controller.document });
   }, [controller]);
-  const insertRow = useCallback((index, config) => {
+  const insertRow = useCallback4((index, config) => {
     controller.insertRow(index, config);
     setDoc({ ...controller.document });
   }, [controller]);
-  const deleteRow = useCallback((rowId) => {
+  const deleteRow = useCallback4((rowId) => {
     controller.deleteRow(rowId);
     setDoc({ ...controller.document });
   }, [controller]);
-  const setColumnWidth = useCallback((colId, width) => {
+  const setColumnWidth = useCallback4((colId, width) => {
     controller.setColumnWidth(colId, width);
     setDoc({ ...controller.document });
   }, [controller]);
-  const autoFitColumnWidth = useCallback((colId, customWidth) => {
+  const autoFitColumnWidth = useCallback4((colId, customWidth) => {
     controller.autoFitColumnWidth(colId, customWidth);
     setDoc({ ...controller.document });
   }, [controller]);
-  const registerDataSource = useCallback((ds) => {
+  const registerDataSource = useCallback4((ds) => {
     controller.registerDataSource(ds);
     setDoc({ ...controller.document });
   }, [controller]);
-  const setPrimaryDataSource = useCallback((id) => {
+  const setPrimaryDataSource = useCallback4((id) => {
     controller.setPrimaryDataSource(id);
     setDoc({ ...controller.document });
   }, [controller]);
-  const recalculateAll = useCallback(() => {
+  const recalculateAll = useCallback4(() => {
     controller.recalculateAll();
     setDoc({ ...controller.document });
   }, [controller]);
-  const undo = useCallback(() => {
+  const undo = useCallback4(() => {
     controller.undo();
     setDoc({ ...controller.document });
   }, [controller]);
-  const redo = useCallback(() => {
+  const redo = useCallback4(() => {
     controller.redo();
     setDoc({ ...controller.document });
   }, [controller]);
@@ -526,7 +755,7 @@ function useSpreadsheetEditor(options = {}) {
 }
 
 // src/spreadsheet/SpreadsheetEditor.tsx
-import { useRef as useRef3, useState as useState3, useMemo as useMemo4, useEffect as useEffect3, useCallback as useCallback2 } from "react";
+import { useRef as useRef5, useState as useState5, useMemo as useMemo5, useEffect as useEffect5, useCallback as useCallback5 } from "react";
 import {
   indexToColName
 } from "@pixerate/editor";
@@ -541,36 +770,36 @@ var SpreadsheetEditor = ({
 }) => {
   const defaultState = useSpreadsheetEditor();
   const state = externalState || defaultState;
-  const gridRef = useRef3(null);
-  const [resizingColId, setResizingColId] = useState3(null);
-  const [hoveredColId, setHoveredColId] = useState3(null);
-  const [resizeStartX, setResizeStartX] = useState3(0);
-  const [resizeStartWidth, setResizeStartWidth] = useState3(0);
-  const activeRawValue = useMemo4(() => {
+  const gridRef = useRef5(null);
+  const [resizingColId, setResizingColId] = useState5(null);
+  const [hoveredColId, setHoveredColId] = useState5(null);
+  const [resizeStartX, setResizeStartX] = useState5(0);
+  const [resizeStartWidth, setResizeStartWidth] = useState5(0);
+  const activeRawValue = useMemo5(() => {
     if (!state.activeCell) return "";
     const row = state.document.rows[state.activeCell.row];
     const col = state.document.columns[state.activeCell.col];
     if (!row || !col) return "";
     return state.getCell(row.id, col.id).raw;
   }, [state.activeCell, state.document]);
-  const coordLabel = useMemo4(() => {
+  const coordLabel = useMemo5(() => {
     if (!state.activeCell) return "--";
     const colName = indexToColName(state.activeCell.col);
     return `${colName}${state.activeCell.row + 1}`;
   }, [state.activeCell]);
-  const handleCellClick = useCallback2((rIdx, cIdx, e) => {
+  const handleCellClick = useCallback5((rIdx, cIdx, e) => {
     if (state.editingCell && (state.editingCell.row !== rIdx || state.editingCell.col !== cIdx)) {
       state.commitEditing();
     }
     state.selectCell(rIdx, cIdx, e.shiftKey);
   }, [state]);
-  const handleCellDblClick = useCallback2((rIdx, cIdx) => {
+  const handleCellDblClick = useCallback5((rIdx, cIdx) => {
     if (readOnly) return;
     const col = state.document.columns[cIdx];
     if (col?.readOnly) return;
     state.startEditing(rIdx, cIdx);
   }, [readOnly, state]);
-  const handleKeyDown = useCallback2((e) => {
+  const handleKeyDown = useCallback5((e) => {
     if (state.editingCell) {
       if (e.key === "Enter") {
         e.preventDefault();
@@ -634,7 +863,7 @@ var SpreadsheetEditor = ({
       }
     }
   }, [readOnly, state]);
-  useEffect3(() => {
+  useEffect5(() => {
     if (!resizingColId) return;
     if (typeof document !== "undefined") {
       document.body.style.cursor = "col-resize";
@@ -688,7 +917,7 @@ var SpreadsheetEditor = ({
       window.removeEventListener("mouseup", handleMouseUp);
     };
   }, [resizingColId, resizeStartX, resizeStartWidth, state, onColumnResize]);
-  const measureElementContentWidth = useCallback2((el, container) => {
+  const measureElementContentWidth = useCallback5((el, container) => {
     if (typeof document === "undefined") return 0;
     let maxW = el.scrollWidth || 0;
     const firstChild = el.firstElementChild;
@@ -736,7 +965,7 @@ var SpreadsheetEditor = ({
     }
     return maxW;
   }, []);
-  const autoFitColumn = useCallback2((colId, colIndex) => {
+  const autoFitColumn = useCallback5((colId, colIndex) => {
     const col = state.document.columns.find((c) => c.id === colId);
     if (!col) return;
     let calculatedWidth = 0;
@@ -773,12 +1002,12 @@ var SpreadsheetEditor = ({
       onColumnResize(updatedCol.id, updatedCol.width || 130);
     }
   }, [state, measureElementContentWidth, onColumnResize]);
-  const handleResizeDblClick = useCallback2((colId, colIndex, e) => {
+  const handleResizeDblClick = useCallback5((colId, colIndex, e) => {
     e.preventDefault();
     e.stopPropagation();
     autoFitColumn(colId, colIndex);
   }, [autoFitColumn]);
-  const handleHeaderDblClick = useCallback2((colId, colIndex, e) => {
+  const handleHeaderDblClick = useCallback5((colId, colIndex, e) => {
     const target = e.currentTarget;
     if (target) {
       const rect = target.getBoundingClientRect();
@@ -963,10 +1192,19 @@ var SpreadsheetEditor = ({
 };
 export {
   BubbleMenu,
+  DirtyTracker,
   EditorContent,
+  HistoryManager2 as HistoryManager,
   SpreadsheetEditor,
   TemplateRenderer,
+  createDirtyTracker,
+  createHistoryManager2 as createHistoryManager,
+  defaultIsEqual,
+  useDismissGuard,
   useEditor2 as useEditor,
+  useHistory,
+  useHistoryShortcuts,
+  useNavigationGuard,
   usePromptEditor,
   useSpreadsheetEditor
 };