@povio/ui 5.0.0-rc.8 → 6.0.0-rc.1

package/dist/useTableColumnConfig-CUINwVTR.js

@@ -0,0 +1,1348 @@
+import { t as logger } from "./logger-CqZjM-sn.js";
+import { t as createLucideIcon } from "./createLucideIcon-LcezOE4z.js";
+import { t as UIConfig } from "./uiConfig.context-CT9EVqC5.js";
+import { t as ChevronDown } from "./chevron-down-B4Pr8bD3.js";
+import { n as ChevronUp } from "./Tooltip-CMigoyri.js";
+import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { t as UIOverrides } from "./uiOverrides.context-BTCH9y5a.js";
+import { t as IconSlot } from "./IconSlot-DSK7qNxc.js";
+import { t as Checkbox } from "./Checkbox-BI3DQPLa.js";
+import { t as Typography } from "./Typography-LU4z2pR1.js";
+import { t as Spinner } from "./Spinner-BeVTUzzx.js";
+import { IconButton } from "./components/icon-button.js";
+import "./i18n-BjNKHh_D.js";
+import { t as useIntersectionObserver } from "./useIntersectionObserver-DYfHnGGU.js";
+import { t as Dialog } from "./Dialog-DSl1Fkqi.js";
+import { Pagination } from "./components/pagination.js";
+import { a as tableHeadRowDefinition, c as theadDefinition, i as tableHeadDataDefinition, n as tableContainerDefinition, o as tableHeaderTextDefinition, r as tableDataDefinition, s as tableRowDefinition, t as tableCellTextDefinition } from "./table.cva-DFQM8VbM.js";
+import { t as useTranslationMemo } from "./useTranslationMemo-CrZbeyBv.js";
+import { t as UIRouter } from "./router.context-B4FvsTim.js";
+import { t as RoutingUtils } from "./routing.utils-DfxEt0_Y.js";
+import { Suspense, lazy, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { c } from "react/compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import i18next from "i18next";
+import { createPaginatedRowModel, createSortedRowModel, flexRender, stockFeatures, tableFeatures, useTable } from "@tanstack/react-table";
+//#region ../../node_modules/.bun/lucide-react@1.43.0+83d5fd7b249dbeef/node_modules/lucide-react/dist/esm/icons/grip-vertical.mjs
+/**
+* @license lucide-react v1.43.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+const __iconData = {
+	name: "grip-vertical",
+	size: 24,
+	node: [
+		["circle", {
+			cx: "9",
+			cy: "12",
+			r: "1",
+			key: "1vctgf"
+		}],
+		["circle", {
+			cx: "9",
+			cy: "5",
+			r: "1",
+			key: "hp0tcf"
+		}],
+		["circle", {
+			cx: "9",
+			cy: "19",
+			r: "1",
+			key: "fkjjf6"
+		}],
+		["circle", {
+			cx: "15",
+			cy: "12",
+			r: "1",
+			key: "1tmaij"
+		}],
+		["circle", {
+			cx: "15",
+			cy: "5",
+			r: "1",
+			key: "19l28e"
+		}],
+		["circle", {
+			cx: "15",
+			cy: "19",
+			r: "1",
+			key: "f4zoj3"
+		}]
+	]
+};
+__iconData.node;
+const GripVertical = createLucideIcon(__iconData);
+//#endregion
+//#region src/components/table/CellText.tsx
+const CellText = (props) => {
+	const uiConfig = UIConfig.useConfig();
+	const { size = uiConfig.tableCellText.size, children, style, className } = props;
+	const cellTextCva = UIOverrides.useCva("table.cellTextCva", tableCellTextDefinition);
+	return /* @__PURE__ */ jsx(Typography, {
+		className: cellTextCva({ className }),
+		as: "span",
+		size,
+		style,
+		"data-rac": true,
+		children
+	});
+};
+//#endregion
+//#region src/components/table/HeaderText.tsx
+const HeaderText = (props) => {
+	const uiConfig = UIConfig.useConfig();
+	const { size = uiConfig.tableHeaderText.size, children, style, className } = props;
+	const headerTextCva = UIOverrides.useCva("table.headerTextCva", tableHeaderTextDefinition);
+	return /* @__PURE__ */ jsx(Typography, {
+		className: headerTextCva({ className }),
+		as: "span",
+		size,
+		style,
+		children
+	});
+};
+//#endregion
+//#region src/hooks/useTableNav.ts
+const Selectors = {
+	Cell: "[role=\"cell\"],[role=\"gridcell\"],[role=\"columnheader\"],[role=\"rowheader\"],td,th",
+	Row: "[role=\"row\"],tr",
+	RowGroup: "[role=\"rowgroup\"],thead,tbody,tfoot",
+	/** Selector from here: https://github.com/Shopify/polaris/blob/main/polaris-react/src/utilities/focus.ts#L10 */
+	Focusable: "a,frame,iframe,input:not([type=hidden]):not(:disabled),select:not(:disabled),textarea:not(:disabled),button:not([aria-disabled=\"true\"]):not([tabindex=\"-1\"]):not(:disabled),*[tabindex]"
+};
+var DataGridNav = class {
+	constructor(config = {}) {
+		this.keys = [];
+		this.activeCell = null;
+		this.debugLog = (functionName, message) => {
+			if (this.debug) logger.info(`[${functionName}]: ${message}`);
+		};
+		const { selectors = {}, pageUpDown, debug = false } = config;
+		this.selectors = {
+			...Selectors,
+			...selectors
+		};
+		this.pageUpDown = pageUpDown;
+		this.keys = [];
+		this.debug = debug;
+		this.disabled = false;
+	}
+	/**
+	* Disables the keyboard listener in cases
+	* that elements inside the grid need to use
+	* arrows keys etc., like select dropdowns
+	*/
+	disable() {
+		this.disabled = true;
+	}
+	/**
+	* Enables the keyboard listeners
+	*/
+	enable() {
+		this.disabled = false;
+	}
+	isFocusable(el) {
+		return el instanceof HTMLElement || el instanceof SVGElement;
+	}
+	getActiveCell() {
+		return this.activeCell;
+	}
+	/** Used as a keyboard listener for key up */
+	tableKeyUp() {
+		this.keys = [];
+	}
+	/** Used as a keyboard listener for key down */
+	tableKeyDown(e) {
+		if (this.disabled) return;
+		/**
+		* Avoid page scrolling etc.
+		* Enable default behavior for:
+		* Tab, Shift + Tab
+		* TODO: Actually it will be better to just prevent
+		* in ArrowKeys and PageKeys maybe?
+		* Or should the consumer stop propagation?!
+		* Cannot work with preventDefault as it will
+		* first capture the event from an input in cell for example
+		*/
+		if ("ArrowDown" === e.key || "ArrowUp" === e.key || "ArrowLeft" === e.key || "ArrowRight" === e.key) e.preventDefault();
+		/**
+		* Add key to the stack if it's
+		* not the same with the last (long press)
+		*/
+		if (this.keys.length === 0 || this.keys[this.keys.length - 1] !== e.key) this.keys.push(e.key);
+		/**
+		* Need to check if we are inside a grid cell
+		* or not to enable/disable Grid Navigation
+		*/
+		if (!(e.target instanceof Element)) return;
+		const cell = e.target.parentElement?.closest(`${this.selectors.Cell},${this.selectors.Row}`);
+		if (!cell) return;
+		if (cell.matches(this.selectors.Cell)) this.cellNavigation(e);
+		else this.gridNavigation(e);
+	}
+	/**
+	* Handles the navigation inside a cell
+	*/
+	cellNavigation(e) {
+		if (!(e.target instanceof Element)) return;
+		/**
+		* Keys: Escape
+		* Restore grid navigation
+		*/
+		if (e.key === "Escape") {
+			const cell = e.target.closest(this.selectors.Cell);
+			if (cell && this.isFocusable(cell)) {
+				cell.focus();
+				return;
+			}
+		}
+		/**
+		* Keys: ArrowRight, ArrowDown
+		* Move to the next focusable cell, or the first one
+		*
+		* Arrow Down disabled:
+		* https://github.com/w3c/aria-practices/issues/2739#issuecomment-1613538972
+		*/
+		if (e.key === "ArrowRight" || e.key === "ArrowDown") {
+			const cell = e.target.closest(this.selectors.Cell);
+			if (!cell) return;
+			const focusableWidgets = [...cell.querySelectorAll(this.selectors.Focusable)];
+			const widgetIdx = focusableWidgets.findIndex((el) => el === e.target);
+			const widgetToFocus = focusableWidgets[widgetIdx === focusableWidgets.length - 1 ? 0 : widgetIdx + 1];
+			if (this.isFocusable(widgetToFocus)) widgetToFocus.focus();
+			return;
+		}
+		/**
+		* Keys: ArrowLeft, ArrowUp
+		* Move to the previous focusable cell, or the last one
+		*
+		* Arrow Up disabled:
+		* https://github.com/w3c/aria-practices/issues/2739#issuecomment-1613538972
+		*/
+		if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
+			const cell = e.target.closest(this.selectors.Cell);
+			if (!cell) return;
+			const focusableWidgets = [...cell.querySelectorAll(this.selectors.Focusable)];
+			const widgetIdx = focusableWidgets.findIndex((el) => el === e.target);
+			const widgetToFocus = focusableWidgets[widgetIdx === 0 ? focusableWidgets.length - 1 : widgetIdx - 1];
+			if (this.isFocusable(widgetToFocus)) widgetToFocus.focus();
+		}
+	}
+	/**
+	* Handles the navigation outside a cell
+	* on the grid level
+	*/
+	gridNavigation(e) {
+		const { target } = e;
+		if (!(e.target instanceof Element)) return;
+		if (!(target instanceof Element)) return;
+		if (this.keys.length === 1) {
+			/**
+			* Keys: Enter
+			* Should move focus inside the cell to the first focusable element:
+			* https://www.w3.org/WAI/ARIA/apg/patterns/grid/#gridNav_inside
+			*/
+			if (/^[a-zA-Z0-9]$/.test(e.key)) {
+				const cell = e.target.querySelector(this.selectors.Focusable);
+				if (cell && this.isFocusable(cell) && cell instanceof HTMLInputElement) {
+					cell.focus();
+					cell.value = `${cell.value}${e.key}`;
+					e.preventDefault();
+				}
+				return;
+			}
+			if (e.key === "Backspace") {
+				const cell = e.target.querySelector(this.selectors.Focusable);
+				if (cell && this.isFocusable(cell) && cell instanceof HTMLInputElement) {
+					const nativeInputValueSetter = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value")?.set;
+					if (nativeInputValueSetter) {
+						nativeInputValueSetter.call(cell, "");
+						const ev = new Event("input", { bubbles: true });
+						cell.dispatchEvent(ev);
+					}
+				}
+				return;
+			}
+			if (e.key === "Enter") {
+				const cell = e.target.querySelector(this.selectors.Focusable);
+				if (cell && this.isFocusable(cell)) {
+					if (cell.getAttribute("data-type") === "select-trigger") {
+						cell.click();
+						return;
+					}
+					cell.focus();
+					e.preventDefault();
+				}
+				return;
+			}
+			/**
+			* Keys: ArrowLeft, ArrowRight
+			* Should move focus to the next/previous cell
+			*/
+			if (e.key === "ArrowLeft" || e.key === "ArrowRight") {
+				const direction = e.key === "ArrowLeft" ? "prev" : "next";
+				const cell = e.target.closest(this.selectors.Cell);
+				let nextCell = null;
+				if (direction === "next" && cell?.nextElementSibling instanceof HTMLElement) nextCell = cell.nextElementSibling;
+				if (direction === "prev" && cell?.previousElementSibling instanceof HTMLElement) nextCell = cell.previousElementSibling;
+				if (nextCell && this.isFocusable(nextCell)) {
+					nextCell.focus();
+					e.preventDefault();
+				}
+			}
+			/**
+			* Keys: Up,Down
+			* Should move focus to the same column of the next/previous row
+			*/
+			if (e.key === "ArrowDown" || e.key === "ArrowUp") {
+				this.verticalCellNavigation(e);
+				return;
+			}
+			/**
+			* Keys: PageUp, PageDown
+			* Should move focus to the first/last row
+			* or a predefined number of rows if user provides a value
+			*/
+			if (e.key === "PageUp" || e.key === "PageDown") {
+				this.pageCellNavigation(e);
+				return;
+			}
+			/**
+			* Keys: Home, End
+			* Should move focus to the first/last cell of the current row
+			*/
+			if (e.key === "Home" || e.key === "End") {
+				const rowChildren = [...e.target.closest(this.selectors.Row)?.children || []];
+				if (e.key === "End") rowChildren.reverse();
+				this.focusOnFirstCell(rowChildren);
+			}
+		} else {
+			/**
+			* Keys: Control + Home, Control + End
+			* Should move focus to the first/last cell of the first/last row
+			*/
+			const [firstKey, secondKey] = this.keys;
+			if (firstKey === "Control" && (secondKey === "Home" || secondKey === "End")) {
+				const siblings = e.target.closest(this.selectors.Row).parentElement?.children;
+				if (!siblings) return;
+				const rowChildren = [...(secondKey === "Home" ? siblings[0] : siblings[siblings.length - 1])?.children || []];
+				if (secondKey === "End") rowChildren.reverse();
+				this.focusOnFirstCell(rowChildren);
+			}
+		}
+	}
+	pageCellNavigation(e) {
+		if (!(e.target instanceof Element)) return;
+		const row = e.target.closest(this.selectors.Row);
+		const cell = e.target.closest(this.selectors.Cell);
+		if (row && cell) {
+			const position = this.getColumnIndex(cell);
+			if (position === void 0) return;
+			const direction = e.key === "PageUp" ? "prev" : "next";
+			const siblings = row.parentElement?.children;
+			if (!siblings) return;
+			let destinationRow;
+			if (this.pageUpDown) {
+				const methodClbk = direction === "prev" ? "previousSibling" : "nextSibling";
+				let sibling = row[methodClbk];
+				if (sibling === null) return;
+				let lastVisitedSibling = sibling;
+				for (let i = 0; i < this.pageUpDown - 1 && sibling; i++) {
+					sibling = sibling[methodClbk];
+					if (sibling) lastVisitedSibling = sibling;
+				}
+				destinationRow = sibling || lastVisitedSibling;
+			} else destinationRow = direction === "prev" ? siblings[0] : siblings[siblings.length - 1];
+			if (!destinationRow || !(destinationRow instanceof Element)) return;
+			const child = destinationRow.children[position];
+			if (child && this.isFocusable(child)) child.focus();
+		}
+	}
+	verticalCellNavigation(e) {
+		if (!(e.target instanceof Element)) return;
+		const row = e.target.closest(this.selectors.Row);
+		const cell = e.target.closest(this.selectors.Cell);
+		if (row && cell) {
+			const cellPosition = this.getColumnIndex(cell);
+			const rowPosition = this.getRowIndex(row);
+			if (cellPosition === void 0 || rowPosition === void 0) return;
+			const direction = e.key === "ArrowUp" ? "prev" : "next";
+			/** Find previous rowgroup and focus on the proper cell */
+			if (rowPosition === 0 && direction === "prev") {
+				const currentRowGroup = row.parentElement?.closest(this.selectors.RowGroup);
+				const siblingRowGroups = [...currentRowGroup?.parentElement?.children || []];
+				const currentRowGroupIdx = siblingRowGroups.findIndex((el) => el === currentRowGroup);
+				if (currentRowGroupIdx !== 0) {
+					const rows = [...siblingRowGroups[currentRowGroupIdx - 1].querySelectorAll(this.selectors.Row)];
+					const child = rows[rows.length - 1].children[cellPosition];
+					if (child && this.isFocusable(child)) child.focus();
+					return;
+				}
+			}
+			/** Find next rowgroup and focus on the proper cell */
+			if (rowPosition === [...row.parentElement?.querySelectorAll(this.selectors.Row) || []].length - 1 && direction === "next") {
+				const currentRowGroup = row.parentElement?.closest(this.selectors.RowGroup);
+				const siblingRowGroups = [...currentRowGroup?.parentElement?.children || []];
+				const currentRowGroupIdx = siblingRowGroups.findIndex((el) => el === currentRowGroup);
+				if (currentRowGroupIdx !== siblingRowGroups.length - 1) {
+					const child = [...siblingRowGroups[currentRowGroupIdx + 1].querySelectorAll(this.selectors.Row)][0].children[cellPosition];
+					if (child && this.isFocusable(child)) child.focus();
+					return;
+				}
+				return;
+			}
+			/** Navigation in the same rowgroup */
+			const destinationRow = this.findUntil(direction, row, this.selectors.Row);
+			if (!destinationRow) return;
+			const child = destinationRow.children[cellPosition];
+			if (child && this.isFocusable(child)) child.focus();
+		}
+	}
+	/**
+	* Sending a row `Element` and then the first cell will be focused.
+	*
+	* If you want to focus the last cell then the row children can be passed in
+	* reversed order
+	*/
+	focusOnFirstCell(el) {
+		for (let i = 0; i < el.length; i++) {
+			const child = el[i];
+			if (this.isFocusable(child)) {
+				child.focus();
+				return;
+			}
+		}
+	}
+	/**
+	* Get the column index of a `cell` based on the first `row` parent.
+	* `cellIndex` could be used, but it's not supported in HTML tables.
+	*/
+	getColumnIndex(cell) {
+		let position = 0;
+		const siblings = cell?.parentNode?.children;
+		if (!siblings) return;
+		while (cell !== siblings[position] && siblings[position] !== void 0) position++;
+		if (siblings[position] === void 0) return;
+		return position;
+	}
+	/**
+	* Get the row index of a `row` based
+	* on its sibling rows
+	*/
+	getRowIndex(row) {
+		let position = 0;
+		const siblings = row?.parentNode?.children;
+		if (!siblings) return;
+		while (row !== siblings[position] && siblings[position] !== void 0) position++;
+		if (siblings[position] === void 0) return;
+		return position;
+	}
+	/**
+	* Equivalent to prevUntil/nextUntil in jQuery
+	* https://api.jquery.com/prevUntil/
+	*/
+	findUntil(direction, el, matchSelector, exitSelector) {
+		let element = el;
+		const method = direction === "next" ? "nextSibling" : "previousSibling";
+		while (element[method]) {
+			const sibling = element[method];
+			if (!sibling) return null;
+			if (exitSelector && sibling instanceof Element && sibling.matches(exitSelector)) return null;
+			if (sibling instanceof Element && sibling.matches(matchSelector)) return sibling;
+			element = sibling;
+		}
+		return null;
+	}
+};
+function useTableNav(options) {
+	const nav = new DataGridNav(options);
+	return {
+		listeners: {
+			onKeyDown: (e) => nav.tableKeyDown(e),
+			onKeyUp: () => nav.tableKeyUp()
+		},
+		tableNav: nav
+	};
+}
+//#endregion
+//#region src/components/table/Table.tsx
+const DndProvider = lazy(() => import("./TableDnd-CuHxANWh.js").then((module) => ({ default: module.DndProvider })));
+const SortableRows = lazy(() => import("./TableDnd-CuHxANWh.js").then((module) => ({ default: module.SortableRows })));
+const DraggableRow = lazy(() => import("./TableDnd-CuHxANWh.js").then((module) => ({ default: module.DraggableRow })));
+const DragHandle = lazy(() => import("./TableDnd-CuHxANWh.js").then((module) => ({ default: module.DragHandle })));
+const tableFeaturesConfig = tableFeatures({
+	...stockFeatures,
+	sortedRowModel: createSortedRowModel(),
+	paginatedRowModel: createPaginatedRowModel()
+});
+const CustomCellContext = (context) => {
+	return {
+		...context,
+		original: context.row.original,
+		data: context.row.original,
+		value: context.getValue()
+	};
+};
+const isPlainFunction = (Comp) => typeof Comp === "function" && !Comp.prototype?.isReactComponent;
+const CellContent = ({ cell, props }) => {
+	const rendered = isPlainFunction(cell) ? cell(props) : flexRender(cell, props);
+	return typeof rendered === "string" || typeof rendered === "number" ? /* @__PURE__ */ jsx(CellText, { children: rendered }) : rendered;
+};
+const renderCell = (Comp, props) => /* @__PURE__ */ jsx(CellContent, {
+	cell: Comp,
+	props
+});
+const RowDragHandleCell = ({ rowId }) => {
+	return /* @__PURE__ */ jsx(DragHandle, {
+		id: rowId,
+		children: (dragProps) => /* @__PURE__ */ jsx(IconButton, {
+			...dragProps,
+			className: "cursor-move p-1",
+			label: "Drag handle",
+			icon: GripVertical,
+			variant: "text",
+			width: "hug",
+			disableTooltip: true,
+			size: "sm"
+		})
+	});
+};
+const AutoDragHandleCell = ({ row }) => /* @__PURE__ */ jsx(RowDragHandleCell, { rowId: row.id });
+const Table = ({ items, showCellBorder, columns, onRowClick, onDoubleClick, className, variant: variantProp, containerClassName, maxHeight, scroll = "table", sorting, setSorting, columnOrder, setColumnOrder, columnVisibility, setColumnVisibility, bulkSelectionActions: ActionHeader, enableDragDrop = false, onDragEnd, onReorder, getRowId, enableRowSelection, enableMultiRowSelection = false, defaultSelectedRows, onRowSelectionChange, ...props }) => {
+	const uiConfig = UIConfig.useConfig();
+	const variant = variantProp ?? uiConfig.table.variant;
+	const showColumnBorders = showCellBorder ?? (variant !== "horizontals" && variant !== "zebra" && variant !== "striped-columns");
+	const tableContainerCva = UIOverrides.useCva("table.containerCva", tableContainerDefinition);
+	const tableRowCva = UIOverrides.useCva("table.rowCva", tableRowDefinition);
+	const theadCva = UIOverrides.useCva("table.theadCva", theadDefinition);
+	const tableHeadRowCva = UIOverrides.useCva("table.headRowCva", tableHeadRowDefinition);
+	const tableHeadDataCva = UIOverrides.useCva("table.headDataCva", tableHeadDataDefinition);
+	const tableDataCva = UIOverrides.useCva("table.dataCva", tableDataDefinition);
+	const ref = useRef(null);
+	const { listeners } = useTableNav();
+	const data = useMemo(() => items ?? [], [items]);
+	const [internalSelectedRows, setInternalSelectedRows] = useState(() => defaultSelectedRows ?? {});
+	const hasExternalRowSelection = defaultSelectedRows !== void 0 && onRowSelectionChange !== void 0;
+	const rowSelection = hasExternalRowSelection ? defaultSelectedRows : internalSelectedRows;
+	const handleRowSelectionChange = useCallback((updater) => {
+		if (!hasExternalRowSelection) setInternalSelectedRows(updater);
+		onRowSelectionChange?.(updater);
+	}, [hasExternalRowSelection, onRowSelectionChange]);
+	const baseColumns = useMemo(() => typeof columns === "function" ? columns(i18next.t) : columns, [columns]);
+	const tableColumns = useMemo(() => {
+		if (enableDragDrop && getRowId) return [{
+			id: "drag-handle",
+			header: "",
+			meta: { width: "w-12" },
+			cell: AutoDragHandleCell,
+			enableSorting: false
+		}, ...baseColumns];
+		return baseColumns;
+	}, [
+		baseColumns,
+		enableDragDrop,
+		getRowId
+	]);
+	const [isSticky, setIsSticky] = useState(false);
+	const tableRef = useRef(null);
+	const theadRef = useRef(null);
+	useEffect(() => {
+		const update = () => {
+			const tableTop = tableRef.current?.getBoundingClientRect().top;
+			const theadTop = theadRef.current?.getBoundingClientRect().top;
+			setIsSticky(tableTop !== void 0 && theadTop !== void 0 && theadTop > tableTop);
+		};
+		update();
+		document.addEventListener("scroll", update, {
+			capture: true,
+			passive: true
+		});
+		return () => document.removeEventListener("scroll", update, { capture: true });
+	}, []);
+	const table = useTable({
+		features: tableFeaturesConfig,
+		data,
+		columns: tableColumns,
+		state: {
+			sorting,
+			columnOrder,
+			columnVisibility,
+			rowSelection
+		},
+		rowCount: items.length,
+		manualPagination: true,
+		onColumnOrderChange: setColumnOrder,
+		onColumnVisibilityChange: setColumnVisibility,
+		onSortingChange: setSorting,
+		onRowSelectionChange: handleRowSelectionChange,
+		manualSorting: true,
+		autoResetPageIndex: false,
+		autoResetExpanded: false,
+		defaultColumn: { sortDescFirst: true },
+		enableRowSelection,
+		enableMultiRowSelection,
+		getRowId: getRowId ? (row) => String(getRowId(row)) : void 0
+	});
+	const dataIds = useMemo(() => {
+		if (!enableDragDrop || !getRowId) return [];
+		return data.map((item) => getRowId(item));
+	}, [
+		data,
+		enableDragDrop,
+		getRowId
+	]);
+	const handleDragEnd = useCallback((event) => {
+		const { active, over } = event;
+		if (!active || !over || active.id === over.id) return;
+		if (getRowId && (onReorder || onDragEnd)) {
+			if (onReorder) {
+				const oldIndex = items.findIndex((item_0) => getRowId(item_0) === active.id);
+				const newIndex = items.findIndex((item_1) => getRowId(item_1) === over.id);
+				if (oldIndex !== -1 && newIndex !== -1) {
+					const reorderedItems = [...items];
+					const [movedItem] = reorderedItems.splice(oldIndex, 1);
+					reorderedItems.splice(newIndex, 0, movedItem);
+					onReorder(reorderedItems);
+				}
+			}
+			onDragEnd?.(event);
+		}
+	}, [
+		onDragEnd,
+		onReorder,
+		items,
+		getRowId
+	]);
+	const selectedRows = table.getSelectedRowModel().rows;
+	const columnCount = table.getHeaderGroups()[0].headers.length;
+	const isAnyRowSelected = selectedRows.length > 0 && !!ActionHeader;
+	const hasOnClick = !!onRowClick || !!onDoubleClick;
+	const tableElement = /* @__PURE__ */ jsx("div", {
+		className: tableContainerCva({
+			variant,
+			scroll,
+			className: containerClassName
+		}),
+		style: maxHeight === void 0 || scroll === "page" ? void 0 : { maxHeight },
+		children: /* @__PURE__ */ jsxs("table", {
+			ref: tableRef,
+			className: clsx("w-full font-body text-large", className),
+			...listeners,
+			children: [/* @__PURE__ */ jsx("thead", {
+				ref: theadRef,
+				className: clsx(theadCva({})),
+				"data-is-sticky": isSticky || void 0,
+				children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx("tr", {
+					className: clsx(tableHeadRowCva({})),
+					children: headerGroup.headers.filter((header) => {
+						if (isAnyRowSelected && header.index > 0) return false;
+						return header.column.getIsVisible();
+					}).map((header_0, index) => {
+						const columnMeta = header_0.column.columnDef.meta ?? {};
+						return /* @__PURE__ */ jsx("th", {
+							colSpan: isAnyRowSelected ? columnCount : header_0.colSpan,
+							tabIndex: -1,
+							className: clsx(tableHeadDataCva({
+								variant,
+								hasRightBorder: index > 0 && showColumnBorders
+							}), columnMeta.headerClass, columnMeta.width),
+							children: isAnyRowSelected ? /* @__PURE__ */ jsx(ActionHeader, { table }) : /* @__PURE__ */ jsxs("button", {
+								type: "button",
+								"aria-label": "Sort column",
+								className: clsx("flex select-none items-center gap-1 text-content-primary", header_0.column.getCanSort() ? "-mx-1 h-6 cursor-pointer rounded-xs px-1 hover:bg-table-row-hover" : "cursor-default", columnMeta.sortClass),
+								onClick: header_0.column.getToggleSortingHandler(),
+								children: [typeof header_0.column.columnDef.header === "function" ? flexRender(header_0.column.columnDef.header, header_0.getContext()) : /* @__PURE__ */ jsx(HeaderText, { children: header_0.column.columnDef.header }), {
+									asc: /* @__PURE__ */ jsx(IconSlot, { icon: ChevronUp }),
+									desc: /* @__PURE__ */ jsx(IconSlot, { icon: ChevronDown })
+								}[header_0.column.getIsSorted()] ?? null]
+							})
+						}, header_0.id);
+					})
+				}, headerGroup.id))
+			}), /* @__PURE__ */ jsx("tbody", {
+				ref,
+				className: "relative",
+				children: enableDragDrop ? /* @__PURE__ */ jsx(SortableRows, {
+					items: dataIds,
+					children: table.getRowModel().rows.map((row_0) => /* @__PURE__ */ jsx(DraggableRow, {
+						id: row_0.id,
+						className: clsx(tableRowCva({
+							...props,
+							variant
+						})),
+						isClickable: hasOnClick || row_0.getCanSelect(),
+						isSelected: row_0.getIsSelected(),
+						onClick: () => {
+							if (onRowClick) {
+								onRowClick(row_0.original);
+								return;
+							}
+							if (row_0.getCanSelect()) row_0.toggleSelected();
+						},
+						onDoubleClick: () => onDoubleClick?.(row_0.original),
+						children: row_0.getVisibleCells().map((cell, cellIndex) => {
+							const columnMeta_0 = cell.column.columnDef.meta ?? {};
+							return /* @__PURE__ */ jsx("td", {
+								tabIndex: -1,
+								className: clsx(tableDataCva({
+									variant,
+									hasRightBorder: cellIndex > 0 && showColumnBorders
+								}), columnMeta_0.cellClass, columnMeta_0.width),
+								children: renderCell(cell.column.columnDef.cell, CustomCellContext(cell.getContext()))
+							}, cell.id);
+						})
+					}, row_0.id))
+				}) : table.getRowModel().rows.map((row_1) => {
+					return /* @__PURE__ */ jsx("tr", {
+						className: clsx(tableRowCva({
+							...props,
+							variant
+						})),
+						onClick: () => {
+							if (onRowClick) {
+								onRowClick(row_1.original);
+								return;
+							}
+							if (row_1.getCanSelect()) row_1.toggleSelected();
+						},
+						onDoubleClick: () => onDoubleClick?.(row_1.original),
+						"data-clickable": hasOnClick || row_1.getCanSelect() || void 0,
+						"data-selected": row_1.getIsSelected() || void 0,
+						children: row_1.getVisibleCells().map((cell_0, cellIndex_0) => {
+							const columnMeta_1 = cell_0.column.columnDef.meta ?? {};
+							return /* @__PURE__ */ jsx("td", {
+								tabIndex: -1,
+								className: clsx(tableDataCva({
+									variant,
+									hasRightBorder: cellIndex_0 > 0 && showColumnBorders
+								}), columnMeta_1.cellClass, columnMeta_1.width),
+								children: renderCell(cell_0.column.columnDef.cell, CustomCellContext(cell_0.getContext()))
+							}, cell_0.id);
+						})
+					}, row_1.id);
+				})
+			})]
+		})
+	});
+	if (enableDragDrop) return /* @__PURE__ */ jsx(Suspense, {
+		fallback: null,
+		children: /* @__PURE__ */ jsx(DndProvider, {
+			onDragEnd: handleDragEnd,
+			children: tableElement
+		})
+	});
+	return tableElement;
+};
+//#endregion
+//#region src/components/table/ColumnConfig.tsx
+const VisibilityCell = (t0) => {
+	const $ = c(7);
+	const { original, onToggle } = t0;
+	let t1;
+	if ($[0] !== onToggle || $[1] !== original.id) {
+		t1 = () => onToggle(original.id);
+		$[0] = onToggle;
+		$[1] = original.id;
+		$[2] = t1;
+	} else t1 = $[2];
+	const t2 = original.label;
+	let t3;
+	if ($[3] !== original.visible || $[4] !== t1 || $[5] !== t2) {
+		t3 = /* @__PURE__ */ jsx(Checkbox, {
+			isSelected: original.visible,
+			onChange: t1,
+			hideLabel: true,
+			children: t2
+		});
+		$[3] = original.visible;
+		$[4] = t1;
+		$[5] = t2;
+		$[6] = t3;
+	} else t3 = $[6];
+	return t3;
+};
+const getColumns = (t, handleToggleVisibility) => [{
+	id: "name",
+	header: t(($) => $.ui.table.column, { ns: "ui" }),
+	meta: { width: "flex-1" },
+	accessorKey: "label"
+}, {
+	id: "visible",
+	header: t(($) => $.ui.table.show, { ns: "ui" }),
+	meta: { width: "w-20" },
+	cell: ({ original }) => /* @__PURE__ */ jsx(VisibilityCell, {
+		original,
+		onToggle: handleToggleVisibility
+	})
+}];
+function ColumnConfigModal(t0) {
+	const $ = c(27);
+	const { isOpen, onClose, configColumns, visibleColumns, onVisibilityChange, onOrderChange } = t0;
+	const { t } = useTranslation("ui");
+	let t1;
+	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+		t1 = [];
+		$[0] = t1;
+	} else t1 = $[0];
+	const [data, setData] = useState(t1);
+	let t2;
+	let t3;
+	if ($[1] !== configColumns || $[2] !== visibleColumns) {
+		t2 = () => {
+			setData(configColumns.map((column) => {
+				const columnId = column.id ?? column.accessorKey;
+				return {
+					id: columnId,
+					label: column.header,
+					visible: visibleColumns?.[columnId] ?? true
+				};
+			}));
+		};
+		t3 = [configColumns, visibleColumns];
+		$[1] = configColumns;
+		$[2] = visibleColumns;
+		$[3] = t2;
+		$[4] = t3;
+	} else {
+		t2 = $[3];
+		t3 = $[4];
+	}
+	useEffect(t2, t3);
+	let t4;
+	if ($[5] !== onVisibilityChange || $[6] !== visibleColumns) {
+		t4 = (columnId_0) => {
+			const newVisible = {
+				...visibleColumns,
+				[columnId_0]: !visibleColumns[columnId_0]
+			};
+			onVisibilityChange(newVisible);
+		};
+		$[5] = onVisibilityChange;
+		$[6] = visibleColumns;
+		$[7] = t4;
+	} else t4 = $[7];
+	const handleToggleVisibility = t4;
+	let t5;
+	if ($[8] !== handleToggleVisibility) {
+		t5 = (translateFn) => getColumns(translateFn, handleToggleVisibility);
+		$[8] = handleToggleVisibility;
+		$[9] = t5;
+	} else t5 = $[9];
+	const columns = useTranslationMemo(t5);
+	let t6;
+	if ($[10] !== onOrderChange) {
+		t6 = (reorderedItems) => {
+			setData(reorderedItems);
+			onOrderChange(reorderedItems.map(_temp$2));
+		};
+		$[10] = onOrderChange;
+		$[11] = t6;
+	} else t6 = $[11];
+	const handleReorder = t6;
+	if (!isOpen) return null;
+	let t7;
+	if ($[12] !== t) {
+		t7 = t(_temp2$2);
+		$[12] = t;
+		$[13] = t7;
+	} else t7 = $[13];
+	let t8;
+	if ($[14] !== t7) {
+		t8 = /* @__PURE__ */ jsx(Typography, {
+			as: "h2",
+			className: "font-bold",
+			size: "lead",
+			children: t7
+		});
+		$[14] = t7;
+		$[15] = t8;
+	} else t8 = $[15];
+	let t9;
+	if ($[16] !== columns || $[17] !== data || $[18] !== handleReorder) {
+		t9 = /* @__PURE__ */ jsx("div", {
+			className: "max-h-96 overflow-y-auto",
+			children: /* @__PURE__ */ jsx(Table, {
+				items: data,
+				columns,
+				showCellBorder: true,
+				className: "w-full",
+				enableDragDrop: true,
+				getRowId: _temp3,
+				onReorder: handleReorder
+			})
+		});
+		$[16] = columns;
+		$[17] = data;
+		$[18] = handleReorder;
+		$[19] = t9;
+	} else t9 = $[19];
+	let t10;
+	if ($[20] !== t8 || $[21] !== t9) {
+		t10 = /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-2 p-4",
+			children: [t8, t9]
+		});
+		$[20] = t8;
+		$[21] = t9;
+		$[22] = t10;
+	} else t10 = $[22];
+	let t11;
+	if ($[23] !== isOpen || $[24] !== onClose || $[25] !== t10) {
+		t11 = /* @__PURE__ */ jsx(Dialog, {
+			isOpen,
+			onClose,
+			showCloseIcon: true,
+			children: t10
+		});
+		$[23] = isOpen;
+		$[24] = onClose;
+		$[25] = t10;
+		$[26] = t11;
+	} else t11 = $[26];
+	return t11;
+}
+function _temp3(row) {
+	return row.id;
+}
+function _temp2$2($) {
+	return $.ui.table.configureColumns;
+}
+function _temp$2(item) {
+	return item.id;
+}
+//#endregion
+//#region src/components/table/InfiniteTable.tsx
+const InfiniteTable = (t0) => {
+	const $ = c(20);
+	let fetchNextPage;
+	let hasNextPage;
+	let rest;
+	let t1;
+	if ($[0] !== t0) {
+		({hasNextPage, isFetchingNextPage: t1, fetchNextPage, ...rest} = t0);
+		$[0] = t0;
+		$[1] = fetchNextPage;
+		$[2] = hasNextPage;
+		$[3] = rest;
+		$[4] = t1;
+	} else {
+		fetchNextPage = $[1];
+		hasNextPage = $[2];
+		rest = $[3];
+		t1 = $[4];
+	}
+	const isFetchingNextPage = t1 === void 0 ? false : t1;
+	let t2;
+	if ($[5] !== fetchNextPage || $[6] !== hasNextPage || $[7] !== isFetchingNextPage) {
+		t2 = () => {
+			if (!isFetchingNextPage && hasNextPage) fetchNextPage();
+		};
+		$[5] = fetchNextPage;
+		$[6] = hasNextPage;
+		$[7] = isFetchingNextPage;
+		$[8] = t2;
+	} else t2 = $[8];
+	const handleLoadMore = t2;
+	let t3;
+	if ($[9] !== handleLoadMore) {
+		t3 = {
+			onIntersection: handleLoadMore,
+			rootMargin: "100px"
+		};
+		$[9] = handleLoadMore;
+		$[10] = t3;
+	} else t3 = $[10];
+	const { ref } = useIntersectionObserver(t3);
+	let t4;
+	if ($[11] !== rest) {
+		t4 = /* @__PURE__ */ jsx(Table, { ...rest });
+		$[11] = rest;
+		$[12] = t4;
+	} else t4 = $[12];
+	let t5;
+	if ($[13] !== hasNextPage || $[14] !== isFetchingNextPage || $[15] !== ref) {
+		t5 = (hasNextPage || isFetchingNextPage) && /* @__PURE__ */ jsx("div", {
+			ref,
+			className: "flex justify-center py-4",
+			children: /* @__PURE__ */ jsx(Spinner, {})
+		});
+		$[13] = hasNextPage;
+		$[14] = isFetchingNextPage;
+		$[15] = ref;
+		$[16] = t5;
+	} else t5 = $[16];
+	let t6;
+	if ($[17] !== t4 || $[18] !== t5) {
+		t6 = /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col",
+			children: [t4, t5]
+		});
+		$[17] = t4;
+		$[18] = t5;
+		$[19] = t6;
+	} else t6 = $[19];
+	return t6;
+};
+//#endregion
+//#region src/components/table/PaginatedTable.tsx
+const PaginatedTable = (t0) => {
+	const $ = c(24);
+	let items;
+	let pagination;
+	let rest;
+	let setPagination;
+	let totalItems;
+	if ($[0] !== t0) {
+		({pagination, setPagination, items, totalItems, ...rest} = t0);
+		$[0] = t0;
+		$[1] = items;
+		$[2] = pagination;
+		$[3] = rest;
+		$[4] = setPagination;
+		$[5] = totalItems;
+	} else {
+		items = $[1];
+		pagination = $[2];
+		rest = $[3];
+		setPagination = $[4];
+		totalItems = $[5];
+	}
+	let t1;
+	if ($[6] !== items) {
+		t1 = items ?? [];
+		$[6] = items;
+		$[7] = t1;
+	} else t1 = $[7];
+	let t2;
+	if ($[8] !== rest || $[9] !== t1) {
+		t2 = /* @__PURE__ */ jsx(Table, {
+			...rest,
+			items: t1
+		});
+		$[8] = rest;
+		$[9] = t1;
+		$[10] = t2;
+	} else t2 = $[10];
+	const t3 = pagination.pageIndex + 1;
+	const t4 = totalItems ?? 0;
+	let t5;
+	let t6;
+	if ($[11] !== pagination || $[12] !== setPagination) {
+		t5 = (page) => setPagination({
+			...pagination,
+			pageIndex: page - 1
+		});
+		t6 = (pageSize) => setPagination({
+			...pagination,
+			pageSize,
+			pageIndex: 0
+		});
+		$[11] = pagination;
+		$[12] = setPagination;
+		$[13] = t5;
+		$[14] = t6;
+	} else {
+		t5 = $[13];
+		t6 = $[14];
+	}
+	let t7;
+	if ($[15] !== pagination.pageSize || $[16] !== t3 || $[17] !== t4 || $[18] !== t5 || $[19] !== t6) {
+		t7 = /* @__PURE__ */ jsx(Pagination, {
+			page: t3,
+			pageSize: pagination.pageSize,
+			totalItems: t4,
+			onPageChange: t5,
+			onPageSizeChange: t6
+		});
+		$[15] = pagination.pageSize;
+		$[16] = t3;
+		$[17] = t4;
+		$[18] = t5;
+		$[19] = t6;
+		$[20] = t7;
+	} else t7 = $[20];
+	let t8;
+	if ($[21] !== t2 || $[22] !== t7) {
+		t8 = /* @__PURE__ */ jsxs("div", {
+			className: "flex min-h-0 flex-col gap-4",
+			children: [t2, t7]
+		});
+		$[21] = t2;
+		$[22] = t7;
+		$[23] = t8;
+	} else t8 = $[23];
+	return t8;
+};
+//#endregion
+//#region src/hooks/usePagination.ts
+const DEFAULT_STATE = {
+	pageIndex: 0,
+	pageSize: 20
+};
+const parsePositiveInteger = (value, fallback) => {
+	if (value === null || !/^\d+$/.test(value)) return fallback;
+	const number = Number(value);
+	return Number.isSafeInteger(number) && number > 0 ? number : fallback;
+};
+/** Zero-based TanStack state; URL `page` values remain one-based. Defaults override initial URL state. */
+function usePagination(defaultPagination) {
+	const $ = c(12);
+	const { replace, searchParams } = UIRouter.useUIRouter();
+	let t0;
+	if ($[0] !== defaultPagination || $[1] !== searchParams) {
+		t0 = () => defaultPagination ?? {
+			pageIndex: parsePositiveInteger(searchParams.get("page"), 1) - 1,
+			pageSize: parsePositiveInteger(searchParams.get("size"), DEFAULT_STATE.pageSize)
+		};
+		$[0] = defaultPagination;
+		$[1] = searchParams;
+		$[2] = t0;
+	} else t0 = $[2];
+	const [pagination, setPagination] = useState(t0);
+	let t1;
+	if ($[3] !== pagination.pageIndex || $[4] !== pagination.pageSize || $[5] !== replace || $[6] !== searchParams) {
+		t1 = () => {
+			const params = new URLSearchParams(searchParams);
+			params.delete("size");
+			params.delete("page");
+			if (pagination.pageSize !== DEFAULT_STATE.pageSize) params.set("size", pagination.pageSize.toString());
+			if (pagination.pageIndex !== DEFAULT_STATE.pageIndex) params.set("page", (pagination.pageIndex + 1).toString());
+			if (params.toString() === searchParams.toString()) return;
+			replace(".", RoutingUtils.toRouterSearch(params));
+		};
+		$[3] = pagination.pageIndex;
+		$[4] = pagination.pageSize;
+		$[5] = replace;
+		$[6] = searchParams;
+		$[7] = t1;
+	} else t1 = $[7];
+	let t2;
+	if ($[8] !== pagination) {
+		t2 = [pagination];
+		$[8] = pagination;
+		$[9] = t2;
+	} else t2 = $[9];
+	useEffect(t1, t2);
+	let t3;
+	if ($[10] !== pagination) {
+		t3 = {
+			pagination,
+			setPagination,
+			pageIndex: pagination.pageIndex,
+			pageSize: pagination.pageSize
+		};
+		$[10] = pagination;
+		$[11] = t3;
+	} else t3 = $[11];
+	return t3;
+}
+//#endregion
+//#region src/hooks/useSorting.ts
+function useSorting(defaultSorting, t0) {
+	const $ = c(16);
+	const prefix = t0 === void 0 ? "" : t0;
+	const { replace, searchParams } = UIRouter.useUIRouter();
+	let t1;
+	if ($[0] !== defaultSorting || $[1] !== prefix || $[2] !== searchParams) {
+		t1 = defaultSorting ?? searchParams.get(`order${prefix && `-${prefix}`}`)?.split(",").map(_temp$1) ?? [];
+		$[0] = defaultSorting;
+		$[1] = prefix;
+		$[2] = searchParams;
+		$[3] = t1;
+	} else t1 = $[3];
+	const [sorting, setSorting] = useState(t1);
+	let t2;
+	if ($[4] !== sorting) {
+		t2 = sorting.map(_temp2$1).join(",");
+		$[4] = sorting;
+		$[5] = t2;
+	} else t2 = $[5];
+	const order = t2;
+	let t3;
+	if ($[6] !== order || $[7] !== prefix || $[8] !== replace || $[9] !== searchParams) {
+		t3 = () => {
+			const params = new URLSearchParams(searchParams);
+			const orderKey = prefix ? `order-${prefix}` : "order";
+			params.delete(orderKey);
+			if (order) params.set(orderKey, order);
+			if (params.toString() === searchParams.toString()) return;
+			replace(".", RoutingUtils.toRouterSearch(params));
+		};
+		$[6] = order;
+		$[7] = prefix;
+		$[8] = replace;
+		$[9] = searchParams;
+		$[10] = t3;
+	} else t3 = $[10];
+	let t4;
+	if ($[11] !== order) {
+		t4 = [order];
+		$[11] = order;
+		$[12] = t4;
+	} else t4 = $[12];
+	useEffect(t3, t4);
+	let t5;
+	if ($[13] !== order || $[14] !== sorting) {
+		t5 = {
+			sorting,
+			setSorting,
+			order
+		};
+		$[13] = order;
+		$[14] = sorting;
+		$[15] = t5;
+	} else t5 = $[15];
+	return t5;
+}
+function _temp2$1(field) {
+	return `${field.desc ? "-" : "+"}${field.id}`;
+}
+function _temp$1(item) {
+	if (item.startsWith("-")) return {
+		id: item.slice(1),
+		desc: true
+	};
+	if (item.startsWith("+")) return {
+		id: item.slice(1),
+		desc: false
+	};
+	return {
+		id: item,
+		desc: false
+	};
+}
+//#endregion
+//#region src/hooks/useTableColumnConfig.ts
+function sortByKeyOrder(data, orderedKeys = []) {
+	return [...data].sort((a, b) => {
+		return orderedKeys.findIndex((key) => key === (a.id ?? a.accessorKey)) - orderedKeys.findIndex((key) => key === (b.id ?? b.accessorKey));
+	});
+}
+function useTableColumnConfig(defaultColumns, t0) {
+	const $ = c(31);
+	let t1;
+	if ($[0] !== t0) {
+		t1 = t0 === void 0 ? {} : t0;
+		$[0] = t0;
+		$[1] = t1;
+	} else t1 = $[1];
+	const options = t1;
+	let t2;
+	if ($[2] !== defaultColumns) {
+		t2 = () => defaultColumns.reduce(_temp, {});
+		$[2] = defaultColumns;
+		$[3] = t2;
+	} else t2 = $[3];
+	const [internalVisibleColumns, setInternalVisibleColumns] = useState(t2);
+	let t3;
+	if ($[4] !== defaultColumns) {
+		t3 = () => defaultColumns.map(_temp2);
+		$[4] = defaultColumns;
+		$[5] = t3;
+	} else t3 = $[5];
+	const [internalColumnOrder, setInternalColumnOrder] = useState(t3);
+	let t4;
+	let t5;
+	if ($[6] !== options.visibleColumns) {
+		t4 = () => {
+			if (options.visibleColumns) setInternalVisibleColumns(options.visibleColumns);
+		};
+		t5 = [options.visibleColumns];
+		$[6] = options.visibleColumns;
+		$[7] = t4;
+		$[8] = t5;
+	} else {
+		t4 = $[7];
+		t5 = $[8];
+	}
+	useEffect(t4, t5);
+	let t6;
+	let t7;
+	if ($[9] !== options.columnOrder) {
+		t6 = () => {
+			if (options.columnOrder) setInternalColumnOrder(options.columnOrder);
+		};
+		t7 = [options.columnOrder];
+		$[9] = options.columnOrder;
+		$[10] = t6;
+		$[11] = t7;
+	} else {
+		t6 = $[10];
+		t7 = $[11];
+	}
+	useEffect(t6, t7);
+	let t8;
+	if ($[12] !== options) {
+		t8 = (value) => {
+			setInternalVisibleColumns(value);
+			options?.onVisibilityChange?.(value);
+		};
+		$[12] = options;
+		$[13] = t8;
+	} else t8 = $[13];
+	const handleVisibilityChange = t8;
+	let t9;
+	if ($[14] !== options) {
+		t9 = (value_0) => {
+			setInternalColumnOrder(value_0);
+			options?.onOrderChange?.(value_0);
+		};
+		$[14] = options;
+		$[15] = t9;
+	} else t9 = $[15];
+	const handleOrderChange = t9;
+	let t10;
+	if ($[16] !== defaultColumns || $[17] !== internalColumnOrder) {
+		t10 = sortByKeyOrder(defaultColumns, internalColumnOrder);
+		$[16] = defaultColumns;
+		$[17] = internalColumnOrder;
+		$[18] = t10;
+	} else t10 = $[18];
+	const configColumns = t10;
+	let t11;
+	if ($[19] !== configColumns || $[20] !== internalVisibleColumns) {
+		let t12;
+		if ($[22] !== internalVisibleColumns) {
+			t12 = (col_1) => internalVisibleColumns?.[col_1.id ?? col_1.accessorKey] ?? true;
+			$[22] = internalVisibleColumns;
+			$[23] = t12;
+		} else t12 = $[23];
+		t11 = configColumns.filter(t12);
+		$[19] = configColumns;
+		$[20] = internalVisibleColumns;
+		$[21] = t11;
+	} else t11 = $[21];
+	const columns = t11;
+	let t12;
+	if ($[24] !== columns || $[25] !== configColumns || $[26] !== handleOrderChange || $[27] !== handleVisibilityChange || $[28] !== internalColumnOrder || $[29] !== internalVisibleColumns) {
+		t12 = {
+			configColumns,
+			columns,
+			visibleColumns: internalVisibleColumns,
+			columnOrder: internalColumnOrder,
+			onVisibilityChange: handleVisibilityChange,
+			onOrderChange: handleOrderChange
+		};
+		$[24] = columns;
+		$[25] = configColumns;
+		$[26] = handleOrderChange;
+		$[27] = handleVisibilityChange;
+		$[28] = internalColumnOrder;
+		$[29] = internalVisibleColumns;
+		$[30] = t12;
+	} else t12 = $[30];
+	return t12;
+}
+function _temp2(col_0) {
+	return col_0.id ?? col_0.accessorKey;
+}
+function _temp(acc, col) {
+	const key = col.id ?? col.accessorKey;
+	acc[key] = true;
+	return acc;
+}
+//#endregion
+export { InfiniteTable as a, useTableNav as c, PaginatedTable as i, HeaderText as l, useSorting as n, ColumnConfigModal as o, usePagination as r, Table as s, useTableColumnConfig as t, CellText as u };