@underverse-ui/underverse 1.0.126 → 1.0.128

package/dist/index.js

@@ -7218,7 +7218,7 @@ var DropdownMenuItem = ({
     disabled,
     onMouseDown: (e) => e.preventDefault(),
     className: cn(
-      "flex w-full items-center gap-2 px-3 py-2 text-sm rounded-lg transition-colors group",
+      "flex w-full items-center gap-2 px-3 py-2 text-sm rounded-lg transition-colors group cursor-pointer",
       "hover:bg-accent hover:text-accent-foreground",
       "focus:bg-accent focus:text-accent-foreground focus:outline-none",
       "disabled:opacity-50 disabled:cursor-not-allowed",
@@ -25298,7 +25298,6 @@ function buildUEditorExtensions({
 
 // src/components/UEditor/toolbar.tsx
 import React73, { useRef as useRef31, useState as useState44 } from "react";
-import { createPortal as createPortal8 } from "react-dom";
 import { useEditorState } from "@tiptap/react";
 import {
   AlignCenter,
@@ -25309,8 +25308,10 @@ import {
   ArrowLeft,
   ArrowRight,
   ArrowUp,
+  Baseline,
   Bold as BoldIcon,
   ChevronDown as ChevronDown7,
+  ChevronsUpDown,
   Code as CodeIcon,
   FileCode as FileCode3,
   Heading1 as Heading1Icon,
@@ -25828,7 +25829,7 @@ var ToolbarButton = React73.forwardRef(({ onClick, onMouseDown, active, disabled
       onClick,
       disabled,
       className: cn(
-        "flex items-center justify-center w-8 h-8 rounded-md transition-colors duration-150",
+        "flex items-center justify-center w-7 h-7 rounded-md transition-colors duration-150 cursor-pointer",
         "gap-0.5 [&_svg+svg]:-ml-1",
         "hover:bg-accent",
         "focus:outline-none focus:ring-2 focus:ring-primary/20",
@@ -25907,11 +25908,6 @@ var EditorToolbar = ({
   const fileInputRef = useRef31(null);
   const [isUploadingImage, setIsUploadingImage] = useState44(false);
   const [imageUploadError, setImageUploadError] = useState44(null);
-  const [fontSizeDraft, setFontSizeDraft] = useState44("");
-  const [isFontSizeMenuOpen, setIsFontSizeMenuOpen] = useState44(false);
-  const [fontSizeMenuPosition, setFontSizeMenuPosition] = useState44({ top: 0, left: 0 });
-  const fontSizeControlRef = useRef31(null);
-  const fontSizeMenuRef = useRef31(null);
   const isImageSelected = editor.isActive("image");
   const imageAttrs = editor.getAttributes("image");
   const tableAttrs = editor.getAttributes("table");
@@ -25937,53 +25933,6 @@ var EditorToolbar = ({
   const currentLineHeightLabel = availableLineHeights.find((option) => normalizeStyleValue(option.value) === currentLineHeight)?.label ?? t("toolbar.lineHeightDefault");
   const currentLetterSpacingLabel = availableLetterSpacings.find((option) => normalizeStyleValue(option.value) === currentLetterSpacing)?.label ?? t("toolbar.letterSpacingDefault");
   const displayedFontFamilyLabel = currentFontFamily ? currentFontFamilyLabel : availableFontFamilies[0]?.label ?? t("toolbar.fontDefault");
-  React73.useEffect(() => {
-    if (document.activeElement === fontSizeControlRef.current?.querySelector("input")) return;
-    setFontSizeDraft(currentFontSize.replace(/px$/i, "") || "16");
-  }, [currentFontSize]);
-  const applyFontSizeDraft = () => {
-    const normalized = fontSizeDraft.trim();
-    if (!normalized) {
-      editor.chain().focus().unsetFontSize().run();
-      return;
-    }
-    const parsed = Number.parseFloat(normalized);
-    if (!Number.isFinite(parsed) || parsed <= 0) return;
-    const clamped = Math.min(96, Math.max(8, parsed));
-    editor.chain().focus().setFontSize(`${clamped}px`).run();
-    setFontSizeDraft(String(clamped));
-  };
-  const updateFontSizeMenuPosition = React73.useCallback(() => {
-    const rect = fontSizeControlRef.current?.getBoundingClientRect();
-    if (!rect) return;
-    setFontSizeMenuPosition({
-      top: Math.round(rect.bottom + 4),
-      left: Math.round(rect.left)
-    });
-  }, []);
-  const toggleFontSizeMenu = () => {
-    updateFontSizeMenuPosition();
-    setIsFontSizeMenuOpen((open) => !open);
-  };
-  React73.useEffect(() => {
-    if (!isFontSizeMenuOpen) return;
-    updateFontSizeMenuPosition();
-    const handlePointerDown = (event) => {
-      const target = event.target;
-      if (fontSizeControlRef.current?.contains(target)) return;
-      if (fontSizeMenuRef.current?.contains(target)) return;
-      setIsFontSizeMenuOpen(false);
-    };
-    const handleLayoutChange = () => updateFontSizeMenuPosition();
-    document.addEventListener("mousedown", handlePointerDown);
-    window.addEventListener("resize", handleLayoutChange);
-    window.addEventListener("scroll", handleLayoutChange, true);
-    return () => {
-      document.removeEventListener("mousedown", handlePointerDown);
-      window.removeEventListener("resize", handleLayoutChange);
-      window.removeEventListener("scroll", handleLayoutChange, true);
-    };
-  }, [isFontSizeMenuOpen, updateFontSizeMenuPosition]);
   const insertImageFiles = async (files) => {
     if (files.length === 0) return;
     setIsUploadingImage(true);
@@ -26023,21 +25972,11 @@ var EditorToolbar = ({
     /* @__PURE__ */ jsxs67(
       DropdownMenu,
       {
-        trigger: /* @__PURE__ */ jsxs67(
-          "button",
-          {
-            type: "button",
-            "aria-label": t("toolbar.fontFamily"),
-            className: cn(
-              "flex h-8 min-w-34 max-w-42 items-center justify-between gap-2 rounded-full border border-border/60 bg-muted/30 px-2.5 text-xs text-foreground",
-              "transition-colors hover:bg-accent focus:outline-none focus:ring-2 focus:ring-primary/20"
-            ),
-            children: [
-              /* @__PURE__ */ jsx81("span", { className: "truncate", children: displayedFontFamilyLabel }),
-              /* @__PURE__ */ jsx81(ChevronDown7, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground" })
-            ]
-          }
-        ),
+        trigger: /* @__PURE__ */ jsxs67(ToolbarButton, { onClick: () => {
+        }, title: t("toolbar.fontFamily"), className: "px-1.5 w-auto gap-0.5", children: [
+          /* @__PURE__ */ jsx81(Baseline, { className: "w-4 h-4" }),
+          /* @__PURE__ */ jsx81(ChevronDown7, { className: "h-3 w-3 text-muted-foreground" })
+        ] }),
         contentClassName: "max-h-80 overflow-y-auto min-w-56 p-2",
         children: [
           /* @__PURE__ */ jsx81(
@@ -26055,102 +25994,55 @@ var EditorToolbar = ({
               label: option.label,
               onClick: () => editor.chain().focus().setFontFamily(option.value).run(),
               active: normalizeStyleValue(option.value) === currentFontFamily,
-              className: "font-medium "
+              className: "font-medium"
             },
             option.value
           ))
         ]
       }
     ),
-    /* @__PURE__ */ jsxs67(Fragment27, { children: [
-      /* @__PURE__ */ jsxs67(
-        "div",
-        {
-          ref: fontSizeControlRef,
-          "aria-label": t("toolbar.fontSize"),
-          className: cn(
-            "flex h-8 min-w-16 items-center overflow-hidden rounded-full border border-border/60 bg-muted/30 text-xs font-semibold text-foreground",
-            "transition-colors focus-within:ring-2 focus-within:ring-primary/20"
+    /* @__PURE__ */ jsxs67(
+      DropdownMenu,
+      {
+        trigger: /* @__PURE__ */ jsxs67(ToolbarButton, { onClick: () => {
+        }, title: t("toolbar.fontSize"), className: "px-1.5 w-auto gap-0.5", children: [
+          /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-0.5", children: [
+            /* @__PURE__ */ jsx81(ChevronsUpDown, { className: "h-3 w-3 text-muted-foreground", strokeWidth: 2.5 }),
+            /* @__PURE__ */ jsx81("span", { className: "text-xs font-bold leading-none", children: "A" })
+          ] }),
+          /* @__PURE__ */ jsx81(ChevronDown7, { className: "h-3 w-3 text-muted-foreground" })
+        ] }),
+        contentClassName: "max-h-80 overflow-y-auto min-w-32 p-2",
+        children: [
+          /* @__PURE__ */ jsx81(
+            DropdownMenuItem,
+            {
+              icon: Type2,
+              label: t("toolbar.sizeDefault"),
+              onClick: () => editor.chain().focus().unsetFontSize().run(),
+              active: !currentFontSize
+            }
           ),
-          children: [
-            /* @__PURE__ */ jsx81(
-              "input",
-              {
-                type: "number",
-                min: 8,
-                max: 96,
-                step: 1,
-                value: fontSizeDraft,
-                onChange: (e) => setFontSizeDraft(e.target.value),
-                onBlur: applyFontSizeDraft,
-                onMouseDown: (e) => e.stopPropagation(),
-                onClick: (e) => e.stopPropagation(),
-                onKeyDown: (e) => {
-                  e.stopPropagation();
-                  if (e.key === "Enter") {
-                    e.preventDefault();
-                    applyFontSizeDraft();
-                  }
-                },
-                "aria-label": t("toolbar.fontSize"),
-                className: "h-full w-10 bg-transparent px-1 text-center text-xs font-semibold outline-none [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none"
-              }
-            ),
-            /* @__PURE__ */ jsx81(
-              "button",
-              {
-                type: "button",
-                "aria-label": t("toolbar.fontSize"),
-                "aria-expanded": isFontSizeMenuOpen,
-                onClick: toggleFontSizeMenu,
-                className: "flex h-full w-7 items-center justify-center border-l border-border/50 text-muted-foreground transition-colors hover:bg-accent hover:text-foreground",
-                children: /* @__PURE__ */ jsx81(ChevronDown7, { className: "h-3.5 w-3.5" })
-              }
-            )
-          ]
-        }
-      ),
-      isFontSizeMenuOpen && typeof document !== "undefined" && createPortal8(
-        /* @__PURE__ */ jsx81(
-          "div",
-          {
-            ref: fontSizeMenuRef,
-            className: "fixed z-[10000] max-h-64 w-12 overflow-y-auto rounded-md border border-border/70 bg-popover p-0.5 text-popover-foreground shadow-md",
-            style: { top: fontSizeMenuPosition.top, left: fontSizeMenuPosition.left },
-            children: availableFontSizes.map((option) => {
-              const active = normalizeStyleValue(option.value) === currentFontSize;
-              return /* @__PURE__ */ jsx81(
-                "button",
-                {
-                  type: "button",
-                  onMouseDown: (e) => e.preventDefault(),
-                  onClick: () => {
-                    editor.chain().focus().setFontSize(option.value).run();
-                    setFontSizeDraft(option.label);
-                    setIsFontSizeMenuOpen(false);
-                  },
-                  className: cn(
-                    "flex h-6 w-full items-center justify-center rounded text-xs leading-none transition-colors",
-                    active ? "bg-primary/15 text-primary" : "text-foreground hover:bg-accent hover:text-accent-foreground"
-                  ),
-                  children: option.label
-                },
-                option.value
-              );
-            })
-          }
-        ),
-        document.body
-      )
-    ] }),
+          availableFontSizes.map((option) => /* @__PURE__ */ jsx81(
+            DropdownMenuItem,
+            {
+              label: option.label,
+              onClick: () => editor.chain().focus().setFontSize(option.value).run(),
+              active: normalizeStyleValue(option.value) === currentFontSize
+            },
+            option.value
+          ))
+        ]
+      }
+    ),
     /* @__PURE__ */ jsxs67(
       DropdownMenu,
       {
-        contentClassName: "p-2",
+        contentClassName: "p-1",
         trigger: /* @__PURE__ */ jsxs67(ToolbarButton, { onClick: () => {
-        }, title: t("toolbar.textStyle"), className: "px-2 w-auto gap-1", children: [
+        }, title: t("toolbar.textStyle"), className: "px-1.5 w-auto gap-0.5", children: [
           /* @__PURE__ */ jsx81(Type2, { className: "w-4 h-4" }),
-          /* @__PURE__ */ jsx81(ChevronDown7, { className: "w-3 h-3" })
+          /* @__PURE__ */ jsx81(ChevronDown7, { className: "h-3 w-3 text-muted-foreground" })
         ] }),
         children: [
           /* @__PURE__ */ jsx81(
@@ -26203,7 +26095,7 @@ var EditorToolbar = ({
           /* @__PURE__ */ jsx81(ArrowUp, { className: "w-3 h-3" }),
           /* @__PURE__ */ jsx81(ArrowDown, { className: "w-3 h-3" })
         ] }),
-        contentClassName: "max-h-72 overflow-y-auto p-2",
+        contentClassName: "max-h-72 overflow-y-auto p-1",
         children: [
           /* @__PURE__ */ jsx81(
             DropdownMenuItem,
@@ -26234,7 +26126,7 @@ var EditorToolbar = ({
           /* @__PURE__ */ jsx81(ArrowLeft, { className: "w-3 h-3" }),
           /* @__PURE__ */ jsx81(ArrowRight, { className: "w-3 h-3" })
         ] }),
-        contentClassName: "max-h-72 overflow-y-auto p-2",
+        contentClassName: "max-h-72 overflow-y-auto p-1",
         children: [
           /* @__PURE__ */ jsx81(
             DropdownMenuItem,
@@ -26790,7 +26682,7 @@ var EditorToolbar = ({
 // src/components/UEditor/menus.tsx
 import { useCallback as useCallback22, useEffect as useEffect34, useMemo as useMemo23, useRef as useRef32, useState as useState45 } from "react";
 import { useEditorState as useEditorState2 } from "@tiptap/react";
-import { createPortal as createPortal9 } from "react-dom";
+import { createPortal as createPortal8 } from "react-dom";
 import {
   AlignCenter as AlignCenter2,
   AlignLeft as AlignLeft2,
@@ -27255,7 +27147,7 @@ var CustomBubbleMenu = ({
     };
   }, [editor]);
   if (!isVisible) return null;
-  return createPortal9(
+  return createPortal8(
     /* @__PURE__ */ jsx82(
       "div",
       {
@@ -27311,7 +27203,7 @@ var CustomFloatingMenu = ({ editor }) => {
     };
   }, [editor]);
   if (!isVisible) return null;
-  return createPortal9(
+  return createPortal8(
     /* @__PURE__ */ jsx82(
       "div",
       {
@@ -31907,15 +31799,12 @@ var FALLBACK_TABLE_COLUMN_WIDTH = 160;
 var MENU_HOVER_PADDING = 18;
 var ROW_HANDLE_HOVER_WIDTH = 28;
 var COLUMN_HANDLE_HOVER_HEIGHT = 28;
-var ROW_HANDLE_GUTTER = 20;
 var TABLE_MENU_TOP_OFFSET = 10;
-var COLUMN_HANDLE_TOP_OFFSET = 8;
 var ADD_COLUMN_RAIL_GAP = 4;
 var ADD_ROW_RAIL_GAP = 4;
 var ADD_COLUMN_HOVER_WIDTH = 24;
 var ADD_ROW_HOVER_HEIGHT = 24;
 var HANDLE_HOVER_RADIUS = 14;
-var IDLE_HANDLE_OPACITY = "0.4";
 var IDLE_HANDLE_SCALE = "0.78";
 var DEFAULT_HOVER_STATE = {
   menuVisible: false,
@@ -32527,8 +32416,8 @@ function TableControls({ editor, containerRef }) {
   }
   const menuTop = Math.max(8, layout.tableTop - TABLE_MENU_TOP_OFFSET);
   const menuLeft = Math.max(8, layout.tableLeft);
-  const rowHandleLeft = Math.max(8, layout.tableLeft - ROW_HANDLE_GUTTER);
-  const columnHandleTop = Math.max(8, layout.tableTop - COLUMN_HANDLE_TOP_OFFSET);
+  const rowHandleLeft = layout.tableLeft - 12;
+  const columnHandleTop = layout.tableTop - 12;
   const visibleTableWidth = Math.min(layout.tableWidth, layout.viewportWidth);
   const visibleTableHeight = Math.min(layout.tableHeight, layout.viewportHeight);
   const columnRailTop = layout.tableTop;
@@ -32541,7 +32430,9 @@ function TableControls({ editor, containerRef }) {
   return /* @__PURE__ */ jsxs70(Fragment29, { children: [
     layout.rowHandles.map((rowHandle) => {
       const menuKey = getRowMenuKey(rowHandle.index);
+      const isActive = rowHandle.index === layout.activeRowIndex;
       const visible = controlsVisible || hoverState.rowHandleIndex === rowHandle.index || openMenuKey === menuKey;
+      const isShown = visible || isActive;
       return /* @__PURE__ */ jsx83(
         "div",
         {
@@ -32555,7 +32446,7 @@ function TableControls({ editor, containerRef }) {
             Tooltip,
             {
               placement: "right",
-              disabled: openMenuKey === menuKey,
+              disabled: openMenuKey === menuKey || !visible && isActive,
               content: /* @__PURE__ */ jsx83("span", { className: "text-xs font-medium", children: `${t("tableMenu.dragRow")} ${rowHandle.index + 1}` }),
               children: /* @__PURE__ */ jsx83("span", { className: "inline-flex", children: /* @__PURE__ */ jsx83(
                 DropdownMenu,
@@ -32592,16 +32483,15 @@ function TableControls({ editor, containerRef }) {
                         document.body.style.cursor = "grabbing";
                       },
                       className: cn(
-                        "inline-flex h-6 w-6 items-center justify-center rounded-full",
-                        "border border-border/70 bg-background/95 text-muted-foreground shadow-sm backdrop-blur",
-                        "cursor-grab active:cursor-grabbing",
-                        "transition-[opacity,transform,colors] duration-150 hover:bg-accent hover:text-foreground"
+                        "inline-flex h-6 w-6 items-center justify-center rounded-full transition-[opacity,transform,colors,border,background-color] duration-150",
+                        visible ? "border border-border/70 bg-background/95 text-muted-foreground shadow-sm backdrop-blur hover:bg-accent hover:text-foreground cursor-grab active:cursor-grabbing" : "border-transparent bg-transparent cursor-pointer"
                       ),
                       style: {
-                        opacity: visible ? 1 : Number(IDLE_HANDLE_OPACITY),
-                        transform: visible ? "scale(1)" : `scale(${IDLE_HANDLE_SCALE})`
+                        opacity: isShown ? 1 : 0,
+                        transform: isShown ? "scale(1)" : `scale(${IDLE_HANDLE_SCALE})`,
+                        pointerEvents: isShown ? "auto" : "none"
                       },
-                      children: /* @__PURE__ */ jsx83(GripVertical3, { className: "h-3.5 w-3.5" })
+                      children: visible ? /* @__PURE__ */ jsx83(GripVertical3, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ jsx83("div", { className: "h-3 w-1 rounded-full bg-muted-foreground/50 hover:bg-muted-foreground" })
                     }
                   )
                 }
@@ -32614,7 +32504,9 @@ function TableControls({ editor, containerRef }) {
     }),
     layout.columnHandles.map((columnHandle) => {
       const menuKey = getColumnMenuKey(columnHandle.index);
+      const isActive = columnHandle.index === layout.activeColumnIndex;
       const visible = controlsVisible || hoverState.columnHandleIndex === columnHandle.index || openMenuKey === menuKey;
+      const isShown = visible || isActive;
       return /* @__PURE__ */ jsx83(
         "div",
         {
@@ -32628,7 +32520,7 @@ function TableControls({ editor, containerRef }) {
             Tooltip,
             {
               placement: "top",
-              disabled: openMenuKey === menuKey,
+              disabled: openMenuKey === menuKey || !visible && isActive,
               content: /* @__PURE__ */ jsx83("span", { className: "text-xs font-medium", children: `${t("tableMenu.dragColumn")} ${columnHandle.index + 1}` }),
               children: /* @__PURE__ */ jsx83("span", { className: "inline-flex", children: /* @__PURE__ */ jsx83(
                 DropdownMenu,
@@ -32665,16 +32557,15 @@ function TableControls({ editor, containerRef }) {
                         document.body.style.cursor = "grabbing";
                       },
                       className: cn(
-                        "inline-flex h-6 w-6 items-center justify-center rounded-full",
-                        "border border-border/70 bg-background/95 text-muted-foreground shadow-sm backdrop-blur",
-                        "cursor-grab active:cursor-grabbing",
-                        "transition-[opacity,transform,colors] duration-150 hover:bg-accent hover:text-foreground"
+                        "inline-flex h-6 w-6 items-center justify-center rounded-full transition-[opacity,transform,colors,border,background-color] duration-150",
+                        visible ? "border border-border/70 bg-background/95 text-muted-foreground shadow-sm backdrop-blur hover:bg-accent hover:text-foreground cursor-grab active:cursor-grabbing" : "border-transparent bg-transparent cursor-pointer"
                       ),
                       style: {
-                        opacity: visible ? 1 : Number(IDLE_HANDLE_OPACITY),
-                        transform: visible ? "scale(1)" : `scale(${IDLE_HANDLE_SCALE})`
+                        opacity: isShown ? 1 : 0,
+                        transform: isShown ? "scale(1)" : `scale(${IDLE_HANDLE_SCALE})`,
+                        pointerEvents: isShown ? "auto" : "none"
                       },
-                      children: /* @__PURE__ */ jsx83(GripHorizontal, { className: "h-3.5 w-3.5" })
+                      children: visible ? /* @__PURE__ */ jsx83(GripHorizontal, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ jsx83("div", { className: "h-1 w-3 rounded-full bg-muted-foreground/50 hover:bg-muted-foreground" })
                     }
                   )
                 }
@@ -32722,8 +32613,9 @@ function TableControls({ editor, containerRef }) {
                       "transition-[opacity,transform,colors] duration-150 hover:bg-accent hover:text-foreground"
                     ),
                     style: {
-                      opacity: controlsVisible || hoverState.menuVisible || tableMenuOpen ? 1 : 0.5,
-                      transform: controlsVisible || hoverState.menuVisible || tableMenuOpen ? "scale(1)" : "scale(0.82)"
+                      opacity: controlsVisible || hoverState.menuVisible || tableMenuOpen ? 1 : 0,
+                      transform: controlsVisible || hoverState.menuVisible || tableMenuOpen ? "scale(1)" : "scale(0.82)",
+                      pointerEvents: controlsVisible || hoverState.menuVisible || tableMenuOpen ? "auto" : "none"
                     },
                     children: /* @__PURE__ */ jsx83(MoreHorizontal2, { className: "h-4 w-4" })
                   }
@@ -32765,8 +32657,9 @@ function TableControls({ editor, containerRef }) {
               left: columnRailLeft,
               width: controlsVisible || hoverState.addColumnVisible ? 18 : 12,
               height: controlsVisible || hoverState.addColumnVisible ? visibleTableHeight : 48,
-              opacity: controlsVisible || hoverState.addColumnVisible ? 1 : 0.45,
-              transform: controlsVisible || hoverState.addColumnVisible ? "scale(1)" : "scale(0.92)"
+              opacity: controlsVisible || hoverState.addColumnVisible ? 1 : 0,
+              transform: controlsVisible || hoverState.addColumnVisible ? "scale(1)" : "scale(0.92)",
+              pointerEvents: controlsVisible || hoverState.addColumnVisible ? "auto" : "none"
             },
             children: /* @__PURE__ */ jsx83("span", { className: "text-sm font-medium leading-none", children: "+" })
           }
@@ -32804,8 +32697,9 @@ function TableControls({ editor, containerRef }) {
               left: controlsVisible || hoverState.addRowVisible ? rowRailLeft : rowRailLeft + Math.max(0, visibleTableWidth / 2 - 24),
               width: controlsVisible || hoverState.addRowVisible ? visibleTableWidth : 48,
               height: controlsVisible || hoverState.addRowVisible ? 16 : 12,
-              opacity: controlsVisible || hoverState.addRowVisible ? 1 : 0.45,
-              transform: controlsVisible || hoverState.addRowVisible ? "scale(1)" : "scale(0.92)"
+              opacity: controlsVisible || hoverState.addRowVisible ? 1 : 0,
+              transform: controlsVisible || hoverState.addRowVisible ? "scale(1)" : "scale(0.92)",
+              pointerEvents: controlsVisible || hoverState.addRowVisible ? "auto" : "none"
             },
             children: /* @__PURE__ */ jsx83("span", { className: "text-sm font-medium leading-none", children: "+" })
           }