@mhamz.01/easyflow-texteditor 0.1.90 → 0.1.91

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -7048,34 +7048,55 @@ function FontFamilyDropdown() {
7048
7048
  loadGoogleFonts();
7049
7049
  }, []);
7050
7050
  useEffect18(() => {
7051
- if (!editor) return;
7052
- const updateSelectedFont = () => {
7051
+ if (!editor || !selectedFont) return;
7052
+ const handleUpdate = () => {
7053
7053
  const currentFontFamily2 = editor.getAttributes("textStyle").fontFamily;
7054
- if (currentFontFamily2) {
7055
- setSelectedFont(currentFontFamily2);
7054
+ if (!currentFontFamily2) {
7055
+ requestAnimationFrame(() => {
7056
+ editor.commands.setFontFamily(selectedFont);
7057
+ });
7056
7058
  }
7057
7059
  };
7058
- editor.on("selectionUpdate", updateSelectedFont);
7059
- editor.on("transaction", updateSelectedFont);
7060
- return () => {
7061
- editor.off("selectionUpdate", updateSelectedFont);
7062
- editor.off("transaction", updateSelectedFont);
7063
- };
7064
- }, [editor]);
7065
- useEffect18(() => {
7066
- if (!editor || !selectedFont) return;
7067
- const handleUpdate = () => {
7068
- const { from, to } = editor.state.selection;
7060
+ const handleSelectionUpdate = () => {
7069
7061
  const currentFontFamily2 = editor.getAttributes("textStyle").fontFamily;
7070
7062
  if (!currentFontFamily2 && selectedFont) {
7071
- editor.chain().focus().setFontFamily(selectedFont).run();
7063
+ requestAnimationFrame(() => {
7064
+ editor.commands.setFontFamily(selectedFont);
7065
+ });
7066
+ }
7067
+ };
7068
+ const handleTransaction = ({ transaction }) => {
7069
+ const isBlockChange = transaction.steps.some((step) => {
7070
+ return step.slice?.content?.content?.some(
7071
+ (node) => ["heading", "bulletList", "orderedList", "blockquote", "codeBlock"].includes(node.type?.name)
7072
+ );
7073
+ });
7074
+ if (isBlockChange && selectedFont) {
7075
+ requestAnimationFrame(() => {
7076
+ editor.commands.setFontFamily(selectedFont);
7077
+ });
7072
7078
  }
7073
7079
  };
7074
7080
  editor.on("update", handleUpdate);
7081
+ editor.on("selectionUpdate", handleSelectionUpdate);
7082
+ editor.on("transaction", handleTransaction);
7075
7083
  return () => {
7076
7084
  editor.off("update", handleUpdate);
7085
+ editor.off("selectionUpdate", handleSelectionUpdate);
7086
+ editor.off("transaction", handleTransaction);
7077
7087
  };
7078
7088
  }, [editor, selectedFont]);
7089
+ useEffect18(() => {
7090
+ if (!editor || !selectedFont) return;
7091
+ const { state } = editor;
7092
+ const { schema } = state;
7093
+ const textStyleMark = schema.marks.textStyle;
7094
+ if (textStyleMark) {
7095
+ const mark = textStyleMark.create({ fontFamily: selectedFont });
7096
+ const tr = state.tr.addStoredMark(mark);
7097
+ editor.view.dispatch(tr);
7098
+ }
7099
+ }, [editor, selectedFont]);
7079
7100
  if (!editor) return null;
7080
7101
  const currentFontFamily = editor.getAttributes("textStyle").fontFamily || selectedFont;
7081
7102
  const getCurrentFontLabel = () => {
@@ -7090,17 +7111,20 @@ function FontFamilyDropdown() {
7090
7111
  if (!editor) return;
7091
7112
  setSelectedFont(family);
7092
7113
  if (editor.state.storedMarks) {
7093
- const textStyleMark = editor.schema.marks.textStyle;
7094
- if (textStyleMark) {
7095
- editor.view.dispatch(editor.state.tr.removeStoredMark(textStyleMark));
7114
+ const textStyleMark2 = editor.schema.marks.textStyle;
7115
+ if (textStyleMark2) {
7116
+ editor.view.dispatch(editor.state.tr.removeStoredMark(textStyleMark2));
7096
7117
  }
7097
7118
  }
7098
- setTimeout(() => {
7099
- const success = editor.chain().focus().setFontFamily(family).run();
7100
- if (!success) {
7101
- console.warn("Font not applied:", family);
7102
- }
7103
- }, 0);
7119
+ editor.chain().focus().setFontFamily(family).run();
7120
+ const { state } = editor;
7121
+ const { schema } = state;
7122
+ const textStyleMark = schema.marks.textStyle;
7123
+ if (textStyleMark) {
7124
+ const mark = textStyleMark.create({ fontFamily: family });
7125
+ const tr = state.tr.addStoredMark(mark);
7126
+ editor.view.dispatch(tr);
7127
+ }
7104
7128
  };
7105
7129
  const resetFont = () => {
7106
7130
  if (!editor) return;
@@ -7113,10 +7137,8 @@ function FontFamilyDropdown() {
7113
7137
  );
7114
7138
  }
7115
7139
  }
7116
- setTimeout(() => {
7117
- editor.chain().focus().unsetFontFamily().run();
7118
- setOpen(false);
7119
- }, 0);
7140
+ editor.chain().focus().unsetFontFamily().run();
7141
+ setOpen(false);
7120
7142
  };
7121
7143
  return /* @__PURE__ */ jsxs45(Popover2, { open, onOpenChange: setOpen, children: [
7122
7144
  /* @__PURE__ */ jsx76(PopoverTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs45(