@particle-academy/react-fancy 1.7.2 → 1.7.4

package/dist/index.d.cts

@@ -1507,6 +1507,8 @@ interface EditorToolbarProps {
 }
 interface EditorContentProps {
     className?: string;
+    /** Max height in px before scrolling. When set, content area becomes scrollable. */
+    maxHeight?: number;
 }
 interface EditorProps {
     children: ReactNode;
@@ -1531,7 +1533,7 @@ declare namespace EditorToolbarSeparator {
     var displayName: string;
 }
 
-declare function EditorContent({ className }: EditorContentProps): react_jsx_runtime.JSX.Element;
+declare function EditorContent({ className, maxHeight }: EditorContentProps): react_jsx_runtime.JSX.Element;
 declare namespace EditorContent {
     var displayName: string;
 }
@@ -1554,6 +1556,8 @@ interface EditorContextValue {
     placeholder?: string;
     /** Merged render extensions (global + instance). */
     extensions: RenderExtension[];
+    /** Initial HTML content to load into the editor on mount */
+    _initialHtml: string;
     /** @internal Called by EditorContent on input events */
     _onInput: () => void;
 }

package/dist/index.d.ts

@@ -1507,6 +1507,8 @@ interface EditorToolbarProps {
 }
 interface EditorContentProps {
     className?: string;
+    /** Max height in px before scrolling. When set, content area becomes scrollable. */
+    maxHeight?: number;
 }
 interface EditorProps {
     children: ReactNode;
@@ -1531,7 +1533,7 @@ declare namespace EditorToolbarSeparator {
     var displayName: string;
 }
 
-declare function EditorContent({ className }: EditorContentProps): react_jsx_runtime.JSX.Element;
+declare function EditorContent({ className, maxHeight }: EditorContentProps): react_jsx_runtime.JSX.Element;
 declare namespace EditorContent {
     var displayName: string;
 }
@@ -1554,6 +1556,8 @@ interface EditorContextValue {
     placeholder?: string;
     /** Merged render extensions (global + instance). */
     extensions: RenderExtension[];
+    /** Initial HTML content to load into the editor on mount */
+    _initialHtml: string;
     /** @internal Called by EditorContent on input events */
     _onInput: () => void;
 }

package/dist/index.js

@@ -8319,8 +8319,16 @@ function extensionEditorClasses(extensions) {
     ].join(" ");
   }).join(" ");
 }
-function EditorContent({ className }) {
-  const { contentRef, lineSpacing, placeholder, extensions, _onInput } = useEditor();
+function EditorContent({ className, maxHeight }) {
+  const { contentRef, lineSpacing, placeholder, extensions, _initialHtml, _onInput } = useEditor();
+  const initialized = useRef(false);
+  useEffect(() => {
+    const el = contentRef.current;
+    if (el && _initialHtml && !initialized.current) {
+      el.innerHTML = _initialHtml;
+      initialized.current = true;
+    }
+  }, [contentRef, _initialHtml]);
   const extClasses = useMemo(
     () => extensionEditorClasses(extensions),
     [extensions]
@@ -8334,10 +8342,14 @@ function EditorContent({ className }) {
       "data-react-fancy-editor-content": "",
       "data-placeholder": placeholder,
       onInput: _onInput,
-      style: { lineHeight: lineSpacing },
+      style: {
+        lineHeight: lineSpacing,
+        maxHeight: maxHeight ? `${maxHeight}px` : void 0
+      },
       className: cn(
         "min-h-[120px] px-4 py-3 text-sm outline-none",
         "focus:outline-none",
+        maxHeight && "overflow-y-auto",
         proseClasses,
         extClasses,
         "empty:before:content-[attr(data-placeholder)] empty:before:text-zinc-400 empty:before:pointer-events-none",
@@ -8426,6 +8438,14 @@ function mergeExtensions(instanceExtensions) {
   }
   return merged;
 }
+function toHtml(value, outputFormat) {
+  if (!value) return "";
+  if (outputFormat === "html") return value;
+  const format = detectFormat(value);
+  if (format === "html") return value;
+  const result = marked.parse(value, { async: false });
+  return result.trim();
+}
 function EditorRoot({
   children,
   className,
@@ -8439,6 +8459,12 @@ function EditorRoot({
 }) {
   const contentRef = useRef(null);
   const [, setValue] = useControllableState(controlledValue, defaultValue, onChange);
+  const initialHtml = useMemo(
+    () => toHtml(controlledValue ?? defaultValue, outputFormat),
+    // Only compute once on mount — don't re-run when value changes from user input
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
   const extensions = useMemo(
     () => mergeExtensions(instanceExtensions),
     [instanceExtensions]
@@ -8497,6 +8523,7 @@ function EditorRoot({
     lineSpacing,
     placeholder,
     extensions,
+    _initialHtml: initialHtml,
     _onInput: handleInput
   };
   return /* @__PURE__ */ jsx(EditorContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(