@alneas/appkit-react 0.3.0 → 0.3.1

package/dist/tools/components/data-table/data-table.js

@@ -4,32 +4,33 @@ import { buttonVariants as t } from "../../../ui/components/ui/button-variants.j
 import { Button as n } from "../../../ui/components/ui/button-components.js";
 import { Input as r } from "../../../ui/components/ui/input.js";
 import { DropdownMenu as i, DropdownMenuCheckboxItem as a, DropdownMenuContent as o, DropdownMenuGroup as s, DropdownMenuLabel as c, DropdownMenuSeparator as l, DropdownMenuTrigger as u } from "../../../ui/components/ui/dropdown-menu.js";
-import { Table as d, TableBody as f, TableCell as p, TableHead as m, TableHeader as ee, TableRow as h } from "../../../ui/components/ui/table.js";
+import { Table as d, TableBody as f, TableCell as p, TableHead as ee, TableHeader as m, TableRow as h } from "../../../ui/components/ui/table.js";
+import { useAccessibleDragRef as g } from "../ui/dnd/use-accessible-drag-ref.js";
 import { dataTable_filterPlaceholder as te } from "../../paraglide/messages/datatable_filterplaceholder2.js";
-import { dataTable_goToFirstPage as g } from "../../paraglide/messages/datatable_gotofirstpage4.js";
-import { dataTable_goToLastPage as _ } from "../../paraglide/messages/datatable_gotolastpage4.js";
-import { dataTable_goToNextPage as v } from "../../paraglide/messages/datatable_gotonextpage4.js";
-import { dataTable_goToPreviousPage as y } from "../../paraglide/messages/datatable_gotopreviouspage4.js";
+import { dataTable_goToFirstPage as _ } from "../../paraglide/messages/datatable_gotofirstpage4.js";
+import { dataTable_goToLastPage as v } from "../../paraglide/messages/datatable_gotolastpage4.js";
+import { dataTable_goToNextPage as y } from "../../paraglide/messages/datatable_gotonextpage4.js";
+import { dataTable_goToPreviousPage as b } from "../../paraglide/messages/datatable_gotopreviouspage4.js";
 import { dataTable_items as ne } from "../../paraglide/messages/datatable_items1.js";
 import { dataTable_noResults as re } from "../../paraglide/messages/datatable_noresults2.js";
-import { dataTable_page as ie } from "../../paraglide/messages/datatable_page1.js";
-import { dataTable_rowsPerPage as b } from "../../paraglide/messages/datatable_rowsperpage3.js";
-import { dataTable_rowsSelected as x } from "../../paraglide/messages/datatable_rowsselected2.js";
-import { dataTable_toggleColumns as S } from "../../paraglide/messages/datatable_togglecolumns2.js";
-import { dataTable_view as C } from "../../paraglide/messages/datatable_view1.js";
-import { dataTableFeatures as ae, flexRender as oe, useTable as se } from "./table-engine.js";
-import { getLeafColumnIds as ce, reorderVisibleColumns as le } from "./column-order.js";
-import { useDataTableStore as w } from "./table-store.js";
-import { Fragment as T, jsx as E, jsxs as D } from "react/jsx-runtime";
-import * as O from "react";
-import { ChevronDown as ue, ChevronLeft as k, ChevronRight as A, ChevronUp as j, ChevronsLeft as M, ChevronsRight as N, Filter as de, GripVertical as P, Plus as fe, Settings2 as F } from "lucide-react";
-import { DragDropProvider as pe } from "@dnd-kit/react";
-import { Feedback as me, PointerActivationConstraints as he, PointerSensor as ge } from "@dnd-kit/dom";
-import { closestCenter as I } from "@dnd-kit/collision";
-import { isSortable as _e, useSortable as L } from "@dnd-kit/react/sortable";
+import { dataTable_page as x } from "../../paraglide/messages/datatable_page1.js";
+import { dataTable_rowsPerPage as S } from "../../paraglide/messages/datatable_rowsperpage3.js";
+import { dataTable_rowsSelected as C } from "../../paraglide/messages/datatable_rowsselected2.js";
+import { dataTable_toggleColumns as w } from "../../paraglide/messages/datatable_togglecolumns2.js";
+import { dataTable_view as T } from "../../paraglide/messages/datatable_view1.js";
+import { dataTableFeatures as ie, flexRender as ae, useTable as oe } from "./table-engine.js";
+import { getLeafColumnIds as se, reorderVisibleColumns as ce } from "./column-order.js";
+import { useDataTableStore as E } from "./table-store.js";
+import { Fragment as le, jsx as D, jsxs as O } from "react/jsx-runtime";
+import * as k from "react";
+import { ChevronDown as A, ChevronLeft as j, ChevronRight as M, ChevronUp as N, ChevronsLeft as P, ChevronsRight as F, Filter as ue, GripVertical as I, Plus as de, Settings2 as L } from "lucide-react";
+import { DragDropProvider as fe } from "@dnd-kit/react";
+import { Feedback as pe, PointerActivationConstraints as me, PointerSensor as he } from "@dnd-kit/dom";
+import { closestCenter as R } from "@dnd-kit/collision";
+import { isSortable as ge, useSortable as _e } from "@dnd-kit/react/sortable";
 //#region src/tools/components/data-table/data-table.tsx
 function ve({ header: t, enableColumnOrdering: n = !0, enableMultiSort: r = !1, sortIndex: i, sortableIndex: a, sortableGroup: o, registeredIds: s }) {
-	let c = n && !t.isPlaceholder && t.column.columns.length === 0, { ref: l, handleRef: u, isDragging: d } = L({
+	let c = n && !t.isPlaceholder && t.column.columns.length === 0, { ref: l, handleRef: u, isDragging: d } = _e({
 		id: t.id,
 		index: a,
 		group: o,
@@ -41,46 +42,46 @@ function ve({ header: t, enableColumnOrdering: n = !0, enableMultiSort: r = !1,
 			columnIds: s
 		},
 		disabled: !c,
-		collisionDetector: I
-	}), f = t.column.getCanSort(), p = t.column.getIsSorted(), ee = p !== !1, h = f && typeof t.column.columnDef.header != "function" ? "button" : "span", te = n ? {
+		collisionDetector: R
+	}), f = g(u), p = t.column.getCanSort(), m = t.column.getIsSorted(), h = m !== !1, te = p && typeof t.column.columnDef.header != "function" ? "button" : "span", _ = n ? {
 		opacity: d ? .8 : 1,
 		zIndex: +!!d,
 		position: "relative",
 		cursor: "move"
 	} : {};
-	return /* @__PURE__ */ D(m, {
+	return /* @__PURE__ */ O(ee, {
 		ref: c ? l : void 0,
 		colSpan: t.colSpan,
 		"aria-hidden": t.isPlaceholder || void 0,
-		style: te,
-		"aria-sort": f ? p === "asc" ? "ascending" : p === "desc" ? "descending" : "none" : void 0,
-		className: e("bg-primary/10 text-primary font-bold border-b border-primary/20", f && "cursor-pointer select-none hover:bg-primary/20 transition-colors"),
-		onClick: f ? (e) => {
-			f && !e.target.closest("button, input, select, [role=checkbox]") && (r && e.shiftKey ? t.column.toggleSorting(void 0, !0) : t.column.toggleSorting());
+		style: _,
+		"aria-sort": p ? m === "asc" ? "ascending" : m === "desc" ? "descending" : "none" : void 0,
+		className: e("bg-primary/10 text-primary font-bold border-b border-primary/20", p && "cursor-pointer select-none hover:bg-primary/20 transition-colors"),
+		onClick: p ? (e) => {
+			p && !e.target.closest("button, input, select, [role=checkbox]") && (r && e.shiftKey ? t.column.toggleSorting(void 0, !0) : t.column.toggleSorting());
 		} : void 0,
-		children: [c && /* @__PURE__ */ E("button", {
+		children: [c && /* @__PURE__ */ D("button", {
 			type: "button",
-			ref: u,
+			ref: f,
 			"aria-label": `Reorder column ${t.column.id}`,
 			className: "inline-flex h-6 w-6 items-center justify-center cursor-grab",
-			children: /* @__PURE__ */ E(P, {
+			children: /* @__PURE__ */ D(I, {
 				className: "h-3 w-3",
 				"aria-hidden": "true"
 			})
-		}), t.isPlaceholder ? null : /* @__PURE__ */ D("span", {
+		}), t.isPlaceholder ? null : /* @__PURE__ */ O("span", {
 			className: "inline-flex items-center gap-1",
-			children: [/* @__PURE__ */ E(h, {
-				className: e(ee && "font-semibold"),
-				...h === "button" ? {
+			children: [/* @__PURE__ */ D(te, {
+				className: e(h && "font-semibold"),
+				...te === "button" ? {
 					type: "button",
 					onClick: (e) => {
 						e.stopPropagation(), t.column.toggleSorting(void 0, r && e.shiftKey);
 					}
 				} : {},
-				children: oe(t.column.columnDef.header, t.getContext())
-			}), ee && /* @__PURE__ */ D("span", {
+				children: ae(t.column.columnDef.header, t.getContext())
+			}), h && /* @__PURE__ */ O("span", {
 				className: "inline-flex items-center text-xs",
-				children: [E(p === "asc" ? j : ue, { className: "h-3.5 w-3.5" }), r && i !== void 0 && i >= 0 && /* @__PURE__ */ E("span", {
+				children: [D(m === "asc" ? N : A, { className: "h-3.5 w-3.5" }), r && i !== void 0 && i >= 0 && /* @__PURE__ */ D("span", {
 					className: "text-[10px] ml-0.5",
 					children: i + 1
 				})]
@@ -88,52 +89,52 @@ function ve({ header: t, enableColumnOrdering: n = !0, enableMultiSort: r = !1,
 		})]
 	});
 }
-function ye({ columns: t, data: i, variant: a = "default", filterContent: o, storageKey: s, enableSortingByDefault: c = !0, enableMultiSort: l = !1, showRowNumber: u = !1, itemCount: m, onAdd: g, pageCount: _, rowCount: v, onPaginationChange: y, onSortingChange: ie, onColumnFiltersChange: b, onRowClick: x, onSelectionChange: S, rowIdField: C = "id", manualPagination: T = !1, manualSorting: ue = !1, manualFiltering: k = !1, filterColumn: A, sorting: j, pagination: M, enableColumnOrdering: N = !0, containerClassName: P, tableClassName: F, pageSizeOptions: I = [
+function z({ columns: t, data: i, variant: a = "default", filterContent: o, storageKey: s, enableSortingByDefault: c = !0, enableMultiSort: l = !1, showRowNumber: u = !1, itemCount: ee, onAdd: g, pageCount: _, rowCount: v, onPaginationChange: y, onSortingChange: b, onColumnFiltersChange: x, onRowClick: S, onSelectionChange: C, rowIdField: w = "id", manualPagination: T = !1, manualSorting: le = !1, manualFiltering: A = !1, filterColumn: j, sorting: M, pagination: N, enableColumnOrdering: P = !0, containerClassName: F, tableClassName: I, pageSizeOptions: L = [
 	10,
 	20,
 	30,
 	50,
 	100
-], filterLayout: L = "inline", defaultFilterOpen: ye = !1, activeFiltersContent: B }) {
+], filterLayout: R = "inline", defaultFilterOpen: _e = !1, activeFiltersContent: z }) {
 	"use no memo";
-	let xe = w((e) => e.getTableSettings), Se = w((e) => e.setTableSettings), V = w((e) => e._hasHydrated), H = O.useSyncExternalStore(O.useCallback(() => () => {}, []), () => !0, () => !1), [U, Ce] = O.useState(ye), [we, Te] = O.useState(j || []), [W, Ee] = O.useState([]), [G, De] = O.useState({}), [Oe, ke] = O.useState({}), [Ae, je] = O.useState(M || {
+	let be = E((e) => e.getTableSettings), xe = E((e) => e.setTableSettings), H = E((e) => e._hasHydrated), U = k.useSyncExternalStore(k.useCallback(() => () => {}, []), () => !0, () => !1), [W, Se] = k.useState(_e), [Ce, we] = k.useState(M || []), [G, Te] = k.useState([]), [Ee, De] = k.useState({}), [Oe, ke] = k.useState({}), [Ae, je] = k.useState(N || {
 		pageIndex: 0,
 		pageSize: 10
-	}), [K, q] = O.useState(ce(t)), Me = M !== void 0, J = j ?? we, Y = M ?? Ae, Ne = (e) => {
+	}), [K, Me] = k.useState(se(t)), Ne = N !== void 0, q = M ?? Ce, J = N ?? Ae, Pe = (e) => {
+		let t = typeof e == "function" ? e(q) : e;
+		M === void 0 && we(t), b?.(t);
+	}, Fe = (e) => {
 		let t = typeof e == "function" ? e(J) : e;
-		j === void 0 && Te(t), ie?.(t);
-	}, Pe = (e) => {
-		let t = typeof e == "function" ? e(Y) : e;
-		M === void 0 && je(t), y?.(t);
-	}, [Fe, Ie] = O.useState(null), Le = O.useMemo(() => JSON.stringify([...u ? ["rowNumber"] : [], ...ce(t)]), [t, u]), X = O.useMemo(() => new Set(JSON.parse(Le)), [Le]), Z = s ? JSON.stringify([
+		N === void 0 && je(t), y?.(t);
+	}, [Ie, Le] = k.useState(null), Re = k.useMemo(() => JSON.stringify([...u ? ["rowNumber"] : [], ...se(t)]), [t, u]), Y = k.useMemo(() => new Set(JSON.parse(Re)), [Re]), X = s ? JSON.stringify([
 		s,
-		Le,
-		!!j,
-		!!M
+		Re,
+		!!M,
+		!!N
 	]) : null;
-	if (V && s && Fe !== Z) {
-		Ie(Z);
-		let e = xe(s);
+	if (H && s && Ie !== X) {
+		Le(X);
+		let e = be(s);
 		if (e) {
-			if (!j && e.sorting && e.sorting.length > 0) {
-				let t = e.sorting.filter((e) => X.has(e.id));
-				t.length > 0 && Te(t);
+			if (!M && e.sorting && e.sorting.length > 0) {
+				let t = e.sorting.filter((e) => Y.has(e.id));
+				t.length > 0 && we(t);
 			}
 			if (e.columnVisibility && Object.keys(e.columnVisibility).length > 0) {
 				let t = {};
-				for (let [n, r] of Object.entries(e.columnVisibility)) X.has(n) && (t[n] = r);
+				for (let [n, r] of Object.entries(e.columnVisibility)) Y.has(n) && (t[n] = r);
 				Object.keys(t).length > 0 && De(t);
 			}
-			if (!M && e.pageSize && e.pageSize !== 10 && je((t) => ({
+			if (!N && e.pageSize && e.pageSize !== 10 && je((t) => ({
 				...t,
 				pageSize: e.pageSize
 			})), e.columnOrder && e.columnOrder.length > 0) {
-				let t = e.columnOrder.filter((e) => X.has(e)), n = new Set(t), r = Array.from(X).filter((e) => !n.has(e)), i = [...t, ...r];
-				i.length > 0 && q(i);
+				let t = e.columnOrder.filter((e) => Y.has(e)), n = new Set(t), r = Array.from(Y).filter((e) => !n.has(e)), i = [...t, ...r];
+				i.length > 0 && Me(i);
 			}
 		}
 	}
-	let Re = O.useMemo(() => ({
+	let ze = k.useMemo(() => ({
 		id: "rowNumber",
 		header: "No",
 		enableSorting: !1,
@@ -141,8 +142,8 @@ function ye({ columns: t, data: i, variant: a = "default", filterContent: o, sto
 			let n = t.store.state.pagination;
 			return n ? n.pageIndex * n.pageSize + e.index + 1 : e.index + 1;
 		}
-	}), []), ze = O.useMemo(() => {
-		let e = u ? [Re, ...t] : t;
+	}), []), Z = k.useMemo(() => {
+		let e = u ? [ze, ...t] : t;
 		return c ? e.map((e) => ({
 			...e,
 			enableSorting: e.enableSorting !== !1
@@ -150,78 +151,78 @@ function ye({ columns: t, data: i, variant: a = "default", filterContent: o, sto
 	}, [
 		u,
 		t,
-		Re,
+		ze,
 		c
-	]), Be = O.useCallback((e) => {
-		if (C) return C.split("_").reduce((e, t) => {
+	]), Be = k.useCallback((e) => {
+		if (w) return w.split("_").reduce((e, t) => {
 			if (e && typeof e == "object" && t !== "__proto__" && t !== "constructor" && t !== "prototype" && Object.prototype.hasOwnProperty.call(e, t)) return e[t];
 		}, e);
-	}, [C]);
-	O.useEffect(() => {
-		s && V && Fe === Z && Se(s, {
+	}, [w]);
+	k.useEffect(() => {
+		s && H && Ie === X && xe(s, {
 			columnOrder: K,
-			columnVisibility: G,
-			sorting: J,
-			pageSize: Y.pageSize
+			columnVisibility: Ee,
+			sorting: q,
+			pageSize: J.pageSize
 		});
 	}, [
 		s,
 		K,
-		G,
-		J,
-		Y.pageSize,
-		Se,
-		V,
-		Fe,
-		Z
-	]), O.useEffect(() => {
-		k && b && b(W);
+		Ee,
+		q,
+		J.pageSize,
+		xe,
+		H,
+		Ie,
+		X
+	]), k.useEffect(() => {
+		A && x && x(G);
 	}, [
-		W,
-		k,
-		b
+		G,
+		A,
+		x
 	]);
-	let Q = se({
-		features: ae,
+	let Q = oe({
+		features: ie,
 		data: i,
-		columns: ze,
+		columns: Z,
 		pageCount: T ? _ : void 0,
 		rowCount: T ? v : void 0,
-		getRowId: C ? (e, t) => {
-			let n = C.split("_").reduce((e, t) => {
+		getRowId: w ? (e, t) => {
+			let n = w.split("_").reduce((e, t) => {
 				if (e && typeof e == "object" && t in e) return e[t];
 			}, e);
 			return String(n === void 0 ? t : n);
 		} : void 0,
 		state: {
-			sorting: J,
-			columnFilters: W,
-			columnVisibility: G,
+			sorting: q,
+			columnFilters: G,
+			columnVisibility: Ee,
 			rowSelection: Oe,
-			pagination: Y,
+			pagination: J,
 			columnOrder: K
 		},
 		enableRowSelection: !0,
 		enableMultiSort: l,
 		onRowSelectionChange: ke,
-		onSortingChange: Ne,
-		onColumnFiltersChange: Ee,
+		onSortingChange: Pe,
+		onColumnFiltersChange: Te,
 		onColumnVisibilityChange: De,
-		onPaginationChange: Pe,
-		onColumnOrderChange: q,
-		autoResetPageIndex: T || Me ? !1 : void 0,
+		onPaginationChange: Fe,
+		onColumnOrderChange: Me,
+		autoResetPageIndex: T || Ne ? !1 : void 0,
 		manualPagination: T,
-		manualSorting: ue,
-		manualFiltering: k
+		manualSorting: le,
+		manualFiltering: A
 	});
-	O.useEffect(() => {
-		S && S(Q.getFilteredSelectedRowModel().rows.map((e) => e.original));
+	k.useEffect(() => {
+		C && C(Q.getFilteredSelectedRowModel().rows.map((e) => e.original));
 	}, [
 		Oe,
 		Q,
-		S
+		C
 	]);
-	let Ve = O.useRef(null), He = O.useCallback((e) => {
+	let Ve = k.useRef(null), He = k.useCallback((e) => {
 		let t = e.operation.source;
 		t && Array.isArray(t.data.columnIds) && (Ve.current = {
 			sourceId: String(t.id),
@@ -230,45 +231,45 @@ function ye({ columns: t, data: i, variant: a = "default", filterContent: o, sto
 			leafIds: Q.getAllLeafColumns().map((e) => e.id),
 			order: [...K]
 		});
-	}, [Q, K]), Ue = O.useCallback((e) => {
+	}, [Q, K]), Ue = k.useCallback((e) => {
 		let t = Ve.current;
 		Ve.current = null;
 		let { source: n, target: r } = e.operation;
-		if (e.canceled || !N || !t || !r || !_e(n) || String(n.id) !== t.sourceId) return;
+		if (e.canceled || !P || !t || !r || !ge(n) || String(n.id) !== t.sourceId) return;
 		let i = Q.getAllLeafColumns().map((e) => e.id), a = Q.getHeaderGroups().find((e) => e.id === t.groupId)?.headers.filter((e) => !e.isPlaceholder && e.column.columns.length === 0).map((e) => e.column.id);
-		a && JSON.stringify(a) === JSON.stringify(t.ids) && JSON.stringify(i) === JSON.stringify(t.leafIds) && JSON.stringify(K) === JSON.stringify(t.order) && q((e) => le(e, i, t.ids, n.data.columnId, n.initialIndex, n.index));
+		a && JSON.stringify(a) === JSON.stringify(t.ids) && JSON.stringify(i) === JSON.stringify(t.leafIds) && JSON.stringify(K) === JSON.stringify(t.order) && Me((e) => ce(e, i, t.ids, n.data.columnId, n.initialIndex, n.index));
 	}, [
 		Q,
 		K,
-		N
-	]), We = O.useCallback((e) => J.findIndex((t) => t.id === e), [J]), Ge = O.useCallback(() => /* @__PURE__ */ E(pe, {
-		sensors: (e) => [...e.filter((e) => e !== ge), ge.configure({ activationConstraints: [new he.Distance({ value: 8 })] })],
-		plugins: (e) => [...e, me.configure({
+		P
+	]), We = k.useCallback((e) => q.findIndex((t) => t.id === e), [q]), Ge = k.useCallback(() => /* @__PURE__ */ D(fe, {
+		sensors: (e) => [...e.filter((e) => e !== he), he.configure({ activationConstraints: [new me.Distance({ value: 8 })] })],
+		plugins: (e) => [...e, pe.configure({
 			feedback: "clone",
 			dropAnimation: { duration: 0 }
 		})],
 		onDragStart: He,
 		onDragEnd: Ue,
-		children: /* @__PURE__ */ E("div", {
-			className: e("rounded-md border", F),
-			children: /* @__PURE__ */ D(d, { children: [/* @__PURE__ */ E(ee, { children: Q.getHeaderGroups().map((e) => {
+		children: /* @__PURE__ */ D("div", {
+			className: e("rounded-md border", I),
+			children: /* @__PURE__ */ O(d, { children: [/* @__PURE__ */ D(m, { children: Q.getHeaderGroups().map((e) => {
 				let t = e.headers.filter((e) => !e.isPlaceholder && e.column.columns.length === 0).map((e) => e.column.id);
-				return /* @__PURE__ */ E(h, { children: e.headers.map((n) => /* @__PURE__ */ E(ve, {
+				return /* @__PURE__ */ D(h, { children: e.headers.map((n) => /* @__PURE__ */ D(ve, {
 					header: n,
-					enableColumnOrdering: N,
+					enableColumnOrdering: P,
 					enableMultiSort: l,
 					sortIndex: We(n.column.id),
 					sortableIndex: t.indexOf(n.column.id),
 					sortableGroup: e.id,
 					registeredIds: t
 				}, n.id)) }, e.id);
-			}) }), /* @__PURE__ */ E(f, { children: Q.getRowModel().rows?.length ? Q.getRowModel().rows.map((e) => /* @__PURE__ */ E(h, {
+			}) }), /* @__PURE__ */ D(f, { children: Q.getRowModel().rows?.length ? Q.getRowModel().rows.map((e) => /* @__PURE__ */ D(h, {
 				"data-state": e.getIsSelected() && "selected",
-				onClick: () => x && x(Be(e.original)),
-				className: x ? "cursor-pointer hover:bg-muted/50" : void 0,
-				children: e.getVisibleCells().map((e) => /* @__PURE__ */ E(p, { children: oe(e.column.columnDef.cell, e.getContext()) }, e.id))
-			}, e.id)) : /* @__PURE__ */ E(h, { children: /* @__PURE__ */ E(p, {
-				colSpan: ze.length,
+				onClick: () => S && S(Be(e.original)),
+				className: S ? "cursor-pointer hover:bg-muted/50" : void 0,
+				children: e.getVisibleCells().map((e) => /* @__PURE__ */ D(p, { children: ae(e.column.columnDef.cell, e.getContext()) }, e.id))
+			}, e.id)) : /* @__PURE__ */ D(h, { children: /* @__PURE__ */ D(p, {
+				colSpan: Z.length,
 				className: "h-24 text-center",
 				children: re()
 			}) }) })] })
@@ -277,141 +278,141 @@ function ye({ columns: t, data: i, variant: a = "default", filterContent: o, sto
 		He,
 		Ue,
 		Q,
-		ze,
+		Z,
 		K,
-		N,
+		P,
 		l,
 		We,
-		x,
+		S,
 		Be,
-		F
-	]), $ = () => /* @__PURE__ */ E("div", {
-		className: e("rounded-md border", F),
-		children: /* @__PURE__ */ E(d, { children: /* @__PURE__ */ E(f, { children: /* @__PURE__ */ E(h, { children: /* @__PURE__ */ E(p, {
+		I
+	]), $ = () => /* @__PURE__ */ D("div", {
+		className: e("rounded-md border", I),
+		children: /* @__PURE__ */ D(d, { children: /* @__PURE__ */ D(f, { children: /* @__PURE__ */ D(h, { children: /* @__PURE__ */ D(p, {
 			className: "h-24 text-center",
-			children: /* @__PURE__ */ E("div", {
+			children: /* @__PURE__ */ D("div", {
 				className: "text-muted-foreground",
 				children: "Loading..."
 			})
 		}) }) }) })
 	});
-	return a === "minimal" ? /* @__PURE__ */ D("div", {
-		className: e("space-y-4", P),
-		children: [H ? Ge() : $(), /* @__PURE__ */ E(z, {
+	return a === "minimal" ? /* @__PURE__ */ O("div", {
+		className: e("space-y-4", F),
+		children: [U ? Ge() : $(), /* @__PURE__ */ D(V, {
 			table: Q,
-			pageSizeOptions: I
+			pageSizeOptions: L
 		})]
-	}) : a === "toolbar" ? /* @__PURE__ */ D("div", {
-		className: e("relative h-full", P),
-		children: [g && /* @__PURE__ */ E("div", {
+	}) : a === "toolbar" ? /* @__PURE__ */ O("div", {
+		className: e("relative h-full", F),
+		children: [g && /* @__PURE__ */ D("div", {
 			className: "absolute left-0 top-0 w-full h-full z-10 pointer-events-none",
-			children: /* @__PURE__ */ E("div", {
+			children: /* @__PURE__ */ D("div", {
 				className: "fixed right-4 bottom-10 pointer-events-auto",
-				children: /* @__PURE__ */ E(n, {
+				children: /* @__PURE__ */ D(n, {
 					type: "button",
 					size: "icon",
 					"aria-label": "Add row",
 					onClick: g,
 					className: "w-12 h-12 rounded-full shadow-lg",
-					children: /* @__PURE__ */ E(fe, { className: "w-6 h-6" })
+					children: /* @__PURE__ */ D(de, { className: "w-6 h-6" })
 				})
 			})
-		}), /* @__PURE__ */ D("div", {
+		}), /* @__PURE__ */ O("div", {
 			className: "relative h-full flex flex-col",
 			children: [
-				/* @__PURE__ */ D("div", {
+				/* @__PURE__ */ O("div", {
 					className: "bg-muted p-2 rounded-t-md grid grid-cols-1 sm:grid-cols-[1fr_minmax(0,auto)_1fr] items-center gap-2",
-					children: [/* @__PURE__ */ D("div", {
+					children: [/* @__PURE__ */ O("div", {
 						className: "flex flex-wrap justify-center items-center gap-2 sm:col-start-2 sm:col-end-3",
 						children: [
-							/* @__PURE__ */ E(R, { table: Q }),
-							o && L === "inline" && o,
-							o && L === "panel" && /* @__PURE__ */ D(n, {
+							/* @__PURE__ */ D(B, { table: Q }),
+							o && R === "inline" && o,
+							o && R === "panel" && /* @__PURE__ */ O(n, {
 								type: "button",
-								variant: U ? "default" : "outline",
+								variant: W ? "default" : "outline",
 								size: "sm",
-								onClick: () => Ce(!U),
+								onClick: () => Se(!W),
 								className: "h-8 gap-1.5",
-								children: [/* @__PURE__ */ E(de, { className: "h-4 w-4" }), /* @__PURE__ */ E("span", { children: "フィルター" })]
+								children: [/* @__PURE__ */ D(ue, { className: "h-4 w-4" }), /* @__PURE__ */ D("span", { children: "フィルター" })]
 							})
 						]
-					}), /* @__PURE__ */ D("div", {
+					}), /* @__PURE__ */ O("div", {
 						className: "flex items-center gap-3 justify-center sm:justify-end sm:col-start-3 sm:col-end-4",
-						children: [/* @__PURE__ */ E(be, {
+						children: [/* @__PURE__ */ D(ye, {
 							table: Q,
-							pageSizeOptions: I
-						}), typeof m == "number" && /* @__PURE__ */ E("span", {
+							pageSizeOptions: L
+						}), typeof ee == "number" && /* @__PURE__ */ D("span", {
 							className: "text-sm text-muted-foreground whitespace-nowrap",
-							children: `${m.toLocaleString()} ${ne()}`
+							children: `${ee.toLocaleString()} ${ne()}`
 						})]
 					})]
 				}),
-				o && L === "panel" && /* @__PURE__ */ E("div", {
-					className: e("border-b transition-all duration-200 ease-in-out overflow-hidden bg-background", U ? "max-h-[500px] p-4" : "max-h-0 p-0 border-none"),
+				o && R === "panel" && /* @__PURE__ */ D("div", {
+					className: e("border-b transition-all duration-200 ease-in-out overflow-hidden bg-background", W ? "max-h-[500px] p-4" : "max-h-0 p-0 border-none"),
 					children: o
 				}),
-				B && /* @__PURE__ */ E("div", {
+				z && /* @__PURE__ */ D("div", {
 					className: "bg-background px-4 py-1.5 border-b",
-					children: B
+					children: z
 				}),
-				/* @__PURE__ */ E("div", {
+				/* @__PURE__ */ D("div", {
 					className: "flex-1 overflow-auto",
-					children: H ? Ge() : $()
+					children: U ? Ge() : $()
 				})
 			]
 		})]
-	}) : /* @__PURE__ */ D("div", {
-		className: e("space-y-4", P),
+	}) : /* @__PURE__ */ O("div", {
+		className: e("space-y-4", F),
 		children: [
-			/* @__PURE__ */ D("div", {
+			/* @__PURE__ */ O("div", {
 				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ E("div", {
+				children: [/* @__PURE__ */ D("div", {
 					className: "flex items-center py-4",
-					children: A && /* @__PURE__ */ E(r, {
-						placeholder: te({ column: A }),
-						value: Q.getColumn(A)?.getFilterValue() ?? "",
-						onChange: (e) => Q.getColumn(A)?.setFilterValue(e.target.value),
+					children: j && /* @__PURE__ */ D(r, {
+						placeholder: te({ column: j }),
+						value: Q.getColumn(j)?.getFilterValue() ?? "",
+						onChange: (e) => Q.getColumn(j)?.setFilterValue(e.target.value),
 						className: "max-w-sm"
 					})
-				}), /* @__PURE__ */ E(R, { table: Q })]
+				}), /* @__PURE__ */ D(B, { table: Q })]
 			}),
-			B && /* @__PURE__ */ E("div", {
+			z && /* @__PURE__ */ D("div", {
 				className: "border rounded-md bg-background px-3 py-1",
-				children: B
+				children: z
 			}),
-			H ? Ge() : $(),
-			/* @__PURE__ */ E(z, {
+			U ? Ge() : $(),
+			/* @__PURE__ */ D(V, {
 				table: Q,
-				pageSizeOptions: I
+				pageSizeOptions: L
 			}),
-			g && /* @__PURE__ */ E("div", {
+			g && /* @__PURE__ */ D("div", {
 				className: "fixed right-4 bottom-10 z-10",
-				children: /* @__PURE__ */ E(n, {
+				children: /* @__PURE__ */ D(n, {
 					type: "button",
 					size: "icon",
 					onClick: g,
 					className: "w-12 h-12 rounded-full shadow-lg",
-					children: /* @__PURE__ */ E(fe, { className: "w-6 h-6" })
+					children: /* @__PURE__ */ D(de, { className: "w-6 h-6" })
 				})
 			})
 		]
 	});
 }
-function R({ table: e }) {
-	return /* @__PURE__ */ D(i, { children: [/* @__PURE__ */ D(u, {
+function B({ table: e }) {
+	return /* @__PURE__ */ O(i, { children: [/* @__PURE__ */ O(u, {
 		className: t({
 			variant: "default",
 			size: "sm",
 			className: "h-8"
 		}),
-		children: [/* @__PURE__ */ E(F, { className: "mr-2 h-4 w-4" }), C()]
-	}), /* @__PURE__ */ E(o, {
+		children: [/* @__PURE__ */ D(L, { className: "mr-2 h-4 w-4" }), T()]
+	}), /* @__PURE__ */ D(o, {
 		align: "end",
 		className: "w-40",
-		children: /* @__PURE__ */ D(s, { children: [
-			/* @__PURE__ */ E(c, { children: S() }),
-			/* @__PURE__ */ E(l, {}),
-			e.getAllColumns().filter((e) => e.accessorFn !== void 0 && e.getCanHide()).map((e) => /* @__PURE__ */ E(a, {
+		children: /* @__PURE__ */ O(s, { children: [
+			/* @__PURE__ */ D(c, { children: w() }),
+			/* @__PURE__ */ D(l, {}),
+			e.getAllColumns().filter((e) => e.accessorFn !== void 0 && e.getCanHide()).map((e) => /* @__PURE__ */ D(a, {
 				className: "capitalize",
 				checked: e.getIsVisible(),
 				onCheckedChange: (t) => e.toggleVisibility(!!t),
@@ -420,99 +421,99 @@ function R({ table: e }) {
 		] })
 	})] });
 }
-function z({ table: e, pageSizeOptions: t = [
+function V({ table: e, pageSizeOptions: t = [
 	10,
 	20,
 	30,
 	50,
 	100
 ] }) {
-	return /* @__PURE__ */ D("div", {
+	return /* @__PURE__ */ O("div", {
 		className: "flex items-center justify-between px-2",
-		children: [/* @__PURE__ */ E("div", {
+		children: [/* @__PURE__ */ D("div", {
 			className: "flex-1 text-sm text-muted-foreground",
-			children: x({
+			children: C({
 				selected: e.getFilteredSelectedRowModel().rows.length,
 				total: e.getFilteredRowModel().rows.length
 			})
-		}), /* @__PURE__ */ D("div", {
+		}), /* @__PURE__ */ O("div", {
 			className: "flex items-center space-x-6 lg:space-x-8",
 			children: [
-				/* @__PURE__ */ D("div", {
+				/* @__PURE__ */ O("div", {
 					className: "flex items-center space-x-2",
-					children: [/* @__PURE__ */ E("p", {
+					children: [/* @__PURE__ */ D("p", {
 						className: "text-sm font-medium",
-						children: b()
-					}), /* @__PURE__ */ E("select", {
-						"aria-label": b(),
+						children: S()
+					}), /* @__PURE__ */ D("select", {
+						"aria-label": S(),
 						value: `${e.store.state.pagination.pageSize}`,
 						onChange: (t) => {
 							e.setPageSize(Number(t.target.value));
 						},
 						className: "h-8 w-fit min-w-16 rounded-md border border-input bg-background px-2 py-1 text-sm ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-						children: t.map((e) => /* @__PURE__ */ E("option", {
+						children: t.map((e) => /* @__PURE__ */ D("option", {
 							value: `${e}`,
 							children: e
 						}, e))
 					})]
 				}),
-				/* @__PURE__ */ E("div", {
+				/* @__PURE__ */ D("div", {
 					className: "flex w-24 items-center justify-center text-sm font-medium",
-					children: ie({
+					children: x({
 						current: e.store.state.pagination.pageIndex + 1,
 						total: e.getPageCount()
 					})
 				}),
-				/* @__PURE__ */ D("div", {
+				/* @__PURE__ */ O("div", {
 					className: "flex items-center space-x-2",
 					children: [
-						/* @__PURE__ */ D(n, {
+						/* @__PURE__ */ O(n, {
 							variant: "default",
 							size: "icon",
 							className: "hidden h-8 w-8 lg:flex hover:bg-primary/90",
-							"aria-label": g(),
+							"aria-label": _(),
 							onClick: () => e.setPageIndex(0),
 							disabled: !e.getCanPreviousPage(),
-							children: [/* @__PURE__ */ E("span", {
+							children: [/* @__PURE__ */ D("span", {
 								className: "sr-only",
-								children: g()
-							}), /* @__PURE__ */ E(M, { className: "h-4 w-4" })]
+								children: _()
+							}), /* @__PURE__ */ D(P, { className: "h-4 w-4" })]
 						}),
-						/* @__PURE__ */ D(n, {
+						/* @__PURE__ */ O(n, {
 							variant: "default",
 							size: "icon",
 							className: "h-8 w-8 hover:bg-primary/90",
-							"aria-label": y(),
+							"aria-label": b(),
 							onClick: () => e.previousPage(),
 							disabled: !e.getCanPreviousPage(),
-							children: [/* @__PURE__ */ E("span", {
+							children: [/* @__PURE__ */ D("span", {
 								className: "sr-only",
-								children: y()
-							}), /* @__PURE__ */ E(k, { className: "h-4 w-4" })]
+								children: b()
+							}), /* @__PURE__ */ D(j, { className: "h-4 w-4" })]
 						}),
-						/* @__PURE__ */ D(n, {
+						/* @__PURE__ */ O(n, {
 							variant: "default",
 							size: "icon",
 							className: "h-8 w-8 hover:bg-primary/90",
-							"aria-label": v(),
+							"aria-label": y(),
 							onClick: () => e.nextPage(),
 							disabled: !e.getCanNextPage(),
-							children: [/* @__PURE__ */ E("span", {
+							children: [/* @__PURE__ */ D("span", {
 								className: "sr-only",
-								children: v()
-							}), /* @__PURE__ */ E(A, { className: "h-4 w-4" })]
+								children: y()
+							}), /* @__PURE__ */ D(M, { className: "h-4 w-4" })]
 						}),
-						/* @__PURE__ */ D(n, {
+						/* @__PURE__ */ O(n, {
 							variant: "default",
 							size: "icon",
 							className: "hidden h-8 w-8 lg:flex hover:bg-primary/90",
-							"aria-label": _(),
+							"aria-label": v(),
 							onClick: () => e.setPageIndex(e.getPageCount() - 1),
 							disabled: !e.getCanNextPage(),
-							children: [/* @__PURE__ */ E("span", {
+							children: [/* @__PURE__ */ D("span", {
 								className: "sr-only",
-								children: _()
-							}), /* @__PURE__ */ E(N, { className: "h-4 w-4" })]
+								children: v()
+							}), /* @__PURE__ */ D(F, { className: "h-4 w-4" })]
 						})
 					]
 				})
@@ -520,7 +521,7 @@ function z({ table: e, pageSizeOptions: t = [
 		})]
 	});
 }
-function be({ table: e, pageSizeOptions: t = [
+function ye({ table: e, pageSizeOptions: t = [
 	10,
 	20,
 	30,
@@ -528,39 +529,39 @@ function be({ table: e, pageSizeOptions: t = [
 	100
 ] }) {
 	let r = e.getPageCount();
-	return /* @__PURE__ */ D("div", {
+	return /* @__PURE__ */ O("div", {
 		className: "flex items-center gap-1",
-		children: [/* @__PURE__ */ E("select", {
-			"aria-label": b(),
+		children: [/* @__PURE__ */ D("select", {
+			"aria-label": S(),
 			value: `${e.store.state.pagination.pageSize}`,
 			onChange: (t) => {
 				e.setPageSize(Number(t.target.value));
 			},
 			className: "h-8 w-fit min-w-16 rounded-md border border-input bg-background px-2 py-1 text-sm",
-			children: t.map((e) => /* @__PURE__ */ E("option", {
+			children: t.map((e) => /* @__PURE__ */ D("option", {
 				value: `${e}`,
 				children: e
 			}, e))
-		}), r > 1 && /* @__PURE__ */ D(T, { children: [
-			/* @__PURE__ */ E(n, {
+		}), r > 1 && /* @__PURE__ */ O(le, { children: [
+			/* @__PURE__ */ D(n, {
 				variant: "default",
 				size: "icon",
 				className: "h-8 w-8 hover:bg-primary/90",
-				"aria-label": g(),
+				"aria-label": _(),
 				onClick: () => e.setPageIndex(0),
 				disabled: e.store.state.pagination.pageIndex === 0,
-				children: /* @__PURE__ */ E(M, { className: "h-4 w-4" })
+				children: /* @__PURE__ */ D(P, { className: "h-4 w-4" })
 			}),
-			/* @__PURE__ */ E(n, {
+			/* @__PURE__ */ D(n, {
 				variant: "default",
 				size: "icon",
 				className: "h-8 w-8 hover:bg-primary/90",
-				"aria-label": y(),
+				"aria-label": b(),
 				onClick: () => e.previousPage(),
 				disabled: !e.getCanPreviousPage(),
-				children: /* @__PURE__ */ E(k, { className: "h-4 w-4" })
+				children: /* @__PURE__ */ D(j, { className: "h-4 w-4" })
 			}),
-			/* @__PURE__ */ D("span", {
+			/* @__PURE__ */ O("span", {
 				className: "text-sm text-muted-foreground whitespace-nowrap px-1",
 				children: [
 					e.store.state.pagination.pageIndex + 1,
@@ -568,28 +569,28 @@ function be({ table: e, pageSizeOptions: t = [
 					r
 				]
 			}),
-			/* @__PURE__ */ E(n, {
+			/* @__PURE__ */ D(n, {
 				variant: "default",
 				size: "icon",
 				className: "h-8 w-8 hover:bg-primary/90",
-				"aria-label": v(),
+				"aria-label": y(),
 				onClick: () => e.nextPage(),
 				disabled: !e.getCanNextPage(),
-				children: /* @__PURE__ */ E(A, { className: "h-4 w-4" })
+				children: /* @__PURE__ */ D(M, { className: "h-4 w-4" })
 			}),
-			/* @__PURE__ */ E(n, {
+			/* @__PURE__ */ D(n, {
 				variant: "default",
 				size: "icon",
 				className: "h-8 w-8 hover:bg-primary/90",
-				"aria-label": _(),
+				"aria-label": v(),
 				onClick: () => e.setPageIndex(r - 1),
 				disabled: e.store.state.pagination.pageIndex === r - 1,
-				children: /* @__PURE__ */ E(N, { className: "h-4 w-4" })
+				children: /* @__PURE__ */ D(F, { className: "h-4 w-4" })
 			})
 		] })]
 	});
 }
 //#endregion
-export { ye as DataTable, z as DataTablePagination, be as DataTablePaginationCompact, R as DataTableViewOptions };
+export { z as DataTable, V as DataTablePagination, ye as DataTablePaginationCompact, B as DataTableViewOptions };
 
 //# sourceMappingURL=data-table.js.map