@lensui/lens-table 0.1.64 → 0.1.66

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  // src/Table.tsx
2
- import { forwardRef, useImperativeHandle, Fragment as Fragment2, useCallback as useCallback2, useEffect as useEffect2, useLayoutEffect as useLayoutEffect2, useMemo, useRef as useRef2, useState as useState4 } from "react";
2
+ import { forwardRef, useImperativeHandle, Fragment as Fragment2, useCallback as useCallback2, useEffect as useEffect3, useLayoutEffect as useLayoutEffect3, useMemo as useMemo2, useRef as useRef4, useState as useState6 } from "react";
3
3
  import { flushSync } from "react-dom";
4
4
 
5
5
  // src/components/EmptyState.tsx
@@ -199,6 +199,7 @@ function DefaultEmptyState({ label = ZH_CN_GRID_LABELS.empty }) {
199
199
  // src/components/editors/ChoiceEditor.tsx
200
200
  import { Portal } from "@ark-ui/react/portal";
201
201
  import { Select, createListCollection } from "@ark-ui/react/select";
202
+ import { useEffect, useId as useId2, useLayoutEffect, useMemo, useRef, useState } from "react";
202
203
 
203
204
  // src/icons/gridIcons.tsx
204
205
  import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
@@ -231,6 +232,13 @@ function ChoiceChevronIcon() {
231
232
  function ChoiceCheckIcon() {
232
233
  return /* @__PURE__ */ jsx2("svg", { className: "rvg-choice-check", viewBox: "0 0 16 16", "aria-hidden": "true", children: /* @__PURE__ */ jsx2("path", { d: "m3.5 8 2.6 2.6L12.5 4" }) });
233
234
  }
235
+ function MultilineEditorIcon() {
236
+ return /* @__PURE__ */ jsxs2("svg", { className: "rvg-multiline-icon", viewBox: "0 0 16 16", "aria-hidden": "true", children: [
237
+ /* @__PURE__ */ jsx2("circle", { cx: "3.5", cy: "8", r: "1" }),
238
+ /* @__PURE__ */ jsx2("circle", { cx: "8", cy: "8", r: "1" }),
239
+ /* @__PURE__ */ jsx2("circle", { cx: "12.5", cy: "8", r: "1" })
240
+ ] });
241
+ }
234
242
  function HeaderDragIcon({ className, style }) {
235
243
  return /* @__PURE__ */ jsxs2("svg", { className, style, viewBox: "0 0 14 14", "aria-hidden": "true", children: [
236
244
  /* @__PURE__ */ jsx2("circle", { cx: "7", cy: "2.5", r: "1.25" }),
@@ -294,12 +302,126 @@ function LoadingSpinnerIcon() {
294
302
 
295
303
  // src/components/editors/ChoiceEditor.tsx
296
304
  import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
297
- function ChoiceEditor({ value, options, style, labels, onChange, onCommit, onCancel }) {
298
- const collection = createListCollection({
299
- items: options,
300
- itemToValue: (item) => item.value,
301
- itemToString: (item) => item.label
302
- });
305
+ function SearchableChoiceEditor({ value, options, allowCustomValue, maxDropdownHeight, style, labels, onChange, onCommit, onCancel }) {
306
+ const editorRef = useRef(null);
307
+ const popupRef = useRef(null);
308
+ const originalValueRef = useRef(value);
309
+ const listboxId = useId2();
310
+ const originalValue = originalValueRef.current;
311
+ const [inputValue, setInputValue] = useState(value);
312
+ const [activeIndex, setActiveIndex] = useState(0);
313
+ const [popupStyle, setPopupStyle] = useState({});
314
+ const filteredOptions = useMemo(() => {
315
+ const query = inputValue.trim().toLocaleLowerCase();
316
+ if (!query || query === originalValue.toLocaleLowerCase()) return options;
317
+ return options.filter((option) => option.label.toLocaleLowerCase().includes(query) || option.value.toLocaleLowerCase().includes(query));
318
+ }, [inputValue, options, originalValue]);
319
+ useLayoutEffect(() => {
320
+ const positionPopup = () => {
321
+ const rect = editorRef.current?.getBoundingClientRect();
322
+ if (!rect) return;
323
+ const availableBelow = window.innerHeight - rect.bottom - 8;
324
+ const availableAbove = rect.top - 8;
325
+ if (availableBelow < 120 && availableAbove > availableBelow) {
326
+ setPopupStyle({
327
+ position: "fixed",
328
+ bottom: window.innerHeight - rect.top + 4,
329
+ left: rect.left,
330
+ width: rect.width,
331
+ maxHeight: Math.min(maxDropdownHeight, availableAbove)
332
+ });
333
+ return;
334
+ }
335
+ setPopupStyle({
336
+ position: "fixed",
337
+ top: rect.bottom + 4,
338
+ left: rect.left,
339
+ width: rect.width,
340
+ maxHeight: Math.min(maxDropdownHeight, Math.max(80, availableBelow))
341
+ });
342
+ };
343
+ positionPopup();
344
+ window.addEventListener("resize", positionPopup);
345
+ window.addEventListener("scroll", positionPopup, true);
346
+ return () => {
347
+ window.removeEventListener("resize", positionPopup);
348
+ window.removeEventListener("scroll", positionPopup, true);
349
+ };
350
+ }, [maxDropdownHeight]);
351
+ useEffect(() => {
352
+ const handleOutsidePointer = (event) => {
353
+ const target = event.target;
354
+ if (!(target instanceof Node)) return;
355
+ if (editorRef.current?.contains(target) || popupRef.current?.contains(target)) return;
356
+ onCommit(allowCustomValue ? inputValue || originalValue : originalValue);
357
+ };
358
+ document.addEventListener("pointerdown", handleOutsidePointer, true);
359
+ return () => document.removeEventListener("pointerdown", handleOutsidePointer, true);
360
+ }, [allowCustomValue, inputValue, onCommit, originalValue]);
361
+ const selectOption = (option) => {
362
+ onChange(option.value);
363
+ onCommit(option.value);
364
+ };
365
+ const handleKeyDown = (event) => {
366
+ event.stopPropagation();
367
+ if (event.key === "Escape") onCancel();
368
+ if (event.key === "ArrowDown") {
369
+ event.preventDefault();
370
+ setActiveIndex((index) => Math.min(filteredOptions.length - 1, index + 1));
371
+ }
372
+ if (event.key === "ArrowUp") {
373
+ event.preventDefault();
374
+ setActiveIndex((index) => Math.max(0, index - 1));
375
+ }
376
+ if (event.key === "Enter") {
377
+ event.preventDefault();
378
+ const option = filteredOptions[activeIndex];
379
+ if (option) selectOption(option);
380
+ else if (allowCustomValue) onCommit(inputValue || originalValue);
381
+ }
382
+ };
383
+ return /* @__PURE__ */ jsxs3("div", { ref: editorRef, className: "rvg-choice-editor rvg-searchable-choice-editor", style, children: [
384
+ /* @__PURE__ */ jsx3(
385
+ "input",
386
+ {
387
+ className: inputValue === originalValue ? "is-pristine" : void 0,
388
+ value: inputValue,
389
+ autoFocus: true,
390
+ "aria-label": labels.search,
391
+ "aria-controls": listboxId,
392
+ onFocus: (event) => event.currentTarget.select(),
393
+ onChange: (event) => {
394
+ setInputValue(event.target.value);
395
+ onChange(event.target.value);
396
+ setActiveIndex(0);
397
+ },
398
+ onKeyDown: handleKeyDown
399
+ }
400
+ ),
401
+ /* @__PURE__ */ jsx3("span", { className: "rvg-searchable-choice-indicator", children: /* @__PURE__ */ jsx3(ChoiceChevronIcon, {}) }),
402
+ /* @__PURE__ */ jsx3(Portal, { children: /* @__PURE__ */ jsx3("div", { ref: popupRef, id: listboxId, role: "listbox", className: "rvg-choice-content rvg-searchable-choice-content", style: popupStyle, children: filteredOptions.map((option, index) => /* @__PURE__ */ jsxs3(
403
+ "button",
404
+ {
405
+ type: "button",
406
+ role: "option",
407
+ "aria-selected": option.value === originalValue,
408
+ className: `rvg-choice-item${index === activeIndex ? " is-active" : ""}${option.value === originalValue ? " is-selected" : ""}`,
409
+ onPointerDown: (event) => event.preventDefault(),
410
+ onMouseEnter: () => setActiveIndex(index),
411
+ onClick: () => selectOption(option),
412
+ children: [
413
+ /* @__PURE__ */ jsx3("span", { children: option.label }),
414
+ option.value === originalValue && /* @__PURE__ */ jsx3(ChoiceCheckIcon, {})
415
+ ]
416
+ },
417
+ option.value
418
+ )) }) })
419
+ ] });
420
+ }
421
+ function ChoiceEditor(props) {
422
+ const { value, options, searchable = false, maxDropdownHeight = 240, style, labels, onChange, onCommit, onCancel } = props;
423
+ if (searchable) return /* @__PURE__ */ jsx3(SearchableChoiceEditor, { ...props, maxDropdownHeight });
424
+ const collection = createListCollection({ items: options, itemToValue: (item) => item.value, itemToString: (item) => item.label });
303
425
  return /* @__PURE__ */ jsxs3(
304
426
  Select.Root,
305
427
  {
@@ -330,7 +452,7 @@ function ChoiceEditor({ value, options, style, labels, onChange, onCommit, onCan
330
452
  /* @__PURE__ */ jsx3(Select.ValueText, { placeholder: labels.choose }),
331
453
  /* @__PURE__ */ jsx3(Select.Indicator, { children: /* @__PURE__ */ jsx3(ChoiceChevronIcon, {}) })
332
454
  ] }) }),
333
- /* @__PURE__ */ jsx3(Portal, { children: /* @__PURE__ */ jsx3(Select.Positioner, { children: /* @__PURE__ */ jsx3(Select.Content, { className: "rvg-choice-content", children: options.map((option) => /* @__PURE__ */ jsxs3(Select.Item, { className: "rvg-choice-item", item: option, children: [
455
+ /* @__PURE__ */ jsx3(Portal, { children: /* @__PURE__ */ jsx3(Select.Positioner, { children: /* @__PURE__ */ jsx3(Select.Content, { className: "rvg-choice-content", style: { maxHeight: maxDropdownHeight, overflowY: "auto" }, children: options.map((option) => /* @__PURE__ */ jsxs3(Select.Item, { className: "rvg-choice-item", item: option, children: [
334
456
  /* @__PURE__ */ jsx3(Select.ItemText, { children: option.label }),
335
457
  /* @__PURE__ */ jsx3(Select.ItemIndicator, { children: /* @__PURE__ */ jsx3(ChoiceCheckIcon, {}) })
336
458
  ] }, option.value)) }) }) }),
@@ -341,7 +463,7 @@ function ChoiceEditor({ value, options, style, labels, onChange, onCommit, onCan
341
463
  }
342
464
 
343
465
  // src/components/editors/DateEditor.tsx
344
- import { useState as useState2 } from "react";
466
+ import { useState as useState3 } from "react";
345
467
  import { DatePicker } from "@ark-ui/react/date-picker";
346
468
  import { Portal as Portal2 } from "@ark-ui/react/portal";
347
469
  import { parseDate as parseDate2 } from "@internationalized/date";
@@ -388,22 +510,22 @@ function timeFormatHasSeconds(format, value) {
388
510
  }
389
511
 
390
512
  // src/components/editors/TimeEditors.tsx
391
- import { useEffect, useLayoutEffect, useRef, useState } from "react";
513
+ import { useEffect as useEffect2, useLayoutEffect as useLayoutEffect2, useRef as useRef2, useState as useState2 } from "react";
392
514
  import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
393
515
  function CompactTimeEditor({ value, range, showSeconds, style, labels, onChange, onCommit, onCancel }) {
394
516
  const values = range ? value.split(" ~ ") : [value];
395
- const [dropdownOpen, setDropdownOpen] = useState(true);
396
- const optionRefs = useRef([[], []]);
397
- const editorRef = useRef(null);
398
- const hasPositionedTimeRef = useRef(false);
399
- useEffect(() => {
517
+ const [dropdownOpen, setDropdownOpen] = useState2(true);
518
+ const optionRefs = useRef2([[], []]);
519
+ const editorRef = useRef2(null);
520
+ const hasPositionedTimeRef = useRef2(false);
521
+ useEffect2(() => {
400
522
  const closeOnOutsidePointer = (event) => {
401
523
  if (!editorRef.current?.contains(event.target)) setDropdownOpen(false);
402
524
  };
403
525
  document.addEventListener("pointerdown", closeOnOutsidePointer, true);
404
526
  return () => document.removeEventListener("pointerdown", closeOnOutsidePointer, true);
405
527
  }, []);
406
- useLayoutEffect(() => {
528
+ useLayoutEffect2(() => {
407
529
  if (!dropdownOpen) return;
408
530
  const behavior = hasPositionedTimeRef.current ? "smooth" : "auto";
409
531
  values.forEach((time, index) => {
@@ -478,14 +600,14 @@ function CompactTimeEditor({ value, range, showSeconds, style, labels, onChange,
478
600
  ] });
479
601
  }
480
602
  function DateTimePanel({ values, labels, showSeconds, onChange }) {
481
- const [activeIndex, setActiveIndex] = useState(0);
603
+ const [activeIndex, setActiveIndex] = useState2(0);
482
604
  const activeValue = values[activeIndex] ?? "";
483
605
  const [, hour = "00", minute = "00", second = "00"] = activeValue.match(/[T ](\d{2}):(\d{2})(?::(\d{2}))?/) ?? [];
484
- const hoursRef = useRef(null);
485
- const minutesRef = useRef(null);
486
- const secondsRef = useRef(null);
487
- const positionedRef = useRef(false);
488
- useLayoutEffect(() => {
606
+ const hoursRef = useRef2(null);
607
+ const minutesRef = useRef2(null);
608
+ const secondsRef = useRef2(null);
609
+ const positionedRef = useRef2(false);
610
+ useLayoutEffect2(() => {
489
611
  const behavior = positionedRef.current ? "smooth" : "auto";
490
612
  hoursRef.current?.scrollTo({ top: Number(hour) * 28, behavior });
491
613
  minutesRef.current?.scrollTo({ top: Number(minute) * 28, behavior });
@@ -520,7 +642,7 @@ function DateTimePanel({ values, labels, showSeconds, onChange }) {
520
642
  // src/components/editors/DateEditor.tsx
521
643
  import { Fragment, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
522
644
  function DateEditor({ editor, value: draft, style, locale, labels, onChange, onCommit, onCancel }) {
523
- const [rangeHoverValue, setRangeHoverValue] = useState2();
645
+ const [rangeHoverValue, setRangeHoverValue] = useState3();
524
646
  const editorType = editor.type;
525
647
  const isRange = editorType === "date-range" || editorType === "date-time-range";
526
648
  const isYear = editorType === "year";
@@ -663,11 +785,21 @@ function DateEditor({ editor, value: draft, style, locale, labels, onChange, onC
663
785
  }
664
786
 
665
787
  // src/components/editors/TextEditor.tsx
788
+ import { useRef as useRef3 } from "react";
666
789
  import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
667
- function TextEditor({ value, type, style, labels, onChange, onCommit, onCancel }) {
790
+ function TextEditor({ value, type, min, max, integer = false, style, labels, onChange, onCommit, onCancel }) {
791
+ const originalValueRef = useRef3(value);
792
+ const normalizeNumber = (draft) => {
793
+ if (draft.trim() === "") return "";
794
+ const parsed = Number(draft);
795
+ if (!Number.isFinite(parsed)) return originalValueRef.current;
796
+ const integral = integer ? Math.trunc(parsed) : parsed;
797
+ return String(Math.min(max ?? Infinity, Math.max(min ?? -Infinity, integral)));
798
+ };
799
+ const commitValue = () => onCommit(type === "number" ? normalizeNumber(value) : value);
668
800
  const handleKeyDown = (event) => {
669
801
  event.stopPropagation();
670
- if (event.key === "Enter") onCommit();
802
+ if (event.key === "Enter") commitValue();
671
803
  if (event.key === "Escape") onCancel();
672
804
  };
673
805
  return /* @__PURE__ */ jsxs6("div", { className: "rvg-native-editor has-clear", style, children: [
@@ -675,11 +807,19 @@ function TextEditor({ value, type, style, labels, onChange, onCommit, onCancel }
675
807
  "input",
676
808
  {
677
809
  type,
810
+ min: type === "number" ? min : void 0,
811
+ max: type === "number" ? max : void 0,
812
+ step: type === "number" && integer ? 1 : void 0,
813
+ inputMode: type === "number" ? "numeric" : void 0,
678
814
  style: { font: "var(--rvg-font-size-body) Inter, ui-sans-serif, system-ui, sans-serif", textAlign: style.textAlign },
679
815
  value,
680
816
  autoFocus: true,
681
- onChange: (event) => onChange(event.target.value),
682
- onBlur: () => onCommit(),
817
+ onChange: (event) => {
818
+ const next = event.target.value;
819
+ if (type === "number" && integer && next !== "" && !/^-?\d+$/.test(next)) return;
820
+ onChange(next);
821
+ },
822
+ onBlur: commitValue,
683
823
  onKeyDown: handleKeyDown
684
824
  }
685
825
  ),
@@ -703,6 +843,66 @@ function TextEditor({ value, type, style, labels, onChange, onCommit, onCancel }
703
843
  ] });
704
844
  }
705
845
 
846
+ // src/components/editors/TextAreaEditor.tsx
847
+ import { useState as useState4 } from "react";
848
+ import { createPortal } from "react-dom";
849
+ import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
850
+ function TextAreaEditor({ value, title, maxLength, style, labels, onChange, onCommit, onCancel }) {
851
+ const [open, setOpen] = useState4(false);
852
+ const handleKeyDown = (event) => {
853
+ event.stopPropagation();
854
+ if (event.key === "Enter") onCommit(value);
855
+ if (event.key === "Escape") onCancel();
856
+ };
857
+ return /* @__PURE__ */ jsxs7("div", { className: "rvg-native-editor rvg-textarea-editor", style, children: [
858
+ /* @__PURE__ */ jsx7(
859
+ "input",
860
+ {
861
+ value,
862
+ autoFocus: true,
863
+ maxLength,
864
+ onChange: (event) => onChange(event.target.value),
865
+ onKeyDown: handleKeyDown
866
+ }
867
+ ),
868
+ /* @__PURE__ */ jsx7(
869
+ "button",
870
+ {
871
+ type: "button",
872
+ className: "rvg-textarea-trigger",
873
+ "aria-label": title,
874
+ onPointerDown: (event) => {
875
+ event.preventDefault();
876
+ event.stopPropagation();
877
+ },
878
+ onClick: () => setOpen(true),
879
+ children: /* @__PURE__ */ jsx7(MultilineEditorIcon, {})
880
+ }
881
+ ),
882
+ open && createPortal(
883
+ /* @__PURE__ */ jsx7("div", { className: "rvg-textarea-backdrop", role: "presentation", children: /* @__PURE__ */ jsxs7("section", { className: "rvg-textarea-dialog", role: "dialog", "aria-modal": "true", "aria-label": title, children: [
884
+ /* @__PURE__ */ jsx7("header", { children: title }),
885
+ /* @__PURE__ */ jsx7(
886
+ "textarea",
887
+ {
888
+ value,
889
+ autoFocus: true,
890
+ maxLength,
891
+ onChange: (event) => onChange(event.target.value),
892
+ onKeyDown: (event) => {
893
+ event.stopPropagation();
894
+ if ((event.metaKey || event.ctrlKey) && event.key === "Enter") onCommit(value);
895
+ if (event.key === "Escape") setOpen(false);
896
+ }
897
+ }
898
+ ),
899
+ /* @__PURE__ */ jsx7("footer", { children: /* @__PURE__ */ jsx7("button", { type: "button", onClick: () => onCommit(value), children: labels.confirm }) })
900
+ ] }) }),
901
+ document.body
902
+ )
903
+ ] });
904
+ }
905
+
706
906
  // src/icons/domIcons.ts
707
907
  function createRowDragHandleSvg() {
708
908
  const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
@@ -998,7 +1198,7 @@ function paintGrid(options) {
998
1198
  ctx.fillStyle = colors.insertedFill;
999
1199
  ctx.fillRect(x, y, cellWidth, cellHeight);
1000
1200
  }
1001
- const isSelectedCell = !column.rowDragHandle && !column.rowSelection && !column.rowNumber && selection?.rowIndex === rowIndex && selection.columnIndex === columnIndex && selection.rowKey === rowKey && selection.columnKey === column.key;
1201
+ const isSelectedCell = !column.rowDragHandle && !column.rowSelection && !column.rowNumber && column.suppressSelectionStyle !== true && selection?.rowIndex === rowIndex && selection.columnIndex === columnIndex && selection.rowKey === rowKey && selection.columnKey === column.key;
1002
1202
  const annotation = cellAnnotations.get(`${typeof rowKey}:${String(rowKey)}\0${column.key}`);
1003
1203
  const rawValue = column.dataIndex === void 0 ? void 0 : row[column.dataIndex];
1004
1204
  const cellStyle = column.cellStyle?.(rawValue, row, rowIndex);
@@ -1330,7 +1530,7 @@ function paintGrid(options) {
1330
1530
  }
1331
1531
  const selectedRow = selection ? rows[selection.rowIndex] : void 0;
1332
1532
  const hasValidSelection = Boolean(selection && selectedRow && getRowKey(selectedRow, selection.rowIndex) === selection.rowKey);
1333
- if (selection && hasValidSelection && !selectionRange && !rowDragPreview) {
1533
+ if (selection && hasValidSelection && !selectionRange && !rowDragPreview && columns[selection.columnIndex]?.suppressSelectionStyle !== true) {
1334
1534
  const metric = metrics[selection.columnIndex];
1335
1535
  if (metric) {
1336
1536
  const fixedSide = columns[selection.columnIndex].fixed;
@@ -1402,9 +1602,9 @@ function paintGrid(options) {
1402
1602
  }
1403
1603
 
1404
1604
  // src/hooks/useControllable.ts
1405
- import { useCallback, useState as useState3 } from "react";
1605
+ import { useCallback, useState as useState5 } from "react";
1406
1606
  function useControllableKeys(value, defaultValue, onChange) {
1407
- const [internal, setInternal] = useState3(defaultValue ?? []);
1607
+ const [internal, setInternal] = useState5(defaultValue ?? []);
1408
1608
  const keys = value === void 0 ? internal : value;
1409
1609
  const setKeys = useCallback((next) => {
1410
1610
  if (value === void 0) setInternal(next);
@@ -1413,7 +1613,7 @@ function useControllableKeys(value, defaultValue, onChange) {
1413
1613
  return [keys, setKeys];
1414
1614
  }
1415
1615
  function useControllableValue(value, defaultValue, onChange) {
1416
- const [internal, setInternal] = useState3(defaultValue ?? null);
1616
+ const [internal, setInternal] = useState5(defaultValue ?? null);
1417
1617
  const selected = value === void 0 ? internal : value;
1418
1618
  const setSelected = useCallback((next) => {
1419
1619
  if (value === void 0) setInternal(next);
@@ -1423,7 +1623,7 @@ function useControllableValue(value, defaultValue, onChange) {
1423
1623
  }
1424
1624
 
1425
1625
  // src/Table.tsx
1426
- import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
1626
+ import { Fragment as Fragment3, jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
1427
1627
  function resolveColumnDropIndex(sourceIndex, targetIndex, edge, columnCount) {
1428
1628
  const insertionIndex = targetIndex + (edge === "right" ? 1 : 0) - (sourceIndex < targetIndex ? 1 : 0);
1429
1629
  return Math.max(0, Math.min(columnCount - 1, insertionIndex));
@@ -1644,6 +1844,7 @@ function TableInner({
1644
1844
  onColumnsReorder,
1645
1845
  onColumnResize,
1646
1846
  rowDraggable = false,
1847
+ utilityColumnOrder = ["drag", "selection", "rowNumber"],
1647
1848
  onRowsReorder,
1648
1849
  onInsertRows,
1649
1850
  onDeleteRows,
@@ -1660,21 +1861,21 @@ function TableInner({
1660
1861
  style,
1661
1862
  ariaLabel = "Data grid"
1662
1863
  }, ref) {
1663
- const [sourceColumns, setSourceColumns] = useState4(columnProps);
1664
- useEffect2(() => {
1864
+ const [sourceColumns, setSourceColumns] = useState6(columnProps);
1865
+ useEffect3(() => {
1665
1866
  setSourceColumns((current) => reconcileColumns(current, columnProps));
1666
1867
  }, [columnProps]);
1667
1868
  const rowHeight = layout?.rowHeight ?? rowHeightProp ?? 36;
1668
1869
  const headerActionSize = Math.max(8, layout?.headerActionSize ?? 14);
1669
1870
  const headerActionSlotWidth = headerActionSize + 2;
1670
1871
  const baseHeaderHeight = layout?.headerHeight ?? headerHeightProp ?? 40;
1671
- const headerDepth = useMemo(() => Math.max(1, ...sourceColumns.map(getColumnDepth)), [sourceColumns]);
1672
- const { language, labels } = useMemo(() => resolveGridLocale(locale), [locale]);
1673
- const customHeaderContentRefs = useRef2(/* @__PURE__ */ new Map());
1674
- const customHeaderMeasurementsRef = useRef2(/* @__PURE__ */ new Map());
1675
- const [measuredHeaderRowHeights, setMeasuredHeaderRowHeights] = useState4([]);
1676
- const headerRowHeights = useMemo(() => Array.from({ length: headerDepth }, (_, level) => Math.max(baseHeaderHeight, measuredHeaderRowHeights[level] ?? 0)), [baseHeaderHeight, headerDepth, measuredHeaderRowHeights]);
1677
- const headerRowOffsets = useMemo(() => {
1872
+ const headerDepth = useMemo2(() => Math.max(1, ...sourceColumns.map(getColumnDepth)), [sourceColumns]);
1873
+ const { language, labels } = useMemo2(() => resolveGridLocale(locale), [locale]);
1874
+ const customHeaderContentRefs = useRef4(/* @__PURE__ */ new Map());
1875
+ const customHeaderMeasurementsRef = useRef4(/* @__PURE__ */ new Map());
1876
+ const [measuredHeaderRowHeights, setMeasuredHeaderRowHeights] = useState6([]);
1877
+ const headerRowHeights = useMemo2(() => Array.from({ length: headerDepth }, (_, level) => Math.max(baseHeaderHeight, measuredHeaderRowHeights[level] ?? 0)), [baseHeaderHeight, headerDepth, measuredHeaderRowHeights]);
1878
+ const headerRowOffsets = useMemo2(() => {
1678
1879
  const offsets = [];
1679
1880
  let top = 0;
1680
1881
  headerRowHeights.forEach((height2) => {
@@ -1705,37 +1906,37 @@ function TableInner({
1705
1906
  const summaryEmptyValue = typeof summary === "object" ? summary.emptyValue ?? "" : "";
1706
1907
  const contextMenuEnabled = contextMenuConfig !== false;
1707
1908
  const customContextMenuConfig = typeof contextMenuConfig === "object" ? contextMenuConfig : void 0;
1708
- const [resizedColumnWidths, setResizedColumnWidths] = useState4({});
1709
- const leafSourceColumns = useMemo(() => flattenDataColumns(sourceColumns), [sourceColumns]);
1710
- const sourceColumnWidthsRef = useRef2(new Map(leafSourceColumns.map((column) => [column.key, column.width])));
1909
+ const [resizedColumnWidths, setResizedColumnWidths] = useState6({});
1910
+ const leafSourceColumns = useMemo2(() => flattenDataColumns(sourceColumns), [sourceColumns]);
1911
+ const sourceColumnWidthsRef = useRef4(new Map(leafSourceColumns.map((column) => [column.key, column.width])));
1711
1912
  const showRowCheckbox = Boolean(rowSelection) && (typeof rowSelection !== "object" || rowSelection.showCheckbox !== false);
1712
1913
  const rowSelectionIndicator = typeof rowSelection === "object" ? rowSelection.indicator ?? "checkbox" : "checkbox";
1713
1914
  const rowSelectionColumnWidth = typeof rowSelection === "object" ? Math.max(24, rowSelection.columnWidth ?? 44) : 44;
1714
- useEffect2(() => {
1915
+ useEffect3(() => {
1715
1916
  if (!isProductionRuntime() && hasNestedFixedColumns(sourceColumns)) {
1716
1917
  console.warn("[Table] Multi-level headers only support fixed columns on top-level columns. Nested fixed values are ignored.");
1717
1918
  }
1718
1919
  }, [sourceColumns]);
1719
- const columns = useMemo(() => {
1920
+ const columns = useMemo2(() => {
1720
1921
  const utilityColumns = [];
1721
- if (rowDraggable) {
1722
- utilityColumns.push({ key: "__rvg_row_drag__", title: "", width: 36, align: "center", fixed: "left", rowDragHandle: true });
1723
- }
1724
- if (showRowCheckbox) {
1725
- utilityColumns.push({ key: "__rvg_row_selection__", title: "", width: rowSelectionColumnWidth, align: "center", fixed: "left", rowSelection: true, rowSelectionIndicator });
1726
- }
1727
- if (rowNumber) {
1728
- 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 });
1729
- }
1922
+ utilityColumnOrder.forEach((utilityColumn) => {
1923
+ if (utilityColumn === "drag" && rowDraggable) {
1924
+ utilityColumns.push({ key: "__rvg_row_drag__", title: "", width: 36, align: "center", fixed: "left", rowDragHandle: true });
1925
+ } else if (utilityColumn === "selection" && showRowCheckbox) {
1926
+ utilityColumns.push({ key: "__rvg_row_selection__", title: "", width: rowSelectionColumnWidth, align: "center", fixed: "left", rowSelection: true, rowSelectionIndicator });
1927
+ } else if (utilityColumn === "rowNumber" && rowNumber) {
1928
+ 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 });
1929
+ }
1930
+ });
1730
1931
  const dataColumns = leafSourceColumns.map((column) => {
1731
1932
  const resizedWidth = resizedColumnWidths[column.key];
1732
1933
  return resizedWidth === void 0 ? column : { ...column, width: resizedWidth };
1733
1934
  });
1734
1935
  return [...utilityColumns, ...dataColumns];
1735
- }, [leafSourceColumns, resizedColumnWidths, rowDraggable, rowNumber, rowSelectionColumnWidth, rowSelectionIndicator, showRowCheckbox, sourceRows.length]);
1936
+ }, [leafSourceColumns, resizedColumnWidths, rowDraggable, rowNumber, rowSelectionColumnWidth, rowSelectionIndicator, showRowCheckbox, sourceRows.length, utilityColumnOrder]);
1736
1937
  const utilityColumnCount = (rowDraggable ? 1 : 0) + (showRowCheckbox ? 1 : 0) + (rowNumber ? 1 : 0);
1737
- const headerCells = useMemo(() => buildHeaderCells(sourceColumns, utilityColumnCount, headerDepth), [headerDepth, sourceColumns, utilityColumnCount]);
1738
- const activeCustomHeaderLevels = useMemo(() => {
1938
+ const headerCells = useMemo2(() => buildHeaderCells(sourceColumns, utilityColumnCount, headerDepth), [headerDepth, sourceColumns, utilityColumnCount]);
1939
+ const activeCustomHeaderLevels = useMemo2(() => {
1739
1940
  const levels = /* @__PURE__ */ new Map();
1740
1941
  columns.forEach((column) => {
1741
1942
  if (column.renderHeader) levels.set(column.key, headerDepth - 1);
@@ -1745,52 +1946,52 @@ function TableInner({
1745
1946
  });
1746
1947
  return levels;
1747
1948
  }, [columns, headerCells, headerDepth]);
1748
- const canvasRef = useRef2(null);
1749
- const scrollerRef = useRef2(null);
1750
- const rootRef = useRef2(null);
1751
- const frameRef = useRef2(null);
1752
- const textFrameRef = useRef2(null);
1753
- const toastTimerRef = useRef2(null);
1754
- const headerTooltipTimerRef = useRef2(null);
1755
- const cellTooltipTimerRef = useRef2(null);
1756
- const pendingHeaderTooltipKeyRef = useRef2("");
1757
- const pendingCellTooltipKeyRef = useRef2("");
1758
- const clickedCellRef = useRef2(null);
1759
- const rowAnchorRef = useRef2(null);
1760
- const columnAnchorRef = useRef2(null);
1761
- const columnDragRef = useRef2(null);
1762
- const columnOrderDragRef = useRef2(null);
1763
- const columnOrderLongPressTimerRef = useRef2(null);
1764
- const dragGuideRef = useRef2(null);
1765
- const rowDragGuideRef = useRef2(null);
1766
- const selectionFocusRef = useRef2(null);
1767
- const selectionEdgeTargetRef = useRef2(null);
1768
- const verticalScrollbarRef = useRef2(null);
1769
- const verticalScrollbarThumbRef = useRef2(null);
1770
- const verticalScrollbarDragRef = useRef2(null);
1771
- const horizontalScrollbarRef = useRef2(null);
1772
- const horizontalScrollbarThumbRef = useRef2(null);
1773
- const horizontalScrollbarDragRef = useRef2(null);
1774
- const verticalScrollbarVisibilityTimerRef = useRef2(null);
1775
- const horizontalScrollbarVisibilityTimerRef = useRef2(null);
1776
- const rowByKeyRef = useRef2(/* @__PURE__ */ new Map());
1777
- const rowIndexByKeyRef = useRef2(/* @__PURE__ */ new Map());
1778
- const headerIconsRef = useRef2(null);
1779
- const scrollingHeaderIconsRef = useRef2(null);
1780
- const scrollingTextRef = useRef2(null);
1781
- const filterRef = useRef2(null);
1782
- const contextMenuRef = useRef2(null);
1783
- const suppressClickRef = useRef2(false);
1784
- const hasCompletedLoadRef = useRef2(!loading);
1785
- const validColumnDropRef = useRef2(null);
1786
- const hoveredHeaderActionRef = useRef2(null);
1787
- const hoveredRowIndexRef = useRef2(null);
1788
- const [viewport, setViewport] = useState4({ width: 0, height: typeof height === "number" ? height : FALLBACK_HEIGHT });
1789
- const [horizontalScrollbarHeight, setHorizontalScrollbarHeight] = useState4(0);
1790
- const [availableHeight, setAvailableHeight] = useState4(FALLBACK_HEIGHT);
1949
+ const canvasRef = useRef4(null);
1950
+ const scrollerRef = useRef4(null);
1951
+ const rootRef = useRef4(null);
1952
+ const frameRef = useRef4(null);
1953
+ const textFrameRef = useRef4(null);
1954
+ const toastTimerRef = useRef4(null);
1955
+ const headerTooltipTimerRef = useRef4(null);
1956
+ const cellTooltipTimerRef = useRef4(null);
1957
+ const pendingHeaderTooltipKeyRef = useRef4("");
1958
+ const pendingCellTooltipKeyRef = useRef4("");
1959
+ const clickedCellRef = useRef4(null);
1960
+ const rowAnchorRef = useRef4(null);
1961
+ const columnAnchorRef = useRef4(null);
1962
+ const columnDragRef = useRef4(null);
1963
+ const columnOrderDragRef = useRef4(null);
1964
+ const columnOrderLongPressTimerRef = useRef4(null);
1965
+ const dragGuideRef = useRef4(null);
1966
+ const rowDragGuideRef = useRef4(null);
1967
+ const selectionFocusRef = useRef4(null);
1968
+ const selectionEdgeTargetRef = useRef4(null);
1969
+ const verticalScrollbarRef = useRef4(null);
1970
+ const verticalScrollbarThumbRef = useRef4(null);
1971
+ const verticalScrollbarDragRef = useRef4(null);
1972
+ const horizontalScrollbarRef = useRef4(null);
1973
+ const horizontalScrollbarThumbRef = useRef4(null);
1974
+ const horizontalScrollbarDragRef = useRef4(null);
1975
+ const verticalScrollbarVisibilityTimerRef = useRef4(null);
1976
+ const horizontalScrollbarVisibilityTimerRef = useRef4(null);
1977
+ const rowByKeyRef = useRef4(/* @__PURE__ */ new Map());
1978
+ const rowIndexByKeyRef = useRef4(/* @__PURE__ */ new Map());
1979
+ const headerIconsRef = useRef4(null);
1980
+ const scrollingHeaderIconsRef = useRef4(null);
1981
+ const scrollingTextRef = useRef4(null);
1982
+ const filterRef = useRef4(null);
1983
+ const contextMenuRef = useRef4(null);
1984
+ const suppressClickRef = useRef4(false);
1985
+ const hasCompletedLoadRef = useRef4(!loading);
1986
+ const validColumnDropRef = useRef4(null);
1987
+ const hoveredHeaderActionRef = useRef4(null);
1988
+ const hoveredRowIndexRef = useRef4(null);
1989
+ const [viewport, setViewport] = useState6({ width: 0, height: typeof height === "number" ? height : FALLBACK_HEIGHT });
1990
+ const [horizontalScrollbarHeight, setHorizontalScrollbarHeight] = useState6(0);
1991
+ const [availableHeight, setAvailableHeight] = useState6(FALLBACK_HEIGHT);
1791
1992
  const resolvedHeight = typeof height === "number" ? height : availableHeight;
1792
- const [scrollPosition, setScrollPosition] = useState4({ left: 0, top: 0 });
1793
- const scrollRef = useRef2({ left: 0, top: 0 });
1993
+ const [scrollPosition, setScrollPosition] = useState6({ left: 0, top: 0 });
1994
+ const scrollRef = useRef4({ left: 0, top: 0 });
1794
1995
  const [rowKeys, setRowKeys] = useControllableKeys(selectedRowKeys, defaultSelectedRowKeys, (keys) => {
1795
1996
  if (!onSelectedRowChange) return;
1796
1997
  const missing = new Set(keys.filter((key) => !rowByKeyRef.current.has(key)));
@@ -1812,20 +2013,20 @@ function TableInner({
1812
2013
  onSelectedRowChange(keys, entries.map(({ row }) => row), entries.map(({ index }) => index));
1813
2014
  });
1814
2015
  const [columnKeys, setColumnKeys] = useControllableKeys(selectedColumnKeys, defaultSelectedColumnKeys, onSelectedColumnChange);
1815
- const [editing, setEditing] = useState4(null);
1816
- const [draft, setDraft] = useState4("");
1817
- const [rowDragPreview, setRowDragPreview] = useState4(null);
1818
- const [columnDragPreview, setColumnDragPreview] = useState4(null);
1819
- const [columnDropTarget, setColumnDropTarget] = useState4(null);
1820
- useEffect2(() => {
2016
+ const [editing, setEditing] = useState6(null);
2017
+ const [draft, setDraft] = useState6("");
2018
+ const [rowDragPreview, setRowDragPreview] = useState6(null);
2019
+ const [columnDragPreview, setColumnDragPreview] = useState6(null);
2020
+ const [columnDropTarget, setColumnDropTarget] = useState6(null);
2021
+ useEffect3(() => {
1821
2022
  if (!loading) hasCompletedLoadRef.current = true;
1822
2023
  }, [loading]);
1823
- useEffect2(() => {
2024
+ useEffect3(() => {
1824
2025
  if (rangeSelection) return;
1825
2026
  rangeDragRef.current = null;
1826
2027
  setSelectionRange(null);
1827
2028
  }, [rangeSelection]);
1828
- useEffect2(() => {
2029
+ useEffect3(() => {
1829
2030
  const previousSourceWidths = sourceColumnWidthsRef.current;
1830
2031
  const nextSourceWidths = new Map(leafSourceColumns.map((column) => [column.key, column.width]));
1831
2032
  sourceColumnWidthsRef.current = nextSourceWidths;
@@ -1849,7 +2050,7 @@ function TableInner({
1849
2050
  return changed ? next : current;
1850
2051
  });
1851
2052
  }, [leafSourceColumns]);
1852
- useEffect2(() => () => {
2053
+ useEffect3(() => () => {
1853
2054
  if (headerTooltipTimerRef.current !== null) clearTimeout(headerTooltipTimerRef.current);
1854
2055
  if (cellTooltipTimerRef.current !== null) clearTimeout(cellTooltipTimerRef.current);
1855
2056
  }, []);
@@ -1871,7 +2072,7 @@ function TableInner({
1871
2072
  return changed ? nextHeights : current;
1872
2073
  });
1873
2074
  }, [activeCustomHeaderLevels, baseHeaderHeight, headerDepth]);
1874
- useLayoutEffect2(() => {
2075
+ useLayoutEffect3(() => {
1875
2076
  customHeaderContentRefs.current.forEach((_, key) => {
1876
2077
  if (!activeCustomHeaderLevels.has(key)) customHeaderContentRefs.current.delete(key);
1877
2078
  });
@@ -1879,7 +2080,7 @@ function TableInner({
1879
2080
  if (!activeCustomHeaderLevels.has(key)) customHeaderMeasurementsRef.current.delete(key);
1880
2081
  });
1881
2082
  if (activeCustomHeaderLevels.size === 0) {
1882
- setMeasuredHeaderRowHeights([]);
2083
+ setMeasuredHeaderRowHeights((current) => current.length === 0 ? current : []);
1883
2084
  return;
1884
2085
  }
1885
2086
  measureCustomHeaderHeight();
@@ -1888,22 +2089,22 @@ function TableInner({
1888
2089
  customHeaderContentRefs.current.forEach((node) => observer.observe(node));
1889
2090
  return () => observer.disconnect();
1890
2091
  }, [activeCustomHeaderLevels, measureCustomHeaderHeight, viewport.width]);
1891
- const [filterEditor, setFilterEditor] = useState4(null);
1892
- const [filterValues, setFilterValues] = useState4({});
1893
- const [sortState, setSortState] = useState4(null);
1894
- const [contextMenu, setContextMenu] = useState4(null);
1895
- const [insertCounts, setInsertCounts] = useState4({ before: 1, after: 1 });
1896
- const [confirmAction, setConfirmAction] = useState4(null);
1897
- const [confirmLoading, setConfirmLoading] = useState4(false);
1898
- const [insertBusy, setInsertBusy] = useState4(false);
1899
- const [deleteBusy, setDeleteBusy] = useState4(false);
1900
- const [toast, setToast] = useState4(null);
1901
- const [resizeGuideX, setResizeGuideX] = useState4(null);
1902
- const [resizeGuideTop, setResizeGuideTop] = useState4(0);
1903
- const [hoveredHeaderColumnIndex, setHoveredHeaderColumnIndex] = useState4(null);
1904
- const [hoveredHeaderAction, setHoveredHeaderAction] = useState4(null);
1905
- const [visibleHeaderTooltip, setVisibleHeaderTooltip] = useState4(null);
1906
- const [hoveredCellTooltip, setHoveredCellTooltip] = useState4(null);
2092
+ const [filterEditor, setFilterEditor] = useState6(null);
2093
+ const [filterValues, setFilterValues] = useState6({});
2094
+ const [sortState, setSortState] = useState6(null);
2095
+ const [contextMenu, setContextMenu] = useState6(null);
2096
+ const [insertCounts, setInsertCounts] = useState6({ before: 1, after: 1 });
2097
+ const [confirmAction, setConfirmAction] = useState6(null);
2098
+ const [confirmLoading, setConfirmLoading] = useState6(false);
2099
+ const [insertBusy, setInsertBusy] = useState6(false);
2100
+ const [deleteBusy, setDeleteBusy] = useState6(false);
2101
+ const [toast, setToast] = useState6(null);
2102
+ const [resizeGuideX, setResizeGuideX] = useState6(null);
2103
+ const [resizeGuideTop, setResizeGuideTop] = useState6(0);
2104
+ const [hoveredHeaderColumnIndex, setHoveredHeaderColumnIndex] = useState6(null);
2105
+ const [hoveredHeaderAction, setHoveredHeaderAction] = useState6(null);
2106
+ const [visibleHeaderTooltip, setVisibleHeaderTooltip] = useState6(null);
2107
+ const [hoveredCellTooltip, setHoveredCellTooltip] = useState6(null);
1907
2108
  const hideDragTooltips = useCallback2(() => {
1908
2109
  if (headerTooltipTimerRef.current !== null) {
1909
2110
  clearTimeout(headerTooltipTimerRef.current);
@@ -1918,19 +2119,19 @@ function TableInner({
1918
2119
  setVisibleHeaderTooltip(null);
1919
2120
  setHoveredCellTooltip(null);
1920
2121
  }, []);
1921
- const [editedCellKeys, setEditedCellKeys] = useState4(() => /* @__PURE__ */ new Set());
1922
- const [cellAnnotations, setCellAnnotations] = useState4(() => /* @__PURE__ */ new Map());
1923
- const [annotationType, setAnnotationType] = useState4("corner");
1924
- const [annotationColor, setAnnotationColor] = useState4(ANNOTATION_COLORS[0]);
1925
- const [annotationContent, setAnnotationContent] = useState4("");
1926
- const [annotationOpen, setAnnotationOpen] = useState4(false);
1927
- const [annotationPlacement, setAnnotationPlacement] = useState4("right-down");
1928
- const originalCellValuesRef = useRef2(/* @__PURE__ */ new Map());
1929
- const [pendingDeletedRowKeys, setPendingDeletedRowKeys] = useState4(() => /* @__PURE__ */ new Set());
1930
- const [pendingInserts, setPendingInserts] = useState4(() => []);
1931
- const [insertedRowKeys, setInsertedRowKeys] = useState4(() => /* @__PURE__ */ new Set());
1932
- const [rowOrderKeys, setRowOrderKeys] = useState4(null);
1933
- const settledPendingInsertIdsRef = useRef2(/* @__PURE__ */ new Set());
2122
+ const [editedCellKeys, setEditedCellKeys] = useState6(() => /* @__PURE__ */ new Set());
2123
+ const [cellAnnotations, setCellAnnotations] = useState6(() => /* @__PURE__ */ new Map());
2124
+ const [annotationType, setAnnotationType] = useState6("corner");
2125
+ const [annotationColor, setAnnotationColor] = useState6(ANNOTATION_COLORS[0]);
2126
+ const [annotationContent, setAnnotationContent] = useState6("");
2127
+ const [annotationOpen, setAnnotationOpen] = useState6(false);
2128
+ const [annotationPlacement, setAnnotationPlacement] = useState6("right-down");
2129
+ const originalCellValuesRef = useRef4(/* @__PURE__ */ new Map());
2130
+ const [pendingDeletedRowKeys, setPendingDeletedRowKeys] = useState6(() => /* @__PURE__ */ new Set());
2131
+ const [pendingInserts, setPendingInserts] = useState6(() => []);
2132
+ const [insertedRowKeys, setInsertedRowKeys] = useState6(() => /* @__PURE__ */ new Set());
2133
+ const [rowOrderKeys, setRowOrderKeys] = useState6(null);
2134
+ const settledPendingInsertIdsRef = useRef4(/* @__PURE__ */ new Set());
1934
2135
  const getDataRowKey = useCallback2((row, index) => {
1935
2136
  return typeof rowKey === "function" ? rowKey(row, index) : rowKey ? row[rowKey] : getDefaultRowKey(row, index);
1936
2137
  }, [rowKey]);
@@ -1944,7 +2145,7 @@ function TableInner({
1944
2145
  }
1945
2146
  return sourceRows.findIndex((sourceRow, index) => getDataRowKey(sourceRow, index) === key);
1946
2147
  }, [getDataRowKey, sourceRows]);
1947
- const orderedRows = useMemo(() => {
2148
+ const orderedRows = useMemo2(() => {
1948
2149
  let next = sourceRows;
1949
2150
  if (pendingInserts.length > 0) {
1950
2151
  const activeInserts = pendingInserts.filter((insert) => {
@@ -1980,10 +2181,10 @@ function TableInner({
1980
2181
  });
1981
2182
  return ordered;
1982
2183
  }, [getDataRowKey, pendingDeletedRowKeys, pendingInserts, rowOrderKeys, sourceRows]);
1983
- const activeFilterValues = useMemo(() => Object.fromEntries(
2184
+ const activeFilterValues = useMemo2(() => Object.fromEntries(
1984
2185
  Object.entries(filterValues).filter(([, value]) => value.trim() !== "")
1985
2186
  ), [filterValues]);
1986
- const filteredRows = useMemo(() => {
2187
+ const filteredRows = useMemo2(() => {
1987
2188
  if (Object.keys(activeFilterValues).length === 0) return orderedRows;
1988
2189
  if (onFilterChange) return onFilterChange(orderedRows, activeFilterValues);
1989
2190
  return orderedRows.filter((row, rowIndex) => Object.entries(activeFilterValues).every(([columnKey, query]) => {
@@ -1992,7 +2193,7 @@ function TableInner({
1992
2193
  return getDisplayLabel(column, row, rowIndex).toLocaleLowerCase().includes(query.trim().toLocaleLowerCase());
1993
2194
  }));
1994
2195
  }, [activeFilterValues, columns, onFilterChange, orderedRows]);
1995
- const rows = useMemo(() => {
2196
+ const rows = useMemo2(() => {
1996
2197
  if (!sortState) return filteredRows;
1997
2198
  if (onSortChange) return onSortChange(filteredRows, sortState);
1998
2199
  const column = columns.find((candidate) => candidate.key === sortState.columnKey);
@@ -2018,8 +2219,8 @@ function TableInner({
2018
2219
  columnKey: target.columnKey
2019
2220
  };
2020
2221
  }, [columns, getDataRowKey, rows]);
2021
- const resolvedSelectedCell = useMemo(() => resolveSelectionTarget(selectedCell), [resolveSelectionTarget, selectedCell]);
2022
- const resolvedDefaultSelectedCell = useMemo(() => resolveSelectionTarget(defaultSelectedCell), [defaultSelectedCell, resolveSelectionTarget]);
2222
+ const resolvedSelectedCell = useMemo2(() => resolveSelectionTarget(selectedCell), [resolveSelectionTarget, selectedCell]);
2223
+ const resolvedDefaultSelectedCell = useMemo2(() => resolveSelectionTarget(defaultSelectedCell), [defaultSelectedCell, resolveSelectionTarget]);
2023
2224
  const handleSelectedCellChange = useCallback2((next) => {
2024
2225
  if (!onSelectedCellChange) return;
2025
2226
  if (!next) {
@@ -2032,15 +2233,16 @@ function TableInner({
2032
2233
  onSelectedCellChange({ ...next, value });
2033
2234
  }, [columns, onSelectedCellChange, rows]);
2034
2235
  const [selection, setSelection] = useControllableValue(resolvedSelectedCell, resolvedDefaultSelectedCell, handleSelectedCellChange);
2035
- const [selectionRange, setSelectionRange] = useState4(null);
2036
- const rangeDragRef = useRef2(null);
2037
- useEffect2(() => {
2236
+ const [selectionRange, setSelectionRange] = useState6(null);
2237
+ const rangeDragRef = useRef4(null);
2238
+ useEffect3(() => {
2038
2239
  if (!selection) return void 0;
2039
2240
  const handleOutsidePointerDown = (event) => {
2040
2241
  const target = event.target;
2041
2242
  if (!(target instanceof Node)) return;
2042
2243
  if (rootRef.current?.contains(target)) return;
2043
2244
  if (target instanceof Element && target.closest(".rvg-choice-content, .rvg-date-content, .rvg-time-dropdown")) return;
2245
+ if (target instanceof Element && target.closest(".rvg-textarea-dialog")) return;
2044
2246
  clickedCellRef.current = null;
2045
2247
  setSelectionRange(null);
2046
2248
  setSelection(null);
@@ -2062,7 +2264,7 @@ function TableInner({
2062
2264
  setSourceColumns(nextColumns);
2063
2265
  onColumnsReorder?.(nextColumns, { sourceIndex, targetIndex, ...detail });
2064
2266
  }, [onColumnsReorder, sourceColumns]);
2065
- useEffect2(() => {
2267
+ useEffect3(() => {
2066
2268
  if (insertBusy || settledPendingInsertIdsRef.current.size === 0) return;
2067
2269
  setPendingInserts((current) => {
2068
2270
  const next = current.filter((insert) => !settledPendingInsertIdsRef.current.has(insert.id));
@@ -2073,7 +2275,7 @@ function TableInner({
2073
2275
  return next;
2074
2276
  });
2075
2277
  }, [insertBusy, pendingInserts]);
2076
- useEffect2(() => {
2278
+ useEffect3(() => {
2077
2279
  if (pendingDeletedRowKeys.size === 0) return;
2078
2280
  setPendingDeletedRowKeys((current) => {
2079
2281
  if (current.size === 0) return current;
@@ -2087,20 +2289,20 @@ function TableInner({
2087
2289
  return changed ? next : current;
2088
2290
  });
2089
2291
  }, [getDataRowKey, pendingDeletedRowKeys.size, sourceRows]);
2090
- useLayoutEffect2(() => {
2292
+ useLayoutEffect3(() => {
2091
2293
  if (!editing) return;
2092
2294
  if (selection?.rowKey === editing.rowKey && selection.columnKey === editing.columnKey) return;
2093
2295
  setEditing(null);
2094
2296
  }, [editing, selection]);
2095
2297
  const hasManualColumnWidths = Object.keys(resizedColumnWidths).length > 0;
2096
- const metrics = useMemo(() => buildColumnMetrics(columns, {
2298
+ const metrics = useMemo2(() => buildColumnMetrics(columns, {
2097
2299
  columnDraggable,
2098
2300
  viewportWidth: !stretchColumns || hasManualColumnWidths ? 0 : viewport.width
2099
2301
  }), [columnDraggable, columns, hasManualColumnWidths, stretchColumns, viewport.width]);
2100
2302
  const contentWidth = metrics.length > 0 ? metrics[metrics.length - 1].right : 0;
2101
2303
  const contentHeight = rows.length * rowHeight;
2102
- const fixedWidth = useMemo(() => columns.reduce((width2, column, index) => column.fixed === "left" ? width2 + metrics[index].width : width2, 0), [columns, metrics]);
2103
- const leftFixedOffsets = useMemo(() => {
2304
+ const fixedWidth = useMemo2(() => columns.reduce((width2, column, index) => column.fixed === "left" ? width2 + metrics[index].width : width2, 0), [columns, metrics]);
2305
+ const leftFixedOffsets = useMemo2(() => {
2104
2306
  const offsets = /* @__PURE__ */ new Map();
2105
2307
  let offset = 0;
2106
2308
  for (let index = 0; index < columns.length; index += 1) {
@@ -2110,8 +2312,8 @@ function TableInner({
2110
2312
  }
2111
2313
  return offsets;
2112
2314
  }, [columns, metrics]);
2113
- const rightFixedWidth = useMemo(() => columns.reduce((width2, column, index) => column.fixed === "right" ? width2 + metrics[index].width : width2, 0), [columns, metrics]);
2114
- const rightFixedOffsets = useMemo(() => {
2315
+ const rightFixedWidth = useMemo2(() => columns.reduce((width2, column, index) => column.fixed === "right" ? width2 + metrics[index].width : width2, 0), [columns, metrics]);
2316
+ const rightFixedOffsets = useMemo2(() => {
2115
2317
  const offsets = /* @__PURE__ */ new Map();
2116
2318
  let offset = 0;
2117
2319
  for (let index = columns.length - 1; index >= 0; index -= 1) {
@@ -2121,7 +2323,7 @@ function TableInner({
2121
2323
  }
2122
2324
  return offsets;
2123
2325
  }, [columns, metrics]);
2124
- const scrollableColumnLefts = useMemo(() => {
2326
+ const scrollableColumnLefts = useMemo2(() => {
2125
2327
  const lefts = [];
2126
2328
  let width2 = fixedWidth;
2127
2329
  for (let index = 0; index < columns.length; index += 1) {
@@ -2131,9 +2333,9 @@ function TableInner({
2131
2333
  return lefts;
2132
2334
  }, [columns, fixedWidth, metrics]);
2133
2335
  const getScrollableColumnLeft = useCallback2((columnIndex) => scrollableColumnLefts[columnIndex] ?? fixedWidth, [fixedWidth, scrollableColumnLefts]);
2134
- const hasRowSelectionColumn = useMemo(() => columns.some((column) => column.rowSelection), [columns]);
2336
+ const hasRowSelectionColumn = useMemo2(() => columns.some((column) => column.rowSelection), [columns]);
2135
2337
  const rowSelectionMode = typeof rowSelection === "object" ? rowSelection.mode ?? "multiple" : "multiple";
2136
- const summarySignature = useMemo(() => getSummarySignature(columns), [columns]);
2338
+ const summarySignature = useMemo2(() => getSummarySignature(columns), [columns]);
2137
2339
  const hasSummaryRow = rows.length > 0 && summaryEnabled && summarySignature.length > 0;
2138
2340
  const topSummaryHeight = hasSummaryRow && summaryPosition === "top" ? rowHeight : 0;
2139
2341
  const bottomSummaryHeight = hasSummaryRow && summaryPosition === "bottom" ? rowHeight : 0;
@@ -2143,10 +2345,10 @@ function TableInner({
2143
2345
  const effectiveHeight = autoHeight ? Math.max(bodyTop + bottomSummaryHeight, Math.min(resolvedHeight, realContentHeight)) : resolvedHeight;
2144
2346
  const renderHeight = Math.max(0, effectiveHeight - bottomSummaryHeight);
2145
2347
  const bodyViewportHeight = Math.max(0, renderHeight - (fixedHeader ? headerHeight + topSummaryHeight : 0));
2146
- const [summaryState, setSummaryState] = useState4(() => ({ signature: "", rows: null, values: /* @__PURE__ */ new Map(), pending: false }));
2348
+ const [summaryState, setSummaryState] = useState6(() => ({ signature: "", rows: null, values: /* @__PURE__ */ new Map(), pending: false }));
2147
2349
  const summaryPending = hasSummaryRow && (loading || summaryState.pending || summaryState.signature !== summarySignature || summaryState.rows !== rows);
2148
2350
  const summaryValues = hasSummaryRow && summaryState.signature === summarySignature && summaryState.rows === rows ? summaryState.values : /* @__PURE__ */ new Map();
2149
- useEffect2(() => {
2351
+ useEffect3(() => {
2150
2352
  let cancelled = false;
2151
2353
  if (!hasSummaryRow) {
2152
2354
  setSummaryState((current) => current.signature === "" && current.rows === null && current.values.size === 0 && !current.pending ? current : { signature: "", rows: null, values: /* @__PURE__ */ new Map(), pending: false });
@@ -2177,7 +2379,7 @@ function TableInner({
2177
2379
  cancelled = true;
2178
2380
  };
2179
2381
  }, [hasSummaryRow, loading, rows, summarySignature]);
2180
- const domRange = useMemo(() => {
2382
+ const domRange = useMemo2(() => {
2181
2383
  if (!isVirtualized) return { rowStart: 0, rowEnd: rows.length, columnStart: 0, columnEnd: columns.length };
2182
2384
  const currentScroll2 = scrollRef.current;
2183
2385
  const rowScrollTop = fixedHeader ? currentScroll2.top : Math.max(0, currentScroll2.top - bodyTop);
@@ -2189,7 +2391,7 @@ function TableInner({
2189
2391
  rowIndexByKeyRef.current.set(key, index);
2190
2392
  return key;
2191
2393
  }, [getDataRowKey]);
2192
- const resolvedCellSpans = useMemo(() => {
2394
+ const resolvedCellSpans = useMemo2(() => {
2193
2395
  if (Array.isArray(cellSpans)) return cellSpans;
2194
2396
  const spans = [];
2195
2397
  rows.forEach((row, rowIndex) => {
@@ -2205,7 +2407,7 @@ function TableInner({
2205
2407
  });
2206
2408
  return spans;
2207
2409
  }, [cellSpans, columns, rows]);
2208
- const cellSpanLookup = useMemo(() => {
2410
+ const cellSpanLookup = useMemo2(() => {
2209
2411
  if (resolvedCellSpans.length === 0) return createEmptyCellSpanLookup();
2210
2412
  const rowIndexByKey = /* @__PURE__ */ new Map();
2211
2413
  rows.forEach((row, index) => rowIndexByKey.set(getRowKey(row, index), index));
@@ -2249,9 +2451,9 @@ function TableInner({
2249
2451
  }
2250
2452
  return lookup;
2251
2453
  }, [columns, getRowKey, resolvedCellSpans, rows]);
2252
- const selectedRowKeySet = useMemo(() => new Set(rowKeys), [rowKeys]);
2253
- const selectedColumnKeySet = useMemo(() => new Set(columnKeys), [columnKeys]);
2254
- const insertedRowKeySet = useMemo(() => insertedRowKeys, [insertedRowKeys]);
2454
+ const selectedRowKeySet = useMemo2(() => new Set(rowKeys), [rowKeys]);
2455
+ const selectedColumnKeySet = useMemo2(() => new Set(columnKeys), [columnKeys]);
2456
+ const insertedRowKeySet = useMemo2(() => insertedRowKeys, [insertedRowKeys]);
2255
2457
  const measureHeaderTitleWidth = useCallback2((columnIndex) => {
2256
2458
  const title = columns[columnIndex]?.title ?? "";
2257
2459
  const context = canvasRef.current?.getContext("2d");
@@ -2281,7 +2483,7 @@ function TableInner({
2281
2483
  }
2282
2484
  return width2;
2283
2485
  }, [columns.length, metrics]);
2284
- useEffect2(() => {
2486
+ useEffect3(() => {
2285
2487
  if (!selection) return;
2286
2488
  const nextRowIndex = rows.findIndex((row, index) => getRowKey(row, index) === selection.rowKey);
2287
2489
  const nextColumnIndex = columns.findIndex((column) => column.key === selection.columnKey);
@@ -2490,7 +2692,7 @@ function TableInner({
2490
2692
  target.classList.remove("is-shape-syncing");
2491
2693
  }
2492
2694
  }, [getSelectionEdgeIndicator]);
2493
- useLayoutEffect2(() => {
2695
+ useLayoutEffect3(() => {
2494
2696
  const element = scrollerRef.current;
2495
2697
  if (!element) return;
2496
2698
  const root = element.parentElement;
@@ -2516,7 +2718,7 @@ function TableInner({
2516
2718
  if (root?.parentElement) observer.observe(root.parentElement);
2517
2719
  return () => observer.disconnect();
2518
2720
  }, [height]);
2519
- useEffect2(() => {
2721
+ useEffect3(() => {
2520
2722
  scheduleDraw();
2521
2723
  return () => {
2522
2724
  if (frameRef.current !== null) {
@@ -2525,13 +2727,13 @@ function TableInner({
2525
2727
  }
2526
2728
  };
2527
2729
  }, [scheduleDraw]);
2528
- useEffect2(() => () => {
2730
+ useEffect3(() => () => {
2529
2731
  if (textFrameRef.current !== null) cancelAnimationFrame(textFrameRef.current);
2530
2732
  if (toastTimerRef.current !== null) clearTimeout(toastTimerRef.current);
2531
2733
  if (verticalScrollbarVisibilityTimerRef.current !== null) clearTimeout(verticalScrollbarVisibilityTimerRef.current);
2532
2734
  if (horizontalScrollbarVisibilityTimerRef.current !== null) clearTimeout(horizontalScrollbarVisibilityTimerRef.current);
2533
2735
  }, []);
2534
- useEffect2(() => {
2736
+ useEffect3(() => {
2535
2737
  const scroller = scrollerRef.current;
2536
2738
  if (!scroller) return;
2537
2739
  const containHorizontalOverscroll = (event) => {
@@ -2543,7 +2745,7 @@ function TableInner({
2543
2745
  scroller.addEventListener("wheel", containHorizontalOverscroll, { passive: false });
2544
2746
  return () => scroller.removeEventListener("wheel", containHorizontalOverscroll);
2545
2747
  }, []);
2546
- useEffect2(() => {
2748
+ useEffect3(() => {
2547
2749
  if (!filterEditor) return;
2548
2750
  const closeOnOutsidePointer = (event) => {
2549
2751
  if (!filterRef.current?.contains(event.target)) setFilterEditor(null);
@@ -2551,7 +2753,7 @@ function TableInner({
2551
2753
  document.addEventListener("pointerdown", closeOnOutsidePointer);
2552
2754
  return () => document.removeEventListener("pointerdown", closeOnOutsidePointer);
2553
2755
  }, [filterEditor]);
2554
- useEffect2(() => {
2756
+ useEffect3(() => {
2555
2757
  if (!contextMenu) return;
2556
2758
  const close = (event) => {
2557
2759
  if (!contextMenuRef.current?.contains(event.target)) setContextMenu(null);
@@ -2566,10 +2768,10 @@ function TableInner({
2566
2768
  document.removeEventListener("keydown", closeOnEscape);
2567
2769
  };
2568
2770
  }, [contextMenu]);
2569
- useEffect2(() => {
2771
+ useEffect3(() => {
2570
2772
  if (!confirmAction) setConfirmLoading(false);
2571
2773
  }, [confirmAction]);
2572
- useEffect2(() => {
2774
+ useEffect3(() => {
2573
2775
  const scroller = scrollerRef.current;
2574
2776
  if (!scroller || !insertBusy) return;
2575
2777
  const left = scroller.scrollLeft;
@@ -2663,7 +2865,7 @@ function TableInner({
2663
2865
  horizontalThumb.style.width = `${Math.min(trackWidth, thumbWidth)}px`;
2664
2866
  horizontalThumb.style.transform = `translateX(${thumbLeft}px)`;
2665
2867
  }, [autoHeight, bodyTop, bottomSummaryHeight, effectiveHeight, fixedHeader, fixedWidth, realContentHeight, renderHeight, rightFixedWidth, viewport.width]);
2666
- useLayoutEffect2(() => {
2868
+ useLayoutEffect3(() => {
2667
2869
  updateCustomScrollbars();
2668
2870
  }, [contentHeight, contentWidth, updateCustomScrollbars, viewport.height, viewport.width]);
2669
2871
  const handleVerticalScrollbarPointerDown = useCallback2((event) => {
@@ -2882,7 +3084,7 @@ function TableInner({
2882
3084
  if (columns[columnIndex].fixed === "right") return viewport.width - (rightFixedOffsets.get(columnIndex) ?? 0) - metric.width;
2883
3085
  return getScrollableColumnLeft(columnIndex) - scrollRef.current.left;
2884
3086
  }, [columns, getScrollableColumnLeft, leftFixedOffsets, metrics, rightFixedOffsets, viewport.width]);
2885
- const trailingColumnBorderLeft = useMemo(() => {
3087
+ const trailingColumnBorderLeft = useMemo2(() => {
2886
3088
  const displayedContentRight = columns.reduce((right, _column, columnIndex) => Math.max(right, getDisplayedColumnLeft(columnIndex) + metrics[columnIndex].width), 0);
2887
3089
  return displayedContentRight > 0 && displayedContentRight < viewport.width ? Math.round(displayedContentRight) - 1 : null;
2888
3090
  }, [columns, getDisplayedColumnLeft, metrics, scrollPosition.left, viewport.width]);
@@ -3047,7 +3249,7 @@ function TableInner({
3047
3249
  const rowIndex = Math.floor((localY - bodyTop + scrollRef.current.top) / rowHeight);
3048
3250
  return rowIndex >= 0 && rowIndex < rows.length ? rowIndex : -1;
3049
3251
  }, [bodyTop, rowHeight, rows.length]);
3050
- useEffect2(() => {
3252
+ useEffect3(() => {
3051
3253
  const canvas = canvasRef.current;
3052
3254
  if (!canvas || !rowDraggable) return;
3053
3255
  const cleanupDrag = draggable({
@@ -3402,11 +3604,29 @@ function TableInner({
3402
3604
  if (!editing || !editorStyle) return null;
3403
3605
  const column = columns[editing.columnIndex];
3404
3606
  if (column.editor?.type === "select") {
3405
- return /* @__PURE__ */ jsx7(
3607
+ return /* @__PURE__ */ jsx8(
3406
3608
  ChoiceEditor,
3407
3609
  {
3408
3610
  value: draft,
3409
3611
  options: column.editor.options,
3612
+ searchable: column.editor.searchable,
3613
+ allowCustomValue: column.editor.allowCustomValue,
3614
+ maxDropdownHeight: column.editor.maxDropdownHeight,
3615
+ style: editorStyle,
3616
+ labels,
3617
+ onChange: setDraft,
3618
+ onCommit: (next) => commitEdit(next),
3619
+ onCancel: () => setEditing(null)
3620
+ }
3621
+ );
3622
+ }
3623
+ if (column.editor?.type === "textarea") {
3624
+ return /* @__PURE__ */ jsx8(
3625
+ TextAreaEditor,
3626
+ {
3627
+ value: draft,
3628
+ title: column.editor.title ?? column.title,
3629
+ maxLength: column.editor.maxLength,
3410
3630
  style: editorStyle,
3411
3631
  labels,
3412
3632
  onChange: setDraft,
@@ -3416,7 +3636,7 @@ function TableInner({
3416
3636
  );
3417
3637
  }
3418
3638
  if (column.editor?.type === "time" || column.editor?.type === "time-range") {
3419
- return /* @__PURE__ */ jsx7(
3639
+ return /* @__PURE__ */ jsx8(
3420
3640
  CompactTimeEditor,
3421
3641
  {
3422
3642
  value: draft,
@@ -3431,7 +3651,7 @@ function TableInner({
3431
3651
  );
3432
3652
  }
3433
3653
  if (column.editor && ["date", "date-range", "date-time", "date-time-range", "year", "month"].includes(column.editor.type)) {
3434
- return /* @__PURE__ */ jsx7(
3654
+ return /* @__PURE__ */ jsx8(
3435
3655
  DateEditor,
3436
3656
  {
3437
3657
  editor: column.editor,
@@ -3447,11 +3667,14 @@ function TableInner({
3447
3667
  }
3448
3668
  const row = rows[editing.rowIndex];
3449
3669
  const cellValue = column.dataIndex === void 0 ? void 0 : row?.[column.dataIndex];
3450
- return /* @__PURE__ */ jsx7(
3670
+ return /* @__PURE__ */ jsx8(
3451
3671
  TextEditor,
3452
3672
  {
3453
3673
  value: draft,
3454
- type: typeof cellValue === "number" ? "number" : "text",
3674
+ type: column.editor?.type === "number" || typeof cellValue === "number" ? "number" : "text",
3675
+ min: column.editor?.type === "number" ? column.editor.min : void 0,
3676
+ max: column.editor?.type === "number" ? column.editor.max : void 0,
3677
+ integer: column.editor?.type === "number" ? column.editor.integer : void 0,
3455
3678
  style: editorStyle,
3456
3679
  labels,
3457
3680
  onChange: setDraft,
@@ -3493,7 +3716,7 @@ function TableInner({
3493
3716
  }
3494
3717
  }
3495
3718
  }, [beginEdit, bodyTop, columns, editing, renderHeight, fixedHeader, fixedWidth, getCellDisplayWidth, getCellSpan, getRowKey, getScrollableColumnLeft, metrics, rightFixedWidth, rowHeight, rows, selection, setSelection, viewport.width]);
3496
- const editorStyle = useMemo(() => {
3719
+ const editorStyle = useMemo2(() => {
3497
3720
  if (!editing) return void 0;
3498
3721
  const metric = metrics[editing.columnIndex];
3499
3722
  const column = columns[editing.columnIndex];
@@ -3792,21 +4015,21 @@ function TableInner({
3792
4015
  if (visibleActions.drag) {
3793
4016
  const hovered = hoveredHeaderAction?.columnIndex === columnIndex && hoveredHeaderAction.action === "drag";
3794
4017
  icons.push(
3795
- /* @__PURE__ */ jsx7(HeaderDragIcon, { className: `rvg-header-icon rvg-header-drag-icon${selectedClassName}${hoveredColumnClassName}${hovered ? " is-hovered" : ""}`, style: { left: left + metrics[columnIndex].width - headerActionSlotWidth, top } }, "drag")
4018
+ /* @__PURE__ */ jsx8(HeaderDragIcon, { className: `rvg-header-icon rvg-header-drag-icon${selectedClassName}${hoveredColumnClassName}${hovered ? " is-hovered" : ""}`, style: { left: left + metrics[columnIndex].width - headerActionSlotWidth, top } }, "drag")
3796
4019
  );
3797
4020
  }
3798
4021
  if (visibleActions.sort) {
3799
4022
  const hovered = hoveredHeaderAction?.columnIndex === columnIndex && hoveredHeaderAction.action === "sort";
3800
4023
  const direction = sortState?.columnKey === column.key ? sortState.direction : null;
3801
4024
  icons.push(
3802
- /* @__PURE__ */ jsx7(HeaderSortIcon, { className: `rvg-header-icon${selectedClassName}${hoveredColumnClassName}${direction ? " is-active" : ""}${hovered ? " is-hovered" : ""}`, style: { left: right - headerActionSlotWidth, top }, direction }, "sort")
4025
+ /* @__PURE__ */ jsx8(HeaderSortIcon, { className: `rvg-header-icon${selectedClassName}${hoveredColumnClassName}${direction ? " is-active" : ""}${hovered ? " is-hovered" : ""}`, style: { left: right - headerActionSlotWidth, top }, direction }, "sort")
3803
4026
  );
3804
4027
  right -= headerActionSlotWidth;
3805
4028
  }
3806
4029
  if (visibleActions.filter) {
3807
4030
  const hovered = hoveredHeaderAction?.columnIndex === columnIndex && hoveredHeaderAction.action === "filter";
3808
4031
  icons.push(
3809
- /* @__PURE__ */ jsx7(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")
4032
+ /* @__PURE__ */ jsx8(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")
3810
4033
  );
3811
4034
  }
3812
4035
  return icons;
@@ -4095,20 +4318,20 @@ function TableInner({
4095
4318
  setAnnotationOpen(false);
4096
4319
  setContextMenu(null);
4097
4320
  };
4098
- return /* @__PURE__ */ jsxs7(Fragment3, { children: [
4099
- /* @__PURE__ */ jsxs7("div", { className: `rvg-annotation-submenu is-${annotationPlacement}`, onMouseEnter: openAnnotation, onMouseLeave: () => setAnnotationOpen(false), children: [
4100
- /* @__PURE__ */ jsxs7("button", { type: "button", role: "menuitem", className: "rvg-context-annotation-trigger", "aria-expanded": annotationOpen, children: [
4101
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "annotation" }) }),
4102
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-label", children: labels.annotation }),
4103
- /* @__PURE__ */ jsx7(SubmenuArrowIcon, {})
4321
+ return /* @__PURE__ */ jsxs8(Fragment3, { children: [
4322
+ /* @__PURE__ */ jsxs8("div", { className: `rvg-annotation-submenu is-${annotationPlacement}`, onMouseEnter: openAnnotation, onMouseLeave: () => setAnnotationOpen(false), children: [
4323
+ /* @__PURE__ */ jsxs8("button", { type: "button", role: "menuitem", className: "rvg-context-annotation-trigger", "aria-expanded": annotationOpen, children: [
4324
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "annotation" }) }),
4325
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-label", children: labels.annotation }),
4326
+ /* @__PURE__ */ jsx8(SubmenuArrowIcon, {})
4104
4327
  ] }),
4105
- annotationOpen && /* @__PURE__ */ jsxs7("div", { className: `rvg-annotation-panel is-${annotationPlacement}`, role: "menu", children: [
4106
- /* @__PURE__ */ jsxs7("div", { className: `rvg-annotation-types${annotationType === "corner" ? " is-corner" : ""}`, role: "group", "aria-label": labels.annotationMode, children: [
4107
- /* @__PURE__ */ jsx7("button", { type: "button", className: annotationType === "background" ? "is-active" : "", onClick: () => setAnnotationType("background"), children: labels.annotationBackground }),
4108
- /* @__PURE__ */ jsx7("button", { type: "button", className: annotationType === "corner" ? "is-active" : "", onClick: () => setAnnotationType("corner"), children: labels.annotationCorner })
4328
+ annotationOpen && /* @__PURE__ */ jsxs8("div", { className: `rvg-annotation-panel is-${annotationPlacement}`, role: "menu", children: [
4329
+ /* @__PURE__ */ jsxs8("div", { className: `rvg-annotation-types${annotationType === "corner" ? " is-corner" : ""}`, role: "group", "aria-label": labels.annotationMode, children: [
4330
+ /* @__PURE__ */ jsx8("button", { type: "button", className: annotationType === "background" ? "is-active" : "", onClick: () => setAnnotationType("background"), children: labels.annotationBackground }),
4331
+ /* @__PURE__ */ jsx8("button", { type: "button", className: annotationType === "corner" ? "is-active" : "", onClick: () => setAnnotationType("corner"), children: labels.annotationCorner })
4109
4332
  ] }),
4110
- /* @__PURE__ */ jsx7("div", { className: "rvg-annotation-colors", children: ANNOTATION_COLORS.map((color, index) => /* @__PURE__ */ jsx7("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)) }),
4111
- /* @__PURE__ */ jsx7(
4333
+ /* @__PURE__ */ jsx8("div", { className: "rvg-annotation-colors", children: ANNOTATION_COLORS.map((color, index) => /* @__PURE__ */ jsx8("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)) }),
4334
+ /* @__PURE__ */ jsx8(
4112
4335
  "textarea",
4113
4336
  {
4114
4337
  className: "rvg-annotation-content",
@@ -4120,16 +4343,16 @@ function TableInner({
4120
4343
  onChange: (event) => setAnnotationContent(event.target.value)
4121
4344
  }
4122
4345
  ),
4123
- /* @__PURE__ */ jsxs7("div", { className: "rvg-annotation-actions", children: [
4124
- /* @__PURE__ */ jsxs7("span", { children: [
4346
+ /* @__PURE__ */ jsxs8("div", { className: "rvg-annotation-actions", children: [
4347
+ /* @__PURE__ */ jsxs8("span", { children: [
4125
4348
  annotationContent.length,
4126
4349
  "/100"
4127
4350
  ] }),
4128
- /* @__PURE__ */ jsx7("button", { type: "button", onClick: saveAnnotation, children: labels.confirm })
4351
+ /* @__PURE__ */ jsx8("button", { type: "button", onClick: saveAnnotation, children: labels.confirm })
4129
4352
  ] })
4130
4353
  ] })
4131
4354
  ] }),
4132
- hasAnnotation && /* @__PURE__ */ jsxs7("button", { type: "button", role: "menuitem", onClick: () => {
4355
+ hasAnnotation && /* @__PURE__ */ jsxs8("button", { type: "button", role: "menuitem", onClick: () => {
4133
4356
  setCellAnnotations((current) => {
4134
4357
  const next = new Map(current);
4135
4358
  targetCells.forEach((cell) => next.delete(getKey(cell)));
@@ -4137,8 +4360,8 @@ function TableInner({
4137
4360
  });
4138
4361
  setContextMenu(null);
4139
4362
  }, children: [
4140
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "remove-annotation" }) }),
4141
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-label", children: labels.removeAnnotation })
4363
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "remove-annotation" }) }),
4364
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-label", children: labels.removeAnnotation })
4142
4365
  ] })
4143
4366
  ] });
4144
4367
  };
@@ -4210,7 +4433,7 @@ function TableInner({
4210
4433
  if (column.renderCell && !(editing?.rowIndex === rowIndex && editing.columnIndex === columnIndex)) {
4211
4434
  const row = rows[rowIndex];
4212
4435
  const value = column.dataIndex === void 0 ? void 0 : row[column.dataIndex];
4213
- return /* @__PURE__ */ jsx7(
4436
+ return /* @__PURE__ */ jsx8(
4214
4437
  "div",
4215
4438
  {
4216
4439
  className: `rvg-cell-render${selectedRowKeySet.has(getRowKey(row, rowIndex)) || selectedColumnKeySet.has(column.key) ? " is-axis-selected" : ""}`,
@@ -4238,12 +4461,12 @@ function TableInner({
4238
4461
  const headerTop = fixedHeader ? 0 : -currentScrollTop;
4239
4462
  const leafTop = headerTop + headerLeafTop;
4240
4463
  if (column.rowNumber) {
4241
- return /* @__PURE__ */ jsx7(
4464
+ return /* @__PURE__ */ jsx8(
4242
4465
  "div",
4243
4466
  {
4244
4467
  className: `rvg-header-title${isDropTarget ? " is-drop-target" : ""}`,
4245
4468
  style: { left, top: headerTop, width: metrics[columnIndex].width, height: headerHeight, justifyContent: "center", padding: 0, textAlign: "center" },
4246
- children: /* @__PURE__ */ jsx7("span", { children: column.title })
4469
+ children: /* @__PURE__ */ jsx8("span", { children: column.title })
4247
4470
  },
4248
4471
  column.key
4249
4472
  );
@@ -4252,12 +4475,12 @@ function TableInner({
4252
4475
  if (rowSelectionMode === "single" || column.rowSelectionIndicator === "arrow" || column.rowSelectionIndicator === "none") return null;
4253
4476
  const allSelected = rows.length > 0 && selectedRowKeySet.size === rows.length;
4254
4477
  const indeterminate = selectedRowKeySet.size > 0 && !allSelected;
4255
- return /* @__PURE__ */ jsx7(
4478
+ return /* @__PURE__ */ jsx8(
4256
4479
  "div",
4257
4480
  {
4258
4481
  className: "rvg-header-selection-icon",
4259
4482
  style: { left, top: headerTop, width: metrics[columnIndex].width, height: headerHeight },
4260
- children: /* @__PURE__ */ jsx7(SelectionIcon, { checked: allSelected, indeterminate })
4483
+ children: /* @__PURE__ */ jsx8(SelectionIcon, { checked: allSelected, indeterminate })
4261
4484
  },
4262
4485
  column.key
4263
4486
  );
@@ -4266,7 +4489,7 @@ function TableInner({
4266
4489
  const visibleActions = getVisibleHeaderActions(column, metrics[columnIndex].width, columnDraggable, measureHeaderTitleWidth(columnIndex), headerActionSlotWidth);
4267
4490
  const actionWidth = (Number(visibleActions.drag) + Number(visibleActions.filter) + Number(visibleActions.sort)) * headerActionSlotWidth;
4268
4491
  const isHeaderHovered = hoveredHeaderColumnIndex === columnIndex;
4269
- return /* @__PURE__ */ jsx7(
4492
+ return /* @__PURE__ */ jsx8(
4270
4493
  "div",
4271
4494
  {
4272
4495
  className: `rvg-header-title is-custom${isHeaderHovered ? " is-header-hovered" : ""}${isAxisSelected ? " is-axis-selected" : ""}${isDropTarget ? " is-drop-target" : ""}`,
@@ -4281,7 +4504,7 @@ function TableInner({
4281
4504
  justifyContent: column.align === "right" ? "flex-end" : column.align === "center" ? "center" : "flex-start",
4282
4505
  textAlign: column.align === "right" ? "right" : column.align === "center" ? "center" : "left"
4283
4506
  },
4284
- children: /* @__PURE__ */ jsx7(
4507
+ children: /* @__PURE__ */ jsx8(
4285
4508
  "span",
4286
4509
  {
4287
4510
  style: { width: "100%" },
@@ -4315,7 +4538,7 @@ function TableInner({
4315
4538
  const actionWidth = visibleActions ? (Number(visibleActions.drag) + Number(visibleActions.filter) + Number(visibleActions.sort)) * headerActionSlotWidth : columnDraggable && !cell.leaf ? headerActionSlotWidth : 0;
4316
4539
  const isDropTarget = Boolean(columnDropTarget && cell.endIndex >= columnDropTarget.startIndex && cell.startIndex <= columnDropTarget.endIndex);
4317
4540
  const isAxisSelected = cell.leaf && selectedColumnKeySet.has(column.key);
4318
- return /* @__PURE__ */ jsxs7(
4541
+ return /* @__PURE__ */ jsxs8(
4319
4542
  "div",
4320
4543
  {
4321
4544
  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" : ""}`,
@@ -4334,7 +4557,7 @@ function TableInner({
4334
4557
  textAlign: column.align === "right" ? "right" : column.align === "center" ? "center" : "left"
4335
4558
  },
4336
4559
  children: [
4337
- /* @__PURE__ */ jsx7(
4560
+ /* @__PURE__ */ jsx8(
4338
4561
  "span",
4339
4562
  {
4340
4563
  ref: (node) => {
@@ -4348,7 +4571,7 @@ function TableInner({
4348
4571
  children: column.renderHeader ? column.renderHeader(column) : column.title
4349
4572
  }
4350
4573
  ),
4351
- !cell.leaf && columnDraggable && /* @__PURE__ */ jsx7(
4574
+ !cell.leaf && columnDraggable && /* @__PURE__ */ jsx8(
4352
4575
  HeaderDragIcon,
4353
4576
  {
4354
4577
  className: `rvg-header-icon rvg-header-drag-icon${hoveredHeaderAction?.columnIndex === cell.startIndex && hoveredHeaderAction.action === "drag" ? " is-hovered" : ""}`,
@@ -4415,7 +4638,7 @@ function TableInner({
4415
4638
  "--rvg-corner-hover-height-extension": "4px"
4416
4639
  } : null
4417
4640
  } : void 0;
4418
- useLayoutEffect2(() => {
4641
+ useLayoutEffect3(() => {
4419
4642
  syncSelectionEdgeTarget(scrollPosition.left, scrollPosition.top);
4420
4643
  }, [scrollPosition.left, scrollPosition.top, syncSelectionEdgeTarget]);
4421
4644
  const handleContextMenu = (event) => {
@@ -4450,7 +4673,7 @@ function TableInner({
4450
4673
  if (override?.render !== void 0 || override?.childrens !== void 0) {
4451
4674
  return renderContextMenuSubmenu(key, context, override?.label ?? label, override, icon, disabled, danger);
4452
4675
  }
4453
- return /* @__PURE__ */ jsxs7(
4676
+ return /* @__PURE__ */ jsxs8(
4454
4677
  "button",
4455
4678
  {
4456
4679
  type: "button",
@@ -4464,9 +4687,9 @@ function TableInner({
4464
4687
  setContextMenu(null);
4465
4688
  },
4466
4689
  children: [
4467
- icon && /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-icon", children: icon }),
4468
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-label", children: override?.label ?? label }),
4469
- override?.shortcut && /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-shortcut", children: override.shortcut })
4690
+ icon && /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-icon", children: icon }),
4691
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-label", children: override?.label ?? label }),
4692
+ override?.shortcut && /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-shortcut", children: override.shortcut })
4470
4693
  ]
4471
4694
  },
4472
4695
  key
@@ -4485,20 +4708,20 @@ function TableInner({
4485
4708
  }
4486
4709
  const node = renderCustomContextMenuItem(child, context);
4487
4710
  if (!node) return null;
4488
- const wrapped = /* @__PURE__ */ jsxs7(Fragment2, { children: [
4489
- separatorPending && /* @__PURE__ */ jsx7("div", { className: "rvg-context-separator" }),
4711
+ const wrapped = /* @__PURE__ */ jsxs8(Fragment2, { children: [
4712
+ separatorPending && /* @__PURE__ */ jsx8("div", { className: "rvg-context-separator" }),
4490
4713
  node
4491
4714
  ] }, child.key);
4492
4715
  separatorPending = false;
4493
4716
  return wrapped;
4494
4717
  });
4495
- return /* @__PURE__ */ jsxs7("div", { className: "rvg-context-submenu", children: [
4496
- /* @__PURE__ */ jsxs7("button", { type: "button", role: "menuitem", className: danger ? "rvg-context-danger" : void 0, disabled, "aria-haspopup": "menu", children: [
4497
- icon && /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-icon", children: icon }),
4498
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-label", children: label }),
4499
- /* @__PURE__ */ jsx7(SubmenuArrowIcon, {})
4718
+ return /* @__PURE__ */ jsxs8("div", { className: "rvg-context-submenu", children: [
4719
+ /* @__PURE__ */ jsxs8("button", { type: "button", role: "menuitem", className: danger ? "rvg-context-danger" : void 0, disabled, "aria-haspopup": "menu", children: [
4720
+ icon && /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-icon", children: icon }),
4721
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-label", children: label }),
4722
+ /* @__PURE__ */ jsx8(SubmenuArrowIcon, {})
4500
4723
  ] }),
4501
- /* @__PURE__ */ jsx7("div", { className: "rvg-context-submenu-panel", role: "menu", children: content })
4724
+ /* @__PURE__ */ jsx8("div", { className: "rvg-context-submenu-panel", role: "menu", children: content })
4502
4725
  ] }, key);
4503
4726
  };
4504
4727
  const renderConfiguredContextMenu = (items, context, renderBuiltin) => {
@@ -4515,10 +4738,10 @@ function TableInner({
4515
4738
  const node = renderBuiltin(key, override) ?? (override ? renderCustomContextMenuItem(override, context) : null);
4516
4739
  if (!node) return;
4517
4740
  if (separatorPending) {
4518
- nodes.push(/* @__PURE__ */ jsx7("div", { className: "rvg-context-separator" }, `separator:${index}`));
4741
+ nodes.push(/* @__PURE__ */ jsx8("div", { className: "rvg-context-separator" }, `separator:${index}`));
4519
4742
  separatorPending = false;
4520
4743
  }
4521
- nodes.push(/* @__PURE__ */ jsx7(Fragment2, { children: node }, typeof item === "string" ? `${item}:${index}` : item.key));
4744
+ nodes.push(/* @__PURE__ */ jsx8(Fragment2, { children: node }, typeof item === "string" ? `${item}:${index}` : item.key));
4522
4745
  });
4523
4746
  return nodes;
4524
4747
  };
@@ -4528,8 +4751,8 @@ function TableInner({
4528
4751
  const hasSummaryValue = summaryValues.has(column.key);
4529
4752
  const summaryContent = hasSummaryValue ? summaryValues.get(column.key) : summaryEmptyValue;
4530
4753
  const showSummarySkeleton = Boolean(column.summary) && summaryPending;
4531
- const content = columnIndex === 0 ? language === "zh-CN" ? "\u5408\u8BA1" : "Total" : showSummarySkeleton ? /* @__PURE__ */ jsx7("span", { className: "rvg-summary-skeleton" }) : summaryContent;
4532
- return /* @__PURE__ */ jsx7(
4754
+ const content = columnIndex === 0 ? language === "zh-CN" ? "\u5408\u8BA1" : "Total" : showSummarySkeleton ? /* @__PURE__ */ jsx8("span", { className: "rvg-summary-skeleton" }) : summaryContent;
4755
+ return /* @__PURE__ */ jsx8(
4533
4756
  "div",
4534
4757
  {
4535
4758
  className: `rvg-summary-cell${isUtility ? " is-utility" : ""}${column.summary ? " is-summary" : ""}${summaryVerticalBordered ? "" : " is-borderless"}`,
@@ -4631,9 +4854,9 @@ function TableInner({
4631
4854
  const draggingSelectedColumn = Boolean(
4632
4855
  columnDragPreview && selectedColumnKeySet.has(columns[columnDragPreview.sourceIndex]?.key)
4633
4856
  );
4634
- return /* @__PURE__ */ jsxs7("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: [
4635
- /* @__PURE__ */ jsxs7("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: [
4636
- /* @__PURE__ */ jsx7(
4857
+ return /* @__PURE__ */ jsxs8("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: [
4858
+ /* @__PURE__ */ jsxs8("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: [
4859
+ /* @__PURE__ */ jsx8(
4637
4860
  "canvas",
4638
4861
  {
4639
4862
  ref: canvasRef,
@@ -4871,48 +5094,48 @@ function TableInner({
4871
5094
  onContextMenu: handleContextMenu
4872
5095
  }
4873
5096
  ),
4874
- /* @__PURE__ */ jsxs7("div", { className: "rvg-text-layer", style: { width: viewport.width, height: renderHeight, marginTop: -renderHeight }, onContextMenu: handleContextMenu, children: [
4875
- /* @__PURE__ */ jsx7("div", { className: "rvg-text-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ jsxs7(
5097
+ /* @__PURE__ */ jsxs8("div", { className: "rvg-text-layer", style: { width: viewport.width, height: renderHeight, marginTop: -renderHeight }, onContextMenu: handleContextMenu, children: [
5098
+ /* @__PURE__ */ jsx8("div", { className: "rvg-text-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ jsxs8(
4876
5099
  "div",
4877
5100
  {
4878
5101
  ref: scrollingTextRef,
4879
5102
  className: "rvg-text-scroll-content",
4880
5103
  style: { left: -fixedWidth, width: contentWidth, transform: `translateX(${-currentScroll.left}px)` },
4881
5104
  children: [
4882
- columns.map((column, columnIndex) => column.fixed || columnIndex >= utilityColumnCount && headerDepth > 1 ? null : columnIndex >= domRange.columnStart && columnIndex < domRange.columnEnd ? /* @__PURE__ */ jsx7("span", { children: renderHeaderTitle(columnIndex, getScrollableColumnLeft(columnIndex)) }, column.key) : null),
5105
+ columns.map((column, columnIndex) => column.fixed || columnIndex >= utilityColumnCount && headerDepth > 1 ? null : columnIndex >= domRange.columnStart && columnIndex < domRange.columnEnd ? /* @__PURE__ */ jsx8("span", { children: renderHeaderTitle(columnIndex, getScrollableColumnLeft(columnIndex)) }, column.key) : null),
4883
5106
  headerCells.map((cell) => {
4884
5107
  if (columns[cell.startIndex]?.fixed) return null;
4885
5108
  if (cell.endIndex < domRange.columnStart || cell.startIndex >= domRange.columnEnd) return null;
4886
5109
  return renderGroupedHeaderCell(cell);
4887
5110
  }),
4888
- /* @__PURE__ */ jsx7("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) => {
5111
+ /* @__PURE__ */ jsx8("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) => {
4889
5112
  if (column.fixed || columnIndex < domRange.columnStart || columnIndex >= domRange.columnEnd) return null;
4890
5113
  return renderCellText(rowIndex, columnIndex, getScrollableColumnLeft(columnIndex));
4891
5114
  })) })
4892
5115
  ]
4893
5116
  }
4894
5117
  ) }),
4895
- /* @__PURE__ */ jsx7("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) => {
5118
+ /* @__PURE__ */ jsx8("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) => {
4896
5119
  if (!column.fixed) return null;
4897
5120
  const left = column.fixed === "left" ? leftFixedOffsets.get(columnIndex) ?? 0 : viewport.width - (rightFixedOffsets.get(columnIndex) ?? 0) - metrics[columnIndex].width;
4898
5121
  return renderCellText(rowIndex, columnIndex, left);
4899
5122
  })) }),
4900
5123
  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),
4901
5124
  headerCells.map((cell) => columns[cell.startIndex]?.fixed ? renderGroupedHeaderCell(cell) : null),
4902
- fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ jsx7("div", { className: "rvg-text-fixed-shadow is-left", style: { left: fixedWidth } }),
4903
- rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ jsx7("div", { className: "rvg-text-fixed-shadow is-right", style: { right: rightFixedWidth } }),
4904
- hasVerticalBorders && fixedWidth > 0 && /* @__PURE__ */ jsx7("div", { className: "rvg-text-fixed-border is-left", style: { left: fixedWidth - 1 } }),
4905
- hasVerticalBorders && rightFixedWidth > 0 && /* @__PURE__ */ jsx7("div", { className: "rvg-text-fixed-border is-right", style: { right: rightFixedWidth } })
5125
+ fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ jsx8("div", { className: "rvg-text-fixed-shadow is-left", style: { left: fixedWidth } }),
5126
+ rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ jsx8("div", { className: "rvg-text-fixed-shadow is-right", style: { right: rightFixedWidth } }),
5127
+ hasVerticalBorders && fixedWidth > 0 && /* @__PURE__ */ jsx8("div", { className: "rvg-text-fixed-border is-left", style: { left: fixedWidth - 1 } }),
5128
+ hasVerticalBorders && rightFixedWidth > 0 && /* @__PURE__ */ jsx8("div", { className: "rvg-text-fixed-border is-right", style: { right: rightFixedWidth } })
4906
5129
  ] }),
4907
- /* @__PURE__ */ jsx7("div", { className: "rvg-spacer", style: { width: contentWidth, height: contentHeight + bodyTop, marginTop: -renderHeight } })
5130
+ /* @__PURE__ */ jsx8("div", { className: "rvg-spacer", style: { width: contentWidth, height: contentHeight + bodyTop, marginTop: -renderHeight } })
4908
5131
  ] }),
4909
- hasSummaryRow && /* @__PURE__ */ jsxs7(
5132
+ hasSummaryRow && /* @__PURE__ */ jsxs8(
4910
5133
  "div",
4911
5134
  {
4912
5135
  className: `rvg-summary-row is-${summaryPosition}${hasVerticalBorders ? "" : " is-vertical-borderless"}`,
4913
5136
  style: { height: rowHeight, top: summaryPosition === "top" ? fixedHeader ? headerHeight : headerHeight - currentScroll.top : void 0 },
4914
5137
  children: [
4915
- /* @__PURE__ */ jsx7("div", { className: "rvg-summary-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ jsx7(
5138
+ /* @__PURE__ */ jsx8("div", { className: "rvg-summary-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ jsx8(
4916
5139
  "div",
4917
5140
  {
4918
5141
  className: "rvg-summary-scroll-content",
@@ -4920,41 +5143,41 @@ function TableInner({
4920
5143
  children: columns.map((column, columnIndex) => column.fixed ? null : renderSummaryCell(columnIndex, getScrollableColumnLeft(columnIndex)))
4921
5144
  }
4922
5145
  ) }),
4923
- /* @__PURE__ */ jsxs7("div", { className: "rvg-summary-fixed-layer", children: [
5146
+ /* @__PURE__ */ jsxs8("div", { className: "rvg-summary-fixed-layer", children: [
4924
5147
  columns.map((column, columnIndex) => column.fixed === "left" ? renderSummaryCell(columnIndex, leftFixedOffsets.get(columnIndex) ?? 0) : null),
4925
5148
  columns.map((column, columnIndex) => column.fixed === "right" ? renderSummaryCell(columnIndex, viewport.width - (rightFixedOffsets.get(columnIndex) ?? 0) - metrics[columnIndex].width) : null)
4926
5149
  ] }),
4927
- fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ jsx7("div", { className: "rvg-summary-fixed-shadow is-left", style: { left: fixedWidth } }),
4928
- rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ jsx7("div", { className: "rvg-summary-fixed-shadow is-right", style: { right: rightFixedWidth } }),
4929
- summaryVerticalBordered && fixedWidth > 0 && /* @__PURE__ */ jsx7("div", { className: "rvg-summary-fixed-border is-left", style: { left: fixedWidth - 1 } }),
4930
- summaryVerticalBordered && rightFixedWidth > 0 && /* @__PURE__ */ jsx7("div", { className: "rvg-summary-fixed-border is-right", style: { right: rightFixedWidth } })
5150
+ fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ jsx8("div", { className: "rvg-summary-fixed-shadow is-left", style: { left: fixedWidth } }),
5151
+ rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ jsx8("div", { className: "rvg-summary-fixed-shadow is-right", style: { right: rightFixedWidth } }),
5152
+ summaryVerticalBordered && fixedWidth > 0 && /* @__PURE__ */ jsx8("div", { className: "rvg-summary-fixed-border is-left", style: { left: fixedWidth - 1 } }),
5153
+ summaryVerticalBordered && rightFixedWidth > 0 && /* @__PURE__ */ jsx8("div", { className: "rvg-summary-fixed-border is-right", style: { right: rightFixedWidth } })
4931
5154
  ]
4932
5155
  }
4933
5156
  ),
4934
- /* @__PURE__ */ jsxs7("div", { ref: headerIconsRef, className: "rvg-header-icons", style: { height: headerHeight, transform: `translateY(${fixedHeader ? 0 : -scrollRef.current.top}px)` }, children: [
4935
- /* @__PURE__ */ jsx7("div", { className: "rvg-header-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ jsx7(
5157
+ /* @__PURE__ */ jsxs8("div", { ref: headerIconsRef, className: "rvg-header-icons", style: { height: headerHeight, transform: `translateY(${fixedHeader ? 0 : -scrollRef.current.top}px)` }, children: [
5158
+ /* @__PURE__ */ jsx8("div", { className: "rvg-header-scroll-clip", style: { left: fixedWidth, right: rightFixedWidth }, children: /* @__PURE__ */ jsx8(
4936
5159
  "div",
4937
5160
  {
4938
5161
  ref: scrollingHeaderIconsRef,
4939
5162
  className: "rvg-header-icon-layer rvg-header-icon-layer-scroll",
4940
5163
  style: { left: -fixedWidth, width: contentWidth, transform: `translateX(${-scrollRef.current.left}px)` },
4941
- children: columns.map((column, index) => column.fixed ? null : /* @__PURE__ */ jsx7("span", { children: renderHeaderIcons(index, getScrollableColumnLeft(index)) }, column.key))
5164
+ children: columns.map((column, index) => column.fixed ? null : /* @__PURE__ */ jsx8("span", { children: renderHeaderIcons(index, getScrollableColumnLeft(index)) }, column.key))
4942
5165
  }
4943
5166
  ) }),
4944
- /* @__PURE__ */ jsxs7("div", { className: "rvg-header-icon-layer", children: [
4945
- columns.map((column, index) => column.fixed === "left" ? /* @__PURE__ */ jsx7("span", { children: renderHeaderIcons(index, leftFixedOffsets.get(index) ?? 0) }, column.key) : null),
4946
- columns.map((column, index) => column.fixed === "right" ? /* @__PURE__ */ jsx7("span", { children: renderHeaderIcons(index, viewport.width - (rightFixedOffsets.get(index) ?? 0) - metrics[index].width) }, column.key) : null)
5167
+ /* @__PURE__ */ jsxs8("div", { className: "rvg-header-icon-layer", children: [
5168
+ columns.map((column, index) => column.fixed === "left" ? /* @__PURE__ */ jsx8("span", { children: renderHeaderIcons(index, leftFixedOffsets.get(index) ?? 0) }, column.key) : null),
5169
+ columns.map((column, index) => column.fixed === "right" ? /* @__PURE__ */ jsx8("span", { children: renderHeaderIcons(index, viewport.width - (rightFixedOffsets.get(index) ?? 0) - metrics[index].width) }, column.key) : null)
4947
5170
  ] })
4948
5171
  ] }),
4949
- hasVerticalBorders && trailingColumnBorderLeft !== null && /* @__PURE__ */ jsx7(
5172
+ hasVerticalBorders && trailingColumnBorderLeft !== null && /* @__PURE__ */ jsx8(
4950
5173
  "div",
4951
5174
  {
4952
5175
  className: "rvg-trailing-column-border",
4953
5176
  style: { left: trailingColumnBorderLeft, height: renderHeight }
4954
5177
  }
4955
5178
  ),
4956
- headerTooltip && /* @__PURE__ */ jsx7("div", { className: `rvg-header-tooltip is-${headerTooltip.placement}`, role: "tooltip", style: { left: headerTooltip.left, top: headerTooltip.top }, children: headerTooltip.label }),
4957
- hoveredCellTooltip && /* @__PURE__ */ jsx7(
5179
+ headerTooltip && /* @__PURE__ */ jsx8("div", { className: `rvg-header-tooltip is-${headerTooltip.placement}`, role: "tooltip", style: { left: headerTooltip.left, top: headerTooltip.top }, children: headerTooltip.label }),
5180
+ hoveredCellTooltip && /* @__PURE__ */ jsx8(
4958
5181
  "div",
4959
5182
  {
4960
5183
  className: `rvg-cell-tooltip${hoveredCellTooltip.annotation ? " is-annotation" : ` is-${hoveredCellTooltip.placement ?? "right"}`}`,
@@ -4976,7 +5199,7 @@ function TableInner({
4976
5199
  children: hoveredCellTooltip.label
4977
5200
  }
4978
5201
  ),
4979
- rangeHandlePosition && /* @__PURE__ */ jsx7(
5202
+ rangeHandlePosition && /* @__PURE__ */ jsx8(
4980
5203
  "div",
4981
5204
  {
4982
5205
  className: "rvg-range-handle",
@@ -5000,8 +5223,8 @@ function TableInner({
5000
5223
  }
5001
5224
  }
5002
5225
  ),
5003
- selectionOutlineStyle && /* @__PURE__ */ jsx7("div", { ref: selectionFocusRef, className: "rvg-selection-focus", style: selectionOutlineStyle, "aria-hidden": "true" }),
5004
- selectionEdgeIndicator && selection && /* @__PURE__ */ jsx7(
5226
+ selectionOutlineStyle && /* @__PURE__ */ jsx8("div", { ref: selectionFocusRef, className: "rvg-selection-focus", style: selectionOutlineStyle, "aria-hidden": "true" }),
5227
+ selectionEdgeIndicator && selection && /* @__PURE__ */ jsx8(
5005
5228
  "button",
5006
5229
  {
5007
5230
  ref: selectionEdgeTargetRef,
@@ -5019,10 +5242,10 @@ function TableInner({
5019
5242
  scrollerRef.current?.focus({ preventScroll: true });
5020
5243
  revealCell(selection);
5021
5244
  },
5022
- children: /* @__PURE__ */ jsx7("span", { className: "rvg-selection-edge-halo", "aria-hidden": "true", children: /* @__PURE__ */ jsx7("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx7("path", { d: "M 0 100 L 0 0 L 100 0" }) }) })
5245
+ children: /* @__PURE__ */ jsx8("span", { className: "rvg-selection-edge-halo", "aria-hidden": "true", children: /* @__PURE__ */ jsx8("svg", { viewBox: "0 0 100 100", preserveAspectRatio: "none", children: /* @__PURE__ */ jsx8("path", { d: "M 0 100 L 0 0 L 100 0" }) }) })
5023
5246
  }
5024
5247
  ),
5025
- contextMenu && /* @__PURE__ */ jsx7("div", { ref: contextMenuRef, className: "rvg-context-menu", role: "menu", style: { left: contextMenu.left, top: contextMenu.top }, children: contextMenu.type === "header" ? (() => {
5248
+ contextMenu && /* @__PURE__ */ jsx8("div", { ref: contextMenuRef, className: "rvg-context-menu", role: "menu", style: { left: contextMenu.left, top: contextMenu.top }, children: contextMenu.type === "header" ? (() => {
5026
5249
  const column = columns[contextMenu.columnIndex];
5027
5250
  const headerContext = { column, columnIndex: contextMenu.columnIndex };
5028
5251
  return renderConfiguredContextMenu(resolveContextMenuSection(customContextMenuConfig?.header, DEFAULT_HEADER_CONTEXT_MENU), headerContext, (item, override) => {
@@ -5033,12 +5256,12 @@ function TableInner({
5033
5256
  } catch {
5034
5257
  showToast("error", labels.copyError);
5035
5258
  }
5036
- }, override, { icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "copy" }) });
5259
+ }, override, { icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "copy" }) });
5037
5260
  if (item === "select-column") {
5038
5261
  if (!columnSelection) return null;
5039
5262
  return renderContextMenuButton("header-select-column", headerContext, selectedColumnKeySet.has(column.key) ? labels.deselectColumn : labels.selectColumn, () => {
5040
5263
  toggleColumnFromMenu(contextMenu.columnIndex);
5041
- }, override, { icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "select-column" }) });
5264
+ }, override, { icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "select-column" }) });
5042
5265
  }
5043
5266
  return null;
5044
5267
  });
@@ -5059,7 +5282,7 @@ function TableInner({
5059
5282
  } catch {
5060
5283
  showToast("error", labels.copyError);
5061
5284
  }
5062
- }, override, { icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "copy" }) });
5285
+ }, override, { icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "copy" }) });
5063
5286
  if (item === "annotation") return renderAnnotationControls(rangeCells);
5064
5287
  if (item === "undo") {
5065
5288
  const changedCells = rangeCells.flatMap((cell) => {
@@ -5086,7 +5309,7 @@ function TableInner({
5086
5309
  });
5087
5310
  onCellChange?.({ ...cell, row, previousValue, value });
5088
5311
  });
5089
- }, override, { disabled: !onCellChange, icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "undo" }) });
5312
+ }, override, { disabled: !onCellChange, icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "undo" }) });
5090
5313
  }
5091
5314
  if (item === "clear") {
5092
5315
  const hasClearableCell = rangeCells.some((cell) => {
@@ -5103,7 +5326,7 @@ function TableInner({
5103
5326
  markCellEdited(cell, row[column.dataIndex], "");
5104
5327
  onCellChange?.({ ...cell, row, previousValue: row[column.dataIndex], value: "" });
5105
5328
  });
5106
- }, override, { disabled: !onCellChange, icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "clear" }) });
5329
+ }, override, { disabled: !onCellChange, icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "clear" }) });
5107
5330
  }
5108
5331
  return null;
5109
5332
  });
@@ -5121,7 +5344,7 @@ function TableInner({
5121
5344
  const affectedRows = selectedIndices.includes(cell.rowIndex) ? selectedIndices : [cell.rowIndex];
5122
5345
  const cellContext = { ...cell, row, column, value: dataIndex === void 0 ? void 0 : row[dataIndex] };
5123
5346
  return renderConfiguredContextMenu(resolveContextMenuSection(customContextMenuConfig?.cell, DEFAULT_CELL_CONTEXT_MENU), cellContext, (item, override) => {
5124
- if (item === "edit") return renderContextMenuButton("cell-edit", cellContext, labels.edit, () => beginEdit(cell), override, { disabled: !isCellEditable(cell), icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "edit" }) });
5347
+ if (item === "edit") return renderContextMenuButton("cell-edit", cellContext, labels.edit, () => beginEdit(cell), override, { disabled: !isCellEditable(cell), icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "edit" }) });
5125
5348
  if (item === "copy") return renderContextMenuButton("cell-copy", cellContext, labels.copyContent, async () => {
5126
5349
  try {
5127
5350
  await navigator.clipboard.writeText(getCellLabel(cell.rowIndex, cell.columnIndex));
@@ -5129,20 +5352,20 @@ function TableInner({
5129
5352
  } catch {
5130
5353
  showToast("error", labels.copyError);
5131
5354
  }
5132
- }, override, { icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "copy" }) });
5355
+ }, override, { icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "copy" }) });
5133
5356
  if (item === "undo") return renderContextMenuButton("cell-undo", cellContext, labels.undoChange, () => {
5134
5357
  if (dataIndex === void 0 || originalValue === void 0) return;
5135
5358
  const previousValue = row[dataIndex];
5136
5359
  const value = typeof previousValue === "number" && originalValue !== "" ? Number(originalValue) : originalValue;
5137
5360
  setConfirmAction({ type: "undo", cell, row, dataIndex, previousValue, value });
5138
- }, override, { disabled: !onCellChange || dataIndex === void 0 || originalValue === void 0, icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "undo" }) });
5361
+ }, override, { disabled: !onCellChange || dataIndex === void 0 || originalValue === void 0, icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "undo" }) });
5139
5362
  if (item === "clear") {
5140
5363
  if (dataIndex === void 0 || isEmptyCellValue(row[dataIndex])) return null;
5141
5364
  return renderContextMenuButton("cell-clear", cellContext, labels.clearContent, () => {
5142
5365
  if (dataIndex === void 0) return;
5143
5366
  const previousValue = row[dataIndex];
5144
5367
  setConfirmAction({ type: "clear", cell, row, dataIndex, previousValue });
5145
- }, override, { disabled: !onCellChange || dataIndex === void 0, danger: true, icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "clear" }) });
5368
+ }, override, { disabled: !onCellChange || dataIndex === void 0, danger: true, icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "clear" }) });
5146
5369
  }
5147
5370
  if (item === "annotation") return renderAnnotationControls([cell]);
5148
5371
  if (item === "select-row") {
@@ -5152,54 +5375,54 @@ function TableInner({
5152
5375
  setSelection(null);
5153
5376
  if (selectedRowKeySet.has(cell.rowKey)) setRowKeys(rowKeys.filter((key) => key !== cell.rowKey));
5154
5377
  else setRowKeys(rowSelectionMode === "single" ? [cell.rowKey] : [...rowKeys, cell.rowKey]);
5155
- }, override, { icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "select-row" }) });
5378
+ }, override, { icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "select-row" }) });
5156
5379
  }
5157
5380
  if (item === "select-column") {
5158
5381
  if (!columnSelection) return null;
5159
5382
  return renderContextMenuButton("cell-select-column", cellContext, selectedColumnKeySet.has(cell.columnKey) ? labels.deselectColumn : labels.selectColumn, () => {
5160
5383
  toggleColumnFromMenu(cell.columnIndex);
5161
- }, override, { icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "select-column" }) });
5384
+ }, override, { icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "select-column" }) });
5162
5385
  }
5163
- if (item === "insert-above") return /* @__PURE__ */ jsxs7("div", { className: "rvg-context-insert", children: [
5164
- /* @__PURE__ */ jsxs7("button", { type: "button", role: "menuitem", disabled: !onInsertRows, onClick: () => {
5386
+ if (item === "insert-above") return /* @__PURE__ */ jsxs8("div", { className: "rvg-context-insert", children: [
5387
+ /* @__PURE__ */ jsxs8("button", { type: "button", role: "menuitem", disabled: !onInsertRows, onClick: () => {
5165
5388
  void insertRowsOptimistically(cell, "before", insertCounts.before);
5166
5389
  }, children: [
5167
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "insert-above" }) }),
5168
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-label", children: labels.insertAbove })
5390
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "insert-above" }) }),
5391
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-label", children: labels.insertAbove })
5169
5392
  ] }),
5170
- /* @__PURE__ */ jsx7("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))) })) }),
5171
- /* @__PURE__ */ jsx7("span", { children: labels.rowUnit })
5393
+ /* @__PURE__ */ jsx8("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))) })) }),
5394
+ /* @__PURE__ */ jsx8("span", { children: labels.rowUnit })
5172
5395
  ] });
5173
- if (item === "insert-below") return /* @__PURE__ */ jsxs7("div", { className: "rvg-context-insert", children: [
5174
- /* @__PURE__ */ jsxs7("button", { type: "button", role: "menuitem", disabled: !onInsertRows, onClick: () => {
5396
+ if (item === "insert-below") return /* @__PURE__ */ jsxs8("div", { className: "rvg-context-insert", children: [
5397
+ /* @__PURE__ */ jsxs8("button", { type: "button", role: "menuitem", disabled: !onInsertRows, onClick: () => {
5175
5398
  void insertRowsOptimistically(cell, "after", insertCounts.after);
5176
5399
  }, children: [
5177
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "insert-below" }) }),
5178
- /* @__PURE__ */ jsx7("span", { className: "rvg-context-menu-label", children: labels.insertBelow })
5400
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-icon", children: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "insert-below" }) }),
5401
+ /* @__PURE__ */ jsx8("span", { className: "rvg-context-menu-label", children: labels.insertBelow })
5179
5402
  ] }),
5180
- /* @__PURE__ */ jsx7("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))) })) }),
5181
- /* @__PURE__ */ jsx7("span", { children: labels.rowUnit })
5403
+ /* @__PURE__ */ jsx8("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))) })) }),
5404
+ /* @__PURE__ */ jsx8("span", { children: labels.rowUnit })
5182
5405
  ] });
5183
5406
  if (item === "move-up") {
5184
5407
  if (!rowDraggable) return null;
5185
- return renderContextMenuButton("cell-move-up", cellContext, labels.moveUp, () => applyRowOrder(cell.rowIndex, cell.rowIndex - 1), override, { disabled: cell.rowIndex === 0, icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "move-up" }) });
5408
+ return renderContextMenuButton("cell-move-up", cellContext, labels.moveUp, () => applyRowOrder(cell.rowIndex, cell.rowIndex - 1), override, { disabled: cell.rowIndex === 0, icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "move-up" }) });
5186
5409
  }
5187
5410
  if (item === "move-down") {
5188
5411
  if (!rowDraggable) return null;
5189
- return renderContextMenuButton("cell-move-down", cellContext, labels.moveDown, () => applyRowOrder(cell.rowIndex, cell.rowIndex + 1), override, { disabled: cell.rowIndex === rows.length - 1, icon: /* @__PURE__ */ jsx7(ContextMenuIcon, { type: "move-down" }) });
5412
+ return renderContextMenuButton("cell-move-down", cellContext, labels.moveDown, () => applyRowOrder(cell.rowIndex, cell.rowIndex + 1), override, { disabled: cell.rowIndex === rows.length - 1, icon: /* @__PURE__ */ jsx8(ContextMenuIcon, { type: "move-down" }) });
5190
5413
  }
5191
- 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__ */ jsx7(ContextMenuIcon, { type: "delete" }) });
5414
+ 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__ */ jsx8(ContextMenuIcon, { type: "delete" }) });
5192
5415
  return null;
5193
5416
  });
5194
5417
  })() }),
5195
- confirmAction && /* @__PURE__ */ jsx7("div", { className: "rvg-confirm-backdrop", role: "presentation", onMouseDown: (event) => {
5418
+ confirmAction && /* @__PURE__ */ jsx8("div", { className: "rvg-confirm-backdrop", role: "presentation", onMouseDown: (event) => {
5196
5419
  if (!confirmLoading && event.target === event.currentTarget) setConfirmAction(null);
5197
- }, children: /* @__PURE__ */ jsxs7("div", { className: "rvg-confirm", role: "alertdialog", "aria-modal": "true", "aria-labelledby": "rvg-delete-title", children: [
5198
- /* @__PURE__ */ jsx7("strong", { id: "rvg-delete-title", children: confirmAction.type === "undo" ? labels.undoConfirmTitle : confirmAction.type === "clear" ? labels.clearConfirmTitle : labels.deleteConfirmTitle }),
5199
- /* @__PURE__ */ jsx7("p", { children: confirmAction.type === "undo" ? labels.undoConfirmDescription : confirmAction.type === "clear" ? labels.clearConfirmDescription : labels.deleteConfirmDescription(confirmAction.rows.length) }),
5200
- /* @__PURE__ */ jsxs7("div", { className: "rvg-confirm-actions", children: [
5201
- /* @__PURE__ */ jsx7("button", { type: "button", disabled: confirmLoading, onClick: () => setConfirmAction(null), children: labels.cancel }),
5202
- /* @__PURE__ */ jsxs7("button", { type: "button", className: "rvg-confirm-danger", disabled: confirmLoading, autoFocus: true, onClick: () => {
5420
+ }, children: /* @__PURE__ */ jsxs8("div", { className: "rvg-confirm", role: "alertdialog", "aria-modal": "true", "aria-labelledby": "rvg-delete-title", children: [
5421
+ /* @__PURE__ */ jsx8("strong", { id: "rvg-delete-title", children: confirmAction.type === "undo" ? labels.undoConfirmTitle : confirmAction.type === "clear" ? labels.clearConfirmTitle : labels.deleteConfirmTitle }),
5422
+ /* @__PURE__ */ jsx8("p", { children: confirmAction.type === "undo" ? labels.undoConfirmDescription : confirmAction.type === "clear" ? labels.clearConfirmDescription : labels.deleteConfirmDescription(confirmAction.rows.length) }),
5423
+ /* @__PURE__ */ jsxs8("div", { className: "rvg-confirm-actions", children: [
5424
+ /* @__PURE__ */ jsx8("button", { type: "button", disabled: confirmLoading, onClick: () => setConfirmAction(null), children: labels.cancel }),
5425
+ /* @__PURE__ */ jsxs8("button", { type: "button", className: "rvg-confirm-danger", disabled: confirmLoading, autoFocus: true, onClick: () => {
5203
5426
  if (confirmLoading) return;
5204
5427
  flushSync(() => setConfirmLoading(true));
5205
5428
  window.requestAnimationFrame(async () => {
@@ -5252,13 +5475,13 @@ function TableInner({
5252
5475
  }
5253
5476
  });
5254
5477
  }, children: [
5255
- confirmLoading && /* @__PURE__ */ jsx7(LoadingSpinnerIcon, {}),
5478
+ confirmLoading && /* @__PURE__ */ jsx8(LoadingSpinnerIcon, {}),
5256
5479
  confirmAction.type === "undo" ? labels.undoChange : confirmAction.type === "clear" ? labels.clear : labels.delete
5257
5480
  ] })
5258
5481
  ] })
5259
5482
  ] }) }),
5260
- toast && /* @__PURE__ */ jsx7("div", { className: `rvg-toast is-${toast.type}`, role: "status", children: toast.message }),
5261
- /* @__PURE__ */ jsx7(
5483
+ toast && /* @__PURE__ */ jsx8("div", { className: `rvg-toast is-${toast.type}`, role: "status", children: toast.message }),
5484
+ /* @__PURE__ */ jsx8(
5262
5485
  "div",
5263
5486
  {
5264
5487
  ref: verticalScrollbarRef,
@@ -5269,10 +5492,10 @@ function TableInner({
5269
5492
  onPointerMove: handleVerticalScrollbarPointerMove,
5270
5493
  onPointerUp: handleVerticalScrollbarPointerUp,
5271
5494
  onPointerCancel: handleVerticalScrollbarPointerUp,
5272
- children: /* @__PURE__ */ jsx7("div", { ref: verticalScrollbarThumbRef, className: "rvg-vertical-scrollbar-thumb" })
5495
+ children: /* @__PURE__ */ jsx8("div", { ref: verticalScrollbarThumbRef, className: "rvg-vertical-scrollbar-thumb" })
5273
5496
  }
5274
5497
  ),
5275
- /* @__PURE__ */ jsx7(
5498
+ /* @__PURE__ */ jsx8(
5276
5499
  "div",
5277
5500
  {
5278
5501
  ref: horizontalScrollbarRef,
@@ -5283,11 +5506,11 @@ function TableInner({
5283
5506
  onPointerMove: handleHorizontalScrollbarPointerMove,
5284
5507
  onPointerUp: handleHorizontalScrollbarPointerUp,
5285
5508
  onPointerCancel: handleHorizontalScrollbarPointerUp,
5286
- children: /* @__PURE__ */ jsx7("div", { ref: horizontalScrollbarThumbRef, className: "rvg-horizontal-scrollbar-thumb" })
5509
+ children: /* @__PURE__ */ jsx8("div", { ref: horizontalScrollbarThumbRef, className: "rvg-horizontal-scrollbar-thumb" })
5287
5510
  }
5288
5511
  ),
5289
- /* @__PURE__ */ jsx7("div", { ref: dragGuideRef, className: "rvg-column-guide" }),
5290
- columnDragPreview && /* @__PURE__ */ jsxs7(
5512
+ /* @__PURE__ */ jsx8("div", { ref: dragGuideRef, className: "rvg-column-guide" }),
5513
+ columnDragPreview && /* @__PURE__ */ jsxs8(
5291
5514
  "div",
5292
5515
  {
5293
5516
  "aria-hidden": "true",
@@ -5303,7 +5526,7 @@ function TableInner({
5303
5526
  backgroundSize: `${viewport.width}px ${renderHeight}px`
5304
5527
  },
5305
5528
  children: [
5306
- /* @__PURE__ */ jsxs7(
5529
+ /* @__PURE__ */ jsxs8(
5307
5530
  "div",
5308
5531
  {
5309
5532
  className: `rvg-column-drag-preview-header${selectedColumnKeySet.has(columns[columnDragPreview.sourceIndex]?.key) ? " is-axis-selected" : ""}`,
@@ -5316,7 +5539,7 @@ function TableInner({
5316
5539
  ),
5317
5540
  rows.slice(domRange.rowStart, domRange.rowEnd).map((_row, visibleRowOffset) => {
5318
5541
  const rowIndex = domRange.rowStart + visibleRowOffset;
5319
- return /* @__PURE__ */ jsx7(
5542
+ return /* @__PURE__ */ jsx8(
5320
5543
  "div",
5321
5544
  {
5322
5545
  className: `rvg-column-drag-preview-cell${selectedColumnKeySet.has(columns[columnDragPreview.sourceIndex]?.key) ? " is-axis-selected" : ""}${hasStripedRows && rowIndex % 2 === 1 ? " is-striped" : ""}`,
@@ -5329,16 +5552,16 @@ function TableInner({
5329
5552
  ]
5330
5553
  }
5331
5554
  ),
5332
- resizeGuideX !== null && /* @__PURE__ */ jsx7(
5555
+ resizeGuideX !== null && /* @__PURE__ */ jsx8(
5333
5556
  "div",
5334
5557
  {
5335
5558
  className: "rvg-column-guide is-resizing",
5336
5559
  style: { display: "block", top: resizeGuideTop, transform: `translateX(${Math.round(resizeGuideX)}px)` }
5337
5560
  }
5338
5561
  ),
5339
- /* @__PURE__ */ jsx7("div", { ref: rowDragGuideRef, className: "rvg-row-guide" }),
5340
- filterEditor && /* @__PURE__ */ jsxs7("div", { ref: filterRef, className: "rvg-filter", style: { left: filterEditor.left, top: filterEditor.top }, children: [
5341
- /* @__PURE__ */ jsx7(
5562
+ /* @__PURE__ */ jsx8("div", { ref: rowDragGuideRef, className: "rvg-row-guide" }),
5563
+ filterEditor && /* @__PURE__ */ jsxs8("div", { ref: filterRef, className: "rvg-filter", style: { left: filterEditor.left, top: filterEditor.top }, children: [
5564
+ /* @__PURE__ */ jsx8(
5342
5565
  "input",
5343
5566
  {
5344
5567
  autoFocus: true,
@@ -5362,15 +5585,15 @@ function TableInner({
5362
5585
  }
5363
5586
  }
5364
5587
  ),
5365
- /* @__PURE__ */ jsxs7("div", { className: "rvg-filter-actions", children: [
5366
- /* @__PURE__ */ jsx7("button", { type: "button", onClick: () => {
5588
+ /* @__PURE__ */ jsxs8("div", { className: "rvg-filter-actions", children: [
5589
+ /* @__PURE__ */ jsx8("button", { type: "button", onClick: () => {
5367
5590
  const key = columns[filterEditor.columnIndex].key;
5368
5591
  const next = { ...filterValues };
5369
5592
  delete next[key];
5370
5593
  setFilterValues(next);
5371
5594
  setFilterEditor(null);
5372
5595
  }, children: labels.reset }),
5373
- /* @__PURE__ */ jsx7("button", { type: "button", className: "rvg-filter-confirm", onClick: () => {
5596
+ /* @__PURE__ */ jsx8("button", { type: "button", className: "rvg-filter-confirm", onClick: () => {
5374
5597
  const key = columns[filterEditor.columnIndex].key;
5375
5598
  const next = { ...filterValues };
5376
5599
  if (filterEditor.draft) next[key] = filterEditor.draft;
@@ -5381,28 +5604,28 @@ function TableInner({
5381
5604
  ] })
5382
5605
  ] }),
5383
5606
  renderEditor(),
5384
- rows.length === 0 && !loading && /* @__PURE__ */ jsx7("div", { className: "rvg-empty", style: { top: bodyTop }, children: emptyContent ?? /* @__PURE__ */ jsx7(DefaultEmptyState, { label: labels.empty }) }),
5385
- loading && hasCustomLoading && /* @__PURE__ */ jsx7("div", { className: "rvg-custom-loading", "aria-label": labels.refreshing, children: loadingContent }),
5386
- loading && !hasCustomLoading && !hasCompletedLoadRef.current && /* @__PURE__ */ jsxs7("div", { className: "rvg-initial-loading", style: { top: headerHeight }, "aria-label": labels.initialLoading, children: [
5387
- Array.from({ length: Math.ceil((renderHeight - headerHeight) / rowHeight) }, (_, rowIndex) => /* @__PURE__ */ jsx7("div", { className: "rvg-loading-row", style: { height: rowHeight }, children: columns.map((column, columnIndex) => {
5607
+ rows.length === 0 && !loading && /* @__PURE__ */ jsx8("div", { className: "rvg-empty", style: { top: bodyTop }, children: emptyContent ?? /* @__PURE__ */ jsx8(DefaultEmptyState, { label: labels.empty }) }),
5608
+ loading && hasCustomLoading && /* @__PURE__ */ jsx8("div", { className: "rvg-custom-loading", "aria-label": labels.refreshing, children: loadingContent }),
5609
+ loading && !hasCustomLoading && !hasCompletedLoadRef.current && /* @__PURE__ */ jsxs8("div", { className: "rvg-initial-loading", style: { top: headerHeight }, "aria-label": labels.initialLoading, children: [
5610
+ Array.from({ length: Math.ceil((renderHeight - headerHeight) / rowHeight) }, (_, rowIndex) => /* @__PURE__ */ jsx8("div", { className: "rvg-loading-row", style: { height: rowHeight }, children: columns.map((column, columnIndex) => {
5388
5611
  const left = getDisplayedColumnLeft(columnIndex);
5389
5612
  const columnWidth = metrics[columnIndex].width;
5390
5613
  if (left + columnWidth <= 0 || left >= viewport.width) return null;
5391
5614
  const isUtility = column.rowSelection || column.rowDragHandle || column.rowNumber;
5392
- return /* @__PURE__ */ jsx7(
5615
+ return /* @__PURE__ */ jsx8(
5393
5616
  "span",
5394
5617
  {
5395
5618
  className: column.rowDragHandle ? "is-utility is-drag" : column.rowSelection ? "is-utility is-selection" : void 0,
5396
5619
  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" },
5397
- children: /* @__PURE__ */ jsx7("i", { style: { width: isUtility ? 14 : `${38 + (rowIndex * 17 + columnIndex * 13) % 43}%`, animationDelay: `${(rowIndex * columns.length + columnIndex) * 24}ms` } })
5620
+ children: /* @__PURE__ */ jsx8("i", { style: { width: isUtility ? 14 : `${38 + (rowIndex * 17 + columnIndex * 13) % 43}%`, animationDelay: `${(rowIndex * columns.length + columnIndex) * 24}ms` } })
5398
5621
  },
5399
5622
  column.key
5400
5623
  );
5401
5624
  }) }, rowIndex)),
5402
- fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ jsx7("div", { className: "rvg-loading-fixed-shadow is-left", style: { left: fixedWidth } }),
5403
- rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ jsx7("div", { className: "rvg-loading-fixed-shadow is-right", style: { right: rightFixedWidth } })
5625
+ fixedWidth > 0 && currentScroll.left > 0 && /* @__PURE__ */ jsx8("div", { className: "rvg-loading-fixed-shadow is-left", style: { left: fixedWidth } }),
5626
+ rightFixedWidth > 0 && currentScroll.left < contentWidth - viewport.width && /* @__PURE__ */ jsx8("div", { className: "rvg-loading-fixed-shadow is-right", style: { right: rightFixedWidth } })
5404
5627
  ] }),
5405
- loading && !hasCustomLoading && hasCompletedLoadRef.current && /* @__PURE__ */ jsx7("div", { className: "rvg-refresh-loading", "aria-label": labels.refreshing, children: /* @__PURE__ */ jsx7(LoadingSpinnerIcon, {}) })
5628
+ loading && !hasCustomLoading && hasCompletedLoadRef.current && /* @__PURE__ */ jsx8("div", { className: "rvg-refresh-loading", "aria-label": labels.refreshing, children: /* @__PURE__ */ jsx8(LoadingSpinnerIcon, {}) })
5406
5629
  ] });
5407
5630
  }
5408
5631
  var Table = forwardRef(TableInner);