@mhamz.01/easyflow-texteditor 0.1.90 → 0.1.91

package/dist/index.js

@@ -7074,34 +7074,55 @@ function FontFamilyDropdown() {
     loadGoogleFonts();
   }, []);
   (0, import_react86.useEffect)(() => {
-    if (!editor) return;
-    const updateSelectedFont = () => {
+    if (!editor || !selectedFont) return;
+    const handleUpdate = () => {
       const currentFontFamily2 = editor.getAttributes("textStyle").fontFamily;
-      if (currentFontFamily2) {
-        setSelectedFont(currentFontFamily2);
+      if (!currentFontFamily2) {
+        requestAnimationFrame(() => {
+          editor.commands.setFontFamily(selectedFont);
+        });
       }
     };
-    editor.on("selectionUpdate", updateSelectedFont);
-    editor.on("transaction", updateSelectedFont);
-    return () => {
-      editor.off("selectionUpdate", updateSelectedFont);
-      editor.off("transaction", updateSelectedFont);
-    };
-  }, [editor]);
-  (0, import_react86.useEffect)(() => {
-    if (!editor || !selectedFont) return;
-    const handleUpdate = () => {
-      const { from, to } = editor.state.selection;
+    const handleSelectionUpdate = () => {
       const currentFontFamily2 = editor.getAttributes("textStyle").fontFamily;
       if (!currentFontFamily2 && selectedFont) {
-        editor.chain().focus().setFontFamily(selectedFont).run();
+        requestAnimationFrame(() => {
+          editor.commands.setFontFamily(selectedFont);
+        });
+      }
+    };
+    const handleTransaction = ({ transaction }) => {
+      const isBlockChange = transaction.steps.some((step) => {
+        return step.slice?.content?.content?.some(
+          (node) => ["heading", "bulletList", "orderedList", "blockquote", "codeBlock"].includes(node.type?.name)
+        );
+      });
+      if (isBlockChange && selectedFont) {
+        requestAnimationFrame(() => {
+          editor.commands.setFontFamily(selectedFont);
+        });
       }
     };
     editor.on("update", handleUpdate);
+    editor.on("selectionUpdate", handleSelectionUpdate);
+    editor.on("transaction", handleTransaction);
     return () => {
       editor.off("update", handleUpdate);
+      editor.off("selectionUpdate", handleSelectionUpdate);
+      editor.off("transaction", handleTransaction);
     };
   }, [editor, selectedFont]);
+  (0, import_react86.useEffect)(() => {
+    if (!editor || !selectedFont) return;
+    const { state } = editor;
+    const { schema } = state;
+    const textStyleMark = schema.marks.textStyle;
+    if (textStyleMark) {
+      const mark = textStyleMark.create({ fontFamily: selectedFont });
+      const tr = state.tr.addStoredMark(mark);
+      editor.view.dispatch(tr);
+    }
+  }, [editor, selectedFont]);
   if (!editor) return null;
   const currentFontFamily = editor.getAttributes("textStyle").fontFamily || selectedFont;
   const getCurrentFontLabel = () => {
@@ -7116,17 +7137,20 @@ function FontFamilyDropdown() {
     if (!editor) return;
     setSelectedFont(family);
     if (editor.state.storedMarks) {
-      const textStyleMark = editor.schema.marks.textStyle;
-      if (textStyleMark) {
-        editor.view.dispatch(editor.state.tr.removeStoredMark(textStyleMark));
+      const textStyleMark2 = editor.schema.marks.textStyle;
+      if (textStyleMark2) {
+        editor.view.dispatch(editor.state.tr.removeStoredMark(textStyleMark2));
       }
     }
-    setTimeout(() => {
-      const success = editor.chain().focus().setFontFamily(family).run();
-      if (!success) {
-        console.warn("Font not applied:", family);
-      }
-    }, 0);
+    editor.chain().focus().setFontFamily(family).run();
+    const { state } = editor;
+    const { schema } = state;
+    const textStyleMark = schema.marks.textStyle;
+    if (textStyleMark) {
+      const mark = textStyleMark.create({ fontFamily: family });
+      const tr = state.tr.addStoredMark(mark);
+      editor.view.dispatch(tr);
+    }
   };
   const resetFont = () => {
     if (!editor) return;
@@ -7139,10 +7163,8 @@ function FontFamilyDropdown() {
         );
       }
     }
-    setTimeout(() => {
-      editor.chain().focus().unsetFontFamily().run();
-      setOpen(false);
-    }, 0);
+    editor.chain().focus().unsetFontFamily().run();
+    setOpen(false);
   };
   return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(Popover2, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(