@pixerate/editor-react 0.10.2 → 0.10.4

package/dist/index.d.cts

@@ -137,7 +137,8 @@ interface UseHistoryResult extends HistoryState {
 }
 /**
  * React hook that subscribes to a HistoryManager instance.
- * Accepts an existing HistoryManager or config options to create an instance.
+ * Accepts an existing HistoryManager or config options to create an instance
+ * (options are read on first render only).
  */
 declare function useHistory(managerOrOptions?: HistoryManager | HistoryManagerOptions): UseHistoryResult;
 

package/dist/index.d.ts

@@ -137,7 +137,8 @@ interface UseHistoryResult extends HistoryState {
 }
 /**
  * React hook that subscribes to a HistoryManager instance.
- * Accepts an existing HistoryManager or config options to create an instance.
+ * Accepts an existing HistoryManager or config options to create an instance
+ * (options are read on first render only).
  */
 declare function useHistory(managerOrOptions?: HistoryManager | HistoryManagerOptions): UseHistoryResult;
 

package/dist/index.js

@@ -1,7 +1,7 @@
 import {
   ImageEditor,
   useImageEditor
-} from "./chunk-UYT5EQU6.js";
+} from "./chunk-H7HCHLZU.js";
 
 // src/hooks/usePromptEditor.ts
 import { useMemo, useEffect, useRef } from "react";
@@ -373,18 +373,20 @@ function useDismissGuard({
 }
 
 // src/hooks/useHistory.ts
-import { useSyncExternalStore, useMemo as useMemo2, useCallback as useCallback3 } from "react";
+import { useSyncExternalStore, useRef as useRef4, 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 ownManagerRef = useRef4(null);
+  let manager;
+  if (managerOrOptions instanceof HistoryManager) {
+    manager = managerOrOptions;
+  } else {
+    ownManagerRef.current ??= createHistoryManager(managerOrOptions);
+    manager = ownManagerRef.current;
+  }
   const state = useSyncExternalStore(
     useCallback3(
       (onStoreChange) => manager.subscribe(onStoreChange),
@@ -485,7 +487,7 @@ var EditorContent = ({
 };
 
 // src/components/BubbleMenu.tsx
-import { useEffect as useEffect4, useRef as useRef4, useState as useState3 } from "react";
+import { useEffect as useEffect4, useRef as useRef5, useState as useState3 } from "react";
 import { createPortal } from "react-dom";
 import {
   BubbleMenuPlugin
@@ -499,7 +501,7 @@ var BubbleMenu = ({
   pluginKey = "bubbleMenu",
   updateDelay
 }) => {
-  const menuEl = useRef4(null);
+  const menuEl = useRef5(null);
   const [mounted, setMounted] = useState3(false);
   if (!menuEl.current && typeof document !== "undefined") {
     menuEl.current = document.createElement("div");
@@ -535,7 +537,7 @@ var BubbleMenu = ({
 };
 
 // src/components/TemplateRenderer.tsx
-import { useMemo as useMemo3 } from "react";
+import { useMemo as useMemo2 } from "react";
 import {
   tokenizePrompt as tokenizePrompt2,
   resolveTemplates
@@ -550,11 +552,11 @@ var TemplateRenderer = ({
   onTemplateClick,
   onVariableClick
 }) => {
-  const displayText = useMemo3(() => {
+  const displayText = useMemo2(() => {
     if (!resolve || templates.length === 0) return content;
     return resolveTemplates(content, templates);
   }, [content, templates, resolve]);
-  const tokens = useMemo3(() => {
+  const tokens = useMemo2(() => {
     return tokenizePrompt2(displayText);
   }, [displayText]);
   return /* @__PURE__ */ jsx2("div", { className, children: tokens.map((token, index) => {
@@ -616,14 +618,14 @@ import {
 } from "@pixerate/editor";
 
 // src/spreadsheet/useSpreadsheetEditor.ts
-import { useState as useState4, useRef as useRef5, useCallback as useCallback4 } from "react";
+import { useState as useState4, useRef as useRef6, useCallback as useCallback4 } from "react";
 import {
   SpreadsheetController
 } from "@pixerate/editor";
 function useSpreadsheetEditor(options = {}) {
-  const optionsRef = useRef5(options);
+  const optionsRef = useRef6(options);
   optionsRef.current = options;
-  const settersRef = useRef5({});
+  const settersRef = useRef6({});
   const [controller] = useState4(
     () => new SpreadsheetController({
       ...options,
@@ -775,7 +777,7 @@ function useSpreadsheetEditor(options = {}) {
 }
 
 // src/spreadsheet/SpreadsheetEditor.tsx
-import { useRef as useRef6, useState as useState5, useMemo as useMemo4, useEffect as useEffect5, useCallback as useCallback5 } from "react";
+import { useRef as useRef7, useState as useState5, useMemo as useMemo3, useEffect as useEffect5, useCallback as useCallback5 } from "react";
 import {
   indexToColName
 } from "@pixerate/editor";
@@ -790,19 +792,19 @@ var SpreadsheetEditor = ({
 }) => {
   const defaultState = useSpreadsheetEditor();
   const state = externalState || defaultState;
-  const gridRef = useRef6(null);
+  const gridRef = useRef7(null);
   const [resizingColId, setResizingColId] = useState5(null);
   const [hoveredColId, setHoveredColId] = useState5(null);
   const [resizeStartX, setResizeStartX] = useState5(0);
   const [resizeStartWidth, setResizeStartWidth] = useState5(0);
-  const activeRawValue = useMemo4(() => {
+  const activeRawValue = useMemo3(() => {
     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 = useMemo3(() => {
     if (!state.activeCell) return "--";
     const colName = indexToColName(state.activeCell.col);
     return `${colName}${state.activeCell.row + 1}`;
@@ -905,9 +907,9 @@ var SpreadsheetEditor = ({
       }
     }
   }, [readOnly, state]);
-  const stateRef = useRef6(state);
+  const stateRef = useRef7(state);
   stateRef.current = state;
-  const onColumnResizeRef = useRef6(onColumnResize);
+  const onColumnResizeRef = useRef7(onColumnResize);
   onColumnResizeRef.current = onColumnResize;
   useEffect5(() => {
     if (!resizingColId) return;
@@ -1239,7 +1241,7 @@ var SpreadsheetEditor = ({
 };
 
 // src/slots.tsx
-import { createContext, useContext, useMemo as useMemo5 } from "react";
+import { createContext, useContext, useMemo as useMemo4 } from "react";
 import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
 var defaultSlots = {
   Button: (props) => /* @__PURE__ */ jsx4(
@@ -1263,7 +1265,7 @@ var defaultSlots = {
 };
 var EditorSlotsContext = createContext(defaultSlots);
 function EditorSlotsProvider({ slots, children }) {
-  const mergedSlots = useMemo5(() => ({ ...defaultSlots, ...slots }), [slots]);
+  const mergedSlots = useMemo4(() => ({ ...defaultSlots, ...slots }), [slots]);
   return /* @__PURE__ */ jsx4(EditorSlotsContext.Provider, { value: mergedSlots, children });
 }
 function useEditorSlots() {