@uniformdev/design-system 19.184.3-alpha.32 → 19.186.1

package/dist/esm/index.js

@@ -17736,7 +17736,8 @@ var KeyValueInput = ({
             onChange: (itemValue) => handleUpdateOptionRow(index, itemValue),
             onDelete: () => handleDeleteOptionRow(index),
             onFocusChange: handleFocusChange,
-            "data-testid": "key-value-input-item"
+            "data-testid": "key-value-input-item",
+            onEnter: handleAddOptionRow
           },
           isDragging ? id : index
         )) })
@@ -17771,7 +17772,8 @@ var KeyValueInputItem = ({
   error,
   onFocusChange,
   disabledDelete = false,
-  disabledDnd = false
+  disabledDnd = false,
+  onEnter
 }) => {
   const { attributes, listeners, setNodeRef, transform, transition, setActivatorNodeRef, isSorting } = useSortable({
     id,
@@ -17781,6 +17783,11 @@ var KeyValueInputItem = ({
     transform: CSS.Transform.toString(transform),
     transition
   };
+  const handleEnter = (e) => {
+    if (e.key === "Enter") {
+      onEnter();
+    }
+  };
   return /* @__PURE__ */ jsxs57("div", { css: rowWrapper, ref: setNodeRef, style, children: [
     /* @__PURE__ */ jsx92(DragHandle, { disableDnd: disabledDnd, ref: setActivatorNodeRef, ...attributes, ...listeners }),
     /* @__PURE__ */ jsxs57("div", { css: SelectKeyValueRowStyles, "data-testid": "key-value-input-item", children: [
@@ -17800,6 +17807,7 @@ var KeyValueInputItem = ({
           },
           onBlur: () => onFocusChange == null ? void 0 : onFocusChange(false),
           onFocus: () => onFocusChange == null ? void 0 : onFocusChange(true),
+          onKeyDown: handleEnter,
           value: value.key,
           errorMessage: isSorting ? void 0 : error == null ? void 0 : error.key,
           "data-testid": "key"
@@ -17811,12 +17819,15 @@ var KeyValueInputItem = ({
           label: valueLabel,
           showLabel: false,
           disabled: disabled2,
-          onChange: (e) => onChange == null ? void 0 : onChange({
-            key: value.key,
-            value: e.currentTarget.value
-          }),
+          onChange: (e) => {
+            onChange == null ? void 0 : onChange({
+              key: value.key,
+              value: e.currentTarget.value
+            });
+          },
           onBlur: () => onFocusChange == null ? void 0 : onFocusChange(false),
           onFocus: () => onFocusChange == null ? void 0 : onFocusChange(true),
+          onKeyDown: handleEnter,
           value: value.value,
           errorMessage: isSorting ? void 0 : error == null ? void 0 : error.value,
           "data-testid": "value"
@@ -19923,8 +19934,8 @@ import { useState as useState15 } from "react";
 
 // src/components/ParameterInputs/ParameterLabel.tsx
 import { jsx as jsx121 } from "@emotion/react/jsx-runtime";
-var ParameterLabel = ({ id, asSpan, children, ...props }) => {
-  return !asSpan ? /* @__PURE__ */ jsx121("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ jsx121("span", { "aria-labelledby": id, css: labelText2, children });
+var ParameterLabel = ({ id, asSpan, children, testId, ...props }) => {
+  return !asSpan ? /* @__PURE__ */ jsx121("label", { ...props, htmlFor: id, css: labelText2, "data-testid": testId, children }) : /* @__PURE__ */ jsx121("span", { "aria-labelledby": id, css: labelText2, children });
 };
 
 // src/components/ParameterInputs/ParameterMenuButton.tsx
@@ -20049,7 +20060,7 @@ var ParameterShell = ({
       label,
       labelTrailingIcon != null ? labelTrailingIcon : null
     ] }),
-    !title2 ? null : /* @__PURE__ */ jsxs81(ParameterLabel, { id, asSpan: true, children: [
+    !title2 ? null : /* @__PURE__ */ jsxs81(ParameterLabel, { id, asSpan: true, testId: "parameter-label", children: [
       labelLeadingIcon != null ? labelLeadingIcon : null,
       title2,
       labelTrailingIcon != null ? labelTrailingIcon : null
@@ -20370,7 +20381,7 @@ var ParameterNameAndPublicIdInput = ({
 
 // src/components/ParameterInputs/ParameterRichText.tsx
 import { css as css101 } from "@emotion/react";
-import { ListItemNode, ListNode as ListNode2 } from "@lexical/list";
+import { ListItemNode, ListNode as ListNode3 } from "@lexical/list";
 import {
   CODE,
   HEADING,
@@ -20381,7 +20392,7 @@ import {
   UNORDERED_LIST
 } from "@lexical/markdown";
 import { LexicalComposer } from "@lexical/react/LexicalComposer";
-import { useLexicalComposerContext as useLexicalComposerContext7 } from "@lexical/react/LexicalComposerContext";
+import { useLexicalComposerContext as useLexicalComposerContext8 } from "@lexical/react/LexicalComposerContext";
 import { ContentEditable } from "@lexical/react/LexicalContentEditable";
 import LexicalErrorBoundary from "@lexical/react/LexicalErrorBoundary";
 import { HistoryPlugin } from "@lexical/react/LexicalHistoryPlugin";
@@ -20390,7 +20401,7 @@ import { MarkdownShortcutPlugin } from "@lexical/react/LexicalMarkdownShortcutPl
 import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
 import { TablePlugin } from "@lexical/react/LexicalTablePlugin";
 import { HeadingNode, QuoteNode } from "@lexical/rich-text";
-import { TableCellNode as TableCellNode2, TableNode, TableRowNode as TableRowNode2 } from "@lexical/table";
+import { TableCellNode as TableCellNode3, TableNode, TableRowNode as TableRowNode2 } from "@lexical/table";
 
 // ../richtext/dist/index.mjs
 var richTextBuiltInElements = [
@@ -20489,7 +20500,7 @@ var getLabelForElement = (type) => {
 // src/components/ParameterInputs/ParameterRichText.tsx
 import { deepEqual as deepEqual2 } from "fast-equals";
 import { ParagraphNode as ParagraphNode2 } from "lexical";
-import { useEffect as useEffect23, useState as useState20 } from "react";
+import { useEffect as useEffect24, useState as useState21 } from "react";
 
 // src/components/ParameterInputs/rich-text/CustomCodeNode.ts
 import { CodeNode } from "@lexical/code";
@@ -20726,9 +20737,32 @@ var tableCellElement = css96`
   min-width: 2rem;
   outline: none;
   padding: var(--spacing-sm);
+  position: relative;
   text-align: start;
   vertical-align: top;
   width: 7rem;
+
+  /* Used by the table resizer plugin to not change the hovered cell immediately
+  upon going with the mouse over the neighboring cell */
+  &::after {
+    content: '';
+    height: 5px;
+    left: 0;
+    position: absolute;
+    top: 100%;
+    width: 100%;
+    z-index: 1;
+  }
+
+  &::before {
+    content: '';
+    width: 5px;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 100%;
+    z-index: 1;
+  }
 `;
 var tableHeaderElement = css96`
   background-color: var(--gray-100);
@@ -21088,7 +21122,7 @@ var LINK_POPOVER_OFFSET_X = 0;
 var LINK_POPOVER_OFFSET_Y = 8;
 var linkPopover = css97`
   position: absolute;
-  z-index: 5;
+  z-index: 11;
 `;
 var linkPopoverContainer = css97`
   ${Popover()};
@@ -21304,17 +21338,28 @@ function getLinkAncestor(node) {
 }
 
 // src/components/ParameterInputs/rich-text/ListIndentPlugin.tsx
-import { $getListDepth, $isListItemNode, $isListNode } from "@lexical/list";
+import { $getListDepth, $isListItemNode, $isListNode, ListNode } from "@lexical/list";
 import { useLexicalComposerContext as useLexicalComposerContext3 } from "@lexical/react/LexicalComposerContext";
-import { TabIndentationPlugin } from "@lexical/react/LexicalTabIndentationPlugin";
 import {
+  $filter,
+  $getNearestBlockElementAncestorOrThrow,
+  $getNearestNodeOfType,
+  mergeRegister as mergeRegister3
+} from "@lexical/utils";
+import {
+  $createRangeSelection,
   $getSelection as $getSelection2,
+  $isBlockElementNode,
   $isRangeSelection as $isRangeSelection2,
+  $normalizeSelection__EXPERIMENTAL,
   COMMAND_PRIORITY_CRITICAL,
-  INDENT_CONTENT_COMMAND
+  COMMAND_PRIORITY_NORMAL,
+  INDENT_CONTENT_COMMAND,
+  KEY_TAB_COMMAND,
+  OUTDENT_CONTENT_COMMAND,
+  SELECTION_CHANGE_COMMAND
 } from "lexical";
-import { useEffect as useEffect19 } from "react";
-import { jsx as jsx130 } from "@emotion/react/jsx-runtime";
+import { useEffect as useEffect19, useRef as useRef12 } from "react";
 function isIndentPermitted(maxDepth) {
   const selection = $getSelection2();
   if (!$isRangeSelection2(selection)) {
@@ -21335,16 +21380,84 @@ function isIndentPermitted(maxDepth) {
   }
   return totalDepth <= maxDepth;
 }
+function $isAnyOfSelectedNodesAListItemNode(selection) {
+  const nodes = selection.getNodes();
+  return $filter(nodes, (node) => $isListItemNode(node) ? node : null).length > 0;
+}
+function $indentOverTab(selection) {
+  const nodes = selection.getNodes();
+  const canIndentBlockNodes = $filter(nodes, (node) => {
+    if ($isBlockElementNode(node) && node.canIndent()) {
+      return node;
+    }
+    return null;
+  });
+  if (canIndentBlockNodes.length > 0) {
+    return true;
+  }
+  const anchor = selection.anchor;
+  const focus = selection.focus;
+  const first = focus.isBefore(anchor) ? focus : anchor;
+  const firstNode = first.getNode();
+  const firstBlock = $getNearestBlockElementAncestorOrThrow(firstNode);
+  if (firstBlock.canIndent()) {
+    const firstBlockKey = firstBlock.getKey();
+    let selectionAtStart = $createRangeSelection();
+    selectionAtStart.anchor.set(firstBlockKey, 0, "element");
+    selectionAtStart.focus.set(firstBlockKey, 0, "element");
+    selectionAtStart = $normalizeSelection__EXPERIMENTAL(selectionAtStart);
+    if (selectionAtStart.anchor.is(first)) {
+      return true;
+    }
+  }
+  return false;
+}
 function ListIndentPlugin({ maxDepth }) {
   const [editor] = useLexicalComposerContext3();
+  const isInListItemNode = useRef12(false);
   useEffect19(() => {
     return editor.registerCommand(
-      INDENT_CONTENT_COMMAND,
-      () => !isIndentPermitted(maxDepth),
-      COMMAND_PRIORITY_CRITICAL
+      SELECTION_CHANGE_COMMAND,
+      () => {
+        editor.read(() => {
+          const selection = $getSelection2();
+          if (!$isRangeSelection2(selection) || !selection.isCollapsed()) {
+            isInListItemNode.current = false;
+            return false;
+          }
+          isInListItemNode.current = $getNearestNodeOfType(selection.anchor.getNode(), ListNode) !== null;
+        });
+        return false;
+      },
+      COMMAND_PRIORITY_NORMAL
+    );
+  }, [editor]);
+  useEffect19(() => {
+    return mergeRegister3(
+      editor.registerCommand(
+        INDENT_CONTENT_COMMAND,
+        () => !isIndentPermitted(maxDepth),
+        COMMAND_PRIORITY_CRITICAL
+      ),
+      editor.registerCommand(
+        KEY_TAB_COMMAND,
+        (event) => {
+          const selection = $getSelection2();
+          if (!$isRangeSelection2(selection) || !isInListItemNode.current && !$isAnyOfSelectedNodesAListItemNode(selection)) {
+            return false;
+          }
+          event.preventDefault();
+          if ($indentOverTab(selection)) {
+            const command = event.shiftKey ? OUTDENT_CONTENT_COMMAND : INDENT_CONTENT_COMMAND;
+            return editor.dispatchCommand(command, void 0);
+          }
+          return false;
+        },
+        COMMAND_PRIORITY_CRITICAL
+      )
     );
   }, [editor, maxDepth]);
-  return /* @__PURE__ */ jsx130(TabIndentationPlugin, {});
+  return null;
 }
 
 // src/components/ParameterInputs/rich-text/RichTextToolbar.tsx
@@ -21354,14 +21467,14 @@ import {
   $isListNode as $isListNode2,
   INSERT_ORDERED_LIST_COMMAND,
   INSERT_UNORDERED_LIST_COMMAND,
-  ListNode,
+  ListNode as ListNode2,
   REMOVE_LIST_COMMAND
 } from "@lexical/list";
 import { useLexicalComposerContext as useLexicalComposerContext4 } from "@lexical/react/LexicalComposerContext";
 import { $createHeadingNode, $createQuoteNode, $isHeadingNode } from "@lexical/rich-text";
 import { $setBlocksType } from "@lexical/selection";
 import { $createTableNodeWithDimensions } from "@lexical/table";
-import { $findMatchingParent, $getNearestNodeOfType } from "@lexical/utils";
+import { $findMatchingParent, $getNearestNodeOfType as $getNearestNodeOfType2 } from "@lexical/utils";
 import {
   $createParagraphNode,
   $getSelection as $getSelection3,
@@ -21370,10 +21483,10 @@ import {
   $isRootOrShadowRoot,
   COMMAND_PRIORITY_CRITICAL as COMMAND_PRIORITY_CRITICAL2,
   FORMAT_TEXT_COMMAND,
-  SELECTION_CHANGE_COMMAND
+  SELECTION_CHANGE_COMMAND as SELECTION_CHANGE_COMMAND2
 } from "lexical";
 import { useCallback as useCallback11, useEffect as useEffect20, useMemo as useMemo6, useState as useState17 } from "react";
-import { Fragment as Fragment19, jsx as jsx131, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx130, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
 var toolbar = css98`
   ${scrollbarStyles}
   background: var(--gray-50);
@@ -21381,7 +21494,7 @@ var toolbar = css98`
   display: flex;
   /* We add 1px because we use a 1px wide separator */
   gap: calc(var(--spacing-sm) + 1px);
-  margin: calc(var(--spacing-sm) + var(--spacing-xs)) 0;
+  margin: 0 0 calc(var(--spacing-sm) + var(--spacing-xs)) 0;
   overflow: auto;
   padding: var(--spacing-sm);
   position: sticky;
@@ -21433,7 +21546,7 @@ var toolbarChevron = css98`
   margin-left: var(--spacing-xs);
 `;
 var RichTextToolbarIcon = ({ icon }) => {
-  return /* @__PURE__ */ jsx131(Icon, { icon, css: toolbarIcon, size: "1rem" });
+  return /* @__PURE__ */ jsx130(Icon, { icon, css: toolbarIcon, size: "1rem" });
 };
 var FORMATS_WITH_ICON = /* @__PURE__ */ new Map([
   ["bold", "format-bold"],
@@ -21521,7 +21634,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
     const elementDOM = editor.getElementByKey(elementKey);
     if (elementDOM !== null) {
       if ($isListNode2(element)) {
-        const parentList = $getNearestNodeOfType(anchorNode, ListNode);
+        const parentList = $getNearestNodeOfType2(anchorNode, ListNode2);
         const type = parentList ? parentList.getListType() : element.getListType();
         setActiveElement(type === "bullet" ? "unorderedList" : "orderedList");
       } else {
@@ -21538,7 +21651,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
   }, [editor, setActiveElement, setActiveFormats, setIsLink]);
   useEffect20(() => {
     return editor.registerCommand(
-      SELECTION_CHANGE_COMMAND,
+      SELECTION_CHANGE_COMMAND2,
       (_payload) => {
         updateToolbar();
         return false;
@@ -21562,7 +21675,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
         menuTrigger: /* @__PURE__ */ jsxs86("button", { css: [richTextToolbarButton, textStyleButton], title: "Text styles", children: [
           visibleTextualElements.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
           " ",
-          /* @__PURE__ */ jsx131(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
+          /* @__PURE__ */ jsx130(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
         ] }),
         placement: "bottom-start",
         children: [
@@ -21572,7 +21685,7 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
               type: "paragraph"
             },
             ...visibleTextualElements
-          ].map((element) => /* @__PURE__ */ jsx131(
+          ].map((element) => /* @__PURE__ */ jsx130(
             MenuItem,
             {
               onClick: () => {
@@ -21582,12 +21695,12 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
             },
             element.type
           )),
-          visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx131(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
+          visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx130(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
         ]
       }
     ),
     visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsxs86("div", { css: toolbarGroup, children: [
-      visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx131(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx131(
+      visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx130(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx130(
         "button",
         {
           onClick: () => {
@@ -21597,16 +21710,16 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
             richTextToolbarButton,
             activeFormats.includes(format.type) ? richTextToolbarButtonActive : null
           ],
-          children: /* @__PURE__ */ jsx131(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
+          children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
         }
       ) }, format.type)),
-      visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx131(
+      visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx130(
         Menu,
         {
           menuLabel: "Alternative text styles",
-          menuTrigger: /* @__PURE__ */ jsx131("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ jsx131(Icon, { icon: "more-alt", css: toolbarIcon }) }),
+          menuTrigger: /* @__PURE__ */ jsx130("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ jsx130(Icon, { icon: "more-alt", css: toolbarIcon }) }),
           placement: "bottom-start",
-          children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx131(
+          children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx130(
             MenuItem,
             {
               onClick: () => {
@@ -21620,18 +21733,18 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
       ) : null
     ] }) : null,
     visibleElementsWithIcons.size > 0 || customControls ? /* @__PURE__ */ jsxs86("div", { css: toolbarGroup, children: [
-      linkElementVisible ? /* @__PURE__ */ jsx131(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx131(
+      linkElementVisible ? /* @__PURE__ */ jsx130(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx130(
         "button",
         {
           onClick: () => {
             isLink ? editor.dispatchCommand(REMOVE_LINK_NODE_COMMAND, {}) : editor.dispatchCommand(OPEN_LINK_NODE_MODAL_COMMAND, {});
           },
           css: [richTextToolbarButton, isLink ? richTextToolbarButtonActive : null],
-          children: /* @__PURE__ */ jsx131(RichTextToolbarIcon, { icon: "link" })
+          children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "link" })
         }
       ) }) : null,
       visibleLists.size > 0 ? /* @__PURE__ */ jsxs86(Fragment19, { children: [
-        visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx131(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx131(
+        visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx130(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx130(
           "button",
           {
             onClick: () => {
@@ -21641,10 +21754,10 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
               richTextToolbarButton,
               activeElement === "unorderedList" ? richTextToolbarButtonActive : null
             ],
-            children: /* @__PURE__ */ jsx131(RichTextToolbarIcon, { icon: "layout-list" })
+            children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "layout-list" })
           }
         ) }) : null,
-        visibleLists.has("orderedList") ? /* @__PURE__ */ jsx131(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx131(
+        visibleLists.has("orderedList") ? /* @__PURE__ */ jsx130(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx130(
           "button",
           {
             onClick: () => {
@@ -21654,48 +21767,48 @@ var RichTextToolbar = ({ config, customControls, onInsertTable }) => {
               richTextToolbarButton,
               activeElement === "orderedList" ? richTextToolbarButtonActive : null
             ],
-            children: /* @__PURE__ */ jsx131(RichTextToolbarIcon, { icon: "layout-list-numbered" })
+            children: /* @__PURE__ */ jsx130(RichTextToolbarIcon, { icon: "layout-list-numbered" })
           }
         ) }) : null
       ] }) : null,
       customControls ? customControls : null
     ] }) : null,
-    visibleInsertElementsWithIcons.size > 0 ? /* @__PURE__ */ jsx131("div", { css: toolbarGroup, children: /* @__PURE__ */ jsxs86(
+    visibleInsertElementsWithIcons.size > 0 ? /* @__PURE__ */ jsx130("div", { css: toolbarGroup, children: /* @__PURE__ */ jsxs86(
       Menu,
       {
         menuTrigger: /* @__PURE__ */ jsxs86("button", { css: richTextToolbarButton, title: "Insert block element", children: [
           "Insert",
-          /* @__PURE__ */ jsx131(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
+          /* @__PURE__ */ jsx130(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
         ] }),
         placement: "bottom-start",
         children: [
-          quoteElementVisible ? /* @__PURE__ */ jsx131(
+          quoteElementVisible ? /* @__PURE__ */ jsx130(
             MenuItem,
             {
               onClick: () => {
                 onSelectElement("quote");
               },
-              icon: /* @__PURE__ */ jsx131(Icon, { icon: "quote", iconColor: "currentColor" }),
+              icon: /* @__PURE__ */ jsx130(Icon, { icon: "quote", iconColor: "currentColor" }),
               children: "Quote"
             }
           ) : null,
-          codeElementVisible ? /* @__PURE__ */ jsx131(
+          codeElementVisible ? /* @__PURE__ */ jsx130(
             MenuItem,
             {
               onClick: () => {
                 onSelectElement("code");
               },
-              icon: /* @__PURE__ */ jsx131(Icon, { icon: "code-slash", iconColor: "currentColor" }),
+              icon: /* @__PURE__ */ jsx130(Icon, { icon: "code-slash", iconColor: "currentColor" }),
               children: "Code"
             }
           ) : null,
-          tableElementVisible && onInsertTable !== void 0 ? /* @__PURE__ */ jsx131(
+          tableElementVisible && onInsertTable !== void 0 ? /* @__PURE__ */ jsx130(
             MenuItem,
             {
               onClick: () => {
                 onSelectElement("table");
               },
-              icon: /* @__PURE__ */ jsx131(Icon, { icon: "view-grid", iconColor: "currentColor" }),
+              icon: /* @__PURE__ */ jsx130(Icon, { icon: "view-grid", iconColor: "currentColor" }),
               children: "Table"
             }
           ) : null
@@ -21848,7 +21961,7 @@ import {
 } from "@lexical/table";
 import { $getRoot, $getSelection as $getSelection4, $isRangeSelection as $isRangeSelection4 } from "lexical";
 import { forwardRef as forwardRef22, useCallback as useCallback12, useEffect as useEffect21, useLayoutEffect, useState as useState18 } from "react";
-import { jsx as jsx132, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx131, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
 function computeSelectionCount(selection) {
   const selectionShape = selection.getShape();
   return {
@@ -21866,11 +21979,11 @@ var TableActionMenuTrigger = forwardRef22((props, ref) => {
   useLayoutEffect(() => {
     const rect = tableCellEl.getBoundingClientRect();
     const parentRect = positioningAnchorEl.getBoundingClientRect();
-    const relativeX = rect.right - parentRect.left;
-    const relativeY = rect.top - parentRect.top;
+    const relativeX = rect.right - parentRect.left + positioningAnchorEl.scrollLeft;
+    const relativeY = rect.top - parentRect.top + positioningAnchorEl.scrollTop;
     setCoordinates({ x: relativeX, y: relativeY });
   }, [tableCellEl, positioningAnchorEl]);
-  return /* @__PURE__ */ jsx132(
+  return /* @__PURE__ */ jsx131(
     IconButton,
     {
       ref,
@@ -21884,7 +21997,7 @@ var TableActionMenuTrigger = forwardRef22((props, ref) => {
       size: "xs",
       buttonType: "unimportant",
       ...rest,
-      children: /* @__PURE__ */ jsx132(Icon, { icon: "chevron-down", size: "1rem", iconColor: "currentColor" })
+      children: /* @__PURE__ */ jsx131(Icon, { icon: "chevron-down", size: "1rem", iconColor: "currentColor" })
     }
   );
 });
@@ -21984,10 +22097,9 @@ function TableActionMenu({
   const deleteTableColumnAtSelection = useCallback12(() => {
     editor.update(() => {
       $deleteTableColumn__EXPERIMENTAL();
-      clearTableSelection();
     });
     incrementMenuTriggerKey();
-  }, [editor, clearTableSelection]);
+  }, [editor]);
   const toggleTableRowIsHeader = useCallback12(() => {
     editor.update(() => {
       const tableNode = $getTableNodeFromLexicalNodeOrThrow(tableCellNode);
@@ -22042,7 +22154,7 @@ function TableActionMenu({
   return /* @__PURE__ */ jsxs87(
     Menu,
     {
-      menuTrigger: /* @__PURE__ */ jsx132(
+      menuTrigger: /* @__PURE__ */ jsx131(
         TableActionMenuTrigger,
         {
           tableCellEl,
@@ -22072,7 +22184,7 @@ function TableActionMenu({
           selectionCounts.rows === 1 ? "row" : `${selectionCounts.rows} rows`,
           " below"
         ] }),
-        /* @__PURE__ */ jsx132(MenuItemSeparator, {}),
+        /* @__PURE__ */ jsx131(MenuItemSeparator, {}),
         /* @__PURE__ */ jsxs87(MenuItem, { onClick: () => insertTableColumnAtSelection(false), css: menuItemCss, children: [
           "Insert ",
           selectionCounts.columns === 1 ? "column" : `${selectionCounts.columns} columns`,
@@ -22083,11 +22195,11 @@ function TableActionMenu({
           selectionCounts.columns === 1 ? "column" : `${selectionCounts.columns} columns`,
           " right"
         ] }),
-        /* @__PURE__ */ jsx132(MenuItemSeparator, {}),
-        /* @__PURE__ */ jsx132(MenuItem, { onClick: () => deleteTableColumnAtSelection(), css: menuItemCss, children: "Delete column" }),
-        /* @__PURE__ */ jsx132(MenuItem, { onClick: () => deleteTableRowAtSelection(), css: menuItemCss, children: "Delete row" }),
-        /* @__PURE__ */ jsx132(MenuItem, { onClick: () => deleteTableAtSelection(), css: menuItemCss, children: "Delete table" }),
-        /* @__PURE__ */ jsx132(MenuItemSeparator, {}),
+        /* @__PURE__ */ jsx131(MenuItemSeparator, {}),
+        /* @__PURE__ */ jsx131(MenuItem, { onClick: () => deleteTableColumnAtSelection(), css: menuItemCss, children: "Delete column" }),
+        /* @__PURE__ */ jsx131(MenuItem, { onClick: () => deleteTableRowAtSelection(), css: menuItemCss, children: "Delete row" }),
+        /* @__PURE__ */ jsx131(MenuItem, { onClick: () => deleteTableAtSelection(), css: menuItemCss, children: "Delete table" }),
+        /* @__PURE__ */ jsx131(MenuItemSeparator, {}),
         /* @__PURE__ */ jsxs87(MenuItem, { onClick: () => toggleTableRowIsHeader(), css: menuItemCss, children: [
           (tableCellNode.__headerState & TableCellHeaderStates.ROW) === TableCellHeaderStates.ROW ? "Remove" : "Add",
           " ",
@@ -22161,7 +22273,7 @@ function TableCellActionMenuContainer({
       });
     });
   });
-  return tableCellNode != null && tableCellNodeEl != null && tableCellMenuPortalEl != null && /* @__PURE__ */ jsx132(
+  return tableCellNode != null && tableCellNodeEl != null && tableCellMenuPortalEl != null && /* @__PURE__ */ jsx131(
     TableActionMenu,
     {
       tableCellNode,
@@ -22172,15 +22284,12 @@ function TableCellActionMenuContainer({
     tableCellNode.getKey()
   );
 }
-function TableActionMenuPlugin({ positioningAnchorEl }) {
+function TableActionMenuPlugin({
+  positioningAnchorEl,
+  menuPortalEl
+}) {
   const isEditable = useLexicalEditable();
-  return isEditable ? /* @__PURE__ */ jsx132(
-    TableCellActionMenuContainer,
-    {
-      menuPortalEl: positioningAnchorEl,
-      positioningAnchorEl
-    }
-  ) : null;
+  return isEditable ? /* @__PURE__ */ jsx131(TableCellActionMenuContainer, { menuPortalEl, positioningAnchorEl }) : null;
 }
 
 // src/components/ParameterInputs/rich-text/TableCellResizerPlugin.tsx
@@ -22196,9 +22305,9 @@ import {
 } from "@lexical/table";
 import { calculateZoomLevel } from "@lexical/utils";
 import { $getNearestNodeFromDOMNode } from "lexical";
-import { useCallback as useCallback13, useEffect as useEffect22, useMemo as useMemo7, useRef as useRef12, useState as useState19 } from "react";
+import { useCallback as useCallback13, useEffect as useEffect22, useMemo as useMemo7, useRef as useRef13, useState as useState19 } from "react";
 import { createPortal as createPortal3 } from "react-dom";
-import { Fragment as Fragment20, jsx as jsx133, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx132, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
 var MIN_ROW_HEIGHT = 33;
 var MIN_COLUMN_WIDTH = 50;
 var tableResizer = css100`
@@ -22223,10 +22332,10 @@ var fixedGetDOMCellFromTarget = (node) => {
   return null;
 };
 function TableCellResizer({ editor, positioningAnchorEl }) {
-  const targetRef = useRef12(null);
-  const resizerRef = useRef12(null);
-  const tableRectRef = useRef12(null);
-  const mouseStartPosRef = useRef12(null);
+  const targetRef = useRef13(null);
+  const resizerRef = useRef13(null);
+  const tableRectRef = useRef13(null);
+  const mouseStartPosRef = useRef13(null);
   const [mouseCurrentPos, updateMouseCurrentPos] = useState19(null);
   const [activeCell, updateActiveCell] = useState19(null);
   const [isMouseDown, updateIsMouseDown] = useState19(false);
@@ -22462,7 +22571,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
           cursor: "row-resize",
           height: `${zoneWidth}px`,
           left: `${left - parentRect.left}px`,
-          top: `${top - parentRect.top + height - zoneWidth / 2}px`,
+          top: `${top - parentRect.top + positioningAnchorEl.scrollTop + height - zoneWidth / 2}px`,
           width: `${width}px`
         },
         right: {
@@ -22470,7 +22579,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
           cursor: "col-resize",
           height: `${height}px`,
           left: `${left - parentRect.left + width - zoneWidth / 2}px`,
-          top: `${top - parentRect.top}px`,
+          top: `${top - parentRect.top + positioningAnchorEl.scrollTop}px`,
           width: `${zoneWidth}px`
         }
       };
@@ -22478,11 +22587,11 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
       if (draggingDirection && mouseCurrentPos && tableRect) {
         if (isHeightChanging(draggingDirection)) {
           styles[draggingDirection].left = `${tableRect.left - parentRect.left}px`;
-          styles[draggingDirection].top = `${(mouseCurrentPos.y - parentRect.top) / zoom}px`;
+          styles[draggingDirection].top = `${(mouseCurrentPos.y - parentRect.top + positioningAnchorEl.scrollTop) / zoom}px`;
           styles[draggingDirection].height = "3px";
           styles[draggingDirection].width = `${tableRect.width}px`;
         } else {
-          styles[draggingDirection].top = `${tableRect.top - parentRect.top}px`;
+          styles[draggingDirection].top = `${tableRect.top - parentRect.top + positioningAnchorEl.scrollTop}px`;
           styles[draggingDirection].left = `${(mouseCurrentPos.x - parentRect.left) / zoom}px`;
           styles[draggingDirection].width = "3px";
           styles[draggingDirection].height = `${tableRect.height}px`;
@@ -22499,8 +22608,8 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
     };
   }, [activeCell, draggingDirection, mouseCurrentPos, positioningAnchorEl]);
   const resizerStyles = getResizers();
-  return /* @__PURE__ */ jsx133("div", { ref: resizerRef, children: activeCell != null && !isMouseDown && /* @__PURE__ */ jsxs88(Fragment20, { children: [
-    /* @__PURE__ */ jsx133(
+  return /* @__PURE__ */ jsx132("div", { ref: resizerRef, children: activeCell != null && !isMouseDown && /* @__PURE__ */ jsxs88(Fragment20, { children: [
+    /* @__PURE__ */ jsx132(
       "div",
       {
         css: tableResizer,
@@ -22508,7 +22617,7 @@ function TableCellResizer({ editor, positioningAnchorEl }) {
         onMouseDown: toggleResize("right")
       }
     ),
-    /* @__PURE__ */ jsx133(
+    /* @__PURE__ */ jsx132(
       "div",
       {
         css: tableResizer,
@@ -22523,15 +22632,73 @@ function TableCellResizerPlugin({ positioningAnchorEl }) {
   const isEditable = useLexicalEditable2();
   return useMemo7(
     () => isEditable ? createPortal3(
-      /* @__PURE__ */ jsx133(TableCellResizer, { editor, positioningAnchorEl }),
+      /* @__PURE__ */ jsx132(TableCellResizer, { editor, positioningAnchorEl }),
       positioningAnchorEl
     ) : null,
     [editor, isEditable, positioningAnchorEl]
   );
 }
 
+// src/components/ParameterInputs/rich-text/TableSelectionPlugin.tsx
+import { useLexicalComposerContext as useLexicalComposerContext7 } from "@lexical/react/LexicalComposerContext";
+import { $findCellNode } from "@lexical/table";
+import {
+  $getSelection as $getSelection5,
+  $isRangeSelection as $isRangeSelection5,
+  $setSelection,
+  COMMAND_PRIORITY_NORMAL as COMMAND_PRIORITY_NORMAL2,
+  SELECTION_CHANGE_COMMAND as SELECTION_CHANGE_COMMAND3
+} from "lexical";
+import { useEffect as useEffect23, useState as useState20 } from "react";
+var TableSelectionPlugin = () => {
+  const [editor] = useLexicalComposerContext7();
+  const [closestTableCellNode, setClosestTableCellNode] = useState20(null);
+  useEffect23(() => {
+    return editor.registerCommand(
+      SELECTION_CHANGE_COMMAND3,
+      () => {
+        editor.read(() => {
+          const selection = $getSelection5();
+          if (!$isRangeSelection5(selection) || !selection.isCollapsed()) {
+            setClosestTableCellNode(null);
+            return false;
+          }
+          const tableCellNode = $findCellNode(selection.anchor.getNode());
+          if (tableCellNode === null) {
+            setClosestTableCellNode(null);
+            return false;
+          }
+          setClosestTableCellNode(tableCellNode);
+        });
+        return false;
+      },
+      COMMAND_PRIORITY_NORMAL2
+    );
+  }, [editor]);
+  useEffect23(() => {
+    const onControlA = (event) => {
+      if (event.key === "a" && (event.ctrlKey || event.metaKey)) {
+        if (!closestTableCellNode) {
+          return;
+        }
+        event.preventDefault();
+        editor.update(() => {
+          const selection = closestTableCellNode.select(0, closestTableCellNode.getChildrenSize());
+          $setSelection(selection);
+        });
+      }
+    };
+    return editor.registerRootListener((rootElement, prevRootElement) => {
+      rootElement == null ? void 0 : rootElement.addEventListener("keydown", onControlA);
+      prevRootElement == null ? void 0 : prevRootElement.removeEventListener("keydown", onControlA);
+    });
+  }, [editor, closestTableCellNode]);
+  return null;
+};
+var TableSelectionPlugin_default = TableSelectionPlugin;
+
 // src/components/ParameterInputs/ParameterRichText.tsx
-import { Fragment as Fragment21, jsx as jsx134, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment21, jsx as jsx133, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
 var ParameterRichText = ({
   label,
   labelLeadingIcon,
@@ -22573,7 +22740,7 @@ var ParameterRichText = ({
       captionTestId,
       menuItems,
       children: [
-        /* @__PURE__ */ jsx134(
+        /* @__PURE__ */ jsx133(
           ParameterRichTextInner,
           {
             value,
@@ -22594,21 +22761,71 @@ var ParameterRichText = ({
             children
           }
         ),
-        menuItems ? /* @__PURE__ */ jsx134(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx134(Fragment21, { children: menuItems }) }) : null
+        menuItems ? /* @__PURE__ */ jsx133(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx133(Fragment21, { children: menuItems }) }) : null
       ]
     }
   );
 };
+var editorContainerWrapper = css101`
+  position: relative;
+
+  &::before {
+    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 96.12%);
+    bottom: 1px;
+    content: '';
+    display: block;
+    height: 30px;
+    left: var(--spacing-sm);
+    pointer-events: none;
+    position: absolute;
+    right: var(--spacing-sm);
+    z-index: 2;
+  }
+`;
 var editorWrapper = css101`
   display: flex;
   flex-flow: column;
   flex-grow: 1;
 `;
 var editorContainer = css101`
+  ${scrollbarStyles}
+  background: var(--white);
+  border-radius: var(--rounded-sm);
+  border: 1px solid var(--gray-200);
+  color: var(--gray-900);
   display: flex;
   flex-flow: column;
   flex-grow: 1;
+  font-size: var(--fs-base);
+  height: max-content;
+  line-height: 1.2;
+  max-height: 300px;
+  min-height: 50px;
+  overflow-y: auto;
+  padding: var(--spacing-sm);
   position: relative;
+  resize: vertical;
+
+  &:focus,
+  &:focus-within {
+    border-radius: var(--rounded-sm);
+    box-shadow: var(--elevation-100);
+    border: 1px solid var(--accent-dark-hover);
+    outline: none;
+  }
+
+  &[style*='height:'] {
+    min-height: 50px;
+    max-height: unset;
+  }
+`;
+var editorContainerOverflowWrapper = css101`
+  overflow: hidden;
+  pointer-events: none;
+
+  & > * {
+    pointer-events: auto;
+  }
 `;
 var editorPlaceholder = css101`
   color: var(--gray-500);
@@ -22622,21 +22839,10 @@ var editorPlaceholder = css101`
   user-select: none;
 `;
 var editorInput = css101`
-  background: var(--white);
-  border: 1px solid var(--gray-200);
-  border-radius: var(--rounded-sm);
-  color: var(--gray-900);
-  flex-grow: 1;
-  font-size: var(--fs-base);
-  line-height: 1.2;
-  min-height: 2rem;
-  padding: var(--spacing-sm);
+  min-height: 100%;
 
   &:focus,
   &:focus-within {
-    border-radius: var(--rounded-sm);
-    box-shadow: var(--elevation-100);
-    border: 1px solid var(--accent-dark-hover);
     outline: none;
   }
 `;
@@ -22665,7 +22871,7 @@ var ParameterRichTextInner = ({
     },
     editorState: value ? JSON.stringify(value) : void 0,
     nodes: [
-      ListNode2,
+      ListNode3,
       ListItemNode,
       LinkNode,
       HeadingNode,
@@ -22673,7 +22879,7 @@ var ParameterRichTextInner = ({
       ParagraphNode2,
       CustomCodeNode,
       TableNode,
-      TableCellNode2,
+      TableCellNode3,
       TableRowNode2,
       ...customNodes != null ? customNodes : []
     ],
@@ -22715,7 +22921,7 @@ var ParameterRichTextInner = ({
     editable: !readOnly
   };
   return /* @__PURE__ */ jsxs89(Fragment21, { children: [
-    /* @__PURE__ */ jsx134("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx134(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx134(
+    /* @__PURE__ */ jsx133("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx133(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx133(
       RichText,
       {
         onChange,
@@ -22758,13 +22964,13 @@ var RichText = ({
   onInsertTable,
   minimalInteractivity
 }) => {
-  const [editor] = useLexicalComposerContext7();
-  useEffect23(() => {
+  const [editor] = useLexicalComposerContext8();
+  useEffect24(() => {
     if (onRichTextInit) {
       onRichTextInit(editor);
     }
   }, [editor, onRichTextInit]);
-  useEffect23(() => {
+  useEffect24(() => {
     const removeUpdateListener = editor.registerUpdateListener(({ editorState, prevEditorState, tags }) => {
       requestAnimationFrame(() => {
         if (!deepEqual2(editorState.toJSON(), prevEditorState.toJSON())) {
@@ -22776,66 +22982,81 @@ var RichText = ({
       removeUpdateListener();
     };
   }, [editor, onChange]);
-  useEffect23(() => {
+  useEffect24(() => {
     editor.setEditable(!readOnly);
   }, [editor, readOnly]);
-  const [editorContainerRef, setEditorContainerRef] = useState20(null);
-  const onRef = (_editorContainerRef) => {
+  const [editorContainerRef, setEditorContainerRef] = useState21(null);
+  const onEditorContainerRef = (_editorContainerRef) => {
     if (_editorContainerRef !== null) {
       setEditorContainerRef(_editorContainerRef);
     }
   };
+  const [portalContainerRef, setPortalContainerRef] = useState21(null);
+  const onPortalContainerRef = (_portalContainerRef) => {
+    if (_portalContainerRef !== null) {
+      setPortalContainerRef(_portalContainerRef);
+    }
+  };
   return /* @__PURE__ */ jsxs89(Fragment21, { children: [
-    readOnly || minimalInteractivity ? null : /* @__PURE__ */ jsx134(RichTextToolbar_default, { config, customControls, onInsertTable }),
-    /* @__PURE__ */ jsxs89(
-      "div",
-      {
-        css: editorContainer,
-        className: editorInputWrapperClassName,
-        ref: onRef,
-        "data-testid": "value-container",
-        children: [
-          /* @__PURE__ */ jsx134(
-            RichTextPlugin,
-            {
-              contentEditable: /* @__PURE__ */ jsx134(ContentEditable, { css: editorInput, className: editorInputClassName }),
-              placeholder: /* @__PURE__ */ jsx134("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
-              ErrorBoundary: LexicalErrorBoundary
-            }
-          ),
-          /* @__PURE__ */ jsx134(ListPlugin, {}),
-          /* @__PURE__ */ jsx134(TablePlugin, {}),
-          editorContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx134(TableActionMenuPlugin, { positioningAnchorEl: editorContainerRef }) : null,
-          editorContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx134(TableCellResizerPlugin, { positioningAnchorEl: editorContainerRef }) : null,
-          readOnly ? null : /* @__PURE__ */ jsx134(HistoryPlugin, {}),
-          editorContainerRef ? /* @__PURE__ */ jsx134(
-            LinkNodePlugin,
-            {
-              onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
-              getBoundPath: (variables == null ? void 0 : variables.bindVariables) ? (path) => {
-                var _a, _b;
-                return (_b = (_a = variables.bindVariables) == null ? void 0 : _a.call(variables, path)) != null ? _b : path;
-              } : void 0,
-              positioningAnchorEl: editorContainerRef
-            }
-          ) : null,
-          /* @__PURE__ */ jsx134(ListIndentPlugin, { maxDepth: 4 }),
-          /* @__PURE__ */ jsx134(DisableStylesPlugin, {}),
-          /* @__PURE__ */ jsx134(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
-          /* @__PURE__ */ jsx134(Fragment21, { children })
-        ]
-      }
-    )
+    readOnly || minimalInteractivity ? null : /* @__PURE__ */ jsx133(RichTextToolbar_default, { config, customControls, onInsertTable }),
+    /* @__PURE__ */ jsxs89("div", { css: editorContainerWrapper, ref: onPortalContainerRef, children: [
+      /* @__PURE__ */ jsxs89(
+        "div",
+        {
+          css: editorContainer,
+          className: editorInputWrapperClassName,
+          ref: onEditorContainerRef,
+          "data-testid": "value-container",
+          children: [
+            /* @__PURE__ */ jsx133(
+              RichTextPlugin,
+              {
+                contentEditable: /* @__PURE__ */ jsx133(ContentEditable, { css: editorInput, className: editorInputClassName }),
+                placeholder: /* @__PURE__ */ jsx133("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
+                ErrorBoundary: LexicalErrorBoundary
+              }
+            ),
+            /* @__PURE__ */ jsx133(ListPlugin, {}),
+            /* @__PURE__ */ jsx133(ListIndentPlugin, { maxDepth: 4 }),
+            /* @__PURE__ */ jsx133(TablePlugin, { hasCellMerge: false, hasCellBackgroundColor: false }),
+            /* @__PURE__ */ jsx133("div", { css: editorContainerOverflowWrapper, children: editorContainerRef && portalContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx133(
+              TableActionMenuPlugin,
+              {
+                positioningAnchorEl: editorContainerRef,
+                menuPortalEl: portalContainerRef
+              }
+            ) : null }),
+            editorContainerRef && !minimalInteractivity ? /* @__PURE__ */ jsx133(TableCellResizerPlugin, { positioningAnchorEl: editorContainerRef }) : null,
+            readOnly ? null : /* @__PURE__ */ jsx133(HistoryPlugin, {}),
+            /* @__PURE__ */ jsx133(DisableStylesPlugin, {}),
+            /* @__PURE__ */ jsx133(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx133(Fragment21, { children }),
+      editorContainerRef ? /* @__PURE__ */ jsx133(
+        LinkNodePlugin,
+        {
+          onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
+          getBoundPath: (variables == null ? void 0 : variables.bindVariables) ? (path) => {
+            var _a, _b;
+            return (_b = (_a = variables.bindVariables) == null ? void 0 : _a.call(variables, path)) != null ? _b : path;
+          } : void 0,
+          positioningAnchorEl: editorContainerRef
+        }
+      ) : null,
+      /* @__PURE__ */ jsx133(TableSelectionPlugin_default, {})
+    ] })
   ] });
 };
 
 // src/components/ParameterInputs/ParameterSelect.tsx
 import { forwardRef as forwardRef23 } from "react";
-import { jsx as jsx135, jsxs as jsxs90 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx134, jsxs as jsxs90 } from "@emotion/react/jsx-runtime";
 var ParameterSelect = forwardRef23(
   ({ defaultOption, options, ...props }, ref) => {
     const { shellProps, innerProps } = extractParameterProps(props);
-    return /* @__PURE__ */ jsx135(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx135(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
+    return /* @__PURE__ */ jsx134(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx134(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
   }
 );
 var ParameterSelectInner = forwardRef23(
@@ -22850,10 +23071,10 @@ var ParameterSelectInner = forwardRef23(
         ref,
         ...props,
         children: [
-          defaultOption ? /* @__PURE__ */ jsx135("option", { value: "", children: defaultOption }) : null,
+          defaultOption ? /* @__PURE__ */ jsx134("option", { value: "", children: defaultOption }) : null,
           options.map((option) => {
             var _a;
-            return /* @__PURE__ */ jsx135("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
+            return /* @__PURE__ */ jsx134("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
           })
         ]
       }
@@ -22863,14 +23084,14 @@ var ParameterSelectInner = forwardRef23(
 
 // src/components/ParameterInputs/ParameterTextarea.tsx
 import { forwardRef as forwardRef24 } from "react";
-import { jsx as jsx136 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx135 } from "@emotion/react/jsx-runtime";
 var ParameterTextarea = forwardRef24((props, ref) => {
   const { shellProps, innerProps } = extractParameterProps(props);
-  return /* @__PURE__ */ jsx136(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx136(ParameterTextareaInner, { ref, ...innerProps }) });
+  return /* @__PURE__ */ jsx135(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx135(ParameterTextareaInner, { ref, ...innerProps }) });
 });
 var ParameterTextareaInner = forwardRef24(({ ...props }, ref) => {
   const { id, label, hiddenLabel } = useParameterShell();
-  return /* @__PURE__ */ jsx136(
+  return /* @__PURE__ */ jsx135(
     "textarea",
     {
       css: [input3, textarea2],
@@ -22884,17 +23105,17 @@ var ParameterTextareaInner = forwardRef24(({ ...props }, ref) => {
 
 // src/components/ParameterInputs/ParameterToggle.tsx
 import { forwardRef as forwardRef25 } from "react";
-import { jsx as jsx137, jsxs as jsxs91 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx136, jsxs as jsxs91 } from "@emotion/react/jsx-runtime";
 var ParameterToggle = forwardRef25((props, ref) => {
   const { shellProps, innerProps } = extractParameterProps(props);
-  return /* @__PURE__ */ jsx137(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx137(ParameterToggleInner, { ref, ...innerProps }) });
+  return /* @__PURE__ */ jsx136(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx136(ParameterToggleInner, { ref, ...innerProps }) });
 });
 var ParameterToggleInner = forwardRef25(
   ({ children, ...props }, ref) => {
     const { id, label } = useParameterShell();
     return /* @__PURE__ */ jsxs91("label", { css: inputToggleLabel2, children: [
-      /* @__PURE__ */ jsx137("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
-      /* @__PURE__ */ jsx137("span", { css: inlineLabel2, children: label }),
+      /* @__PURE__ */ jsx136("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
+      /* @__PURE__ */ jsx136("span", { css: inlineLabel2, children: label }),
       children
     ] });
   }
@@ -22955,7 +23176,7 @@ var bar = css102`
 `;
 
 // src/components/ProgressBar/ProgressBar.tsx
-import { jsx as jsx138 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx137 } from "@emotion/react/jsx-runtime";
 function ProgressBar({
   current,
   max,
@@ -22965,7 +23186,7 @@ function ProgressBar({
 }) {
   const valueNow = Math.min(current, max);
   const valuePercentage = max > 0 ? Math.ceil(100 / max * valueNow) : 0;
-  return /* @__PURE__ */ jsx138(
+  return /* @__PURE__ */ jsx137(
     "div",
     {
       css: container3,
@@ -22976,7 +23197,7 @@ function ProgressBar({
       "aria-valuemax": max,
       "aria-valuenow": valueNow,
       ...props,
-      children: /* @__PURE__ */ jsx138(
+      children: /* @__PURE__ */ jsx137(
         "div",
         {
           css: [
@@ -23016,7 +23237,7 @@ var progressListItemStyles = css103`
 `;
 
 // src/components/ProgressList/ProgressList.tsx
-import { jsx as jsx139, jsxs as jsxs92 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx138, jsxs as jsxs92 } from "@emotion/react/jsx-runtime";
 var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
   const itemsWithStatus = useMemo8(() => {
     const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
@@ -23030,8 +23251,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
       return { ...item, status };
     });
   }, [items, inProgressId]);
-  return /* @__PURE__ */ jsx139("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
-    return /* @__PURE__ */ jsx139(
+  return /* @__PURE__ */ jsx138("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
+    return /* @__PURE__ */ jsx138(
       ProgressListItem,
       {
         status,
@@ -23090,10 +23311,10 @@ var ProgressListItem = ({
     return colorPerStatus[status];
   }, [status, error, errorLevel]);
   return /* @__PURE__ */ jsxs92("li", { css: [progressListItemStyles, statusStyles], children: [
-    /* @__PURE__ */ jsx139(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx139("div", { children: /* @__PURE__ */ jsx139(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
+    /* @__PURE__ */ jsx138(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx138("div", { children: /* @__PURE__ */ jsx138(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
     /* @__PURE__ */ jsxs92("div", { children: [
       children,
-      /* @__PURE__ */ jsx139("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
+      /* @__PURE__ */ jsx138("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
     ] })
   ] });
 };
@@ -23101,7 +23322,7 @@ var ProgressListItem = ({
 // src/components/SegmentedControl/SegmentedControl.tsx
 import { css as css106 } from "@emotion/react";
 import { CgCheck as CgCheck5 } from "@react-icons/all-files/cg/CgCheck";
-import { useCallback as useCallback14, useEffect as useEffect24, useMemo as useMemo9, useRef as useRef13, useState as useState21 } from "react";
+import { useCallback as useCallback14, useEffect as useEffect25, useMemo as useMemo9, useRef as useRef14, useState as useState22 } from "react";
 
 // src/components/SegmentedControl/SegmentedControl.styles.ts
 import { css as css105 } from "@emotion/react";
@@ -23277,7 +23498,7 @@ var segmentedControlLabelTextStyles = css105`
 `;
 
 // src/components/SegmentedControl/SegmentedControl.tsx
-import { jsx as jsx140, jsxs as jsxs93 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx139, jsxs as jsxs93 } from "@emotion/react/jsx-runtime";
 var SegmentedControl = ({
   name,
   options,
@@ -23292,9 +23513,9 @@ var SegmentedControl = ({
   currentBackgroundColor = "white",
   ...props
 }) => {
-  const wrapperRef = useRef13(null);
-  const [isOverflowStartShadowVisible, setIsOverflowStartShadowVisible] = useState21(false);
-  const [isOverflowEndShadowVisible, setIsOverflowEndShadowVisible] = useState21(false);
+  const wrapperRef = useRef14(null);
+  const [isOverflowStartShadowVisible, setIsOverflowStartShadowVisible] = useState22(false);
+  const [isOverflowEndShadowVisible, setIsOverflowEndShadowVisible] = useState22(false);
   const onOptionChange = useCallback14(
     (event) => {
       if (event.target.checked) {
@@ -23315,7 +23536,7 @@ var SegmentedControl = ({
   const isIconOnly = useMemo9(() => {
     return options.every((option) => option && option.icon && !option.label);
   }, [options]);
-  useEffect24(() => {
+  useEffect25(() => {
     const wrapperElement = wrapperRef.current;
     const onScroll = () => {
       if (!wrapperElement) {
@@ -23337,7 +23558,7 @@ var SegmentedControl = ({
     };
   }, []);
   return /* @__PURE__ */ jsxs93("div", { css: [segmentedControlRootStyles, { "--background-color": currentBackgroundColor }], children: [
-    /* @__PURE__ */ jsx140("div", { ref: wrapperRef, css: segmentedControlWrapperStyles, children: /* @__PURE__ */ jsx140(
+    /* @__PURE__ */ jsx139("div", { ref: wrapperRef, css: segmentedControlWrapperStyles, children: /* @__PURE__ */ jsx139(
       "div",
       {
         css: [
@@ -23353,7 +23574,7 @@ var SegmentedControl = ({
           }
           const text = option.label ? option.label : option.icon ? null : String(option.value);
           const isDisabled = disabled2 || option.disabled;
-          return /* @__PURE__ */ jsx140(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx140(
+          return /* @__PURE__ */ jsx139(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx139(
             "div",
             {
               css: segmentedControlItemStyles,
@@ -23367,7 +23588,7 @@ var SegmentedControl = ({
                     isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
                   ],
                   children: [
-                    /* @__PURE__ */ jsx140(
+                    /* @__PURE__ */ jsx139(
                       "input",
                       {
                         css: segmentedControlInputStyles,
@@ -23379,10 +23600,10 @@ var SegmentedControl = ({
                         disabled: isDisabled
                       }
                     ),
-                    option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx140(CgCheck5, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
+                    option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx139(CgCheck5, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
                     /* @__PURE__ */ jsxs93("span", { css: segmentedControlLabelContentStyles, children: [
-                      !option.icon ? null : /* @__PURE__ */ jsx140(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
-                      !text || hideOptionText ? null : /* @__PURE__ */ jsx140("span", { css: segmentedControlLabelTextStyles, children: text })
+                      !option.icon ? null : /* @__PURE__ */ jsx139(Icon, { icon: option.icon, size: iconSize, iconColor: "currentColor" }),
+                      !text || hideOptionText ? null : /* @__PURE__ */ jsx139("span", { css: segmentedControlLabelTextStyles, children: text })
                     ] })
                   ]
                 }
@@ -23392,7 +23613,7 @@ var SegmentedControl = ({
         })
       }
     ) }),
-    /* @__PURE__ */ jsx140(
+    /* @__PURE__ */ jsx139(
       "div",
       {
         css: [
@@ -23417,7 +23638,7 @@ var skeletonStyles = css107`
 `;
 
 // src/components/Skeleton/Skeleton.tsx
-import { jsx as jsx141 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx140 } from "@emotion/react/jsx-runtime";
 var Skeleton = ({
   width = "100%",
   height = "1.25rem",
@@ -23425,7 +23646,7 @@ var Skeleton = ({
   circle = false,
   children,
   ...otherProps
-}) => /* @__PURE__ */ jsx141(
+}) => /* @__PURE__ */ jsx140(
   "div",
   {
     css: [
@@ -23535,7 +23756,7 @@ var SwitchText = (size) => css108`
 `;
 
 // src/components/Switch/Switch.tsx
-import { Fragment as Fragment22, jsx as jsx142, jsxs as jsxs94 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment22, jsx as jsx141, jsxs as jsxs94 } from "@emotion/react/jsx-runtime";
 var Switch = forwardRef26(
   ({ label, infoText, toggleText, children, switchSize = "base", ...inputProps }, ref) => {
     let additionalText = infoText;
@@ -23548,12 +23769,12 @@ var Switch = forwardRef26(
         {
           css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0],
           children: [
-            /* @__PURE__ */ jsx142("input", { type: "checkbox", css: SwitchInput(switchSize), ...inputProps, ref }),
-            /* @__PURE__ */ jsx142("span", { css: SwitchInputLabel(switchSize), children: label })
+            /* @__PURE__ */ jsx141("input", { type: "checkbox", css: SwitchInput(switchSize), ...inputProps, ref }),
+            /* @__PURE__ */ jsx141("span", { css: SwitchInputLabel(switchSize), children: label })
           ]
         }
       ),
-      additionalText ? /* @__PURE__ */ jsx142("p", { css: SwitchText(switchSize), children: additionalText }) : null,
+      additionalText ? /* @__PURE__ */ jsx141("p", { css: SwitchText(switchSize), children: additionalText }) : null,
       children
     ] });
   }
@@ -23598,40 +23819,40 @@ var tableCellHead = css109`
 `;
 
 // src/components/Table/Table.tsx
-import { jsx as jsx143 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx142 } from "@emotion/react/jsx-runtime";
 var Table = React24.forwardRef(
   ({ children, cellPadding, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx143("table", { ref, css: table({ cellPadding }), ...otherProps, children });
+    return /* @__PURE__ */ jsx142("table", { ref, css: table({ cellPadding }), ...otherProps, children });
   }
 );
 var TableHead = React24.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx143("thead", { ref, css: tableHead, ...otherProps, children });
+    return /* @__PURE__ */ jsx142("thead", { ref, css: tableHead, ...otherProps, children });
   }
 );
 var TableBody = React24.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx143("tbody", { ref, ...otherProps, children });
+    return /* @__PURE__ */ jsx142("tbody", { ref, ...otherProps, children });
   }
 );
 var TableFoot = React24.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx143("tfoot", { ref, ...otherProps, children });
+    return /* @__PURE__ */ jsx142("tfoot", { ref, ...otherProps, children });
   }
 );
 var TableRow = React24.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx143("tr", { ref, css: tableRow, ...otherProps, children });
+    return /* @__PURE__ */ jsx142("tr", { ref, css: tableRow, ...otherProps, children });
   }
 );
 var TableCellHead = React24.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx143("th", { ref, css: tableCellHead, ...otherProps, children });
+    return /* @__PURE__ */ jsx142("th", { ref, css: tableCellHead, ...otherProps, children });
   }
 );
 var TableCellData = React24.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx143("td", { ref, ...otherProps, children });
+    return /* @__PURE__ */ jsx142("td", { ref, ...otherProps, children });
   }
 );
 
@@ -23643,7 +23864,7 @@ import {
   TabProvider as AriakitTabProvider,
   useTabStore as useAriakitTabStore
 } from "@ariakit/react";
-import { useCallback as useCallback15, useEffect as useEffect25, useMemo as useMemo10 } from "react";
+import { useCallback as useCallback15, useEffect as useEffect26, useMemo as useMemo10 } from "react";
 
 // src/components/Tabs/Tabs.styles.ts
 import { css as css110 } from "@emotion/react";
@@ -23671,7 +23892,7 @@ var tabButtonGroupStyles = css110`
 `;
 
 // src/components/Tabs/Tabs.tsx
-import { jsx as jsx144 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx143 } from "@emotion/react/jsx-runtime";
 var useCurrentTab = () => {
   const context = useAriakitTabStore();
   if (!context) {
@@ -23703,28 +23924,28 @@ var Tabs = ({
     },
     [onSelectedIdChange, useHashForState]
   );
-  useEffect25(() => {
+  useEffect26(() => {
     if (selected && selected !== tab.getState().activeId) {
       tab.setSelectedId(selected);
     }
   }, [selected, tab]);
-  return /* @__PURE__ */ jsx144(AriakitTabProvider, { store: tab, setSelectedId: onTabSelect, children });
+  return /* @__PURE__ */ jsx143(AriakitTabProvider, { store: tab, setSelectedId: onTabSelect, children });
 };
 var TabButtonGroup = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsx144(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
+  return /* @__PURE__ */ jsx143(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
 };
 var TabButton = ({
   children,
   id,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx144(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
+  return /* @__PURE__ */ jsx143(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
 };
 var TabContent = ({
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx144(AriakitTabPanel, { ...props, children });
+  return /* @__PURE__ */ jsx143(AriakitTabPanel, { ...props, children });
 };
 
 // src/components/Validation/StatusBullet.styles.ts
@@ -23807,7 +24028,7 @@ var StatusDeleted = css111`
 `;
 
 // src/components/Validation/StatusBullet.tsx
-import { jsx as jsx145 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx144 } from "@emotion/react/jsx-runtime";
 var StatusBullet = ({
   status,
   hideText = false,
@@ -23827,7 +24048,7 @@ var StatusBullet = ({
     Deleted: StatusDeleted
   };
   const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
-  return /* @__PURE__ */ jsx145(
+  return /* @__PURE__ */ jsx144(
     "span",
     {
       role: "status",