react-flexi-datatable 1.0.5 → 1.0.6

package/dist/index.js

@@ -1,928 +1,689 @@
-import { useEffect as e, useMemo as t, useRef as n, useState as r } from "react";
-import { Check as i, ChevronDown as a, ChevronLeft as o, ChevronRight as s, ChevronUp as c, ChevronsLeft as ee, ChevronsRight as l, ChevronsUpDown as u, Columns3 as te, Download as ne, Edit3 as re, Eye as ie, EyeOff as ae, GripVertical as oe, Pencil as se, RotateCcw as ce, Search as le, SlidersHorizontal as ue, Trash2 as de, X as fe } from "lucide-react";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
-//#region src/components/DataTable.jsx
-var pe = "border border-slate-200 rounded-lg bg-white", me = {
-	Active: "bg-emerald-50 text-emerald-700",
-	Inactive: "bg-slate-100 text-slate-600",
-	Pending: "bg-amber-50 text-amber-700"
-}, p = {
-	default: {
-		header: "bg-slate-50 text-slate-600",
-		footer: "bg-white text-slate-500",
-		toolbar: "bg-white text-slate-900"
-	},
-	dark: {
-		header: "bg-slate-900 text-slate-100",
-		footer: "bg-slate-900 text-slate-300",
-		toolbar: "bg-slate-900 text-slate-100"
-	},
-	indigo: {
-		header: "bg-indigo-900 text-indigo-100",
-		footer: "bg-indigo-50 text-indigo-800",
-		toolbar: "bg-indigo-50/50 text-indigo-900"
-	},
-	emerald: {
-		header: "bg-emerald-900 text-emerald-100",
-		footer: "bg-emerald-50 text-emerald-800",
-		toolbar: "bg-emerald-50/50 text-emerald-900"
-	},
-	slate: {
-		header: "bg-slate-800 text-slate-100",
-		footer: "bg-slate-100 text-slate-700",
-		toolbar: "bg-slate-100 text-slate-800"
-	},
-	blue: {
-		header: "bg-blue-900 text-blue-100",
-		footer: "bg-blue-50 text-blue-800",
-		toolbar: "bg-blue-50/50 text-blue-900"
-	}
+import { jsxs as i, jsx as r } from "react/jsx-runtime";
+import { useState as g, useRef as ue, useEffect as D, useMemo as be } from "react";
+import { Search as Tt, X as Pe, SlidersHorizontal as Mt, Columns3 as Rt, RotateCcw as Lt, GripVertical as pt, Edit3 as Fe, Download as Bt, Trash2 as ut, Check as Ue, ChevronUp as At, ChevronDown as Pt, ChevronsUpDown as Ft, EyeOff as Ut, Eye as Wt, Pencil as Ht, ChevronsLeft as _t, ChevronLeft as qt, ChevronRight as Jt, ChevronsRight as Xt } from "lucide-react";
+const bt = "border border-slate-200 rounded-lg bg-white", Kt = { Active: "bg-emerald-50 text-emerald-700", Inactive: "bg-slate-100 text-slate-600", Pending: "bg-amber-50 text-amber-700" }, me = {
+  default: {
+    header: "bg-slate-50 text-slate-600",
+    footer: "bg-white text-slate-500",
+    toolbar: "bg-white text-slate-900"
+  },
+  dark: {
+    header: "bg-slate-900 text-slate-100",
+    footer: "bg-slate-900 text-slate-300",
+    toolbar: "bg-slate-900 text-slate-100"
+  },
+  indigo: {
+    header: "bg-indigo-900 text-indigo-100",
+    footer: "bg-indigo-50 text-indigo-800",
+    toolbar: "bg-indigo-50/50 text-indigo-900"
+  },
+  emerald: {
+    header: "bg-emerald-900 text-emerald-100",
+    footer: "bg-emerald-50 text-emerald-800",
+    toolbar: "bg-emerald-50/50 text-emerald-900"
+  },
+  slate: {
+    header: "bg-slate-800 text-slate-100",
+    footer: "bg-slate-100 text-slate-700",
+    toolbar: "bg-slate-100 text-slate-800"
+  },
+  blue: {
+    header: "bg-blue-900 text-blue-100",
+    footer: "bg-blue-50 text-blue-800",
+    toolbar: "bg-blue-50/50 text-blue-900"
+  }
 };
-function m({ config: m, data: h = [], onView: g, onEdit: he, onDelete: ge, onBulkEdit: _e }) {
-	let _ = `table_cols_${m.id || m.title || "default"}`, [ve, ye] = r(h), [v, be] = r(""), [y, xe] = r({}), [b, Se] = r({
-		key: null,
-		dir: null
-	}), [Ce, x] = r(1), [S, we] = r(m.pageSize || 10), [C, Te] = r(() => {
-		try {
-			let e = localStorage.getItem(`${_}_visible`);
-			if (e) return JSON.parse(e);
-		} catch {}
-		return Object.fromEntries(m.columns.map((e) => [e.key, e.visible !== !1]));
-	}), [w, Ee] = r(() => {
-		try {
-			let e = localStorage.getItem(`${_}_order`);
-			if (e) return JSON.parse(e);
-		} catch {}
-		return m.columns.map((e) => e.key);
-	}), [T, De] = r(() => {
-		try {
-			let e = localStorage.getItem(`${_}_widths`);
-			if (e) return JSON.parse(e);
-		} catch {}
-		return Object.fromEntries(m.columns.map((e) => [e.key, e.width || 160]));
-	}), [Oe, ke] = r(null), [E, D] = r(null), [Ae, O] = r(null), [k, A] = r([]), [j, M] = r(null), [je, Me] = r(!1), [Ne, Pe] = r(!1), [N, P] = r({
-		row: 0,
-		col: 0
-	}), [Fe, Ie] = r(null), [F, I] = r({}), [L, Le] = r(!1), [Re, R] = r([]), [z, B] = r({}), [V, H] = r(1), ze = n(null), Be = n(null), Ve = n(null), U = n(null);
-	e(() => {
-		m.searchable && U.current && U.current.focus();
-	}, [m.searchable]), e(() => {
-		let e = (e) => {
-			Be.current && !Be.current.contains(e.target) && Pe(!1), Ve.current && !Ve.current.contains(e.target) && Me(!1);
-		};
-		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-	}, []), e(() => ye(h), [h]), e(() => x(1), [
-		v,
-		y,
-		S
-	]), e(() => {
-		try {
-			localStorage.setItem(`${_}_order`, JSON.stringify(w));
-		} catch {}
-	}, [w, _]), e(() => {
-		try {
-			localStorage.setItem(`${_}_visible`, JSON.stringify(C));
-		} catch {}
-	}, [C, _]), e(() => {
-		try {
-			localStorage.setItem(`${_}_widths`, JSON.stringify(T));
-		} catch {}
-	}, [T, _]);
-	let He = () => {
-		let e = m.columns.map((e) => e.key), t = Object.fromEntries(m.columns.map((e) => [e.key, e.visible !== !1])), n = Object.fromEntries(m.columns.map((e) => [e.key, e.width || 160]));
-		Ee(e), Te(t), De(n);
-		try {
-			localStorage.removeItem(`${_}_order`), localStorage.removeItem(`${_}_visible`), localStorage.removeItem(`${_}_widths`);
-		} catch {}
-	}, Ue = (e, t) => {
-		e.preventDefault(), e.stopPropagation();
-		let n = e.clientX, r = T[t] || 160, i = (e) => {
-			let i = e.clientX - n, a = Math.max(70, r + i);
-			De((e) => ({
-				...e,
-				[t]: a
-			}));
-		}, a = () => {
-			document.removeEventListener("mousemove", i), document.removeEventListener("mouseup", a), ke(null);
-		};
-		ke(t), document.addEventListener("mousemove", i), document.addEventListener("mouseup", a);
-	}, W = t(() => {
-		let e = Object.fromEntries(m.columns.map((e) => [e.key, e]));
-		return w.map((t) => e[t]).filter((e) => e && C[e.key]);
-	}, [
-		m.columns,
-		w,
-		C
-	]), We = t(() => m.columns.filter((e) => e.editable !== !1), [m.columns]), Ge = (e) => {
-		if (e.options) return e.options;
-		let t = m.filters?.find((t) => t.key === e.key);
-		return t?.options ? t.options.filter((e) => e.value !== "all").map((e) => e.value) : null;
-	}, G = m.columnordering !== !1 && m.columnOrdering !== !1, Ke = G && m.dropcolumn !== !1 && m.dropColumn !== !1, qe = m.columnwidth !== !1 && m.columnWidth !== !1 && m.resizable !== !1 && m.columnResizing !== !1, K = m.selectable !== !1 && m.checkbox !== !1 && m.checkboxes !== !1 && m.selection !== !1 && (m.selectable || m.checkbox || m.checkboxes || m.selection || !1), Je = m.pagination !== !1, Ye = Je && !!(m.topPagination || m.toppagination || m.paginationTop), Xe = Je && m.bottomPagination !== !1, q = m.theme, Ze = typeof q == "string" && p[q], Qe = m.headerTheme || (typeof q == "object" ? q.header : null) || (Ze ? p[q].header : "bg-slate-50 text-slate-600"), $e = m.footerTheme || (typeof q == "object" ? q.footer : null) || (Ze ? p[q].footer : "bg-white text-slate-500"), et = m.toolbarTheme || (typeof q == "object" ? q.toolbar : null) || (Ze ? p[q].toolbar : "bg-white"), J = m.tableWidth ?? m.tablewidth ?? m.width, Y = m.tableHeight ?? m.tableheight ?? m.height, tt = J && J !== "auto" && J !== !0 ? typeof J == "number" ? `${J}px` : J : "100%", nt = !!(m.tabledatavertivallscroll || m.tableDataVerticalScroll || m.verticalScroll), rt = Y && Y !== "auto" && Y !== !0 ? typeof Y == "number" ? `${Y}px` : Y : nt ? "320px" : null, it = m.tabledatavertivallscroll !== !1 && m.tableDataVerticalScroll !== !1 && m.verticalScroll !== !1 && !!(nt || rt), at = m.tabledatahorizontalscroll !== !1 && m.tableDataHorizontalScroll !== !1 && m.horizontalScroll !== !1, ot = (e, t) => {
-		G && (D(t), e.dataTransfer.setData("text/plain", t), e.dataTransfer.effectAllowed = "move");
-	}, st = (e, t) => {
-		e.preventDefault(), Ke && (e.dataTransfer.dropEffect = "move", Ae !== t && O(t));
-	}, ct = (e, t) => {
-		e.preventDefault(), e.stopPropagation();
-		let n = e.dataTransfer.getData("text/plain") || E;
-		n && n !== t && Ee((e) => {
-			let r = [...e], i = r.indexOf(n), a = r.indexOf(t);
-			return i !== -1 && a !== -1 && (r.splice(i, 1), r.splice(a, 0, n)), r;
-		}), D(null), O(null);
-	}, lt = (e) => {
-		e && (Te((t) => Object.values(t).filter(Boolean).length <= 1 ? t : {
-			...t,
-			[e]: !1
-		}), D(null), O(null));
-	}, X = t(() => {
-		let e = [...ve];
-		if (v.trim()) {
-			let t = v.toLowerCase(), n = m.columns.filter((e) => e.searchable !== !1).map((e) => e.key);
-			e = e.filter((e) => n.some((n) => String(e[n] ?? "").toLowerCase().includes(t)));
-		}
-		return Object.entries(y).forEach(([t, n]) => {
-			n && n !== "all" && (e = e.filter((e) => String(e[t]) === String(n)));
-		}), b.key && e.sort((e, t) => {
-			let n = String(e[b.key] ?? "").toLowerCase(), r = String(t[b.key] ?? "").toLowerCase(), i = n.localeCompare(r, void 0, { numeric: !0 });
-			return b.dir === "asc" ? i : -i;
-		}), e;
-	}, [
-		ve,
-		v,
-		y,
-		b,
-		m.columns
-	]), Z = Math.max(1, Math.ceil(X.length / S)), Q = Math.min(Ce, Z), $ = X.slice((Q - 1) * S, Q * S), ut = t(() => k.length > 0 ? k : $.map((e) => e.id), [k, $]), dt = (e) => {
-		if (b.key !== e) return Se({
-			key: e,
-			dir: "asc"
-		});
-		if (b.dir === "asc") return Se({
-			key: e,
-			dir: "desc"
-		});
-		Se({
-			key: null,
-			dir: null
-		});
-	}, ft = (e) => A(e ? $.map((e) => e.id) : []), pt = (e) => A((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]), mt = (e) => {
-		Ie(e.id), I({ ...e });
-	}, ht = () => {
-		Ie(null), I({});
-	}, gt = () => {
-		ye((e) => e.map((e) => e.id === Fe ? F : e)), he?.(F), Ie(null), I({});
-	}, _t = () => {
-		let e = {}, t = k.length > 0 ? k : $.map((e) => e.id);
-		ve.forEach((n) => {
-			t.includes(n.id) && (e[n.id] = { ...n });
-		}), B(e), R(We.map((e) => e.key)), Le(!0);
-	}, vt = () => {
-		Le(!1), B({}), R([]);
-	}, yt = () => {
-		let e = k.length > 0 ? k : $.map((e) => e.id);
-		ye((t) => t.map((t) => e.includes(t.id) && z[t.id] || t)), _e?.(e, z), Le(!1), B({}), R([]);
-	}, bt = () => {
-		ye((e) => e.filter((e) => e.id !== j.id)), A((e) => e.filter((e) => e !== j.id)), M(null), ge?.(j);
-	}, xt = () => {
-		let e = W.map((e) => e.label).join(","), t = X.map((e) => W.map((t) => `"${String(e[t.key] ?? "").replaceAll("\"", "\"\"")}"`).join(",")).join("\n"), n = new Blob([e + "\n" + t], { type: "text/csv" }), r = document.createElement("a");
-		r.href = URL.createObjectURL(n), r.download = "table-export.csv", r.click(), URL.revokeObjectURL(r.href);
-	};
-	e(() => {
-		let e = (e) => {
-			if (!m.keyboardNavigation || !$.length) return;
-			let t = document.activeElement;
-			if (t && (["TEXTAREA"].includes(t.tagName) || t.tagName === "INPUT" && t.type !== "checkbox" || t.tagName === "SELECT")) return;
-			let n = !!(m.actions?.view || m.actions?.edit || m.actions?.delete), r = W.length + +!!K, i = W.length + +!!K + +!!n, a = t?.closest("[data-cell]"), o = N.row, s = N.col;
-			if (a) {
-				let e = a.getAttribute("data-cell");
-				if (e) {
-					let t = e.split("-").map(Number);
-					t.length === 2 && !isNaN(t[0]) && !isNaN(t[1]) && (o = t[0], s = t[1]);
-				}
-			}
-			if (e.key === "ArrowDown") {
-				e.preventDefault();
-				let t = Math.min($.length - 1, o + 1);
-				P({
-					row: t,
-					col: s
-				});
-			} else if (e.key === "ArrowUp") {
-				e.preventDefault();
-				let t = Math.max(-1, o - 1);
-				P({
-					row: t,
-					col: s
-				});
-			} else if (e.key === "ArrowRight") {
-				if (e.preventDefault(), n && s === r) {
-					let e = ze.current?.querySelector(`[data-cell="${o}-${s}"]`), t = e ? Array.from(e.querySelectorAll("button")) : [];
-					if (V < t.length - 1) {
-						H((e) => e + 1);
-						return;
-					}
-				}
-				let t = Math.min(i - 1, s + 1);
-				P({
-					row: o,
-					col: t
-				});
-			} else if (e.key === "ArrowLeft") {
-				if (e.preventDefault(), n && s === r && V > 0) {
-					H((e) => e - 1);
-					return;
-				}
-				let t = Math.max(0, s - 1);
-				P({
-					row: o,
-					col: t
-				});
-			} else if (e.key === "Enter" || e.key === " ") {
-				if (o === -1) {
-					if (K && s === 0) e.preventDefault(), ft($.length > 0 && !$.every((e) => k.includes(e.id)));
-					else {
-						let t = K ? s - 1 : s, n = W[t];
-						n && n.sortable && (e.preventDefault(), dt(n.key));
-					}
-				} else {
-					let i = $[o];
-					t && (t.type === "checkbox" || t.tagName === "BUTTON") ? (e.key === "Enter" || e.key === " ") && (e.preventDefault(), t.click()) : i && (K && s === 0 ? (e.preventDefault(), pt(i.id)) : n && s === r ? (e.preventDefault(), mt(i)) : e.key === "Enter" && (e.preventDefault(), g?.(i)));
-				}
-			}
-		};
-		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
-	}, [
-		m.keyboardNavigation,
-		$,
-		W,
-		N,
-		V,
-		pt,
-		ft,
-		dt,
-		g,
-		K,
-		k
-	]), e(() => {
-		if (!m.keyboardNavigation || !ze.current || document.activeElement === U.current) return;
-		let e = ze.current.querySelector(`[data-cell="${N.row}-${N.col}"]`);
-		if (e) {
-			let t = Array.from(e.querySelectorAll("input, button, select"));
-			t.length > 0 ? (t[Math.min(V, t.length - 1)] || t[0]).focus() : e.focus();
-		}
-	}, [
-		N,
-		V,
-		m.keyboardNavigation,
-		$
-	]);
-	let St = (e = "bottom") => !Je || e === "top" && !Ye || e === "bottom" && !Xe ? null : /* @__PURE__ */ f("div", {
-		className: `flex flex-col gap-3 ${e === "top" ? "border-b" : "border-t"} border-slate-200 px-4 py-3 sm:flex-row sm:items-center sm:justify-between ${$e}`,
-		children: [/* @__PURE__ */ f("div", {
-			className: "text-sm opacity-85",
-			children: [
-				"Showing ",
-				X.length ? (Q - 1) * S + 1 : 0,
-				"–",
-				Math.min(Q * S, X.length),
-				" of ",
-				X.length
-			]
-		}), /* @__PURE__ */ f("div", {
-			className: "flex items-center gap-2",
-			children: [
-				m.pageSizeOptions && m.pageSizeOptions.length > 0 && /* @__PURE__ */ d("select", {
-					value: S,
-					onChange: (e) => we(Number(e.target.value)),
-					className: "rounded-lg border border-slate-200/80 bg-white/95 text-slate-800 px-2 py-1.5 text-sm outline-none focus:border-indigo-500",
-					children: m.pageSizeOptions.map((e) => /* @__PURE__ */ f("option", {
-						value: e,
-						children: [e, "/page"]
-					}, e))
-				}),
-				/* @__PURE__ */ d("button", {
-					disabled: Q === 1,
-					onClick: () => x(1),
-					className: "rounded-md border border-slate-200/80 bg-white/90 p-1.5 text-slate-700 hover:bg-slate-100 disabled:opacity-40 disabled:hover:bg-transparent",
-					title: "First page",
-					children: /* @__PURE__ */ d(ee, { size: 16 })
-				}),
-				/* @__PURE__ */ d("button", {
-					disabled: Q === 1,
-					onClick: () => x((e) => Math.max(1, e - 1)),
-					className: "rounded-md border border-slate-200/80 bg-white/90 p-1.5 text-slate-700 hover:bg-slate-100 disabled:opacity-40 disabled:hover:bg-transparent",
-					title: "Previous page",
-					children: /* @__PURE__ */ d(o, { size: 16 })
-				}),
-				/* @__PURE__ */ f("span", {
-					className: "px-2 text-sm opacity-90",
-					children: [
-						"Page ",
-						Q,
-						" of ",
-						Z
-					]
-				}),
-				/* @__PURE__ */ d("button", {
-					disabled: Q === Z,
-					onClick: () => x((e) => Math.min(Z, e + 1)),
-					className: "rounded-md border border-slate-200/80 bg-white/90 p-1.5 text-slate-700 hover:bg-slate-100 disabled:opacity-40 disabled:hover:bg-transparent",
-					title: "Next page",
-					children: /* @__PURE__ */ d(s, { size: 16 })
-				}),
-				/* @__PURE__ */ d("button", {
-					disabled: Q === Z,
-					onClick: () => x(Z),
-					className: "rounded-md border border-slate-200/80 bg-white/90 p-1.5 text-slate-700 hover:bg-slate-100 disabled:opacity-40 disabled:hover:bg-transparent",
-					title: "Last page",
-					children: /* @__PURE__ */ d(l, { size: 16 })
-				})
-			]
-		})]
-	}, e);
-	return /* @__PURE__ */ f("div", {
-		className: "space-y-3",
-		style: {
-			width: tt,
-			maxWidth: "100%"
-		},
-		children: [
-			/* @__PURE__ */ d("div", {
-				className: `${pe} p-4 ${et}`,
-				children: /* @__PURE__ */ f("div", {
-					className: "flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between",
-					children: [/* @__PURE__ */ f("div", { children: [/* @__PURE__ */ d("h2", {
-						className: "text-lg font-semibold",
-						children: m.title
-					}), /* @__PURE__ */ f("p", {
-						className: "text-sm text-slate-500",
-						children: [X.length, " records"]
-					})] }), /* @__PURE__ */ f("div", {
-						className: "flex flex-wrap gap-2",
-						children: [
-							!!m.searchable && /* @__PURE__ */ f("div", {
-								className: "relative",
-								children: [
-									/* @__PURE__ */ d(le, {
-										size: 16,
-										className: "absolute left-3 top-1/2 -translate-y-1/2 text-slate-400"
-									}),
-									/* @__PURE__ */ d("input", {
-										ref: U,
-										autoFocus: !0,
-										value: v,
-										onChange: (e) => be(e.target.value),
-										placeholder: "Search...",
-										className: "w-56 rounded-lg border border-slate-200 py-2 pl-9 pr-8 text-sm outline-none focus:border-indigo-500 focus:ring-2 focus:ring-indigo-500/20"
-									}),
-									v && /* @__PURE__ */ d("button", {
-										onClick: () => {
-											be(""), U.current?.focus();
-										},
-										className: "absolute right-2 top-1/2 -translate-y-1/2 text-slate-400 hover:text-slate-600",
-										children: /* @__PURE__ */ d(fe, { size: 15 })
-									})
-								]
-							}),
-							!!(m.filterable !== !1 && m.filters && m.filters.length > 0) && /* @__PURE__ */ f("div", {
-								ref: Be,
-								className: "relative",
-								children: [/* @__PURE__ */ f("button", {
-									onClick: () => Pe((e) => !e),
-									className: "flex items-center gap-2 rounded-lg border border-slate-200 px-3 py-2 text-sm",
-									children: [/* @__PURE__ */ d(ue, { size: 16 }), "Filter"]
-								}), Ne && /* @__PURE__ */ f("div", {
-									className: "absolute right-0 z-30 mt-2 w-64 rounded-xl border bg-white p-4 shadow-xl",
-									children: [m.filters?.map((e) => /* @__PURE__ */ f("label", {
-										className: "mb-3 block text-sm",
-										children: [/* @__PURE__ */ d("span", {
-											className: "mb-1 block font-medium",
-											children: e.label
-										}), /* @__PURE__ */ d("select", {
-											value: y[e.key] || "all",
-											onChange: (t) => xe((n) => ({
-												...n,
-												[e.key]: t.target.value
-											})),
-											className: "w-full rounded-lg border p-2",
-											children: e.options.map((e) => /* @__PURE__ */ d("option", {
-												value: e.value,
-												children: e.label
-											}, e.value))
-										})]
-									}, e.key)), /* @__PURE__ */ d("button", {
-										onClick: () => xe({}),
-										className: "text-sm font-medium text-slate-600",
-										children: "Clear filters"
-									})]
-								})]
-							}),
-							!!m.columnVisibility && /* @__PURE__ */ f("div", {
-								ref: Ve,
-								className: "relative",
-								children: [/* @__PURE__ */ f("button", {
-									onClick: () => Me((e) => !e),
-									className: "flex items-center gap-2 rounded-lg border border-slate-200 px-3 py-2 text-sm",
-									children: [/* @__PURE__ */ d(te, { size: 16 }), "Columns"]
-								}), je && /* @__PURE__ */ f("div", {
-									className: "absolute right-0 z-30 mt-2 w-64 rounded-xl border bg-white p-3.5 shadow-xl",
-									children: [
-										/* @__PURE__ */ f("div", {
-											className: "flex items-center justify-between pb-2 mb-2 border-b",
-											children: [/* @__PURE__ */ d("span", {
-												className: "text-xs font-semibold uppercase tracking-wider text-slate-500",
-												children: "Columns & Layout"
-											}), /* @__PURE__ */ f("button", {
-												onClick: He,
-												className: "flex items-center gap-1 text-xs text-indigo-600 hover:text-indigo-800 font-medium",
-												title: "Reset default layout",
-												children: [/* @__PURE__ */ d(ce, { size: 12 }), "Reset"]
-											})]
-										}),
-										/* @__PURE__ */ d("div", {
-											className: "space-y-1 max-h-64 overflow-y-auto",
-											children: w.map((e) => {
-												let t = m.columns.find((t) => t.key === e);
-												if (!t) return null;
-												let n = C[e] !== !1;
-												return /* @__PURE__ */ f("div", {
-													draggable: !0,
-													onDragStart: (e) => ot(e, t.key),
-													onDragOver: (e) => st(e, t.key),
-													onDrop: (e) => ct(e, t.key),
-													className: `flex items-center justify-between p-2 text-sm rounded-lg hover:bg-slate-50 cursor-grab active:cursor-grabbing transition-colors ${E === t.key ? "opacity-30 bg-slate-100" : ""} ${Ae === t.key && E !== t.key ? "border-l-4 border-l-indigo-600 bg-indigo-50/60" : ""}`,
-													children: [/* @__PURE__ */ f("div", {
-														className: "flex items-center gap-2",
-														children: [/* @__PURE__ */ d("span", {
-															title: "Drag to reorder",
-															className: "text-slate-300 hover:text-slate-500 cursor-grab",
-															children: /* @__PURE__ */ d(oe, { size: 14 })
-														}), /* @__PURE__ */ f("label", {
-															className: "flex items-center gap-2 cursor-pointer select-none",
-															children: [/* @__PURE__ */ d("input", {
-																type: "checkbox",
-																checked: n,
-																onChange: () => Te((e) => {
-																	let n = Object.values(e).filter(Boolean).length;
-																	return e[t.key] && n === 1 ? e : {
-																		...e,
-																		[t.key]: !e[t.key]
-																	};
-																}),
-																className: "rounded text-indigo-600 focus:ring-indigo-500"
-															}), /* @__PURE__ */ d("span", {
-																className: n ? "font-medium text-slate-800" : "text-slate-400 line-through",
-																children: t.label
-															})]
-														})]
-													}), qe && /* @__PURE__ */ f("span", {
-														className: "text-xs text-slate-400 font-mono",
-														children: [T[t.key] || 160, "px"]
-													})]
-												}, t.key);
-											})
-										}),
-										/* @__PURE__ */ d("p", {
-											className: "mt-2.5 pt-2 border-t text-[11px] text-slate-400 text-center",
-											children: G && qe ? "Drag handles to reorder | Drag column edge to resize" : G ? "Drag handles to reorder" : qe ? "Drag column edge to resize" : "Column layout options"
-										})
-									]
-								})]
-							}),
-							m.bulkEditable !== !1 && We.length > 0 && /* @__PURE__ */ f("button", {
-								onClick: _t,
-								className: `flex items-center gap-2 rounded-lg border px-3 py-2 text-sm font-medium transition-colors ${L ? "border-indigo-500 bg-indigo-600 text-white" : k.length > 0 ? "border-indigo-300 bg-indigo-50 text-indigo-700 hover:bg-indigo-100" : "border-slate-200 bg-white text-slate-700 hover:bg-slate-50"}`,
-								children: [
-									/* @__PURE__ */ d(re, { size: 16 }),
-									"Bulk Edit",
-									k.length > 0 ? ` (${k.length})` : ""
-								]
-							}),
-							m.exportable && /* @__PURE__ */ f("button", {
-								onClick: xt,
-								className: "flex items-center gap-2 rounded-lg border border-slate-200 px-3 py-2 text-sm",
-								children: [/* @__PURE__ */ d(ne, { size: 16 }), "Export"]
-							})
-						]
-					})]
-				})
-			}),
-			Ke && /* @__PURE__ */ d("div", {
-				onDragOver: (e) => {
-					e.preventDefault(), e.dataTransfer.dropEffect = "move";
-				},
-				onDrop: (e) => {
-					e.preventDefault();
-					let t = e.dataTransfer.getData("text/plain") || E;
-					t && lt(t);
-				},
-				className: `transition-all duration-200 overflow-hidden ${E ? "max-h-24 opacity-100 my-2" : "max-h-0 opacity-0 my-0 pointer-events-none"}`,
-				children: /* @__PURE__ */ f("div", {
-					className: "flex items-center justify-center gap-2 rounded-xl border-2 border-dashed border-rose-400 bg-rose-50 p-3 text-sm font-semibold text-rose-700 shadow-sm",
-					children: [/* @__PURE__ */ d(de, {
-						size: 20,
-						className: "text-rose-600 animate-bounce"
-					}), /* @__PURE__ */ f("span", { children: ["Drop column header here to hide column ", /* @__PURE__ */ d("b", { children: m.columns.find((e) => e.key === E)?.label })] })]
-				})
-			}),
-			L && /* @__PURE__ */ f("div", {
-				className: "flex flex-wrap items-center justify-between gap-3 rounded-xl border border-indigo-200 bg-indigo-50/80 p-3.5 shadow-sm",
-				children: [/* @__PURE__ */ f("div", {
-					className: "flex flex-wrap items-center gap-3",
-					children: [/* @__PURE__ */ f("div", {
-						className: "flex items-center gap-2",
-						children: [/* @__PURE__ */ d(re, {
-							size: 18,
-							className: "text-indigo-600"
-						}), /* @__PURE__ */ f("span", {
-							className: "font-semibold text-slate-900 text-sm",
-							children: [
-								"Bulk Edit Mode (",
-								ut.length,
-								" records):"
-							]
-						})]
-					}), /* @__PURE__ */ f("div", {
-						className: "flex flex-wrap items-center gap-2",
-						children: [/* @__PURE__ */ d("span", {
-							className: "text-xs font-medium text-slate-600",
-							children: "Select columns to edit:"
-						}), We.map((e) => {
-							let t = Re.includes(e.key);
-							return /* @__PURE__ */ f("button", {
-								type: "button",
-								onClick: () => {
-									R(t ? (t) => t.filter((t) => t !== e.key) : (t) => [...t, e.key]);
-								},
-								className: `flex items-center gap-1.5 rounded-lg px-2.5 py-1 text-xs font-medium border transition-all ${t ? "border-indigo-500 bg-indigo-600 text-white shadow-xs" : "border-slate-200 bg-white text-slate-700 hover:border-slate-300 hover:bg-slate-50"}`,
-								children: [/* @__PURE__ */ d("span", {
-									className: `flex h-3.5 w-3.5 items-center justify-center rounded border ${t ? "border-white bg-white text-indigo-600" : "border-slate-300 bg-white"}`,
-									children: t && /* @__PURE__ */ d(i, {
-										size: 10,
-										strokeWidth: 3
-									})
-								}), /* @__PURE__ */ d("span", { children: e.label })]
-							}, e.key);
-						})]
-					})]
-				}), /* @__PURE__ */ f("div", {
-					className: "flex items-center gap-2",
-					children: [/* @__PURE__ */ f("button", {
-						onClick: vt,
-						className: "flex items-center gap-1.5 rounded-lg border border-slate-200 bg-white px-3 py-1.5 text-xs font-medium text-slate-700 hover:bg-slate-50 transition-colors",
-						children: [/* @__PURE__ */ d(fe, {
-							size: 14,
-							className: "text-rose-500"
-						}), "Cancel"]
-					}), /* @__PURE__ */ f("button", {
-						onClick: yt,
-						className: "flex items-center gap-1.5 rounded-lg bg-emerald-600 px-3.5 py-1.5 text-xs font-medium text-white hover:bg-emerald-700 shadow-sm transition-colors",
-						children: [/* @__PURE__ */ d(i, { size: 14 }), "Save"]
-					})]
-				})]
-			}),
-			/* @__PURE__ */ f("div", {
-				className: `${pe} overflow-hidden`,
-				children: [
-					St("top"),
-					/* @__PURE__ */ d("div", {
-						style: { maxHeight: rt || void 0 },
-						className: `${at ? "overflow-x-auto" : ""} ${it ? "overflow-y-auto" : ""}`,
-						children: /* @__PURE__ */ f("table", {
-							ref: ze,
-							className: "min-w-full text-sm table-fixed",
-							children: [/* @__PURE__ */ d("thead", {
-								className: `sticky top-0 z-20 border-b border-slate-200 ${Qe}`,
-								children: /* @__PURE__ */ f("tr", { children: [
-									K && /* @__PURE__ */ d("th", {
-										"data-cell": "-1-0",
-										className: "w-12 px-4 py-3",
-										children: /* @__PURE__ */ d("input", {
-											type: "checkbox",
-											checked: $.length > 0 && $.every((e) => k.includes(e.id)),
-											onChange: (e) => ft(e.target.checked),
-											onFocus: () => P({
-												row: -1,
-												col: 0
-											})
-										})
-									}),
-									W.map((e, t) => {
-										let n = K ? t + 1 : t, r = E === e.key, i = Ae === e.key && E !== e.key, o = T[e.key] || e.width || 160;
-										return /* @__PURE__ */ f("th", {
-											"data-cell": `-1-${n}`,
-											style: {
-												width: `${o}px`,
-												minWidth: `${o}px`
-											},
-											draggable: G,
-											onDragStart: (t) => ot(t, e.key),
-											onDragOver: (t) => st(t, e.key),
-											onDragLeave: () => O(null),
-											onDrop: (t) => ct(t, e.key),
-											onDragEnd: () => {
-												D(null), O(null);
-											},
-											"aria-sort": b.key === e.key ? b.dir : "none",
-											className: `group relative whitespace-nowrap px-4 py-3 text-left font-semibold ${G ? "cursor-grab active:cursor-grabbing" : ""} transition-colors select-none ${r ? "opacity-30 bg-slate-100" : ""} ${i ? "border-l-4 border-l-indigo-600 bg-indigo-50/60" : ""}`,
-											children: [/* @__PURE__ */ f("div", {
-												className: "flex items-center justify-between gap-1.5 pr-2",
-												children: [/* @__PURE__ */ f("div", {
-													className: "flex items-center gap-1.5 overflow-hidden",
-													children: [G && /* @__PURE__ */ d("span", {
-														title: "Drag header to reorder",
-														className: "opacity-60 group-hover:opacity-100 cursor-grab shrink-0",
-														children: /* @__PURE__ */ d(oe, { size: 14 })
-													}), /* @__PURE__ */ f("button", {
-														disabled: !e.sortable,
-														onClick: () => e.sortable && dt(e.key),
-														className: `flex items-center gap-1 truncate ${e.sortable ? "hover:opacity-80" : ""}`,
-														children: [/* @__PURE__ */ d("span", {
-															className: "truncate",
-															children: e.label
-														}), e.sortable && (b.key === e.key ? b.dir === "asc" ? /* @__PURE__ */ d(c, {
-															size: 15,
-															className: "shrink-0"
-														}) : /* @__PURE__ */ d(a, {
-															size: 15,
-															className: "shrink-0"
-														}) : /* @__PURE__ */ d(u, {
-															size: 15,
-															className: "opacity-50 shrink-0"
-														}))]
-													})]
-												}), /* @__PURE__ */ d("button", {
-													type: "button",
-													title: "Hide column",
-													onClick: (t) => {
-														t.stopPropagation(), lt(e.key);
-													},
-													className: "opacity-0 group-hover:opacity-100 transition-opacity p-0.5 hover:text-rose-400 rounded shrink-0",
-													children: /* @__PURE__ */ d(ae, { size: 13 })
-												})]
-											}), qe && /* @__PURE__ */ d("div", {
-												draggable: !1,
-												onMouseDown: (t) => Ue(t, e.key),
-												onDoubleClick: (t) => {
-													t.stopPropagation(), De((t) => ({
-														...t,
-														[e.key]: e.width || 160
-													}));
-												},
-												title: "Drag to resize column width",
-												className: `absolute right-0 top-0 bottom-0 w-2.5 cursor-col-resize group-hover:bg-indigo-300/50 hover:!bg-indigo-500 transition-colors z-10 ${Oe === e.key ? "bg-indigo-600 w-1" : ""}`
-											})]
-										}, e.key);
-									}),
-									(m.actions?.view || m.actions?.edit || m.actions?.delete) && /* @__PURE__ */ d("th", {
-										className: `sticky right-0 top-0 z-30 px-4 py-3 text-right font-semibold w-32 ${Qe}`,
-										children: "Actions"
-									})
-								] })
-							}), /* @__PURE__ */ f("tbody", { children: [$.map((e, t) => {
-								let n = Fe === e.id, r = L && ut.includes(e.id);
-								return /* @__PURE__ */ f("tr", {
-									className: `border-b last:border-0 ${n || r ? "bg-indigo-50/20" : "hover:bg-slate-50"}`,
-									children: [
-										K && /* @__PURE__ */ d("td", {
-											"data-cell": `${t}-0`,
-											className: "px-4 py-3",
-											children: /* @__PURE__ */ d("input", {
-												type: "checkbox",
-												checked: k.includes(e.id),
-												onChange: () => pt(e.id),
-												onFocus: () => P({
-													row: t,
-													col: 0
-												})
-											})
-										}),
-										W.map((i, a) => {
-											let o = K ? a + 1 : a, s = r && Re.includes(i.key) && i.editable !== !1, c = Ge(i), ee = T[i.key] || i.width || 160, l = e[i.key], u = l == null ? "" : String(l), te = u.length > 25;
-											return /* @__PURE__ */ d("td", {
-												"data-cell": `${t}-${o}`,
-												style: {
-													width: `${ee}px`,
-													minWidth: `${ee}px`
-												},
-												className: "px-4 py-3 truncate",
-												tabIndex: -1,
-												title: te ? u : void 0,
-												children: n && i.editable !== !1 ? c ? /* @__PURE__ */ d("select", {
-													value: F[i.key] ?? "",
-													onChange: (e) => I({
-														...F,
-														[i.key]: e.target.value
-													}),
-													onKeyDown: (e) => {
-														e.key === "Enter" && gt(), e.key === "Escape" && ht();
-													},
-													className: "w-full rounded-md border border-indigo-300 bg-white px-2 py-1 text-sm outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500",
-													children: c.map((e) => {
-														let t = typeof e == "object" ? e.value : e, n = typeof e == "object" ? e.label : e;
-														return /* @__PURE__ */ d("option", {
-															value: t,
-															children: n
-														}, t);
-													})
-												}) : /* @__PURE__ */ d("input", {
-													type: "text",
-													value: F[i.key] ?? "",
-													onChange: (e) => I({
-														...F,
-														[i.key]: e.target.value
-													}),
-													onKeyDown: (e) => {
-														e.key === "Enter" && gt(), e.key === "Escape" && ht();
-													},
-													className: "w-full rounded-md border border-indigo-300 bg-white px-2 py-1 text-sm outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500"
-												}) : s ? c ? /* @__PURE__ */ d("select", {
-													value: z[e.id]?.[i.key] ?? e[i.key] ?? "",
-													onChange: (t) => B((n) => ({
-														...n,
-														[e.id]: {
-															...n[e.id] || e,
-															[i.key]: t.target.value
-														}
-													})),
-													onKeyDown: (e) => {
-														e.key === "Enter" && yt(), e.key === "Escape" && vt();
-													},
-													className: "w-full rounded-md border border-indigo-400 bg-white px-2 py-1 text-sm outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500",
-													children: c.map((e) => {
-														let t = typeof e == "object" ? e.value : e, n = typeof e == "object" ? e.label : e;
-														return /* @__PURE__ */ d("option", {
-															value: t,
-															children: n
-														}, t);
-													})
-												}) : /* @__PURE__ */ d("input", {
-													type: "text",
-													value: z[e.id]?.[i.key] ?? e[i.key] ?? "",
-													onChange: (t) => B((n) => ({
-														...n,
-														[e.id]: {
-															...n[e.id] || e,
-															[i.key]: t.target.value
-														}
-													})),
-													onKeyDown: (e) => {
-														e.key === "Enter" && yt(), e.key === "Escape" && vt();
-													},
-													className: "w-full rounded-md border border-indigo-400 bg-white px-2 py-1 text-sm outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500"
-												}) : i.render ? i.render(l, e, t) : i.key === "status" ? /* @__PURE__ */ d("span", {
-													className: `rounded-full px-2.5 py-1 text-xs font-medium ${me[l] || "bg-slate-100 text-slate-600"}`,
-													children: l
-												}) : te ? /* @__PURE__ */ f("span", {
-													title: u,
-													children: [u.slice(0, 25), "..."]
-												}) : u
-											}, i.key);
-										}),
-										(m.actions?.view || m.actions?.edit || m.actions?.delete) && /* @__PURE__ */ d("td", {
-											"data-cell": `${t}-${W.length + +!!K}`,
-											className: "sticky right-0 bg-white px-4 py-3 w-32 z-10",
-											children: n ? /* @__PURE__ */ f("div", {
-												className: "flex justify-end gap-1",
-												children: [/* @__PURE__ */ d("button", {
-													title: "Save",
-													onClick: gt,
-													className: "rounded-md bg-emerald-100 p-2 text-emerald-700 hover:bg-emerald-200",
-													children: /* @__PURE__ */ d(i, { size: 16 })
-												}), /* @__PURE__ */ d("button", {
-													title: "Cancel",
-													onClick: ht,
-													className: "rounded-md bg-rose-100 p-2 text-rose-700 hover:bg-rose-200",
-													children: /* @__PURE__ */ d(fe, { size: 16 })
-												})]
-											}) : /* @__PURE__ */ f("div", {
-												className: "flex justify-end gap-1",
-												children: [
-													m.actions.view && /* @__PURE__ */ d("button", {
-														title: "View",
-														onClick: () => g?.(e),
-														onFocus: () => {
-															P({
-																row: t,
-																col: W.length + +!!K
-															}), H(0);
-														},
-														className: "rounded-md p-2 hover:bg-slate-100 focus:outline-none focus:ring-2 focus:ring-slate-400",
-														children: /* @__PURE__ */ d(ie, { size: 16 })
-													}),
-													m.actions.edit && /* @__PURE__ */ d("button", {
-														title: "Edit",
-														onClick: () => mt(e),
-														onFocus: () => {
-															P({
-																row: t,
-																col: W.length + +!!K
-															}), H(1);
-														},
-														className: "rounded-md p-2 hover:bg-slate-100 focus:outline-none focus:ring-2 focus:ring-slate-400",
-														children: /* @__PURE__ */ d(se, { size: 16 })
-													}),
-													m.actions.delete && /* @__PURE__ */ d("button", {
-														title: "Delete",
-														onClick: () => M(e),
-														onFocus: () => {
-															P({
-																row: t,
-																col: W.length + +!!K
-															}), H(2);
-														},
-														className: "rounded-md p-2 text-red-600 hover:bg-red-50 focus:outline-none focus:ring-2 focus:ring-red-400",
-														children: /* @__PURE__ */ d(de, { size: 16 })
-													})
-												]
-											})
-										})
-									]
-								}, e.id);
-							}), !$.length && /* @__PURE__ */ d("tr", { children: /* @__PURE__ */ f("td", {
-								colSpan: W.length + +!!K + 1,
-								className: "px-6 py-16 text-center",
-								children: [/* @__PURE__ */ d("div", {
-									className: "font-medium",
-									children: "No records found"
-								}), /* @__PURE__ */ d("div", {
-									className: "mt-1 text-sm text-slate-500",
-									children: "Try changing your search or filters."
-								})]
-							}) })] })]
-						})
-					}),
-					St("bottom")
-				]
-			}),
-			k.length > 0 && !L && /* @__PURE__ */ f("div", {
-				className: "fixed bottom-5 left-1/2 z-40 flex -translate-x-1/2 items-center gap-3 rounded-xl bg-slate-900 px-4 py-2.5 text-sm text-white shadow-xl",
-				children: [
-					/* @__PURE__ */ f("span", {
-						className: "font-medium pl-1",
-						children: [k.length, " selected"]
-					}),
-					m.bulkEditable !== !1 && We.length > 0 && /* @__PURE__ */ f("button", {
-						onClick: _t,
-						className: "flex items-center gap-1.5 rounded-lg bg-indigo-600 px-3 py-1.5 text-xs font-semibold text-white hover:bg-indigo-500 transition-colors shadow-sm",
-						children: [/* @__PURE__ */ d(re, { size: 14 }), "Bulk Edit"]
-					}),
-					/* @__PURE__ */ d("button", {
-						onClick: () => A([]),
-						className: "text-xs text-slate-400 hover:text-white underline pr-1",
-						children: "Clear"
-					})
-				]
-			}),
-			j && /* @__PURE__ */ d("div", {
-				onClick: (e) => {
-					e.target === e.currentTarget && M(null);
-				},
-				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/40 p-4",
-				children: /* @__PURE__ */ f("div", {
-					className: "w-full max-w-sm rounded-2xl bg-white p-6 shadow-2xl",
-					children: [
-						/* @__PURE__ */ d("h3", {
-							className: "text-lg font-semibold",
-							children: "Delete record?"
-						}),
-						/* @__PURE__ */ f("p", {
-							className: "mt-2 text-sm text-slate-500",
-							children: [
-								"Are you sure you want to delete ",
-								/* @__PURE__ */ d("b", { children: j.name }),
-								"? This action cannot be undone."
-							]
-						}),
-						/* @__PURE__ */ f("div", {
-							className: "mt-6 flex justify-end gap-2",
-							children: [/* @__PURE__ */ d("button", {
-								onClick: () => M(null),
-								className: "rounded-lg border px-4 py-2 text-sm",
-								children: "Cancel"
-							}), /* @__PURE__ */ d("button", {
-								onClick: bt,
-								className: "rounded-lg bg-red-600 px-4 py-2 text-sm font-medium text-white",
-								children: "Delete"
-							})]
-						})
-					]
-				})
-			})
-		]
-	});
+function Zt({ config: o, data: $ = [], onView: O, onEdit: fe, onDelete: ve, onBulkEdit: we }) {
+  var st, ct, dt, gt, ht;
+  const y = `table_cols_${o.id || o.title || "default"}`, [xe, te] = g($), [L, We] = g(""), [oe, He] = g({}), [k, ye] = g({ key: null, dir: null }), [mt, H] = g(1), [I, ft] = g(o.pageSize || 10), [_, ke] = g(() => {
+    try {
+      const e = localStorage.getItem(`${y}_visible`);
+      if (e) return JSON.parse(e);
+    } catch {
+    }
+    return Object.fromEntries(o.columns.map((e) => [e.key, e.visible !== !1]));
+  }), [q, _e] = g(() => {
+    try {
+      const e = localStorage.getItem(`${y}_order`);
+      if (e) return JSON.parse(e);
+    } catch {
+    }
+    return o.columns.map((e) => e.key);
+  }), [B, Ne] = g(() => {
+    try {
+      const e = localStorage.getItem(`${y}_widths`);
+      if (e) return JSON.parse(e);
+    } catch {
+    }
+    return Object.fromEntries(o.columns.map((e) => [e.key, e.width || 160]));
+  }), [vt, qe] = g(null), [j, re] = g(null), [Ce, J] = g(null), [m, ae] = g([]), [X, ie] = g(null), [wt, Je] = g(!1), [xt, Xe] = g(!1), [A, z] = g({ row: 0, col: 0 }), [Ke, ze] = g(null), [P, K] = g({}), [le, Se] = g(!1), [Ve, V] = g([]), [ne, G] = g({}), [Y, Q] = g(1), se = ue(null), Ee = ue(null), De = ue(null), Z = ue(null);
+  D(() => {
+    o.searchable && Z.current && Z.current.focus();
+  }, [o.searchable]), D(() => {
+    const e = (t) => {
+      Ee.current && !Ee.current.contains(t.target) && Xe(!1), De.current && !De.current.contains(t.target) && Je(!1);
+    };
+    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, []), D(() => te($), [$]), D(() => H(1), [L, oe, I]), D(() => {
+    try {
+      localStorage.setItem(`${y}_order`, JSON.stringify(q));
+    } catch {
+    }
+  }, [q, y]), D(() => {
+    try {
+      localStorage.setItem(`${y}_visible`, JSON.stringify(_));
+    } catch {
+    }
+  }, [_, y]), D(() => {
+    try {
+      localStorage.setItem(`${y}_widths`, JSON.stringify(B));
+    } catch {
+    }
+  }, [B, y]);
+  const yt = () => {
+    const e = o.columns.map((l) => l.key), t = Object.fromEntries(o.columns.map((l) => [l.key, l.visible !== !1])), a = Object.fromEntries(o.columns.map((l) => [l.key, l.width || 160]));
+    _e(e), ke(t), Ne(a);
+    try {
+      localStorage.removeItem(`${y}_order`), localStorage.removeItem(`${y}_visible`), localStorage.removeItem(`${y}_widths`);
+    } catch {
+    }
+  }, kt = (e, t) => {
+    e.preventDefault(), e.stopPropagation();
+    const a = e.clientX, l = B[t] || 160, c = (h) => {
+      const d = h.clientX - a, x = Math.max(70, l + d);
+      Ne((u) => ({ ...u, [t]: x }));
+    }, p = () => {
+      document.removeEventListener("mousemove", c), document.removeEventListener("mouseup", p), qe(null);
+    };
+    qe(t), document.addEventListener("mousemove", c), document.addEventListener("mouseup", p);
+  }, w = be(() => {
+    const e = Object.fromEntries(o.columns.map((t) => [t.key, t]));
+    return q.map((t) => e[t]).filter((t) => t && _[t.key]);
+  }, [o.columns, q, _]), ce = be(
+    () => o.columns.filter((e) => e.editable !== !1),
+    [o.columns]
+  ), Nt = (e) => {
+    var a;
+    if (e.options) return e.options;
+    const t = (a = o.filters) == null ? void 0 : a.find((l) => l.key === e.key);
+    return t != null && t.options ? t.options.filter((l) => l.value !== "all").map((l) => l.value) : null;
+  }, T = o.columnordering !== !1 && o.columnOrdering !== !1, Ge = T && o.dropcolumn !== !1 && o.dropColumn !== !1, de = o.columnwidth !== !1 && o.columnWidth !== !1 && o.resizable !== !1 && o.columnResizing !== !1, v = o.selectable !== !1 && o.checkbox !== !1 && o.checkboxes !== !1 && o.selection !== !1 && (o.selectable || o.checkbox || o.checkboxes || o.selection || !1), je = o.pagination !== !1, Ct = je && !!(o.topPagination || o.toppagination || o.paginationTop), zt = je && o.bottomPagination !== !1, N = o.theme, $e = typeof N == "string" && me[N], Ye = o.headerTheme || (typeof N == "object" ? N.header : null) || ($e ? me[N].header : "bg-slate-50 text-slate-600"), St = o.footerTheme || (typeof N == "object" ? N.footer : null) || ($e ? me[N].footer : "bg-white text-slate-500"), Et = o.toolbarTheme || (typeof N == "object" ? N.toolbar : null) || ($e ? me[N].toolbar : "bg-white"), F = o.tableWidth ?? o.tablewidth ?? o.width, U = o.tableHeight ?? o.tableheight ?? o.height, Dt = F && F !== "auto" && F !== !0 ? typeof F == "number" ? `${F}px` : F : "100%", Qe = !!(o.tabledatavertivallscroll || o.tableDataVerticalScroll || o.verticalScroll), Ze = U && U !== "auto" && U !== !0 ? typeof U == "number" ? `${U}px` : U : Qe ? "320px" : null, jt = o.tabledatavertivallscroll !== !1 && o.tableDataVerticalScroll !== !1 && o.verticalScroll !== !1 && !!(Qe || Ze), $t = o.tabledatahorizontalscroll !== !1 && o.tableDataHorizontalScroll !== !1 && o.horizontalScroll !== !1, et = (e, t) => {
+    T && (re(t), e.dataTransfer.setData("text/plain", t), e.dataTransfer.effectAllowed = "move");
+  }, tt = (e, t) => {
+    e.preventDefault(), Ge && (e.dataTransfer.dropEffect = "move", Ce !== t && J(t));
+  }, ot = (e, t) => {
+    e.preventDefault(), e.stopPropagation();
+    const a = e.dataTransfer.getData("text/plain") || j;
+    a && a !== t && _e((l) => {
+      const c = [...l], p = c.indexOf(a), h = c.indexOf(t);
+      return p !== -1 && h !== -1 && (c.splice(p, 1), c.splice(h, 0, a)), c;
+    }), re(null), J(null);
+  }, rt = (e) => {
+    e && (ke((t) => Object.values(t).filter(Boolean).length <= 1 ? t : { ...t, [e]: !1 }), re(null), J(null));
+  }, M = be(() => {
+    let e = [...xe];
+    if (L.trim()) {
+      const t = L.toLowerCase(), a = o.columns.filter((l) => l.searchable !== !1).map((l) => l.key);
+      e = e.filter((l) => a.some((c) => String(l[c] ?? "").toLowerCase().includes(t)));
+    }
+    return Object.entries(oe).forEach(([t, a]) => {
+      a && a !== "all" && (e = e.filter((l) => String(l[t]) === String(a)));
+    }), k.key && e.sort((t, a) => {
+      const l = String(t[k.key] ?? "").toLowerCase(), c = String(a[k.key] ?? "").toLowerCase(), p = l.localeCompare(c, void 0, { numeric: !0 });
+      return k.dir === "asc" ? p : -p;
+    }), e;
+  }, [xe, L, oe, k, o.columns]), W = Math.max(1, Math.ceil(M.length / I)), S = Math.min(mt, W), f = M.slice((S - 1) * I, S * I), at = be(() => m.length > 0 ? m : f.filter((e) => e && e.id).map((e) => e.id), [m, f]), Oe = (e) => {
+    if (k.key !== e) return ye({ key: e, dir: "asc" });
+    if (k.dir === "asc") return ye({ key: e, dir: "desc" });
+    ye({ key: null, dir: null });
+  }, Ie = (e) => ae(e ? f.filter((t) => t && t.id).map((t) => t.id) : []), Te = (e) => ae((t) => t.includes(e) ? t.filter((a) => a !== e) : [...t, e]), it = (e) => {
+    ze(e.id), K({ ...e });
+  }, Me = () => {
+    ze(null), K({});
+  }, Re = () => {
+    te((e) => e.map((t) => t.id === Ke ? P : t)), fe == null || fe(P), ze(null), K({});
+  }, lt = () => {
+    const e = {}, t = m.length > 0 ? m : f.map((a) => a.id);
+    xe.forEach((a) => {
+      t.includes(a.id) && (e[a.id] = { ...a });
+    }), G(e), V(ce.map((a) => a.key)), Se(!0);
+  }, Le = () => {
+    Se(!1), G({}), V([]);
+  }, Be = () => {
+    const e = m.length > 0 ? m : f.map((t) => t.id);
+    te(
+      (t) => t.map((a) => e.includes(a.id) && ne[a.id] || a)
+    ), we == null || we(e, ne), Se(!1), G({}), V([]);
+  }, Ot = () => {
+    te((e) => e.filter((t) => t.id !== X.id)), ae((e) => e.filter((t) => t !== X.id)), ie(null), ve == null || ve(X);
+  }, It = () => {
+    const e = w.map((c) => c.label).join(","), t = M.map((c) => w.map((p) => `"${String(c[p.key] ?? "").replaceAll('"', '""')}"`).join(",")).join(`
+`), a = new Blob([e + `
+` + t], { type: "text/csv" }), l = document.createElement("a");
+    l.href = URL.createObjectURL(a), l.download = "table-export.csv", l.click(), URL.revokeObjectURL(l.href);
+  };
+  D(() => {
+    const e = (t) => {
+      var ge, R, ee, E;
+      if (!o.keyboardNavigation || !f.length) return;
+      const a = document.activeElement;
+      if (a && (["TEXTAREA"].includes(a.tagName) || a.tagName === "INPUT" && a.type !== "checkbox" || a.tagName === "SELECT")) return;
+      const c = !!((ge = o.actions) != null && ge.view || (R = o.actions) != null && R.edit || (ee = o.actions) != null && ee.delete), p = w.length + (v ? 1 : 0), h = w.length + (v ? 1 : 0) + (c ? 1 : 0), d = a == null ? void 0 : a.closest("[data-cell]");
+      let x = A.row, u = A.col;
+      if (d) {
+        const s = d.getAttribute("data-cell");
+        if (s) {
+          const b = s.split("-").map(Number);
+          b.length === 2 && !isNaN(b[0]) && !isNaN(b[1]) && (x = b[0], u = b[1]);
+        }
+      }
+      if (t.key === "ArrowDown") {
+        t.preventDefault();
+        const s = Math.min(f.length - 1, x + 1);
+        z({ row: s, col: u });
+      } else if (t.key === "ArrowUp") {
+        t.preventDefault();
+        const s = Math.max(-1, x - 1);
+        z({ row: s, col: u });
+      } else if (t.key === "ArrowRight") {
+        if (t.preventDefault(), c && u === p) {
+          const b = (E = se.current) == null ? void 0 : E.querySelector(`[data-cell="${x}-${u}"]`), he = b ? Array.from(b.querySelectorAll("button")) : [];
+          if (Y < he.length - 1) {
+            Q((pe) => pe + 1);
+            return;
+          }
+        }
+        const s = Math.min(h - 1, u + 1);
+        z({ row: x, col: s });
+      } else if (t.key === "ArrowLeft") {
+        if (t.preventDefault(), c && u === p && Y > 0) {
+          Q((b) => b - 1);
+          return;
+        }
+        const s = Math.max(0, u - 1);
+        z({ row: x, col: s });
+      } else if (t.key === "Enter" || t.key === " ")
+        if (x === -1)
+          if (v && u === 0)
+            t.preventDefault(), Ie(f.length > 0 && !f.filter((s) => s && s.id).every((s) => m.includes(s.id)));
+          else {
+            const s = v ? u - 1 : u, b = w[s];
+            b && b.sortable && (t.preventDefault(), Oe(b.key));
+          }
+        else {
+          const s = f[x];
+          s && s.id && (a && (a.type === "checkbox" || a.tagName === "BUTTON") ? (t.key === "Enter" || t.key === " ") && (t.preventDefault(), a.click()) : v && u === 0 ? (t.preventDefault(), Te(s.id)) : c && u === p ? (t.preventDefault(), it(s)) : t.key === "Enter" && (t.preventDefault(), O == null || O(s)));
+        }
+    };
+    return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
+  }, [o.keyboardNavigation, f, w, A, Y, Te, Ie, Oe, O, v, m]), D(() => {
+    if (!o.keyboardNavigation || !se.current || document.activeElement === Z.current) return;
+    const e = se.current.querySelector(`[data-cell="${A.row}-${A.col}"]`);
+    if (e) {
+      const t = Array.from(e.querySelectorAll("input, button, select"));
+      t.length > 0 ? (t[Math.min(Y, t.length - 1)] || t[0]).focus() : e.focus();
+    }
+  }, [A, Y, o.keyboardNavigation, f]);
+  const nt = (e = "bottom") => !je || e === "top" && !Ct || e === "bottom" && !zt ? null : /* @__PURE__ */ i("div", { className: `flex flex-col gap-3 ${e === "top" ? "border-b" : "border-t"} border-slate-200 px-4 py-3 sm:flex-row sm:items-center sm:justify-between ${St}`, children: [
+    /* @__PURE__ */ i("div", { className: "text-sm opacity-85", children: [
+      "Showing ",
+      M.length ? (S - 1) * I + 1 : 0,
+      "–",
+      Math.min(S * I, M.length),
+      " of ",
+      M.length
+    ] }),
+    /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+      o.pageSizeOptions && o.pageSizeOptions.length > 0 && /* @__PURE__ */ r(
+        "select",
+        {
+          value: I,
+          onChange: (a) => ft(Number(a.target.value)),
+          className: "rounded-lg border border-slate-200/80 bg-white/95 text-slate-800 px-2 py-1.5 text-sm outline-none focus:border-indigo-500",
+          children: o.pageSizeOptions.map((a) => /* @__PURE__ */ i("option", { value: a, children: [
+            a,
+            "/page"
+          ] }, a))
+        }
+      ),
+      /* @__PURE__ */ r(
+        "button",
+        {
+          disabled: S === 1,
+          onClick: () => H(1),
+          className: "rounded-md border border-slate-200/80 bg-white/90 p-1.5 text-slate-700 hover:bg-slate-100 disabled:opacity-40 disabled:hover:bg-transparent",
+          title: "First page",
+          children: /* @__PURE__ */ r(_t, { size: 16 })
+        }
+      ),
+      /* @__PURE__ */ r(
+        "button",
+        {
+          disabled: S === 1,
+          onClick: () => H((a) => Math.max(1, a - 1)),
+          className: "rounded-md border border-slate-200/80 bg-white/90 p-1.5 text-slate-700 hover:bg-slate-100 disabled:opacity-40 disabled:hover:bg-transparent",
+          title: "Previous page",
+          children: /* @__PURE__ */ r(qt, { size: 16 })
+        }
+      ),
+      /* @__PURE__ */ i("span", { className: "px-2 text-sm opacity-90", children: [
+        "Page ",
+        S,
+        " of ",
+        W
+      ] }),
+      /* @__PURE__ */ r(
+        "button",
+        {
+          disabled: S === W,
+          onClick: () => H((a) => Math.min(W, a + 1)),
+          className: "rounded-md border border-slate-200/80 bg-white/90 p-1.5 text-slate-700 hover:bg-slate-100 disabled:opacity-40 disabled:hover:bg-transparent",
+          title: "Next page",
+          children: /* @__PURE__ */ r(Jt, { size: 16 })
+        }
+      ),
+      /* @__PURE__ */ r(
+        "button",
+        {
+          disabled: S === W,
+          onClick: () => H(W),
+          className: "rounded-md border border-slate-200/80 bg-white/90 p-1.5 text-slate-700 hover:bg-slate-100 disabled:opacity-40 disabled:hover:bg-transparent",
+          title: "Last page",
+          children: /* @__PURE__ */ r(Xt, { size: 16 })
+        }
+      )
+    ] })
+  ] }, e);
+  return /* @__PURE__ */ i("div", { className: "space-y-3", style: { width: Dt, maxWidth: "100%" }, children: [
+    /* @__PURE__ */ r("div", { className: `${bt} p-4 ${Et}`, children: /* @__PURE__ */ i("div", { className: "flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between", children: [
+      /* @__PURE__ */ i("div", { children: [
+        /* @__PURE__ */ r("h2", { className: "text-lg font-semibold", children: o.title }),
+        /* @__PURE__ */ i("p", { className: "text-sm text-slate-500", children: [
+          M.length,
+          " records"
+        ] })
+      ] }),
+      /* @__PURE__ */ i("div", { className: "flex flex-wrap gap-2", children: [
+        !!o.searchable && /* @__PURE__ */ i("div", { className: "relative", children: [
+          /* @__PURE__ */ r(Tt, { size: 16, className: "absolute left-3 top-1/2 -translate-y-1/2 text-slate-400" }),
+          /* @__PURE__ */ r("input", { ref: Z, autoFocus: !0, value: L, onChange: (e) => We(e.target.value), placeholder: "Search...", className: "w-56 rounded-lg border border-slate-200 py-2 pl-9 pr-8 text-sm outline-none focus:border-indigo-500 focus:ring-2 focus:ring-indigo-500/20" }),
+          L && /* @__PURE__ */ r("button", { onClick: () => {
+            var e;
+            We(""), (e = Z.current) == null || e.focus();
+          }, className: "absolute right-2 top-1/2 -translate-y-1/2 text-slate-400 hover:text-slate-600", children: /* @__PURE__ */ r(Pe, { size: 15 }) })
+        ] }),
+        !!(o.filterable !== !1 && o.filters && o.filters.length > 0) && /* @__PURE__ */ i("div", { ref: Ee, className: "relative", children: [
+          /* @__PURE__ */ i("button", { onClick: () => Xe((e) => !e), className: "flex items-center gap-2 rounded-lg border border-slate-200 px-3 py-2 text-sm", children: [
+            /* @__PURE__ */ r(Mt, { size: 16 }),
+            "Filter"
+          ] }),
+          xt && /* @__PURE__ */ i("div", { className: "absolute right-0 z-30 mt-2 w-64 rounded-xl border bg-white p-4 shadow-xl", children: [
+            (st = o.filters) == null ? void 0 : st.map((e) => /* @__PURE__ */ i("label", { className: "mb-3 block text-sm", children: [
+              /* @__PURE__ */ r("span", { className: "mb-1 block font-medium", children: e.label }),
+              /* @__PURE__ */ r("select", { value: oe[e.key] || "all", onChange: (t) => He((a) => ({ ...a, [e.key]: t.target.value })), className: "w-full rounded-lg border p-2", children: e.options.map((t) => /* @__PURE__ */ r("option", { value: t.value, children: t.label }, t.value)) })
+            ] }, e.key)),
+            /* @__PURE__ */ r("button", { onClick: () => He({}), className: "text-sm font-medium text-slate-600", children: "Clear filters" })
+          ] })
+        ] }),
+        !!o.columnVisibility && /* @__PURE__ */ i("div", { ref: De, className: "relative", children: [
+          /* @__PURE__ */ i("button", { onClick: () => Je((e) => !e), className: "flex items-center gap-2 rounded-lg border border-slate-200 px-3 py-2 text-sm", children: [
+            /* @__PURE__ */ r(Rt, { size: 16 }),
+            "Columns"
+          ] }),
+          wt && /* @__PURE__ */ i("div", { className: "absolute right-0 z-30 mt-2 w-64 rounded-xl border bg-white p-3.5 shadow-xl", children: [
+            /* @__PURE__ */ i("div", { className: "flex items-center justify-between pb-2 mb-2 border-b", children: [
+              /* @__PURE__ */ r("span", { className: "text-xs font-semibold uppercase tracking-wider text-slate-500", children: "Columns & Layout" }),
+              /* @__PURE__ */ i("button", { onClick: yt, className: "flex items-center gap-1 text-xs text-indigo-600 hover:text-indigo-800 font-medium", title: "Reset default layout", children: [
+                /* @__PURE__ */ r(Lt, { size: 12 }),
+                "Reset"
+              ] })
+            ] }),
+            /* @__PURE__ */ r("div", { className: "space-y-1 max-h-64 overflow-y-auto", children: q.map((e) => {
+              const t = o.columns.find((l) => l.key === e);
+              if (!t) return null;
+              const a = _[e] !== !1;
+              return /* @__PURE__ */ i(
+                "div",
+                {
+                  draggable: !0,
+                  onDragStart: (l) => et(l, t.key),
+                  onDragOver: (l) => tt(l, t.key),
+                  onDrop: (l) => ot(l, t.key),
+                  className: `flex items-center justify-between p-2 text-sm rounded-lg hover:bg-slate-50 cursor-grab active:cursor-grabbing transition-colors ${j === t.key ? "opacity-30 bg-slate-100" : ""} ${Ce === t.key && j !== t.key ? "border-l-4 border-l-indigo-600 bg-indigo-50/60" : ""}`,
+                  children: [
+                    /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+                      /* @__PURE__ */ r("span", { title: "Drag to reorder", className: "text-slate-300 hover:text-slate-500 cursor-grab", children: /* @__PURE__ */ r(pt, { size: 14 }) }),
+                      /* @__PURE__ */ i("label", { className: "flex items-center gap-2 cursor-pointer select-none", children: [
+                        /* @__PURE__ */ r("input", { type: "checkbox", checked: a, onChange: () => ke((l) => {
+                          const c = Object.values(l).filter(Boolean).length;
+                          return l[t.key] && c === 1 ? l : { ...l, [t.key]: !l[t.key] };
+                        }), className: "rounded text-indigo-600 focus:ring-indigo-500" }),
+                        /* @__PURE__ */ r("span", { className: a ? "font-medium text-slate-800" : "text-slate-400 line-through", children: t.label })
+                      ] })
+                    ] }),
+                    de && /* @__PURE__ */ i("span", { className: "text-xs text-slate-400 font-mono", children: [
+                      B[t.key] || 160,
+                      "px"
+                    ] })
+                  ]
+                },
+                t.key
+              );
+            }) }),
+            /* @__PURE__ */ r("p", { className: "mt-2.5 pt-2 border-t text-[11px] text-slate-400 text-center", children: T && de ? "Drag handles to reorder | Drag column edge to resize" : T ? "Drag handles to reorder" : de ? "Drag column edge to resize" : "Column layout options" })
+          ] })
+        ] }),
+        o.bulkEditable !== !1 && ce.length > 0 && /* @__PURE__ */ i("button", { onClick: lt, className: `flex items-center gap-2 rounded-lg border px-3 py-2 text-sm font-medium transition-colors ${le ? "border-indigo-500 bg-indigo-600 text-white" : m.length > 0 ? "border-indigo-300 bg-indigo-50 text-indigo-700 hover:bg-indigo-100" : "border-slate-200 bg-white text-slate-700 hover:bg-slate-50"}`, children: [
+          /* @__PURE__ */ r(Fe, { size: 16 }),
+          "Bulk Edit",
+          m.length > 0 ? ` (${m.length})` : ""
+        ] }),
+        o.exportable && /* @__PURE__ */ i("button", { onClick: It, className: "flex items-center gap-2 rounded-lg border border-slate-200 px-3 py-2 text-sm", children: [
+          /* @__PURE__ */ r(Bt, { size: 16 }),
+          "Export"
+        ] })
+      ] })
+    ] }) }),
+    Ge && /* @__PURE__ */ r(
+      "div",
+      {
+        onDragOver: (e) => {
+          e.preventDefault(), e.dataTransfer.dropEffect = "move";
+        },
+        onDrop: (e) => {
+          e.preventDefault();
+          const t = e.dataTransfer.getData("text/plain") || j;
+          t && rt(t);
+        },
+        className: `transition-all duration-200 overflow-hidden ${j ? "max-h-24 opacity-100 my-2" : "max-h-0 opacity-0 my-0 pointer-events-none"}`,
+        children: /* @__PURE__ */ i("div", { className: "flex items-center justify-center gap-2 rounded-xl border-2 border-dashed border-rose-400 bg-rose-50 p-3 text-sm font-semibold text-rose-700 shadow-sm", children: [
+          /* @__PURE__ */ r(ut, { size: 20, className: "text-rose-600 animate-bounce" }),
+          /* @__PURE__ */ i("span", { children: [
+            "Drop column header here to hide column ",
+            /* @__PURE__ */ r("b", { children: (ct = o.columns.find((e) => e.key === j)) == null ? void 0 : ct.label })
+          ] })
+        ] })
+      }
+    ),
+    le && /* @__PURE__ */ i("div", { className: "flex flex-wrap items-center justify-between gap-3 rounded-xl border border-indigo-200 bg-indigo-50/80 p-3.5 shadow-sm", children: [
+      /* @__PURE__ */ i("div", { className: "flex flex-wrap items-center gap-3", children: [
+        /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ r(Fe, { size: 18, className: "text-indigo-600" }),
+          /* @__PURE__ */ i("span", { className: "font-semibold text-slate-900 text-sm", children: [
+            "Bulk Edit Mode (",
+            at.length,
+            " records):"
+          ] })
+        ] }),
+        /* @__PURE__ */ i("div", { className: "flex flex-wrap items-center gap-2", children: [
+          /* @__PURE__ */ r("span", { className: "text-xs font-medium text-slate-600", children: "Select columns to edit:" }),
+          ce.map((e) => {
+            const t = Ve.includes(e.key);
+            return /* @__PURE__ */ i(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  V(t ? (a) => a.filter((l) => l !== e.key) : (a) => [...a, e.key]);
+                },
+                className: `flex items-center gap-1.5 rounded-lg px-2.5 py-1 text-xs font-medium border transition-all ${t ? "border-indigo-500 bg-indigo-600 text-white shadow-xs" : "border-slate-200 bg-white text-slate-700 hover:border-slate-300 hover:bg-slate-50"}`,
+                children: [
+                  /* @__PURE__ */ r("span", { className: `flex h-3.5 w-3.5 items-center justify-center rounded border ${t ? "border-white bg-white text-indigo-600" : "border-slate-300 bg-white"}`, children: t && /* @__PURE__ */ r(Ue, { size: 10, strokeWidth: 3 }) }),
+                  /* @__PURE__ */ r("span", { children: e.label })
+                ]
+              },
+              e.key
+            );
+          })
+        ] })
+      ] }),
+      /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ i(
+          "button",
+          {
+            onClick: Le,
+            className: "flex items-center gap-1.5 rounded-lg border border-slate-200 bg-white px-3 py-1.5 text-xs font-medium text-slate-700 hover:bg-slate-50 transition-colors",
+            children: [
+              /* @__PURE__ */ r(Pe, { size: 14, className: "text-rose-500" }),
+              "Cancel"
+            ]
+          }
+        ),
+        /* @__PURE__ */ i(
+          "button",
+          {
+            onClick: Be,
+            className: "flex items-center gap-1.5 rounded-lg bg-emerald-600 px-3.5 py-1.5 text-xs font-medium text-white hover:bg-emerald-700 shadow-sm transition-colors",
+            children: [
+              /* @__PURE__ */ r(Ue, { size: 14 }),
+              "Save"
+            ]
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ i("div", { className: `${bt} overflow-hidden`, children: [
+      nt("top"),
+      /* @__PURE__ */ r(
+        "div",
+        {
+          style: {
+            maxHeight: Ze || void 0
+          },
+          className: `${$t ? "overflow-x-auto" : ""} ${jt ? "overflow-y-auto" : ""}`,
+          children: /* @__PURE__ */ i("table", { ref: se, className: "min-w-full text-sm table-fixed", children: [
+            /* @__PURE__ */ r("thead", { className: `sticky top-0 z-20 border-b border-slate-200 ${Ye}`, children: /* @__PURE__ */ i("tr", { children: [
+              v && /* @__PURE__ */ r("th", { "data-cell": "-1-0", className: "w-12 px-4 py-3", children: /* @__PURE__ */ r("input", { type: "checkbox", checked: f.length > 0 && f.every((e) => m.includes(e.id)), onChange: (e) => Ie(e.target.checked), onFocus: () => z({ row: -1, col: 0 }) }) }),
+              w.map((e, t) => {
+                const a = v ? t + 1 : t, l = j === e.key, c = Ce === e.key && j !== e.key, p = B[e.key] || e.width || 160;
+                return /* @__PURE__ */ i(
+                  "th",
+                  {
+                    "data-cell": `-1-${a}`,
+                    style: { width: `${p}px`, minWidth: `${p}px` },
+                    draggable: T,
+                    onDragStart: (h) => et(h, e.key),
+                    onDragOver: (h) => tt(h, e.key),
+                    onDragLeave: () => J(null),
+                    onDrop: (h) => ot(h, e.key),
+                    onDragEnd: () => {
+                      re(null), J(null);
+                    },
+                    "aria-sort": k.key === e.key ? k.dir : "none",
+                    className: `group relative whitespace-nowrap px-4 py-3 text-left font-semibold ${T ? "cursor-grab active:cursor-grabbing" : ""} transition-colors select-none ${l ? "opacity-30 bg-slate-100" : ""} ${c ? "border-l-4 border-l-indigo-600 bg-indigo-50/60" : ""}`,
+                    children: [
+                      /* @__PURE__ */ i("div", { className: "flex items-center justify-between gap-1.5 pr-2", children: [
+                        /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 overflow-hidden", children: [
+                          T && /* @__PURE__ */ r("span", { title: "Drag header to reorder", className: "opacity-60 group-hover:opacity-100 cursor-grab shrink-0", children: /* @__PURE__ */ r(pt, { size: 14 }) }),
+                          /* @__PURE__ */ i("button", { disabled: !e.sortable, onClick: () => e.sortable && Oe(e.key), className: `flex items-center gap-1 truncate ${e.sortable ? "hover:opacity-80" : ""}`, children: [
+                            /* @__PURE__ */ r("span", { className: "truncate", children: e.label }),
+                            e.sortable && (k.key === e.key ? k.dir === "asc" ? /* @__PURE__ */ r(At, { size: 15, className: "shrink-0" }) : /* @__PURE__ */ r(Pt, { size: 15, className: "shrink-0" }) : /* @__PURE__ */ r(Ft, { size: 15, className: "opacity-50 shrink-0" }))
+                          ] })
+                        ] }),
+                        /* @__PURE__ */ r(
+                          "button",
+                          {
+                            type: "button",
+                            title: "Hide column",
+                            onClick: (h) => {
+                              h.stopPropagation(), rt(e.key);
+                            },
+                            className: "opacity-0 group-hover:opacity-100 transition-opacity p-0.5 hover:text-rose-400 rounded shrink-0",
+                            children: /* @__PURE__ */ r(Ut, { size: 13 })
+                          }
+                        )
+                      ] }),
+                      de && /* @__PURE__ */ r(
+                        "div",
+                        {
+                          draggable: !1,
+                          onMouseDown: (h) => kt(h, e.key),
+                          onDoubleClick: (h) => {
+                            h.stopPropagation(), Ne((d) => ({ ...d, [e.key]: e.width || 160 }));
+                          },
+                          title: "Drag to resize column width",
+                          className: `absolute right-0 top-0 bottom-0 w-2.5 cursor-col-resize group-hover:bg-indigo-300/50 hover:!bg-indigo-500 transition-colors z-10 ${vt === e.key ? "bg-indigo-600 w-1" : ""}`
+                        }
+                      )
+                    ]
+                  },
+                  e.key
+                );
+              }),
+              (((dt = o.actions) == null ? void 0 : dt.view) || ((gt = o.actions) == null ? void 0 : gt.edit) || ((ht = o.actions) == null ? void 0 : ht.delete)) && /* @__PURE__ */ r("th", { className: `sticky right-0 top-0 z-30 px-4 py-3 text-right font-semibold w-32 ${Ye}`, children: "Actions" })
+            ] }) }),
+            /* @__PURE__ */ i("tbody", { children: [
+              f.filter((e) => e && e.id).map((e, t) => {
+                var c, p, h;
+                const a = Ke === e.id, l = le && at.includes(e.id);
+                return /* @__PURE__ */ i("tr", { className: `border-b last:border-0 ${a || l ? "bg-indigo-50/20" : "hover:bg-slate-50"}`, children: [
+                  v && /* @__PURE__ */ r("td", { "data-cell": `${t}-0`, className: "px-4 py-3", children: /* @__PURE__ */ r("input", { type: "checkbox", checked: m.includes(e.id), onChange: () => Te(e.id), onFocus: () => z({ row: t, col: 0 }) }) }),
+                  w.map((d, x) => {
+                    var he, pe;
+                    const u = v ? x + 1 : x, ge = l && Ve.includes(d.key) && d.editable !== !1, R = Nt(d), ee = B[d.key] || d.width || 160, E = e[d.key], s = E != null ? String(E) : "", b = s.length > 25;
+                    return /* @__PURE__ */ r("td", { "data-cell": `${t}-${u}`, style: { width: `${ee}px`, minWidth: `${ee}px` }, className: "px-4 py-3 truncate", tabIndex: -1, title: b ? s : void 0, children: a && d.editable !== !1 ? R ? /* @__PURE__ */ r(
+                      "select",
+                      {
+                        value: P[d.key] ?? "",
+                        onChange: (n) => K({ ...P, [d.key]: n.target.value }),
+                        onKeyDown: (n) => {
+                          n.key === "Enter" && Re(), n.key === "Escape" && Me();
+                        },
+                        className: "w-full rounded-md border border-indigo-300 bg-white px-2 py-1 text-sm outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500",
+                        children: R.map((n) => {
+                          const C = typeof n == "object" ? n.value : n, Ae = typeof n == "object" ? n.label : n;
+                          return /* @__PURE__ */ r("option", { value: C, children: Ae }, C);
+                        })
+                      }
+                    ) : /* @__PURE__ */ r(
+                      "input",
+                      {
+                        type: "text",
+                        value: P[d.key] ?? "",
+                        onChange: (n) => K({ ...P, [d.key]: n.target.value }),
+                        onKeyDown: (n) => {
+                          n.key === "Enter" && Re(), n.key === "Escape" && Me();
+                        },
+                        className: "w-full rounded-md border border-indigo-300 bg-white px-2 py-1 text-sm outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500"
+                      }
+                    ) : ge ? R ? /* @__PURE__ */ r(
+                      "select",
+                      {
+                        value: ((he = ne[e.id]) == null ? void 0 : he[d.key]) ?? e[d.key] ?? "",
+                        onChange: (n) => G((C) => ({
+                          ...C,
+                          [e.id]: {
+                            ...C[e.id] || e,
+                            [d.key]: n.target.value
+                          }
+                        })),
+                        onKeyDown: (n) => {
+                          n.key === "Enter" && Be(), n.key === "Escape" && Le();
+                        },
+                        className: "w-full rounded-md border border-indigo-400 bg-white px-2 py-1 text-sm outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500",
+                        children: R.map((n) => {
+                          const C = typeof n == "object" ? n.value : n, Ae = typeof n == "object" ? n.label : n;
+                          return /* @__PURE__ */ r("option", { value: C, children: Ae }, C);
+                        })
+                      }
+                    ) : /* @__PURE__ */ r(
+                      "input",
+                      {
+                        type: "text",
+                        value: ((pe = ne[e.id]) == null ? void 0 : pe[d.key]) ?? e[d.key] ?? "",
+                        onChange: (n) => G((C) => ({
+                          ...C,
+                          [e.id]: {
+                            ...C[e.id] || e,
+                            [d.key]: n.target.value
+                          }
+                        })),
+                        onKeyDown: (n) => {
+                          n.key === "Enter" && Be(), n.key === "Escape" && Le();
+                        },
+                        className: "w-full rounded-md border border-indigo-400 bg-white px-2 py-1 text-sm outline-none focus:border-indigo-500 focus:ring-1 focus:ring-indigo-500"
+                      }
+                    ) : d.render ? d.render(E, e, t) : d.key === "status" ? /* @__PURE__ */ r("span", { className: `rounded-full px-2.5 py-1 text-xs font-medium ${Kt[E] || "bg-slate-100 text-slate-600"}`, children: E }) : b ? /* @__PURE__ */ i("span", { title: s, children: [
+                      s.slice(0, 25),
+                      "..."
+                    ] }) : s }, d.key);
+                  }),
+                  (((c = o.actions) == null ? void 0 : c.view) || ((p = o.actions) == null ? void 0 : p.edit) || ((h = o.actions) == null ? void 0 : h.delete)) && /* @__PURE__ */ r("td", { "data-cell": `${t}-${w.length + (v ? 1 : 0)}`, className: "sticky right-0 bg-white px-4 py-3 w-32 z-10", children: a ? /* @__PURE__ */ i("div", { className: "flex justify-end gap-1", children: [
+                    /* @__PURE__ */ r("button", { title: "Save", onClick: Re, className: "rounded-md bg-emerald-100 p-2 text-emerald-700 hover:bg-emerald-200", children: /* @__PURE__ */ r(Ue, { size: 16 }) }),
+                    /* @__PURE__ */ r("button", { title: "Cancel", onClick: Me, className: "rounded-md bg-rose-100 p-2 text-rose-700 hover:bg-rose-200", children: /* @__PURE__ */ r(Pe, { size: 16 }) })
+                  ] }) : /* @__PURE__ */ i("div", { className: "flex justify-end gap-1", children: [
+                    o.actions.view && /* @__PURE__ */ r("button", { title: "View", onClick: () => O == null ? void 0 : O(e), onFocus: () => {
+                      z({ row: t, col: w.length + (v ? 1 : 0) }), Q(0);
+                    }, className: "rounded-md p-2 hover:bg-slate-100 focus:outline-none focus:ring-2 focus:ring-slate-400", children: /* @__PURE__ */ r(Wt, { size: 16 }) }),
+                    o.actions.edit && /* @__PURE__ */ r("button", { title: "Edit", onClick: () => it(e), onFocus: () => {
+                      z({ row: t, col: w.length + (v ? 1 : 0) }), Q(1);
+                    }, className: "rounded-md p-2 hover:bg-slate-100 focus:outline-none focus:ring-2 focus:ring-slate-400", children: /* @__PURE__ */ r(Ht, { size: 16 }) }),
+                    o.actions.delete && /* @__PURE__ */ r("button", { title: "Delete", onClick: () => ie(e), onFocus: () => {
+                      z({ row: t, col: w.length + (v ? 1 : 0) }), Q(2);
+                    }, className: "rounded-md p-2 text-red-600 hover:bg-red-50 focus:outline-none focus:ring-2 focus:ring-red-400", children: /* @__PURE__ */ r(ut, { size: 16 }) })
+                  ] }) })
+                ] }, e.id);
+              }),
+              !f.length && /* @__PURE__ */ r("tr", { children: /* @__PURE__ */ i("td", { colSpan: w.length + (v ? 1 : 0) + 1, className: "px-6 py-16 text-center", children: [
+                /* @__PURE__ */ r("div", { className: "font-medium", children: "No records found" }),
+                /* @__PURE__ */ r("div", { className: "mt-1 text-sm text-slate-500", children: "Try changing your search or filters." })
+              ] }) })
+            ] })
+          ] })
+        }
+      ),
+      nt("bottom")
+    ] }),
+    m.length > 0 && !le && /* @__PURE__ */ i("div", { className: "fixed bottom-5 left-1/2 z-40 flex -translate-x-1/2 items-center gap-3 rounded-xl bg-slate-900 px-4 py-2.5 text-sm text-white shadow-xl", children: [
+      /* @__PURE__ */ i("span", { className: "font-medium pl-1", children: [
+        m.length,
+        " selected"
+      ] }),
+      o.bulkEditable !== !1 && ce.length > 0 && /* @__PURE__ */ i(
+        "button",
+        {
+          onClick: lt,
+          className: "flex items-center gap-1.5 rounded-lg bg-indigo-600 px-3 py-1.5 text-xs font-semibold text-white hover:bg-indigo-500 transition-colors shadow-sm",
+          children: [
+            /* @__PURE__ */ r(Fe, { size: 14 }),
+            "Bulk Edit"
+          ]
+        }
+      ),
+      /* @__PURE__ */ r(
+        "button",
+        {
+          onClick: () => ae([]),
+          className: "text-xs text-slate-400 hover:text-white underline pr-1",
+          children: "Clear"
+        }
+      )
+    ] }),
+    X && /* @__PURE__ */ r("div", { onClick: (e) => {
+      e.target === e.currentTarget && ie(null);
+    }, className: "fixed inset-0 z-50 flex items-center justify-center bg-black/40 p-4", children: /* @__PURE__ */ i("div", { className: "w-full max-w-sm rounded-2xl bg-white p-6 shadow-2xl", children: [
+      /* @__PURE__ */ r("h3", { className: "text-lg font-semibold", children: "Delete record?" }),
+      /* @__PURE__ */ i("p", { className: "mt-2 text-sm text-slate-500", children: [
+        "Are you sure you want to delete ",
+        /* @__PURE__ */ r("b", { children: X.name }),
+        "? This action cannot be undone."
+      ] }),
+      /* @__PURE__ */ i("div", { className: "mt-6 flex justify-end gap-2", children: [
+        /* @__PURE__ */ r("button", { onClick: () => ie(null), className: "rounded-lg border px-4 py-2 text-sm", children: "Cancel" }),
+        /* @__PURE__ */ r("button", { onClick: Ot, className: "rounded-lg bg-red-600 px-4 py-2 text-sm font-medium text-white", children: "Delete" })
+      ] })
+    ] }) })
+  ] });
 }
-//#endregion
-//#region src/index.css?inline
-var h = "/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;--color-red-50:oklch(97.1% .013 17.38);--color-red-400:oklch(70.4% .191 22.216);--color-red-600:oklch(57.7% .245 27.325);--color-amber-50:oklch(98.7% .022 95.277);--color-amber-700:oklch(55.5% .163 48.998);--color-emerald-50:oklch(97.9% .021 166.113);--color-emerald-100:oklch(95% .052 163.051);--color-emerald-200:oklch(90.5% .093 164.15);--color-emerald-600:oklch(59.6% .145 163.225);--color-emerald-700:oklch(50.8% .118 165.612);--color-emerald-800:oklch(43.2% .095 166.913);--color-emerald-900:oklch(37.8% .077 168.94);--color-blue-50:oklch(97% .014 254.604);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-800:oklch(42.4% .199 265.638);--color-blue-900:oklch(37.9% .146 265.522);--color-indigo-50:oklch(96.2% .018 272.314);--color-indigo-100:oklch(93% .034 272.788);--color-indigo-200:oklch(87% .065 274.039);--color-indigo-300:oklch(78.5% .115 274.713);--color-indigo-400:oklch(67.3% .182 276.935);--color-indigo-500:oklch(58.5% .233 277.117);--color-indigo-600:oklch(51.1% .262 276.966);--color-indigo-700:oklch(45.7% .24 277.023);--color-indigo-800:oklch(39.8% .195 277.366);--color-indigo-900:oklch(35.9% .144 278.697);--color-rose-50:oklch(96.9% .015 12.422);--color-rose-100:oklch(94.1% .03 12.58);--color-rose-200:oklch(89.2% .058 10.001);--color-rose-400:oklch(71.2% .194 13.428);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-600:oklch(58.6% .253 17.585);--color-rose-700:oklch(51.4% .222 16.935);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--tracking-wider:.05em;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--animate-bounce:bounce 1s infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.top-0{top:0}.top-1\\/2{top:50%}.right-0{right:0}.right-2{right:calc(var(--spacing) * 2)}.bottom-0{bottom:0}.bottom-5{bottom:calc(var(--spacing) * 5)}.left-1\\/2{left:50%}.left-3{left:calc(var(--spacing) * 3)}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.my-0{margin-block:0}.my-2{margin-block:calc(var(--spacing) * 2)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-2\\.5{margin-top:calc(var(--spacing) * 2.5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.table{display:table}.h-3\\.5{height:calc(var(--spacing) * 3.5)}.max-h-0{max-height:0}.max-h-24{max-height:calc(var(--spacing) * 24)}.max-h-64{max-height:calc(var(--spacing) * 64)}.min-h-screen{min-height:100vh}.w-1{width:var(--spacing)}.w-2\\.5{width:calc(var(--spacing) * 2.5)}.w-3\\.5{width:calc(var(--spacing) * 3.5)}.w-12{width:calc(var(--spacing) * 12)}.w-32{width:calc(var(--spacing) * 32)}.w-56{width:calc(var(--spacing) * 56)}.w-64{width:calc(var(--spacing) * 64)}.w-full{width:100%}.max-w-7xl{max-width:var(--container-7xl)}.max-w-sm{max-width:var(--container-sm)}.min-w-full{min-width:100%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.table-fixed{table-layout:fixed}.-translate-x-1\\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.animate-bounce{animation:var(--animate-bounce)}.cursor-col-resize{cursor:col-resize}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.resize{resize:both}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-1\\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:2147483647px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-4{border-left-style:var(--tw-border-style);border-left-width:4px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-emerald-200{border-color:var(--color-emerald-200)}.border-indigo-200{border-color:var(--color-indigo-200)}.border-indigo-300{border-color:var(--color-indigo-300)}.border-indigo-400{border-color:var(--color-indigo-400)}.border-indigo-500{border-color:var(--color-indigo-500)}.border-rose-400{border-color:var(--color-rose-400)}.border-slate-200{border-color:var(--color-slate-200)}.border-slate-200\\/80{border-color:#e2e8f0cc}@supports (color:color-mix(in lab, red, red)){.border-slate-200\\/80{border-color:color-mix(in oklab, var(--color-slate-200) 80%, transparent)}}.border-slate-300{border-color:var(--color-slate-300)}.border-white{border-color:var(--color-white)}.border-l-indigo-600{border-left-color:var(--color-indigo-600)}.bg-amber-50{background-color:var(--color-amber-50)}.bg-black\\/40{background-color:#0006}@supports (color:color-mix(in lab, red, red)){.bg-black\\/40{background-color:color-mix(in oklab, var(--color-black) 40%, transparent)}}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-50\\/50{background-color:#eff6ff80}@supports (color:color-mix(in lab, red, red)){.bg-blue-50\\/50{background-color:color-mix(in oklab, var(--color-blue-50) 50%, transparent)}}.bg-blue-900{background-color:var(--color-blue-900)}.bg-emerald-50{background-color:var(--color-emerald-50)}.bg-emerald-50\\/50{background-color:#ecfdf580}@supports (color:color-mix(in lab, red, red)){.bg-emerald-50\\/50{background-color:color-mix(in oklab, var(--color-emerald-50) 50%, transparent)}}.bg-emerald-100{background-color:var(--color-emerald-100)}.bg-emerald-600{background-color:var(--color-emerald-600)}.bg-emerald-900{background-color:var(--color-emerald-900)}.bg-indigo-50{background-color:var(--color-indigo-50)}.bg-indigo-50\\/20{background-color:#eef2ff33}@supports (color:color-mix(in lab, red, red)){.bg-indigo-50\\/20{background-color:color-mix(in oklab, var(--color-indigo-50) 20%, transparent)}}.bg-indigo-50\\/50{background-color:#eef2ff80}@supports (color:color-mix(in lab, red, red)){.bg-indigo-50\\/50{background-color:color-mix(in oklab, var(--color-indigo-50) 50%, transparent)}}.bg-indigo-50\\/60{background-color:#eef2ff99}@supports (color:color-mix(in lab, red, red)){.bg-indigo-50\\/60{background-color:color-mix(in oklab, var(--color-indigo-50) 60%, transparent)}}.bg-indigo-50\\/80{background-color:#eef2ffcc}@supports (color:color-mix(in lab, red, red)){.bg-indigo-50\\/80{background-color:color-mix(in oklab, var(--color-indigo-50) 80%, transparent)}}.bg-indigo-600{background-color:var(--color-indigo-600)}.bg-indigo-900{background-color:var(--color-indigo-900)}.bg-red-600{background-color:var(--color-red-600)}.bg-rose-50{background-color:var(--color-rose-50)}.bg-rose-100{background-color:var(--color-rose-100)}.bg-slate-50{background-color:var(--color-slate-50)}.bg-slate-100{background-color:var(--color-slate-100)}.bg-slate-800{background-color:var(--color-slate-800)}.bg-slate-900{background-color:var(--color-slate-900)}.bg-white{background-color:var(--color-white)}.bg-white\\/90{background-color:#ffffffe6}@supports (color:color-mix(in lab, red, red)){.bg-white\\/90{background-color:color-mix(in oklab, var(--color-white) 90%, transparent)}}.bg-white\\/95{background-color:#fffffff2}@supports (color:color-mix(in lab, red, red)){.bg-white\\/95{background-color:color-mix(in oklab, var(--color-white) 95%, transparent)}}.p-0\\.5{padding:calc(var(--spacing) * .5)}.p-1\\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-3\\.5{padding:calc(var(--spacing) * 3.5)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-1{padding-block:var(--spacing)}.py-1\\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pr-1{padding-right:var(--spacing)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pl-1{padding-left:var(--spacing)}.pl-9{padding-left:calc(var(--spacing) * 9)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\\[11px\\]{font-size:11px}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.whitespace-nowrap{white-space:nowrap}.text-amber-700{color:var(--color-amber-700)}.text-blue-100{color:var(--color-blue-100)}.text-blue-800{color:var(--color-blue-800)}.text-blue-900{color:var(--color-blue-900)}.text-emerald-100{color:var(--color-emerald-100)}.text-emerald-700{color:var(--color-emerald-700)}.text-emerald-800{color:var(--color-emerald-800)}.text-emerald-900{color:var(--color-emerald-900)}.text-indigo-100{color:var(--color-indigo-100)}.text-indigo-600{color:var(--color-indigo-600)}.text-indigo-700{color:var(--color-indigo-700)}.text-indigo-800{color:var(--color-indigo-800)}.text-indigo-900{color:var(--color-indigo-900)}.text-red-600{color:var(--color-red-600)}.text-rose-500{color:var(--color-rose-500)}.text-rose-600{color:var(--color-rose-600)}.text-rose-700{color:var(--color-rose-700)}.text-slate-100{color:var(--color-slate-100)}.text-slate-300{color:var(--color-slate-300)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.line-through{text-decoration-line:line-through}.underline{text-decoration-line:underline}.opacity-0{opacity:0}.opacity-30{opacity:.3}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-85{opacity:.85}.opacity-90{opacity:.9}.opacity-100{opacity:1}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.group-hover\\:bg-indigo-300\\/50:is(:where(.group):hover *){background-color:#a4b3ff80}@supports (color:color-mix(in lab, red, red)){.group-hover\\:bg-indigo-300\\/50:is(:where(.group):hover *){background-color:color-mix(in oklab, var(--color-indigo-300) 50%, transparent)}}.group-hover\\:opacity-100:is(:where(.group):hover *){opacity:1}}.last\\:border-0:last-child{border-style:var(--tw-border-style);border-width:0}@media (hover:hover){.hover\\:border-slate-300:hover{border-color:var(--color-slate-300)}.hover\\:\\!bg-indigo-500:hover{background-color:var(--color-indigo-500)!important}.hover\\:bg-emerald-200:hover{background-color:var(--color-emerald-200)}.hover\\:bg-emerald-700:hover{background-color:var(--color-emerald-700)}.hover\\:bg-indigo-100:hover{background-color:var(--color-indigo-100)}.hover\\:bg-indigo-500:hover{background-color:var(--color-indigo-500)}.hover\\:bg-red-50:hover{background-color:var(--color-red-50)}.hover\\:bg-rose-200:hover{background-color:var(--color-rose-200)}.hover\\:bg-slate-50:hover{background-color:var(--color-slate-50)}.hover\\:bg-slate-100:hover{background-color:var(--color-slate-100)}.hover\\:text-indigo-800:hover{color:var(--color-indigo-800)}.hover\\:text-rose-400:hover{color:var(--color-rose-400)}.hover\\:text-slate-500:hover{color:var(--color-slate-500)}.hover\\:text-slate-600:hover{color:var(--color-slate-600)}.hover\\:text-white:hover{color:var(--color-white)}.hover\\:opacity-80:hover{opacity:.8}}.focus\\:border-indigo-500:focus{border-color:var(--color-indigo-500)}.focus\\:ring-1:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\\:ring-indigo-500:focus{--tw-ring-color:var(--color-indigo-500)}.focus\\:ring-indigo-500\\/20:focus{--tw-ring-color:#625fff33}@supports (color:color-mix(in lab, red, red)){.focus\\:ring-indigo-500\\/20:focus{--tw-ring-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.focus\\:ring-red-400:focus{--tw-ring-color:var(--color-red-400)}.focus\\:ring-slate-400:focus{--tw-ring-color:var(--color-slate-400)}.focus\\:outline-none:focus{--tw-outline-style:none;outline-style:none}.active\\:cursor-grabbing:active{cursor:grabbing}.disabled\\:opacity-40:disabled{opacity:.4}@media (hover:hover){.disabled\\:hover\\:bg-transparent:disabled:hover{background-color:#0000}}@media (width>=40rem){.sm\\:flex-row{flex-direction:row}.sm\\:items-center{align-items:center}.sm\\:justify-between{justify-content:space-between}.sm\\:p-6{padding:calc(var(--spacing) * 6)}}@media (width>=64rem){.lg\\:flex-row{flex-direction:row}.lg\\:items-center{align-items:center}.lg\\:justify-between{justify-content:space-between}.lg\\:p-10{padding:calc(var(--spacing) * 10)}}}*{box-sizing:border-box}body{color:#0f172a;background:#f8fafc;margin:0;font-family:Inter,ui-sans-serif,system-ui,sans-serif}button,input,select{font:inherit}button{cursor:pointer}@property --tw-translate-x{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-y{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-z{syntax:\"*\";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:\"*\";inherits:false;initial-value:0}@property --tw-border-style{syntax:\"*\";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:\"*\";inherits:false}@property --tw-tracking{syntax:\"*\";inherits:false}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:\"*\";inherits:false}@property --tw-brightness{syntax:\"*\";inherits:false}@property --tw-contrast{syntax:\"*\";inherits:false}@property --tw-grayscale{syntax:\"*\";inherits:false}@property --tw-hue-rotate{syntax:\"*\";inherits:false}@property --tw-invert{syntax:\"*\";inherits:false}@property --tw-opacity{syntax:\"*\";inherits:false}@property --tw-saturate{syntax:\"*\";inherits:false}@property --tw-sepia{syntax:\"*\";inherits:false}@property --tw-drop-shadow{syntax:\"*\";inherits:false}@property --tw-drop-shadow-color{syntax:\"*\";inherits:false}@property --tw-drop-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:\"*\";inherits:false}@property --tw-duration{syntax:\"*\";inherits:false}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}";
-//#endregion
-//#region src/index.js
+const Vt = '/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-50:oklch(97.1% .013 17.38);--color-red-400:oklch(70.4% .191 22.216);--color-red-600:oklch(57.7% .245 27.325);--color-amber-50:oklch(98.7% .022 95.277);--color-amber-700:oklch(55.5% .163 48.998);--color-emerald-50:oklch(97.9% .021 166.113);--color-emerald-100:oklch(95% .052 163.051);--color-emerald-200:oklch(90.5% .093 164.15);--color-emerald-600:oklch(59.6% .145 163.225);--color-emerald-700:oklch(50.8% .118 165.612);--color-emerald-800:oklch(43.2% .095 166.913);--color-emerald-900:oklch(37.8% .077 168.94);--color-blue-50:oklch(97% .014 254.604);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-800:oklch(42.4% .199 265.638);--color-blue-900:oklch(37.9% .146 265.522);--color-indigo-50:oklch(96.2% .018 272.314);--color-indigo-100:oklch(93% .034 272.788);--color-indigo-200:oklch(87% .065 274.039);--color-indigo-300:oklch(78.5% .115 274.713);--color-indigo-400:oklch(67.3% .182 276.935);--color-indigo-500:oklch(58.5% .233 277.117);--color-indigo-600:oklch(51.1% .262 276.966);--color-indigo-700:oklch(45.7% .24 277.023);--color-indigo-800:oklch(39.8% .195 277.366);--color-indigo-900:oklch(35.9% .144 278.697);--color-rose-50:oklch(96.9% .015 12.422);--color-rose-100:oklch(94.1% .03 12.58);--color-rose-200:oklch(89.2% .058 10.001);--color-rose-400:oklch(71.2% .194 13.428);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-600:oklch(58.6% .253 17.585);--color-rose-700:oklch(51.4% .222 16.935);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--tracking-wider:.05em;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--animate-bounce:bounce 1s infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.inset-0{top:0;right:0;bottom:0;left:0}.top-0{top:0}.top-1\\/2{top:50%}.right-0{right:0}.right-2{right:calc(var(--spacing) * 2)}.bottom-0{bottom:0}.bottom-5{bottom:calc(var(--spacing) * 5)}.left-1\\/2{left:50%}.left-3{left:calc(var(--spacing) * 3)}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.container{width:100%}@media(min-width:40rem){.container{max-width:40rem}}@media(min-width:48rem){.container{max-width:48rem}}@media(min-width:64rem){.container{max-width:64rem}}@media(min-width:80rem){.container{max-width:80rem}}@media(min-width:96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.my-0{margin-block:0}.my-2{margin-block:calc(var(--spacing) * 2)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-2\\.5{margin-top:calc(var(--spacing) * 2.5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.table{display:table}.h-3\\.5{height:calc(var(--spacing) * 3.5)}.max-h-0{max-height:0}.max-h-24{max-height:calc(var(--spacing) * 24)}.max-h-64{max-height:calc(var(--spacing) * 64)}.min-h-screen{min-height:100vh}.w-1{width:var(--spacing)}.w-2\\.5{width:calc(var(--spacing) * 2.5)}.w-3\\.5{width:calc(var(--spacing) * 3.5)}.w-12{width:calc(var(--spacing) * 12)}.w-32{width:calc(var(--spacing) * 32)}.w-56{width:calc(var(--spacing) * 56)}.w-64{width:calc(var(--spacing) * 64)}.w-full{width:100%}.max-w-7xl{max-width:var(--container-7xl)}.max-w-sm{max-width:var(--container-sm)}.min-w-full{min-width:100%}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.table-fixed{table-layout:fixed}.-translate-x-1\\/2{--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\\/2{--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y)}.animate-bounce{animation:var(--animate-bounce)}.cursor-col-resize{cursor:col-resize}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.resize{resize:both}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-1\\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-4{border-left-style:var(--tw-border-style);border-left-width:4px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-emerald-200{border-color:var(--color-emerald-200)}.border-indigo-200{border-color:var(--color-indigo-200)}.border-indigo-300{border-color:var(--color-indigo-300)}.border-indigo-400{border-color:var(--color-indigo-400)}.border-indigo-500{border-color:var(--color-indigo-500)}.border-rose-400{border-color:var(--color-rose-400)}.border-slate-200{border-color:var(--color-slate-200)}.border-slate-200\\/80{border-color:#e2e8f0cc}@supports (color:color-mix(in lab,red,red)){.border-slate-200\\/80{border-color:color-mix(in oklab,var(--color-slate-200) 80%,transparent)}}.border-slate-300{border-color:var(--color-slate-300)}.border-white{border-color:var(--color-white)}.border-l-indigo-600{border-left-color:var(--color-indigo-600)}.bg-amber-50{background-color:var(--color-amber-50)}.bg-black\\/40{background-color:#0006}@supports (color:color-mix(in lab,red,red)){.bg-black\\/40{background-color:color-mix(in oklab,var(--color-black) 40%,transparent)}}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-50\\/50{background-color:#eff6ff80}@supports (color:color-mix(in lab,red,red)){.bg-blue-50\\/50{background-color:color-mix(in oklab,var(--color-blue-50) 50%,transparent)}}.bg-blue-900{background-color:var(--color-blue-900)}.bg-emerald-50{background-color:var(--color-emerald-50)}.bg-emerald-50\\/50{background-color:#ecfdf580}@supports (color:color-mix(in lab,red,red)){.bg-emerald-50\\/50{background-color:color-mix(in oklab,var(--color-emerald-50) 50%,transparent)}}.bg-emerald-100{background-color:var(--color-emerald-100)}.bg-emerald-600{background-color:var(--color-emerald-600)}.bg-emerald-900{background-color:var(--color-emerald-900)}.bg-indigo-50{background-color:var(--color-indigo-50)}.bg-indigo-50\\/20{background-color:#eef2ff33}@supports (color:color-mix(in lab,red,red)){.bg-indigo-50\\/20{background-color:color-mix(in oklab,var(--color-indigo-50) 20%,transparent)}}.bg-indigo-50\\/50{background-color:#eef2ff80}@supports (color:color-mix(in lab,red,red)){.bg-indigo-50\\/50{background-color:color-mix(in oklab,var(--color-indigo-50) 50%,transparent)}}.bg-indigo-50\\/60{background-color:#eef2ff99}@supports (color:color-mix(in lab,red,red)){.bg-indigo-50\\/60{background-color:color-mix(in oklab,var(--color-indigo-50) 60%,transparent)}}.bg-indigo-50\\/80{background-color:#eef2ffcc}@supports (color:color-mix(in lab,red,red)){.bg-indigo-50\\/80{background-color:color-mix(in oklab,var(--color-indigo-50) 80%,transparent)}}.bg-indigo-600{background-color:var(--color-indigo-600)}.bg-indigo-900{background-color:var(--color-indigo-900)}.bg-red-600{background-color:var(--color-red-600)}.bg-rose-50{background-color:var(--color-rose-50)}.bg-rose-100{background-color:var(--color-rose-100)}.bg-slate-50{background-color:var(--color-slate-50)}.bg-slate-100{background-color:var(--color-slate-100)}.bg-slate-800{background-color:var(--color-slate-800)}.bg-slate-900{background-color:var(--color-slate-900)}.bg-white{background-color:var(--color-white)}.bg-white\\/90{background-color:#ffffffe6}@supports (color:color-mix(in lab,red,red)){.bg-white\\/90{background-color:color-mix(in oklab,var(--color-white) 90%,transparent)}}.bg-white\\/95{background-color:#fffffff2}@supports (color:color-mix(in lab,red,red)){.bg-white\\/95{background-color:color-mix(in oklab,var(--color-white) 95%,transparent)}}.p-0\\.5{padding:calc(var(--spacing) * .5)}.p-1\\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-3\\.5{padding:calc(var(--spacing) * 3.5)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-1{padding-block:var(--spacing)}.py-1\\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pr-1{padding-right:var(--spacing)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pl-1{padding-left:var(--spacing)}.pl-9{padding-left:calc(var(--spacing) * 9)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\\[11px\\]{font-size:11px}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.whitespace-nowrap{white-space:nowrap}.text-amber-700{color:var(--color-amber-700)}.text-blue-100{color:var(--color-blue-100)}.text-blue-800{color:var(--color-blue-800)}.text-blue-900{color:var(--color-blue-900)}.text-emerald-100{color:var(--color-emerald-100)}.text-emerald-700{color:var(--color-emerald-700)}.text-emerald-800{color:var(--color-emerald-800)}.text-emerald-900{color:var(--color-emerald-900)}.text-indigo-100{color:var(--color-indigo-100)}.text-indigo-600{color:var(--color-indigo-600)}.text-indigo-700{color:var(--color-indigo-700)}.text-indigo-800{color:var(--color-indigo-800)}.text-indigo-900{color:var(--color-indigo-900)}.text-red-600{color:var(--color-red-600)}.text-rose-500{color:var(--color-rose-500)}.text-rose-600{color:var(--color-rose-600)}.text-rose-700{color:var(--color-rose-700)}.text-slate-100{color:var(--color-slate-100)}.text-slate-300{color:var(--color-slate-300)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.line-through{text-decoration-line:line-through}.underline{text-decoration-line:underline}.opacity-0{opacity:0}.opacity-30{opacity:.3}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-85{opacity:.85}.opacity-90{opacity:.9}.opacity-100{opacity:1}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}@media(hover:hover){.group-hover\\:bg-indigo-300\\/50:is(:where(.group):hover *){background-color:#a4b3ff80}@supports (color:color-mix(in lab,red,red)){.group-hover\\:bg-indigo-300\\/50:is(:where(.group):hover *){background-color:color-mix(in oklab,var(--color-indigo-300) 50%,transparent)}}.group-hover\\:opacity-100:is(:where(.group):hover *){opacity:1}}.last\\:border-0:last-child{border-style:var(--tw-border-style);border-width:0}@media(hover:hover){.hover\\:border-slate-300:hover{border-color:var(--color-slate-300)}.hover\\:\\!bg-indigo-500:hover{background-color:var(--color-indigo-500)!important}.hover\\:bg-emerald-200:hover{background-color:var(--color-emerald-200)}.hover\\:bg-emerald-700:hover{background-color:var(--color-emerald-700)}.hover\\:bg-indigo-100:hover{background-color:var(--color-indigo-100)}.hover\\:bg-indigo-500:hover{background-color:var(--color-indigo-500)}.hover\\:bg-red-50:hover{background-color:var(--color-red-50)}.hover\\:bg-rose-200:hover{background-color:var(--color-rose-200)}.hover\\:bg-slate-50:hover{background-color:var(--color-slate-50)}.hover\\:bg-slate-100:hover{background-color:var(--color-slate-100)}.hover\\:text-indigo-800:hover{color:var(--color-indigo-800)}.hover\\:text-rose-400:hover{color:var(--color-rose-400)}.hover\\:text-slate-500:hover{color:var(--color-slate-500)}.hover\\:text-slate-600:hover{color:var(--color-slate-600)}.hover\\:text-white:hover{color:var(--color-white)}.hover\\:opacity-80:hover{opacity:.8}}.focus\\:border-indigo-500:focus{border-color:var(--color-indigo-500)}.focus\\:ring-1:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\\:ring-indigo-500:focus{--tw-ring-color:var(--color-indigo-500)}.focus\\:ring-indigo-500\\/20:focus{--tw-ring-color:#625fff33}@supports (color:color-mix(in lab,red,red)){.focus\\:ring-indigo-500\\/20:focus{--tw-ring-color:color-mix(in oklab, var(--color-indigo-500) 20%, transparent)}}.focus\\:ring-red-400:focus{--tw-ring-color:var(--color-red-400)}.focus\\:ring-slate-400:focus{--tw-ring-color:var(--color-slate-400)}.focus\\:outline-none:focus{--tw-outline-style:none;outline-style:none}.active\\:cursor-grabbing:active{cursor:grabbing}.disabled\\:opacity-40:disabled{opacity:.4}@media(hover:hover){.disabled\\:hover\\:bg-transparent:disabled:hover{background-color:#0000}}@media(min-width:40rem){.sm\\:flex-row{flex-direction:row}.sm\\:items-center{align-items:center}.sm\\:justify-between{justify-content:space-between}.sm\\:p-6{padding:calc(var(--spacing) * 6)}}@media(min-width:64rem){.lg\\:flex-row{flex-direction:row}.lg\\:items-center{align-items:center}.lg\\:justify-between{justify-content:space-between}.lg\\:p-10{padding:calc(var(--spacing) * 10)}}}*{box-sizing:border-box}body{color:#0f172a;background:#f8fafc;margin:0;font-family:Inter,ui-sans-serif,system-ui,sans-serif}button,input,select{font:inherit}button{cursor:pointer}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes bounce{0%,to{animation-timing-function:cubic-bezier(.8,0,1,1);transform:translateY(-25%)}50%{animation-timing-function:cubic-bezier(0,0,.2,1);transform:none}}';
 if (typeof document < "u") {
-	let e = "react-flexi-datatable-styles";
-	if (!document.getElementById(e)) {
-		let t = document.createElement("style");
-		t.id = e, t.textContent = h, document.head.appendChild(t);
-	}
+  const o = "react-flexi-datatable-styles";
+  if (!document.getElementById(o)) {
+    const $ = document.createElement("style");
+    $.id = o, $.textContent = Vt, document.head.appendChild($);
+  }
 }
-var g = m;
-//#endregion
-export { m as DataTable, g as default };
+export {
+  Zt as DataTable,
+  Zt as default
+};