@dbcdk/react-components 0.0.97 → 0.0.101

package/dist/tanstack.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 var reactTable = require('@tanstack/react-table');
-var React9 = require('react');
+var React8 = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 var lucideReact = require('lucide-react');
 var reactDom = require('react-dom');
@@ -24,7 +24,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React9__namespace = /*#__PURE__*/_interopNamespace(React9);
+var React8__namespace = /*#__PURE__*/_interopNamespace(React8);
 
 // src/components/table/components/column-resizer/ColumnResizer.module.css
 var ColumnResizer_default = {
@@ -49,11 +49,11 @@ var Pagination_default = {
   container: "Pagination_container2",
   range: "Pagination_range2"
 };
-var TooltipContext = React9.createContext(null);
+var TooltipContext = React8.createContext(null);
 
 // src/components/overlay/tooltip/useTooltipTrigger.tsx
 function useTooltipTrigger(options) {
-  const ctx = React9.useContext(TooltipContext);
+  const ctx = React8.useContext(TooltipContext);
   if (!ctx) throw new Error("useTooltipTrigger must be used within <TooltipProvider>.");
   const {
     content,
@@ -66,21 +66,21 @@ function useTooltipTrigger(options) {
     focusOpenMode = "focus-visible",
     closeOnPointerDown = true
   } = options;
-  const id = React9.useId();
-  const triggerElRef = React9.useRef(null);
+  const id = React8.useId();
+  const triggerElRef = React8.useRef(null);
   const isControlled = open !== void 0;
-  const [uncontrolledOpen, setUncontrolledOpen] = React9.useState(defaultOpen);
+  const [uncontrolledOpen, setUncontrolledOpen] = React8.useState(defaultOpen);
   const isOpen = isControlled ? !!open : uncontrolledOpen;
-  const openTimer = React9.useRef(null);
-  const closeTimer = React9.useRef(null);
+  const openTimer = React8.useRef(null);
+  const closeTimer = React8.useRef(null);
   const clearTimers = () => {
     if (openTimer.current) window.clearTimeout(openTimer.current);
     if (closeTimer.current) window.clearTimeout(closeTimer.current);
     openTimer.current = null;
     closeTimer.current = null;
   };
-  const lastSentRef = React9.useRef(null);
-  const show = React9.useCallback(() => {
+  const lastSentRef = React8.useRef(null);
+  const show = React8.useCallback(() => {
     if (!content) return;
     ctx.show({
       id,
@@ -91,17 +91,17 @@ function useTooltipTrigger(options) {
     });
     lastSentRef.current = { content, placement, offset };
   }, [ctx, id, content, placement, offset]);
-  const hide = React9.useCallback(() => {
+  const hide = React8.useCallback(() => {
     ctx.hide(id);
   }, [ctx, id]);
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     if (!isOpen) {
       hide();
       return;
     }
     show();
   }, [isOpen, show, hide]);
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     var _a;
     if (!isOpen) return;
     if (((_a = ctx.active) == null ? void 0 : _a.id) !== id) return;
@@ -196,7 +196,7 @@ function mergeRefs(...refs) {
     }
   };
 }
-var Button = React9__namespace.forwardRef(function Button2({
+var Button = React8__namespace.forwardRef(function Button2({
   variant = "outlined",
   shape = "default",
   size = "md",
@@ -225,8 +225,8 @@ var Button = React9__namespace.forwardRef(function Button2({
     userClassName
   );
   const tooltipEnabled = Boolean(tooltip);
-  const childRef = isLink && React9__namespace.isValidElement(children) ? (_a = children.ref) != null ? _a : null : null;
-  const mergedRef = React9__namespace.useMemo(() => mergeRefs(childRef, ref), [childRef, ref]);
+  const childRef = isLink && React8__namespace.isValidElement(children) ? (_a = children.ref) != null ? _a : null : null;
+  const mergedRef = React8__namespace.useMemo(() => mergeRefs(childRef, ref), [childRef, ref]);
   const { triggerProps, id: tooltipId } = useTooltipTrigger({
     content: tooltipEnabled ? tooltip : null,
     placement: tooltipPlacement,
@@ -243,7 +243,7 @@ var Button = React9__namespace.forwardRef(function Button2({
     loading && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "flex", opacity: 0.5 }, className: "spin", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LoaderCircle, {}) })
   ] });
   let buttonEl;
-  if (isLink && React9__namespace.isValidElement(children)) {
+  if (isLink && React8__namespace.isValidElement(children)) {
     const childClassName = typeof children.props.className === "string" ? children.props.className : "";
     const { disabled, onClick, ...linkButtonProps } = buttonProps;
     const handleClick = (e) => {
@@ -253,7 +253,7 @@ var Button = React9__namespace.forwardRef(function Button2({
       }
       onClick == null ? void 0 : onClick(e);
     };
-    buttonEl = React9__namespace.cloneElement(children, {
+    buttonEl = React8__namespace.cloneElement(children, {
       ...linkButtonProps,
       ref: mergedRef,
       className: cx(childClassName, computedClassName, Button_default.buttonLink),
@@ -424,9 +424,9 @@ function Checkbox({
   id,
   "data-cy": dataCy
 }) {
-  const [internal, setInternal] = React9.useState(false);
+  const [internal, setInternal] = React8.useState(false);
   const isChecked = controlled != null ? controlled : internal;
-  const generatedId = React9.useId();
+  const generatedId = React8.useId();
   const controlId = id != null ? id : `checkbox-${generatedId}`;
   const toggle = (e) => {
     if (disabled) return;
@@ -515,7 +515,7 @@ function RadioButton({
   id,
   "data-cy": dataCy
 }) {
-  const generatedId = React9.useId();
+  const generatedId = React8.useId();
   const controlId = id != null ? id : `radio-${generatedId}`;
   const isChecked = selectedValue !== void 0 ? selectedValue === value : Boolean(checked);
   const content = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: RadioButtons_default.container, "data-cy": dataCy, children: [
@@ -575,9 +575,9 @@ var INTERACTIVE_SELECTOR = 'a:not([disabled]), button:not([disabled]), [tabindex
 function getMenuItems(el) {
   return Array.from(el.querySelectorAll(INTERACTIVE_SELECTOR));
 }
-var MenuBase = React9__namespace.forwardRef(
+var MenuBase = React8__namespace.forwardRef(
   ({ children, className, itemRole = "menuitem", gap, onKeyDown, ...props }, ref) => {
-    const internalRef = React9__namespace.useRef(null);
+    const internalRef = React8__namespace.useRef(null);
     const handleKeyDown = (e) => {
       const ul = internalRef.current;
       if (!ul) return;
@@ -620,16 +620,16 @@ var MenuBase = React9__namespace.forwardRef(
   }
 );
 MenuBase.displayName = "Menu";
-var isInteractiveEl = (el) => React9__namespace.isValidElement(el) && (typeof el.type === "string" ? el.type === "a" || el.type === "button" : true);
+var isInteractiveEl = (el) => React8__namespace.isValidElement(el) && (typeof el.type === "string" ? el.type === "a" || el.type === "button" : true);
 function applyMenuItemPropsToElement(child, opts) {
   var _a, _b, _c, _d;
   const { active, selected, disabled, role, tabIndex = 0, className } = opts;
   const childClass = [Menu_default.item, active ? Menu_default.active : "", selected ? Menu_default.selected : ""].filter(Boolean).join(" ");
-  const nextImmediate = React9__namespace.cloneElement(child, {
+  const nextImmediate = React8__namespace.cloneElement(child, {
     className: [child.props.className, Menu_default.interactiveChild, className].filter(Boolean).join(" ")
   });
   if (typeof child.type === "string" && (child.type === "a" || child.type === "button")) {
-    return React9__namespace.cloneElement(child, {
+    return React8__namespace.cloneElement(child, {
       role: (_a = child.props.role) != null ? _a : role,
       tabIndex: (_b = child.props.tabIndex) != null ? _b : tabIndex,
       "aria-selected": selected || void 0,
@@ -638,7 +638,7 @@ function applyMenuItemPropsToElement(child, opts) {
       ...child.type === "button" ? { disabled } : {}
     });
   }
-  return React9__namespace.cloneElement(nextImmediate, {
+  return React8__namespace.cloneElement(nextImmediate, {
     role: (_c = nextImmediate.props.role) != null ? _c : role,
     tabIndex: (_d = nextImmediate.props.tabIndex) != null ? _d : tabIndex,
     "aria-selected": selected || void 0,
@@ -647,7 +647,7 @@ function applyMenuItemPropsToElement(child, opts) {
     disabled
   });
 }
-var MenuItem = React9__namespace.forwardRef(
+var MenuItem = React8__namespace.forwardRef(
   ({ children, active, selected, disabled, className, itemRole, variant, ...liProps }, ref) => {
     const resolvedRole = itemRole != null ? itemRole : "menuitem";
     const isBordered = variant === "bordered";
@@ -685,7 +685,7 @@ var MenuItem = React9__namespace.forwardRef(
   }
 );
 MenuItem.displayName = "Menu.Item";
-var MenuCheckItem = React9__namespace.forwardRef(
+var MenuCheckItem = React8__namespace.forwardRef(
   ({
     label,
     checked,
@@ -751,7 +751,7 @@ var MenuCheckItem = React9__namespace.forwardRef(
   }
 );
 MenuCheckItem.displayName = "Menu.CheckItem";
-var MenuRadioItem = React9__namespace.forwardRef(
+var MenuRadioItem = React8__namespace.forwardRef(
   ({ name, value, checked, disabled, label, onValueChange, className, ...liProps }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "li",
@@ -791,7 +791,7 @@ var MenuRadioItem = React9__namespace.forwardRef(
   }
 );
 MenuRadioItem.displayName = "Menu.RadioItem";
-var MenuSeparator = React9__namespace.forwardRef(
+var MenuSeparator = React8__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "li",
     {
@@ -803,7 +803,7 @@ var MenuSeparator = React9__namespace.forwardRef(
   )
 );
 MenuSeparator.displayName = "Menu.Separator";
-var MenuHeader = React9__namespace.forwardRef(
+var MenuHeader = React8__namespace.forwardRef(
   ({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "li",
     {
@@ -876,7 +876,7 @@ function parseMinWidthPx(minWidth, elForEm) {
   }
   return 0;
 }
-var Popover = React9.forwardRef(function Popover2({
+var Popover = React8.forwardRef(function Popover2({
   trigger: Trigger,
   children,
   open,
@@ -896,39 +896,39 @@ var Popover = React9.forwardRef(function Popover2({
   anchorRef,
   overlayRef
 }, ref) {
-  const internalId = React9.useId();
+  const internalId = React8.useId();
   const resolvedContentId = contentId != null ? contentId : `popover-${internalId}`;
   const isControlled = open !== void 0;
-  const [uncontrolledOpen, setUncontrolledOpen] = React9.useState(defaultOpen);
+  const [uncontrolledOpen, setUncontrolledOpen] = React8.useState(defaultOpen);
   const isOpen = isControlled ? !!open : uncontrolledOpen;
-  const [pos, setPos] = React9.useState({ top: 0, left: 0 });
-  const [positioned, setPositioned] = React9.useState(false);
-  const [triggerWidth, setTriggerWidth] = React9.useState(null);
-  const containerRef = React9.useRef(null);
-  const contentRef = React9.useRef(null);
-  const triggerElRef = React9.useRef(null);
-  const lastCloseReasonRef = React9.useRef("unknown");
-  const [mounted, setMounted] = React9.useState(false);
-  React9.useEffect(() => setMounted(true), []);
-  const setOpen = React9.useCallback(
+  const [pos, setPos] = React8.useState({ top: 0, left: 0 });
+  const [positioned, setPositioned] = React8.useState(false);
+  const [triggerWidth, setTriggerWidth] = React8.useState(null);
+  const containerRef = React8.useRef(null);
+  const contentRef = React8.useRef(null);
+  const triggerElRef = React8.useRef(null);
+  const lastCloseReasonRef = React8.useRef("unknown");
+  const [mounted, setMounted] = React8.useState(false);
+  React8.useEffect(() => setMounted(true), []);
+  const setOpen = React8.useCallback(
     (next) => {
       if (!isControlled) setUncontrolledOpen(next);
       onOpenChange == null ? void 0 : onOpenChange(next);
     },
     [isControlled, onOpenChange]
   );
-  const openPopover = React9.useCallback(() => {
+  const openPopover = React8.useCallback(() => {
     setPositioned(false);
     setOpen(true);
   }, [setOpen]);
-  const closePopover = React9.useCallback(
+  const closePopover = React8.useCallback(
     (reason = "api") => {
       lastCloseReasonRef.current = reason;
       setOpen(false);
     },
     [setOpen]
   );
-  const togglePopover = React9.useCallback(
+  const togglePopover = React8.useCallback(
     (e) => {
       var _a, _b;
       triggerElRef.current = (_b = (_a = anchorRef == null ? void 0 : anchorRef.current) != null ? _a : e.currentTarget) != null ? _b : containerRef.current;
@@ -937,7 +937,7 @@ var Popover = React9.forwardRef(function Popover2({
     },
     [isOpen, closePopover, openPopover, anchorRef]
   );
-  React9.useImperativeHandle(
+  React8.useImperativeHandle(
     ref,
     () => ({
       close: () => closePopover("api"),
@@ -946,7 +946,7 @@ var Popover = React9.forwardRef(function Popover2({
     }),
     [closePopover, openPopover, isOpen]
   );
-  const computeAndSetPosition = React9.useCallback(() => {
+  const computeAndSetPosition = React8.useCallback(() => {
     var _a, _b;
     const content = contentRef.current;
     if (!content) return;
@@ -1011,11 +1011,11 @@ var Popover = React9.forwardRef(function Popover2({
     setPos({ top: clampedTop, left: clampedLeft });
     setPositioned(true);
   }, [anchorRef, edgeBuffer, viewportPadding, minWidth, matchTriggerWidth]);
-  React9.useLayoutEffect(() => {
+  React8.useLayoutEffect(() => {
     if (!isOpen) return;
     computeAndSetPosition();
   }, [isOpen, computeAndSetPosition]);
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     var _a, _b, _c;
     if (!isOpen) return;
     const content = contentRef.current;
@@ -1055,7 +1055,7 @@ var Popover = React9.forwardRef(function Popover2({
       resizeObserver == null ? void 0 : resizeObserver.disconnect();
     };
   }, [isOpen, closePopover, computeAndSetPosition, autoFocusContent, anchorRef]);
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     var _a, _b;
     if (isOpen) return;
     if (!returnFocus) return;
@@ -1063,7 +1063,7 @@ var Popover = React9.forwardRef(function Popover2({
     (_b = (_a = triggerElRef.current) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
   }, [isOpen, returnFocus]);
   const icon = isOpen ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "dbc-muted-text", size: 20 }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "dbc-muted-text", size: 20 });
-  const setOverlayRef = React9__namespace.useCallback(
+  const setOverlayRef = React8__namespace.useCallback(
     (node) => {
       assignRef(overlayRef, node);
     },
@@ -1134,18 +1134,18 @@ function Pagination({
   showFirstLast = true,
   showGoToPage = true
 }) {
-  const popoverRef = React9.useRef(null);
-  const pageSizeRef = React9.useRef(null);
-  const formatNumber = React9.useCallback((value) => value.toLocaleString(NUMBER_LOCALE), []);
-  const totalPages = React9.useMemo(
+  const popoverRef = React8.useRef(null);
+  const pageSizeRef = React8.useRef(null);
+  const formatNumber = React8.useCallback((value) => value.toLocaleString(NUMBER_LOCALE), []);
+  const totalPages = React8.useMemo(
     () => Math.max(1, Math.ceil(itemsCount / Math.max(1, take))),
     [itemsCount, take]
   );
-  const currentPage = React9.useMemo(() => {
+  const currentPage = React8.useMemo(() => {
     const p = Math.floor(skip / Math.max(1, take)) + 1;
     return Math.min(Math.max(1, p), totalPages);
   }, [skip, take, totalPages]);
-  const emit = React9.useCallback(
+  const emit = React8.useCallback(
     (page, nextTake = take) => {
       const nextTotalPages = Math.max(1, Math.ceil(itemsCount / Math.max(1, nextTake)));
       const clampedPage = Math.min(Math.max(1, page), nextTotalPages);
@@ -1159,21 +1159,21 @@ function Pagination({
     },
     [onPageChange, take, itemsCount]
   );
-  const firstPage = React9.useCallback(() => emit(1), [emit]);
-  const lastPage = React9.useCallback(() => emit(totalPages), [emit, totalPages]);
-  const prevPage = React9.useCallback(() => emit(currentPage - 1), [emit, currentPage]);
-  const nextPage = React9.useCallback(() => emit(currentPage + 1), [emit, currentPage]);
-  const goToPage = React9.useCallback((page) => emit(page), [emit]);
+  const firstPage = React8.useCallback(() => emit(1), [emit]);
+  const lastPage = React8.useCallback(() => emit(totalPages), [emit, totalPages]);
+  const prevPage = React8.useCallback(() => emit(currentPage - 1), [emit, currentPage]);
+  const nextPage = React8.useCallback(() => emit(currentPage + 1), [emit, currentPage]);
+  const goToPage = React8.useCallback((page) => emit(page), [emit]);
   const canPrev = currentPage > 1;
   const canNext = currentPage < totalPages;
-  const rangeLabel = React9.useMemo(() => {
+  const rangeLabel = React8.useMemo(() => {
     if (itemsCount <= 0) return "0 af 0";
     const first = skip + 1;
     const last = Math.min(skip + take, itemsCount);
     return `${formatNumber(first)}\u2013${formatNumber(last)} af ${formatNumber(itemsCount)}`;
   }, [formatNumber, itemsCount, skip, take]);
-  const pages = React9.useMemo(() => Array.from({ length: totalPages }, (_, i) => i + 1), [totalPages]);
-  const handlePageSizeChange = React9.useCallback((size) => emit(1, size), [emit]);
+  const pages = React8.useMemo(() => Array.from({ length: totalPages }, (_, i) => i + 1), [totalPages]);
+  const handlePageSizeChange = React8.useCallback((size) => emit(1, size), [emit]);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Pagination_default.container, children: [
     showFirstLast && /* @__PURE__ */ jsxRuntime.jsx(
       Button,
@@ -1266,11 +1266,11 @@ function Pagination({
     )
   ] });
 }
-var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React9.useLayoutEffect : React9.useEffect;
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React8.useLayoutEffect : React8.useEffect;
 function useViewportFill(ref, { bottomOffset = 0, min = 120, includeMarginTop = false, watchRef } = {}) {
-  const [maxHeight, setMaxHeight] = React9.useState(min);
-  const raf = React9.useRef(null);
-  const measure = React9.useCallback(() => {
+  const [maxHeight, setMaxHeight] = React8.useState(min);
+  const raf = React8.useRef(null);
+  const measure = React8.useCallback(() => {
     if (typeof window === "undefined" || !ref.current) return;
     const el = ref.current;
     const rect = el.getBoundingClientRect();
@@ -1282,7 +1282,7 @@ function useViewportFill(ref, { bottomOffset = 0, min = 120, includeMarginTop =
     const next = Math.max(min, Math.floor(window.innerHeight - bottomOffset - top));
     setMaxHeight((prev) => prev === next ? prev : next);
   }, [ref, bottomOffset, min, includeMarginTop]);
-  const scheduleMeasure = React9.useCallback(() => {
+  const scheduleMeasure = React8.useCallback(() => {
     if (typeof window === "undefined") return;
     if (raf.current != null) {
       cancelAnimationFrame(raf.current);
@@ -1295,7 +1295,7 @@ function useViewportFill(ref, { bottomOffset = 0, min = 120, includeMarginTop =
   useIsomorphicLayoutEffect(() => {
     measure();
   }, [measure]);
-  React9.useEffect(() => {
+  React8.useEffect(() => {
     var _a;
     if (typeof window === "undefined" || !ref.current) return;
     const target = ref.current;
@@ -1328,7 +1328,7 @@ function useViewportFill(ref, { bottomOffset = 0, min = 120, includeMarginTop =
       }
     };
   }, [ref, watchRef, scheduleMeasure]);
-  const style = React9.useMemo(
+  const style = React8.useMemo(
     () => ({
       maxHeight,
       overflow: "auto"
@@ -1524,7 +1524,7 @@ function useTableRowInteractions({
   onRowClick,
   onRowSelect
 }) {
-  const handleRowClick = React9.useCallback(
+  const handleRowClick = React8.useCallback(
     (e) => {
       var _a;
       const target = e.target;
@@ -1541,7 +1541,7 @@ function useTableRowInteractions({
     },
     [canSelect, isSelected, onRowClick, onRowSelect, row, rowId]
   );
-  const handleRowKeyDown = React9.useCallback(
+  const handleRowKeyDown = React8.useCallback(
     (e) => {
       if (!onRowClick) return;
       if (!shouldToggleOnKey(e.key)) return;
@@ -1891,24 +1891,10 @@ function SkeletonLoaderItem({
     }
   );
 }
-function getColumnWidth(column) {
-  if (typeof column.width === "number" && column.width < 150) {
-    return "100%";
-  }
-  if (typeof column.width === "string" && column.width.endsWith("px")) {
-    const px = parseInt(column.width, 10);
-    if (!isNaN(px) && px < 150) {
-      return "100%";
-    }
-  }
-  const percent = Math.floor(Math.random() * (90 - 50 + 1)) + 50;
-  return `${percent}%`;
-}
 function TableLoadingBody({ rows, columns, hasSelection }) {
-  const widths = Array.from({ length: rows }, () => columns.map(getColumnWidth));
   return /* @__PURE__ */ jsxRuntime.jsx("tbody", { className: Table_default.body, children: Array.from({ length: rows }).map((_, rowIndex) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { className: Table_default.row, children: [
     hasSelection ? /* @__PURE__ */ jsxRuntime.jsx("td", { className: cx2(Table_default.cell, Table_default.selectionCell), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: Table_default.cellContent, children: /* @__PURE__ */ jsxRuntime.jsx(SkeletonLoaderItem, { height: 20, width: 20 }) }) }) : null,
-    columns.map((column, columnIndex) => {
+    columns.map((column) => {
       var _a;
       return /* @__PURE__ */ jsxRuntime.jsx(
         "td",
@@ -1920,7 +1906,7 @@ function TableLoadingBody({ rows, columns, hasSelection }) {
           ),
           "data-align": (_a = column.align) != null ? _a : "left",
           "data-divider": column.divider,
-          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: Table_default.cellContent, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: Table_default.cellValueEllipsis, children: /* @__PURE__ */ jsxRuntime.jsx(SkeletonLoaderItem, { height: 16, width: widths[rowIndex][columnIndex] }) }) })
+          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: Table_default.cellContent, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: Table_default.cellValueEllipsis, children: /* @__PURE__ */ jsxRuntime.jsx(SkeletonLoaderItem, { height: 20, width: "100%" }) }) })
         },
         column.id
       );
@@ -1966,10 +1952,10 @@ function Table({
   onPageChange,
   ...rest
 }) {
-  const visibleColumns = React9.useMemo(() => getVisibleColumns(columns), [columns]);
-  const selectionInputName = React9.useId();
-  const internalTableRootRef = React9.useRef(null);
-  const tableRootRefWrapper = React9.useRef(tableRootRef);
+  const visibleColumns = React8.useMemo(() => getVisibleColumns(columns), [columns]);
+  const selectionInputName = React8.useId();
+  const internalTableRootRef = React8.useRef(null);
+  const tableRootRefWrapper = React8.useRef(tableRootRef);
   const hasSelection = Boolean(selectedRows && onRowSelect);
   const hasPagination = Boolean(onPageChange && (loading || data.length > 0));
   const paginationOffset = hasPagination ? 72 : 0;
@@ -1979,7 +1965,7 @@ function Table({
   });
   const fillViewportActive = fillViewport && containScrolling && maxHeight >= 500;
   const stickyTop = stickyHeader === "app-header" ? "var(--app-header-height, 60px)" : typeof stickyHeader === "number" ? `${stickyHeader}px` : void 0;
-  const setTableRootRef = React9.useCallback((node) => {
+  const setTableRootRef = React8.useCallback((node) => {
     internalTableRootRef.current = node;
     if (typeof tableRootRefWrapper.current === "function") {
       tableRootRefWrapper.current(node);
@@ -1987,7 +1973,7 @@ function Table({
       tableRootRefWrapper.current.current = node;
     }
   }, []);
-  const handlePageChange = React9.useCallback(
+  const handlePageChange = React8.useCallback(
     (e) => {
       onPageChange == null ? void 0 : onPageChange(e);
     },
@@ -2294,19 +2280,19 @@ function TanstackTable(props) {
     ...tableProps
   } = props;
   const isControlledSorting = controlledSorting != null;
-  const [uiSorting, setUiSorting] = React9__namespace.useState(controlledSorting != null ? controlledSorting : []);
-  React9__namespace.useEffect(() => {
+  const [uiSorting, setUiSorting] = React8__namespace.useState(controlledSorting != null ? controlledSorting : []);
+  React8__namespace.useEffect(() => {
     if (!isControlledSorting) return;
     if (sortingEqual(uiSorting, controlledSorting)) return;
     setUiSorting(controlledSorting);
   }, [isControlledSorting, controlledSorting, uiSorting]);
-  const columnVisibility = React9__namespace.useMemo(
+  const columnVisibility = React8__namespace.useMemo(
     () => buildColumnVisibilityFromVisibleIds(columns, visibleColumnIds),
     [columns, visibleColumnIds]
   );
-  const [columnSizing, setColumnSizing] = React9__namespace.useState({});
-  const containerRef = React9__namespace.useRef(null);
-  const [availableWidth, setAvailableWidth] = React9__namespace.useState(void 0);
+  const [columnSizing, setColumnSizing] = React8__namespace.useState({});
+  const containerRef = React8__namespace.useRef(null);
+  const [availableWidth, setAvailableWidth] = React8__namespace.useState(void 0);
   const table = reactTable.useReactTable({
     data,
     columns,
@@ -2332,7 +2318,7 @@ function TanstackTable(props) {
       size: DEFAULT_COLUMN_PX
     }
   });
-  React9__namespace.useLayoutEffect(() => {
+  React8__namespace.useLayoutEffect(() => {
     const el = containerRef.current;
     if (!el) return;
     const updateWidth = () => {
@@ -2348,7 +2334,7 @@ function TanstackTable(props) {
     observer.observe(el);
     return () => observer.disconnect();
   }, []);
-  const distributedLayout = React9__namespace.useMemo(() => {
+  const distributedLayout = React8__namespace.useMemo(() => {
     if (availableWidth == null) return null;
     return buildDistributedColumnWidths({
       table,
@@ -2359,7 +2345,7 @@ function TanstackTable(props) {
     });
   }, [table, selectedRows, onRowSelect, dataKey, columnSizing, availableWidth]);
   const initialLayoutReady = availableWidth != null;
-  const resolvedLayout = React9__namespace.useMemo(() => {
+  const resolvedLayout = React8__namespace.useMemo(() => {
     const next = {};
     table.getVisibleLeafColumns().forEach((column) => {
       next[column.id] = {
@@ -2368,13 +2354,13 @@ function TanstackTable(props) {
     });
     return next;
   }, [table, distributedLayout]);
-  const columnItems = React9__namespace.useMemo(
+  const columnItems = React8__namespace.useMemo(
     () => mapDefsToColumnItems(columns, columnVisibility, resolvedLayout),
     [columns, columnVisibility, resolvedLayout]
   );
   const visibleData = table.getRowModel().rows.map((r) => r.original);
   const { sortById, sortDirection } = getSortPropsFromSorting(uiSorting);
-  const handleSortChange = React9__namespace.useCallback(
+  const handleSortChange = React8__namespace.useCallback(
     (column, direction) => {
       const next = direction == null ? [] : [{ id: column.id, desc: direction === "desc" }];
       if (optimisticSortingUi) setUiSorting(next);
@@ -2382,7 +2368,7 @@ function TanstackTable(props) {
     },
     [optimisticSortingUi, onSortingChange]
   );
-  const headerExtras = React9__namespace.useCallback(
+  const headerExtras = React8__namespace.useCallback(
     ({ index }) => {
       var _a, _b, _c, _d;
       const headerGroups = table.getHeaderGroups();
@@ -2431,17 +2417,17 @@ function TableSettings({
     handleChangeViewMode(mode === "wrapped" ? "compact" : "wrapped");
     close == null ? void 0 : close();
   };
-  const hideableColumns = React9.useMemo(() => columns.filter((c) => c.enableHiding !== false), [columns]);
-  const allPresetIds = React9.useMemo(() => hideableColumns.map((c) => c.id), [hideableColumns]);
-  const standardPresetIds = React9.useMemo(
+  const hideableColumns = React8.useMemo(() => columns.filter((c) => c.enableHiding !== false), [columns]);
+  const allPresetIds = React8.useMemo(() => hideableColumns.map((c) => c.id), [hideableColumns]);
+  const standardPresetIds = React8.useMemo(
     () => hideableColumns.filter((c) => {
       var _a;
       return ((_a = c.meta) == null ? void 0 : _a.hidden) !== true;
     }).map((c) => c.id),
     [hideableColumns]
   );
-  const visibleSet = React9.useMemo(() => new Set(visibleColumnIds), [visibleColumnIds]);
-  const visibleCount = React9.useMemo(() => {
+  const visibleSet = React8.useMemo(() => new Set(visibleColumnIds), [visibleColumnIds]);
+  const visibleCount = React8.useMemo(() => {
     return hideableColumns.reduce((acc, c) => {
       var _a;
       return acc + (visibleSet.has((_a = c.id) != null ? _a : "") ? 1 : 0);
@@ -2460,11 +2446,11 @@ function TableSettings({
     else next.delete(id);
     setVisibleIds(Array.from(next));
   };
-  const isAllActive = React9.useMemo(() => {
+  const isAllActive = React8.useMemo(() => {
     if (!hideableColumns.length) return false;
     return hideableColumns.every((c) => c.id && visibleSet.has(c.id));
   }, [hideableColumns, visibleSet]);
-  const isStandardActive = React9.useMemo(() => {
+  const isStandardActive = React8.useMemo(() => {
     if (!hideableColumns.length) return false;
     const std = new Set(standardPresetIds);
     return hideableColumns.every((c) => c.id && visibleSet.has(c.id) === std.has(c.id));
@@ -2614,23 +2600,23 @@ function useTableSettings({
   defaultVisibleColumnIds,
   storage = localStorageTableSettingsStorage
 }) {
-  const defaults = React9.useMemo(() => {
+  const defaults = React8.useMemo(() => {
     return {
       viewMode: defaultViewMode,
       visibleColumnIds: defaultVisibleColumnIds != null ? defaultVisibleColumnIds : getDefaultVisibleIds(tableColumns)
     };
   }, [defaultViewMode, defaultVisibleColumnIds, tableColumns]);
-  const [state, setState] = React9.useState(defaults);
-  React9.useEffect(() => {
+  const [state, setState] = React8.useState(defaults);
+  React8.useEffect(() => {
     const stored = storage.get(storageKey);
     const next = mergeDefaults(stored, defaults);
     setState(next);
   }, [storageKey, storage, defaults]);
-  const persist = React9.useCallback(
+  const persist = React8.useCallback(
     (next) => storage.set(storageKey, next),
     [storage, storageKey]
   );
-  const setViewMode = React9.useCallback(
+  const setViewMode = React8.useCallback(
     (mode) => {
       setState((prev) => {
         if (prev.viewMode === mode) return prev;
@@ -2641,7 +2627,7 @@ function useTableSettings({
     },
     [persist]
   );
-  const toggleViewMode = React9.useCallback(() => {
+  const toggleViewMode = React8.useCallback(() => {
     setState((prev) => {
       const nextMode = prev.viewMode === "wrapped" ? "compact" : "wrapped";
       const next = { ...prev, viewMode: nextMode };
@@ -2649,7 +2635,7 @@ function useTableSettings({
       return next;
     });
   }, [persist]);
-  const setVisibleColumnIds = React9.useCallback(
+  const setVisibleColumnIds = React8.useCallback(
     (ids) => {
       setState((prev) => {
         const next = { ...prev, visibleColumnIds: ids };