@uva-glass/component-library 3.30.1 → 3.32.0

package/dist/components/RteEditor/Plugins/TablePlugin/TableCellContextMenu/TableCellContextMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableCellContextMenu.js","sources":["../../../../../../src/components/RteEditor/Plugins/TablePlugin/TableCellContextMenu/TableCellContextMenu.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { clsx } from 'clsx';\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\n\nimport type { Position } from 'components/RteEditor/Plugins/ToolbarPlugin';\n\nimport styles from './TableCellContextMenu.module.css';\n\nimport { Icon } from 'components/Icon';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\nexport type Actions =\n  | 'insertRowAbove'\n  | 'insertRowBelow'\n  | 'deleteRow'\n  | 'deleteTable'\n  | 'insertColumnLeft'\n  | 'insertColumnRight'\n  | 'deleteColumn';\ninterface TableCellContextMenuProps {\n  position: Position;\n  parentScrollPosition: number;\n  onAction: (action: Actions) => void;\n}\n\nconst CONTEXT_MENU_OFFSET = 25;\nconst WHITE_SPACE = 10;\nconst BUTTON_SHIFT = 4;\nconst BUTTON_RESET = 25;\n\nconst measureElement = (srcElement: HTMLElement) => {\n  const measureElement = srcElement.cloneNode(true) as HTMLElement;\n  measureElement.style.height = 'auto';\n  measureElement.style.left = '-3000px';\n  document.body.appendChild(measureElement);\n  const height = measureElement.getBoundingClientRect().height;\n  document.body.removeChild(measureElement);\n  return height;\n};\n\nexport const TableCellContextMenu = ({ position, parentScrollPosition, onAction }: TableCellContextMenuProps) => {\n  const t = useTranslation();\n  const [isOpen, setIsOpen] = useState(false);\n  const [isHidden, setIsHidden] = useState(false);\n  const [localPosition, setLocalPosition] = useState<Position>({ xPos: 0, yPos: 0, height: 0 });\n  const [menuHeight, setMenuHeight] = useState(0);\n  const startScrollPosition = useRef(0);\n  const menuRef = useRef<HTMLUListElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const [editor] = useLexicalComposerContext();\n\n  const handleAction = (action: Actions) => {\n    onAction(action);\n    setIsOpen(false);\n  };\n\n  const flipMenuIfNotInViewport = () => {\n    const menuWidth = menuRef.current ? menuRef.current.getBoundingClientRect().width : 0;\n\n    if (containerRef.current && menuRef.current && buttonRef.current) {\n      if (localPosition.xPos < menuWidth && containerRef.current) {\n        containerRef.current.style.left = `${menuWidth - localPosition.xPos + WHITE_SPACE}px`;\n        buttonRef.current.style.right = `${menuWidth - localPosition.xPos + BUTTON_SHIFT + WHITE_SPACE}px`;\n      } else {\n        containerRef.current.style.left = '0px';\n        buttonRef.current.style.right = `${BUTTON_SHIFT}px`;\n      }\n\n      if (!menuHeight) {\n        setMenuHeight(measureElement(menuRef.current));\n      }\n\n      if (menuHeight > document.documentElement.clientHeight - localPosition.yPos) {\n        containerRef.current.style.top = `-${menuHeight + localPosition.height}px`;\n        buttonRef.current.style.top = `${menuHeight + BUTTON_SHIFT}px`;\n        buttonRef.current.style.transform = 'rotate(180deg)';\n      } else {\n        containerRef.current.style.top = '0px';\n        buttonRef.current.style.top = `-${BUTTON_RESET}px`;\n        buttonRef.current.style.transform = 'none';\n      }\n    }\n  };\n\n  const setMenuPosition = () => {\n    flipMenuIfNotInViewport();\n    return `translate(${(localPosition?.xPos ?? 0) - (menuRef.current ? menuRef.current.getBoundingClientRect().width : 0)}px, ${localPosition.yPos - (parentScrollPosition - startScrollPosition.current)}px)`;\n  };\n\n  useEffect(() => {\n    setLocalPosition(position);\n    if (position) {\n      startScrollPosition.current = parentScrollPosition;\n    }\n    setIsOpen(false);\n    setIsHidden(false);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [position]);\n\n  useEffect(() => {\n    if (buttonRef.current) {\n      const rect = buttonRef.current.getBoundingClientRect();\n      const rootElement = editor.getRootElement();\n      if (!rootElement) return;\n      if (\n        rect.top - rootElement.getBoundingClientRect().top <= 0 ||\n        rect.top - rootElement.getBoundingClientRect().bottom + CONTEXT_MENU_OFFSET >= 0\n      ) {\n        setIsHidden(true);\n      } else {\n        setIsHidden(false);\n      }\n      flipMenuIfNotInViewport();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [parentScrollPosition]);\n\n  return (\n    <div\n      className={clsx(styles['context-menu__wrapper'], [isHidden && styles['context-menu__wrapper--hidden']])}\n      style={{\n        transform: `${setMenuPosition()}`,\n      }}\n      ref={containerRef}\n    >\n      <button\n        type=\"button\"\n        onClick={() => setIsOpen((prev) => !prev)}\n        className={styles['context-menu__button']}\n        ref={buttonRef}\n      >\n        <Icon name=\"CheveronDown\" size={16} />\n      </button>\n      <ul ref={menuRef} className={clsx(styles['context-menu'], isOpen && styles['context-menu--open'])}>\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertRowAbove')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertRowAbove}\n          >\n            {t.table.insertRowAbove}\n          </button>\n        </li>\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertRowBelow')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertRowBelow}\n          >\n            {t.table.insertRowBelow}\n          </button>\n        </li>\n        <li className={styles['context-menu__item-divider']}>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('deleteRow')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteRow}\n          >\n            {t.table.deleteRow}\n          </button>\n        </li>\n\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertColumnLeft')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertColumnLeft}\n          >\n            {t.table.insertColumnLeft}\n          </button>\n        </li>\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertColumnRight')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertColumnRight}\n          >\n            {t.table.insertColumnRight}\n          </button>\n        </li>\n        <li className={styles['context-menu__item-divider']}>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('deleteColumn')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteColumn}\n          >\n            {t.table.deleteColumn}\n          </button>\n        </li>\n\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('deleteTable')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteTable}\n          >\n            {t.table.deleteTable}\n          </button>\n        </li>\n      </ul>\n    </div>\n  );\n};\n"],"names":["CONTEXT_MENU_OFFSET","WHITE_SPACE","BUTTON_SHIFT","BUTTON_RESET","measureElement","srcElement","height","TableCellContextMenu","position","parentScrollPosition","onAction","useTranslation","isOpen","setIsOpen","useState","isHidden","setIsHidden","localPosition","setLocalPosition","menuHeight","setMenuHeight","startScrollPosition","useRef","menuRef","containerRef","buttonRef","editor","useLexicalComposerContext","handleAction","action","flipMenuIfNotInViewport","menuWidth","setMenuPosition","useEffect","rect","rootElement","jsxs","clsx","styles","jsx","prev","Icon"],"mappings":"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"}
+{"version":3,"file":"TableCellContextMenu.js","sources":["../../../../../../src/components/RteEditor/Plugins/TablePlugin/TableCellContextMenu/TableCellContextMenu.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { clsx } from 'clsx';\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\n\nimport type { Position } from 'components/RteEditor/Plugins/ToolbarPlugin';\n\nimport styles from './TableCellContextMenu.module.css';\n\nimport { Icon } from 'components/Icon';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\nexport type Actions =\n  | 'insertRowAbove'\n  | 'insertRowBelow'\n  | 'deleteRow'\n  | 'deleteTable'\n  | 'insertColumnLeft'\n  | 'insertColumnRight'\n  | 'deleteColumn';\ninterface TableCellContextMenuProps {\n  position: Position;\n  parentScrollPosition: number;\n  onAction: (action: Actions) => void;\n}\n\nconst CONTEXT_MENU_OFFSET = 25;\nconst WHITE_SPACE = 10;\nconst BUTTON_SHIFT = 4;\nconst BUTTON_RESET = 25;\n\nconst measureElement = (srcElement: HTMLElement) => {\n  const measureElement = srcElement.cloneNode(true) as HTMLElement;\n  measureElement.style.height = 'auto';\n  measureElement.style.left = '-3000px';\n  document.body.appendChild(measureElement);\n  const height = measureElement.getBoundingClientRect().height;\n  document.body.removeChild(measureElement);\n  return height;\n};\n\nexport const TableCellContextMenu = ({ position, parentScrollPosition, onAction }: TableCellContextMenuProps) => {\n  const t = useTranslation();\n  const [isOpen, setIsOpen] = useState(false);\n  const [isHidden, setIsHidden] = useState(false);\n  const [localPosition, setLocalPosition] = useState<Position>({ xPos: 0, yPos: 0, height: 0 });\n  const [menuHeight, setMenuHeight] = useState(0);\n  const startScrollPosition = useRef(0);\n  const menuRef = useRef<HTMLUListElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const [editor] = useLexicalComposerContext();\n\n  const handleAction = (action: Actions) => {\n    onAction(action);\n    setIsOpen(false);\n  };\n\n  const flipMenuIfNotInViewport = () => {\n    const menuWidth = menuRef.current ? menuRef.current.getBoundingClientRect().width : 0;\n\n    if (containerRef.current && menuRef.current && buttonRef.current) {\n      if (localPosition.xPos < menuWidth && containerRef.current) {\n        containerRef.current.style.left = `${menuWidth - localPosition.xPos + WHITE_SPACE}px`;\n        buttonRef.current.style.right = `${menuWidth - localPosition.xPos + BUTTON_SHIFT + WHITE_SPACE}px`;\n      } else {\n        containerRef.current.style.left = '0px';\n        buttonRef.current.style.right = `${BUTTON_SHIFT}px`;\n      }\n\n      if (!menuHeight) {\n        setMenuHeight(measureElement(menuRef.current));\n      }\n\n      if (menuHeight > document.documentElement.clientHeight - localPosition.yPos) {\n        containerRef.current.style.top = `-${menuHeight + localPosition.height}px`;\n        buttonRef.current.style.top = `${menuHeight + BUTTON_SHIFT}px`;\n        buttonRef.current.style.transform = 'rotate(180deg)';\n      } else {\n        containerRef.current.style.top = '0px';\n        buttonRef.current.style.top = `-${BUTTON_RESET}px`;\n        buttonRef.current.style.transform = 'none';\n      }\n    }\n  };\n\n  const setMenuPosition = () => {\n    flipMenuIfNotInViewport();\n    return `translate(${(localPosition?.xPos ?? 0) - (menuRef.current ? menuRef.current.getBoundingClientRect().width : 0)}px, ${localPosition.yPos - (parentScrollPosition - startScrollPosition.current)}px)`;\n  };\n\n  useEffect(() => {\n    setLocalPosition(position);\n    if (position) {\n      startScrollPosition.current = parentScrollPosition;\n    }\n    setIsOpen(false);\n    setIsHidden(false);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [position]);\n\n  useEffect(() => {\n    if (buttonRef.current) {\n      const rect = buttonRef.current.getBoundingClientRect();\n      const rootElement = editor.getRootElement();\n      if (!rootElement) return;\n      if (\n        rect.top - rootElement.getBoundingClientRect().top <= 0 ||\n        rect.top - rootElement.getBoundingClientRect().bottom + CONTEXT_MENU_OFFSET >= 0\n      ) {\n        setIsHidden(true);\n      } else {\n        setIsHidden(false);\n      }\n      flipMenuIfNotInViewport();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [parentScrollPosition]);\n\n  return (\n    <div\n      className={clsx(styles['context-menu__wrapper'], [isHidden && styles['context-menu__wrapper--hidden']])}\n      style={{\n        transform: `${setMenuPosition()}`,\n      }}\n      ref={containerRef}\n    >\n      <button\n        type=\"button\"\n        onClick={() => setIsOpen((prev) => !prev)}\n        className={styles['context-menu__button']}\n        ref={buttonRef}\n      >\n        <Icon name=\"CheveronDown\" size={16} />\n      </button>\n      <ul ref={menuRef} className={clsx(styles['context-menu'], isOpen && styles['context-menu--open'])}>\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertRowAbove')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertRowAbove}\n          >\n            {t.table.insertRowAbove}\n          </button>\n        </li>\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertRowBelow')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertRowBelow}\n          >\n            {t.table.insertRowBelow}\n          </button>\n        </li>\n        <li className={styles['context-menu__item-divider']}>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('deleteRow')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteRow}\n          >\n            {t.table.deleteRow}\n          </button>\n        </li>\n\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertColumnLeft')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertColumnLeft}\n          >\n            {t.table.insertColumnLeft}\n          </button>\n        </li>\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertColumnRight')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertColumnRight}\n          >\n            {t.table.insertColumnRight}\n          </button>\n        </li>\n        <li className={styles['context-menu__item-divider']}>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('deleteColumn')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteColumn}\n          >\n            {t.table.deleteColumn}\n          </button>\n        </li>\n\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('deleteTable')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteTable}\n          >\n            {t.table.deleteTable}\n          </button>\n        </li>\n      </ul>\n    </div>\n  );\n};\n"],"names":["CONTEXT_MENU_OFFSET","WHITE_SPACE","BUTTON_SHIFT","BUTTON_RESET","measureElement","srcElement","height","TableCellContextMenu","position","parentScrollPosition","onAction","useTranslation","isOpen","setIsOpen","useState","isHidden","setIsHidden","localPosition","setLocalPosition","menuHeight","setMenuHeight","startScrollPosition","useRef","menuRef","containerRef","buttonRef","editor","useLexicalComposerContext","handleAction","action","flipMenuIfNotInViewport","menuWidth","setMenuPosition","useEffect","rect","rootElement","jsxs","clsx","styles","jsx","prev","Icon"],"mappings":"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"}

package/dist/components/RteEditor/Plugins/TablePlugin/TablePlugin.js

@@ -1,10 +1,10 @@
 import "react/jsx-runtime";
 import "../../../../LexicalComposerContext.prod-DLlRM5wP.js";
 import "../../../../clsx-OuTLNxxd.js";
-import "../../../../LexicalTable.prod-BSjs04iE.js";
-import "../../../../Lexical.prod-UwAbgYpF.js";
+import "../../../../LexicalTable.prod-9xjyWB0C.js";
+import "../../../../Lexical.prod-B84LhBo3.js";
 import "react";
-import { T as F } from "../../../../TablePlugin-NmJsn2fm.js";
+import { T as F } from "../../../../TablePlugin-oF-gInNx.js";
 import "./helpers.js";
 import "../../hooks/useFlyout.js";
 import "../../../Icon/Icon.js";
@@ -25,11 +25,11 @@ import "../../../../RteEditor.module-B_3uFnFu.js";
 import "../../hooks/useTranslation.js";
 import "../LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "../../Providers/LanguageProvider.js";
-import "../../../../index-DllfJcv4.js";
+import "../../../../index-nrPtQ1dv.js";
 import "../../../SelectListbox/SelectListbox.js";
 import "../../../SelectListbox/SelectProvider.js";
 import "../../../Sortable/components/SortableItem.js";
-import "../../../../SortableProvider-CwX1lFMa.js";
+import "../../../../SortableProvider-DisCfTTN.js";
 export {
   F as TablePlugin
 };

package/dist/components/RteEditor/Plugins/TablePlugin/helpers.js

@@ -1,27 +1,27 @@
-import { H as d, R as h, B as m, Z as x, z as w, P as S, v as C, K as p, L as E } from "../../../../LexicalTable.prod-BSjs04iE.js";
-import { P as u } from "../../../../Lexical.prod-UwAbgYpF.js";
+import { H as d, R as h, B as m, Z as x, z as w, P as S, v as C, K as p, L as E } from "../../../../LexicalTable.prod-9xjyWB0C.js";
+import { P as u } from "../../../../Lexical.prod-B84LhBo3.js";
 const b = 100, D = (e, n) => {
   const t = E(0, 0, !1);
   for (let o = 0; o < e; o++) {
-    const r = p();
+    const s = p();
     for (let l = 0; l < n; l++) {
-      const s = C(0, void 0, b / n);
-      s.append(u()), r.append(s);
+      const r = C(0, void 0, b / n);
+      r.append(u()), s.append(r);
     }
-    t.append(r);
+    t.append(s);
   }
   return t;
 }, A = (e) => {
   const n = w(e), t = n.getNextSibling() || n.getPreviousSibling(), o = n.getParentOrThrow();
   if (o.getChildrenSize() > 1 ? n.remove() : o.remove(), t !== null) {
-    const r = t.getFirstDescendant();
-    r && r.select();
+    const s = t.getFirstDescendant();
+    s && s.select();
   }
 }, I = (e) => {
   d(e).remove();
 }, B = (e, n) => {
-  const t = p(), o = w(e), r = o.getChildrenSize();
-  for (let s = 0; s < r; s++) {
+  const t = p(), o = w(e), s = o.getChildrenSize();
+  for (let r = 0; r < s; r++) {
     const c = C(0);
     c.append(u()), t.append(c);
   }
@@ -32,27 +32,26 @@ const b = 100, D = (e, n) => {
   const t = w(e);
   if (!h(e))
     throw new Error("Selected node is not a TableCellNode");
-  const o = S(e), r = t.getChildren().length, l = d(e);
-  let s = m(e);
+  const o = S(e), s = t.getChildren().length, l = d(e);
+  let r = m(e);
   const c = l.getChildren(), R = c.length;
   for (let i = 0; i < R; i++) {
     const a = C(0);
     a.append(u());
-    const f = c[i].getChildren()[s];
+    const f = c[i].getChildren()[r];
     f && (n === "insertColumnLeft" ? f.insertBefore(a) : f.insertAfter(a)), c.forEach((T) => {
       T.getChildren().forEach((v) => {
-        v.setWidth(b / r);
+        v.setWidth(b / s);
       });
     });
   }
-  s = n === "insertColumnLeft" ? s : s + 1;
-  const g = c[o].getChildren()[s];
+  r = n === "insertColumnLeft" ? r : r + 1;
+  const g = c[o].getChildren()[r];
   g && g.select();
 }, O = (e) => {
-  var r;
   if (!h(e))
     throw new Error("Selected node is not a TableCellNode");
-  const n = d(e), t = ((r = n.getFirstChild()) == null ? void 0 : r.getChildrenSize()) || 0, o = m(e);
+  const n = d(e), t = n.getFirstChild()?.getChildrenSize() || 0, o = m(e);
   t === 1 ? I(e) : x(n, o);
 };
 export {

package/dist/components/RteEditor/Plugins/TablePlugin/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sources":["../../../../../src/components/RteEditor/Plugins/TablePlugin/helpers.ts"],"sourcesContent":["import {\n  $createTableNodeWithDimensions,\n  $createTableRowNode,\n  $createTableCellNode,\n  $deleteTableColumn,\n  $isTableCellNode,\n  $getTableNodeFromLexicalNodeOrThrow,\n  $getTableRowNodeFromTableCellNodeOrThrow,\n  $getTableRowIndexFromTableCellNode,\n  $getTableColumnIndexFromTableCellNode,\n} from '@lexical/table';\nimport { type TextNode, type ElementNode, $createParagraphNode } from 'lexical';\n\nimport type { TableCellNode } from '@lexical/table';\n\nconst PERCENTAGE = 100;\n\nexport const createTable = (nrOfRows: number, nrOfColumns: number): ElementNode => {\n  const tableNode = $createTableNodeWithDimensions(0, 0, false);\n  for (let rowIndex = 0; rowIndex < nrOfRows; rowIndex++) {\n    const rowNode = $createTableRowNode();\n    for (let colIndex = 0; colIndex < nrOfColumns; colIndex++) {\n      const cellNode = $createTableCellNode(0, undefined, PERCENTAGE / nrOfColumns);\n      cellNode.append($createParagraphNode());\n      rowNode.append(cellNode);\n    }\n    tableNode.append(rowNode);\n  }\n  return tableNode;\n};\n\nexport const deleteRow = (selectedNode: ElementNode) => {\n  const currentRow = $getTableRowNodeFromTableCellNodeOrThrow(selectedNode);\n  const nextRow = currentRow.getNextSibling() || currentRow.getPreviousSibling();\n  const currentTable = currentRow.getParentOrThrow();\n  currentTable.getChildrenSize() > 1 ? currentRow.remove() : currentTable.remove();\n\n  if (nextRow !== null) {\n    const firstDescendant = (nextRow as ElementNode).getFirstDescendant();\n    if (firstDescendant) {\n      (firstDescendant as TextNode).select();\n    }\n  }\n};\n\nexport const deleteTable = (selectedNode: ElementNode) => {\n  $getTableNodeFromLexicalNodeOrThrow(selectedNode).remove();\n};\n\nexport const insertRow = (selectedNode: ElementNode, position: 'insertRowAbove' | 'insertRowBelow') => {\n  const newRow = $createTableRowNode();\n  const currentRow = $getTableRowNodeFromTableCellNodeOrThrow(selectedNode);\n  const nrOfCols = currentRow.getChildrenSize();\n  for (let rowCount = 0; rowCount < nrOfCols; rowCount++) {\n    const newCell = $createTableCellNode(0);\n    newCell.append($createParagraphNode());\n    newRow.append(newCell);\n  }\n  position === 'insertRowAbove' ? currentRow.insertBefore(newRow) : currentRow.insertAfter(newRow);\n  const firstDescendant = newRow.getFirstDescendant();\n  if (firstDescendant) {\n    (firstDescendant as TextNode).select();\n  }\n};\n\nexport const insertColumn = (selectedNode: ElementNode, position: 'insertColumnLeft' | 'insertColumnRight') => {\n  const currentRow = $getTableRowNodeFromTableCellNodeOrThrow(selectedNode);\n  if (!$isTableCellNode(selectedNode)) {\n    throw new Error('Selected node is not a TableCellNode');\n  }\n  const rowIndex = $getTableRowIndexFromTableCellNode(selectedNode);\n  const nrOfCols = currentRow.getChildren().length;\n  const currentTable = $getTableNodeFromLexicalNodeOrThrow(selectedNode);\n  let columnIndex = $getTableColumnIndexFromTableCellNode(selectedNode);\n  const rowsInTable: TableCellNode[] = currentTable.getChildren();\n  const nrOfRows = rowsInTable.length;\n\n  for (let rowCount = 0; rowCount < nrOfRows; rowCount++) {\n    const newCell = $createTableCellNode(0);\n    newCell.append($createParagraphNode());\n    const cellInSelectedColumn = rowsInTable[rowCount].getChildren()[columnIndex];\n    if (cellInSelectedColumn) {\n      if (position === 'insertColumnLeft') {\n        cellInSelectedColumn.insertBefore(newCell);\n      } else {\n        cellInSelectedColumn.insertAfter(newCell);\n      }\n    }\n\n    rowsInTable.forEach((row) => {\n      row.getChildren().forEach((cell) => {\n        (cell as TableCellNode).setWidth(PERCENTAGE / nrOfCols);\n      });\n    });\n  }\n\n  columnIndex = position === 'insertColumnLeft' ? columnIndex : columnIndex + 1;\n  const firstDescendant = rowsInTable[rowIndex].getChildren()[columnIndex];\n  if (firstDescendant) {\n    (firstDescendant as TextNode).select();\n  }\n};\n\nexport const deleteColumn = (selectedNode: ElementNode) => {\n  if (!$isTableCellNode(selectedNode)) {\n    throw new Error('Selected node is not a TableCellNode');\n  }\n  const currentTable = $getTableNodeFromLexicalNodeOrThrow(selectedNode);\n  const numberOfColumns = (currentTable.getFirstChild() as ElementNode)?.getChildrenSize() || 0;\n  const columnIndex = $getTableColumnIndexFromTableCellNode(selectedNode);\n\n  if (numberOfColumns === 1) {\n    deleteTable(selectedNode);\n  } else {\n    $deleteTableColumn(currentTable, columnIndex);\n  }\n};\n"],"names":["PERCENTAGE","createTable","nrOfRows","nrOfColumns","tableNode","$createTableNodeWithDimensions","rowIndex","rowNode","$createTableRowNode","colIndex","cellNode","$createTableCellNode","$createParagraphNode","deleteRow","selectedNode","currentRow","$getTableRowNodeFromTableCellNodeOrThrow","nextRow","currentTable","firstDescendant","deleteTable","$getTableNodeFromLexicalNodeOrThrow","insertRow","position","newRow","nrOfCols","rowCount","newCell","insertColumn","$isTableCellNode","$getTableRowIndexFromTableCellNode","columnIndex","$getTableColumnIndexFromTableCellNode","rowsInTable","cellInSelectedColumn","row","cell","deleteColumn","numberOfColumns","_a","$deleteTableColumn"],"mappings":"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"}
+{"version":3,"file":"helpers.js","sources":["../../../../../src/components/RteEditor/Plugins/TablePlugin/helpers.ts"],"sourcesContent":["import {\n  $createTableNodeWithDimensions,\n  $createTableRowNode,\n  $createTableCellNode,\n  $deleteTableColumn,\n  $isTableCellNode,\n  $getTableNodeFromLexicalNodeOrThrow,\n  $getTableRowNodeFromTableCellNodeOrThrow,\n  $getTableRowIndexFromTableCellNode,\n  $getTableColumnIndexFromTableCellNode,\n} from '@lexical/table';\nimport { type TextNode, type ElementNode, $createParagraphNode } from 'lexical';\n\nimport type { TableCellNode } from '@lexical/table';\n\nconst PERCENTAGE = 100;\n\nexport const createTable = (nrOfRows: number, nrOfColumns: number): ElementNode => {\n  const tableNode = $createTableNodeWithDimensions(0, 0, false);\n  for (let rowIndex = 0; rowIndex < nrOfRows; rowIndex++) {\n    const rowNode = $createTableRowNode();\n    for (let colIndex = 0; colIndex < nrOfColumns; colIndex++) {\n      const cellNode = $createTableCellNode(0, undefined, PERCENTAGE / nrOfColumns);\n      cellNode.append($createParagraphNode());\n      rowNode.append(cellNode);\n    }\n    tableNode.append(rowNode);\n  }\n  return tableNode;\n};\n\nexport const deleteRow = (selectedNode: ElementNode) => {\n  const currentRow = $getTableRowNodeFromTableCellNodeOrThrow(selectedNode);\n  const nextRow = currentRow.getNextSibling() || currentRow.getPreviousSibling();\n  const currentTable = currentRow.getParentOrThrow();\n  currentTable.getChildrenSize() > 1 ? currentRow.remove() : currentTable.remove();\n\n  if (nextRow !== null) {\n    const firstDescendant = (nextRow as ElementNode).getFirstDescendant();\n    if (firstDescendant) {\n      (firstDescendant as TextNode).select();\n    }\n  }\n};\n\nexport const deleteTable = (selectedNode: ElementNode) => {\n  $getTableNodeFromLexicalNodeOrThrow(selectedNode).remove();\n};\n\nexport const insertRow = (selectedNode: ElementNode, position: 'insertRowAbove' | 'insertRowBelow') => {\n  const newRow = $createTableRowNode();\n  const currentRow = $getTableRowNodeFromTableCellNodeOrThrow(selectedNode);\n  const nrOfCols = currentRow.getChildrenSize();\n  for (let rowCount = 0; rowCount < nrOfCols; rowCount++) {\n    const newCell = $createTableCellNode(0);\n    newCell.append($createParagraphNode());\n    newRow.append(newCell);\n  }\n  position === 'insertRowAbove' ? currentRow.insertBefore(newRow) : currentRow.insertAfter(newRow);\n  const firstDescendant = newRow.getFirstDescendant();\n  if (firstDescendant) {\n    (firstDescendant as TextNode).select();\n  }\n};\n\nexport const insertColumn = (selectedNode: ElementNode, position: 'insertColumnLeft' | 'insertColumnRight') => {\n  const currentRow = $getTableRowNodeFromTableCellNodeOrThrow(selectedNode);\n  if (!$isTableCellNode(selectedNode)) {\n    throw new Error('Selected node is not a TableCellNode');\n  }\n  const rowIndex = $getTableRowIndexFromTableCellNode(selectedNode);\n  const nrOfCols = currentRow.getChildren().length;\n  const currentTable = $getTableNodeFromLexicalNodeOrThrow(selectedNode);\n  let columnIndex = $getTableColumnIndexFromTableCellNode(selectedNode);\n  const rowsInTable: TableCellNode[] = currentTable.getChildren();\n  const nrOfRows = rowsInTable.length;\n\n  for (let rowCount = 0; rowCount < nrOfRows; rowCount++) {\n    const newCell = $createTableCellNode(0);\n    newCell.append($createParagraphNode());\n    const cellInSelectedColumn = rowsInTable[rowCount].getChildren()[columnIndex];\n    if (cellInSelectedColumn) {\n      if (position === 'insertColumnLeft') {\n        cellInSelectedColumn.insertBefore(newCell);\n      } else {\n        cellInSelectedColumn.insertAfter(newCell);\n      }\n    }\n\n    rowsInTable.forEach((row) => {\n      row.getChildren().forEach((cell) => {\n        (cell as TableCellNode).setWidth(PERCENTAGE / nrOfCols);\n      });\n    });\n  }\n\n  columnIndex = position === 'insertColumnLeft' ? columnIndex : columnIndex + 1;\n  const firstDescendant = rowsInTable[rowIndex].getChildren()[columnIndex];\n  if (firstDescendant) {\n    (firstDescendant as TextNode).select();\n  }\n};\n\nexport const deleteColumn = (selectedNode: ElementNode) => {\n  if (!$isTableCellNode(selectedNode)) {\n    throw new Error('Selected node is not a TableCellNode');\n  }\n  const currentTable = $getTableNodeFromLexicalNodeOrThrow(selectedNode);\n  const numberOfColumns = (currentTable.getFirstChild() as ElementNode)?.getChildrenSize() || 0;\n  const columnIndex = $getTableColumnIndexFromTableCellNode(selectedNode);\n\n  if (numberOfColumns === 1) {\n    deleteTable(selectedNode);\n  } else {\n    $deleteTableColumn(currentTable, columnIndex);\n  }\n};\n"],"names":["PERCENTAGE","createTable","nrOfRows","nrOfColumns","tableNode","$createTableNodeWithDimensions","rowIndex","rowNode","$createTableRowNode","colIndex","cellNode","$createTableCellNode","$createParagraphNode","deleteRow","selectedNode","currentRow","$getTableRowNodeFromTableCellNodeOrThrow","nextRow","currentTable","firstDescendant","deleteTable","$getTableNodeFromLexicalNodeOrThrow","insertRow","position","newRow","nrOfCols","rowCount","newCell","insertColumn","$isTableCellNode","$getTableRowIndexFromTableCellNode","columnIndex","$getTableColumnIndexFromTableCellNode","rowsInTable","cellInSelectedColumn","row","cell","deleteColumn","numberOfColumns","$deleteTableColumn"],"mappings":"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"}

package/dist/components/RteEditor/Plugins/TablePlugin/index.js

@@ -1,4 +1,4 @@
-import { T as o } from "../../../../TablePlugin-NmJsn2fm.js";
+import { T as o } from "../../../../TablePlugin-oF-gInNx.js";
 import { TableCellContextMenu as t } from "./TableCellContextMenu/TableCellContextMenu.js";
 export {
   t as TableCellContextMenu,

package/dist/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.js

@@ -1,50 +1,49 @@
 import { jsxs as P, jsx as n } from "react/jsx-runtime";
 import { o as y } from "../../../../LexicalComposerContext.prod-DLlRM5wP.js";
-import { N as h, c as g, m as C } from "../../../../Lexical.prod-UwAbgYpF.js";
-import { useState as L, useRef as E, useCallback as N, useEffect as m } from "react";
-import { W as b } from "../../../../LexicalTable.prod-BSjs04iE.js";
+import { N as p, c as h, m as C } from "../../../../Lexical.prod-B84LhBo3.js";
+import { useState as L, useRef as E, useCallback as N, useEffect as c } from "react";
+import { W as g } from "../../../../LexicalTable.prod-9xjyWB0C.js";
 import { BlockFormatPlugin as T } from "../BlockFormatPlugin/BlockFormatPlugin.js";
 import { ListPlugin as k } from "../ListPlugin/ListPlugin.js";
 import { LinkPlugin as x } from "../LinkPlugin/LinkPlugin.js";
 import { HistoryPlugin as B } from "../HistoryPlugin/HistoryPlugin.js";
-import { T as S } from "../../../../TablePlugin-NmJsn2fm.js";
+import { T as S } from "../../../../TablePlugin-oF-gInNx.js";
 import { TableCellContextMenu as z } from "../TablePlugin/TableCellContextMenu/TableCellContextMenu.js";
 import { s as A } from "../../../../RteEditor.module-B_3uFnFu.js";
-import { setScrollableContainers as w, removeScrollableContainers as K } from "../../helpers.js";
-const O = ({ editorScrollPosition: d }) => {
-  const [t] = y(), [i, s] = L(null), u = E(null), f = N(() => {
-    const e = h();
-    if (g(e)) {
-      const l = e.anchor.getNode(), a = b(l);
-      if (a) {
-        const p = t.getElementByKey(a.getKey()), c = p ? p.getBoundingClientRect() : { right: 0, bottom: 0, height: 0 };
-        s({ xPos: c.right, yPos: c.bottom, height: c.height });
+import { setScrollableContainers as b, removeScrollableContainers as K } from "../../helpers.js";
+const O = ({ editorScrollPosition: m }) => {
+  const [t] = y(), [r, i] = L(null), d = E(null), u = N(() => {
+    const e = p();
+    if (h(e)) {
+      const s = e.anchor.getNode(), l = g(s);
+      if (l) {
+        const f = t.getElementByKey(l.getKey()), a = f ? f.getBoundingClientRect() : { right: 0, bottom: 0, height: 0 };
+        i({ xPos: a.right, yPos: a.bottom, height: a.height });
       } else
-        s(null);
+        i(null);
     }
-  }, [t]), v = (e) => {
-    var r;
-    (r = u.current) == null || r.mutateTable(e);
+  }, [t]), w = (e) => {
+    d.current?.mutateTable(e);
   }, o = () => {
     t.update(() => {
-      const e = h();
-      if (g(e)) {
-        const l = e.anchor.getNode();
-        b(l) && (C(null), s(null));
+      const e = p();
+      if (h(e)) {
+        const s = e.anchor.getNode();
+        g(s) && (C(null), i(null));
       }
     });
   };
-  return m(() => {
+  return c(() => {
     t.registerUpdateListener(({ editorState: e }) => {
       e.read(() => {
-        f();
+        u();
       });
     });
-  }, [t, f]), m(() => (w(o), window.addEventListener("scroll", o), window.addEventListener("resize", o), () => {
+  }, [t, u]), c(() => (b(o), window.addEventListener("scroll", o), window.addEventListener("resize", o), () => {
     window.removeEventListener("scroll", o), window.removeEventListener("resize", o), K(o);
-  }), [t]), m(() => {
+  }), [t]), c(() => {
     const e = () => {
-      w(o);
+      b(o);
     };
     return window.addEventListener("keydown", e, { capture: !0 }), () => {
       window.removeEventListener("keydown", e);
@@ -52,16 +51,16 @@ const O = ({ editorScrollPosition: d }) => {
   }, []), /* @__PURE__ */ P("div", { className: A.editor__toolbar, children: [
     /* @__PURE__ */ n(T, {}),
     /* @__PURE__ */ n(k, {}),
-    /* @__PURE__ */ n(S, { isActive: !!i, ref: u }),
-    i && /* @__PURE__ */ n(
+    /* @__PURE__ */ n(S, { isActive: !!r, ref: d }),
+    r && /* @__PURE__ */ n(
       z,
       {
-        position: i,
-        parentScrollPosition: d,
-        onAction: v
+        position: r,
+        parentScrollPosition: m,
+        onAction: w
       }
     ),
-    /* @__PURE__ */ n(x, { parentScrollPosition: d }),
+    /* @__PURE__ */ n(x, { parentScrollPosition: m }),
     /* @__PURE__ */ n(B, {})
   ] });
 };

package/dist/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarPlugin.js","sources":["../../../../../src/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.tsx"],"sourcesContent":["import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport { $getSelection, $isRangeSelection, $setSelection } from 'lexical';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport { $getTableCellNodeFromLexicalNode } from '@lexical/table';\n\nimport type { JSX } from 'react';\nimport type { Actions } from 'components/RteEditor/Plugins/TablePlugin/TableCellContextMenu/TableCellContextMenu';\nimport type { TableMutation } from 'components/RteEditor/Plugins/TablePlugin/TablePlugin';\n\nimport {\n  LinkPlugin,\n  BlockFormatPlugin,\n  ListPlugin,\n  HistoryPlugin,\n  TablePlugin,\n  TableCellContextMenu,\n} from 'components/RteEditor/Plugins';\nimport styles from 'components/RteEditor/RteEditor.module.css';\nimport { removeScrollableContainers, setScrollableContainers } from 'components/RteEditor/helpers';\n\nexport type Position = {\n  xPos: number;\n  yPos: number;\n  height: number;\n};\n\ninterface ToolBarProps {\n  editorScrollPosition: number;\n}\n\nexport const ToolBarPlugin = ({ editorScrollPosition }: ToolBarProps): JSX.Element => {\n  const [editor] = useLexicalComposerContext();\n  const [position, setPosition] = useState<Position | null>(null);\n  const tableref = useRef<TableMutation>(null);\n\n  const updateToolbar = useCallback(() => {\n    const selection = $getSelection();\n    if ($isRangeSelection(selection)) {\n      const anchor = selection.anchor;\n      const anchorNode = anchor.getNode();\n\n      const tableCell = $getTableCellNodeFromLexicalNode(anchorNode);\n      if (tableCell) {\n        const domNode = editor.getElementByKey(tableCell.getKey());\n        const position = domNode ? domNode.getBoundingClientRect() : { right: 0, bottom: 0, height: 0 };\n        setPosition({ xPos: position.right, yPos: position.bottom, height: position.height });\n      } else {\n        setPosition(null);\n      }\n    }\n  }, [editor]);\n\n  const handleTableAction = (action: Actions) => {\n    tableref.current?.mutateTable(action);\n  };\n\n  const handleResizeScroll = () => {\n    editor.update(() => {\n      const selection = $getSelection();\n\n      if ($isRangeSelection(selection)) {\n        const anchor = selection.anchor;\n        const anchorNode = anchor.getNode();\n\n        const tableCell = $getTableCellNodeFromLexicalNode(anchorNode);\n        if (tableCell) {\n          $setSelection(null);\n          setPosition(null);\n        }\n      }\n    });\n  };\n\n  useEffect(() => {\n    editor.registerUpdateListener(({ editorState }) => {\n      editorState.read(() => {\n        updateToolbar();\n      });\n    });\n  }, [editor, updateToolbar]);\n\n  useEffect(() => {\n    setScrollableContainers(handleResizeScroll);\n\n    window.addEventListener('scroll', handleResizeScroll);\n    window.addEventListener('resize', handleResizeScroll);\n\n    return () => {\n      window.removeEventListener('scroll', handleResizeScroll);\n      window.removeEventListener('resize', handleResizeScroll);\n      removeScrollableContainers(handleResizeScroll);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [editor]);\n\n  useEffect(() => {\n    const removeKeydown = () => {\n      setScrollableContainers(handleResizeScroll);\n    };\n\n    window.addEventListener('keydown', removeKeydown, { capture: true });\n\n    return () => {\n      window.removeEventListener('keydown', removeKeydown);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div className={styles['editor__toolbar']}>\n      <BlockFormatPlugin />\n      <ListPlugin />\n      <TablePlugin isActive={Boolean(position)} ref={tableref} />\n      {position && (\n        <TableCellContextMenu\n          position={position}\n          parentScrollPosition={editorScrollPosition}\n          onAction={handleTableAction}\n        />\n      )}\n      <LinkPlugin parentScrollPosition={editorScrollPosition} />\n      <HistoryPlugin />\n    </div>\n  );\n};\n"],"names":["ToolBarPlugin","editorScrollPosition","editor","useLexicalComposerContext","position","setPosition","useState","tableref","useRef","updateToolbar","useCallback","selection","$getSelection","$isRangeSelection","anchorNode","tableCell","$getTableCellNodeFromLexicalNode","domNode","handleTableAction","action","_a","handleResizeScroll","$setSelection","useEffect","editorState","setScrollableContainers","removeScrollableContainers","removeKeydown","jsxs","styles","jsx","BlockFormatPlugin","ListPlugin","TablePlugin","TableCellContextMenu","LinkPlugin","HistoryPlugin"],"mappings":";;;;;;;;;;;;;AA8BO,MAAMA,IAAgB,CAAC,EAAE,sBAAAC,QAAsD;AACpF,QAAM,CAACC,CAAM,IAAIC,EAAA,GACX,CAACC,GAAUC,CAAW,IAAIC,EAA0B,IAAI,GACxDC,IAAWC,EAAsB,IAAI,GAErCC,IAAgBC,EAAY,MAAM;AACtC,UAAMC,IAAYC,EAAA;AAClB,QAAIC,EAAkBF,CAAS,GAAG;AAEhC,YAAMG,IADSH,EAAU,OACC,QAAA,GAEpBI,IAAYC,EAAiCF,CAAU;AAC7D,UAAIC,GAAW;AACb,cAAME,IAAUf,EAAO,gBAAgBa,EAAU,QAAQ,GACnDX,IAAWa,IAAUA,EAAQ,sBAAA,IAA0B,EAAE,OAAO,GAAG,QAAQ,GAAG,QAAQ,EAAA;AAC5F,QAAAZ,EAAY,EAAE,MAAMD,EAAS,OAAO,MAAMA,EAAS,QAAQ,QAAQA,EAAS,OAAA,CAAQ;AAAA,MAAA;AAEpF,QAAAC,EAAY,IAAI;AAAA,IAClB;AAAA,EACF,GACC,CAACH,CAAM,CAAC,GAELgB,IAAoB,CAACC,MAAoB;;AAC7C,KAAAC,IAAAb,EAAS,YAAT,QAAAa,EAAkB,YAAYD;AAAA,EAAM,GAGhCE,IAAqB,MAAM;AAC/B,IAAAnB,EAAO,OAAO,MAAM;AAClB,YAAMS,IAAYC,EAAA;AAElB,UAAIC,EAAkBF,CAAS,GAAG;AAEhC,cAAMG,IADSH,EAAU,OACC,QAAA;AAG1B,QADkBK,EAAiCF,CAAU,MAE3DQ,EAAc,IAAI,GAClBjB,EAAY,IAAI;AAAA,MAClB;AAAA,IACF,CACD;AAAA,EAAA;AAGH,SAAAkB,EAAU,MAAM;AACd,IAAArB,EAAO,uBAAuB,CAAC,EAAE,aAAAsB,QAAkB;AACjD,MAAAA,EAAY,KAAK,MAAM;AACrB,QAAAf,EAAA;AAAA,MAAc,CACf;AAAA,IAAA,CACF;AAAA,EAAA,GACA,CAACP,GAAQO,CAAa,CAAC,GAE1Bc,EAAU,OACRE,EAAwBJ,CAAkB,GAE1C,OAAO,iBAAiB,UAAUA,CAAkB,GACpD,OAAO,iBAAiB,UAAUA,CAAkB,GAE7C,MAAM;AACX,WAAO,oBAAoB,UAAUA,CAAkB,GACvD,OAAO,oBAAoB,UAAUA,CAAkB,GACvDK,EAA2BL,CAAkB;AAAA,EAAA,IAG9C,CAACnB,CAAM,CAAC,GAEXqB,EAAU,MAAM;AACd,UAAMI,IAAgB,MAAM;AAC1B,MAAAF,EAAwBJ,CAAkB;AAAA,IAAA;AAG5C,kBAAO,iBAAiB,WAAWM,GAAe,EAAE,SAAS,IAAM,GAE5D,MAAM;AACX,aAAO,oBAAoB,WAAWA,CAAa;AAAA,IAAA;AAAA,EACrD,GAEC,EAAE,GAGH,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,iBACrB,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAkB;AAAA,sBAClBC,GAAA,EAAW;AAAA,sBACXC,GAAA,EAAY,UAAU,EAAQ7B,GAAW,KAAKG,GAAU;AAAA,IACxDH,KACC,gBAAA0B;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,UAAA9B;AAAA,QACA,sBAAsBH;AAAA,QACtB,UAAUiB;AAAA,MAAA;AAAA,IAAA;AAAA,IAGd,gBAAAY,EAACK,GAAA,EAAW,sBAAsBlC,EAAA,CAAsB;AAAA,sBACvDmC,GAAA,CAAA,CAAc;AAAA,EAAA,GACjB;AAEJ;"}
+{"version":3,"file":"ToolbarPlugin.js","sources":["../../../../../src/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.tsx"],"sourcesContent":["import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport { $getSelection, $isRangeSelection, $setSelection } from 'lexical';\nimport { useCallback, useEffect, useRef, useState } from 'react';\nimport { $getTableCellNodeFromLexicalNode } from '@lexical/table';\n\nimport type { JSX } from 'react';\nimport type { Actions } from 'components/RteEditor/Plugins/TablePlugin/TableCellContextMenu/TableCellContextMenu';\nimport type { TableMutation } from 'components/RteEditor/Plugins/TablePlugin/TablePlugin';\n\nimport {\n  LinkPlugin,\n  BlockFormatPlugin,\n  ListPlugin,\n  HistoryPlugin,\n  TablePlugin,\n  TableCellContextMenu,\n} from 'components/RteEditor/Plugins';\nimport styles from 'components/RteEditor/RteEditor.module.css';\nimport { removeScrollableContainers, setScrollableContainers } from 'components/RteEditor/helpers';\n\nexport type Position = {\n  xPos: number;\n  yPos: number;\n  height: number;\n};\n\ninterface ToolBarProps {\n  editorScrollPosition: number;\n}\n\nexport const ToolBarPlugin = ({ editorScrollPosition }: ToolBarProps): JSX.Element => {\n  const [editor] = useLexicalComposerContext();\n  const [position, setPosition] = useState<Position | null>(null);\n  const tableref = useRef<TableMutation>(null);\n\n  const updateToolbar = useCallback(() => {\n    const selection = $getSelection();\n    if ($isRangeSelection(selection)) {\n      const anchor = selection.anchor;\n      const anchorNode = anchor.getNode();\n\n      const tableCell = $getTableCellNodeFromLexicalNode(anchorNode);\n      if (tableCell) {\n        const domNode = editor.getElementByKey(tableCell.getKey());\n        const position = domNode ? domNode.getBoundingClientRect() : { right: 0, bottom: 0, height: 0 };\n        setPosition({ xPos: position.right, yPos: position.bottom, height: position.height });\n      } else {\n        setPosition(null);\n      }\n    }\n  }, [editor]);\n\n  const handleTableAction = (action: Actions) => {\n    tableref.current?.mutateTable(action);\n  };\n\n  const handleResizeScroll = () => {\n    editor.update(() => {\n      const selection = $getSelection();\n\n      if ($isRangeSelection(selection)) {\n        const anchor = selection.anchor;\n        const anchorNode = anchor.getNode();\n\n        const tableCell = $getTableCellNodeFromLexicalNode(anchorNode);\n        if (tableCell) {\n          $setSelection(null);\n          setPosition(null);\n        }\n      }\n    });\n  };\n\n  useEffect(() => {\n    editor.registerUpdateListener(({ editorState }) => {\n      editorState.read(() => {\n        updateToolbar();\n      });\n    });\n  }, [editor, updateToolbar]);\n\n  useEffect(() => {\n    setScrollableContainers(handleResizeScroll);\n\n    window.addEventListener('scroll', handleResizeScroll);\n    window.addEventListener('resize', handleResizeScroll);\n\n    return () => {\n      window.removeEventListener('scroll', handleResizeScroll);\n      window.removeEventListener('resize', handleResizeScroll);\n      removeScrollableContainers(handleResizeScroll);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [editor]);\n\n  useEffect(() => {\n    const removeKeydown = () => {\n      setScrollableContainers(handleResizeScroll);\n    };\n\n    window.addEventListener('keydown', removeKeydown, { capture: true });\n\n    return () => {\n      window.removeEventListener('keydown', removeKeydown);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div className={styles['editor__toolbar']}>\n      <BlockFormatPlugin />\n      <ListPlugin />\n      <TablePlugin isActive={Boolean(position)} ref={tableref} />\n      {position && (\n        <TableCellContextMenu\n          position={position}\n          parentScrollPosition={editorScrollPosition}\n          onAction={handleTableAction}\n        />\n      )}\n      <LinkPlugin parentScrollPosition={editorScrollPosition} />\n      <HistoryPlugin />\n    </div>\n  );\n};\n"],"names":["ToolBarPlugin","editorScrollPosition","editor","useLexicalComposerContext","position","setPosition","useState","tableref","useRef","updateToolbar","useCallback","selection","$getSelection","$isRangeSelection","anchorNode","tableCell","$getTableCellNodeFromLexicalNode","domNode","handleTableAction","action","handleResizeScroll","$setSelection","useEffect","editorState","setScrollableContainers","removeScrollableContainers","removeKeydown","jsxs","styles","jsx","BlockFormatPlugin","ListPlugin","TablePlugin","TableCellContextMenu","LinkPlugin","HistoryPlugin"],"mappings":";;;;;;;;;;;;;AA8BO,MAAMA,IAAgB,CAAC,EAAE,sBAAAC,QAAsD;AACpF,QAAM,CAACC,CAAM,IAAIC,EAAA,GACX,CAACC,GAAUC,CAAW,IAAIC,EAA0B,IAAI,GACxDC,IAAWC,EAAsB,IAAI,GAErCC,IAAgBC,EAAY,MAAM;AACtC,UAAMC,IAAYC,EAAA;AAClB,QAAIC,EAAkBF,CAAS,GAAG;AAEhC,YAAMG,IADSH,EAAU,OACC,QAAA,GAEpBI,IAAYC,EAAiCF,CAAU;AAC7D,UAAIC,GAAW;AACb,cAAME,IAAUf,EAAO,gBAAgBa,EAAU,QAAQ,GACnDX,IAAWa,IAAUA,EAAQ,sBAAA,IAA0B,EAAE,OAAO,GAAG,QAAQ,GAAG,QAAQ,EAAA;AAC5F,QAAAZ,EAAY,EAAE,MAAMD,EAAS,OAAO,MAAMA,EAAS,QAAQ,QAAQA,EAAS,OAAA,CAAQ;AAAA,MAAA;AAEpF,QAAAC,EAAY,IAAI;AAAA,IAClB;AAAA,EACF,GACC,CAACH,CAAM,CAAC,GAELgB,IAAoB,CAACC,MAAoB;AAC7C,IAAAZ,EAAS,SAAS,YAAYY,CAAM;AAAA,EAAA,GAGhCC,IAAqB,MAAM;AAC/B,IAAAlB,EAAO,OAAO,MAAM;AAClB,YAAMS,IAAYC,EAAA;AAElB,UAAIC,EAAkBF,CAAS,GAAG;AAEhC,cAAMG,IADSH,EAAU,OACC,QAAA;AAG1B,QADkBK,EAAiCF,CAAU,MAE3DO,EAAc,IAAI,GAClBhB,EAAY,IAAI;AAAA,MAClB;AAAA,IACF,CACD;AAAA,EAAA;AAGH,SAAAiB,EAAU,MAAM;AACd,IAAApB,EAAO,uBAAuB,CAAC,EAAE,aAAAqB,QAAkB;AACjD,MAAAA,EAAY,KAAK,MAAM;AACrB,QAAAd,EAAA;AAAA,MAAc,CACf;AAAA,IAAA,CACF;AAAA,EAAA,GACA,CAACP,GAAQO,CAAa,CAAC,GAE1Ba,EAAU,OACRE,EAAwBJ,CAAkB,GAE1C,OAAO,iBAAiB,UAAUA,CAAkB,GACpD,OAAO,iBAAiB,UAAUA,CAAkB,GAE7C,MAAM;AACX,WAAO,oBAAoB,UAAUA,CAAkB,GACvD,OAAO,oBAAoB,UAAUA,CAAkB,GACvDK,EAA2BL,CAAkB;AAAA,EAAA,IAG9C,CAAClB,CAAM,CAAC,GAEXoB,EAAU,MAAM;AACd,UAAMI,IAAgB,MAAM;AAC1B,MAAAF,EAAwBJ,CAAkB;AAAA,IAAA;AAG5C,kBAAO,iBAAiB,WAAWM,GAAe,EAAE,SAAS,IAAM,GAE5D,MAAM;AACX,aAAO,oBAAoB,WAAWA,CAAa;AAAA,IAAA;AAAA,EACrD,GAEC,EAAE,GAGH,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,iBACrB,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAkB;AAAA,sBAClBC,GAAA,EAAW;AAAA,sBACXC,GAAA,EAAY,UAAU,EAAQ5B,GAAW,KAAKG,GAAU;AAAA,IACxDH,KACC,gBAAAyB;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,UAAA7B;AAAA,QACA,sBAAsBH;AAAA,QACtB,UAAUiB;AAAA,MAAA;AAAA,IAAA;AAAA,IAGd,gBAAAW,EAACK,GAAA,EAAW,sBAAsBjC,EAAA,CAAsB;AAAA,sBACvDkC,GAAA,CAAA,CAAc;AAAA,EAAA,GACjB;AAEJ;"}

package/dist/components/RteEditor/Plugins/index.js

@@ -3,7 +3,7 @@ import { BlockFormatPlugin as l } from "./BlockFormatPlugin/BlockFormatPlugin.js
 import { ListPlugin as n } from "./ListPlugin/ListPlugin.js";
 import { LinkPlugin as m, getLinkNodeTag as x } from "./LinkPlugin/LinkPlugin.js";
 import { HistoryPlugin as p } from "./HistoryPlugin/HistoryPlugin.js";
-import { T as a } from "../../../TablePlugin-NmJsn2fm.js";
+import { T as a } from "../../../TablePlugin-oF-gInNx.js";
 import { TableCellContextMenu as T } from "./TablePlugin/TableCellContextMenu/TableCellContextMenu.js";
 export {
   l as BlockFormatPlugin,

package/dist/components/RteEditor/RteEditor.js

@@ -1,22 +1,22 @@
 import { jsx as h, jsxs as K, Fragment as Re } from "react/jsx-runtime";
 import { t as Xe, r as Ge, o as T } from "../../LexicalComposerContext.prod-DLlRM5wP.js";
-import { aG as Ie, af as A, P as Fe, N as p, aH as de, am as W, d as J, F as Qe, Q as F, c as g, Y as Ze, L as m, aI as et, ae as Me, o as tt, s as Oe, aJ as rt, aK as nt, U as ot, g as P, aD as at, aL as st, aM as it, aN as lt, l as te, aO as ut, aP as ct, a1 as dt, v as ft, m as mt, O as pt, aQ as gt, aR as me, b as pe, M as ht, E as re, H as vt, a2 as Ke, aS as ge, B as Ct, T as yt, z as Et, aT as he, A as wt, aU as bt, aV as _t, aW as St, aC as kt, S as xt, R as Nt, aX as Lt, W as Dt, D as $t, C as Pt, q as Tt, I as ve, aY as Rt, u as It, as as X, ar as G, aZ as Ft, a_ as Mt, au as Ot, a$ as se, at as Kt, b0 as zt } from "../../Lexical.prod-UwAbgYpF.js";
+import { aG as Ie, af as A, P as Fe, N as p, aH as de, am as W, d as J, F as Qe, Q as F, c as g, Y as Ze, L as m, aI as et, ae as Me, o as tt, s as Oe, aJ as rt, aK as nt, U as ot, g as P, aD as at, aL as st, aM as it, aN as lt, l as te, aO as ut, aP as ct, a1 as dt, v as ft, m as mt, O as pt, aQ as gt, aR as me, b as pe, M as ht, E as re, H as vt, a2 as Ke, aS as ge, B as Ct, T as yt, z as Et, aT as he, A as wt, aU as bt, aV as _t, aW as St, aC as kt, S as xt, R as Nt, aX as Lt, W as Dt, D as $t, C as Pt, q as Tt, I as ve, aY as Rt, u as It, as as X, ar as G, aZ as Ft, a_ as Mt, au as Ot, a$ as se, at as Kt, b0 as zt } from "../../Lexical.prod-B84LhBo3.js";
 import * as ne from "react";
 import { useMemo as q, useLayoutEffect as U, useEffect as S, useState as M, useRef as ze, Suspense as At, forwardRef as Ae, useCallback as Bt } from "react";
-import { j, L as z, y as Ut, w as fe } from "../../LexicalUtils.prod-cQutjKA3.js";
+import { j, L as z, y as Ut, w as fe } from "../../LexicalUtils.prod-CD3xGFhm.js";
 import { flushSync as jt, createPortal as Ht } from "react-dom";
-import { D as Ce, _ as ye, h as Wt, m as Jt } from "../../LexicalClipboard.prod-DHIGjydG.js";
-import { X as Ee, J as we } from "../../LexicalSelection.prod-xk5MiZnZ.js";
-import { t as Be, j as Ue, y as qt, _ as Vt } from "../../LexicalList.prod-jxGuZd4b.js";
-import { g as je, k as be, v as oe, p as Yt, m as Xt } from "../../LexicalLink.prod-Bsa9J7L-.js";
-import { s as Gt, c as Qt, a as He, b as Zt, w as er, S as tr, y as We, O as rr } from "../../LexicalTable.prod-BSjs04iE.js";
-import { a as nr, w as or, M as ar } from "../../helpers-DZIm3MiJ.js";
+import { D as Ce, _ as ye, h as Wt, m as Jt } from "../../LexicalClipboard.prod-DLgWWXys.js";
+import { X as Ee, J as we } from "../../LexicalSelection.prod-TB5pn9xc.js";
+import { t as Be, j as Ue, y as qt, _ as Vt } from "../../LexicalList.prod-Cw2TK1jY.js";
+import { g as je, k as be, v as oe, p as Yt, m as Xt } from "../../LexicalLink.prod-DoU9RL94.js";
+import { s as Gt, c as Qt, a as He, b as Zt, w as er, S as tr, y as We, O as rr } from "../../LexicalTable.prod-9xjyWB0C.js";
+import { a as nr, w as or, M as ar } from "../../helpers-CMG0anwr.js";
 import { c as sr } from "../../clsx-OuTLNxxd.js";
 import { exportMap as ir, isStartingWithHtmlTag as lr, mergeBoldStrongTags as ur } from "./helpers.js";
 import { s as I } from "../../RteEditor.module-B_3uFnFu.js";
 import { ToolBarPlugin as cr } from "./Plugins/ToolbarPlugin/ToolbarPlugin.js";
 import { useTranslation as dr } from "./hooks/useTranslation.js";
-import "../../TablePlugin-NmJsn2fm.js";
+import "../../TablePlugin-oF-gInNx.js";
 import "./Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "./hooks/components/Flyout.js";
 import "../Buttons/Button.js";
@@ -36,7 +36,7 @@ import "react-router";
 import "../SelectListbox/SelectListbox.js";
 import "../SelectListbox/SelectProvider.js";
 import "../Sortable/components/SortableItem.js";
-import "../../SortableProvider-CwX1lFMa.js";
+import "../../SortableProvider-DisCfTTN.js";
 import { UvaTheme as mr } from "./UvaTheme/UvaTheme.js";
 import { EditorHeader as pr } from "./EditorHeader/EditorHeader.js";
 import { LanguageProvider as gr, useLanguage as hr } from "./Providers/LanguageProvider.js";

package/dist/components/RteEditor/helpers.js

@@ -1,7 +1,7 @@
-import { g as s } from "../../LexicalLink.prod-Bsa9J7L-.js";
-import { t as n, j as i } from "../../LexicalList.prod-jxGuZd4b.js";
-import { ad as a, J as c } from "../../Lexical.prod-UwAbgYpF.js";
-import { a as m, O as g, y as u } from "../../LexicalTable.prod-BSjs04iE.js";
+import { g as s } from "../../LexicalLink.prod-DoU9RL94.js";
+import { t as n, j as i } from "../../LexicalList.prod-Cw2TK1jY.js";
+import { ad as a, J as c } from "../../Lexical.prod-B84LhBo3.js";
+import { a as m, O as g, y as u } from "../../LexicalTable.prod-9xjyWB0C.js";
 const h = (e) => /^<(b|i|u|strong|em|mark|small|del|ins|sub|sup|div|p|span|h[1-6]|a|img|table|tr|td|th|ul|ol|li|blockquote|pre|code|br)(\s+[^>]*)?>/i.test(e.trim()), y = (e) => {
   let r = e.replace(/<b><strong>/gi, "<strong>");
   return r = r.replace(/<\/strong><\/b>/gi, "</strong>"), r;

package/dist/components/SelectListbox/SelectListBox.stories.js

@@ -1,5 +1,5 @@
 import { jsx as a, jsxs as s } from "react/jsx-runtime";
-import { W as i } from "../../index-Di9WPZUe.js";
+import { l as i } from "../../index-C2E9FY6V.js";
 import { SelectListbox as r } from "./SelectListbox.js";
 import * as e from "react";
 const d = ({

package/dist/components/SelectListbox/components/SelectButton.js

@@ -1,53 +1,52 @@
-import { jsx as a, jsxs as C } from "react/jsx-runtime";
-import { c as f } from "../../../clsx-OuTLNxxd.js";
-import { forwardRef as E, useRef as g, useEffect as c } from "react";
-import { s as t } from "../../../SelectListbox.module-yzXaWwsm.js";
+import { jsx as i, jsxs as C } from "react/jsx-runtime";
+import { c as p } from "../../../clsx-OuTLNxxd.js";
+import { forwardRef as E, useRef as f, useEffect as a } from "react";
+import { s as e } from "../../../SelectListbox.module-yzXaWwsm.js";
 import { Icon as L } from "../../Icon/Icon.js";
 import { useSelect as N } from "../SelectProvider.js";
-const O = E((d, u) => {
-  const { variant: b, size: x = "default", onChange: n, buttonLabelProp: m = "label", buttonLabelBold: h, disabled: w = !1 } = d, l = g(null), i = g(!0), { listboxId: y, isOpen: r, selectedValue: e, toggleListbox: I, setIsOpen: p, setActiveIndex: k, options: v } = N() || {}, D = (s) => {
-    switch (s.key) {
+const O = E((g, c) => {
+  const { variant: u, size: d = "default", onChange: s, buttonLabelProp: x = "label", buttonLabelBold: m, disabled: h = !1 } = g, o = f(null), l = f(!0), { listboxId: w, isOpen: t, selectedValue: r, toggleListbox: y, setIsOpen: b, setActiveIndex: I, options: k } = N() || {}, v = (n) => {
+    switch (n.key) {
       case "Enter":
-        if (s.preventDefault(), !r) {
-          p(!0);
+        if (n.preventDefault(), !t) {
+          b(!0);
           return;
         }
         break;
       case "Escape":
-        r && (s.stopPropagation(), k(v.findIndex((o) => o.value === (e == null ? void 0 : e.value))), p(!1));
+        t && (n.stopPropagation(), I(k.findIndex((D) => D.value === r?.value)), b(!1));
         break;
     }
   };
-  return c(() => {
-    var s, o;
-    r ? ((s = l.current) == null ? void 0 : s.children[0]).blur() : !i.current && ((o = l.current) == null ? void 0 : o.children[0]).focus();
-  }, [r]), c(() => (i.current = !1, () => {
-    i.current = !0;
-  }), []), c(() => {
-    n && n(e);
-  }, [n, e]), /* @__PURE__ */ a("span", { ref: l, children: /* @__PURE__ */ C(
+  return a(() => {
+    t ? (o.current?.children[0]).blur() : !l.current && (o.current?.children[0]).focus();
+  }, [t]), a(() => (l.current = !1, () => {
+    l.current = !0;
+  }), []), a(() => {
+    s && s(r);
+  }, [s, r]), /* @__PURE__ */ i("span", { ref: o, children: /* @__PURE__ */ C(
     "button",
     {
-      className: f(t["select-listbox-trigger"], t[`select-listbox-trigger--${x}`], {
-        [t[`select-listbox-trigger--${b}`]]: b,
-        [t["select-listbox-trigger--bold"]]: h
+      className: p(e["select-listbox-trigger"], e[`select-listbox-trigger--${d}`], {
+        [e[`select-listbox-trigger--${u}`]]: u,
+        [e["select-listbox-trigger--bold"]]: m
       }),
       type: "button",
-      onClick: I,
-      onKeyDown: D,
-      "aria-expanded": r,
+      onClick: y,
+      onKeyDown: v,
+      "aria-expanded": t,
       "aria-haspopup": "listbox",
-      "aria-label": `${e.label}`,
-      disabled: w,
-      "aria-controls": y,
-      ...u && { ref: u },
+      "aria-label": `${r.label}`,
+      disabled: h,
+      "aria-controls": w,
+      ...c && { ref: c },
       children: [
-        /* @__PURE__ */ a("span", { className: t["select-listbox-trigger-label"], children: e[m] }),
-        /* @__PURE__ */ a(
+        /* @__PURE__ */ i("span", { className: e["select-listbox-trigger-label"], children: r[x] }),
+        /* @__PURE__ */ i(
           L,
           {
-            className: f(t["select-listbox-trigger-icon"], {
-              [t["select-listbox-trigger-icon--open"]]: r
+            className: p(e["select-listbox-trigger-icon"], {
+              [e["select-listbox-trigger-icon--open"]]: t
             }),
             name: "CheveronDown",
             size: 16

package/dist/components/SelectListbox/components/SelectButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectButton.js","sources":["../../../../src/components/SelectListbox/components/SelectButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef, forwardRef } from 'react';\n\nimport type { KeyboardEvent } from 'react';\nimport type { OptionValue, SelectValue } from 'components/SelectListbox/SelectProvider';\n\nimport styles from 'components/SelectListbox/SelectListbox.module.css';\nimport { Icon } from 'components/Icon';\nimport { useSelect } from 'components/SelectListbox/SelectProvider';\n\nexport interface SelectButtonProps {\n  variant?: 'noborder' | 'pill' | 'pillLeft' | 'pillRight' | 'darkBorder';\n  size?: 'small' | 'medium' | 'default';\n  onChange?: (option: OptionValue) => void;\n  buttonLabelProp?: string;\n  buttonLabelBold?: boolean;\n  disabled?: boolean;\n}\n\nexport const SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>((props, ref) => {\n  const { variant, size = 'default', onChange, buttonLabelProp = 'label', buttonLabelBold, disabled = false } = props;\n  const buttonWrapper = useRef<HTMLSpanElement>(null);\n  const isFirstRender = useRef(true);\n  const { listboxId, isOpen, selectedValue, toggleListbox, setIsOpen, setActiveIndex, options } = useSelect() || {};\n\n  const onTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    switch (event.key) {\n      case 'Enter':\n        event.preventDefault();\n        if (!isOpen) {\n          setIsOpen(true);\n          return;\n        }\n        break;\n      case 'Escape':\n        if (isOpen) {\n          event.stopPropagation();\n          setActiveIndex(options.findIndex((option) => option.value === selectedValue?.value));\n          setIsOpen(false);\n        }\n        break;\n    }\n  };\n\n  useEffect(() => {\n    isOpen\n      ? (buttonWrapper.current?.children[0] as HTMLButtonElement).blur()\n      : !isFirstRender.current && (buttonWrapper.current?.children[0] as HTMLButtonElement).focus();\n  }, [isOpen]);\n\n  useEffect(() => {\n    isFirstRender.current = false;\n\n    return () => {\n      isFirstRender.current = true;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (onChange) onChange(selectedValue);\n  }, [onChange, selectedValue]);\n\n  return (\n    <span ref={buttonWrapper}>\n      <button\n        className={clsx(styles['select-listbox-trigger'], styles[`select-listbox-trigger--${size}`], {\n          [styles[`select-listbox-trigger--${variant}`]]: variant,\n          [styles['select-listbox-trigger--bold']]: buttonLabelBold,\n        })}\n        type=\"button\"\n        onClick={toggleListbox}\n        onKeyDown={onTriggerKeyDown}\n        aria-expanded={isOpen}\n        aria-haspopup=\"listbox\"\n        aria-label={`${selectedValue.label}`}\n        disabled={disabled}\n        aria-controls={listboxId}\n        {...(ref && { ref: ref })}\n      >\n        <span className={styles['select-listbox-trigger-label']}>\n          {selectedValue[buttonLabelProp as keyof SelectValue]}\n        </span>\n\n        <Icon\n          className={clsx(styles['select-listbox-trigger-icon'], {\n            [styles['select-listbox-trigger-icon--open']]: isOpen,\n          })}\n          name=\"CheveronDown\"\n          size={16}\n        />\n      </button>\n    </span>\n  );\n});\n"],"names":["SelectButton","forwardRef","props","ref","variant","size","onChange","buttonLabelProp","buttonLabelBold","disabled","buttonWrapper","useRef","isFirstRender","listboxId","isOpen","selectedValue","toggleListbox","setIsOpen","setActiveIndex","options","useSelect","onTriggerKeyDown","event","option","useEffect","_a","_b","jsx","jsxs","clsx","styles","Icon"],"mappings":";;;;;;AAmBO,MAAMA,IAAeC,EAAiD,CAACC,GAAOC,MAAQ;AAC3F,QAAM,EAAE,SAAAC,GAAS,MAAAC,IAAO,WAAW,UAAAC,GAAU,iBAAAC,IAAkB,SAAS,iBAAAC,GAAiB,UAAAC,IAAW,GAAA,IAAUP,GACxGQ,IAAgBC,EAAwB,IAAI,GAC5CC,IAAgBD,EAAO,EAAI,GAC3B,EAAE,WAAAE,GAAW,QAAAC,GAAQ,eAAAC,GAAe,eAAAC,GAAe,WAAAC,GAAW,gBAAAC,GAAgB,SAAAC,EAAA,IAAYC,EAAA,KAAe,CAAA,GAEzGC,IAAmB,CAACC,MAA4C;AACpE,YAAQA,EAAM,KAAA;AAAA,MACZ,KAAK;AAEH,YADAA,EAAM,eAAA,GACF,CAACR,GAAQ;AACX,UAAAG,EAAU,EAAI;AACd;AAAA,QAAA;AAEF;AAAA,MACF,KAAK;AACH,QAAIH,MACFQ,EAAM,gBAAA,GACNJ,EAAeC,EAAQ,UAAU,CAACI,MAAWA,EAAO,WAAUR,KAAA,gBAAAA,EAAe,MAAK,CAAC,GACnFE,EAAU,EAAK;AAEjB;AAAA,IAAA;AAAA,EACJ;AAGF,SAAAO,EAAU,MAAM;;AACd,IAAAV,MACKW,IAAAf,EAAc,YAAd,gBAAAe,EAAuB,SAAS,IAAyB,KAAA,IAC1D,CAACb,EAAc,aAAYc,IAAAhB,EAAc,YAAd,gBAAAgB,EAAuB,SAAS,IAAyB,MAAA;AAAA,EAAM,GAC7F,CAACZ,CAAM,CAAC,GAEXU,EAAU,OACRZ,EAAc,UAAU,IAEjB,MAAM;AACX,IAAAA,EAAc,UAAU;AAAA,EAAA,IAEzB,EAAE,GAELY,EAAU,MAAM;AACd,IAAIlB,OAAmBS,CAAa;AAAA,EAAA,GACnC,CAACT,GAAUS,CAAa,CAAC,GAG1B,gBAAAY,EAAC,QAAA,EAAK,KAAKjB,GACT,UAAA,gBAAAkB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,wBAAwB,GAAGA,EAAO,2BAA2BzB,CAAI,EAAE,GAAG;AAAA,QAC3F,CAACyB,EAAO,2BAA2B1B,CAAO,EAAE,CAAC,GAAGA;AAAA,QAChD,CAAC0B,EAAO,8BAA8B,CAAC,GAAGtB;AAAA,MAAA,CAC3C;AAAA,MACD,MAAK;AAAA,MACL,SAASQ;AAAA,MACT,WAAWK;AAAA,MACX,iBAAeP;AAAA,MACf,iBAAc;AAAA,MACd,cAAY,GAAGC,EAAc,KAAK;AAAA,MAClC,UAAAN;AAAA,MACA,iBAAeI;AAAA,MACd,GAAIV,KAAO,EAAE,KAAAA,EAAA;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAAwB,EAAC,UAAK,WAAWG,EAAO,8BAA8B,GACnD,UAAAf,EAAcR,CAAoC,GACrD;AAAA,QAEA,gBAAAoB;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,WAAWF,EAAKC,EAAO,6BAA6B,GAAG;AAAA,cACrD,CAACA,EAAO,mCAAmC,CAAC,GAAGhB;AAAA,YAAA,CAChD;AAAA,YACD,MAAK;AAAA,YACL,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACR;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ,CAAC;"}
+{"version":3,"file":"SelectButton.js","sources":["../../../../src/components/SelectListbox/components/SelectButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef, forwardRef } from 'react';\n\nimport type { KeyboardEvent } from 'react';\nimport type { OptionValue, SelectValue } from 'components/SelectListbox/SelectProvider';\n\nimport styles from 'components/SelectListbox/SelectListbox.module.css';\nimport { Icon } from 'components/Icon';\nimport { useSelect } from 'components/SelectListbox/SelectProvider';\n\nexport interface SelectButtonProps {\n  variant?: 'noborder' | 'pill' | 'pillLeft' | 'pillRight' | 'darkBorder';\n  size?: 'small' | 'medium' | 'default';\n  onChange?: (option: OptionValue) => void;\n  buttonLabelProp?: string;\n  buttonLabelBold?: boolean;\n  disabled?: boolean;\n}\n\nexport const SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>((props, ref) => {\n  const { variant, size = 'default', onChange, buttonLabelProp = 'label', buttonLabelBold, disabled = false } = props;\n  const buttonWrapper = useRef<HTMLSpanElement>(null);\n  const isFirstRender = useRef(true);\n  const { listboxId, isOpen, selectedValue, toggleListbox, setIsOpen, setActiveIndex, options } = useSelect() || {};\n\n  const onTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    switch (event.key) {\n      case 'Enter':\n        event.preventDefault();\n        if (!isOpen) {\n          setIsOpen(true);\n          return;\n        }\n        break;\n      case 'Escape':\n        if (isOpen) {\n          event.stopPropagation();\n          setActiveIndex(options.findIndex((option) => option.value === selectedValue?.value));\n          setIsOpen(false);\n        }\n        break;\n    }\n  };\n\n  useEffect(() => {\n    isOpen\n      ? (buttonWrapper.current?.children[0] as HTMLButtonElement).blur()\n      : !isFirstRender.current && (buttonWrapper.current?.children[0] as HTMLButtonElement).focus();\n  }, [isOpen]);\n\n  useEffect(() => {\n    isFirstRender.current = false;\n\n    return () => {\n      isFirstRender.current = true;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (onChange) onChange(selectedValue);\n  }, [onChange, selectedValue]);\n\n  return (\n    <span ref={buttonWrapper}>\n      <button\n        className={clsx(styles['select-listbox-trigger'], styles[`select-listbox-trigger--${size}`], {\n          [styles[`select-listbox-trigger--${variant}`]]: variant,\n          [styles['select-listbox-trigger--bold']]: buttonLabelBold,\n        })}\n        type=\"button\"\n        onClick={toggleListbox}\n        onKeyDown={onTriggerKeyDown}\n        aria-expanded={isOpen}\n        aria-haspopup=\"listbox\"\n        aria-label={`${selectedValue.label}`}\n        disabled={disabled}\n        aria-controls={listboxId}\n        {...(ref && { ref: ref })}\n      >\n        <span className={styles['select-listbox-trigger-label']}>\n          {selectedValue[buttonLabelProp as keyof SelectValue]}\n        </span>\n\n        <Icon\n          className={clsx(styles['select-listbox-trigger-icon'], {\n            [styles['select-listbox-trigger-icon--open']]: isOpen,\n          })}\n          name=\"CheveronDown\"\n          size={16}\n        />\n      </button>\n    </span>\n  );\n});\n"],"names":["SelectButton","forwardRef","props","ref","variant","size","onChange","buttonLabelProp","buttonLabelBold","disabled","buttonWrapper","useRef","isFirstRender","listboxId","isOpen","selectedValue","toggleListbox","setIsOpen","setActiveIndex","options","useSelect","onTriggerKeyDown","event","option","useEffect","jsx","jsxs","clsx","styles","Icon"],"mappings":";;;;;;AAmBO,MAAMA,IAAeC,EAAiD,CAACC,GAAOC,MAAQ;AAC3F,QAAM,EAAE,SAAAC,GAAS,MAAAC,IAAO,WAAW,UAAAC,GAAU,iBAAAC,IAAkB,SAAS,iBAAAC,GAAiB,UAAAC,IAAW,GAAA,IAAUP,GACxGQ,IAAgBC,EAAwB,IAAI,GAC5CC,IAAgBD,EAAO,EAAI,GAC3B,EAAE,WAAAE,GAAW,QAAAC,GAAQ,eAAAC,GAAe,eAAAC,GAAe,WAAAC,GAAW,gBAAAC,GAAgB,SAAAC,EAAA,IAAYC,EAAA,KAAe,CAAA,GAEzGC,IAAmB,CAACC,MAA4C;AACpE,YAAQA,EAAM,KAAA;AAAA,MACZ,KAAK;AAEH,YADAA,EAAM,eAAA,GACF,CAACR,GAAQ;AACX,UAAAG,EAAU,EAAI;AACd;AAAA,QAAA;AAEF;AAAA,MACF,KAAK;AACH,QAAIH,MACFQ,EAAM,gBAAA,GACNJ,EAAeC,EAAQ,UAAU,CAACI,MAAWA,EAAO,UAAUR,GAAe,KAAK,CAAC,GACnFE,EAAU,EAAK;AAEjB;AAAA,IAAA;AAAA,EACJ;AAGF,SAAAO,EAAU,MAAM;AACd,IAAAV,KACKJ,EAAc,SAAS,SAAS,CAAC,GAAwB,KAAA,IAC1D,CAACE,EAAc,YAAYF,EAAc,SAAS,SAAS,CAAC,GAAwB,MAAA;AAAA,EAAM,GAC7F,CAACI,CAAM,CAAC,GAEXU,EAAU,OACRZ,EAAc,UAAU,IAEjB,MAAM;AACX,IAAAA,EAAc,UAAU;AAAA,EAAA,IAEzB,EAAE,GAELY,EAAU,MAAM;AACd,IAAIlB,OAAmBS,CAAa;AAAA,EAAA,GACnC,CAACT,GAAUS,CAAa,CAAC,GAG1B,gBAAAU,EAAC,QAAA,EAAK,KAAKf,GACT,UAAA,gBAAAgB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,wBAAwB,GAAGA,EAAO,2BAA2BvB,CAAI,EAAE,GAAG;AAAA,QAC3F,CAACuB,EAAO,2BAA2BxB,CAAO,EAAE,CAAC,GAAGA;AAAA,QAChD,CAACwB,EAAO,8BAA8B,CAAC,GAAGpB;AAAA,MAAA,CAC3C;AAAA,MACD,MAAK;AAAA,MACL,SAASQ;AAAA,MACT,WAAWK;AAAA,MACX,iBAAeP;AAAA,MACf,iBAAc;AAAA,MACd,cAAY,GAAGC,EAAc,KAAK;AAAA,MAClC,UAAAN;AAAA,MACA,iBAAeI;AAAA,MACd,GAAIV,KAAO,EAAE,KAAAA,EAAA;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAAsB,EAAC,UAAK,WAAWG,EAAO,8BAA8B,GACnD,UAAAb,EAAcR,CAAoC,GACrD;AAAA,QAEA,gBAAAkB;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,WAAWF,EAAKC,EAAO,6BAA6B,GAAG;AAAA,cACrD,CAACA,EAAO,mCAAmC,CAAC,GAAGd;AAAA,YAAA,CAChD;AAAA,YACD,MAAK;AAAA,YACL,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACR;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ,CAAC;"}