@particle-academy/fancy-cms-ui 0.1.0 → 0.1.1

package/dist/editor.js

@@ -1,5 +1,5 @@
-import { useEditor, keyBetween } from './chunk-N22BQAY3.js';
-export { Canvas, Editor, Inspector, LayersPanel, editorReduce, initEditor, useEditor } from './chunk-N22BQAY3.js';
+import { useEditor, useLatestRef, keyBetween } from './chunk-524NYOHK.js';
+export { Canvas, Editor, Inspector, LayersPanel, editorReduce, initEditor, useEditor } from './chunk-524NYOHK.js';
 import { isBinding, childrenOf, CmsPage, defaultRegistry } from './chunk-GOXVGEKU.js';
 import { useState, useRef, useEffect, useCallback, useLayoutEffect } from 'react';
 import { ContextMenu } from '@particle-academy/react-fancy';
@@ -391,7 +391,8 @@ function EditablePage({
   const [box, setBox] = useState(null);
   const { selection } = ed.state;
   const selNode = selection ? ed.state.doc.nodes[selection] : null;
-  useEffect(() => onSelect?.(selection), [selection, onSelect]);
+  const onSelectRef = useLatestRef(onSelect);
+  useEffect(() => onSelectRef.current?.(selection), [selection, onSelectRef]);
   useEffect(() => {
     const onKey = (e) => setRevealed(e.ctrlKey && e.shiftKey);
     const onBlur = () => setRevealed(false);
@@ -413,13 +414,15 @@ function EditablePage({
       applyTransform(el, t);
     });
   }, [transforms, ed.state.doc]);
+  const onProgressRef = useLatestRef(onProgress);
+  const hasProgress = !!onProgress;
   useEffect(() => {
     const spacer = spacerRef.current;
-    if (!spacer || !onProgress) return;
+    if (!spacer || !hasProgress) return;
     const compute = () => {
       const len2 = spacer.offsetHeight - window.innerHeight;
       const top = spacer.getBoundingClientRect().top;
-      onProgress(len2 > 0 ? Math.min(1, Math.max(0, -top / len2)) : 0);
+      onProgressRef.current?.(len2 > 0 ? Math.min(1, Math.max(0, -top / len2)) : 0);
     };
     compute();
     window.addEventListener("scroll", compute, { passive: true });
@@ -428,7 +431,7 @@ function EditablePage({
       window.removeEventListener("scroll", compute);
       window.removeEventListener("resize", compute);
     };
-  }, [onProgress, frames]);
+  }, [hasProgress, onProgressRef, frames]);
   const measureBox = useCallback(() => {
     if (!editing || !selection || !pageRef.current) return setBox(null);
     const el = pageRef.current.querySelector(`[data-cms="${cssEscape(selection)}"]`);