@lensui/lens-table 0.1.64 → 0.1.66

package/dist/index.cjs

@@ -29,8 +29,8 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/Table.tsx
-var import_react5 = require("react");
-var import_react_dom = require("react-dom");
+var import_react8 = require("react");
+var import_react_dom2 = require("react-dom");
 
 // src/components/EmptyState.tsx
 var import_react = require("react");
@@ -229,6 +229,7 @@ function DefaultEmptyState({ label = ZH_CN_GRID_LABELS.empty }) {
 // src/components/editors/ChoiceEditor.tsx
 var import_portal = require("@ark-ui/react/portal");
 var import_select = require("@ark-ui/react/select");
+var import_react2 = require("react");
 
 // src/icons/gridIcons.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
@@ -261,6 +262,13 @@ function ChoiceChevronIcon() {
 function ChoiceCheckIcon() {
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { className: "rvg-choice-check", viewBox: "0 0 16 16", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m3.5 8 2.6 2.6L12.5 4" }) });
 }
+function MultilineEditorIcon() {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { className: "rvg-multiline-icon", viewBox: "0 0 16 16", "aria-hidden": "true", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "3.5", cy: "8", r: "1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "8", cy: "8", r: "1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "12.5", cy: "8", r: "1" })
+  ] });
+}
 function HeaderDragIcon({ className, style }) {
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { className, style, viewBox: "0 0 14 14", "aria-hidden": "true", children: [
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "7", cy: "2.5", r: "1.25" }),
@@ -324,12 +332,126 @@ function LoadingSpinnerIcon() {
 
 // src/components/editors/ChoiceEditor.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
-function ChoiceEditor({ value, options, style, labels, onChange, onCommit, onCancel }) {
-  const collection = (0, import_select.createListCollection)({
-    items: options,
-    itemToValue: (item) => item.value,
-    itemToString: (item) => item.label
-  });
+function SearchableChoiceEditor({ value, options, allowCustomValue, maxDropdownHeight, style, labels, onChange, onCommit, onCancel }) {
+  const editorRef = (0, import_react2.useRef)(null);
+  const popupRef = (0, import_react2.useRef)(null);
+  const originalValueRef = (0, import_react2.useRef)(value);
+  const listboxId = (0, import_react2.useId)();
+  const originalValue = originalValueRef.current;
+  const [inputValue, setInputValue] = (0, import_react2.useState)(value);
+  const [activeIndex, setActiveIndex] = (0, import_react2.useState)(0);
+  const [popupStyle, setPopupStyle] = (0, import_react2.useState)({});
+  const filteredOptions = (0, import_react2.useMemo)(() => {
+    const query = inputValue.trim().toLocaleLowerCase();
+    if (!query || query === originalValue.toLocaleLowerCase()) return options;
+    return options.filter((option) => option.label.toLocaleLowerCase().includes(query) || option.value.toLocaleLowerCase().includes(query));
+  }, [inputValue, options, originalValue]);
+  (0, import_react2.useLayoutEffect)(() => {
+    const positionPopup = () => {
+      const rect = editorRef.current?.getBoundingClientRect();
+      if (!rect) return;
+      const availableBelow = window.innerHeight - rect.bottom - 8;
+      const availableAbove = rect.top - 8;
+      if (availableBelow < 120 && availableAbove > availableBelow) {
+        setPopupStyle({
+          position: "fixed",
+          bottom: window.innerHeight - rect.top + 4,
+          left: rect.left,
+          width: rect.width,
+          maxHeight: Math.min(maxDropdownHeight, availableAbove)
+        });
+        return;
+      }
+      setPopupStyle({
+        position: "fixed",
+        top: rect.bottom + 4,
+        left: rect.left,
+        width: rect.width,
+        maxHeight: Math.min(maxDropdownHeight, Math.max(80, availableBelow))
+      });
+    };
+    positionPopup();
+    window.addEventListener("resize", positionPopup);
+    window.addEventListener("scroll", positionPopup, true);
+    return () => {
+      window.removeEventListener("resize", positionPopup);
+      window.removeEventListener("scroll", positionPopup, true);
+    };
+  }, [maxDropdownHeight]);
+  (0, import_react2.useEffect)(() => {
+    const handleOutsidePointer = (event) => {
+      const target = event.target;
+      if (!(target instanceof Node)) return;
+      if (editorRef.current?.contains(target) || popupRef.current?.contains(target)) return;
+      onCommit(allowCustomValue ? inputValue || originalValue : originalValue);
+    };
+    document.addEventListener("pointerdown", handleOutsidePointer, true);
+    return () => document.removeEventListener("pointerdown", handleOutsidePointer, true);
+  }, [allowCustomValue, inputValue, onCommit, originalValue]);
+  const selectOption = (option) => {
+    onChange(option.value);
+    onCommit(option.value);
+  };
+  const handleKeyDown = (event) => {
+    event.stopPropagation();
+    if (event.key === "Escape") onCancel();
+    if (event.key === "ArrowDown") {
+      event.preventDefault();
+      setActiveIndex((index) => Math.min(filteredOptions.length - 1, index + 1));
+    }
+    if (event.key === "ArrowUp") {
+      event.preventDefault();
+      setActiveIndex((index) => Math.max(0, index - 1));
+    }
+    if (event.key === "Enter") {
+      event.preventDefault();
+      const option = filteredOptions[activeIndex];
+      if (option) selectOption(option);
+      else if (allowCustomValue) onCommit(inputValue || originalValue);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { ref: editorRef, className: "rvg-choice-editor rvg-searchable-choice-editor", style, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      "input",
+      {
+        className: inputValue === originalValue ? "is-pristine" : void 0,
+        value: inputValue,
+        autoFocus: true,
+        "aria-label": labels.search,
+        "aria-controls": listboxId,
+        onFocus: (event) => event.currentTarget.select(),
+        onChange: (event) => {
+          setInputValue(event.target.value);
+          onChange(event.target.value);
+          setActiveIndex(0);
+        },
+        onKeyDown: handleKeyDown
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "rvg-searchable-choice-indicator", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ChoiceChevronIcon, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_portal.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { ref: popupRef, id: listboxId, role: "listbox", className: "rvg-choice-content rvg-searchable-choice-content", style: popupStyle, children: filteredOptions.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "button",
+      {
+        type: "button",
+        role: "option",
+        "aria-selected": option.value === originalValue,
+        className: `rvg-choice-item${index === activeIndex ? " is-active" : ""}${option.value === originalValue ? " is-selected" : ""}`,
+        onPointerDown: (event) => event.preventDefault(),
+        onMouseEnter: () => setActiveIndex(index),
+        onClick: () => selectOption(option),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: option.label }),
+          option.value === originalValue && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ChoiceCheckIcon, {})
+        ]
+      },
+      option.value
+    )) }) })
+  ] });
+}
+function ChoiceEditor(props) {
+  const { value, options, searchable = false, maxDropdownHeight = 240, style, labels, onChange, onCommit, onCancel } = props;
+  if (searchable) return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SearchableChoiceEditor, { ...props, maxDropdownHeight });
+  const collection = (0, import_select.createListCollection)({ items: options, itemToValue: (item) => item.value, itemToString: (item) => item.label });
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
     import_select.Select.Root,
     {
@@ -360,7 +482,7 @@ function ChoiceEditor({ value, options, style, labels, onChange, onCommit, onCan
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.ValueText, { placeholder: labels.choose }),
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ChoiceChevronIcon, {}) })
         ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_portal.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.Content, { className: "rvg-choice-content", children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_select.Select.Item, { className: "rvg-choice-item", item: option, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_portal.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.Content, { className: "rvg-choice-content", style: { maxHeight: maxDropdownHeight, overflowY: "auto" }, children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_select.Select.Item, { className: "rvg-choice-item", item: option, children: [
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.ItemText, { children: option.label }),
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_select.Select.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ChoiceCheckIcon, {}) })
         ] }, option.value)) }) }) }),
@@ -371,7 +493,7 @@ function ChoiceEditor({ value, options, style, labels, onChange, onCommit, onCan
 }
 
 // src/components/editors/DateEditor.tsx
-var import_react3 = require("react");
+var import_react4 = require("react");
 var import_date_picker = require("@ark-ui/react/date-picker");
 var import_portal2 = require("@ark-ui/react/portal");
 var import_date2 = require("@internationalized/date");
@@ -418,22 +540,22 @@ function timeFormatHasSeconds(format, value) {
 }
 
 // src/components/editors/TimeEditors.tsx
-var import_react2 = require("react");
+var import_react3 = require("react");
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function CompactTimeEditor({ value, range, showSeconds, style, labels, onChange, onCommit, onCancel }) {
   const values = range ? value.split(" ~ ") : [value];
-  const [dropdownOpen, setDropdownOpen] = (0, import_react2.useState)(true);
-  const optionRefs = (0, import_react2.useRef)([[], []]);
-  const editorRef = (0, import_react2.useRef)(null);
-  const hasPositionedTimeRef = (0, import_react2.useRef)(false);
-  (0, import_react2.useEffect)(() => {
+  const [dropdownOpen, setDropdownOpen] = (0, import_react3.useState)(true);
+  const optionRefs = (0, import_react3.useRef)([[], []]);
+  const editorRef = (0, import_react3.useRef)(null);
+  const hasPositionedTimeRef = (0, import_react3.useRef)(false);
+  (0, import_react3.useEffect)(() => {
     const closeOnOutsidePointer = (event) => {
       if (!editorRef.current?.contains(event.target)) setDropdownOpen(false);
     };
     document.addEventListener("pointerdown", closeOnOutsidePointer, true);
     return () => document.removeEventListener("pointerdown", closeOnOutsidePointer, true);
   }, []);
-  (0, import_react2.useLayoutEffect)(() => {
+  (0, import_react3.useLayoutEffect)(() => {
     if (!dropdownOpen) return;
     const behavior = hasPositionedTimeRef.current ? "smooth" : "auto";
     values.forEach((time, index) => {
@@ -508,14 +630,14 @@ function CompactTimeEditor({ value, range, showSeconds, style, labels, onChange,
   ] });
 }
 function DateTimePanel({ values, labels, showSeconds, onChange }) {
-  const [activeIndex, setActiveIndex] = (0, import_react2.useState)(0);
+  const [activeIndex, setActiveIndex] = (0, import_react3.useState)(0);
   const activeValue = values[activeIndex] ?? "";
   const [, hour = "00", minute = "00", second = "00"] = activeValue.match(/[T ](\d{2}):(\d{2})(?::(\d{2}))?/) ?? [];
-  const hoursRef = (0, import_react2.useRef)(null);
-  const minutesRef = (0, import_react2.useRef)(null);
-  const secondsRef = (0, import_react2.useRef)(null);
-  const positionedRef = (0, import_react2.useRef)(false);
-  (0, import_react2.useLayoutEffect)(() => {
+  const hoursRef = (0, import_react3.useRef)(null);
+  const minutesRef = (0, import_react3.useRef)(null);
+  const secondsRef = (0, import_react3.useRef)(null);
+  const positionedRef = (0, import_react3.useRef)(false);
+  (0, import_react3.useLayoutEffect)(() => {
     const behavior = positionedRef.current ? "smooth" : "auto";
     hoursRef.current?.scrollTo({ top: Number(hour) * 28, behavior });
     minutesRef.current?.scrollTo({ top: Number(minute) * 28, behavior });
@@ -550,7 +672,7 @@ function DateTimePanel({ values, labels, showSeconds, onChange }) {
 // src/components/editors/DateEditor.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
 function DateEditor({ editor, value: draft, style, locale, labels, onChange, onCommit, onCancel }) {
-  const [rangeHoverValue, setRangeHoverValue] = (0, import_react3.useState)();
+  const [rangeHoverValue, setRangeHoverValue] = (0, import_react4.useState)();
   const editorType = editor.type;
   const isRange = editorType === "date-range" || editorType === "date-time-range";
   const isYear = editorType === "year";
@@ -693,11 +815,21 @@ function DateEditor({ editor, value: draft, style, locale, labels, onChange, onC
 }
 
 // src/components/editors/TextEditor.tsx
+var import_react5 = require("react");
 var import_jsx_runtime6 = require("react/jsx-runtime");
-function TextEditor({ value, type, style, labels, onChange, onCommit, onCancel }) {
+function TextEditor({ value, type, min, max, integer = false, style, labels, onChange, onCommit, onCancel }) {
+  const originalValueRef = (0, import_react5.useRef)(value);
+  const normalizeNumber = (draft) => {
+    if (draft.trim() === "") return "";
+    const parsed = Number(draft);
+    if (!Number.isFinite(parsed)) return originalValueRef.current;
+    const integral = integer ? Math.trunc(parsed) : parsed;
+    return String(Math.min(max ?? Infinity, Math.max(min ?? -Infinity, integral)));
+  };
+  const commitValue = () => onCommit(type === "number" ? normalizeNumber(value) : value);
   const handleKeyDown = (event) => {
     event.stopPropagation();
-    if (event.key === "Enter") onCommit();
+    if (event.key === "Enter") commitValue();
     if (event.key === "Escape") onCancel();
   };
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "rvg-native-editor has-clear", style, children: [
@@ -705,11 +837,19 @@ function TextEditor({ value, type, style, labels, onChange, onCommit, onCancel }
       "input",
       {
         type,
+        min: type === "number" ? min : void 0,
+        max: type === "number" ? max : void 0,
+        step: type === "number" && integer ? 1 : void 0,
+        inputMode: type === "number" ? "numeric" : void 0,
         style: { font: "var(--rvg-font-size-body) Inter, ui-sans-serif, system-ui, sans-serif", textAlign: style.textAlign },
         value,
         autoFocus: true,
-        onChange: (event) => onChange(event.target.value),
-        onBlur: () => onCommit(),
+        onChange: (event) => {
+          const next = event.target.value;
+          if (type === "number" && integer && next !== "" && !/^-?\d+$/.test(next)) return;
+          onChange(next);
+        },
+        onBlur: commitValue,
         onKeyDown: handleKeyDown
       }
     ),
@@ -733,6 +873,66 @@ function TextEditor({ value, type, style, labels, onChange, onCommit, onCancel }
   ] });
 }
 
+// src/components/editors/TextAreaEditor.tsx
+var import_react6 = require("react");
+var import_react_dom = require("react-dom");
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function TextAreaEditor({ value, title, maxLength, style, labels, onChange, onCommit, onCancel }) {
+  const [open, setOpen] = (0, import_react6.useState)(false);
+  const handleKeyDown = (event) => {
+    event.stopPropagation();
+    if (event.key === "Enter") onCommit(value);
+    if (event.key === "Escape") onCancel();
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-native-editor rvg-textarea-editor", style, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      "input",
+      {
+        value,
+        autoFocus: true,
+        maxLength,
+        onChange: (event) => onChange(event.target.value),
+        onKeyDown: handleKeyDown
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      "button",
+      {
+        type: "button",
+        className: "rvg-textarea-trigger",
+        "aria-label": title,
+        onPointerDown: (event) => {
+          event.preventDefault();
+          event.stopPropagation();
+        },
+        onClick: () => setOpen(true),
+        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MultilineEditorIcon, {})
+      }
+    ),
+    open && (0, import_react_dom.createPortal)(
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-textarea-backdrop", role: "presentation", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("section", { className: "rvg-textarea-dialog", role: "dialog", "aria-modal": "true", "aria-label": title, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("header", { children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          "textarea",
+          {
+            value,
+            autoFocus: true,
+            maxLength,
+            onChange: (event) => onChange(event.target.value),
+            onKeyDown: (event) => {
+              event.stopPropagation();
+              if ((event.metaKey || event.ctrlKey) && event.key === "Enter") onCommit(value);
+              if (event.key === "Escape") setOpen(false);
+            }
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("footer", { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", onClick: () => onCommit(value), children: labels.confirm }) })
+      ] }) }),
+      document.body
+    )
+  ] });
+}
+
 // src/icons/domIcons.ts
 function createRowDragHandleSvg() {
   const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
@@ -1028,7 +1228,7 @@ function paintGrid(options) {
           ctx.fillStyle = colors.insertedFill;
           ctx.fillRect(x, y, cellWidth, cellHeight);
         }
-        const isSelectedCell = !column.rowDragHandle && !column.rowSelection && !column.rowNumber && selection?.rowIndex === rowIndex && selection.columnIndex === columnIndex && selection.rowKey === rowKey && selection.columnKey === column.key;
+        const isSelectedCell = !column.rowDragHandle && !column.rowSelection && !column.rowNumber && column.suppressSelectionStyle !== true && selection?.rowIndex === rowIndex && selection.columnIndex === columnIndex && selection.rowKey === rowKey && selection.columnKey === column.key;
         const annotation = cellAnnotations.get(`${typeof rowKey}:${String(rowKey)}\0${column.key}`);
         const rawValue = column.dataIndex === void 0 ? void 0 : row[column.dataIndex];
         const cellStyle = column.cellStyle?.(rawValue, row, rowIndex);
@@ -1360,7 +1560,7 @@ function paintGrid(options) {
   }
   const selectedRow = selection ? rows[selection.rowIndex] : void 0;
   const hasValidSelection = Boolean(selection && selectedRow && getRowKey(selectedRow, selection.rowIndex) === selection.rowKey);
-  if (selection && hasValidSelection && !selectionRange && !rowDragPreview) {
+  if (selection && hasValidSelection && !selectionRange && !rowDragPreview && columns[selection.columnIndex]?.suppressSelectionStyle !== true) {
     const metric = metrics[selection.columnIndex];
     if (metric) {
       const fixedSide = columns[selection.columnIndex].fixed;
@@ -1432,20 +1632,20 @@ function paintGrid(options) {
 }
 
 // src/hooks/useControllable.ts
-var import_react4 = require("react");
+var import_react7 = require("react");
 function useControllableKeys(value, defaultValue, onChange) {
-  const [internal, setInternal] = (0, import_react4.useState)(defaultValue ?? []);
+  const [internal, setInternal] = (0, import_react7.useState)(defaultValue ?? []);
   const keys = value === void 0 ? internal : value;
-  const setKeys = (0, import_react4.useCallback)((next) => {
+  const setKeys = (0, import_react7.useCallback)((next) => {
     if (value === void 0) setInternal(next);
     onChange?.(next);
   }, [onChange, value]);
   return [keys, setKeys];
 }
 function useControllableValue(value, defaultValue, onChange) {
-  const [internal, setInternal] = (0, import_react4.useState)(defaultValue ?? null);
+  const [internal, setInternal] = (0, import_react7.useState)(defaultValue ?? null);
   const selected = value === void 0 ? internal : value;
-  const setSelected = (0, import_react4.useCallback)((next) => {
+  const setSelected = (0, import_react7.useCallback)((next) => {
     if (value === void 0) setInternal(next);
     onChange?.(next);
   }, [onChange, value]);
@@ -1453,7 +1653,7 @@ function useControllableValue(value, defaultValue, onChange) {
 }
 
 // src/Table.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 function resolveColumnDropIndex(sourceIndex, targetIndex, edge, columnCount) {
   const insertionIndex = targetIndex + (edge === "right" ? 1 : 0) - (sourceIndex < targetIndex ? 1 : 0);
   return Math.max(0, Math.min(columnCount - 1, insertionIndex));
@@ -1674,6 +1874,7 @@ function TableInner({
   onColumnsReorder,
   onColumnResize,
   rowDraggable = false,
+  utilityColumnOrder = ["drag", "selection", "rowNumber"],
   onRowsReorder,
   onInsertRows,
   onDeleteRows,
@@ -1690,21 +1891,21 @@ function TableInner({
   style,
   ariaLabel = "Data grid"
 }, ref) {
-  const [sourceColumns, setSourceColumns] = (0, import_react5.useState)(columnProps);
-  (0, import_react5.useEffect)(() => {
+  const [sourceColumns, setSourceColumns] = (0, import_react8.useState)(columnProps);
+  (0, import_react8.useEffect)(() => {
     setSourceColumns((current) => reconcileColumns(current, columnProps));
   }, [columnProps]);
   const rowHeight = layout?.rowHeight ?? rowHeightProp ?? 36;
   const headerActionSize = Math.max(8, layout?.headerActionSize ?? 14);
   const headerActionSlotWidth = headerActionSize + 2;
   const baseHeaderHeight = layout?.headerHeight ?? headerHeightProp ?? 40;
-  const headerDepth = (0, import_react5.useMemo)(() => Math.max(1, ...sourceColumns.map(getColumnDepth)), [sourceColumns]);
-  const { language, labels } = (0, import_react5.useMemo)(() => resolveGridLocale(locale), [locale]);
-  const customHeaderContentRefs = (0, import_react5.useRef)(/* @__PURE__ */ new Map());
-  const customHeaderMeasurementsRef = (0, import_react5.useRef)(/* @__PURE__ */ new Map());
-  const [measuredHeaderRowHeights, setMeasuredHeaderRowHeights] = (0, import_react5.useState)([]);
-  const headerRowHeights = (0, import_react5.useMemo)(() => Array.from({ length: headerDepth }, (_, level) => Math.max(baseHeaderHeight, measuredHeaderRowHeights[level] ?? 0)), [baseHeaderHeight, headerDepth, measuredHeaderRowHeights]);
-  const headerRowOffsets = (0, import_react5.useMemo)(() => {
+  const headerDepth = (0, import_react8.useMemo)(() => Math.max(1, ...sourceColumns.map(getColumnDepth)), [sourceColumns]);
+  const { language, labels } = (0, import_react8.useMemo)(() => resolveGridLocale(locale), [locale]);
+  const customHeaderContentRefs = (0, import_react8.useRef)(/* @__PURE__ */ new Map());
+  const customHeaderMeasurementsRef = (0, import_react8.useRef)(/* @__PURE__ */ new Map());
+  const [measuredHeaderRowHeights, setMeasuredHeaderRowHeights] = (0, import_react8.useState)([]);
+  const headerRowHeights = (0, import_react8.useMemo)(() => Array.from({ length: headerDepth }, (_, level) => Math.max(baseHeaderHeight, measuredHeaderRowHeights[level] ?? 0)), [baseHeaderHeight, headerDepth, measuredHeaderRowHeights]);
+  const headerRowOffsets = (0, import_react8.useMemo)(() => {
     const offsets = [];
     let top = 0;
     headerRowHeights.forEach((height2) => {
@@ -1735,37 +1936,37 @@ function TableInner({
   const summaryEmptyValue = typeof summary === "object" ? summary.emptyValue ?? "" : "";
   const contextMenuEnabled = contextMenuConfig !== false;
   const customContextMenuConfig = typeof contextMenuConfig === "object" ? contextMenuConfig : void 0;
-  const [resizedColumnWidths, setResizedColumnWidths] = (0, import_react5.useState)({});
-  const leafSourceColumns = (0, import_react5.useMemo)(() => flattenDataColumns(sourceColumns), [sourceColumns]);
-  const sourceColumnWidthsRef = (0, import_react5.useRef)(new Map(leafSourceColumns.map((column) => [column.key, column.width])));
+  const [resizedColumnWidths, setResizedColumnWidths] = (0, import_react8.useState)({});
+  const leafSourceColumns = (0, import_react8.useMemo)(() => flattenDataColumns(sourceColumns), [sourceColumns]);
+  const sourceColumnWidthsRef = (0, import_react8.useRef)(new Map(leafSourceColumns.map((column) => [column.key, column.width])));
   const showRowCheckbox = Boolean(rowSelection) && (typeof rowSelection !== "object" || rowSelection.showCheckbox !== false);
   const rowSelectionIndicator = typeof rowSelection === "object" ? rowSelection.indicator ?? "checkbox" : "checkbox";
   const rowSelectionColumnWidth = typeof rowSelection === "object" ? Math.max(24, rowSelection.columnWidth ?? 44) : 44;
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (!isProductionRuntime() && hasNestedFixedColumns(sourceColumns)) {
       console.warn("[Table] Multi-level headers only support fixed columns on top-level columns. Nested fixed values are ignored.");
     }
   }, [sourceColumns]);
-  const columns = (0, import_react5.useMemo)(() => {
+  const columns = (0, import_react8.useMemo)(() => {
     const utilityColumns = [];
-    if (rowDraggable) {
-      utilityColumns.push({ key: "__rvg_row_drag__", title: "", width: 36, align: "center", fixed: "left", rowDragHandle: true });
-    }
-    if (showRowCheckbox) {
-      utilityColumns.push({ key: "__rvg_row_selection__", title: "", width: rowSelectionColumnWidth, align: "center", fixed: "left", rowSelection: true, rowSelectionIndicator });
-    }
-    if (rowNumber) {
-      utilityColumns.push({ key: "__rvg_row_number__", title: "#", width: getRowNumberColumnWidth(sourceRows.length), align: "center", fixed: typeof rowNumber === "object" && rowNumber.fixed === false ? void 0 : "left", rowNumber: true });
-    }
+    utilityColumnOrder.forEach((utilityColumn) => {
+      if (utilityColumn === "drag" && rowDraggable) {
+        utilityColumns.push({ key: "__rvg_row_drag__", title: "", width: 36, align: "center", fixed: "left", rowDragHandle: true });
+      } else if (utilityColumn === "selection" && showRowCheckbox) {
+        utilityColumns.push({ key: "__rvg_row_selection__", title: "", width: rowSelectionColumnWidth, align: "center", fixed: "left", rowSelection: true, rowSelectionIndicator });
+      } else if (utilityColumn === "rowNumber" && rowNumber) {
+        utilityColumns.push({ key: "__rvg_row_number__", title: "#", width: getRowNumberColumnWidth(sourceRows.length), align: "center", fixed: typeof rowNumber === "object" && rowNumber.fixed === false ? void 0 : "left", rowNumber: true });
+      }
+    });
     const dataColumns = leafSourceColumns.map((column) => {
       const resizedWidth = resizedColumnWidths[column.key];
       return resizedWidth === void 0 ? column : { ...column, width: resizedWidth };
     });
     return [...utilityColumns, ...dataColumns];
-  }, [leafSourceColumns, resizedColumnWidths, rowDraggable, rowNumber, rowSelectionColumnWidth, rowSelectionIndicator, showRowCheckbox, sourceRows.length]);
+  }, [leafSourceColumns, resizedColumnWidths, rowDraggable, rowNumber, rowSelectionColumnWidth, rowSelectionIndicator, showRowCheckbox, sourceRows.length, utilityColumnOrder]);
   const utilityColumnCount = (rowDraggable ? 1 : 0) + (showRowCheckbox ? 1 : 0) + (rowNumber ? 1 : 0);
-  const headerCells = (0, import_react5.useMemo)(() => buildHeaderCells(sourceColumns, utilityColumnCount, headerDepth), [headerDepth, sourceColumns, utilityColumnCount]);
-  const activeCustomHeaderLevels = (0, import_react5.useMemo)(() => {
+  const headerCells = (0, import_react8.useMemo)(() => buildHeaderCells(sourceColumns, utilityColumnCount, headerDepth), [headerDepth, sourceColumns, utilityColumnCount]);
+  const activeCustomHeaderLevels = (0, import_react8.useMemo)(() => {
     const levels = /* @__PURE__ */ new Map();
     columns.forEach((column) => {
       if (column.renderHeader) levels.set(column.key, headerDepth - 1);
@@ -1775,52 +1976,52 @@ function TableInner({
     });
     return levels;
   }, [columns, headerCells, headerDepth]);
-  const canvasRef = (0, import_react5.useRef)(null);
-  const scrollerRef = (0, import_react5.useRef)(null);
-  const rootRef = (0, import_react5.useRef)(null);
-  const frameRef = (0, import_react5.useRef)(null);
-  const textFrameRef = (0, import_react5.useRef)(null);
-  const toastTimerRef = (0, import_react5.useRef)(null);
-  const headerTooltipTimerRef = (0, import_react5.useRef)(null);
-  const cellTooltipTimerRef = (0, import_react5.useRef)(null);
-  const pendingHeaderTooltipKeyRef = (0, import_react5.useRef)("");
-  const pendingCellTooltipKeyRef = (0, import_react5.useRef)("");
-  const clickedCellRef = (0, import_react5.useRef)(null);
-  const rowAnchorRef = (0, import_react5.useRef)(null);
-  const columnAnchorRef = (0, import_react5.useRef)(null);
-  const columnDragRef = (0, import_react5.useRef)(null);
-  const columnOrderDragRef = (0, import_react5.useRef)(null);
-  const columnOrderLongPressTimerRef = (0, import_react5.useRef)(null);
-  const dragGuideRef = (0, import_react5.useRef)(null);
-  const rowDragGuideRef = (0, import_react5.useRef)(null);
-  const selectionFocusRef = (0, import_react5.useRef)(null);
-  const selectionEdgeTargetRef = (0, import_react5.useRef)(null);
-  const verticalScrollbarRef = (0, import_react5.useRef)(null);
-  const verticalScrollbarThumbRef = (0, import_react5.useRef)(null);
-  const verticalScrollbarDragRef = (0, import_react5.useRef)(null);
-  const horizontalScrollbarRef = (0, import_react5.useRef)(null);
-  const horizontalScrollbarThumbRef = (0, import_react5.useRef)(null);
-  const horizontalScrollbarDragRef = (0, import_react5.useRef)(null);
-  const verticalScrollbarVisibilityTimerRef = (0, import_react5.useRef)(null);
-  const horizontalScrollbarVisibilityTimerRef = (0, import_react5.useRef)(null);
-  const rowByKeyRef = (0, import_react5.useRef)(/* @__PURE__ */ new Map());
-  const rowIndexByKeyRef = (0, import_react5.useRef)(/* @__PURE__ */ new Map());
-  const headerIconsRef = (0, import_react5.useRef)(null);
-  const scrollingHeaderIconsRef = (0, import_react5.useRef)(null);
-  const scrollingTextRef = (0, import_react5.useRef)(null);
-  const filterRef = (0, import_react5.useRef)(null);
-  const contextMenuRef = (0, import_react5.useRef)(null);
-  const suppressClickRef = (0, import_react5.useRef)(false);
-  const hasCompletedLoadRef = (0, import_react5.useRef)(!loading);
-  const validColumnDropRef = (0, import_react5.useRef)(null);
-  const hoveredHeaderActionRef = (0, import_react5.useRef)(null);
-  const hoveredRowIndexRef = (0, import_react5.useRef)(null);
-  const [viewport, setViewport] = (0, import_react5.useState)({ width: 0, height: typeof height === "number" ? height : FALLBACK_HEIGHT });
-  const [horizontalScrollbarHeight, setHorizontalScrollbarHeight] = (0, import_react5.useState)(0);
-  const [availableHeight, setAvailableHeight] = (0, import_react5.useState)(FALLBACK_HEIGHT);
+  const canvasRef = (0, import_react8.useRef)(null);
+  const scrollerRef = (0, import_react8.useRef)(null);
+  const rootRef = (0, import_react8.useRef)(null);
+  const frameRef = (0, import_react8.useRef)(null);
+  const textFrameRef = (0, import_react8.useRef)(null);
+  const toastTimerRef = (0, import_react8.useRef)(null);
+  const headerTooltipTimerRef = (0, import_react8.useRef)(null);
+  const cellTooltipTimerRef = (0, import_react8.useRef)(null);
+  const pendingHeaderTooltipKeyRef = (0, import_react8.useRef)("");
+  const pendingCellTooltipKeyRef = (0, import_react8.useRef)("");
+  const clickedCellRef = (0, import_react8.useRef)(null);
+  const rowAnchorRef = (0, import_react8.useRef)(null);
+  const columnAnchorRef = (0, import_react8.useRef)(null);
+  const columnDragRef = (0, import_react8.useRef)(null);
+  const columnOrderDragRef = (0, import_react8.useRef)(null);
+  const columnOrderLongPressTimerRef = (0, import_react8.useRef)(null);
+  const dragGuideRef = (0, import_react8.useRef)(null);
+  const rowDragGuideRef = (0, import_react8.useRef)(null);
+  const selectionFocusRef = (0, import_react8.useRef)(null);
+  const selectionEdgeTargetRef = (0, import_react8.useRef)(null);
+  const verticalScrollbarRef = (0, import_react8.useRef)(null);
+  const verticalScrollbarThumbRef = (0, import_react8.useRef)(null);
+  const verticalScrollbarDragRef = (0, import_react8.useRef)(null);
+  const horizontalScrollbarRef = (0, import_react8.useRef)(null);
+  const horizontalScrollbarThumbRef = (0, import_react8.useRef)(null);
+  const horizontalScrollbarDragRef = (0, import_react8.useRef)(null);
+  const verticalScrollbarVisibilityTimerRef = (0, import_react8.useRef)(null);
+  const horizontalScrollbarVisibilityTimerRef = (0, import_react8.useRef)(null);
+  const rowByKeyRef = (0, import_react8.useRef)(/* @__PURE__ */ new Map());
+  const rowIndexByKeyRef = (0, import_react8.useRef)(/* @__PURE__ */ new Map());
+  const headerIconsRef = (0, import_react8.useRef)(null);
+  const scrollingHeaderIconsRef = (0, import_react8.useRef)(null);
+  const scrollingTextRef = (0, import_react8.useRef)(null);
+  const filterRef = (0, import_react8.useRef)(null);
+  const contextMenuRef = (0, import_react8.useRef)(null);
+  const suppressClickRef = (0, import_react8.useRef)(false);
+  const hasCompletedLoadRef = (0, import_react8.useRef)(!loading);
+  const validColumnDropRef = (0, import_react8.useRef)(null);
+  const hoveredHeaderActionRef = (0, import_react8.useRef)(null);
+  const hoveredRowIndexRef = (0, import_react8.useRef)(null);
+  const [viewport, setViewport] = (0, import_react8.useState)({ width: 0, height: typeof height === "number" ? height : FALLBACK_HEIGHT });
+  const [horizontalScrollbarHeight, setHorizontalScrollbarHeight] = (0, import_react8.useState)(0);
+  const [availableHeight, setAvailableHeight] = (0, import_react8.useState)(FALLBACK_HEIGHT);
   const resolvedHeight = typeof height === "number" ? height : availableHeight;
-  const [scrollPosition, setScrollPosition] = (0, import_react5.useState)({ left: 0, top: 0 });
-  const scrollRef = (0, import_react5.useRef)({ left: 0, top: 0 });
+  const [scrollPosition, setScrollPosition] = (0, import_react8.useState)({ left: 0, top: 0 });
+  const scrollRef = (0, import_react8.useRef)({ left: 0, top: 0 });
   const [rowKeys, setRowKeys] = useControllableKeys(selectedRowKeys, defaultSelectedRowKeys, (keys) => {
     if (!onSelectedRowChange) return;
     const missing = new Set(keys.filter((key) => !rowByKeyRef.current.has(key)));
@@ -1842,20 +2043,20 @@ function TableInner({
     onSelectedRowChange(keys, entries.map(({ row }) => row), entries.map(({ index }) => index));
   });
   const [columnKeys, setColumnKeys] = useControllableKeys(selectedColumnKeys, defaultSelectedColumnKeys, onSelectedColumnChange);
-  const [editing, setEditing] = (0, import_react5.useState)(null);
-  const [draft, setDraft] = (0, import_react5.useState)("");
-  const [rowDragPreview, setRowDragPreview] = (0, import_react5.useState)(null);
-  const [columnDragPreview, setColumnDragPreview] = (0, import_react5.useState)(null);
-  const [columnDropTarget, setColumnDropTarget] = (0, import_react5.useState)(null);
-  (0, import_react5.useEffect)(() => {
+  const [editing, setEditing] = (0, import_react8.useState)(null);
+  const [draft, setDraft] = (0, import_react8.useState)("");
+  const [rowDragPreview, setRowDragPreview] = (0, import_react8.useState)(null);
+  const [columnDragPreview, setColumnDragPreview] = (0, import_react8.useState)(null);
+  const [columnDropTarget, setColumnDropTarget] = (0, import_react8.useState)(null);
+  (0, import_react8.useEffect)(() => {
     if (!loading) hasCompletedLoadRef.current = true;
   }, [loading]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (rangeSelection) return;
     rangeDragRef.current = null;
     setSelectionRange(null);
   }, [rangeSelection]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     const previousSourceWidths = sourceColumnWidthsRef.current;
     const nextSourceWidths = new Map(leafSourceColumns.map((column) => [column.key, column.width]));
     sourceColumnWidthsRef.current = nextSourceWidths;
@@ -1879,11 +2080,11 @@ function TableInner({
       return changed ? next : current;
     });
   }, [leafSourceColumns]);
-  (0, import_react5.useEffect)(() => () => {
+  (0, import_react8.useEffect)(() => () => {
     if (headerTooltipTimerRef.current !== null) clearTimeout(headerTooltipTimerRef.current);
     if (cellTooltipTimerRef.current !== null) clearTimeout(cellTooltipTimerRef.current);
   }, []);
-  const measureCustomHeaderHeight = (0, import_react5.useCallback)(() => {
+  const measureCustomHeaderHeight = (0, import_react8.useCallback)(() => {
     const nextHeights = Array.from({ length: headerDepth }, () => baseHeaderHeight);
     customHeaderContentRefs.current.forEach((node) => {
       const headerCell = node.closest(".rvg-header-title");
@@ -1901,7 +2102,7 @@ function TableInner({
       return changed ? nextHeights : current;
     });
   }, [activeCustomHeaderLevels, baseHeaderHeight, headerDepth]);
-  (0, import_react5.useLayoutEffect)(() => {
+  (0, import_react8.useLayoutEffect)(() => {
     customHeaderContentRefs.current.forEach((_, key) => {
       if (!activeCustomHeaderLevels.has(key)) customHeaderContentRefs.current.delete(key);
     });
@@ -1909,7 +2110,7 @@ function TableInner({
       if (!activeCustomHeaderLevels.has(key)) customHeaderMeasurementsRef.current.delete(key);
     });
     if (activeCustomHeaderLevels.size === 0) {
-      setMeasuredHeaderRowHeights([]);
+      setMeasuredHeaderRowHeights((current) => current.length === 0 ? current : []);
       return;
     }
     measureCustomHeaderHeight();
@@ -1918,23 +2119,23 @@ function TableInner({
     customHeaderContentRefs.current.forEach((node) => observer.observe(node));
     return () => observer.disconnect();
   }, [activeCustomHeaderLevels, measureCustomHeaderHeight, viewport.width]);
-  const [filterEditor, setFilterEditor] = (0, import_react5.useState)(null);
-  const [filterValues, setFilterValues] = (0, import_react5.useState)({});
-  const [sortState, setSortState] = (0, import_react5.useState)(null);
-  const [contextMenu, setContextMenu] = (0, import_react5.useState)(null);
-  const [insertCounts, setInsertCounts] = (0, import_react5.useState)({ before: 1, after: 1 });
-  const [confirmAction, setConfirmAction] = (0, import_react5.useState)(null);
-  const [confirmLoading, setConfirmLoading] = (0, import_react5.useState)(false);
-  const [insertBusy, setInsertBusy] = (0, import_react5.useState)(false);
-  const [deleteBusy, setDeleteBusy] = (0, import_react5.useState)(false);
-  const [toast, setToast] = (0, import_react5.useState)(null);
-  const [resizeGuideX, setResizeGuideX] = (0, import_react5.useState)(null);
-  const [resizeGuideTop, setResizeGuideTop] = (0, import_react5.useState)(0);
-  const [hoveredHeaderColumnIndex, setHoveredHeaderColumnIndex] = (0, import_react5.useState)(null);
-  const [hoveredHeaderAction, setHoveredHeaderAction] = (0, import_react5.useState)(null);
-  const [visibleHeaderTooltip, setVisibleHeaderTooltip] = (0, import_react5.useState)(null);
-  const [hoveredCellTooltip, setHoveredCellTooltip] = (0, import_react5.useState)(null);
-  const hideDragTooltips = (0, import_react5.useCallback)(() => {
+  const [filterEditor, setFilterEditor] = (0, import_react8.useState)(null);
+  const [filterValues, setFilterValues] = (0, import_react8.useState)({});
+  const [sortState, setSortState] = (0, import_react8.useState)(null);
+  const [contextMenu, setContextMenu] = (0, import_react8.useState)(null);
+  const [insertCounts, setInsertCounts] = (0, import_react8.useState)({ before: 1, after: 1 });
+  const [confirmAction, setConfirmAction] = (0, import_react8.useState)(null);
+  const [confirmLoading, setConfirmLoading] = (0, import_react8.useState)(false);
+  const [insertBusy, setInsertBusy] = (0, import_react8.useState)(false);
+  const [deleteBusy, setDeleteBusy] = (0, import_react8.useState)(false);
+  const [toast, setToast] = (0, import_react8.useState)(null);
+  const [resizeGuideX, setResizeGuideX] = (0, import_react8.useState)(null);
+  const [resizeGuideTop, setResizeGuideTop] = (0, import_react8.useState)(0);
+  const [hoveredHeaderColumnIndex, setHoveredHeaderColumnIndex] = (0, import_react8.useState)(null);
+  const [hoveredHeaderAction, setHoveredHeaderAction] = (0, import_react8.useState)(null);
+  const [visibleHeaderTooltip, setVisibleHeaderTooltip] = (0, import_react8.useState)(null);
+  const [hoveredCellTooltip, setHoveredCellTooltip] = (0, import_react8.useState)(null);
+  const hideDragTooltips = (0, import_react8.useCallback)(() => {
     if (headerTooltipTimerRef.current !== null) {
       clearTimeout(headerTooltipTimerRef.current);
       headerTooltipTimerRef.current = null;
@@ -1948,23 +2149,23 @@ function TableInner({
     setVisibleHeaderTooltip(null);
     setHoveredCellTooltip(null);
   }, []);
-  const [editedCellKeys, setEditedCellKeys] = (0, import_react5.useState)(() => /* @__PURE__ */ new Set());
-  const [cellAnnotations, setCellAnnotations] = (0, import_react5.useState)(() => /* @__PURE__ */ new Map());
-  const [annotationType, setAnnotationType] = (0, import_react5.useState)("corner");
-  const [annotationColor, setAnnotationColor] = (0, import_react5.useState)(ANNOTATION_COLORS[0]);
-  const [annotationContent, setAnnotationContent] = (0, import_react5.useState)("");
-  const [annotationOpen, setAnnotationOpen] = (0, import_react5.useState)(false);
-  const [annotationPlacement, setAnnotationPlacement] = (0, import_react5.useState)("right-down");
-  const originalCellValuesRef = (0, import_react5.useRef)(/* @__PURE__ */ new Map());
-  const [pendingDeletedRowKeys, setPendingDeletedRowKeys] = (0, import_react5.useState)(() => /* @__PURE__ */ new Set());
-  const [pendingInserts, setPendingInserts] = (0, import_react5.useState)(() => []);
-  const [insertedRowKeys, setInsertedRowKeys] = (0, import_react5.useState)(() => /* @__PURE__ */ new Set());
-  const [rowOrderKeys, setRowOrderKeys] = (0, import_react5.useState)(null);
-  const settledPendingInsertIdsRef = (0, import_react5.useRef)(/* @__PURE__ */ new Set());
-  const getDataRowKey = (0, import_react5.useCallback)((row, index) => {
+  const [editedCellKeys, setEditedCellKeys] = (0, import_react8.useState)(() => /* @__PURE__ */ new Set());
+  const [cellAnnotations, setCellAnnotations] = (0, import_react8.useState)(() => /* @__PURE__ */ new Map());
+  const [annotationType, setAnnotationType] = (0, import_react8.useState)("corner");
+  const [annotationColor, setAnnotationColor] = (0, import_react8.useState)(ANNOTATION_COLORS[0]);
+  const [annotationContent, setAnnotationContent] = (0, import_react8.useState)("");
+  const [annotationOpen, setAnnotationOpen] = (0, import_react8.useState)(false);
+  const [annotationPlacement, setAnnotationPlacement] = (0, import_react8.useState)("right-down");
+  const originalCellValuesRef = (0, import_react8.useRef)(/* @__PURE__ */ new Map());
+  const [pendingDeletedRowKeys, setPendingDeletedRowKeys] = (0, import_react8.useState)(() => /* @__PURE__ */ new Set());
+  const [pendingInserts, setPendingInserts] = (0, import_react8.useState)(() => []);
+  const [insertedRowKeys, setInsertedRowKeys] = (0, import_react8.useState)(() => /* @__PURE__ */ new Set());
+  const [rowOrderKeys, setRowOrderKeys] = (0, import_react8.useState)(null);
+  const settledPendingInsertIdsRef = (0, import_react8.useRef)(/* @__PURE__ */ new Set());
+  const getDataRowKey = (0, import_react8.useCallback)((row, index) => {
     return typeof rowKey === "function" ? rowKey(row, index) : rowKey ? row[rowKey] : getDefaultRowKey(row, index);
   }, [rowKey]);
-  const getSourceRowIndexByKey = (0, import_react5.useCallback)((key, preferredIndex) => {
+  const getSourceRowIndexByKey = (0, import_react8.useCallback)((key, preferredIndex) => {
     const preferredRow = sourceRows[preferredIndex];
     if (preferredRow && getDataRowKey(preferredRow, preferredIndex) === key) return preferredIndex;
     const start = Math.max(0, preferredIndex - 8);
@@ -1974,7 +2175,7 @@ function TableInner({
     }
     return sourceRows.findIndex((sourceRow, index) => getDataRowKey(sourceRow, index) === key);
   }, [getDataRowKey, sourceRows]);
-  const orderedRows = (0, import_react5.useMemo)(() => {
+  const orderedRows = (0, import_react8.useMemo)(() => {
     let next = sourceRows;
     if (pendingInserts.length > 0) {
       const activeInserts = pendingInserts.filter((insert) => {
@@ -2010,10 +2211,10 @@ function TableInner({
     });
     return ordered;
   }, [getDataRowKey, pendingDeletedRowKeys, pendingInserts, rowOrderKeys, sourceRows]);
-  const activeFilterValues = (0, import_react5.useMemo)(() => Object.fromEntries(
+  const activeFilterValues = (0, import_react8.useMemo)(() => Object.fromEntries(
     Object.entries(filterValues).filter(([, value]) => value.trim() !== "")
   ), [filterValues]);
-  const filteredRows = (0, import_react5.useMemo)(() => {
+  const filteredRows = (0, import_react8.useMemo)(() => {
     if (Object.keys(activeFilterValues).length === 0) return orderedRows;
     if (onFilterChange) return onFilterChange(orderedRows, activeFilterValues);
     return orderedRows.filter((row, rowIndex) => Object.entries(activeFilterValues).every(([columnKey, query]) => {
@@ -2022,7 +2223,7 @@ function TableInner({
       return getDisplayLabel(column, row, rowIndex).toLocaleLowerCase().includes(query.trim().toLocaleLowerCase());
     }));
   }, [activeFilterValues, columns, onFilterChange, orderedRows]);
-  const rows = (0, import_react5.useMemo)(() => {
+  const rows = (0, import_react8.useMemo)(() => {
     if (!sortState) return filteredRows;
     if (onSortChange) return onSortChange(filteredRows, sortState);
     const column = columns.find((candidate) => candidate.key === sortState.columnKey);
@@ -2035,7 +2236,7 @@ function TableInner({
       return result * direction;
     });
   }, [columns, filteredRows, language, onSortChange, sortState]);
-  const resolveSelectionTarget = (0, import_react5.useCallback)((target) => {
+  const resolveSelectionTarget = (0, import_react8.useCallback)((target) => {
     if (target == null) return target;
     const columnIndex = columns.findIndex((column) => column.key === target.columnKey);
     const rowIndex = target.rowKey !== void 0 ? rows.findIndex((row2, index) => getDataRowKey(row2, index) === target.rowKey) : target.rowIndex ?? -1;
@@ -2048,9 +2249,9 @@ function TableInner({
       columnKey: target.columnKey
     };
   }, [columns, getDataRowKey, rows]);
-  const resolvedSelectedCell = (0, import_react5.useMemo)(() => resolveSelectionTarget(selectedCell), [resolveSelectionTarget, selectedCell]);
-  const resolvedDefaultSelectedCell = (0, import_react5.useMemo)(() => resolveSelectionTarget(defaultSelectedCell), [defaultSelectedCell, resolveSelectionTarget]);
-  const handleSelectedCellChange = (0, import_react5.useCallback)((next) => {
+  const resolvedSelectedCell = (0, import_react8.useMemo)(() => resolveSelectionTarget(selectedCell), [resolveSelectionTarget, selectedCell]);
+  const resolvedDefaultSelectedCell = (0, import_react8.useMemo)(() => resolveSelectionTarget(defaultSelectedCell), [defaultSelectedCell, resolveSelectionTarget]);
+  const handleSelectedCellChange = (0, import_react8.useCallback)((next) => {
     if (!onSelectedCellChange) return;
     if (!next) {
       onSelectedCellChange(null);
@@ -2062,15 +2263,16 @@ function TableInner({
     onSelectedCellChange({ ...next, value });
   }, [columns, onSelectedCellChange, rows]);
   const [selection, setSelection] = useControllableValue(resolvedSelectedCell, resolvedDefaultSelectedCell, handleSelectedCellChange);
-  const [selectionRange, setSelectionRange] = (0, import_react5.useState)(null);
-  const rangeDragRef = (0, import_react5.useRef)(null);
-  (0, import_react5.useEffect)(() => {
+  const [selectionRange, setSelectionRange] = (0, import_react8.useState)(null);
+  const rangeDragRef = (0, import_react8.useRef)(null);
+  (0, import_react8.useEffect)(() => {
     if (!selection) return void 0;
     const handleOutsidePointerDown = (event) => {
       const target = event.target;
       if (!(target instanceof Node)) return;
       if (rootRef.current?.contains(target)) return;
       if (target instanceof Element && target.closest(".rvg-choice-content, .rvg-date-content, .rvg-time-dropdown")) return;
+      if (target instanceof Element && target.closest(".rvg-textarea-dialog")) return;
       clickedCellRef.current = null;
       setSelectionRange(null);
       setSelection(null);
@@ -2078,7 +2280,7 @@ function TableInner({
     document.addEventListener("pointerdown", handleOutsidePointerDown);
     return () => document.removeEventListener("pointerdown", handleOutsidePointerDown);
   }, [selection, setSelection]);
-  const applyRowOrder = (0, import_react5.useCallback)((sourceIndex, targetIndex) => {
+  const applyRowOrder = (0, import_react8.useCallback)((sourceIndex, targetIndex) => {
     if (sourceIndex === targetIndex || sourceIndex < 0 || targetIndex < 0 || sourceIndex >= rows.length || targetIndex >= rows.length) return;
     const nextEntries = rows.map((row, index) => ({ row, key: getDataRowKey(row, index) }));
     const [entry] = nextEntries.splice(sourceIndex, 1);
@@ -2087,12 +2289,12 @@ function TableInner({
     setRowOrderKeys(nextEntries.map(({ key }) => key));
     onRowsReorder?.(nextRows, { sourceIndex, targetIndex });
   }, [getDataRowKey, onRowsReorder, rows]);
-  const applyColumnOrder = (0, import_react5.useCallback)((sourceIndex, targetIndex, detail) => {
+  const applyColumnOrder = (0, import_react8.useCallback)((sourceIndex, targetIndex, detail) => {
     const nextColumns = reorderColumns(sourceColumns, detail);
     setSourceColumns(nextColumns);
     onColumnsReorder?.(nextColumns, { sourceIndex, targetIndex, ...detail });
   }, [onColumnsReorder, sourceColumns]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (insertBusy || settledPendingInsertIdsRef.current.size === 0) return;
     setPendingInserts((current) => {
       const next = current.filter((insert) => !settledPendingInsertIdsRef.current.has(insert.id));
@@ -2103,7 +2305,7 @@ function TableInner({
       return next;
     });
   }, [insertBusy, pendingInserts]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (pendingDeletedRowKeys.size === 0) return;
     setPendingDeletedRowKeys((current) => {
       if (current.size === 0) return current;
@@ -2117,20 +2319,20 @@ function TableInner({
       return changed ? next : current;
     });
   }, [getDataRowKey, pendingDeletedRowKeys.size, sourceRows]);
-  (0, import_react5.useLayoutEffect)(() => {
+  (0, import_react8.useLayoutEffect)(() => {
     if (!editing) return;
     if (selection?.rowKey === editing.rowKey && selection.columnKey === editing.columnKey) return;
     setEditing(null);
   }, [editing, selection]);
   const hasManualColumnWidths = Object.keys(resizedColumnWidths).length > 0;
-  const metrics = (0, import_react5.useMemo)(() => buildColumnMetrics(columns, {
+  const metrics = (0, import_react8.useMemo)(() => buildColumnMetrics(columns, {
     columnDraggable,
     viewportWidth: !stretchColumns || hasManualColumnWidths ? 0 : viewport.width
   }), [columnDraggable, columns, hasManualColumnWidths, stretchColumns, viewport.width]);
   const contentWidth = metrics.length > 0 ? metrics[metrics.length - 1].right : 0;
   const contentHeight = rows.length * rowHeight;
-  const fixedWidth = (0, import_react5.useMemo)(() => columns.reduce((width2, column, index) => column.fixed === "left" ? width2 + metrics[index].width : width2, 0), [columns, metrics]);
-  const leftFixedOffsets = (0, import_react5.useMemo)(() => {
+  const fixedWidth = (0, import_react8.useMemo)(() => columns.reduce((width2, column, index) => column.fixed === "left" ? width2 + metrics[index].width : width2, 0), [columns, metrics]);
+  const leftFixedOffsets = (0, import_react8.useMemo)(() => {
     const offsets = /* @__PURE__ */ new Map();
     let offset = 0;
     for (let index = 0; index < columns.length; index += 1) {
@@ -2140,8 +2342,8 @@ function TableInner({
     }
     return offsets;
   }, [columns, metrics]);
-  const rightFixedWidth = (0, import_react5.useMemo)(() => columns.reduce((width2, column, index) => column.fixed === "right" ? width2 + metrics[index].width : width2, 0), [columns, metrics]);
-  const rightFixedOffsets = (0, import_react5.useMemo)(() => {
+  const rightFixedWidth = (0, import_react8.useMemo)(() => columns.reduce((width2, column, index) => column.fixed === "right" ? width2 + metrics[index].width : width2, 0), [columns, metrics]);
+  const rightFixedOffsets = (0, import_react8.useMemo)(() => {
     const offsets = /* @__PURE__ */ new Map();
     let offset = 0;
     for (let index = columns.length - 1; index >= 0; index -= 1) {
@@ -2151,7 +2353,7 @@ function TableInner({
     }
     return offsets;
   }, [columns, metrics]);
-  const scrollableColumnLefts = (0, import_react5.useMemo)(() => {
+  const scrollableColumnLefts = (0, import_react8.useMemo)(() => {
     const lefts = [];
     let width2 = fixedWidth;
     for (let index = 0; index < columns.length; index += 1) {
@@ -2160,10 +2362,10 @@ function TableInner({
     }
     return lefts;
   }, [columns, fixedWidth, metrics]);
-  const getScrollableColumnLeft = (0, import_react5.useCallback)((columnIndex) => scrollableColumnLefts[columnIndex] ?? fixedWidth, [fixedWidth, scrollableColumnLefts]);
-  const hasRowSelectionColumn = (0, import_react5.useMemo)(() => columns.some((column) => column.rowSelection), [columns]);
+  const getScrollableColumnLeft = (0, import_react8.useCallback)((columnIndex) => scrollableColumnLefts[columnIndex] ?? fixedWidth, [fixedWidth, scrollableColumnLefts]);
+  const hasRowSelectionColumn = (0, import_react8.useMemo)(() => columns.some((column) => column.rowSelection), [columns]);
   const rowSelectionMode = typeof rowSelection === "object" ? rowSelection.mode ?? "multiple" : "multiple";
-  const summarySignature = (0, import_react5.useMemo)(() => getSummarySignature(columns), [columns]);
+  const summarySignature = (0, import_react8.useMemo)(() => getSummarySignature(columns), [columns]);
   const hasSummaryRow = rows.length > 0 && summaryEnabled && summarySignature.length > 0;
   const topSummaryHeight = hasSummaryRow && summaryPosition === "top" ? rowHeight : 0;
   const bottomSummaryHeight = hasSummaryRow && summaryPosition === "bottom" ? rowHeight : 0;
@@ -2173,10 +2375,10 @@ function TableInner({
   const effectiveHeight = autoHeight ? Math.max(bodyTop + bottomSummaryHeight, Math.min(resolvedHeight, realContentHeight)) : resolvedHeight;
   const renderHeight = Math.max(0, effectiveHeight - bottomSummaryHeight);
   const bodyViewportHeight = Math.max(0, renderHeight - (fixedHeader ? headerHeight + topSummaryHeight : 0));
-  const [summaryState, setSummaryState] = (0, import_react5.useState)(() => ({ signature: "", rows: null, values: /* @__PURE__ */ new Map(), pending: false }));
+  const [summaryState, setSummaryState] = (0, import_react8.useState)(() => ({ signature: "", rows: null, values: /* @__PURE__ */ new Map(), pending: false }));
   const summaryPending = hasSummaryRow && (loading || summaryState.pending || summaryState.signature !== summarySignature || summaryState.rows !== rows);
   const summaryValues = hasSummaryRow && summaryState.signature === summarySignature && summaryState.rows === rows ? summaryState.values : /* @__PURE__ */ new Map();
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     let cancelled = false;
     if (!hasSummaryRow) {
       setSummaryState((current) => current.signature === "" && current.rows === null && current.values.size === 0 && !current.pending ? current : { signature: "", rows: null, values: /* @__PURE__ */ new Map(), pending: false });
@@ -2207,19 +2409,19 @@ function TableInner({
       cancelled = true;
     };
   }, [hasSummaryRow, loading, rows, summarySignature]);
-  const domRange = (0, import_react5.useMemo)(() => {
+  const domRange = (0, import_react8.useMemo)(() => {
     if (!isVirtualized) return { rowStart: 0, rowEnd: rows.length, columnStart: 0, columnEnd: columns.length };
     const currentScroll2 = scrollRef.current;
     const rowScrollTop = fixedHeader ? currentScroll2.top : Math.max(0, currentScroll2.top - bodyTop);
     return getViewportRange(currentScroll2.left, rowScrollTop, viewport.width, bodyViewportHeight, rows.length, rowHeight, metrics, virtualOverscan);
   }, [bodyTop, bodyViewportHeight, columns.length, fixedHeader, isVirtualized, metrics, rowHeight, rows.length, scrollPosition, viewport.width, virtualOverscan]);
-  const getRowKey = (0, import_react5.useCallback)((row, index) => {
+  const getRowKey = (0, import_react8.useCallback)((row, index) => {
     const key = getDataRowKey(row, index);
     rowByKeyRef.current.set(key, row);
     rowIndexByKeyRef.current.set(key, index);
     return key;
   }, [getDataRowKey]);
-  const resolvedCellSpans = (0, import_react5.useMemo)(() => {
+  const resolvedCellSpans = (0, import_react8.useMemo)(() => {
     if (Array.isArray(cellSpans)) return cellSpans;
     const spans = [];
     rows.forEach((row, rowIndex) => {
@@ -2235,7 +2437,7 @@ function TableInner({
     });
     return spans;
   }, [cellSpans, columns, rows]);
-  const cellSpanLookup = (0, import_react5.useMemo)(() => {
+  const cellSpanLookup = (0, import_react8.useMemo)(() => {
     if (resolvedCellSpans.length === 0) return createEmptyCellSpanLookup();
     const rowIndexByKey = /* @__PURE__ */ new Map();
     rows.forEach((row, index) => rowIndexByKey.set(getRowKey(row, index), index));
@@ -2279,10 +2481,10 @@ function TableInner({
     }
     return lookup;
   }, [columns, getRowKey, resolvedCellSpans, rows]);
-  const selectedRowKeySet = (0, import_react5.useMemo)(() => new Set(rowKeys), [rowKeys]);
-  const selectedColumnKeySet = (0, import_react5.useMemo)(() => new Set(columnKeys), [columnKeys]);
-  const insertedRowKeySet = (0, import_react5.useMemo)(() => insertedRowKeys, [insertedRowKeys]);
-  const measureHeaderTitleWidth = (0, import_react5.useCallback)((columnIndex) => {
+  const selectedRowKeySet = (0, import_react8.useMemo)(() => new Set(rowKeys), [rowKeys]);
+  const selectedColumnKeySet = (0, import_react8.useMemo)(() => new Set(columnKeys), [columnKeys]);
+  const insertedRowKeySet = (0, import_react8.useMemo)(() => insertedRowKeys, [insertedRowKeys]);
+  const measureHeaderTitleWidth = (0, import_react8.useCallback)((columnIndex) => {
     const title = columns[columnIndex]?.title ?? "";
     const context = canvasRef.current?.getContext("2d");
     if (!context) return Array.from(title).reduce((width3, character) => width3 + (/^[\x00-\x7F]$/.test(character) ? 7 : 13), 0);
@@ -2292,7 +2494,7 @@ function TableInner({
     context.restore();
     return width2;
   }, [columns]);
-  const getCellLabel = (0, import_react5.useCallback)((rowIndex, columnIndex) => {
+  const getCellLabel = (0, import_react8.useCallback)((rowIndex, columnIndex) => {
     const row = rows[rowIndex];
     const column = columns[columnIndex];
     if (!row || !column || column.rowSelection || column.rowDragHandle) return "";
@@ -2303,15 +2505,15 @@ function TableInner({
       return "Render error";
     }
   }, [columns, rows]);
-  const getCellSpan = (0, import_react5.useCallback)((rowIndex, columnIndex) => cellSpanLookup.covered.get(getCellCoordKey2(rowIndex, columnIndex)), [cellSpanLookup]);
-  const getCellDisplayWidth = (0, import_react5.useCallback)((columnIndex, colSpan = 1) => {
+  const getCellSpan = (0, import_react8.useCallback)((rowIndex, columnIndex) => cellSpanLookup.covered.get(getCellCoordKey2(rowIndex, columnIndex)), [cellSpanLookup]);
+  const getCellDisplayWidth = (0, import_react8.useCallback)((columnIndex, colSpan = 1) => {
     let width2 = 0;
     for (let index = columnIndex; index < Math.min(columns.length, columnIndex + colSpan); index += 1) {
       width2 += metrics[index]?.width ?? 0;
     }
     return width2;
   }, [columns.length, metrics]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (!selection) return;
     const nextRowIndex = rows.findIndex((row, index) => getRowKey(row, index) === selection.rowKey);
     const nextColumnIndex = columns.findIndex((column) => column.key === selection.columnKey);
@@ -2319,7 +2521,7 @@ function TableInner({
     if (nextRowIndex === selection.rowIndex && nextColumnIndex === selection.columnIndex) return;
     setSelection({ ...selection, rowIndex: nextRowIndex, columnIndex: nextColumnIndex });
   }, [columns, getRowKey, rows, selection, setSelection]);
-  const draw = (0, import_react5.useCallback)(() => {
+  const draw = (0, import_react8.useCallback)(() => {
     frameRef.current = null;
     const canvas = canvasRef.current;
     if (!canvas || viewport.width <= 0) return;
@@ -2365,15 +2567,15 @@ function TableInner({
     const range = isVirtualized ? getViewportRange(scroll.left, rowScrollTop, viewport.width, bodyViewportHeight, rows.length, rowHeight, metrics, virtualOverscan) : { rowStart: 0, rowEnd: rows.length, columnStart: 0, columnEnd: columns.length };
     paintGrid({ context, width: viewport.width, height: renderHeight, pixelRatio: ratio, scrollLeft: scroll.left, scrollTop: scroll.top, rowHeight, bodyFontSize, headerActionSlotWidth, headerHeight, headerLeafTop, headerLeafHeight, bodyTop, suppressLastRowBottomBorder: bottomSummaryHeight > 0, suppressFrameBottomBorder: bottomSummaryHeight > 0, fixedHeader, verticalBorderless: !hasVerticalBorders, horizontalBorderless, frameBorderless, extendVerticalGridLines: !autoHeight, striped: hasStripedRows, columnDraggable, sortState, filterValues, hoveredHeaderAction: hoveredHeaderActionRef.current, rows, rowStyle, columns, metrics, range, selection, editing, hoveredRowIndex: hoveredRowIndexRef.current, selectionRange, selectedRowKeys: selectedRowKeySet, rowSelectionMode, selectedColumnKeys: selectedColumnKeySet, cellSpans: cellSpanLookup.covered, maxRowSpan: cellSpanLookup.maxRowSpan, highlightEditedCells: highlightsEditedCells, highlightInsertedRows: highlightsInsertedRows, insertedRowKeys: insertedRowKeySet, editedCellKeys, cellAnnotations, getRowKey, rowDragPreview, columnDropTarget, colors: themeColors });
   }, [autoHeight, bodyTop, bodyViewportHeight, bottomSummaryHeight, cellAnnotations, cellSpanLookup, columnDragPreview, columnDraggable, columnDropTarget, columns, editedCellHighlightColor, editedCellKeys, editing, renderHeight, filterValues, fixedHeader, frameBorderless, getRowKey, hasStripedRows, hasVerticalBorders, headerActionSlotWidth, headerDepth, headerHeight, headerLeafHeight, headerLeafTop, horizontalBorderless, highlightsEditedCells, highlightsInsertedRows, insertedRowHighlightColor, insertedRowKeySet, isVirtualized, metrics, rowDragPreview, rowHeight, rowSelectionMode, rowStyle, rows, selectedColumnKeySet, selectedRowKeySet, selection, selectionRange, sortState, stripedColor, viewport.width, virtualOverscan]);
-  const scheduleDraw = (0, import_react5.useCallback)(() => {
+  const scheduleDraw = (0, import_react8.useCallback)(() => {
     if (frameRef.current === null) frameRef.current = requestAnimationFrame(draw);
   }, [draw]);
-  const drawImmediately = (0, import_react5.useCallback)(() => {
+  const drawImmediately = (0, import_react8.useCallback)(() => {
     if (frameRef.current !== null) cancelAnimationFrame(frameRef.current);
     frameRef.current = null;
     draw();
   }, [draw]);
-  const getSelectionHorizontalVisibility = (0, import_react5.useCallback)((scrollLeft) => {
+  const getSelectionHorizontalVisibility = (0, import_react8.useCallback)((scrollLeft) => {
     if (!selection || selectionRange) return "visible";
     const column = columns[selection.columnIndex];
     if (!column || column.fixed !== void 0) return "visible";
@@ -2384,7 +2586,7 @@ function TableInner({
     if (left >= viewport.width - rightFixedWidth) return "hidden-right";
     return "visible";
   }, [columns, fixedWidth, getCellDisplayWidth, getCellSpan, getScrollableColumnLeft, rightFixedWidth, selection, selectionRange, viewport.width]);
-  const getSelectionEdgeIndicator = (0, import_react5.useCallback)((scrollLeft, scrollTop) => {
+  const getSelectionEdgeIndicator = (0, import_react8.useCallback)((scrollLeft, scrollTop) => {
     if (!selection || selectionRange) return null;
     const row = rows[selection.rowIndex];
     const metric = metrics[selection.columnIndex];
@@ -2489,7 +2691,7 @@ function TableInner({
       }
     };
   }, [bodyTop, columns, fixedHeader, fixedWidth, getCellDisplayWidth, getCellSpan, getRowKey, getScrollableColumnLeft, hasVerticalBorders, leftFixedOffsets, metrics, renderHeight, rightFixedOffsets, rightFixedWidth, rowHeight, rows, selection, selectionRange, viewport.width]);
-  const syncSelectionEdgeTarget = (0, import_react5.useCallback)((scrollLeft, scrollTop) => {
+  const syncSelectionEdgeTarget = (0, import_react8.useCallback)((scrollLeft, scrollTop) => {
     const target = selectionEdgeTargetRef.current;
     if (!target) return;
     const indicator = getSelectionEdgeIndicator(scrollLeft, scrollTop);
@@ -2520,7 +2722,7 @@ function TableInner({
       target.classList.remove("is-shape-syncing");
     }
   }, [getSelectionEdgeIndicator]);
-  (0, import_react5.useLayoutEffect)(() => {
+  (0, import_react8.useLayoutEffect)(() => {
     const element = scrollerRef.current;
     if (!element) return;
     const root = element.parentElement;
@@ -2546,7 +2748,7 @@ function TableInner({
     if (root?.parentElement) observer.observe(root.parentElement);
     return () => observer.disconnect();
   }, [height]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     scheduleDraw();
     return () => {
       if (frameRef.current !== null) {
@@ -2555,13 +2757,13 @@ function TableInner({
       }
     };
   }, [scheduleDraw]);
-  (0, import_react5.useEffect)(() => () => {
+  (0, import_react8.useEffect)(() => () => {
     if (textFrameRef.current !== null) cancelAnimationFrame(textFrameRef.current);
     if (toastTimerRef.current !== null) clearTimeout(toastTimerRef.current);
     if (verticalScrollbarVisibilityTimerRef.current !== null) clearTimeout(verticalScrollbarVisibilityTimerRef.current);
     if (horizontalScrollbarVisibilityTimerRef.current !== null) clearTimeout(horizontalScrollbarVisibilityTimerRef.current);
   }, []);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     const scroller = scrollerRef.current;
     if (!scroller) return;
     const containHorizontalOverscroll = (event) => {
@@ -2573,7 +2775,7 @@ function TableInner({
     scroller.addEventListener("wheel", containHorizontalOverscroll, { passive: false });
     return () => scroller.removeEventListener("wheel", containHorizontalOverscroll);
   }, []);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (!filterEditor) return;
     const closeOnOutsidePointer = (event) => {
       if (!filterRef.current?.contains(event.target)) setFilterEditor(null);
@@ -2581,7 +2783,7 @@ function TableInner({
     document.addEventListener("pointerdown", closeOnOutsidePointer);
     return () => document.removeEventListener("pointerdown", closeOnOutsidePointer);
   }, [filterEditor]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (!contextMenu) return;
     const close = (event) => {
       if (!contextMenuRef.current?.contains(event.target)) setContextMenu(null);
@@ -2596,10 +2798,10 @@ function TableInner({
       document.removeEventListener("keydown", closeOnEscape);
     };
   }, [contextMenu]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (!confirmAction) setConfirmLoading(false);
   }, [confirmAction]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     const scroller = scrollerRef.current;
     if (!scroller || !insertBusy) return;
     const left = scroller.scrollLeft;
@@ -2611,7 +2813,7 @@ function TableInner({
     scroller.addEventListener("scroll", lockScroll);
     return () => scroller.removeEventListener("scroll", lockScroll);
   }, [insertBusy]);
-  const showCustomScrollbar = (0, import_react5.useCallback)((axis, persist = false) => {
+  const showCustomScrollbar = (0, import_react8.useCallback)((axis, persist = false) => {
     const showVertical = axis === "vertical" || axis === "both";
     const showHorizontal = axis === "horizontal" || axis === "both";
     if (showVertical) {
@@ -2635,15 +2837,15 @@ function TableInner({
       }
     }
   }, []);
-  const keepCustomScrollbarVisible = (0, import_react5.useCallback)((axis) => {
+  const keepCustomScrollbarVisible = (0, import_react8.useCallback)((axis) => {
     showCustomScrollbar(axis, true);
   }, [showCustomScrollbar]);
-  const releaseCustomScrollbarVisible = (0, import_react5.useCallback)((axis) => {
+  const releaseCustomScrollbarVisible = (0, import_react8.useCallback)((axis) => {
     if (axis === "vertical" && verticalScrollbarDragRef.current) return;
     if (axis === "horizontal" && horizontalScrollbarDragRef.current) return;
     showCustomScrollbar(axis);
   }, [showCustomScrollbar]);
-  const updateCustomScrollbars = (0, import_react5.useCallback)(() => {
+  const updateCustomScrollbars = (0, import_react8.useCallback)(() => {
     const scroller = scrollerRef.current;
     const verticalTrack = verticalScrollbarRef.current;
     const verticalThumb = verticalScrollbarThumbRef.current;
@@ -2693,10 +2895,10 @@ function TableInner({
     horizontalThumb.style.width = `${Math.min(trackWidth, thumbWidth)}px`;
     horizontalThumb.style.transform = `translateX(${thumbLeft}px)`;
   }, [autoHeight, bodyTop, bottomSummaryHeight, effectiveHeight, fixedHeader, fixedWidth, realContentHeight, renderHeight, rightFixedWidth, viewport.width]);
-  (0, import_react5.useLayoutEffect)(() => {
+  (0, import_react8.useLayoutEffect)(() => {
     updateCustomScrollbars();
   }, [contentHeight, contentWidth, updateCustomScrollbars, viewport.height, viewport.width]);
-  const handleVerticalScrollbarPointerDown = (0, import_react5.useCallback)((event) => {
+  const handleVerticalScrollbarPointerDown = (0, import_react8.useCallback)((event) => {
     const scroller = scrollerRef.current;
     const track = verticalScrollbarRef.current;
     const thumb = verticalScrollbarThumbRef.current;
@@ -2733,7 +2935,7 @@ function TableInner({
       maxScrollTop
     };
   }, [showCustomScrollbar, updateCustomScrollbars]);
-  const handleVerticalScrollbarPointerMove = (0, import_react5.useCallback)((event) => {
+  const handleVerticalScrollbarPointerMove = (0, import_react8.useCallback)((event) => {
     const drag = verticalScrollbarDragRef.current;
     const scroller = scrollerRef.current;
     if (!drag || !scroller || drag.pointerId !== event.pointerId) return;
@@ -2743,14 +2945,14 @@ function TableInner({
     scroller.scrollTop = nextThumbTop / maxThumbTop * drag.maxScrollTop;
     updateCustomScrollbars();
   }, [updateCustomScrollbars]);
-  const handleVerticalScrollbarPointerUp = (0, import_react5.useCallback)((event) => {
+  const handleVerticalScrollbarPointerUp = (0, import_react8.useCallback)((event) => {
     const drag = verticalScrollbarDragRef.current;
     if (!drag || drag.pointerId !== event.pointerId) return;
     if (event.currentTarget.hasPointerCapture(event.pointerId)) event.currentTarget.releasePointerCapture(event.pointerId);
     verticalScrollbarDragRef.current = null;
     showCustomScrollbar("vertical");
   }, [showCustomScrollbar]);
-  const handleHorizontalScrollbarPointerDown = (0, import_react5.useCallback)((event) => {
+  const handleHorizontalScrollbarPointerDown = (0, import_react8.useCallback)((event) => {
     const scroller = scrollerRef.current;
     const track = horizontalScrollbarRef.current;
     const thumb = horizontalScrollbarThumbRef.current;
@@ -2793,7 +2995,7 @@ function TableInner({
       maxScrollLeft
     };
   }, [drawImmediately, getSelectionHorizontalVisibility, showCustomScrollbar, syncSelectionEdgeTarget, updateCustomScrollbars]);
-  const handleHorizontalScrollbarPointerMove = (0, import_react5.useCallback)((event) => {
+  const handleHorizontalScrollbarPointerMove = (0, import_react8.useCallback)((event) => {
     const drag = horizontalScrollbarDragRef.current;
     const scroller = scrollerRef.current;
     if (!drag || !scroller || drag.pointerId !== event.pointerId) return;
@@ -2809,14 +3011,14 @@ function TableInner({
     if (visibilityChanged) drawImmediately();
     updateCustomScrollbars();
   }, [drawImmediately, getSelectionHorizontalVisibility, syncSelectionEdgeTarget, updateCustomScrollbars]);
-  const handleHorizontalScrollbarPointerUp = (0, import_react5.useCallback)((event) => {
+  const handleHorizontalScrollbarPointerUp = (0, import_react8.useCallback)((event) => {
     const drag = horizontalScrollbarDragRef.current;
     if (!drag || drag.pointerId !== event.pointerId) return;
     if (event.currentTarget.hasPointerCapture(event.pointerId)) event.currentTarget.releasePointerCapture(event.pointerId);
     horizontalScrollbarDragRef.current = null;
     showCustomScrollbar("horizontal");
   }, [showCustomScrollbar]);
-  const handleScroll = (0, import_react5.useCallback)(() => {
+  const handleScroll = (0, import_react8.useCallback)(() => {
     const element = scrollerRef.current;
     if (!element) return;
     const previousScroll = scrollRef.current;
@@ -2878,7 +3080,7 @@ function TableInner({
     scheduleDraw();
     setEditing(null);
   }, [bodyTop, columns, renderHeight, fixedHeader, fixedWidth, getCellDisplayWidth, getCellSpan, getRowKey, getScrollableColumnLeft, metrics, rightFixedOffsets, rightFixedWidth, rowHeight, rows, scheduleDraw, selection, selectionRange, showCustomScrollbar, syncSelectionEdgeTarget, updateCustomScrollbars, viewport.width]);
-  const locateColumn = (0, import_react5.useCallback)((clientX) => {
+  const locateColumn = (0, import_react8.useCallback)((clientX) => {
     const canvas = canvasRef.current;
     if (!canvas) return -1;
     const rect = canvas.getBoundingClientRect();
@@ -2906,17 +3108,17 @@ function TableInner({
     }
     return columnIndex;
   }, [columns, fixedWidth, getScrollableColumnLeft, leftFixedOffsets, metrics, rightFixedOffsets, rightFixedWidth, viewport.width]);
-  const getDisplayedColumnLeft = (0, import_react5.useCallback)((columnIndex) => {
+  const getDisplayedColumnLeft = (0, import_react8.useCallback)((columnIndex) => {
     const metric = metrics[columnIndex];
     if (columns[columnIndex].fixed === "left") return leftFixedOffsets.get(columnIndex) ?? 0;
     if (columns[columnIndex].fixed === "right") return viewport.width - (rightFixedOffsets.get(columnIndex) ?? 0) - metric.width;
     return getScrollableColumnLeft(columnIndex) - scrollRef.current.left;
   }, [columns, getScrollableColumnLeft, leftFixedOffsets, metrics, rightFixedOffsets, viewport.width]);
-  const trailingColumnBorderLeft = (0, import_react5.useMemo)(() => {
+  const trailingColumnBorderLeft = (0, import_react8.useMemo)(() => {
     const displayedContentRight = columns.reduce((right, _column, columnIndex) => Math.max(right, getDisplayedColumnLeft(columnIndex) + metrics[columnIndex].width), 0);
     return displayedContentRight > 0 && displayedContentRight < viewport.width ? Math.round(displayedContentRight) - 1 : null;
   }, [columns, getDisplayedColumnLeft, metrics, scrollPosition.left, viewport.width]);
-  const getHeaderLevelAtY = (0, import_react5.useCallback)((localY, headerY) => {
+  const getHeaderLevelAtY = (0, import_react8.useCallback)((localY, headerY) => {
     const y = localY - headerY;
     for (let level = 0; level < headerRowHeights.length; level += 1) {
       const top = headerRowOffsets[level] ?? 0;
@@ -2924,11 +3126,11 @@ function TableInner({
     }
     return headerDepth - 1;
   }, [headerDepth, headerRowHeights, headerRowOffsets]);
-  const resizeColumn = (0, import_react5.useCallback)((columnKey, width2) => {
+  const resizeColumn = (0, import_react8.useCallback)((columnKey, width2) => {
     setResizedColumnWidths((current) => current[columnKey] === width2 ? current : { ...current, [columnKey]: width2 });
     onColumnResize?.(columnKey, width2);
   }, [onColumnResize]);
-  const locateHeaderAction = (0, import_react5.useCallback)((clientX, clientY, columnIndex) => {
+  const locateHeaderAction = (0, import_react8.useCallback)((clientX, clientY, columnIndex) => {
     if (columnIndex < 0 || !canvasRef.current) return null;
     const column = columns[columnIndex];
     if (column.rowSelection || column.rowDragHandle || column.rowNumber) return null;
@@ -2948,7 +3150,7 @@ function TableInner({
     if (visibleActions.filter && localX >= right - headerActionSlotWidth && localX < right) return "filter";
     return null;
   }, [columnDraggable, columns, fixedHeader, getDisplayedColumnLeft, headerActionSize, headerActionSlotWidth, headerLeafHeight, headerLeafTop, measureHeaderTitleWidth, metrics]);
-  const isHeaderTitleTruncated = (0, import_react5.useCallback)((columnIndex) => {
+  const isHeaderTitleTruncated = (0, import_react8.useCallback)((columnIndex) => {
     const canvas = canvasRef.current;
     if (columnIndex < 0 || !canvas) return false;
     const column = columns[columnIndex];
@@ -2958,7 +3160,7 @@ function TableInner({
     const actionWidth = (Number(visibleActions.drag) + Number(visibleActions.filter) + Number(visibleActions.sort)) * headerActionSlotWidth;
     return getHeaderTitleRequiredWidth(column, titleWidth) > Math.max(0, metric.width - actionWidth);
   }, [columnDraggable, columns, headerActionSlotWidth, measureHeaderTitleWidth, metrics]);
-  const locateHeaderDragHandle = (0, import_react5.useCallback)((clientX, clientY, columnIndex) => {
+  const locateHeaderDragHandle = (0, import_react8.useCallback)((clientX, clientY, columnIndex) => {
     if (!columnDraggable || columnIndex < 0 || !canvasRef.current) return false;
     const column = columns[columnIndex];
     if (column.rowSelection || column.rowDragHandle || column.rowNumber) return false;
@@ -2972,14 +3174,14 @@ function TableInner({
     const columnRight = getDisplayedColumnLeft(columnIndex) + metrics[columnIndex].width;
     return localX >= columnRight - headerActionSlotWidth && localX < columnRight - 2;
   }, [columnDraggable, columns, fixedHeader, getDisplayedColumnLeft, headerActionSize, headerActionSlotWidth, headerLeafHeight, headerLeafTop, measureHeaderTitleWidth, metrics]);
-  const getHeaderCellLeft = (0, import_react5.useCallback)((cell) => {
+  const getHeaderCellLeft = (0, import_react8.useCallback)((cell) => {
     const startMetric = metrics[cell.startIndex];
     const fixedSide = columns[cell.startIndex]?.fixed;
     if (!startMetric) return 0;
     return fixedSide === "left" ? leftFixedOffsets.get(cell.startIndex) ?? 0 : fixedSide === "right" ? viewport.width - (rightFixedOffsets.get(cell.startIndex) ?? 0) - startMetric.width : getScrollableColumnLeft(cell.startIndex) - scrollRef.current.left;
   }, [columns, getScrollableColumnLeft, leftFixedOffsets, metrics, rightFixedOffsets, viewport.width]);
-  const getHeaderCellWidth = (0, import_react5.useCallback)((cell) => cell.leaf ? metrics[cell.startIndex]?.width ?? 0 : getCellDisplayWidth(cell.startIndex, cell.endIndex - cell.startIndex + 1), [getCellDisplayWidth, metrics]);
-  const getHeaderCellEdgeFromMetrics = (0, import_react5.useCallback)((startIndex, endIndex, edge, nextMetrics) => {
+  const getHeaderCellWidth = (0, import_react8.useCallback)((cell) => cell.leaf ? metrics[cell.startIndex]?.width ?? 0 : getCellDisplayWidth(cell.startIndex, cell.endIndex - cell.startIndex + 1), [getCellDisplayWidth, metrics]);
+  const getHeaderCellEdgeFromMetrics = (0, import_react8.useCallback)((startIndex, endIndex, edge, nextMetrics) => {
     const fixedSide = columns[startIndex]?.fixed;
     const width2 = nextMetrics.slice(startIndex, endIndex + 1).reduce((total, metric) => total + metric.width, 0);
     let left;
@@ -3003,7 +3205,7 @@ function TableInner({
     }
     return left + (edge === "right" ? width2 : 0);
   }, [columns, fixedWidth, viewport.width]);
-  const locateHeaderResizeHit = (0, import_react5.useCallback)((clientX, clientY) => {
+  const locateHeaderResizeHit = (0, import_react8.useCallback)((clientX, clientY) => {
     if (!columnResizable || !canvasRef.current) return null;
     const rect = canvasRef.current.getBoundingClientRect();
     const localX = clientX - rect.left;
@@ -3030,15 +3232,15 @@ function TableInner({
     }
     return closest;
   }, [columnResizable, columns, fixedHeader, getHeaderCellLeft, getHeaderCellWidth, getHeaderLevelAtY, headerCells, headerHeight]);
-  const locateHeaderResizeCell = (0, import_react5.useCallback)((clientX, clientY) => locateHeaderResizeHit(clientX, clientY)?.cell ?? null, [locateHeaderResizeHit]);
-  const locateHeaderCellDragHandle = (0, import_react5.useCallback)((clientX, clientY, cell) => {
+  const locateHeaderResizeCell = (0, import_react8.useCallback)((clientX, clientY) => locateHeaderResizeHit(clientX, clientY)?.cell ?? null, [locateHeaderResizeHit]);
+  const locateHeaderCellDragHandle = (0, import_react8.useCallback)((clientX, clientY, cell) => {
     if (!columnDraggable || !canvasRef.current) return false;
     if (cell.leaf) return locateHeaderDragHandle(clientX, clientY, cell.startIndex);
     const localX = clientX - canvasRef.current.getBoundingClientRect().left;
     const right = getHeaderCellLeft(cell) + getHeaderCellWidth(cell);
     return localX >= right - headerActionSlotWidth && localX < right - 2;
   }, [columnDraggable, getHeaderCellLeft, getHeaderCellWidth, headerActionSlotWidth, locateHeaderDragHandle]);
-  const locateHeaderCell = (0, import_react5.useCallback)((clientX, clientY) => {
+  const locateHeaderCell = (0, import_react8.useCallback)((clientX, clientY) => {
     const canvas = canvasRef.current;
     if (!canvas) return null;
     const rect = canvas.getBoundingClientRect();
@@ -3055,7 +3257,7 @@ function TableInner({
     }
     return null;
   }, [fixedHeader, getHeaderCellLeft, getHeaderCellWidth, getHeaderLevelAtY, headerCells, headerHeight]);
-  const setDragGuide = (0, import_react5.useCallback)((x, top = 0) => {
+  const setDragGuide = (0, import_react8.useCallback)((x, top = 0) => {
     const guide = dragGuideRef.current;
     if (!guide) return;
     guide.style.display = x === null ? "none" : "block";
@@ -3064,20 +3266,20 @@ function TableInner({
       guide.style.transform = `translateX(${Math.round(x)}px)`;
     }
   }, []);
-  const setRowDragGuide = (0, import_react5.useCallback)((y) => {
+  const setRowDragGuide = (0, import_react8.useCallback)((y) => {
     const guide = rowDragGuideRef.current;
     if (!guide) return;
     guide.style.display = y === null ? "none" : "block";
     if (y !== null) guide.style.transform = `translateY(${Math.round(y)}px)`;
   }, []);
-  const locateRow = (0, import_react5.useCallback)((clientY) => {
+  const locateRow = (0, import_react8.useCallback)((clientY) => {
     const canvas = canvasRef.current;
     if (!canvas) return -1;
     const localY = clientY - canvas.getBoundingClientRect().top;
     const rowIndex = Math.floor((localY - bodyTop + scrollRef.current.top) / rowHeight);
     return rowIndex >= 0 && rowIndex < rows.length ? rowIndex : -1;
   }, [bodyTop, rowHeight, rows.length]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     const canvas = canvasRef.current;
     if (!canvas || !rowDraggable) return;
     const cleanupDrag = (0, import_adapter.draggable)({
@@ -3200,7 +3402,7 @@ function TableInner({
       cleanupDrop();
     };
   }, [applyRowOrder, bodyTop, columns, getCellLabel, getDisplayedColumnLeft, getRowKey, hideDragTooltips, locateColumn, locateRow, metrics, rowDraggable, rowHeight, rows, selectedRowKeySet, selection, setRowDragGuide]);
-  const locateCell = (0, import_react5.useCallback)((clientX, clientY) => {
+  const locateCell = (0, import_react8.useCallback)((clientX, clientY) => {
     const canvas = canvasRef.current;
     if (!canvas) return null;
     const rect = canvas.getBoundingClientRect();
@@ -3220,7 +3422,7 @@ function TableInner({
       columnKey: columns[targetColumnIndex].key
     };
   }, [bodyTop, columns, fixedHeader, getCellSpan, getRowKey, locateColumn, rowHeight, rows]);
-  const beginRangeDrag = (0, import_react5.useCallback)((event) => {
+  const beginRangeDrag = (0, import_react8.useCallback)((event) => {
     if (!rangeSelection) return;
     if (event.button !== 0 || editing || event.target !== event.currentTarget) return;
     const cell = locateCell(event.clientX, event.clientY);
@@ -3229,7 +3431,7 @@ function TableInner({
     setSelectionRange(null);
     event.currentTarget.setPointerCapture(event.pointerId);
   }, [columns, editing, locateCell, rangeSelection]);
-  const updateRangeDrag = (0, import_react5.useCallback)((event) => {
+  const updateRangeDrag = (0, import_react8.useCallback)((event) => {
     const drag = rangeDragRef.current;
     if (!drag) return;
     const focus = locateCell(event.clientX, event.clientY);
@@ -3239,7 +3441,7 @@ function TableInner({
     event.preventDefault();
     setSelectionRange((current) => current?.focus.rowIndex === focus.rowIndex && current.focus.columnIndex === focus.columnIndex ? current : { anchor: drag.anchor, focus });
   }, [columns, locateCell]);
-  const endRangeDrag = (0, import_react5.useCallback)((event) => {
+  const endRangeDrag = (0, import_react8.useCallback)((event) => {
     const drag = rangeDragRef.current;
     if (!drag) return;
     rangeDragRef.current = null;
@@ -3249,7 +3451,7 @@ function TableInner({
     setSelection(drag.anchor);
     scrollerRef.current?.focus({ preventScroll: true });
   }, [setSelection]);
-  const selectRow = (0, import_react5.useCallback)((rowIndex, event, forceToggle = false) => {
+  const selectRow = (0, import_react8.useCallback)((rowIndex, event, forceToggle = false) => {
     if (!rowSelection) return;
     clickedCellRef.current = null;
     setSelectionRange(null);
@@ -3269,7 +3471,7 @@ function TableInner({
     rowAnchorRef.current = rowIndex;
     setRowKeys(next);
   }, [getRowKey, rowKeys, rowSelection, rows, selectedRowKeySet, setRowKeys, setSelection]);
-  const selectColumn = (0, import_react5.useCallback)((columnIndex, event) => {
+  const selectColumn = (0, import_react8.useCallback)((columnIndex, event) => {
     if (!columnSelection || columnIndex < 0) return;
     clickedCellRef.current = null;
     setSelectionRange(null);
@@ -3289,7 +3491,7 @@ function TableInner({
     columnAnchorRef.current = columnIndex;
     setColumnKeys(next);
   }, [columnKeys, columnSelection, columns, selectedColumnKeySet, setColumnKeys, setSelection]);
-  const toggleColumnFromMenu = (0, import_react5.useCallback)((columnIndex) => {
+  const toggleColumnFromMenu = (0, import_react8.useCallback)((columnIndex) => {
     if (!columnSelection || columnIndex < 0) return;
     clickedCellRef.current = null;
     setSelectionRange(null);
@@ -3301,7 +3503,7 @@ function TableInner({
     columnAnchorRef.current = columnIndex;
     setColumnKeys(next);
   }, [columnKeys, columnSelection, columns, selectedColumnKeySet, setColumnKeys, setSelection]);
-  const revealCell = (0, import_react5.useCallback)((cell) => {
+  const revealCell = (0, import_react8.useCallback)((cell) => {
     const scroller = scrollerRef.current;
     const metric = metrics[cell.columnIndex];
     const column = columns[cell.columnIndex];
@@ -3331,13 +3533,13 @@ function TableInner({
     scrollRef.current = { left: scroller.scrollLeft, top: scroller.scrollTop };
     scheduleDraw();
   }, [bodyTop, columns, fixedHeader, fixedWidth, getCellDisplayWidth, getCellSpan, getScrollableColumnLeft, metrics, rightFixedWidth, rowHeight, scheduleDraw, viewport.width]);
-  const isCellEditable = (0, import_react5.useCallback)((cell) => {
+  const isCellEditable = (0, import_react8.useCallback)((cell) => {
     const column = columns[cell.columnIndex];
     const row = rows[cell.rowIndex];
     if (!column || !row || column.dataIndex === void 0 || column.rowNumber || column.rowSelection || column.rowDragHandle) return false;
     return typeof column.editable === "function" ? column.editable(row[column.dataIndex], row, cell.rowIndex) : column.editable === true;
   }, [columns, rows]);
-  const beginEdit = (0, import_react5.useCallback)((cell) => {
+  const beginEdit = (0, import_react8.useCallback)((cell) => {
     const column = columns[cell.columnIndex];
     if (!isCellEditable(cell) || column.dataIndex === void 0) return;
     const value = rows[cell.rowIndex]?.[column.dataIndex];
@@ -3407,7 +3609,7 @@ function TableInner({
       return next;
     });
   };
-  const commitEdit = (0, import_react5.useCallback)((nextDraft, close = true) => {
+  const commitEdit = (0, import_react8.useCallback)((nextDraft, close = true) => {
     if (!editing) return;
     if (!isCellEditable(editing)) {
       setEditing(null);
@@ -3432,11 +3634,29 @@ function TableInner({
     if (!editing || !editorStyle) return null;
     const column = columns[editing.columnIndex];
     if (column.editor?.type === "select") {
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         ChoiceEditor,
         {
           value: draft,
           options: column.editor.options,
+          searchable: column.editor.searchable,
+          allowCustomValue: column.editor.allowCustomValue,
+          maxDropdownHeight: column.editor.maxDropdownHeight,
+          style: editorStyle,
+          labels,
+          onChange: setDraft,
+          onCommit: (next) => commitEdit(next),
+          onCancel: () => setEditing(null)
+        }
+      );
+    }
+    if (column.editor?.type === "textarea") {
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        TextAreaEditor,
+        {
+          value: draft,
+          title: column.editor.title ?? column.title,
+          maxLength: column.editor.maxLength,
           style: editorStyle,
           labels,
           onChange: setDraft,
@@ -3446,7 +3666,7 @@ function TableInner({
       );
     }
     if (column.editor?.type === "time" || column.editor?.type === "time-range") {
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         CompactTimeEditor,
         {
           value: draft,
@@ -3461,7 +3681,7 @@ function TableInner({
       );
     }
     if (column.editor && ["date", "date-range", "date-time", "date-time-range", "year", "month"].includes(column.editor.type)) {
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         DateEditor,
         {
           editor: column.editor,
@@ -3477,11 +3697,14 @@ function TableInner({
     }
     const row = rows[editing.rowIndex];
     const cellValue = column.dataIndex === void 0 ? void 0 : row?.[column.dataIndex];
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       TextEditor,
       {
         value: draft,
-        type: typeof cellValue === "number" ? "number" : "text",
+        type: column.editor?.type === "number" || typeof cellValue === "number" ? "number" : "text",
+        min: column.editor?.type === "number" ? column.editor.min : void 0,
+        max: column.editor?.type === "number" ? column.editor.max : void 0,
+        integer: column.editor?.type === "number" ? column.editor.integer : void 0,
         style: editorStyle,
         labels,
         onChange: setDraft,
@@ -3490,7 +3713,7 @@ function TableInner({
       }
     );
   };
-  const handleKeyDown = (0, import_react5.useCallback)((event) => {
+  const handleKeyDown = (0, import_react8.useCallback)((event) => {
     if (editing || !selection) return;
     if (event.key === "Enter") {
       event.preventDefault();
@@ -3523,7 +3746,7 @@ function TableInner({
       }
     }
   }, [beginEdit, bodyTop, columns, editing, renderHeight, fixedHeader, fixedWidth, getCellDisplayWidth, getCellSpan, getRowKey, getScrollableColumnLeft, metrics, rightFixedWidth, rowHeight, rows, selection, setSelection, viewport.width]);
-  const editorStyle = (0, import_react5.useMemo)(() => {
+  const editorStyle = (0, import_react8.useMemo)(() => {
     if (!editing) return void 0;
     const metric = metrics[editing.columnIndex];
     const column = columns[editing.columnIndex];
@@ -3558,7 +3781,7 @@ function TableInner({
       clipPath: `inset(${Math.max(0, visibleTop - cellTop)}px ${Math.max(0, cellLeft + cellWidth - visibleRight)}px ${Math.max(0, cellTop + cellHeight - visibleBottom)}px ${Math.max(0, visibleLeft - cellLeft)}px)`
     };
   }, [bodyTop, columns, editing, fixedHeader, fixedWidth, getCellDisplayWidth, getCellSpan, getScrollableColumnLeft, leftFixedOffsets, metrics, renderHeight, rightFixedOffsets, rightFixedWidth, rowHeight, viewport.width]);
-  const handleColumnPointerDown = (0, import_react5.useCallback)((event) => {
+  const handleColumnPointerDown = (0, import_react8.useCallback)((event) => {
     const rect = event.currentTarget.getBoundingClientRect();
     const localY = event.clientY - rect.top;
     const headerY = fixedHeader ? 0 : -scrollRef.current.top;
@@ -3602,7 +3825,7 @@ function TableInner({
       return;
     }
   }, [fixedHeader, getHeaderCellLeft, getHeaderCellWidth, headerHeight, headerRowOffsets, locateHeaderResizeHit, metrics]);
-  const handleColumnPointerMove = (0, import_react5.useCallback)((event) => {
+  const handleColumnPointerMove = (0, import_react8.useCallback)((event) => {
     const drag = columnDragRef.current;
     if (!drag) return;
     const column = columns[drag.columnIndex];
@@ -3638,7 +3861,7 @@ function TableInner({
     resizeColumn(column.key, width2);
     setGuideFromWidths([width2]);
   }, [columnDraggable, columns, getHeaderCellEdgeFromMetrics, resizeColumn, viewport.width]);
-  const handleColumnPointerUp = (0, import_react5.useCallback)((event) => {
+  const handleColumnPointerUp = (0, import_react8.useCallback)((event) => {
     const drag = columnDragRef.current;
     if (!drag) return;
     if (event.currentTarget.hasPointerCapture(event.pointerId)) event.currentTarget.releasePointerCapture(event.pointerId);
@@ -3648,7 +3871,7 @@ function TableInner({
     document.documentElement.classList.remove("rvg-is-dragging");
     event.currentTarget.style.cursor = "default";
   }, []);
-  const clearColumnOrderPointerDrag = (0, import_react5.useCallback)((canvas) => {
+  const clearColumnOrderPointerDrag = (0, import_react8.useCallback)((canvas) => {
     if (columnOrderLongPressTimerRef.current) {
       clearTimeout(columnOrderLongPressTimerRef.current);
       columnOrderLongPressTimerRef.current = null;
@@ -3661,7 +3884,7 @@ function TableInner({
     document.documentElement.classList.remove("rvg-is-dragging");
     canvas.style.cursor = "default";
   }, [setDragGuide]);
-  const updateColumnDragPreview = (0, import_react5.useCallback)((sourceCell, clientX, canvas) => {
+  const updateColumnDragPreview = (0, import_react8.useCallback)((sourceCell, clientX, canvas) => {
     const rootRect = rootRef.current?.getBoundingClientRect() ?? canvas.getBoundingClientRect();
     const sourceWidth = metrics[sourceCell.startIndex]?.width ?? 100;
     const previewWidth = sourceWidth;
@@ -3673,7 +3896,7 @@ function TableInner({
       sourceLeft: getDisplayedColumnLeft(sourceCell.startIndex)
     });
   }, [getDisplayedColumnLeft, metrics, viewport.width]);
-  const activateColumnOrderPointerDrag = (0, import_react5.useCallback)((canvas, clientX) => {
+  const activateColumnOrderPointerDrag = (0, import_react8.useCallback)((canvas, clientX) => {
     const drag = columnOrderDragRef.current;
     if (!drag || drag.active) return;
     if (columnOrderLongPressTimerRef.current) {
@@ -3687,7 +3910,7 @@ function TableInner({
     canvas.style.cursor = "move";
     updateColumnDragPreview(drag.sourceCell, clientX, canvas);
   }, [hideDragTooltips, updateColumnDragPreview]);
-  const handleColumnOrderPointerDown = (0, import_react5.useCallback)((event) => {
+  const handleColumnOrderPointerDown = (0, import_react8.useCallback)((event) => {
     if (!columnDraggable || event.button !== 0 || columnDragRef.current) return;
     const sourceCell = locateHeaderCell(event.clientX, event.clientY);
     if (!sourceCell || locateHeaderResizeCell(event.clientX, event.clientY)) return;
@@ -3711,7 +3934,7 @@ function TableInner({
       activateColumnOrderPointerDrag(canvas, drag.startX);
     }, 320);
   }, [activateColumnOrderPointerDrag, columnDraggable, columns, locateHeaderAction, locateHeaderCell, locateHeaderResizeCell]);
-  const handleColumnOrderPointerMove = (0, import_react5.useCallback)((event) => {
+  const handleColumnOrderPointerMove = (0, import_react8.useCallback)((event) => {
     const drag = columnOrderDragRef.current;
     if (!drag || drag.pointerId !== event.pointerId || columnDragRef.current) return;
     if (!drag.active) {
@@ -3782,7 +4005,7 @@ function TableInner({
       columnEdge
     };
   }, [activateColumnOrderPointerDrag, columns, getHeaderCellLeft, getHeaderCellWidth, headerCells, headerRowOffsets, locateColumn, locateHeaderCell, setDragGuide, updateColumnDragPreview]);
-  const finishColumnOrderPointerDrag = (0, import_react5.useCallback)((event, apply) => {
+  const finishColumnOrderPointerDrag = (0, import_react8.useCallback)((event, apply) => {
     const drag = columnOrderDragRef.current;
     if (!drag || drag.pointerId !== event.pointerId) return;
     if (event.currentTarget.hasPointerCapture(event.pointerId)) event.currentTarget.releasePointerCapture(event.pointerId);
@@ -3806,7 +4029,7 @@ function TableInner({
       suppressClickRef.current = false;
     }, 0);
   }, [applyColumnOrder, clearColumnOrderPointerDrag, utilityColumnCount]);
-  const queueSortStateChange = (0, import_react5.useCallback)((next) => {
+  const queueSortStateChange = (0, import_react8.useCallback)((next) => {
     setSortState(next);
   }, []);
   const renderHeaderIcons = (columnIndex, left) => {
@@ -3822,26 +4045,26 @@ function TableInner({
     if (visibleActions.drag) {
       const hovered = hoveredHeaderAction?.columnIndex === columnIndex && hoveredHeaderAction.action === "drag";
       icons.push(
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(HeaderDragIcon, { className: `rvg-header-icon rvg-header-drag-icon${selectedClassName}${hoveredColumnClassName}${hovered ? " is-hovered" : ""}`, style: { left: left + metrics[columnIndex].width - headerActionSlotWidth, top } }, "drag")
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(HeaderDragIcon, { className: `rvg-header-icon rvg-header-drag-icon${selectedClassName}${hoveredColumnClassName}${hovered ? " is-hovered" : ""}`, style: { left: left + metrics[columnIndex].width - headerActionSlotWidth, top } }, "drag")
       );
     }
     if (visibleActions.sort) {
       const hovered = hoveredHeaderAction?.columnIndex === columnIndex && hoveredHeaderAction.action === "sort";
       const direction = sortState?.columnKey === column.key ? sortState.direction : null;
       icons.push(
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(HeaderSortIcon, { className: `rvg-header-icon${selectedClassName}${hoveredColumnClassName}${direction ? " is-active" : ""}${hovered ? " is-hovered" : ""}`, style: { left: right - headerActionSlotWidth, top }, direction }, "sort")
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(HeaderSortIcon, { className: `rvg-header-icon${selectedClassName}${hoveredColumnClassName}${direction ? " is-active" : ""}${hovered ? " is-hovered" : ""}`, style: { left: right - headerActionSlotWidth, top }, direction }, "sort")
       );
       right -= headerActionSlotWidth;
     }
     if (visibleActions.filter) {
       const hovered = hoveredHeaderAction?.columnIndex === columnIndex && hoveredHeaderAction.action === "filter";
       icons.push(
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(HeaderSearchIcon, { className: `rvg-header-icon rvg-header-search-icon${selectedClassName}${hoveredColumnClassName}${hovered ? " is-hovered" : ""}${filterValues[column.key] ? " is-active" : ""}`, style: { left: right - headerActionSlotWidth, top: top + 1 } }, "filter")
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(HeaderSearchIcon, { className: `rvg-header-icon rvg-header-search-icon${selectedClassName}${hoveredColumnClassName}${hovered ? " is-hovered" : ""}${filterValues[column.key] ? " is-active" : ""}`, style: { left: right - headerActionSlotWidth, top: top + 1 } }, "filter")
       );
     }
     return icons;
   };
-  const createHeaderTooltip = (0, import_react5.useCallback)((action, columnIndex, cell) => {
+  const createHeaderTooltip = (0, import_react8.useCallback)((action, columnIndex, cell) => {
     const column = cell?.column ?? columns[columnIndex];
     if (!column) return null;
     const cellLeft = cell ? getHeaderCellLeft(cell) : getDisplayedColumnLeft(columnIndex);
@@ -3910,7 +4133,7 @@ function TableInner({
       placement
     };
   }, [baseHeaderHeight, columnDraggable, columns, filterValues, fixedHeader, getDisplayedColumnLeft, getHeaderCellLeft, getHeaderCellWidth, headerActionSize, headerActionSlotWidth, headerDepth, headerLeafHeight, headerLeafTop, headerRowHeights, headerRowOffsets, labels, measureHeaderTitleWidth, metrics, scrollPosition.top, sortState, viewport.width]);
-  const isPointerOnHeaderTitle = (0, import_react5.useCallback)((clientX, clientY, cell) => {
+  const isPointerOnHeaderTitle = (0, import_react8.useCallback)((clientX, clientY, cell) => {
     const canvas = canvasRef.current;
     if (!canvas) return false;
     const rect = canvas.getBoundingClientRect();
@@ -3931,7 +4154,7 @@ function TableInner({
     const textTop = rowTop + 8;
     return localX >= textLeft - 4 && localX <= textLeft + textWidth + 4 && localY >= textTop - 2 && localY <= textTop + 18;
   }, [columnDraggable, fixedHeader, getHeaderCellLeft, getHeaderCellWidth, headerActionSlotWidth, headerRowOffsets]);
-  const locateCustomHeaderTooltip = (0, import_react5.useCallback)((clientX, clientY, columnIndex) => {
+  const locateCustomHeaderTooltip = (0, import_react8.useCallback)((clientX, clientY, columnIndex) => {
     const root = rootRef.current;
     const canvas = canvasRef.current;
     if (!root || !canvas || columnIndex < 0) return null;
@@ -4125,20 +4348,20 @@ function TableInner({
       setAnnotationOpen(false);
       setContextMenu(null);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: `rvg-annotation-submenu is-${annotationPlacement}`, onMouseEnter: openAnnotation, onMouseLeave: () => setAnnotationOpen(false), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("button", { type: "button", role: "menuitem", className: "rvg-context-annotation-trigger", "aria-expanded": annotationOpen, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "annotation" }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-label", children: labels.annotation }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SubmenuArrowIcon, {})
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: `rvg-annotation-submenu is-${annotationPlacement}`, onMouseEnter: openAnnotation, onMouseLeave: () => setAnnotationOpen(false), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("button", { type: "button", role: "menuitem", className: "rvg-context-annotation-trigger", "aria-expanded": annotationOpen, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "annotation" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-label", children: labels.annotation }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SubmenuArrowIcon, {})
         ] }),
-        annotationOpen && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: `rvg-annotation-panel is-${annotationPlacement}`, role: "menu", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: `rvg-annotation-types${annotationType === "corner" ? " is-corner" : ""}`, role: "group", "aria-label": labels.annotationMode, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", className: annotationType === "background" ? "is-active" : "", onClick: () => setAnnotationType("background"), children: labels.annotationBackground }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", className: annotationType === "corner" ? "is-active" : "", onClick: () => setAnnotationType("corner"), children: labels.annotationCorner })
+        annotationOpen && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: `rvg-annotation-panel is-${annotationPlacement}`, role: "menu", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: `rvg-annotation-types${annotationType === "corner" ? " is-corner" : ""}`, role: "group", "aria-label": labels.annotationMode, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { type: "button", className: annotationType === "background" ? "is-active" : "", onClick: () => setAnnotationType("background"), children: labels.annotationBackground }),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { type: "button", className: annotationType === "corner" ? "is-active" : "", onClick: () => setAnnotationType("corner"), children: labels.annotationCorner })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-annotation-colors", children: ANNOTATION_COLORS.map((color, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", className: annotationColor === color ? "is-active" : "", "aria-label": labels.annotationColor(index + 1), title: labels.annotationColor(index + 1), style: { backgroundColor: color, "--annotation-color": color }, onClick: () => setAnnotationColor(color) }, color)) }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-annotation-colors", children: ANNOTATION_COLORS.map((color, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { type: "button", className: annotationColor === color ? "is-active" : "", "aria-label": labels.annotationColor(index + 1), title: labels.annotationColor(index + 1), style: { backgroundColor: color, "--annotation-color": color }, onClick: () => setAnnotationColor(color) }, color)) }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             "textarea",
             {
               className: "rvg-annotation-content",
@@ -4150,16 +4373,16 @@ function TableInner({
               onChange: (event) => setAnnotationContent(event.target.value)
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-annotation-actions", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-annotation-actions", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { children: [
               annotationContent.length,
               "/100"
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", onClick: saveAnnotation, children: labels.confirm })
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { type: "button", onClick: saveAnnotation, children: labels.confirm })
           ] })
         ] })
       ] }),
-      hasAnnotation && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("button", { type: "button", role: "menuitem", onClick: () => {
+      hasAnnotation && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("button", { type: "button", role: "menuitem", onClick: () => {
         setCellAnnotations((current) => {
           const next = new Map(current);
           targetCells.forEach((cell) => next.delete(getKey(cell)));
@@ -4167,8 +4390,8 @@ function TableInner({
         });
         setContextMenu(null);
       }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "remove-annotation" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-label", children: labels.removeAnnotation })
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "remove-annotation" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-label", children: labels.removeAnnotation })
       ] })
     ] });
   };
@@ -4240,7 +4463,7 @@ function TableInner({
     if (column.renderCell && !(editing?.rowIndex === rowIndex && editing.columnIndex === columnIndex)) {
       const row = rows[rowIndex];
       const value = column.dataIndex === void 0 ? void 0 : row[column.dataIndex];
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         "div",
         {
           className: `rvg-cell-render${selectedRowKeySet.has(getRowKey(row, rowIndex)) || selectedColumnKeySet.has(column.key) ? " is-axis-selected" : ""}`,
@@ -4268,12 +4491,12 @@ function TableInner({
     const headerTop = fixedHeader ? 0 : -currentScrollTop;
     const leafTop = headerTop + headerLeafTop;
     if (column.rowNumber) {
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         "div",
         {
           className: `rvg-header-title${isDropTarget ? " is-drop-target" : ""}`,
           style: { left, top: headerTop, width: metrics[columnIndex].width, height: headerHeight, justifyContent: "center", padding: 0, textAlign: "center" },
-          children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: column.title })
+          children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: column.title })
         },
         column.key
       );
@@ -4282,12 +4505,12 @@ function TableInner({
       if (rowSelectionMode === "single" || column.rowSelectionIndicator === "arrow" || column.rowSelectionIndicator === "none") return null;
       const allSelected = rows.length > 0 && selectedRowKeySet.size === rows.length;
       const indeterminate = selectedRowKeySet.size > 0 && !allSelected;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         "div",
         {
           className: "rvg-header-selection-icon",
           style: { left, top: headerTop, width: metrics[columnIndex].width, height: headerHeight },
-          children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SelectionIcon, { checked: allSelected, indeterminate })
+          children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SelectionIcon, { checked: allSelected, indeterminate })
         },
         column.key
       );
@@ -4296,7 +4519,7 @@ function TableInner({
       const visibleActions = getVisibleHeaderActions(column, metrics[columnIndex].width, columnDraggable, measureHeaderTitleWidth(columnIndex), headerActionSlotWidth);
       const actionWidth = (Number(visibleActions.drag) + Number(visibleActions.filter) + Number(visibleActions.sort)) * headerActionSlotWidth;
       const isHeaderHovered = hoveredHeaderColumnIndex === columnIndex;
-      return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         "div",
         {
           className: `rvg-header-title is-custom${isHeaderHovered ? " is-header-hovered" : ""}${isAxisSelected ? " is-axis-selected" : ""}${isDropTarget ? " is-drop-target" : ""}`,
@@ -4311,7 +4534,7 @@ function TableInner({
             justifyContent: column.align === "right" ? "flex-end" : column.align === "center" ? "center" : "flex-start",
             textAlign: column.align === "right" ? "right" : column.align === "center" ? "center" : "left"
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             "span",
             {
               style: { width: "100%" },
@@ -4345,7 +4568,7 @@ function TableInner({
     const actionWidth = visibleActions ? (Number(visibleActions.drag) + Number(visibleActions.filter) + Number(visibleActions.sort)) * headerActionSlotWidth : columnDraggable && !cell.leaf ? headerActionSlotWidth : 0;
     const isDropTarget = Boolean(columnDropTarget && cell.endIndex >= columnDropTarget.startIndex && cell.startIndex <= columnDropTarget.endIndex);
     const isAxisSelected = cell.leaf && selectedColumnKeySet.has(column.key);
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       "div",
       {
         className: `rvg-header-title rvg-header-group${column.renderHeader ? " is-custom" : ""}${cell.leaf ? " is-leaf" : ""}${isAxisSelected ? " is-axis-selected" : ""}${cell.endIndex === columns.length - 1 ? " is-frame-right" : ""}${isDropTarget ? " is-drop-target" : ""}`,
@@ -4364,7 +4587,7 @@ function TableInner({
           textAlign: column.align === "right" ? "right" : column.align === "center" ? "center" : "left"
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             "span",
             {
               ref: (node) => {
@@ -4378,7 +4601,7 @@ function TableInner({
               children: column.renderHeader ? column.renderHeader(column) : column.title
             }
           ),
-          !cell.leaf && columnDraggable && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          !cell.leaf && columnDraggable && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             HeaderDragIcon,
             {
               className: `rvg-header-icon rvg-header-drag-icon${hoveredHeaderAction?.columnIndex === cell.startIndex && hoveredHeaderAction.action === "drag" ? " is-hovered" : ""}`,
@@ -4445,7 +4668,7 @@ function TableInner({
       "--rvg-corner-hover-height-extension": "4px"
     } : null
   } : void 0;
-  (0, import_react5.useLayoutEffect)(() => {
+  (0, import_react8.useLayoutEffect)(() => {
     syncSelectionEdgeTarget(scrollPosition.left, scrollPosition.top);
   }, [scrollPosition.left, scrollPosition.top, syncSelectionEdgeTarget]);
   const handleContextMenu = (event) => {
@@ -4480,7 +4703,7 @@ function TableInner({
     if (override?.render !== void 0 || override?.childrens !== void 0) {
       return renderContextMenuSubmenu(key, context, override?.label ?? label, override, icon, disabled, danger);
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       "button",
       {
         type: "button",
@@ -4494,9 +4717,9 @@ function TableInner({
           setContextMenu(null);
         },
         children: [
-          icon && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-icon", children: icon }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-label", children: override?.label ?? label }),
-          override?.shortcut && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-shortcut", children: override.shortcut })
+          icon && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-icon", children: icon }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-label", children: override?.label ?? label }),
+          override?.shortcut && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-shortcut", children: override.shortcut })
         ]
       },
       key
@@ -4515,20 +4738,20 @@ function TableInner({
       }
       const node = renderCustomContextMenuItem(child, context);
       if (!node) return null;
-      const wrapped = /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_react5.Fragment, { children: [
-        separatorPending && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-context-separator" }),
+      const wrapped = /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react8.Fragment, { children: [
+        separatorPending && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-context-separator" }),
         node
       ] }, child.key);
       separatorPending = false;
       return wrapped;
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-context-submenu", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("button", { type: "button", role: "menuitem", className: danger ? "rvg-context-danger" : void 0, disabled, "aria-haspopup": "menu", children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-icon", children: icon }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-label", children: label }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(SubmenuArrowIcon, {})
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-context-submenu", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("button", { type: "button", role: "menuitem", className: danger ? "rvg-context-danger" : void 0, disabled, "aria-haspopup": "menu", children: [
+        icon && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-icon", children: icon }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-label", children: label }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SubmenuArrowIcon, {})
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-context-submenu-panel", role: "menu", children: content })
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-context-submenu-panel", role: "menu", children: content })
     ] }, key);
   };
   const renderConfiguredContextMenu = (items, context, renderBuiltin) => {
@@ -4545,10 +4768,10 @@ function TableInner({
       const node = renderBuiltin(key, override) ?? (override ? renderCustomContextMenuItem(override, context) : null);
       if (!node) return;
       if (separatorPending) {
-        nodes.push(/* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-context-separator" }, `separator:${index}`));
+        nodes.push(/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-context-separator" }, `separator:${index}`));
         separatorPending = false;
       }
-      nodes.push(/* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react5.Fragment, { children: node }, typeof item === "string" ? `${item}:${index}` : item.key));
+      nodes.push(/* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react8.Fragment, { children: node }, typeof item === "string" ? `${item}:${index}` : item.key));
     });
     return nodes;
   };
@@ -4558,8 +4781,8 @@ function TableInner({
     const hasSummaryValue = summaryValues.has(column.key);
     const summaryContent = hasSummaryValue ? summaryValues.get(column.key) : summaryEmptyValue;
     const showSummarySkeleton = Boolean(column.summary) && summaryPending;
-    const content = columnIndex === 0 ? language === "zh-CN" ? "\u5408\u8BA1" : "Total" : showSummarySkeleton ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-summary-skeleton" }) : summaryContent;
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    const content = columnIndex === 0 ? language === "zh-CN" ? "\u5408\u8BA1" : "Total" : showSummarySkeleton ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-summary-skeleton" }) : summaryContent;
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "div",
       {
         className: `rvg-summary-cell${isUtility ? " is-utility" : ""}${column.summary ? " is-summary" : ""}${summaryVerticalBordered ? "" : " is-borderless"}`,
@@ -4573,7 +4796,7 @@ function TableInner({
       `summary:${column.key}`
     );
   };
-  (0, import_react5.useImperativeHandle)(ref, () => {
+  (0, import_react8.useImperativeHandle)(ref, () => {
     const resolveDataCell = (target) => {
       const cell = resolveSelectionTarget(target);
       if (!cell) return null;
@@ -4661,9 +4884,9 @@ function TableInner({
   const draggingSelectedColumn = Boolean(
     columnDragPreview && selectedColumnKeySet.has(columns[columnDragPreview.sourceIndex]?.key)
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { ref: rootRef, className: `rvg-root${!hasVerticalBorders ? " is-vertical-borderless" : ""}${horizontalBorderless ? " is-horizontal-borderless" : ""}${frameBorderless ? " is-frame-borderless" : ""}${hasStripedRows ? " is-striped" : ""}${insertBusy ? " is-inserting" : ""}${deleteBusy ? " is-deleting" : ""}${draggingSelectedColumn ? " is-dragging-selected-column" : ""} ${loading && !hasCompletedLoadRef.current && !hasCustomLoading ? "is-initial-loading" : ""} ${className}`, style: rootStyle, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { ref: scrollerRef, className: `rvg-scroller${contextMenu ? " is-context-menu-open" : ""}`, style: { bottom: scrollerBottom }, onScroll: handleScroll, onCopy: handleCopy, onContextMenu: handleContextMenu, tabIndex: 0, role: "grid", "aria-label": ariaLabel, "aria-rowcount": rows.length, "aria-colcount": columns.length, onKeyDown: handleKeyDown, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { ref: rootRef, className: `rvg-root${!hasVerticalBorders ? " is-vertical-borderless" : ""}${horizontalBorderless ? " is-horizontal-borderless" : ""}${frameBorderless ? " is-frame-borderless" : ""}${hasStripedRows ? " is-striped" : ""}${insertBusy ? " is-inserting" : ""}${deleteBusy ? " is-deleting" : ""}${draggingSelectedColumn ? " is-dragging-selected-column" : ""} ${loading && !hasCompletedLoadRef.current && !hasCustomLoading ? "is-initial-loading" : ""} ${className}`, style: rootStyle, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { ref: scrollerRef, className: `rvg-scroller${contextMenu ? " is-context-menu-open" : ""}`, style: { bottom: scrollerBottom }, onScroll: handleScroll, onCopy: handleCopy, onContextMenu: handleContextMenu, tabIndex: 0, role: "grid", "aria-label": ariaLabel, "aria-rowcount": rows.length, "aria-colcount": columns.length, onKeyDown: handleKeyDown, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         "canvas",
         {
           ref: canvasRef,
@@ -4901,48 +5124,48 @@ function TableInner({
           onContextMenu: handleContextMenu
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-text-layer", style: { width: viewport.width, height: renderHeight, marginTop: -renderHeight }, onContextMenu: handleContextMenu, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-text-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-text-layer", style: { width: viewport.width, height: renderHeight, marginTop: -renderHeight }, onContextMenu: handleContextMenu, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-text-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
           "div",
           {
             ref: scrollingTextRef,
             className: "rvg-text-scroll-content",
             style: { left: -fixedWidth, width: contentWidth, transform: `translateX(${-currentScroll.left}px)` },
             children: [
-              columns.map((column, columnIndex) => column.fixed || columnIndex >= utilityColumnCount && headerDepth > 1 ? null : columnIndex >= domRange.columnStart && columnIndex < domRange.columnEnd ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: renderHeaderTitle(columnIndex, getScrollableColumnLeft(columnIndex)) }, column.key) : null),
+              columns.map((column, columnIndex) => column.fixed || columnIndex >= utilityColumnCount && headerDepth > 1 ? null : columnIndex >= domRange.columnStart && columnIndex < domRange.columnEnd ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: renderHeaderTitle(columnIndex, getScrollableColumnLeft(columnIndex)) }, column.key) : null),
               headerCells.map((cell) => {
                 if (columns[cell.startIndex]?.fixed) return null;
                 if (cell.endIndex < domRange.columnStart || cell.startIndex >= domRange.columnEnd) return null;
                 return renderGroupedHeaderCell(cell);
               }),
-              /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-body-text-clip", style: { top: fixedHeader ? bodyTop : 0, bottom: 0 }, children: Array.from({ length: domRange.rowEnd - domRange.rowStart }, (_, offset) => domRange.rowStart + offset).flatMap((rowIndex) => columns.map((column, columnIndex) => {
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-body-text-clip", style: { top: fixedHeader ? bodyTop : 0, bottom: 0 }, children: Array.from({ length: domRange.rowEnd - domRange.rowStart }, (_, offset) => domRange.rowStart + offset).flatMap((rowIndex) => columns.map((column, columnIndex) => {
                 if (column.fixed || columnIndex < domRange.columnStart || columnIndex >= domRange.columnEnd) return null;
                 return renderCellText(rowIndex, columnIndex, getScrollableColumnLeft(columnIndex));
               })) })
             ]
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-body-text-clip", style: { top: fixedHeader ? bodyTop : 0, bottom: 0 }, children: Array.from({ length: domRange.rowEnd - domRange.rowStart }, (_, offset) => domRange.rowStart + offset).flatMap((rowIndex) => columns.map((column, columnIndex) => {
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-body-text-clip", style: { top: fixedHeader ? bodyTop : 0, bottom: 0 }, children: Array.from({ length: domRange.rowEnd - domRange.rowStart }, (_, offset) => domRange.rowStart + offset).flatMap((rowIndex) => columns.map((column, columnIndex) => {
           if (!column.fixed) return null;
           const left = column.fixed === "left" ? leftFixedOffsets.get(columnIndex) ?? 0 : viewport.width - (rightFixedOffsets.get(columnIndex) ?? 0) - metrics[columnIndex].width;
           return renderCellText(rowIndex, columnIndex, left);
         })) }),
         columns.map((column, columnIndex) => column.fixed && (columnIndex < utilityColumnCount || headerDepth === 1) ? renderHeaderTitle(columnIndex, column.fixed === "right" ? viewport.width - (rightFixedOffsets.get(columnIndex) ?? 0) - metrics[columnIndex].width : column.fixed === "left" ? leftFixedOffsets.get(columnIndex) ?? 0 : getScrollableColumnLeft(columnIndex)) : null),
         headerCells.map((cell) => columns[cell.startIndex]?.fixed ? renderGroupedHeaderCell(cell) : null),
-        fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-text-fixed-shadow is-left", style: { left: fixedWidth } }),
-        rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-text-fixed-shadow is-right", style: { right: rightFixedWidth } }),
-        hasVerticalBorders && fixedWidth > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-text-fixed-border is-left", style: { left: fixedWidth - 1 } }),
-        hasVerticalBorders && rightFixedWidth > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-text-fixed-border is-right", style: { right: rightFixedWidth } })
+        fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-text-fixed-shadow is-left", style: { left: fixedWidth } }),
+        rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-text-fixed-shadow is-right", style: { right: rightFixedWidth } }),
+        hasVerticalBorders && fixedWidth > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-text-fixed-border is-left", style: { left: fixedWidth - 1 } }),
+        hasVerticalBorders && rightFixedWidth > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-text-fixed-border is-right", style: { right: rightFixedWidth } })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-spacer", style: { width: contentWidth, height: contentHeight + bodyTop, marginTop: -renderHeight } })
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-spacer", style: { width: contentWidth, height: contentHeight + bodyTop, marginTop: -renderHeight } })
     ] }),
-    hasSummaryRow && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    hasSummaryRow && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       "div",
       {
         className: `rvg-summary-row is-${summaryPosition}${hasVerticalBorders ? "" : " is-vertical-borderless"}`,
         style: { height: rowHeight, top: summaryPosition === "top" ? fixedHeader ? headerHeight : headerHeight - currentScroll.top : void 0 },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-summary-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-summary-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             "div",
             {
               className: "rvg-summary-scroll-content",
@@ -4950,41 +5173,41 @@ function TableInner({
               children: columns.map((column, columnIndex) => column.fixed ? null : renderSummaryCell(columnIndex, getScrollableColumnLeft(columnIndex)))
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-summary-fixed-layer", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-summary-fixed-layer", children: [
             columns.map((column, columnIndex) => column.fixed === "left" ? renderSummaryCell(columnIndex, leftFixedOffsets.get(columnIndex) ?? 0) : null),
             columns.map((column, columnIndex) => column.fixed === "right" ? renderSummaryCell(columnIndex, viewport.width - (rightFixedOffsets.get(columnIndex) ?? 0) - metrics[columnIndex].width) : null)
           ] }),
-          fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-summary-fixed-shadow is-left", style: { left: fixedWidth } }),
-          rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-summary-fixed-shadow is-right", style: { right: rightFixedWidth } }),
-          summaryVerticalBordered && fixedWidth > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-summary-fixed-border is-left", style: { left: fixedWidth - 1 } }),
-          summaryVerticalBordered && rightFixedWidth > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-summary-fixed-border is-right", style: { right: rightFixedWidth } })
+          fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-summary-fixed-shadow is-left", style: { left: fixedWidth } }),
+          rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-summary-fixed-shadow is-right", style: { right: rightFixedWidth } }),
+          summaryVerticalBordered && fixedWidth > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-summary-fixed-border is-left", style: { left: fixedWidth - 1 } }),
+          summaryVerticalBordered && rightFixedWidth > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-summary-fixed-border is-right", style: { right: rightFixedWidth } })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { ref: headerIconsRef, className: "rvg-header-icons", style: { height: headerHeight, transform: `translateY(${fixedHeader ? 0 : -scrollRef.current.top}px)` }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-header-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { ref: headerIconsRef, className: "rvg-header-icons", style: { height: headerHeight, transform: `translateY(${fixedHeader ? 0 : -scrollRef.current.top}px)` }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-header-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         "div",
         {
           ref: scrollingHeaderIconsRef,
           className: "rvg-header-icon-layer rvg-header-icon-layer-scroll",
           style: { left: -fixedWidth, width: contentWidth, transform: `translateX(${-scrollRef.current.left}px)` },
-          children: columns.map((column, index) => column.fixed ? null : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: renderHeaderIcons(index, getScrollableColumnLeft(index)) }, column.key))
+          children: columns.map((column, index) => column.fixed ? null : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: renderHeaderIcons(index, getScrollableColumnLeft(index)) }, column.key))
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-header-icon-layer", children: [
-        columns.map((column, index) => column.fixed === "left" ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: renderHeaderIcons(index, leftFixedOffsets.get(index) ?? 0) }, column.key) : null),
-        columns.map((column, index) => column.fixed === "right" ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: renderHeaderIcons(index, viewport.width - (rightFixedOffsets.get(index) ?? 0) - metrics[index].width) }, column.key) : null)
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-header-icon-layer", children: [
+        columns.map((column, index) => column.fixed === "left" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: renderHeaderIcons(index, leftFixedOffsets.get(index) ?? 0) }, column.key) : null),
+        columns.map((column, index) => column.fixed === "right" ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: renderHeaderIcons(index, viewport.width - (rightFixedOffsets.get(index) ?? 0) - metrics[index].width) }, column.key) : null)
       ] })
     ] }),
-    hasVerticalBorders && trailingColumnBorderLeft !== null && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    hasVerticalBorders && trailingColumnBorderLeft !== null && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "div",
       {
         className: "rvg-trailing-column-border",
         style: { left: trailingColumnBorderLeft, height: renderHeight }
       }
     ),
-    headerTooltip && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `rvg-header-tooltip is-${headerTooltip.placement}`, role: "tooltip", style: { left: headerTooltip.left, top: headerTooltip.top }, children: headerTooltip.label }),
-    hoveredCellTooltip && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    headerTooltip && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `rvg-header-tooltip is-${headerTooltip.placement}`, role: "tooltip", style: { left: headerTooltip.left, top: headerTooltip.top }, children: headerTooltip.label }),
+    hoveredCellTooltip && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "div",
       {
         className: `rvg-cell-tooltip${hoveredCellTooltip.annotation ? " is-annotation" : ` is-${hoveredCellTooltip.placement ?? "right"}`}`,
@@ -5006,7 +5229,7 @@ function TableInner({
         children: hoveredCellTooltip.label
       }
     ),
-    rangeHandlePosition && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    rangeHandlePosition && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "div",
       {
         className: "rvg-range-handle",
@@ -5030,8 +5253,8 @@ function TableInner({
         }
       }
     ),
-    selectionOutlineStyle && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref: selectionFocusRef, className: "rvg-selection-focus", style: selectionOutlineStyle, "aria-hidden": "true" }),
-    selectionEdgeIndicator && selection && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    selectionOutlineStyle && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: selectionFocusRef, className: "rvg-selection-focus", style: selectionOutlineStyle, "aria-hidden": "true" }),
+    selectionEdgeIndicator && selection && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "button",
       {
         ref: selectionEdgeTargetRef,
@@ -5049,10 +5272,10 @@ function TableInner({
           scrollerRef.current?.focus({ preventScroll: true });
           revealCell(selection);
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-selection-edge-halo", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M 0 100 L 0 0 L 100 0" }) }) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-selection-edge-halo", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("path", { d: "M 0 100 L 0 0 L 100 0" }) }) })
       }
     ),
-    contextMenu && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref: contextMenuRef, className: "rvg-context-menu", role: "menu", style: { left: contextMenu.left, top: contextMenu.top }, children: contextMenu.type === "header" ? (() => {
+    contextMenu && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: contextMenuRef, className: "rvg-context-menu", role: "menu", style: { left: contextMenu.left, top: contextMenu.top }, children: contextMenu.type === "header" ? (() => {
       const column = columns[contextMenu.columnIndex];
       const headerContext = { column, columnIndex: contextMenu.columnIndex };
       return renderConfiguredContextMenu(resolveContextMenuSection(customContextMenuConfig?.header, DEFAULT_HEADER_CONTEXT_MENU), headerContext, (item, override) => {
@@ -5063,12 +5286,12 @@ function TableInner({
           } catch {
             showToast("error", labels.copyError);
           }
-        }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "copy" }) });
+        }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "copy" }) });
         if (item === "select-column") {
           if (!columnSelection) return null;
           return renderContextMenuButton("header-select-column", headerContext, selectedColumnKeySet.has(column.key) ? labels.deselectColumn : labels.selectColumn, () => {
             toggleColumnFromMenu(contextMenu.columnIndex);
-          }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "select-column" }) });
+          }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "select-column" }) });
         }
         return null;
       });
@@ -5089,7 +5312,7 @@ function TableInner({
           } catch {
             showToast("error", labels.copyError);
           }
-        }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "copy" }) });
+        }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "copy" }) });
         if (item === "annotation") return renderAnnotationControls(rangeCells);
         if (item === "undo") {
           const changedCells = rangeCells.flatMap((cell) => {
@@ -5116,7 +5339,7 @@ function TableInner({
               });
               onCellChange?.({ ...cell, row, previousValue, value });
             });
-          }, override, { disabled: !onCellChange, icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "undo" }) });
+          }, override, { disabled: !onCellChange, icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "undo" }) });
         }
         if (item === "clear") {
           const hasClearableCell = rangeCells.some((cell) => {
@@ -5133,7 +5356,7 @@ function TableInner({
               markCellEdited(cell, row[column.dataIndex], "");
               onCellChange?.({ ...cell, row, previousValue: row[column.dataIndex], value: "" });
             });
-          }, override, { disabled: !onCellChange, icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "clear" }) });
+          }, override, { disabled: !onCellChange, icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "clear" }) });
         }
         return null;
       });
@@ -5151,7 +5374,7 @@ function TableInner({
       const affectedRows = selectedIndices.includes(cell.rowIndex) ? selectedIndices : [cell.rowIndex];
       const cellContext = { ...cell, row, column, value: dataIndex === void 0 ? void 0 : row[dataIndex] };
       return renderConfiguredContextMenu(resolveContextMenuSection(customContextMenuConfig?.cell, DEFAULT_CELL_CONTEXT_MENU), cellContext, (item, override) => {
-        if (item === "edit") return renderContextMenuButton("cell-edit", cellContext, labels.edit, () => beginEdit(cell), override, { disabled: !isCellEditable(cell), icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "edit" }) });
+        if (item === "edit") return renderContextMenuButton("cell-edit", cellContext, labels.edit, () => beginEdit(cell), override, { disabled: !isCellEditable(cell), icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "edit" }) });
         if (item === "copy") return renderContextMenuButton("cell-copy", cellContext, labels.copyContent, async () => {
           try {
             await navigator.clipboard.writeText(getCellLabel(cell.rowIndex, cell.columnIndex));
@@ -5159,20 +5382,20 @@ function TableInner({
           } catch {
             showToast("error", labels.copyError);
           }
-        }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "copy" }) });
+        }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "copy" }) });
         if (item === "undo") return renderContextMenuButton("cell-undo", cellContext, labels.undoChange, () => {
           if (dataIndex === void 0 || originalValue === void 0) return;
           const previousValue = row[dataIndex];
           const value = typeof previousValue === "number" && originalValue !== "" ? Number(originalValue) : originalValue;
           setConfirmAction({ type: "undo", cell, row, dataIndex, previousValue, value });
-        }, override, { disabled: !onCellChange || dataIndex === void 0 || originalValue === void 0, icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "undo" }) });
+        }, override, { disabled: !onCellChange || dataIndex === void 0 || originalValue === void 0, icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "undo" }) });
         if (item === "clear") {
           if (dataIndex === void 0 || isEmptyCellValue(row[dataIndex])) return null;
           return renderContextMenuButton("cell-clear", cellContext, labels.clearContent, () => {
             if (dataIndex === void 0) return;
             const previousValue = row[dataIndex];
             setConfirmAction({ type: "clear", cell, row, dataIndex, previousValue });
-          }, override, { disabled: !onCellChange || dataIndex === void 0, danger: true, icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "clear" }) });
+          }, override, { disabled: !onCellChange || dataIndex === void 0, danger: true, icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "clear" }) });
         }
         if (item === "annotation") return renderAnnotationControls([cell]);
         if (item === "select-row") {
@@ -5182,56 +5405,56 @@ function TableInner({
             setSelection(null);
             if (selectedRowKeySet.has(cell.rowKey)) setRowKeys(rowKeys.filter((key) => key !== cell.rowKey));
             else setRowKeys(rowSelectionMode === "single" ? [cell.rowKey] : [...rowKeys, cell.rowKey]);
-          }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "select-row" }) });
+          }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "select-row" }) });
         }
         if (item === "select-column") {
           if (!columnSelection) return null;
           return renderContextMenuButton("cell-select-column", cellContext, selectedColumnKeySet.has(cell.columnKey) ? labels.deselectColumn : labels.selectColumn, () => {
             toggleColumnFromMenu(cell.columnIndex);
-          }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "select-column" }) });
+          }, override, { icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "select-column" }) });
         }
-        if (item === "insert-above") return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-context-insert", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("button", { type: "button", role: "menuitem", disabled: !onInsertRows, onClick: () => {
+        if (item === "insert-above") return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-context-insert", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("button", { type: "button", role: "menuitem", disabled: !onInsertRows, onClick: () => {
             void insertRowsOptimistically(cell, "before", insertCounts.before);
           }, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "insert-above" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-label", children: labels.insertAbove })
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "insert-above" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-label", children: labels.insertAbove })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("input", { "aria-label": labels.insertAboveCount, type: "number", min: 1, max: 5, step: 1, value: insertCounts.before, onChange: (event) => setInsertCounts((current) => ({ ...current, before: Math.max(1, Math.min(5, Math.floor(Number(event.target.value) || 1))) })) }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: labels.rowUnit })
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("input", { "aria-label": labels.insertAboveCount, type: "number", min: 1, max: 5, step: 1, value: insertCounts.before, onChange: (event) => setInsertCounts((current) => ({ ...current, before: Math.max(1, Math.min(5, Math.floor(Number(event.target.value) || 1))) })) }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: labels.rowUnit })
         ] });
-        if (item === "insert-below") return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-context-insert", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("button", { type: "button", role: "menuitem", disabled: !onInsertRows, onClick: () => {
+        if (item === "insert-below") return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-context-insert", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("button", { type: "button", role: "menuitem", disabled: !onInsertRows, onClick: () => {
             void insertRowsOptimistically(cell, "after", insertCounts.after);
           }, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "insert-below" }) }),
-            /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "rvg-context-menu-label", children: labels.insertBelow })
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "insert-below" }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "rvg-context-menu-label", children: labels.insertBelow })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("input", { "aria-label": labels.insertBelowCount, type: "number", min: 1, max: 5, step: 1, value: insertCounts.after, onChange: (event) => setInsertCounts((current) => ({ ...current, after: Math.max(1, Math.min(5, Math.floor(Number(event.target.value) || 1))) })) }),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { children: labels.rowUnit })
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("input", { "aria-label": labels.insertBelowCount, type: "number", min: 1, max: 5, step: 1, value: insertCounts.after, onChange: (event) => setInsertCounts((current) => ({ ...current, after: Math.max(1, Math.min(5, Math.floor(Number(event.target.value) || 1))) })) }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: labels.rowUnit })
         ] });
         if (item === "move-up") {
           if (!rowDraggable) return null;
-          return renderContextMenuButton("cell-move-up", cellContext, labels.moveUp, () => applyRowOrder(cell.rowIndex, cell.rowIndex - 1), override, { disabled: cell.rowIndex === 0, icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "move-up" }) });
+          return renderContextMenuButton("cell-move-up", cellContext, labels.moveUp, () => applyRowOrder(cell.rowIndex, cell.rowIndex - 1), override, { disabled: cell.rowIndex === 0, icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "move-up" }) });
         }
         if (item === "move-down") {
           if (!rowDraggable) return null;
-          return renderContextMenuButton("cell-move-down", cellContext, labels.moveDown, () => applyRowOrder(cell.rowIndex, cell.rowIndex + 1), override, { disabled: cell.rowIndex === rows.length - 1, icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "move-down" }) });
+          return renderContextMenuButton("cell-move-down", cellContext, labels.moveDown, () => applyRowOrder(cell.rowIndex, cell.rowIndex + 1), override, { disabled: cell.rowIndex === rows.length - 1, icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "move-down" }) });
         }
-        if (item === "delete-row") return renderContextMenuButton("cell-delete-row", cellContext, labels.deleteRow, () => setConfirmAction({ type: "delete-row", rows: affectedRows.map((rowIndex) => ({ rowIndex, row: rows[rowIndex] })) }), override, { disabled: !onDeleteRows, danger: true, icon: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ContextMenuIcon, { type: "delete" }) });
+        if (item === "delete-row") return renderContextMenuButton("cell-delete-row", cellContext, labels.deleteRow, () => setConfirmAction({ type: "delete-row", rows: affectedRows.map((rowIndex) => ({ rowIndex, row: rows[rowIndex] })) }), override, { disabled: !onDeleteRows, danger: true, icon: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(ContextMenuIcon, { type: "delete" }) });
         return null;
       });
     })() }),
-    confirmAction && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-confirm-backdrop", role: "presentation", onMouseDown: (event) => {
+    confirmAction && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-confirm-backdrop", role: "presentation", onMouseDown: (event) => {
       if (!confirmLoading && event.target === event.currentTarget) setConfirmAction(null);
-    }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-confirm", role: "alertdialog", "aria-modal": "true", "aria-labelledby": "rvg-delete-title", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("strong", { id: "rvg-delete-title", children: confirmAction.type === "undo" ? labels.undoConfirmTitle : confirmAction.type === "clear" ? labels.clearConfirmTitle : labels.deleteConfirmTitle }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { children: confirmAction.type === "undo" ? labels.undoConfirmDescription : confirmAction.type === "clear" ? labels.clearConfirmDescription : labels.deleteConfirmDescription(confirmAction.rows.length) }),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-confirm-actions", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", disabled: confirmLoading, onClick: () => setConfirmAction(null), children: labels.cancel }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("button", { type: "button", className: "rvg-confirm-danger", disabled: confirmLoading, autoFocus: true, onClick: () => {
+    }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-confirm", role: "alertdialog", "aria-modal": "true", "aria-labelledby": "rvg-delete-title", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("strong", { id: "rvg-delete-title", children: confirmAction.type === "undo" ? labels.undoConfirmTitle : confirmAction.type === "clear" ? labels.clearConfirmTitle : labels.deleteConfirmTitle }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { children: confirmAction.type === "undo" ? labels.undoConfirmDescription : confirmAction.type === "clear" ? labels.clearConfirmDescription : labels.deleteConfirmDescription(confirmAction.rows.length) }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-confirm-actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { type: "button", disabled: confirmLoading, onClick: () => setConfirmAction(null), children: labels.cancel }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("button", { type: "button", className: "rvg-confirm-danger", disabled: confirmLoading, autoFocus: true, onClick: () => {
           if (confirmLoading) return;
-          (0, import_react_dom.flushSync)(() => setConfirmLoading(true));
+          (0, import_react_dom2.flushSync)(() => setConfirmLoading(true));
           window.requestAnimationFrame(async () => {
             try {
               if (confirmAction.type === "undo") {
@@ -5282,13 +5505,13 @@ function TableInner({
             }
           });
         }, children: [
-          confirmLoading && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LoadingSpinnerIcon, {}),
+          confirmLoading && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(LoadingSpinnerIcon, {}),
           confirmAction.type === "undo" ? labels.undoChange : confirmAction.type === "clear" ? labels.clear : labels.delete
         ] })
       ] })
     ] }) }),
-    toast && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: `rvg-toast is-${toast.type}`, role: "status", children: toast.message }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    toast && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: `rvg-toast is-${toast.type}`, role: "status", children: toast.message }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "div",
       {
         ref: verticalScrollbarRef,
@@ -5299,10 +5522,10 @@ function TableInner({
         onPointerMove: handleVerticalScrollbarPointerMove,
         onPointerUp: handleVerticalScrollbarPointerUp,
         onPointerCancel: handleVerticalScrollbarPointerUp,
-        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref: verticalScrollbarThumbRef, className: "rvg-vertical-scrollbar-thumb" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: verticalScrollbarThumbRef, className: "rvg-vertical-scrollbar-thumb" })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "div",
       {
         ref: horizontalScrollbarRef,
@@ -5313,11 +5536,11 @@ function TableInner({
         onPointerMove: handleHorizontalScrollbarPointerMove,
         onPointerUp: handleHorizontalScrollbarPointerUp,
         onPointerCancel: handleHorizontalScrollbarPointerUp,
-        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref: horizontalScrollbarThumbRef, className: "rvg-horizontal-scrollbar-thumb" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: horizontalScrollbarThumbRef, className: "rvg-horizontal-scrollbar-thumb" })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref: dragGuideRef, className: "rvg-column-guide" }),
-    columnDragPreview && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: dragGuideRef, className: "rvg-column-guide" }),
+    columnDragPreview && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       "div",
       {
         "aria-hidden": "true",
@@ -5333,7 +5556,7 @@ function TableInner({
           backgroundSize: `${viewport.width}px ${renderHeight}px`
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
             "div",
             {
               className: `rvg-column-drag-preview-header${selectedColumnKeySet.has(columns[columnDragPreview.sourceIndex]?.key) ? " is-axis-selected" : ""}`,
@@ -5346,7 +5569,7 @@ function TableInner({
           ),
           rows.slice(domRange.rowStart, domRange.rowEnd).map((_row, visibleRowOffset) => {
             const rowIndex = domRange.rowStart + visibleRowOffset;
-            return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
               "div",
               {
                 className: `rvg-column-drag-preview-cell${selectedColumnKeySet.has(columns[columnDragPreview.sourceIndex]?.key) ? " is-axis-selected" : ""}${hasStripedRows && rowIndex % 2 === 1 ? " is-striped" : ""}`,
@@ -5359,16 +5582,16 @@ function TableInner({
         ]
       }
     ),
-    resizeGuideX !== null && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    resizeGuideX !== null && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "div",
       {
         className: "rvg-column-guide is-resizing",
         style: { display: "block", top: resizeGuideTop, transform: `translateX(${Math.round(resizeGuideX)}px)` }
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { ref: rowDragGuideRef, className: "rvg-row-guide" }),
-    filterEditor && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { ref: filterRef, className: "rvg-filter", style: { left: filterEditor.left, top: filterEditor.top }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ref: rowDragGuideRef, className: "rvg-row-guide" }),
+    filterEditor && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { ref: filterRef, className: "rvg-filter", style: { left: filterEditor.left, top: filterEditor.top }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
         "input",
         {
           autoFocus: true,
@@ -5392,15 +5615,15 @@ function TableInner({
           }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-filter-actions", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", onClick: () => {
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-filter-actions", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { type: "button", onClick: () => {
           const key = columns[filterEditor.columnIndex].key;
           const next = { ...filterValues };
           delete next[key];
           setFilterValues(next);
           setFilterEditor(null);
         }, children: labels.reset }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { type: "button", className: "rvg-filter-confirm", onClick: () => {
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { type: "button", className: "rvg-filter-confirm", onClick: () => {
           const key = columns[filterEditor.columnIndex].key;
           const next = { ...filterValues };
           if (filterEditor.draft) next[key] = filterEditor.draft;
@@ -5411,31 +5634,31 @@ function TableInner({
       ] })
     ] }),
     renderEditor(),
-    rows.length === 0 && !loading && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-empty", style: { top: bodyTop }, children: emptyContent ?? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(DefaultEmptyState, { label: labels.empty }) }),
-    loading && hasCustomLoading && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-custom-loading", "aria-label": labels.refreshing, children: loadingContent }),
-    loading && !hasCustomLoading && !hasCompletedLoadRef.current && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rvg-initial-loading", style: { top: headerHeight }, "aria-label": labels.initialLoading, children: [
-      Array.from({ length: Math.ceil((renderHeight - headerHeight) / rowHeight) }, (_, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-loading-row", style: { height: rowHeight }, children: columns.map((column, columnIndex) => {
+    rows.length === 0 && !loading && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-empty", style: { top: bodyTop }, children: emptyContent ?? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(DefaultEmptyState, { label: labels.empty }) }),
+    loading && hasCustomLoading && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-custom-loading", "aria-label": labels.refreshing, children: loadingContent }),
+    loading && !hasCustomLoading && !hasCompletedLoadRef.current && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "rvg-initial-loading", style: { top: headerHeight }, "aria-label": labels.initialLoading, children: [
+      Array.from({ length: Math.ceil((renderHeight - headerHeight) / rowHeight) }, (_, rowIndex) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-loading-row", style: { height: rowHeight }, children: columns.map((column, columnIndex) => {
         const left = getDisplayedColumnLeft(columnIndex);
         const columnWidth = metrics[columnIndex].width;
         if (left + columnWidth <= 0 || left >= viewport.width) return null;
         const isUtility = column.rowSelection || column.rowDragHandle || column.rowNumber;
-        return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
           "span",
           {
             className: column.rowDragHandle ? "is-utility is-drag" : column.rowSelection ? "is-utility is-selection" : void 0,
             style: { left, width: columnWidth, zIndex: column.fixed ? 1 : 0, background: column.fixed ? "#fff" : void 0, justifyContent: column.align === "right" ? "flex-end" : column.align === "center" || isUtility ? "center" : "flex-start" },
-            children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("i", { style: { width: isUtility ? 14 : `${38 + (rowIndex * 17 + columnIndex * 13) % 43}%`, animationDelay: `${(rowIndex * columns.length + columnIndex) * 24}ms` } })
+            children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("i", { style: { width: isUtility ? 14 : `${38 + (rowIndex * 17 + columnIndex * 13) % 43}%`, animationDelay: `${(rowIndex * columns.length + columnIndex) * 24}ms` } })
           },
           column.key
         );
       }) }, rowIndex)),
-      fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-loading-fixed-shadow is-left", style: { left: fixedWidth } }),
-      rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-loading-fixed-shadow is-right", style: { right: rightFixedWidth } })
+      fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-loading-fixed-shadow is-left", style: { left: fixedWidth } }),
+      rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-loading-fixed-shadow is-right", style: { right: rightFixedWidth } })
     ] }),
-    loading && !hasCustomLoading && hasCompletedLoadRef.current && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "rvg-refresh-loading", "aria-label": labels.refreshing, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(LoadingSpinnerIcon, {}) })
+    loading && !hasCustomLoading && hasCompletedLoadRef.current && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "rvg-refresh-loading", "aria-label": labels.refreshing, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(LoadingSpinnerIcon, {}) })
   ] });
 }
-var Table = (0, import_react5.forwardRef)(TableInner);
+var Table = (0, import_react8.forwardRef)(TableInner);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Table,