ct-rich-text-editor 1.3.9 → 1.3.11

package/dist/{index-4061f3ce.js → index-ca05509b.js}

@@ -21,7 +21,7 @@ import { ListPlugin } from "@lexical/react/LexicalListPlugin";
 import { OnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
 import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
 import { TablePlugin } from "@lexical/react/LexicalTablePlugin";
-import { TableNode, TableCellNode, TableRowNode, $createTableNodeWithDimensions, $isTableRowNode, $isTableCellNode, TableCellHeaderStates, $isTableNode, $isTableSelection, $getTableCellNodeFromLexicalNode, $getTableNodeFromLexicalNodeOrThrow, getTableElement, getTableObserverFromTableElement, $getNodeTriplet, $getTableRowIndexFromTableCellNode, $insertTableRow__EXPERIMENTAL, $getTableColumnIndexFromTableCellNode, $insertTableColumn__EXPERIMENTAL, $deleteTableRow__EXPERIMENTAL, $deleteTableColumn__EXPERIMENTAL, $unmergeCell, $computeTableMapSkipCellCheck, getDOMCellFromTarget, $getTableAndElementByKey } from "@lexical/table";
+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, isDOMNode } from "lexical";
@@ -1477,7 +1477,7 @@ const AiTextTransform = async ({ content, apiKey }) => {
 const AI_ACTION_COMMAND = createCommand(
   "AI_ACTION_COMMAND"
 );
-const ImageView = React__default.lazy(() => import("./index-0445ed0b.js"));
+const ImageView = React__default.lazy(() => import("./index-35bfe917.js"));
 function isGoogleDocCheckboxImg(img) {
   return img.parentElement != null && img.parentElement.tagName === "LI" && img.previousSibling === null && img.getAttribute("aria-roledescription") === "checkbox";
 }
@@ -15226,7 +15226,7 @@ const EmbedComponent = ({ url, displayType, alignment, nodeKey }) => {
     }
   );
 };
-const FileComponent = React$1.lazy(() => import("./index-db990790.js"));
+const FileComponent = React$1.lazy(() => import("./index-d9c39bac.js"));
 function convertFileElement(domNode) {
   if (domNode instanceof HTMLDivElement) {
     const dataUrl = domNode.getAttribute("data-lexical-file-src");
@@ -20113,10 +20113,10 @@ const PDF_CONFIG = {
 };
 const loadHtml2Pdf = async () => {
   try {
-    const mod = await import("./html2pdf.bundle.min-94e617b8.js").then((n) => n.h);
+    const mod = await import("./html2pdf.bundle.min-05204c5b.js").then((n) => n.h);
     return (mod == null ? void 0 : mod.default) || mod;
   } catch {
-    const mod2 = await import("./html2pdf.bundle-edf70ece.js").then((n) => n.h);
+    const mod2 = await import("./html2pdf.bundle-f2c10c61.js").then((n) => n.h);
     return (mod2 == null ? void 0 : mod2.default) || mod2;
   }
 };
@@ -27144,7 +27144,7 @@ function CombinedAutocompleteGrammarPlugin({
   debounceDelay = 800
 }) {
   const [editor] = useLexicalComposerContext();
-  const { toolbarState } = useToolbarState();
+  const { toolbarState, updateToolbarState } = useToolbarState();
   const lastTextMap = useRef([]);
   const grammarService = useRef(new GrammarAIService(apiEndpoint));
   const checkTimeout = useRef();
@@ -27207,7 +27207,7 @@ function CombinedAutocompleteGrammarPlugin({
     setQueryString(null);
   }, []);
   const checkGrammar = useCallback(async () => {
-    if (!toolbarState.isGrammarCheckEnabled || !enableAI) {
+    if (!toolbarState.isAutocompleteEnabled || !enableAI) {
       setErrors([]);
       setErrorMap(/* @__PURE__ */ new Map());
       setCheckingSentences(/* @__PURE__ */ new Set());
@@ -27217,8 +27217,6 @@ function CombinedAutocompleteGrammarPlugin({
     if (!fullText)
       return;
     lastTextMap.current = nodeMap;
-    if (fullText.trim() === lastCheckedText.current.trim())
-      return;
     if (fullText.trim().length < 3) {
       setErrors([]);
       setErrorMap(/* @__PURE__ */ new Map());
@@ -27466,6 +27464,11 @@ function CombinedAutocompleteGrammarPlugin({
     if (!toolbarState.isAutocompleteEnabled) {
       setQueryString(null);
       setSuggestions([]);
+      setErrors([]);
+      setErrorMap(/* @__PURE__ */ new Map());
+      setCheckingSentences(/* @__PURE__ */ new Set());
+    } else {
+      checkGrammar();
     }
   }, [toolbarState.isAutocompleteEnabled]);
   useEffect$1(() => {
@@ -27567,6 +27570,8 @@ function CombinedAutocompleteGrammarPlugin({
     };
   }, []);
   useEffect$1(() => {
+    if (!toolbarState.isAutocompleteEnabled)
+      return;
     const unregister = editor.registerUpdateListener(() => {
       clearTimeout(checkTimeout.current);
       checkTimeout.current = window.setTimeout(checkGrammar, 1e3);
@@ -27822,22 +27827,50 @@ function CombinedAutocompleteGrammarPlugin({
                   ] })
                 }
               ),
+              /* @__PURE__ */ jsxs("div", { className: "cteditor-flex cteditor-gap-2", children: [
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    onClick: () => dismissError(error),
+                    className: "cteditor-flex-1 cteditor-px-4 cteditor-py-2 cteditor-text-sm cteditor-text-gray-600 hover:cteditor-bg-gray-100 cteditor-rounded-lg cteditor-border cteditor-border-gray-300",
+                    children: "Dismiss"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    onClick: () => {
+                      updateToolbarState("isAutocompleteEnabled", false);
+                      setTooltipState(null);
+                    },
+                    className: "cteditor-px-3 cteditor-py-2 cteditor-text-xs cteditor-text-gray-500 hover:cteditor-text-gray-700 hover:cteditor-bg-gray-50 cteditor-rounded-lg cteditor-border cteditor-border-gray-200",
+                    title: "Turn off grammar checking",
+                    children: "Disable"
+                  }
+                )
+              ] })
+            ] }) : /* @__PURE__ */ jsxs("div", { className: "cteditor-flex cteditor-gap-2", children: [
               /* @__PURE__ */ jsx(
                 "button",
                 {
                   onClick: () => dismissError(error),
-                  className: "cteditor-w-full cteditor-mt-2 cteditor-px-4 cteditor-py-2 cteditor-text-sm cteditor-text-gray-600 hover:cteditor-bg-gray-100 cteditor-rounded-lg cteditor-border cteditor-border-gray-300",
+                  className: "cteditor-flex-1 cteditor-px-4 cteditor-py-2 cteditor-text-sm cteditor-text-gray-600 hover:cteditor-bg-gray-100 cteditor-rounded-lg cteditor-border cteditor-border-gray-300",
                   children: "Dismiss"
                 }
+              ),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  onClick: () => {
+                    updateToolbarState("isAutocompleteEnabled", false);
+                    setTooltipState(null);
+                  },
+                  className: "cteditor-px-3 cteditor-py-2 cteditor-text-xs cteditor-text-gray-500 hover:cteditor-text-gray-700 hover:cteditor-bg-gray-50 cteditor-rounded-lg cteditor-border cteditor-border-gray-200",
+                  title: "Turn off grammar checking",
+                  children: "Disable"
+                }
               )
-            ] }) : /* @__PURE__ */ jsx(
-              "button",
-              {
-                onClick: () => dismissError(error),
-                className: "cteditor-w-full cteditor-mt-2 cteditor-px-4 cteditor-py-2 cteditor-text-sm cteditor-text-gray-600 hover:cteditor-bg-gray-100 cteditor-rounded-lg cteditor-border cteditor-border-gray-300",
-                children: "Dismiss"
-              }
-            )
+            ] })
           ] }) })
         }
       ),
@@ -31943,8 +31976,10 @@ function TableActionMenu({
   const [canMergeCells, setCanMergeCells] = useState$1(false);
   const [canUnmergeCell, setCanUnmergeCell] = useState$1(false);
   const [backgroundColor, setBackgroundColor] = useState$1("");
-  const [stripingColor, setStripingColor] = useState$1("");
+  const [oddRowStripingColor, setOddRowStripingColor] = useState$1("");
+  const [evenRowStripingColor, setEvenRowStripingColor] = useState$1("");
   const [isHeaderCell, setIsHeaderCell] = useState$1(false);
+  const [isOddRow, setIsOddRow] = useState$1(true);
   useEffect$1(() => {
     updateTableCellNode(_tableCellNode);
   }, [_tableCellNode]);
@@ -31966,18 +32001,52 @@ function TableActionMenu({
   useEffect$1(() => {
     editor.getEditorState().read(() => {
       const selection = $getSelection();
+      try {
+        const rowIndex = $getTableRowIndexFromTableCellNode(tableCellNode);
+        const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
+        const firstRow = tableNode.getFirstChild();
+        let hasHeaderRow = false;
+        if (firstRow && $isTableRowNode(firstRow)) {
+          const firstCell = firstRow.getFirstChild();
+          if (firstCell && $isTableCellNode(firstCell)) {
+            hasHeaderRow = (firstCell.getHeaderStyles() & TableCellHeaderStates.COLUMN) === TableCellHeaderStates.COLUMN;
+          }
+        }
+        let dataRowNumber;
+        if (hasHeaderRow) {
+          if (rowIndex === 0) {
+            setIsOddRow(true);
+            return;
+          }
+          dataRowNumber = rowIndex;
+        } else {
+          dataRowNumber = rowIndex + 1;
+        }
+        setIsOddRow(dataRowNumber % 2 === 1);
+      } catch (error) {
+        setIsOddRow(true);
+      }
       if ($isTableSelection(selection)) {
         const currentSelectionCounts = computeSelectionCount(selection);
         updateSelectionCounts(computeSelectionCount(selection));
         setCanMergeCells(
           currentSelectionCounts.columns > 1 || currentSelectionCounts.rows > 1
         );
-        const anchorNode = $getTableCellNodeFromLexicalNode(selection.anchor.getNode());
+        const anchorNode = $getTableCellNodeFromLexicalNode(
+          selection.anchor.getNode()
+        );
         if (anchorNode) {
           const tableNode = $getTableNodeFromLexicalNodeOrThrow(anchorNode);
           const tableRowCount = tableNode.getChildrenSize();
           const firstRow = tableNode.getFirstChild();
           const tableColumnCount = firstRow && $isTableRowNode(firstRow) ? firstRow.getChildrenSize() : 0;
+          let hasHeaderRow = false;
+          if (firstRow && $isTableRowNode(firstRow)) {
+            const firstCell = firstRow.getFirstChild();
+            if (firstCell && $isTableCellNode(firstCell)) {
+              hasHeaderRow = (firstCell.getHeaderStyles() & TableCellHeaderStates.COLUMN) === TableCellHeaderStates.COLUMN;
+            }
+          }
           const nodes = selection.getNodes();
           const hasHeaderCell = nodes.some((node) => {
             if ($isTableCellNode(node)) {
@@ -31990,6 +32059,22 @@ function TableActionMenu({
             setSelectionType("column");
           } else if (currentSelectionCounts.columns === tableColumnCount && currentSelectionCounts.rows < tableRowCount) {
             setSelectionType("row");
+            try {
+              const anchorRowIndex = $getTableRowIndexFromTableCellNode(anchorNode);
+              let dataRowNumber;
+              if (hasHeaderRow) {
+                if (anchorRowIndex === 0) {
+                  setIsOddRow(true);
+                } else {
+                  dataRowNumber = anchorRowIndex;
+                  setIsOddRow(dataRowNumber % 2 === 1);
+                }
+              } else {
+                dataRowNumber = anchorRowIndex + 1;
+                setIsOddRow(dataRowNumber % 2 === 1);
+              }
+            } catch (error) {
+            }
           } else {
             setSelectionType("cell");
           }
@@ -32091,7 +32176,13 @@ function TableActionMenu({
         dropDownElement.style.top = `${topPosition}px`;
       }
     }
-  }, [contextRef, dropDownRef, editor, contextMenuPosition, chevronPositionRef]);
+  }, [
+    contextRef,
+    dropDownRef,
+    editor,
+    contextMenuPosition,
+    chevronPositionRef
+  ]);
   useEffect$1(() => {
     function handleClickOutside(event) {
       if (event.button === 2) {
@@ -32435,22 +32526,85 @@ function TableActionMenu({
       });
     });
   }, [editor, tableCellNode, $clearTableSelectionInline, onClose]);
-  const applyRowStriping = useCallback((color) => {
-    editor.update(() => {
-      if (tableCellNode.isAttached()) {
-        const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
-        if (tableNode) {
-          tableNode.setRowStriping(true);
-          const tableElement = editor.getElementByKey(tableNode.getKey());
-          if (tableElement instanceof HTMLElement) {
-            tableElement.style.setProperty("--table-striping-color", color);
-            tableElement.classList.add("table-custom-striping");
+  const selectFirstCellInRow = (cellNode) => {
+    const row = cellNode.getParent();
+    if ($isTableRowNode(row)) {
+      const firstCell = row.getFirstChild();
+      if ($isTableCellNode(firstCell)) {
+        firstCell.selectEnd();
+      }
+    }
+  };
+  const applyOddRowStriping = useCallback(
+    (color) => {
+      editor.update(() => {
+        if (tableCellNode.isAttached()) {
+          const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
+          if (tableNode) {
+            const tableElement = editor.getElementByKey(tableNode.getKey());
+            if (tableElement instanceof HTMLElement) {
+              const firstRow = tableNode.getFirstChild();
+              let hasHeaderRow = false;
+              if (firstRow && $isTableRowNode(firstRow)) {
+                const firstCell = firstRow.getFirstChild();
+                if (firstCell && $isTableCellNode(firstCell)) {
+                  hasHeaderRow = (firstCell.getHeaderStyles() & TableCellHeaderStates.COLUMN) === TableCellHeaderStates.COLUMN;
+                }
+              }
+              tableElement.style.setProperty(
+                "--table-odd-striping-color",
+                color
+              );
+              tableElement.classList.add("table-custom-odd-striping");
+              if (hasHeaderRow) {
+                tableElement.classList.add("has-header-row");
+              } else {
+                tableElement.classList.remove("has-header-row");
+              }
+              selectFirstCellInRow(tableCellNode);
+            }
           }
         }
-      }
-      $clearTableSelectionInline();
-    });
-  }, [editor, tableCellNode, $clearTableSelectionInline]);
+      });
+      setIsMenuOpen(false);
+    },
+    [editor, tableCellNode, setIsMenuOpen]
+  );
+  const applyEvenRowStriping = useCallback(
+    (color) => {
+      editor.update(() => {
+        if (tableCellNode.isAttached()) {
+          const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
+          if (tableNode) {
+            const tableElement = editor.getElementByKey(tableNode.getKey());
+            if (tableElement instanceof HTMLElement) {
+              const firstRow = tableNode.getFirstChild();
+              let hasHeaderRow = false;
+              if (firstRow && $isTableRowNode(firstRow)) {
+                const firstCell = firstRow.getFirstChild();
+                if (firstCell && $isTableCellNode(firstCell)) {
+                  hasHeaderRow = (firstCell.getHeaderStyles() & TableCellHeaderStates.COLUMN) === TableCellHeaderStates.COLUMN;
+                }
+              }
+              tableElement.style.setProperty(
+                "--table-even-striping-color",
+                color
+              );
+              tableElement.classList.add("table-custom-even-striping");
+              if (hasHeaderRow) {
+                tableElement.classList.add("has-header-row");
+              } else {
+                tableElement.classList.remove("has-header-row");
+              }
+              selectFirstCellInRow(tableCellNode);
+            }
+          }
+        }
+      });
+      setIsMenuOpen(false);
+    },
+    [editor, tableCellNode, setIsMenuOpen]
+  );
   const handleCellBackgroundColor = useCallback(
     (value) => {
       const getContrastColor = (hexColor) => {
@@ -32484,7 +32638,11 @@ function TableActionMenu({
         cellKeysToStyle.forEach((cellKey) => {
           const cellElement = editor.getElementByKey(cellKey);
           if (cellElement instanceof HTMLElement) {
-            cellElement.style.setProperty("background-color", value, "important");
+            cellElement.style.setProperty(
+              "background-color",
+              value,
+              "important"
+            );
             cellElement.style.setProperty("color", textColor, "important");
             cellElement.style.setProperty("border-color", "#bbb", "important");
             const nestedElements = cellElement.querySelectorAll("*");
@@ -32551,46 +32709,84 @@ function TableActionMenu({
               className: menuItemClass,
               onClick: (e) => {
                 e.stopPropagation();
-                showColorPickerModal("Cell Background Color", (closeModal) => /* @__PURE__ */ jsx(
-                  ColorPicker,
-                  {
-                    color: backgroundColor,
-                    onApply: (value) => {
-                      handleCellBackgroundColor(value);
-                      closeModal();
-                      setIsMenuOpen(false);
+                showColorPickerModal(
+                  "Cell Background Color",
+                  (closeModal) => /* @__PURE__ */ jsx(
+                    ColorPicker,
+                    {
+                      color: backgroundColor,
+                      onApply: (value) => {
+                        handleCellBackgroundColor(value);
+                        closeModal();
+                        setIsMenuOpen(false);
+                      }
                     }
-                  }
-                ), true);
+                  ),
+                  true
+                );
               },
               "data-test-id": "table-background-color",
               children: /* @__PURE__ */ jsx("span", { className: "text", children: "Background Color" })
             }
           ),
-          selectionType !== "column" && /* @__PURE__ */ jsx(
+          selectionType !== "column" && /* @__PURE__ */ jsx(Fragment, { children: !isOddRow ? (
+            //might look inverted but it's correct
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: menuItemClass,
+                onClick: (e) => {
+                  e.stopPropagation();
+                  showColorPickerModal(
+                    "Odd Row Striping Color",
+                    (closeModal) => /* @__PURE__ */ jsx(
+                      ColorPicker,
+                      {
+                        color: oddRowStripingColor,
+                        onApply: (value) => {
+                          setOddRowStripingColor(value);
+                          applyOddRowStriping(value);
+                          closeModal();
+                          setIsMenuOpen(false);
+                        }
+                      }
+                    ),
+                    true
+                  );
+                },
+                "data-test-id": "table-odd-row-striping",
+                children: /* @__PURE__ */ jsx("span", { className: "text", children: "Even Row Striping Color" })
+              }
+            )
+          ) : /* @__PURE__ */ jsx(
             "button",
             {
               type: "button",
               className: menuItemClass,
               onClick: (e) => {
                 e.stopPropagation();
-                showColorPickerModal("Row striping color", (closeModal) => /* @__PURE__ */ jsx(
-                  ColorPicker,
-                  {
-                    color: stripingColor,
-                    onApply: (value) => {
-                      setStripingColor(value);
-                      applyRowStriping(value);
-                      closeModal();
-                      setIsMenuOpen(false);
+                showColorPickerModal(
+                  "Even Row Striping Color",
+                  (closeModal) => /* @__PURE__ */ jsx(
+                    ColorPicker,
+                    {
+                      color: evenRowStripingColor,
+                      onApply: (value) => {
+                        setEvenRowStripingColor(value);
+                        applyEvenRowStriping(value);
+                        closeModal();
+                        setIsMenuOpen(false);
+                      }
                     }
-                  }
-                ), true);
+                  ),
+                  true
+                );
               },
-              "data-test-id": "table-row-striping",
-              children: /* @__PURE__ */ jsx("span", { className: "text", children: "Row Striping Color" })
+              "data-test-id": "table-even-row-striping",
+              children: /* @__PURE__ */ jsx("span", { className: "text", children: "Odd Row Striping Color" })
             }
-          ),
+          ) }),
           /* @__PURE__ */ jsx("div", { className: "cteditor-bg-gradient-to-r cteditor-from-foreground/0 cteditor-via-foreground/15 cteditor-to-foreground/0 !cteditor-my-1 cteditor-h-[1px]" }),
           !isHeaderCell && /* @__PURE__ */ jsx(
             "button",
@@ -32625,7 +32821,7 @@ function TableActionMenu({
             }
           ),
           /* @__PURE__ */ jsx("div", { className: "cteditor-bg-gradient-to-r cteditor-from-foreground/0 cteditor-via-foreground/15 cteditor-to-foreground/0 !cteditor-my-1 cteditor-h-[1px]" }),
-          "      ",
+          " ",
           /* @__PURE__ */ jsx(
             "button",
             {
@@ -32659,7 +32855,7 @@ function TableActionMenu({
             }
           ),
           /* @__PURE__ */ jsx("div", { className: "cteditor-bg-gradient-to-r cteditor-from-foreground/0 cteditor-via-foreground/15 cteditor-to-foreground/0 !cteditor-my-1 cteditor-h-[1px]" }),
-          "      ",
+          " ",
           selectionType !== "row" && /* @__PURE__ */ jsx(
             "button",
             {
@@ -32691,7 +32887,7 @@ function TableActionMenu({
             }
           ),
           /* @__PURE__ */ jsx("div", { className: "cteditor-bg-gradient-to-r cteditor-from-foreground/0 cteditor-via-foreground/15 cteditor-to-foreground/0 !cteditor-my-1 cteditor-h-[1px]" }),
-          "      ",
+          " ",
           selectionType !== "column" && /* @__PURE__ */ jsx(
             "button",
             {
@@ -32856,9 +33052,15 @@ function TableCellActionMenuContainer({
     const editorElement = editor.getRootElement();
     const scrollableParent = editorElement == null ? void 0 : editorElement.closest(".cteditor-content");
     if (scrollableParent) {
-      scrollableParent.addEventListener("scroll", handleScroll2, { capture: true, passive: true });
+      scrollableParent.addEventListener("scroll", handleScroll2, {
+        capture: true,
+        passive: true
+      });
     }
-    window.addEventListener("scroll", handleScroll2, { capture: true, passive: true });
+    window.addEventListener("scroll", handleScroll2, {
+      capture: true,
+      passive: true
+    });
     const handleContextMenu = (event) => {
       event.stopPropagation();
       const target = event.target;
@@ -32973,7 +33175,12 @@ function TableCellActionMenuContainer({
             e.stopPropagation();
             if (menuRootRef.current) {
               const rect = menuRootRef.current.getBoundingClientRect();
-              chevronPositionRef.current = { top: rect.top, left: rect.left, right: rect.right, bottom: rect.bottom };
+              chevronPositionRef.current = {
+                top: rect.top,
+                left: rect.left,
+                right: rect.right,
+                bottom: rect.bottom
+              };
             }
             setIsMenuOpen(!isMenuOpen);
           },
@@ -33561,7 +33768,7 @@ function TableHoverActionsContainer({
   const currentTableKeyRef = useRef(null);
   const calculateDotPositions = useCallback((tableDOMElement) => {
     const tableRect = tableDOMElement.getBoundingClientRect();
-    const { left: editorLeft, top: editorTop } = anchorElem.getBoundingClientRect();
+    const { left: editorLeft, top: editorTop, width: editorWidth } = anchorElem.getBoundingClientRect();
     const rows = tableDOMElement.querySelectorAll("tr");
     const newDots = [];
     const newSelectors = [];
@@ -33569,25 +33776,29 @@ function TableHoverActionsContainer({
       const rowRect = row.getBoundingClientRect();
       const dotTop = rowRect.bottom - editorTop - DOT_SIZE / 2;
       const dotLeft = tableRect.left - editorLeft - 20;
-      newDots.push({
-        left: dotLeft,
-        top: dotTop,
-        type: "row",
-        index: index2 + 1,
-        // This dot will insert at position index+1 (after current row)
-        isHovered: false
-      });
+      if (dotLeft >= -30) {
+        newDots.push({
+          left: dotLeft,
+          top: dotTop,
+          type: "row",
+          index: index2 + 1,
+          isHovered: false
+        });
+      }
     });
     const lastRow = rows[rows.length - 1];
     if (lastRow) {
       const lastRowRect = lastRow.getBoundingClientRect();
-      newDots.push({
-        left: tableRect.left - editorLeft - 20,
-        top: lastRowRect.bottom - editorTop - DOT_SIZE / 2,
-        type: "row",
-        index: rows.length,
-        isHovered: false
-      });
+      const dotLeft = tableRect.left - editorLeft - 20;
+      if (dotLeft >= -30) {
+        newDots.push({
+          left: dotLeft,
+          top: lastRowRect.bottom - editorTop - DOT_SIZE / 2,
+          type: "row",
+          index: rows.length,
+          isHovered: false
+        });
+      }
     }
     if (rows.length > 0) {
       const firstRow = rows[0];
@@ -33596,39 +33807,44 @@ function TableHoverActionsContainer({
         const cellRect = cell.getBoundingClientRect();
         const dotLeft = cellRect.right - editorLeft - DOT_SIZE / 2;
         const dotTop = tableRect.top - editorTop - 12;
-        newDots.push({
-          left: dotLeft,
-          top: dotTop,
-          type: "column",
-          index: index2 + 1,
-          // This dot will insert at position index+1 (after current column)
-          isHovered: false
-        });
+        if (dotLeft + DOT_HOVER_SIZE + 16 <= editorWidth + 20) {
+          newDots.push({
+            left: dotLeft,
+            top: dotTop,
+            type: "column",
+            index: index2 + 1,
+            isHovered: false
+          });
+        }
       });
       const lastCell = cells[cells.length - 1];
       if (lastCell) {
         const lastCellRect = lastCell.getBoundingClientRect();
-        newDots.push({
-          left: lastCellRect.right - editorLeft - DOT_SIZE / 2,
-          top: tableRect.top - editorTop - 12,
-          type: "column",
-          index: cells.length,
-          isHovered: false
-        });
+        const dotLeft = lastCellRect.right - editorLeft - DOT_SIZE / 2;
+        if (dotLeft + DOT_HOVER_SIZE + 16 <= editorWidth + 20) {
+          newDots.push({
+            left: dotLeft,
+            top: tableRect.top - editorTop - 12,
+            type: "column",
+            index: cells.length,
+            isHovered: false
+          });
+        }
       }
     }
     rows.forEach((row, index2) => {
       const rowRect = row.getBoundingClientRect();
       const buttonTop = rowRect.top - editorTop + (rowRect.height - SELECTOR_BUTTON_SIZE) / 2;
       const buttonLeft = tableRect.left - editorLeft - SELECTOR_BUTTON_SIZE / 2;
-      newSelectors.push({
-        left: buttonLeft,
-        top: buttonTop,
-        type: "row",
-        index: index2,
-        // The actual row index
-        isHovered: false
-      });
+      if (buttonLeft >= -(SELECTOR_BUTTON_SIZE + 10)) {
+        newSelectors.push({
+          left: buttonLeft,
+          top: buttonTop,
+          type: "row",
+          index: index2,
+          isHovered: false
+        });
+      }
     });
     if (rows.length > 0) {
       const firstRow = rows[0];
@@ -33637,14 +33853,15 @@ function TableHoverActionsContainer({
         const cellRect = cell.getBoundingClientRect();
         const buttonLeft = cellRect.left - editorLeft + (cellRect.width - SELECTOR_BUTTON_SIZE) / 2;
         const buttonTop = tableRect.top - editorTop - SELECTOR_BUTTON_SIZE / 2;
-        newSelectors.push({
-          left: buttonLeft,
-          top: buttonTop,
-          type: "column",
-          index: index2,
-          // The actual column index
-          isHovered: false
-        });
+        if (buttonLeft + SELECTOR_BUTTON_SIZE + 10 <= editorWidth + 20) {
+          newSelectors.push({
+            left: buttonLeft,
+            top: buttonTop,
+            type: "column",
+            index: index2,
+            isHovered: false
+          });
+        }
       });
     }
     setDots(newDots);
@@ -33784,14 +34001,11 @@ function TableHoverActionsContainer({
   const handleSelectorClick = (type, index2) => {
     if (!currentTableKeyRef.current)
       return;
-    console.log(`[HoverPlugin] Selector clicked - Type: ${type}, Index: ${index2}`);
     editor.update(() => {
       const { tableNode } = $getTableAndElementByKey(currentTableKeyRef.current);
       if (!tableNode || !$isTableNode(tableNode)) {
-        console.log("[HoverPlugin] Table node not found");
         return;
       }
-      console.log("[HoverPlugin] Table node found, creating selection");
       if (type === "row") {
         const rows = tableNode.getChildren();
         if (index2 >= 0 && index2 < rows.length) {
@@ -33800,12 +34014,10 @@ function TableHoverActionsContainer({
           if (cells.length > 0) {
             const firstCell = cells[0];
             const lastCell = cells[cells.length - 1];
-            console.log(`[HoverPlugin] Selecting row ${index2}, cells: ${cells.length}`);
             firstCell.selectEnd();
             const selection = firstCell.select();
             if (selection) {
               selection.focus.set(lastCell.getKey(), lastCell.getChildrenSize(), "element");
-              console.log("[HoverPlugin] Row selection created");
               setTimeout(() => {
                 const firstCellDOM = editor.getElementByKey(firstCell.getKey());
                 if (firstCellDOM) {
@@ -33818,7 +34030,6 @@ function TableHoverActionsContainer({
                     clientY: firstCellDOM.getBoundingClientRect().top + 10
                   });
                   firstCellDOM.dispatchEvent(event);
-                  console.log("[HoverPlugin] Context menu triggered");
                 }
               }, 50);
             }
@@ -33834,13 +34045,11 @@ function TableHoverActionsContainer({
             const lastRow = rows[rows.length - 1];
             const lastRowCells = lastRow.getChildren();
             const lastCell = lastRowCells[index2];
-            console.log(`[HoverPlugin] Selecting column ${index2}, rows: ${rows.length}`);
             if (firstCell && lastCell) {
               firstCell.selectEnd();
               const selection = firstCell.select();
               if (selection) {
                 selection.focus.set(lastCell.getKey(), lastCell.getChildrenSize(), "element");
-                console.log("[HoverPlugin] Column selection created");
                 setTimeout(() => {
                   const firstCellDOM = editor.getElementByKey(firstCell.getKey());
                   if (firstCellDOM) {
@@ -33853,7 +34062,6 @@ function TableHoverActionsContainer({
                       clientY: firstCellDOM.getBoundingClientRect().top + 10
                     });
                     firstCellDOM.dispatchEvent(event);
-                    console.log("[HoverPlugin] Context menu triggered");
                   }
                 }, 50);
               }
@@ -34005,9 +34213,8 @@ function TableHoverActionsContainer({
     }
     const { type, sourceIndex } = dragState;
     let actualColWidths = [];
-    let tableActualWidth = 0;
     if (currentTableRef.current) {
-      tableActualWidth = currentTableRef.current.getBoundingClientRect().width;
+      currentTableRef.current.getBoundingClientRect().width;
       const firstRow = currentTableRef.current.querySelector("tr");
       if (firstRow) {
         const cells = firstRow.querySelectorAll("td, th");
@@ -34016,10 +34223,6 @@ function TableHoverActionsContainer({
         });
       }
     }
-    console.log("[TABLE-DND] BEFORE DROP:");
-    console.log("  - Table actual width:", tableActualWidth);
-    console.log("  - Captured DOM column widths:", actualColWidths);
-    console.log("  - Source index:", sourceIndex, "Target index:", targetIndex, "Type:", type);
     editor.update(() => {
       if (!currentTableKeyRef.current) {
         return;
@@ -34031,7 +34234,6 @@ function TableHoverActionsContainer({
           return;
         }
         const preservedColWidths = tableNode.getColWidths();
-        console.log("[TABLE-DND] Lexical stored column widths:", preservedColWidths);
         if (type === "row") {
           const rows = tableNode.getChildren();
           if (sourceIndex >= 0 && sourceIndex < rows.length && targetIndex >= 0 && targetIndex < rows.length) {
@@ -34094,34 +34296,13 @@ function TableHoverActionsContainer({
           });
         }
         const widthsToRestore = actualColWidths.length > 0 ? actualColWidths : preservedColWidths;
-        console.log("[TABLE-DND] Widths to restore:", widthsToRestore);
         if (widthsToRestore && widthsToRestore.length > 0) {
           tableNode.setColWidths(widthsToRestore);
-          console.log("[TABLE-DND] Column widths restored");
-        } else {
-          console.log("[TABLE-DND] WARNING: No widths available to restore!");
         }
       } catch (error) {
         console.error(`[TABLE-DND] ERROR during swap:`, error);
       }
     });
-    setTimeout(() => {
-      if (currentTableRef.current) {
-        const newTableWidth = currentTableRef.current.getBoundingClientRect().width;
-        const firstRow = currentTableRef.current.querySelector("tr");
-        let newColWidths = [];
-        if (firstRow) {
-          const cells = firstRow.querySelectorAll("td, th");
-          newColWidths = Array.from(cells).map((cell) => {
-            return cell.getBoundingClientRect().width;
-          });
-        }
-        console.log("[TABLE-DND] AFTER DROP:");
-        console.log("  - Table actual width:", newTableWidth);
-        console.log("  - New DOM column widths:", newColWidths);
-        console.log("  - Width changed:", tableActualWidth !== newTableWidth);
-      }
-    }, 100);
     setDragState(null);
     setDragPreviewLine(null);
     setHighlightedRow(null);
@@ -34273,10 +34454,8 @@ function TableHoverActionsContainer({
           style: {
             position: "absolute",
             left: `${dot.left - 12}px`,
-            // Center hover zone on dot position
             top: `${dot.top - 12}px`,
             width: `${DOT_HOVER_SIZE + 16}px`,
-            // Fixed larger hover zone
             height: `${DOT_HOVER_SIZE + 16}px`,
             display: "flex",
             alignItems: "center",
@@ -34303,7 +34482,6 @@ function TableHoverActionsContainer({
                 padding: 0,
                 position: "relative",
                 transform: isHovered ? "scale(1)" : "scale(1)"
-                // Keep centered while scaling
               },
               onClick: () => handleDotClick(dot.type, dot.index),
               "aria-label": `Insert ${dot.type} ${dot.type === "row" ? "here" : "here"}`,
@@ -34345,11 +34523,8 @@ function TableHoverActionsContainer({
           style: {
             position: "absolute",
             left: `${selector.left - (isDirectHover ? 4 : 0)}px`,
-            // Expand left when hovered
             top: `${selector.top - (isDirectHover ? 4 : 0)}px`,
-            // Expand top when hovered
             width: `${isDirectHover ? SELECTOR_BUTTON_SIZE + 8 : SELECTOR_BUTTON_SIZE}px`,
-            // Expand to ~20px when hovered
             height: `${isDirectHover ? SELECTOR_BUTTON_SIZE + 8 : SELECTOR_BUTTON_SIZE}px`,
             zIndex: 1e3,
             opacity: isDragging ? 0.5 : 1
@@ -34680,6 +34855,137 @@ function TableHoverActionsPlugin({
     anchorElem
   ) : null;
 }
+function TableImageAutoResizePlugin() {
+  const [editor] = useLexicalComposerContext();
+  useEffect$1(() => {
+    const processedImages = /* @__PURE__ */ new Set();
+    const processImageNode = (nodeKey) => {
+      if (processedImages.has(nodeKey)) {
+        return;
+      }
+      editor.getEditorState().read(() => {
+        const node = $getNodeByKey(nodeKey);
+        if (!node) {
+          return;
+        }
+        const nodeType = node.getType();
+        if (nodeType !== "image" && nodeType !== "inline-image") {
+          return;
+        }
+        const tableCell = $findMatchingParent(node, $isTableCellNode);
+        if (!tableCell || !$isTableCellNode(tableCell)) {
+          return;
+        }
+        processedImages.add(nodeKey);
+        try {
+          const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCell);
+          if (!$isTableNode(tableNode)) {
+            return;
+          }
+          const columnIndex = $getTableColumnIndexFromTableCellNode(tableCell);
+          const tableCellKey = tableCell.getKey();
+          console.log(`[TableImageResize] Detected image node ${nodeKey} in table cell column ${columnIndex}`);
+          const scheduleResize = (delay) => {
+            setTimeout(() => {
+              const domElement = editor.getElementByKey(nodeKey);
+              if (!domElement) {
+                console.warn(`[TableImageResize] Could not find DOM element for node ${nodeKey}`);
+                return;
+              }
+              const imgElement = domElement.querySelector("img") || (domElement.tagName === "IMG" ? domElement : null);
+              if (!imgElement) {
+                console.warn(`[TableImageResize] Could not find img element in node ${nodeKey}`);
+                return;
+              }
+              const img = imgElement;
+              const updateColumnWidth = () => {
+                editor.update(() => {
+                  const currentTableCell = $getNodeByKey(tableCellKey);
+                  if (!currentTableCell || !$isTableCellNode(currentTableCell)) {
+                    return;
+                  }
+                  const currentTableNode = $getTableNodeFromLexicalNodeOrThrow(currentTableCell);
+                  if (!$isTableNode(currentTableNode)) {
+                    return;
+                  }
+                  const imageWidth = img.naturalWidth || img.width || img.offsetWidth;
+                  if (!imageWidth || imageWidth === 0) {
+                    console.warn(`[TableImageResize] Image width is 0, skipping resize`);
+                    return;
+                  }
+                  const desiredWidth = imageWidth + 40;
+                  const currentWidths = currentTableNode.getColWidths() || [];
+                  const newWidths = [...currentWidths];
+                  const firstRow = currentTableNode.getFirstChild();
+                  if (!firstRow || !$isTableRowNode(firstRow)) {
+                    return;
+                  }
+                  const columnCount = firstRow.getChildrenSize();
+                  while (newWidths.length < columnCount) {
+                    newWidths.push(0);
+                  }
+                  const currentWidth = newWidths[columnIndex] || 0;
+                  if (desiredWidth > currentWidth) {
+                    newWidths[columnIndex] = desiredWidth;
+                    currentTableNode.setColWidths(newWidths);
+                    console.log(`[TableImageResize] ✓ Resized column ${columnIndex} from ${currentWidth}px to ${desiredWidth}px (image: ${imageWidth}px)`);
+                  } else {
+                    console.log(`[TableImageResize] Column ${columnIndex} already wide enough (${currentWidth}px >= ${desiredWidth}px)`);
+                  }
+                });
+              };
+              if (img.complete && img.naturalWidth > 0) {
+                console.log(`[TableImageResize] Image already loaded (${img.naturalWidth}px), updating immediately`);
+                updateColumnWidth();
+              } else {
+                console.log(`[TableImageResize] Waiting for image to load...`);
+                img.addEventListener("load", () => {
+                  console.log(`[TableImageResize] Image loaded (${img.naturalWidth}px)`);
+                  updateColumnWidth();
+                }, { once: true });
+                setTimeout(() => {
+                  if (img.complete || img.naturalWidth > 0) {
+                    console.log(`[TableImageResize] Fallback check - image ready (${img.naturalWidth}px)`);
+                    updateColumnWidth();
+                  } else {
+                    console.warn(`[TableImageResize] Image still not loaded after timeout`);
+                  }
+                }, 3e3);
+              }
+            }, delay);
+          };
+          scheduleResize(100);
+          scheduleResize(500);
+          scheduleResize(1500);
+        } catch (error) {
+          console.warn("[TableImageResize] Error processing image:", error);
+        }
+      });
+    };
+    let previousNodeKeys = /* @__PURE__ */ new Set();
+    const unregisterUpdateListener = editor.registerUpdateListener(({ editorState, dirtyElements, dirtyLeaves }) => {
+      editorState.read(() => {
+        const nodeMap = editorState._nodeMap;
+        const currentNodeKeys = /* @__PURE__ */ new Set();
+        nodeMap.forEach((node, nodeKey) => {
+          currentNodeKeys.add(nodeKey);
+          const nodeType = node.getType();
+          if (nodeType === "image" || nodeType === "inline-image") {
+            if (!previousNodeKeys.has(nodeKey) || dirtyElements.size > 0 || dirtyLeaves.size > 0) {
+              processImageNode(nodeKey);
+            }
+          }
+        });
+        previousNodeKeys = currentNodeKeys;
+      });
+    });
+    return () => {
+      unregisterUpdateListener();
+      processedImages.clear();
+    };
+  }, [editor]);
+  return null;
+}
 const WordCountPlugin = () => {
   const [editor] = useLexicalComposerContext();
   const [stats, setStats] = useState$1({
@@ -34822,10 +35128,10 @@ const ToolbarWithEditor = (props) => {
 };
 const CombinedPluginWrapper = () => {
   const { toolbarState } = useToolbarState();
-  if (!toolbarState.isAutocompleteEnabled && !toolbarState.isGrammarCheckEnabled) {
+  if (!toolbarState.isAutocompleteEnabled || !toolbarState.isGrammarCheckEnabled) {
     return null;
   }
-  return /* @__PURE__ */ jsx(CombinedAutocompleteGrammarPlugin, { minMatchLength: 2, maxSuggestions: 10, enableAI: true });
+  return /* @__PURE__ */ jsx(CombinedAutocompleteGrammarPlugin, { minMatchLength: 2, maxSuggestions: 10, enableAI: (toolbarState == null ? void 0 : toolbarState.isAutocompleteEnabled) ?? true });
 };
 const OnChangeWrapper = ({ onChange }) => {
   const [editor] = useLexicalComposerContext();
@@ -35037,6 +35343,7 @@ const ConfigurableEditor = ({
             hasHorizontalScroll: true
           }
         ),
+        /* @__PURE__ */ jsx(TableImageAutoResizePlugin, {}),
         /* @__PURE__ */ jsx(TableCellResizerPlugin, {}),
         /* @__PURE__ */ jsx(EmbedPreviewPlugin, {}),
         config.htmlViewOption && !config.toolbarOptions.enableHtmlViewToggle && /* @__PURE__ */ jsx(HtmlViewTogglePlugin, {})
@@ -35221,4 +35528,4 @@ export {
   useHtmlView as u,
   verifyApiKey as v
 };
-//# sourceMappingURL=index-4061f3ce.js.map
+//# sourceMappingURL=index-ca05509b.js.map