ct-rich-text-editor 1.3.19 → 1.3.20

package/dist/{index-23abcbd9.js → index-c4b49ec3.js}

@@ -24,7 +24,7 @@ import { TablePlugin } from "@lexical/react/LexicalTablePlugin";
 import { TableNode, TableCellNode, TableRowNode, $createTableNodeWithDimensions, $isTableRowNode, $isTableCellNode, TableCellHeaderStates, $isTableNode, $isTableSelection, $getTableCellNodeFromLexicalNode, $getTableNodeFromLexicalNodeOrThrow, getTableElement, getTableObserverFromTableElement, $getTableRowIndexFromTableCellNode, $getNodeTriplet, $insertTableRow__EXPERIMENTAL, $getTableColumnIndexFromTableCellNode, $insertTableColumn__EXPERIMENTAL, $deleteTableRow__EXPERIMENTAL, $deleteTableColumn__EXPERIMENTAL, $unmergeCell, $computeTableMapSkipCellCheck, getDOMCellFromTarget, $getTableAndElementByKey } from "@lexical/table";
 import { mergeRegister, $wrapNodeInElement, $findMatchingParent, $getNearestNodeOfType, $getNearestBlockElementAncestorOrThrow, $insertNodeToNearestRoot, $isEditorIsNestedEditor, mediaFileReader, isMimeType, calculateZoomLevel, CAN_USE_DOM } from "@lexical/utils";
 import Stack from "@mui/material/Stack";
-import { createCommand, DecoratorNode, createEditor, $applyNodeReplacement, $insertNodes, $isRootOrShadowRoot, $createParagraphNode, COMMAND_PRIORITY_EDITOR, COMMAND_PRIORITY_LOW, $getSelection, $isRangeSelection, $getNearestNodeFromDOMNode, $setSelection, isHTMLElement as isHTMLElement$1, TextNode, $getRoot, $createTextNode, $getNodeByKey, $isParagraphNode, $isTextNode, FORMAT_TEXT_COMMAND, FORMAT_ELEMENT_COMMAND, CAN_UNDO_COMMAND, CAN_REDO_COMMAND, $isElementNode, SELECTION_CHANGE_COMMAND, COMMAND_PRIORITY_CRITICAL, UNDO_COMMAND, REDO_COMMAND, $createRangeSelection, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_ESCAPE_COMMAND, KEY_TAB_COMMAND, KEY_ENTER_COMMAND, $createNodeSelection, $isNodeSelection, getDOMSelection, CLICK_COMMAND, COMMAND_PRIORITY_HIGH, $isLineBreakNode, PASTE_COMMAND, ParagraphNode, $createLineBreakNode, isDOMNode } from "lexical";
+import { createCommand, DecoratorNode, createEditor, $applyNodeReplacement, $insertNodes, $isRootOrShadowRoot, $createParagraphNode, COMMAND_PRIORITY_EDITOR, COMMAND_PRIORITY_LOW, $getSelection, $isRangeSelection, $getNearestNodeFromDOMNode, $setSelection, isHTMLElement as isHTMLElement$1, TextNode, $getRoot, $createTextNode, $getNodeByKey, $isParagraphNode, $isTextNode, FORMAT_TEXT_COMMAND, FORMAT_ELEMENT_COMMAND, KEY_DOWN_COMMAND, COMMAND_PRIORITY_CRITICAL, CAN_UNDO_COMMAND, CAN_REDO_COMMAND, $isElementNode, SELECTION_CHANGE_COMMAND, UNDO_COMMAND, REDO_COMMAND, $createRangeSelection, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_ESCAPE_COMMAND, KEY_TAB_COMMAND, KEY_ENTER_COMMAND, $createNodeSelection, $isNodeSelection, getDOMSelection, CLICK_COMMAND, COMMAND_PRIORITY_HIGH, $isLineBreakNode, PASTE_COMMAND, ParagraphNode, $createLineBreakNode, isDOMNode } from "lexical";
 import * as ReactDOM from "react-dom";
 import ReactDOM__default, { createPortal } from "react-dom";
 import { $isCodeNode, CodeNode, normalizeCodeLang, getLanguageFriendlyName, CodeHighlightNode, CODE_LANGUAGE_MAP, $createCodeNode, registerCodeHighlighting, $isCodeHighlightNode } from "@lexical/code";
@@ -40,15 +40,7 @@ import InsertDriveFileIcon from "@mui/icons-material/InsertDriveFile";
 import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
 import { $isDecoratorBlockNode } from "@lexical/react/LexicalDecoratorBlockNode";
 import EmojiPicker from "emoji-picker-react";
-import CodeIcon$1 from "@mui/icons-material/Code";
-import ContentCopyIcon from "@mui/icons-material/ContentCopy";
-import CropOriginalIcon from "@mui/icons-material/CropOriginal";
-import DeleteIcon from "@mui/icons-material/Delete";
-import FormatAlignCenterIcon from "@mui/icons-material/FormatAlignCenter";
-import FormatAlignLeftIcon from "@mui/icons-material/FormatAlignLeft";
-import FormatAlignRightIcon from "@mui/icons-material/FormatAlignRight";
-import LinkIcon$1 from "@mui/icons-material/Link";
-import OpenInNewIcon from "@mui/icons-material/OpenInNew";
+import { Link as Link$1, CropOriginal, Code as Code$1, FormatAlignLeft, FormatAlignCenter, FormatAlignRight, OpenInNew, Delete, ContentCopy } from "@mui/icons-material";
 import { LinkPlugin as LinkPlugin$1 } from "@lexical/react/LexicalLinkPlugin";
 import { useBasicTypeaheadTriggerMatch, LexicalTypeaheadMenuPlugin, MenuOption } from "@lexical/react/LexicalTypeaheadMenuPlugin";
 import { useLexicalEditable } from "@lexical/react/useLexicalEditable";
@@ -1479,7 +1471,7 @@ const AiTextTransform = async ({ content, apiKey }) => {
 const AI_ACTION_COMMAND = createCommand(
   "AI_ACTION_COMMAND"
 );
-const ImageView = React__default.lazy(() => import("./index-913b3634.js"));
+const ImageView = React__default.lazy(() => import("./index-d1931d92.js"));
 function isGoogleDocCheckboxImg(img) {
   return img.parentElement != null && img.parentElement.tagName === "LI" && img.previousSibling === null && img.getAttribute("aria-roledescription") === "checkbox";
 }
@@ -15345,7 +15337,7 @@ const EmbedComponent = ({ url, displayType, alignment, nodeKey }) => {
     }
   );
 };
-const FileComponent = React$1.lazy(() => import("./index-afa4eda8.js"));
+const FileComponent = React$1.lazy(() => import("./index-9505418d.js"));
 function convertFileElement(domNode) {
   if (domNode instanceof HTMLDivElement) {
     const dataUrl = domNode.getAttribute("data-lexical-file-src");
@@ -20368,10 +20360,10 @@ const PDF_CONFIG = {
 };
 const loadHtml2Pdf = async () => {
   try {
-    const mod = await import("./html2pdf.bundle.min-f1b4a78e.js").then((n) => n.h);
+    const mod = await import("./html2pdf.bundle.min-d830ece3.js").then((n) => n.h);
     return (mod == null ? void 0 : mod.default) || mod;
   } catch {
-    const mod2 = await import("./html2pdf.bundle-a30dde70.js").then((n) => n.h);
+    const mod2 = await import("./html2pdf.bundle-dea9d834.js").then((n) => n.h);
     return (mod2 == null ? void 0 : mod2.default) || mod2;
   }
 };
@@ -23614,6 +23606,8 @@ const FontFamilyMenu = ({
 }) => {
   const [selectedFont, setSelectedFont] = useState$1("Arial");
   const [detectedFonts, setDetectedFonts] = useState$1(/* @__PURE__ */ new Set());
+  const pendingFontRef = React__default.useRef(null);
+  const userJustSetFontRef = React__default.useRef(false);
   const allFonts = useMemo(() => {
     const fontSet = new Set(fonts);
     detectedFonts.forEach((font) => fontSet.add(font));
@@ -23630,22 +23624,73 @@ const FontFamilyMenu = ({
             "Arial"
           );
           const cleanedFont = fontFamily.replace(/^["']|["']$/g, "").trim();
-          setSelectedFont(cleanedFont);
-          if (cleanedFont && cleanedFont !== "Arial" && !fonts.includes(cleanedFont)) {
-            setDetectedFonts((prev) => {
-              if (prev.has(cleanedFont))
-                return prev;
-              const newSet = new Set(prev);
-              newSet.add(cleanedFont);
-              return newSet;
-            });
+          if (userJustSetFontRef.current) {
+            userJustSetFontRef.current = false;
+            return;
+          }
+          if (!selection.isCollapsed() && pendingFontRef.current !== null) {
+            pendingFontRef.current = null;
+          }
+          if (pendingFontRef.current !== null && cleanedFont !== pendingFontRef.current && cleanedFont !== "Arial") {
+            pendingFontRef.current = null;
+          }
+          if (pendingFontRef.current === null) {
+            setSelectedFont(cleanedFont);
+            if (cleanedFont && cleanedFont !== "Arial" && !fonts.includes(cleanedFont)) {
+              setDetectedFonts((prev) => {
+                if (prev.has(cleanedFont))
+                  return prev;
+                const newSet = new Set(prev);
+                newSet.add(cleanedFont);
+                return newSet;
+              });
+            }
           }
         }
       });
     });
   }, [activeEditor, fonts]);
+  useEffect$1(() => {
+    return activeEditor.registerCommand(
+      KEY_DOWN_COMMAND,
+      (event) => {
+        if (pendingFontRef.current !== null && event.key.length === 1 && !event.ctrlKey && !event.metaKey) {
+          const pendingFont = pendingFontRef.current;
+          const selection = $getSelection();
+          if ($isRangeSelection(selection) && selection.isCollapsed()) {
+            $patchStyleText(selection, { "font-family": pendingFont });
+          }
+        }
+        return false;
+      },
+      COMMAND_PRIORITY_CRITICAL
+    );
+  }, [activeEditor]);
+  useEffect$1(() => {
+    const rootElement = activeEditor.getRootElement();
+    if (!rootElement)
+      return;
+    const handleFocus = () => {
+      if (pendingFontRef.current !== null) {
+        const pendingFont = pendingFontRef.current;
+        activeEditor.update(() => {
+          const selection = $getSelection();
+          if ($isRangeSelection(selection) && selection.isCollapsed()) {
+            userJustSetFontRef.current = true;
+            $patchStyleText(selection, { "font-family": pendingFont });
+          }
+        });
+      }
+    };
+    rootElement.addEventListener("focus", handleFocus);
+    return () => {
+      rootElement.removeEventListener("focus", handleFocus);
+    };
+  }, [activeEditor]);
   const applyFontFamily = useCallback(
     (fontFamily) => {
+      pendingFontRef.current = fontFamily;
+      userJustSetFontRef.current = true;
       activeEditor.update(() => {
         const selection = $getSelection();
         if ($isRangeSelection(selection)) {
@@ -23659,10 +23704,20 @@ const FontFamilyMenu = ({
     setSelectedFont(value);
     applyFontFamily(value);
   };
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Select, { value: selectedFont, onValueChange: handleFontChange, children: [
-    /* @__PURE__ */ jsx(SelectTrigger, { className: "!cteditor-h-7 md:!cteditor-bg-secondary !cteditor-bg-foreground/5 cteditor-text-foreground md:!cteditor-w-[120px] cteditor-text-xs max-md:cteditor-w-full", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select font" }) }),
-    /* @__PURE__ */ jsx(SelectContent, { children: allFonts.map((font) => /* @__PURE__ */ jsx(SelectItem, { value: font, style: { fontFamily: font }, children: font }, font)) })
-  ] }) });
+  const handleMouseDown = (e) => {
+    e.preventDefault();
+  };
+  return /* @__PURE__ */ jsxs(Select, { value: selectedFont, onValueChange: handleFontChange, children: [
+    /* @__PURE__ */ jsx(
+      SelectTrigger,
+      {
+        className: "!cteditor-h-7 md:!cteditor-bg-secondary !cteditor-bg-foreground/5 cteditor-text-foreground md:!cteditor-w-[120px] cteditor-text-xs max-md:cteditor-w-full",
+        onMouseDown: handleMouseDown,
+        children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select font" })
+      }
+    ),
+    /* @__PURE__ */ jsx(SelectContent, { onMouseDown: handleMouseDown, children: allFonts.map((font) => /* @__PURE__ */ jsx(SelectItem, { value: font, style: { fontFamily: font }, onMouseDown: handleMouseDown, children: font }, font)) })
+  ] });
 };
 const MIN_FONT_SIZE = 8;
 const MAX_FONT_SIZE = 72;
@@ -23673,6 +23728,7 @@ const FontSizeControl = () => {
   const [fontSize, setFontSize] = useState$1(DEFAULT_FONT_SIZE);
   const [inputValue, setInputValue] = useState$1(DEFAULT_FONT_SIZE.toString());
   const pendingFontSizeRef = React__default.useRef(null);
+  const userJustSetSizeRef = React__default.useRef(false);
   useEffect$1(() => {
     return editor.registerUpdateListener(({ editorState }) => {
       editorState.read(() => {
@@ -23684,7 +23740,14 @@ const FontSizeControl = () => {
             `${DEFAULT_FONT_SIZE}px`
           );
           const size2 = parseInt(fontSizeStr, 10) || DEFAULT_FONT_SIZE;
-          if (pendingFontSizeRef.current !== null && size2 === pendingFontSizeRef.current) {
+          if (userJustSetSizeRef.current) {
+            userJustSetSizeRef.current = false;
+            return;
+          }
+          if (!selection.isCollapsed() && pendingFontSizeRef.current !== null) {
+            pendingFontSizeRef.current = null;
+          }
+          if (pendingFontSizeRef.current !== null && size2 !== pendingFontSizeRef.current && size2 !== DEFAULT_FONT_SIZE) {
             pendingFontSizeRef.current = null;
           }
           if (pendingFontSizeRef.current === null) {
@@ -23695,6 +23758,22 @@ const FontSizeControl = () => {
       });
     });
   }, [editor]);
+  useEffect$1(() => {
+    return editor.registerCommand(
+      KEY_DOWN_COMMAND,
+      (event) => {
+        if (pendingFontSizeRef.current !== null && event.key.length === 1 && !event.ctrlKey && !event.metaKey) {
+          const pendingSize = pendingFontSizeRef.current;
+          const selection = $getSelection();
+          if ($isRangeSelection(selection) && selection.isCollapsed()) {
+            $patchStyleText(selection, { "font-size": `${pendingSize}px` });
+          }
+        }
+        return false;
+      },
+      COMMAND_PRIORITY_CRITICAL
+    );
+  }, [editor]);
   useEffect$1(() => {
     const rootElement = editor.getRootElement();
     if (!rootElement)
@@ -23704,7 +23783,8 @@ const FontSizeControl = () => {
         const pendingSize = pendingFontSizeRef.current;
         editor.update(() => {
           const selection = $getSelection();
-          if ($isRangeSelection(selection)) {
+          if ($isRangeSelection(selection) && selection.isCollapsed()) {
+            userJustSetSizeRef.current = true;
             $patchStyleText(selection, { "font-size": `${pendingSize}px` });
           }
         });
@@ -23718,6 +23798,7 @@ const FontSizeControl = () => {
   const applyFontSize = useCallback(
     (size2) => {
       pendingFontSizeRef.current = size2;
+      userJustSetSizeRef.current = true;
       editor.update(() => {
         const selection = $getSelection();
         if ($isRangeSelection(selection)) {
@@ -23763,6 +23844,9 @@ const FontSizeControl = () => {
     setInputValue(newSize.toString());
     applyFontSize(newSize);
   };
+  const handleMouseDown = (e) => {
+    e.preventDefault();
+  };
   return /* @__PURE__ */ jsxs("div", { className: "cteditor-flex cteditor-items-center cteditor-gap-1", children: [
     /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
       /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
@@ -23771,6 +23855,7 @@ const FontSizeControl = () => {
           variant: "ghost",
           size: "icon-sm",
           onClick: decreaseFontSize,
+          onMouseDown: handleMouseDown,
           className: "cteditor-text-foreground/50",
           children: /* @__PURE__ */ jsx(Minus, { className: "!cteditor-size-[18px]" })
         }
@@ -23794,6 +23879,7 @@ const FontSizeControl = () => {
           variant: "ghost",
           size: "icon-sm",
           onClick: increaseFontSize,
+          onMouseDown: handleMouseDown,
           className: "cteditor-text-foreground/50",
           children: /* @__PURE__ */ jsx(Plus, { className: "!cteditor-size-[18px]" })
         }
@@ -29172,7 +29258,7 @@ function FloatingEmbedMenu({
                 handleDisplayTypeChange("url");
               },
               title: "URL",
-              children: /* @__PURE__ */ jsx(LinkIcon$1, { fontSize: "small" })
+              children: /* @__PURE__ */ jsx(Link$1, { fontSize: "small" })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -29184,7 +29270,7 @@ function FloatingEmbedMenu({
                 handleDisplayTypeChange("card");
               },
               title: "Card",
-              children: /* @__PURE__ */ jsx(CropOriginalIcon, { fontSize: "small" })
+              children: /* @__PURE__ */ jsx(CropOriginal, { fontSize: "small" })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -29196,7 +29282,7 @@ function FloatingEmbedMenu({
                 handleDisplayTypeChange("embed");
               },
               title: "Embedded",
-              children: /* @__PURE__ */ jsx(CodeIcon$1, { fontSize: "small" })
+              children: /* @__PURE__ */ jsx(Code$1, { fontSize: "small" })
             }
           )
         ] }) }),
@@ -29211,7 +29297,7 @@ function FloatingEmbedMenu({
                 handleAlignmentChange("left");
               },
               title: "Left",
-              children: /* @__PURE__ */ jsx(FormatAlignLeftIcon, { fontSize: "small" })
+              children: /* @__PURE__ */ jsx(FormatAlignLeft, { fontSize: "small" })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -29223,7 +29309,7 @@ function FloatingEmbedMenu({
                 handleAlignmentChange("center");
               },
               title: "Center",
-              children: /* @__PURE__ */ jsx(FormatAlignCenterIcon, { fontSize: "small" })
+              children: /* @__PURE__ */ jsx(FormatAlignCenter, { fontSize: "small" })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -29235,7 +29321,7 @@ function FloatingEmbedMenu({
                 handleAlignmentChange("right");
               },
               title: "Right",
-              children: /* @__PURE__ */ jsx(FormatAlignRightIcon, { fontSize: "small" })
+              children: /* @__PURE__ */ jsx(FormatAlignRight, { fontSize: "small" })
             }
           )
         ] }) }),
@@ -29247,7 +29333,7 @@ function FloatingEmbedMenu({
               className: "embed-menu-button",
               onClick: handleOpenInNewTab,
               title: "Open in new tab",
-              children: /* @__PURE__ */ jsx(OpenInNewIcon, { fontSize: "small" })
+              children: /* @__PURE__ */ jsx(OpenInNew, { fontSize: "small" })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -29256,7 +29342,7 @@ function FloatingEmbedMenu({
               className: "embed-menu-button",
               onClick: handleRemoveEmbed,
               title: "Remove",
-              children: /* @__PURE__ */ jsx(DeleteIcon, { fontSize: "small" })
+              children: /* @__PURE__ */ jsx(Delete, { fontSize: "small" })
             }
           ),
           /* @__PURE__ */ jsx(
@@ -29265,7 +29351,7 @@ function FloatingEmbedMenu({
               className: "embed-menu-button",
               onClick: handleCopyUrl,
               title: "Copy",
-              children: /* @__PURE__ */ jsx(ContentCopyIcon, { fontSize: "small" })
+              children: /* @__PURE__ */ jsx(ContentCopy, { fontSize: "small" })
             }
           )
         ] }) })
@@ -31684,6 +31770,94 @@ const IS_CODE = 16;
 const IS_SUBSCRIPT = 32;
 const IS_SUPERSCRIPT = 64;
 const IS_HIGHLIGHT = 128;
+function parseColor(color) {
+  if (!color)
+    return null;
+  color = color.trim().toLowerCase();
+  if (color.startsWith("#")) {
+    let hex = color.slice(1);
+    if (hex.length === 3) {
+      hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
+    }
+    if (hex.length === 6) {
+      return {
+        r: parseInt(hex.slice(0, 2), 16),
+        g: parseInt(hex.slice(2, 4), 16),
+        b: parseInt(hex.slice(4, 6), 16)
+      };
+    }
+  }
+  const rgbMatch = color.match(/rgba?\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/);
+  if (rgbMatch) {
+    return {
+      r: parseInt(rgbMatch[1]),
+      g: parseInt(rgbMatch[2]),
+      b: parseInt(rgbMatch[3])
+    };
+  }
+  const namedColors = {
+    white: { r: 255, g: 255, b: 255 },
+    black: { r: 0, g: 0, b: 0 },
+    red: { r: 255, g: 0, b: 0 },
+    green: { r: 0, g: 128, b: 0 },
+    blue: { r: 0, g: 0, b: 255 },
+    yellow: { r: 255, g: 255, b: 0 },
+    transparent: { r: 0, g: 0, b: 0 }
+    // Will be handled separately
+  };
+  return namedColors[color] || null;
+}
+function getLuminance(r2, g2, b2) {
+  const sR = r2 / 255;
+  const sG = g2 / 255;
+  const sB = b2 / 255;
+  const R = sR <= 0.03928 ? sR / 12.92 : Math.pow((sR + 0.055) / 1.055, 2.4);
+  const G = sG <= 0.03928 ? sG / 12.92 : Math.pow((sG + 0.055) / 1.055, 2.4);
+  const B = sB <= 0.03928 ? sB / 12.92 : Math.pow((sB + 0.055) / 1.055, 2.4);
+  return 0.2126 * R + 0.7152 * G + 0.0722 * B;
+}
+function isLightColor(color) {
+  const parsed = parseColor(color);
+  if (!parsed)
+    return null;
+  return getLuminance(parsed.r, parsed.g, parsed.b) > 0.5;
+}
+function getEditorBackgroundColor(editor) {
+  const rootElement = editor.getRootElement();
+  if (!rootElement)
+    return null;
+  try {
+    const computedStyle = window.getComputedStyle(rootElement);
+    const bgColor = computedStyle.backgroundColor;
+    if (bgColor === "transparent" || bgColor === "rgba(0, 0, 0, 0)") {
+      let parent = rootElement.parentElement;
+      while (parent) {
+        const parentBg = window.getComputedStyle(parent).backgroundColor;
+        if (parentBg && parentBg !== "transparent" && parentBg !== "rgba(0, 0, 0, 0)") {
+          return parentBg;
+        }
+        parent = parent.parentElement;
+      }
+      return "rgb(255, 255, 255)";
+    }
+    return bgColor;
+  } catch {
+    return null;
+  }
+}
+function isEditorDarkMode(editor) {
+  const bgColor = getEditorBackgroundColor(editor);
+  if (!bgColor)
+    return false;
+  const isLight = isLightColor(bgColor);
+  return isLight === false;
+}
+function adjustColorsForTheme(styleInfo) {
+  const adjusted = { ...styleInfo };
+  adjusted.backgroundColor = "";
+  adjusted.color = "";
+  return adjusted;
+}
 function detectCKEditorSource(html) {
   return html.includes('class="image"') || // CKEditor's figure class for images
   html.includes('class="image ') || html.includes("image-style-") || // CKEditor's image alignment classes
@@ -31875,7 +32049,8 @@ function buildStyleString(info) {
 }
 function createStyledTextNode(text, parentElement) {
   const textNode = $createTextNode(text);
-  const styleInfo = getStyleInfoFromElement(parentElement);
+  let styleInfo = getStyleInfoFromElement(parentElement);
+  styleInfo = adjustColorsForTheme(styleInfo);
   if (styleInfo.format) {
     textNode.setFormat(styleInfo.format);
   }
@@ -32149,7 +32324,8 @@ function processChildrenWithStyle(element, parentNode, defaultStyles) {
         if (hasNonWhitespace || isSignificantWhitespace) {
           const normalizedText = text.replace(/\s+/g, " ");
           const textNode = $createTextNode(normalizedText);
-          const styleInfo = getStyleInfoFromElement(element);
+          let styleInfo = getStyleInfoFromElement(element);
+          styleInfo = adjustColorsForTheme(styleInfo);
           if (styleInfo.format) {
             textNode.setFormat(styleInfo.format);
           }
@@ -32263,6 +32439,11 @@ function convertHTMLToNodesWithStyles(html, editor) {
   currentPasteContext = {
     isCKEditor
   };
+  const editorBgColor = getEditorBackgroundColor(editor);
+  ({
+    editorIsDark: isEditorDarkMode(editor),
+    editorBgColor
+  });
   const { container, cleanup } = createStyledDocument(html);
   try {
     const customNodes = processNode(container, null);
@@ -36479,10 +36660,38 @@ const WordCountPlugin = () => {
     }
   );
 };
+function getEditorColors(rootElement) {
+  try {
+    const computedStyle = window.getComputedStyle(rootElement);
+    let bgColor = computedStyle.backgroundColor;
+    let textColor = computedStyle.color;
+    if (bgColor === "transparent" || bgColor === "rgba(0, 0, 0, 0)") {
+      let parent = rootElement.parentElement;
+      while (parent) {
+        const parentBg = window.getComputedStyle(parent).backgroundColor;
+        if (parentBg && parentBg !== "transparent" && parentBg !== "rgba(0, 0, 0, 0)") {
+          bgColor = parentBg;
+          break;
+        }
+        parent = parent.parentElement;
+      }
+      if (bgColor === "transparent" || bgColor === "rgba(0, 0, 0, 0)") {
+        bgColor = "rgb(255, 255, 255)";
+      }
+    }
+    if (!textColor || textColor === "rgba(0, 0, 0, 0)") {
+      textColor = "rgb(0, 0, 0)";
+    }
+    return { bgColor, textColor };
+  } catch {
+    return { bgColor: "rgb(255, 255, 255)", textColor: "rgb(0, 0, 0)" };
+  }
+}
 function exportEditorWithInlineStyle(editor) {
   const rootElement = editor.getRootElement();
   if (!rootElement)
     return "";
+  const { bgColor, textColor } = getEditorColors(rootElement);
   const tableStyleMap = /* @__PURE__ */ new Map();
   const liveTables = rootElement.querySelectorAll("table");
   liveTables.forEach((table, index2) => {
@@ -36493,9 +36702,9 @@ function exportEditorWithInlineStyle(editor) {
     const headerBgColors = [];
     headerCells.forEach((th) => {
       const computed = window.getComputedStyle(th);
-      const bgColor = computed.backgroundColor;
-      if (bgColor && bgColor !== "rgba(0, 0, 0, 0)") {
-        headerBgColors.push(bgColor);
+      const bgColor2 = computed.backgroundColor;
+      if (bgColor2 && bgColor2 !== "rgba(0, 0, 0, 0)") {
+        headerBgColors.push(bgColor2);
       } else {
         headerBgColors.push("");
       }
@@ -36530,7 +36739,7 @@ function exportEditorWithInlineStyle(editor) {
   editor.getEditorState().read(() => {
     htmlString = $generateHtmlFromNodes(editor, null);
   });
-  return processHtmlForExport(htmlString, tableStyleMap);
+  return processHtmlForExport(htmlString, tableStyleMap, bgColor, textColor);
 }
 function normalizeColorForComparison(color) {
   if (!color)
@@ -36580,7 +36789,7 @@ function detectTableColorsFromVariables(table) {
   }
   return null;
 }
-function processHtmlForExport(html, tableStyleMap) {
+function processHtmlForExport(html, tableStyleMap, bgColor, textColor) {
   const parser = new DOMParser();
   const doc = parser.parseFromString(html, "text/html");
   const tables = doc.querySelectorAll("table");
@@ -36590,14 +36799,14 @@ function processHtmlForExport(html, tableStyleMap) {
       return;
     const headerCells = table.querySelectorAll("th");
     headerCells.forEach((th, cellIndex) => {
-      const bgColor = styleInfo.headerBgColors[cellIndex];
-      if (bgColor) {
+      const bgColor2 = styleInfo.headerBgColors[cellIndex];
+      if (bgColor2) {
         const el = th;
-        el.style.setProperty("background-color", bgColor, "important");
-        const textColor = getContrastColor(bgColor);
-        el.style.color = textColor;
+        el.style.setProperty("background-color", bgColor2, "important");
+        const textColor2 = getContrastColor(bgColor2);
+        el.style.color = textColor2;
         el.querySelectorAll("*").forEach((nested) => {
-          nested.style.color = textColor;
+          nested.style.color = textColor2;
         });
       }
     });
@@ -36612,18 +36821,18 @@ function processHtmlForExport(html, tableStyleMap) {
         const el = cell;
         const explicitColor = styleInfo.explicitCellColors.get(`${rowIndex}-${cellIndex}`);
         if (explicitColor) {
-          const textColor = getContrastColor(explicitColor);
+          const textColor2 = getContrastColor(explicitColor);
           el.style.setProperty("background-color", explicitColor, "important");
-          el.style.color = textColor;
+          el.style.color = textColor2;
           el.querySelectorAll("*").forEach((nested) => {
-            nested.style.color = textColor;
+            nested.style.color = textColor2;
           });
         } else if (stripingColor) {
-          const textColor = getContrastColor(stripingColor);
+          const textColor2 = getContrastColor(stripingColor);
           el.style.setProperty("background-color", stripingColor, "important");
-          el.style.color = textColor;
+          el.style.color = textColor2;
           el.querySelectorAll("*").forEach((nested) => {
-            nested.style.color = textColor;
+            nested.style.color = textColor2;
           });
         }
       });
@@ -36632,7 +36841,15 @@ function processHtmlForExport(html, tableStyleMap) {
   cleanupHeaderCellStructure(doc.body);
   applyGenericSafeStyles(doc.body);
   cleanupClasses(doc.body);
-  return doc.body.innerHTML;
+  const wrapper = doc.createElement("div");
+  wrapper.style.backgroundColor = bgColor;
+  wrapper.style.color = textColor;
+  wrapper.style.padding = "1em";
+  wrapper.style.minHeight = "100%";
+  while (doc.body.firstChild) {
+    wrapper.appendChild(doc.body.firstChild);
+  }
+  return wrapper.outerHTML;
 }
 function cleanupHeaderCellStructure(container) {
   const allHeaderCells = container.querySelectorAll("th");
@@ -36660,6 +36877,19 @@ function applyGenericSafeStyles(container) {
       el.style.cssText += "; " + styles;
     });
   };
+  const addStyleIfNotSetOnElementOrChildren = (selector, property, value) => {
+    container.querySelectorAll(selector).forEach((el) => {
+      const currentValue = el.style.getPropertyValue(property);
+      if (currentValue && currentValue !== "initial" && currentValue !== "inherit") {
+        return;
+      }
+      const childrenWithProperty = el.querySelectorAll(`[style*="${property}"]`);
+      if (childrenWithProperty.length > 0) {
+        return;
+      }
+      el.style.setProperty(property, value);
+    });
+  };
   const addStyleIfNotSet = (selector, property, value) => {
     container.querySelectorAll(selector).forEach((el) => {
       const currentValue = el.style.getPropertyValue(property);
@@ -36669,10 +36899,11 @@ function applyGenericSafeStyles(container) {
     });
   };
   const defaultFontFamily = "Arial, sans-serif";
-  const selectors = "table, p, span, li, td, th, div, h1, h2, h3, h4, h5, h6";
-  addStyle(selectors, "line-height: 1.5;");
-  addStyleIfNotSet(selectors, "font-family", defaultFontFamily);
-  addStyleIfNotSet("table, p, span, li, td, th, div", "font-size", "16px");
+  const blockSelectors = "table, p, li, td, th, div, h1, h2, h3, h4, h5, h6";
+  const allSelectors = "table, p, span, li, td, th, div, h1, h2, h3, h4, h5, h6";
+  addStyle(allSelectors, "line-height: 1.5;");
+  addStyleIfNotSetOnElementOrChildren(blockSelectors, "font-family", defaultFontFamily);
+  addStyleIfNotSet("table, p, li, td, th, div", "font-size", "16px");
   addStyle("p", "margin: 0 0 1em 0;");
   addStyle("th p, td p", "margin: 0; padding: 0;");
   addStyle(
@@ -36911,7 +37142,24 @@ function preprocessInitialContent(html) {
     return html;
   }
   const parser = new DOMParser();
-  const doc = parser.parseFromString(html, "text/html");
+  let doc = parser.parseFromString(html, "text/html");
+  let body = doc.body;
+  if (body.children.length === 1) {
+    const firstChild = body.children[0];
+    if (firstChild.tagName === "DIV" && firstChild.style.backgroundColor && firstChild.style.color && firstChild.style.padding) {
+      const innerHtml = firstChild.innerHTML;
+      doc = parser.parseFromString(innerHtml, "text/html");
+      body = doc.body;
+    }
+  }
+  const emptyParagraphs = body.querySelectorAll("p");
+  emptyParagraphs.forEach((p2) => {
+    var _a, _b;
+    const hasOnlyBrOrWhitespace = !((_a = p2.textContent) == null ? void 0 : _a.trim()) && (p2.innerHTML.trim() === "" || p2.innerHTML.trim() === "<br>" || p2.querySelector("br") !== null && !((_b = p2.textContent) == null ? void 0 : _b.trim()));
+    if (hasOnlyBrOrWhitespace) {
+      p2.remove();
+    }
+  });
   const tables = doc.querySelectorAll("table");
   tables.forEach((table) => {
     const styles = detectTableStylesFromInline(table);
@@ -37128,6 +37376,172 @@ const OnChangeWrapper = ({
   };
   return /* @__PURE__ */ jsx(OnChangePlugin, { onChange: handleChange });
 };
+function getStyleFromElement(element) {
+  const styles = [];
+  const style = element.style;
+  if (style.fontFamily) {
+    const fontFamily = style.fontFamily.replace(/["']/g, "").trim();
+    if (fontFamily) {
+      styles.push(`font-family: ${fontFamily}`);
+    }
+  }
+  if (style.fontSize) {
+    styles.push(`font-size: ${style.fontSize}`);
+  }
+  if (style.lineHeight) {
+    styles.push(`line-height: ${style.lineHeight}`);
+  }
+  if (style.color && style.color !== "rgb(0, 0, 0)") {
+    styles.push(`color: ${style.color}`);
+  }
+  if (style.backgroundColor && style.backgroundColor !== "rgba(0, 0, 0, 0)" && style.backgroundColor !== "transparent") {
+    styles.push(`background-color: ${style.backgroundColor}`);
+  }
+  if (style.letterSpacing && style.letterSpacing !== "normal") {
+    styles.push(`letter-spacing: ${style.letterSpacing}`);
+  }
+  if (style.wordSpacing && style.wordSpacing !== "normal") {
+    styles.push(`word-spacing: ${style.wordSpacing}`);
+  }
+  return styles.join("; ");
+}
+function collectTextSegmentsFromElement(element) {
+  const segments = [];
+  function traverse(node, inheritedStyle) {
+    if (node.nodeType === Node.TEXT_NODE) {
+      const text = node.textContent || "";
+      if (text) {
+        segments.push({ text, style: inheritedStyle });
+      }
+    } else if (node.nodeType === Node.ELEMENT_NODE) {
+      const el = node;
+      const tagName = el.tagName.toLowerCase();
+      if (["br", "img", "hr"].includes(tagName)) {
+        return;
+      }
+      const elementStyle = getStyleFromElement(el);
+      const currentStyle = elementStyle || inheritedStyle;
+      const children = el.childNodes;
+      for (let i2 = 0; i2 < children.length; i2++) {
+        traverse(children[i2], currentStyle);
+      }
+    }
+  }
+  traverse(element, "");
+  return segments;
+}
+function splitAndStyleTextNode(textNode, segments) {
+  if (!$isTextNode(textNode) || segments.length === 0) {
+    return;
+  }
+  const nodeText = textNode.getTextContent();
+  const format = textNode.getFormat();
+  const styledSegments = segments.filter((s2) => s2.style);
+  if (styledSegments.length <= 1) {
+    const styledSegment = styledSegments[0];
+    if (styledSegment) {
+      textNode.setStyle(styledSegment.style);
+    }
+    return;
+  }
+  const splitPoints = [];
+  let runningOffset = 0;
+  for (const segment of segments) {
+    const segmentLength = segment.text.length;
+    if (segment.style) {
+      splitPoints.push({
+        offset: runningOffset,
+        style: segment.style
+      });
+    }
+    runningOffset += segmentLength;
+  }
+  if (splitPoints.length === 0) {
+    return;
+  }
+  const offsetsToSplit = [];
+  runningOffset = 0;
+  for (let i2 = 0; i2 < segments.length - 1; i2++) {
+    runningOffset += segments[i2].text.length;
+    if (runningOffset > 0 && runningOffset < nodeText.length) {
+      offsetsToSplit.push(runningOffset);
+    }
+  }
+  if (offsetsToSplit.length === 0) {
+    if (splitPoints[0]) {
+      textNode.setStyle(splitPoints[0].style);
+    }
+    return;
+  }
+  try {
+    const splitNodes = textNode.splitText(...offsetsToSplit);
+    let segmentIndex = 0;
+    for (const splitNode of splitNodes) {
+      if ($isTextNode(splitNode) && segmentIndex < segments.length) {
+        const segment = segments[segmentIndex];
+        if (segment.style) {
+          splitNode.setStyle(segment.style);
+        }
+        splitNode.setFormat(format);
+        segmentIndex++;
+      }
+    }
+  } catch {
+    if (splitPoints[0]) {
+      textNode.setStyle(splitPoints[0].style);
+    }
+  }
+}
+const BLOCK_SELECTORS = "p, h1, h2, h3, h4, h5, h6, li, blockquote";
+function collectBlockStyleMap(container) {
+  const map = /* @__PURE__ */ new Map();
+  const blocks = container.querySelectorAll(BLOCK_SELECTORS);
+  blocks.forEach((block) => {
+    const segments = collectTextSegmentsFromElement(block);
+    const fullText = segments.map((s2) => s2.text).join("").trim();
+    if (fullText && segments.some((s2) => s2.style)) {
+      const normalizedText = fullText.replace(/\s+/g, " ").toLowerCase();
+      map.set(normalizedText, segments);
+    }
+  });
+  return map;
+}
+function applyStylesToBlockNodes(lexicalNodes, blockStyleMap) {
+  for (const node of lexicalNodes) {
+    if ($isElementNode(node)) {
+      const nodeType = node.getType();
+      const isBlockElement = [
+        "paragraph",
+        "heading",
+        "listitem",
+        "quote"
+      ].includes(nodeType);
+      if (isBlockElement) {
+        const nodeText = node.getTextContent().trim();
+        if (nodeText) {
+          const normalizedNodeText = nodeText.replace(/\s+/g, " ").toLowerCase();
+          const segments = blockStyleMap.get(normalizedNodeText);
+          if (segments && segments.length > 0) {
+            const textChildren = node.getChildren().filter($isTextNode);
+            if (textChildren.length === 1) {
+              splitAndStyleTextNode(textChildren[0], segments);
+            } else if (textChildren.length > 0) {
+              for (let i2 = 0; i2 < textChildren.length && i2 < segments.length; i2++) {
+                const textNode = textChildren[i2];
+                const segment = segments[i2];
+                if (segment.style) {
+                  textNode.setStyle(segment.style);
+                }
+              }
+            }
+          }
+        }
+      } else {
+        applyStylesToBlockNodes(node.getChildren(), blockStyleMap);
+      }
+    }
+  }
+}
 const InitialContentPlugin = ({
   initialContent
 }) => {
@@ -37141,7 +37555,9 @@ const InitialContentPlugin = ({
     editor.update(() => {
       const parser = new DOMParser();
       const dom = parser.parseFromString(processedHtml, "text/html");
+      const blockStyleMap = collectBlockStyleMap(dom.body);
       const nodes = $generateNodesFromDOM(editor, dom);
+      applyStylesToBlockNodes(nodes, blockStyleMap);
       const root2 = $getRoot();
       root2.clear();
       root2.append(...nodes);
@@ -37655,4 +38071,4 @@ export {
   useHtmlView as u,
   verifyApiKey as v
 };
-//# sourceMappingURL=index-23abcbd9.js.map
+//# sourceMappingURL=index-c4b49ec3.js.map