@thewrong/ui 0.1.0 → 0.2.0

package/dist/components/table/hooks/useVirtualTable.esm.js

@@ -0,0 +1,18 @@
+import { useMemo as e, useRef as t } from "react";
+import { useVirtualizer as n } from "@tanstack/react-virtual";
+//#region src/components/table/hooks/useVirtualTable.ts
+function r({ count: r, estimateSize: i = 50, overscan: a = 5, scrollElement: o }) {
+	let s = t(null), c = n({
+		count: r,
+		getScrollElement: () => o || s.current,
+		estimateSize: () => i,
+		overscan: a,
+		enabled: r > 0
+	});
+	return e(() => ({
+		virtualizer: c,
+		parentRef: s
+	}), [c]);
+}
+//#endregion
+export { r as useVirtualTable };

package/dist/components/table/mini-table.cjs.js

@@ -0,0 +1 @@
+const e=require("../loading-spinner/LoadingSpinner.cjs.js"),t=require("./hooks/useFillEmptyRows.cjs.js"),n=require("./utils.cjs.js");let r=require("react"),i=require("react/jsx-runtime");var a=(0,r.forwardRef)((a,o)=>{let{data:s,columns:c,loading:l=!1,isFetching:u=!1,emptyMessage:d=`데이터가 없어요`,rowHeight:f,height:p,variant:m=`default`,size:h=`medium`,fillEmptyRows:g=!0,onRowClick:_,footerSlot:v,getRowKey:y,className:b=``,"data-testid":x,...S}=a,C=(0,r.useRef)(null),w=(0,r.useRef)(null),T=(0,r.useRef)(null),E=(0,r.useRef)(null),D=(0,r.useMemo)(()=>c.filter(e=>!e.hidden),[c]),O=n.getTableBaseClasses(),k=n.getTableVariantClasses(m),A=n.getTableSizeClasses(h),j=(0,r.useMemo)(()=>{let e={};return p&&(e.height=typeof p==`number`?`${p}px`:p),e},[p]),{emptyRowCount:M,measuredRowHeight:N}=t.useFillEmptyRows({enabled:g,containerRef:w,theadRef:T,tbodyRef:E,excludeRowsSelector:`tr:not([data-empty-row])`,remainingMode:`sum-real-rows`,deps:[s,D]}),P=(e,t)=>{let r=[n.getStripedRowClasses(t)];return _&&r.push(n.getHoverableRowClasses()),r.join(` `)};return l?(0,i.jsx)(`div`,{ref:o,className:`flex items-center justify-center p-8 flex-1 ${b}`,style:j,"data-testid":x,...S,children:(0,i.jsx)(e.LoadingSpinner,{message:`데이터를 불러오는 중이에요...`,className:`min-h-0`})}):(0,i.jsx)(`div`,{ref:o,className:`relative flex flex-col min-h-0 gap-4 md:gap-5 xl:gap-6 ${b}`,style:j,"data-testid":x,...S,children:(0,i.jsxs)(`div`,{className:`flex flex-1 flex-col min-h-0 gap-4 md:gap-5 xl:gap-6`,children:[(0,i.jsxs)(`div`,{className:`relative flex flex-1 flex-col min-h-0`,children:[(0,i.jsx)(`div`,{className:`pointer-events-none absolute inset-0 z-30 flex items-center justify-center bg-white/50 backdrop-blur-[2px] transition-opacity duration-150 dark:bg-neutral-900/50 ${u?`opacity-100`:`opacity-0`}`,...u?{role:`status`,"aria-live":`polite`}:{"aria-hidden":!0},children:(0,i.jsx)(e.LoadingSpinner,{message:``,className:`min-h-0`})}),(0,i.jsx)(`div`,{ref:w,className:`scrollbar-table overflow-x-auto overflow-y-hidden flex-1 bg-bg-base-secondary`,children:s.length===0?(0,i.jsx)(`div`,{className:`flex items-center justify-center p-8 h-full`,children:(0,i.jsx)(`p`,{className:`text-neutral-600 dark:text-neutral-400`,children:d})}):(0,i.jsxs)(`table`,{ref:C,className:`${O} ${k} ${A} !table-auto`,style:{minWidth:`100%`},children:[(0,i.jsx)(`colgroup`,{children:D.map((e,t)=>{let n=t===D.length-1;return(0,i.jsx)(`col`,{"data-col-key":e.key,style:n?void 0:e.width?{width:typeof e.width==`number`?`${e.width}px`:e.width}:void 0},e.key)})}),(0,i.jsx)(`thead`,{ref:T,className:n.getTableHeaderClasses(),children:(0,i.jsx)(`tr`,{children:D.map(e=>(0,i.jsx)(`th`,{className:`${n.getTableHeaderCellClasses()} ${n.getColumnAlignClasses(e.align??`center`)} ${e.hideOnMobile?`hidden md:table-cell`:``}`,style:{...e.minWidth?{minWidth:`${e.minWidth}px`}:{minWidth:50}},children:(0,i.jsx)(`div`,{className:`flex items-center justify-center w-full px-1 select-none`,children:(0,i.jsx)(`span`,{children:e.header})})},e.key))})}),(0,i.jsxs)(`tbody`,{ref:E,children:[s.map((e,t)=>(0,i.jsx)(`tr`,{className:P(e,t),onClick:()=>_?.(e,t),style:f?{height:`${f}px`}:void 0,children:D.map(t=>{let r=t.accessor?t.accessor(e):e[t.key];return(0,i.jsx)(`td`,{className:`${n.getTableCellClassesNoTruncate()} ${n.getColumnAlignClasses(t.align??`left`)} ${t.hideOnMobile?`hidden md:table-cell`:``}`,style:f?{height:`${f}px`,maxHeight:`${f}px`}:void 0,children:r},t.key)})},y?y(e,t):t)),g&&Array.from({length:M}).map((e,t)=>{let r=s.length+t,a=f??N??void 0;return(0,i.jsx)(`tr`,{"data-empty-row":!0,"aria-hidden":`true`,className:n.getStripedRowClasses(r),style:a?{height:`${a}px`}:void 0,children:D.map(e=>(0,i.jsx)(`td`,{className:`${n.getTableCellClassesNoTruncate()} ${e.hideOnMobile?`hidden md:table-cell`:``}`,style:a?{height:`${a}px`}:void 0},e.key))},`empty-${t}`)})]})]})})]}),v]})})});a.displayName=`MiniTable`,exports.MiniTable=a;

package/dist/components/table/mini-table.esm.js

@@ -0,0 +1,126 @@
+import { LoadingSpinner as e } from "../loading-spinner/LoadingSpinner.esm.js";
+import { useFillEmptyRows as t } from "./hooks/useFillEmptyRows.esm.js";
+import { getColumnAlignClasses as n, getHoverableRowClasses as r, getStripedRowClasses as i, getTableBaseClasses as a, getTableCellClassesNoTruncate as o, getTableHeaderCellClasses as s, getTableHeaderClasses as c, getTableSizeClasses as l, getTableVariantClasses as u } from "./utils.esm.js";
+import { forwardRef as d, useMemo as f, useRef as p } from "react";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/components/table/mini-table.tsx
+var g = d((d, g) => {
+	let { data: _, columns: v, loading: y = !1, isFetching: b = !1, emptyMessage: x = "데이터가 없어요", rowHeight: S, height: C, variant: w = "default", size: T = "medium", fillEmptyRows: E = !0, onRowClick: D, footerSlot: O, getRowKey: k, className: A = "", "data-testid": j, ...M } = d, N = p(null), P = p(null), F = p(null), I = p(null), L = f(() => v.filter((e) => !e.hidden), [v]), R = a(), z = u(w), B = l(T), V = f(() => {
+		let e = {};
+		return C && (e.height = typeof C == "number" ? `${C}px` : C), e;
+	}, [C]), { emptyRowCount: H, measuredRowHeight: U } = t({
+		enabled: E,
+		containerRef: P,
+		theadRef: F,
+		tbodyRef: I,
+		excludeRowsSelector: "tr:not([data-empty-row])",
+		remainingMode: "sum-real-rows",
+		deps: [_, L]
+	}), W = (e, t) => {
+		let n = [i(t)];
+		return D && n.push(r()), n.join(" ");
+	};
+	return y ? /* @__PURE__ */ m("div", {
+		ref: g,
+		className: `flex items-center justify-center p-8 flex-1 ${A}`,
+		style: V,
+		"data-testid": j,
+		...M,
+		children: /* @__PURE__ */ m(e, {
+			message: "데이터를 불러오는 중이에요...",
+			className: "min-h-0"
+		})
+	}) : /* @__PURE__ */ m("div", {
+		ref: g,
+		className: `relative flex flex-col min-h-0 gap-4 md:gap-5 xl:gap-6 ${A}`,
+		style: V,
+		"data-testid": j,
+		...M,
+		children: /* @__PURE__ */ h("div", {
+			className: "flex flex-1 flex-col min-h-0 gap-4 md:gap-5 xl:gap-6",
+			children: [/* @__PURE__ */ h("div", {
+				className: "relative flex flex-1 flex-col min-h-0",
+				children: [/* @__PURE__ */ m("div", {
+					className: `pointer-events-none absolute inset-0 z-30 flex items-center justify-center bg-white/50 backdrop-blur-[2px] transition-opacity duration-150 dark:bg-neutral-900/50 ${b ? "opacity-100" : "opacity-0"}`,
+					...b ? {
+						role: "status",
+						"aria-live": "polite"
+					} : { "aria-hidden": !0 },
+					children: /* @__PURE__ */ m(e, {
+						message: "",
+						className: "min-h-0"
+					})
+				}), /* @__PURE__ */ m("div", {
+					ref: P,
+					className: "scrollbar-table overflow-x-auto overflow-y-hidden flex-1 bg-bg-base-secondary",
+					children: _.length === 0 ? /* @__PURE__ */ m("div", {
+						className: "flex items-center justify-center p-8 h-full",
+						children: /* @__PURE__ */ m("p", {
+							className: "text-neutral-600 dark:text-neutral-400",
+							children: x
+						})
+					}) : /* @__PURE__ */ h("table", {
+						ref: N,
+						className: `${R} ${z} ${B} !table-auto`,
+						style: { minWidth: "100%" },
+						children: [
+							/* @__PURE__ */ m("colgroup", { children: L.map((e, t) => {
+								let n = t === L.length - 1;
+								return /* @__PURE__ */ m("col", {
+									"data-col-key": e.key,
+									style: n ? void 0 : e.width ? { width: typeof e.width == "number" ? `${e.width}px` : e.width } : void 0
+								}, e.key);
+							}) }),
+							/* @__PURE__ */ m("thead", {
+								ref: F,
+								className: c(),
+								children: /* @__PURE__ */ m("tr", { children: L.map((e) => /* @__PURE__ */ m("th", {
+									className: `${s()} ${n(e.align ?? "center")} ${e.hideOnMobile ? "hidden md:table-cell" : ""}`,
+									style: { ...e.minWidth ? { minWidth: `${e.minWidth}px` } : { minWidth: 50 } },
+									children: /* @__PURE__ */ m("div", {
+										className: "flex items-center justify-center w-full px-1 select-none",
+										children: /* @__PURE__ */ m("span", { children: e.header })
+									})
+								}, e.key)) })
+							}),
+							/* @__PURE__ */ h("tbody", {
+								ref: I,
+								children: [_.map((e, t) => /* @__PURE__ */ m("tr", {
+									className: W(e, t),
+									onClick: () => D?.(e, t),
+									style: S ? { height: `${S}px` } : void 0,
+									children: L.map((t) => {
+										let r = t.accessor ? t.accessor(e) : e[t.key];
+										return /* @__PURE__ */ m("td", {
+											className: `${o()} ${n(t.align ?? "left")} ${t.hideOnMobile ? "hidden md:table-cell" : ""}`,
+											style: S ? {
+												height: `${S}px`,
+												maxHeight: `${S}px`
+											} : void 0,
+											children: r
+										}, t.key);
+									})
+								}, k ? k(e, t) : t)), E && Array.from({ length: H }).map((e, t) => {
+									let n = _.length + t, r = S ?? U ?? void 0;
+									return /* @__PURE__ */ m("tr", {
+										"data-empty-row": !0,
+										"aria-hidden": "true",
+										className: i(n),
+										style: r ? { height: `${r}px` } : void 0,
+										children: L.map((e) => /* @__PURE__ */ m("td", {
+											className: `${o()} ${e.hideOnMobile ? "hidden md:table-cell" : ""}`,
+											style: r ? { height: `${r}px` } : void 0
+										}, e.key))
+									}, `empty-${t}`);
+								})]
+							})
+						]
+					})
+				})]
+			}), O]
+		})
+	});
+});
+g.displayName = "MiniTable";
+//#endregion
+export { g as MiniTable };

package/dist/components/table/paginated-mini-table.cjs.js

@@ -0,0 +1 @@
+const e=require("./components/PaginationFooter.cjs.js"),t=require("./mini-table.cjs.js");let n=require("react"),r=require("react/jsx-runtime");var i=(0,n.forwardRef)((n,i)=>{let{currentPage:a,totalPages:o,onPageChange:s,pageSize:c,pageSizeOptions:l,onPageSizeChange:u,totalElements:d,hasPreviousPage:f,hasNextPage:p,showTotalCount:m=!1,enablePageJump:h=!1,enableKeyboardPagination:g=!1,"data-testid":_,...v}=n;return(0,r.jsx)(t.MiniTable,{ref:i,"data-testid":_,footerSlot:(0,r.jsx)(e.PaginationFooter,{currentPage:a,totalPages:o,onPageChange:s,pageSize:c,pageSizeOptions:l,onPageSizeChange:u,hasPreviousPage:f,hasNextPage:p,totalElements:d,showTotalCount:m,enablePageJump:h,enableKeyboardPagination:g,"data-testid":_}),...v})});i.displayName=`PaginatedMiniTable`,exports.PaginatedMiniTable=i;

package/dist/components/table/paginated-mini-table.esm.js

@@ -0,0 +1,31 @@
+import { PaginationFooter as e } from "./components/PaginationFooter.esm.js";
+import { MiniTable as t } from "./mini-table.esm.js";
+import { forwardRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/table/paginated-mini-table.tsx
+var i = n((n, i) => {
+	let { currentPage: a, totalPages: o, onPageChange: s, pageSize: c, pageSizeOptions: l, onPageSizeChange: u, totalElements: d, hasPreviousPage: f, hasNextPage: p, showTotalCount: m = !1, enablePageJump: h = !1, enableKeyboardPagination: g = !1, "data-testid": _, ...v } = n;
+	return /* @__PURE__ */ r(t, {
+		ref: i,
+		"data-testid": _,
+		footerSlot: /* @__PURE__ */ r(e, {
+			currentPage: a,
+			totalPages: o,
+			onPageChange: s,
+			pageSize: c,
+			pageSizeOptions: l,
+			onPageSizeChange: u,
+			hasPreviousPage: f,
+			hasNextPage: p,
+			totalElements: d,
+			showTotalCount: m,
+			enablePageJump: h,
+			enableKeyboardPagination: g,
+			"data-testid": _
+		}),
+		...v
+	});
+});
+i.displayName = "PaginatedMiniTable";
+//#endregion
+export { i as PaginatedMiniTable };

package/dist/components/table/paginated-table.cjs.js

@@ -0,0 +1 @@
+const e=require("./table.cjs.js"),t=require("./components/PaginationFooter.cjs.js");let n=require("react"),r=require("react/jsx-runtime");var i=(0,n.forwardRef)((n,i)=>{let{currentPage:a,totalPages:o,onPageChange:s,pageSize:c,pageSizeOptions:l,onPageSizeChange:u,totalElements:d,hasPreviousPage:f,hasNextPage:p,enableKeyboardPagination:m=!0,showTotalCount:h=!0,enablePageJump:g=!0,"data-testid":_,...v}=n;return(0,r.jsx)(e.Table,{ref:i,"data-testid":_,footerSlot:(0,r.jsx)(t.PaginationFooter,{currentPage:a,totalPages:o,onPageChange:s,pageSize:c,pageSizeOptions:l,onPageSizeChange:u,hasPreviousPage:f,hasNextPage:p,totalElements:d,showTotalCount:h,enablePageJump:g,enableKeyboardPagination:m,"data-testid":_}),...v})});i.displayName=`PaginatedTable`,exports.PaginatedTable=i;

package/dist/components/table/paginated-table.esm.js

@@ -0,0 +1,31 @@
+import { Table as e } from "./table.esm.js";
+import { PaginationFooter as t } from "./components/PaginationFooter.esm.js";
+import { forwardRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/table/paginated-table.tsx
+var i = n((n, i) => {
+	let { currentPage: a, totalPages: o, onPageChange: s, pageSize: c, pageSizeOptions: l, onPageSizeChange: u, totalElements: d, hasPreviousPage: f, hasNextPage: p, enableKeyboardPagination: m = !0, showTotalCount: h = !0, enablePageJump: g = !0, "data-testid": _, ...v } = n;
+	return /* @__PURE__ */ r(e, {
+		ref: i,
+		"data-testid": _,
+		footerSlot: /* @__PURE__ */ r(t, {
+			currentPage: a,
+			totalPages: o,
+			onPageChange: s,
+			pageSize: c,
+			pageSizeOptions: l,
+			onPageSizeChange: u,
+			hasPreviousPage: f,
+			hasNextPage: p,
+			totalElements: d,
+			showTotalCount: h,
+			enablePageJump: g,
+			enableKeyboardPagination: m,
+			"data-testid": _
+		}),
+		...v
+	});
+});
+i.displayName = "PaginatedTable";
+//#endregion
+export { i as PaginatedTable };

package/dist/components/table/table.cjs.js

@@ -0,0 +1 @@
+const e=require("../../node_modules/lucide-react/dist/esm/icons/grip-vertical.cjs.js"),t=require("../loading-spinner/LoadingSpinner.cjs.js"),n=require("../table-checkbox/TableCheckbox.cjs.js"),r=require("./column-group-utils.cjs.js"),i=require("./components/SortableHeaderCell.cjs.js"),a=require("./hooks/useColumnResize.cjs.js"),o=require("./hooks/useFillEmptyRows.cjs.js"),ee=require("./hooks/useTableDragSelection.cjs.js"),te=require("./hooks/useTableSort.cjs.js"),s=require("./utils.cjs.js");let c=require("react"),l=require("react/jsx-runtime"),u=require("@dnd-kit/core"),d=require("@dnd-kit/sortable");var ne=({transform:e,draggingNodeRect:t,containerNodeRect:n})=>{let r={...e,y:0};if(!t||!n)return r;let i=n.left-t.left,a=n.right-t.right;return r.x=Math.min(Math.max(r.x,i),a),r},f=(0,c.forwardRef)((f,p)=>{let{data:m,columns:h,columnGroups:g,rowHeight:_,loading:re=!1,isFetching:v=!1,emptyMessage:ie=`데이터가 없어요`,onRowClick:y,selectedRows:b=[],onRowSelect:x,enableRowSelection:S=!1,enableSelectAll:C=!1,rowCompare:w,getRowId:T,enableSorting:E=!1,serverSideSorting:D=!1,onSortChange:ae,initialSort:oe,variant:se=`default`,size:ce=`medium`,stickyHeader:O=!0,height:k,maxHeight:A,storageKey:le,columnState:j,fillEmptyRows:M=!0,totalElements:N,footerSlot:ue,className:P=``,"data-testid":F,...I}=f,{sort:de,sortedData:L}=te.useTableSort({initialSort:oe,serverSide:D,onSort:ae||void 0}),R=(0,c.useMemo)(()=>!E||D?m:L(m,(e,t)=>{let n=h.find(e=>e.key===t);if(n?.accessor){let r=n.accessor(e);return typeof r==`string`||typeof r==`number`?r:e[t]}return e[t]}),[m,E,D,de,L,h]),z=(0,c.useRef)(null),B=(0,c.useRef)(null),V=(0,c.useRef)(null),H=(0,c.useRef)(null),U=!!j,fe=(0,u.useSensors)((0,u.useSensor)(u.PointerSensor,{activationConstraint:{distance:5}}),(0,u.useSensor)(u.KeyboardSensor,{coordinateGetter:d.sortableKeyboardCoordinates})),W=(0,c.useMemo)(()=>r.buildColumnSlots(h,g),[h,g]),G=(0,c.useMemo)(()=>{if(!j)return W.filter(e=>!(e.kind===`column`&&e.leafColumns[0].hidden));let e=new Set(j.hiddenColumns);return r.applyColumnState(W,j.columnOrder,e)},[W,j]),K=(0,c.useMemo)(()=>r.flattenLeafColumns(G),[G]),q=(0,c.useMemo)(()=>r.hasGroupSlot(G),[G]),pe=(0,c.useMemo)(()=>new Map(W.map(e=>[e.key,e])),[W]),me=e=>{let{active:t,over:n}=e;if(!j||!n||t.id===n.id)return;let r=pe.get(String(n.id));if(r?.kind===`column`&&r.leafColumns[0].excludeFromPreset)return;let i=j.columnOrder,a=i.indexOf(String(t.id)),o=i.indexOf(String(n.id));a===-1||o===-1||j.onColumnOrderChange((0,d.arrayMove)(i,a,o))},{handleMouseDown:he,handleDoubleClick:ge,getColumnWidth:J,measureRef:_e}=a.useColumnResize({columns:K,data:R,getCellContent:(e,t)=>{let n=K.find(e=>e.key===t);return n?.accessor?n.accessor(e):e[t]},tableRef:z,...j?{controlledWidths:j.columnWidths,onColumnWidthsChange:j.onColumnWidthsChange}:{storageKey:le}}),ve=s.getTableBaseClasses(),ye=s.getTableVariantClasses(se),be=s.getTableSizeClasses(ce),Y=S&&C?48:0,xe=(0,c.useMemo)(()=>K.reduce((e,t)=>{let n=J(t.key,t.width),r=parseFloat(n);return e+(Number.isFinite(r)?r:0)},0)+Y,[K,J,Y]),X=(0,c.useMemo)(()=>{let e={};return k&&(e.height=typeof k==`number`?`${k}px`:k),A&&(e.maxHeight=typeof A==`number`?`${A}px`:A),e},[k,A]),{emptyRowCount:Se,measuredRowHeight:Ce}=o.useFillEmptyRows({enabled:M,containerRef:B,theadRef:V,tbodyRef:H,excludeRowsSelector:`tr:not([data-empty-row])`,remainingMode:`sum-real-rows`,deps:[R,K]}),Z=e=>!S||b.length===0?!1:w?b.some(t=>w(t,e)):b.some(t=>t===e),Q=(0,c.useMemo)(()=>!S||!C||R.length===0?!1:R.every(e=>Z(e)),[S,C,R,Z]),we=()=>{!S||!x||(Q?R.forEach(e=>{Z(e)&&x(e,!1)}):R.forEach(e=>{Z(e)||x(e,!0)}))},$=S&&!!x&&!!T,Te=ee.useTableDragSelection({rows:R,getRowId:T??(()=>-1),isSelected:e=>Z(e),setSelected:(e,t)=>x?.(e,t),enabled:$,scrollContainerRef:B}),Ee=(e,t)=>{let n=[s.getStripedRowClasses(t)];return Z(e)&&n.push(s.getSelectedRowClasses()),y&&n.push(s.getHoverableRowClasses()),n.join(` `)};return re?(0,l.jsx)(`div`,{ref:p,className:`flex items-center justify-center p-8 flex-1 ${P}`,style:X,"data-testid":F,...I,children:(0,l.jsx)(t.LoadingSpinner,{message:`데이터를 불러오는 중이에요...`,className:`min-h-0`})}):(0,l.jsxs)(`div`,{ref:p,className:`relative flex flex-col min-h-0 gap-4 md:gap-5 xl:gap-6 ${P}`,style:X,"data-testid":F,...I,children:[(0,l.jsx)(`div`,{ref:_e,className:`absolute invisible whitespace-nowrap`,style:{top:`-9999px`,left:`-9999px`}}),(0,l.jsxs)(`div`,{className:`flex flex-1 flex-col min-h-0 gap-4 md:gap-5 xl:gap-6`,children:[(0,l.jsxs)(`div`,{className:`relative flex flex-1 flex-col min-h-0`,children:[(0,l.jsx)(`div`,{className:`pointer-events-none absolute inset-0 z-30 flex items-center justify-center bg-white/50 backdrop-blur-[2px] transition-opacity duration-150 dark:bg-neutral-900/50 ${v?`opacity-100`:`opacity-0`}`,...v?{role:`status`,"aria-live":`polite`}:{"aria-hidden":!0},children:(0,l.jsx)(t.LoadingSpinner,{message:``,className:`min-h-0`})}),(0,l.jsx)(`div`,{ref:B,className:`scrollbar-table overflow-auto flex-1 bg-[#f9fafb] dark:bg-slate-900/50`,children:R.length===0?(0,l.jsx)(`div`,{className:`flex items-center justify-center p-8 h-full`,children:(0,l.jsx)(`p`,{className:`text-neutral-600 dark:text-neutral-400`,children:ie})}):(0,l.jsx)(u.DndContext,{sensors:fe,collisionDetection:u.closestCenter,onDragEnd:me,modifiers:[ne],children:(0,l.jsxs)(`table`,{ref:z,className:`${ve} ${ye} ${be}`,style:{tableLayout:`fixed`,minWidth:`100%`,width:`${xe}px`},children:[(0,l.jsxs)(`colgroup`,{children:[S&&C&&(0,l.jsx)(`col`,{style:{width:`48px`}}),K.map(e=>(0,l.jsx)(`col`,{"data-col-key":e.key,style:{width:J(e.key,e.width)}},e.key))]}),(0,l.jsxs)(`thead`,{ref:V,className:s.getTableHeaderClasses(),style:{position:O?`sticky`:`relative`,top:O?0:void 0,zIndex:O?10:void 0},children:[(0,l.jsxs)(`tr`,{children:[S&&C&&(0,l.jsx)(`th`,{rowSpan:q?2:1,className:`${s.getTableHeaderCellClasses()} ${s.getColumnAlignClasses(`center`)} w-12 px-0`,children:(0,l.jsx)(`div`,{className:`flex items-center justify-center`,children:(0,l.jsx)(n.TableCheckbox,{checked:Q,onChange:()=>we(),ariaLabel:`전체 선택`})})}),(0,l.jsx)(d.SortableContext,{items:G.map(e=>e.key),strategy:d.horizontalListSortingStrategy,children:G.map(t=>{if(t.kind===`group`)return(0,l.jsxs)(i.SortableHeaderCell,{id:t.key,disabled:!U,as:`th`,colSpan:t.leafColumns.length,className:`${s.getTableHeaderCellClasses()} ${s.getColumnAlignClasses(`center`)} group/header-cell ${t.hideOnMobile?`hidden md:table-cell`:``} relative`,children:[U&&(0,l.jsx)(`span`,{className:`absolute left-0.5 top-1/2 -translate-y-1/2 text-text-tertiary opacity-0 transition-opacity group-hover/header-cell:opacity-100`,"aria-hidden":`true`,children:(0,l.jsx)(e.GripVertical,{className:`h-3.5 w-3.5`})}),(0,l.jsx)(`div`,{className:`flex items-center justify-center w-full pr-1 pl-3 select-none`,children:(0,l.jsx)(`span`,{children:t.header})})]},t.key);let n=t.leafColumns[0],r=!U||n.excludeFromPreset===!0;return(0,l.jsxs)(i.SortableHeaderCell,{id:n.key,disabled:r,as:`th`,rowSpan:q?2:1,className:`${s.getTableHeaderCellClasses()} ${s.getColumnAlignClasses(`center`)} group/header-cell ${n.sticky?`sticky left-0 z-20 bg-bg-base-secondary`:``} ${n.hideOnMobile?`hidden md:table-cell`:``} relative`,style:{width:J(n.key,n.width),minWidth:n.minWidth||50},children:[!r&&(0,l.jsx)(`span`,{className:`absolute left-0.5 top-1/2 -translate-y-1/2 text-text-tertiary opacity-0 transition-opacity group-hover/header-cell:opacity-100`,"aria-hidden":`true`,children:(0,l.jsx)(e.GripVertical,{className:`h-3.5 w-3.5`})}),(0,l.jsx)(`div`,{className:`flex items-center justify-center w-full pr-1 pl-3 select-none`,children:(0,l.jsx)(`span`,{children:n.header})}),n.excludeFromPreset!==!0&&(0,l.jsx)(`div`,{className:`group/resize absolute right-0 top-0 h-full w-3 cursor-col-resize z-50 flex items-center justify-center`,onPointerDown:e=>e.stopPropagation(),onMouseDown:e=>{e.preventDefault(),e.stopPropagation(),he(n.key,e)},onDoubleClick:e=>{e.preventDefault(),e.stopPropagation(),ge(n.key,e)},onClick:e=>{e.preventDefault(),e.stopPropagation()},style:{touchAction:`none`},title:`드래그하여 너비 조절, 더블 클릭하여 자동 조절`,children:(0,l.jsx)(`span`,{"aria-hidden":`true`,className:`h-1/2 w-0.5 rounded-full bg-transparent transition-colors group-hover/header-cell:bg-text-tertiary group-hover/resize:!bg-primary-500 group-active/resize:!bg-primary-600`})})]},n.key)})})]}),q&&(0,l.jsx)(`tr`,{children:G.filter(e=>e.kind===`group`).flatMap(e=>e.leafColumns).map(e=>(0,l.jsx)(`th`,{className:`${s.getTableHeaderCellClasses()} ${s.getColumnAlignClasses(e.align??`center`)} ${e.hideOnMobile?`hidden md:table-cell`:``}`,style:{width:J(e.key,e.width),minWidth:e.minWidth||50},children:(0,l.jsx)(`div`,{className:`flex items-center justify-center w-full pr-1 pl-3 select-none`,children:(0,l.jsx)(`span`,{children:e.header})})},e.key))})]}),(0,l.jsxs)(`tbody`,{ref:H,children:[R.map((e,t)=>{let r=Z(e);return(0,l.jsxs)(`tr`,{className:Ee(e,t),onClick:()=>y?.(e,t),style:_?{height:`${_}px`}:void 0,children:[S&&C&&(0,l.jsx)(`td`,{className:`${s.getTableCellClasses()} ${s.getColumnAlignClasses(`center`)} w-12 select-none`,onClick:e=>e.stopPropagation(),onMouseDown:$?e=>{e.preventDefault(),Te.onRowMouseDown(t)}:void 0,onMouseEnter:$?()=>Te.onRowMouseEnter(t):void 0,children:(0,l.jsx)(`div`,{className:`flex items-center justify-center`,children:(0,l.jsx)(n.TableCheckbox,{checked:r,onChange:t=>x?.(e,t),pointerEventsNone:$,ariaLabel:`행 선택`})})}),K.map(t=>{let n=t.accessor?t.accessor(e):e[t.key];return(0,l.jsx)(`td`,{className:`${s.getTableCellClasses()} ${s.getColumnAlignClasses(t.align)} ${t.sticky?`sticky left-0 z-10 bg-inherit`:``} ${t.hideOnMobile?`hidden md:table-cell`:``}`,style:{width:J(t.key,t.width),minWidth:t.minWidth||50,..._?{height:`${_}px`,maxHeight:`${_}px`,overflow:`hidden`}:{}},children:n},t.key)})]},t)}),M&&Array.from({length:Se}).map((e,t)=>{let n=R.length+t,r=_??Ce??void 0;return(0,l.jsxs)(`tr`,{"data-empty-row":!0,"aria-hidden":`true`,className:s.getStripedRowClasses(n),style:r?{height:`${r}px`}:void 0,children:[S&&C&&(0,l.jsx)(`td`,{className:`${s.getTableCellClasses()} w-12`,style:r?{height:`${r}px`}:void 0}),K.map(e=>(0,l.jsx)(`td`,{className:`${s.getTableCellClasses()} ${e.hideOnMobile?`hidden md:table-cell`:``}`,style:{width:J(e.key,e.width),minWidth:e.minWidth||50,...r?{height:`${r}px`}:{}}},e.key))]},`empty-${t}`)})]})]})})})]}),ue??(N===void 0?null:(0,l.jsx)(`div`,{className:`flex justify-end shrink-0 text-sm text-neutral-600 dark:text-neutral-300`,children:(0,l.jsxs)(`span`,{children:[`총 `,N.toLocaleString(),`건`]})}))]})]})});f.displayName=`Table`,exports.Table=f;

package/dist/components/table/table.esm.js

@@ -0,0 +1,342 @@
+import { GripVertical as e } from "../../node_modules/lucide-react/dist/esm/icons/grip-vertical.esm.js";
+import { LoadingSpinner as t } from "../loading-spinner/LoadingSpinner.esm.js";
+import { TableCheckbox as n } from "../table-checkbox/TableCheckbox.esm.js";
+import { applyColumnState as r, buildColumnSlots as i, flattenLeafColumns as a, hasGroupSlot as o } from "./column-group-utils.esm.js";
+import { SortableHeaderCell as s } from "./components/SortableHeaderCell.esm.js";
+import { useColumnResize as ee } from "./hooks/useColumnResize.esm.js";
+import { useFillEmptyRows as te } from "./hooks/useFillEmptyRows.esm.js";
+import { useTableDragSelection as ne } from "./hooks/useTableDragSelection.esm.js";
+import { useTableSort as re } from "./hooks/useTableSort.esm.js";
+import { getColumnAlignClasses as c, getHoverableRowClasses as ie, getSelectedRowClasses as ae, getStripedRowClasses as l, getTableBaseClasses as oe, getTableCellClasses as u, getTableHeaderCellClasses as d, getTableHeaderClasses as se, getTableSizeClasses as ce, getTableVariantClasses as le } from "./utils.esm.js";
+import { forwardRef as f, useMemo as p, useRef as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { DndContext as ue, KeyboardSensor as de, PointerSensor as fe, closestCenter as pe, useSensor as me, useSensors as he } from "@dnd-kit/core";
+import { SortableContext as ge, arrayMove as _e, horizontalListSortingStrategy as ve, sortableKeyboardCoordinates as ye } from "@dnd-kit/sortable";
+//#region src/components/table/table.tsx
+var be = ({ transform: e, draggingNodeRect: t, containerNodeRect: n }) => {
+	let r = {
+		...e,
+		y: 0
+	};
+	if (!t || !n) return r;
+	let i = n.left - t.left, a = n.right - t.right;
+	return r.x = Math.min(Math.max(r.x, i), a), r;
+}, _ = f((f, _) => {
+	let { data: v, columns: y, columnGroups: b, rowHeight: x, loading: xe = !1, isFetching: S = !1, emptyMessage: Se = "데이터가 없어요", onRowClick: C, selectedRows: w = [], onRowSelect: T, enableRowSelection: E = !1, enableSelectAll: D = !1, rowCompare: O, getRowId: k, enableSorting: A = !1, serverSideSorting: j = !1, onSortChange: Ce, initialSort: we, variant: Te = "default", size: Ee = "medium", stickyHeader: M = !0, height: N, maxHeight: P, storageKey: De, columnState: F, fillEmptyRows: I = !0, totalElements: L, footerSlot: Oe, className: R = "", "data-testid": z, ...B } = f, { sort: ke, sortedData: V } = re({
+		initialSort: we,
+		serverSide: j,
+		onSort: Ce || void 0
+	}), H = p(() => !A || j ? v : V(v, (e, t) => {
+		let n = y.find((e) => e.key === t);
+		if (n?.accessor) {
+			let r = n.accessor(e);
+			return typeof r == "string" || typeof r == "number" ? r : e[t];
+		}
+		return e[t];
+	}), [
+		v,
+		A,
+		j,
+		ke,
+		V,
+		y
+	]), U = m(null), W = m(null), G = m(null), Ae = m(null), K = !!F, je = he(me(fe, { activationConstraint: { distance: 5 } }), me(de, { coordinateGetter: ye })), q = p(() => i(y, b), [y, b]), J = p(() => {
+		if (!F) return q.filter((e) => !(e.kind === "column" && e.leafColumns[0].hidden));
+		let e = new Set(F.hiddenColumns);
+		return r(q, F.columnOrder, e);
+	}, [q, F]), Y = p(() => a(J), [J]), X = p(() => o(J), [J]), Me = p(() => new Map(q.map((e) => [e.key, e])), [q]), Ne = (e) => {
+		let { active: t, over: n } = e;
+		if (!F || !n || t.id === n.id) return;
+		let r = Me.get(String(n.id));
+		if (r?.kind === "column" && r.leafColumns[0].excludeFromPreset) return;
+		let i = F.columnOrder, a = i.indexOf(String(t.id)), o = i.indexOf(String(n.id));
+		a === -1 || o === -1 || F.onColumnOrderChange(_e(i, a, o));
+	}, { handleMouseDown: Pe, handleDoubleClick: Fe, getColumnWidth: Z, measureRef: Ie } = ee({
+		columns: Y,
+		data: H,
+		getCellContent: (e, t) => {
+			let n = Y.find((e) => e.key === t);
+			return n?.accessor ? n.accessor(e) : e[t];
+		},
+		tableRef: U,
+		...F ? {
+			controlledWidths: F.columnWidths,
+			onColumnWidthsChange: F.onColumnWidthsChange
+		} : { storageKey: De }
+	}), Le = oe(), Re = le(Te), ze = ce(Ee), Be = E && D ? 48 : 0, Ve = p(() => Y.reduce((e, t) => {
+		let n = Z(t.key, t.width), r = parseFloat(n);
+		return e + (Number.isFinite(r) ? r : 0);
+	}, 0) + Be, [
+		Y,
+		Z,
+		Be
+	]), He = p(() => {
+		let e = {};
+		return N && (e.height = typeof N == "number" ? `${N}px` : N), P && (e.maxHeight = typeof P == "number" ? `${P}px` : P), e;
+	}, [N, P]), { emptyRowCount: Ue, measuredRowHeight: We } = te({
+		enabled: I,
+		containerRef: W,
+		theadRef: G,
+		tbodyRef: Ae,
+		excludeRowsSelector: "tr:not([data-empty-row])",
+		remainingMode: "sum-real-rows",
+		deps: [H, Y]
+	}), Q = (e) => !E || w.length === 0 ? !1 : O ? w.some((t) => O(t, e)) : w.some((t) => t === e), Ge = p(() => !E || !D || H.length === 0 ? !1 : H.every((e) => Q(e)), [
+		E,
+		D,
+		H,
+		Q
+	]), Ke = () => {
+		!E || !T || (Ge ? H.forEach((e) => {
+			Q(e) && T(e, !1);
+		}) : H.forEach((e) => {
+			Q(e) || T(e, !0);
+		}));
+	}, $ = E && !!T && !!k, qe = ne({
+		rows: H,
+		getRowId: k ?? (() => -1),
+		isSelected: (e) => Q(e),
+		setSelected: (e, t) => T?.(e, t),
+		enabled: $,
+		scrollContainerRef: W
+	}), Je = (e, t) => {
+		let n = [l(t)];
+		return Q(e) && n.push(ae()), C && n.push(ie()), n.join(" ");
+	};
+	return xe ? /* @__PURE__ */ h("div", {
+		ref: _,
+		className: `flex items-center justify-center p-8 flex-1 ${R}`,
+		style: He,
+		"data-testid": z,
+		...B,
+		children: /* @__PURE__ */ h(t, {
+			message: "데이터를 불러오는 중이에요...",
+			className: "min-h-0"
+		})
+	}) : /* @__PURE__ */ g("div", {
+		ref: _,
+		className: `relative flex flex-col min-h-0 gap-4 md:gap-5 xl:gap-6 ${R}`,
+		style: He,
+		"data-testid": z,
+		...B,
+		children: [/* @__PURE__ */ h("div", {
+			ref: Ie,
+			className: "absolute invisible whitespace-nowrap",
+			style: {
+				top: "-9999px",
+				left: "-9999px"
+			}
+		}), /* @__PURE__ */ g("div", {
+			className: "flex flex-1 flex-col min-h-0 gap-4 md:gap-5 xl:gap-6",
+			children: [/* @__PURE__ */ g("div", {
+				className: "relative flex flex-1 flex-col min-h-0",
+				children: [/* @__PURE__ */ h("div", {
+					className: `pointer-events-none absolute inset-0 z-30 flex items-center justify-center bg-white/50 backdrop-blur-[2px] transition-opacity duration-150 dark:bg-neutral-900/50 ${S ? "opacity-100" : "opacity-0"}`,
+					...S ? {
+						role: "status",
+						"aria-live": "polite"
+					} : { "aria-hidden": !0 },
+					children: /* @__PURE__ */ h(t, {
+						message: "",
+						className: "min-h-0"
+					})
+				}), /* @__PURE__ */ h("div", {
+					ref: W,
+					className: "scrollbar-table overflow-auto flex-1 bg-[#f9fafb] dark:bg-slate-900/50",
+					children: H.length === 0 ? /* @__PURE__ */ h("div", {
+						className: "flex items-center justify-center p-8 h-full",
+						children: /* @__PURE__ */ h("p", {
+							className: "text-neutral-600 dark:text-neutral-400",
+							children: Se
+						})
+					}) : /* @__PURE__ */ h(ue, {
+						sensors: je,
+						collisionDetection: pe,
+						onDragEnd: Ne,
+						modifiers: [be],
+						children: /* @__PURE__ */ g("table", {
+							ref: U,
+							className: `${Le} ${Re} ${ze}`,
+							style: {
+								tableLayout: "fixed",
+								minWidth: "100%",
+								width: `${Ve}px`
+							},
+							children: [
+								/* @__PURE__ */ g("colgroup", { children: [E && D && /* @__PURE__ */ h("col", { style: { width: "48px" } }), Y.map((e) => /* @__PURE__ */ h("col", {
+									"data-col-key": e.key,
+									style: { width: Z(e.key, e.width) }
+								}, e.key))] }),
+								/* @__PURE__ */ g("thead", {
+									ref: G,
+									className: se(),
+									style: {
+										position: M ? "sticky" : "relative",
+										top: M ? 0 : void 0,
+										zIndex: M ? 10 : void 0
+									},
+									children: [/* @__PURE__ */ g("tr", { children: [E && D && /* @__PURE__ */ h("th", {
+										rowSpan: X ? 2 : 1,
+										className: `${d()} ${c("center")} w-12 px-0`,
+										children: /* @__PURE__ */ h("div", {
+											className: "flex items-center justify-center",
+											children: /* @__PURE__ */ h(n, {
+												checked: Ge,
+												onChange: () => Ke(),
+												ariaLabel: "전체 선택"
+											})
+										})
+									}), /* @__PURE__ */ h(ge, {
+										items: J.map((e) => e.key),
+										strategy: ve,
+										children: J.map((t) => {
+											if (t.kind === "group") return /* @__PURE__ */ g(s, {
+												id: t.key,
+												disabled: !K,
+												as: "th",
+												colSpan: t.leafColumns.length,
+												className: `${d()} ${c("center")} group/header-cell ${t.hideOnMobile ? "hidden md:table-cell" : ""} relative`,
+												children: [K && /* @__PURE__ */ h("span", {
+													className: "absolute left-0.5 top-1/2 -translate-y-1/2 text-text-tertiary opacity-0 transition-opacity group-hover/header-cell:opacity-100",
+													"aria-hidden": "true",
+													children: /* @__PURE__ */ h(e, { className: "h-3.5 w-3.5" })
+												}), /* @__PURE__ */ h("div", {
+													className: "flex items-center justify-center w-full pr-1 pl-3 select-none",
+													children: /* @__PURE__ */ h("span", { children: t.header })
+												})]
+											}, t.key);
+											let n = t.leafColumns[0], r = !K || n.excludeFromPreset === !0;
+											return /* @__PURE__ */ g(s, {
+												id: n.key,
+												disabled: r,
+												as: "th",
+												rowSpan: X ? 2 : 1,
+												className: `${d()} ${c("center")} group/header-cell ${n.sticky ? "sticky left-0 z-20 bg-bg-base-secondary" : ""} ${n.hideOnMobile ? "hidden md:table-cell" : ""} relative`,
+												style: {
+													width: Z(n.key, n.width),
+													minWidth: n.minWidth || 50
+												},
+												children: [
+													!r && /* @__PURE__ */ h("span", {
+														className: "absolute left-0.5 top-1/2 -translate-y-1/2 text-text-tertiary opacity-0 transition-opacity group-hover/header-cell:opacity-100",
+														"aria-hidden": "true",
+														children: /* @__PURE__ */ h(e, { className: "h-3.5 w-3.5" })
+													}),
+													/* @__PURE__ */ h("div", {
+														className: "flex items-center justify-center w-full pr-1 pl-3 select-none",
+														children: /* @__PURE__ */ h("span", { children: n.header })
+													}),
+													n.excludeFromPreset !== !0 && /* @__PURE__ */ h("div", {
+														className: "group/resize absolute right-0 top-0 h-full w-3 cursor-col-resize z-50 flex items-center justify-center",
+														onPointerDown: (e) => e.stopPropagation(),
+														onMouseDown: (e) => {
+															e.preventDefault(), e.stopPropagation(), Pe(n.key, e);
+														},
+														onDoubleClick: (e) => {
+															e.preventDefault(), e.stopPropagation(), Fe(n.key, e);
+														},
+														onClick: (e) => {
+															e.preventDefault(), e.stopPropagation();
+														},
+														style: { touchAction: "none" },
+														title: "드래그하여 너비 조절, 더블 클릭하여 자동 조절",
+														children: /* @__PURE__ */ h("span", {
+															"aria-hidden": "true",
+															className: "h-1/2 w-0.5 rounded-full bg-transparent transition-colors group-hover/header-cell:bg-text-tertiary group-hover/resize:!bg-primary-500 group-active/resize:!bg-primary-600"
+														})
+													})
+												]
+											}, n.key);
+										})
+									})] }), X && /* @__PURE__ */ h("tr", { children: J.filter((e) => e.kind === "group").flatMap((e) => e.leafColumns).map((e) => /* @__PURE__ */ h("th", {
+										className: `${d()} ${c(e.align ?? "center")} ${e.hideOnMobile ? "hidden md:table-cell" : ""}`,
+										style: {
+											width: Z(e.key, e.width),
+											minWidth: e.minWidth || 50
+										},
+										children: /* @__PURE__ */ h("div", {
+											className: "flex items-center justify-center w-full pr-1 pl-3 select-none",
+											children: /* @__PURE__ */ h("span", { children: e.header })
+										})
+									}, e.key)) })]
+								}),
+								/* @__PURE__ */ g("tbody", {
+									ref: Ae,
+									children: [H.map((e, t) => {
+										let r = Q(e);
+										return /* @__PURE__ */ g("tr", {
+											className: Je(e, t),
+											onClick: () => C?.(e, t),
+											style: x ? { height: `${x}px` } : void 0,
+											children: [E && D && /* @__PURE__ */ h("td", {
+												className: `${u()} ${c("center")} w-12 select-none`,
+												onClick: (e) => e.stopPropagation(),
+												onMouseDown: $ ? (e) => {
+													e.preventDefault(), qe.onRowMouseDown(t);
+												} : void 0,
+												onMouseEnter: $ ? () => qe.onRowMouseEnter(t) : void 0,
+												children: /* @__PURE__ */ h("div", {
+													className: "flex items-center justify-center",
+													children: /* @__PURE__ */ h(n, {
+														checked: r,
+														onChange: (t) => T?.(e, t),
+														pointerEventsNone: $,
+														ariaLabel: "행 선택"
+													})
+												})
+											}), Y.map((t) => {
+												let n = t.accessor ? t.accessor(e) : e[t.key];
+												return /* @__PURE__ */ h("td", {
+													className: `${u()} ${c(t.align)} ${t.sticky ? "sticky left-0 z-10 bg-inherit" : ""} ${t.hideOnMobile ? "hidden md:table-cell" : ""}`,
+													style: {
+														width: Z(t.key, t.width),
+														minWidth: t.minWidth || 50,
+														...x ? {
+															height: `${x}px`,
+															maxHeight: `${x}px`,
+															overflow: "hidden"
+														} : {}
+													},
+													children: n
+												}, t.key);
+											})]
+										}, t);
+									}), I && Array.from({ length: Ue }).map((e, t) => {
+										let n = H.length + t, r = x ?? We ?? void 0;
+										return /* @__PURE__ */ g("tr", {
+											"data-empty-row": !0,
+											"aria-hidden": "true",
+											className: l(n),
+											style: r ? { height: `${r}px` } : void 0,
+											children: [E && D && /* @__PURE__ */ h("td", {
+												className: `${u()} w-12`,
+												style: r ? { height: `${r}px` } : void 0
+											}), Y.map((e) => /* @__PURE__ */ h("td", {
+												className: `${u()} ${e.hideOnMobile ? "hidden md:table-cell" : ""}`,
+												style: {
+													width: Z(e.key, e.width),
+													minWidth: e.minWidth || 50,
+													...r ? { height: `${r}px` } : {}
+												}
+											}, e.key))]
+										}, `empty-${t}`);
+									})]
+								})
+							]
+						})
+					})
+				})]
+			}), Oe ?? (L === void 0 ? null : /* @__PURE__ */ h("div", {
+				className: "flex justify-end shrink-0 text-sm text-neutral-600 dark:text-neutral-300",
+				children: /* @__PURE__ */ g("span", { children: [
+					"총 ",
+					L.toLocaleString(),
+					"건"
+				] })
+			}))]
+		})]
+	});
+});
+_.displayName = "Table";
+//#endregion
+export { _ as Table };

package/dist/components/table/utils.cjs.js

@@ -0,0 +1,37 @@
+var e=()=>`w-full
+    border-collapse
+    text-left
+    table-fixed`.replace(/\s+/g,` `),t=(e=`default`)=>({default:``,bordered:`border border-neutral-200 dark:border-neutral-700`,striped:``})[e],n=(e=`medium`)=>({small:`text-sm`,medium:`text-base`,large:`text-lg`})[e],r=(e=`left`)=>({left:`text-left justify-start`,center:`text-center justify-center`,right:`text-right justify-end`})[e],i=()=>`font-medium
+    text-text-secondary
+    text-sm
+    uppercase
+    tracking-wider
+    bg-bg-base-secondary
+    leading-tight`.replace(/\s+/g,` `),a=()=>`px-6
+    py-1.5
+    text-text-secondary
+    text-sm
+    font-medium
+    leading-tight
+    border-b border-r border-border-secondary dark:border-border-tertiary
+    whitespace-nowrap
+    bg-bg-base-secondary`.replace(/\s+/g,` `),o=()=>`px-3
+    py-0.5
+    text-neutral-900 dark:text-white
+    text-xs
+    leading-tight
+    border-b border-r border-[#f2f3f5] dark:border-neutral-700
+    whitespace-nowrap
+    overflow-hidden
+    text-ellipsis`.replace(/\s+/g,` `),s=()=>`px-3
+    py-0.5
+    text-neutral-900 dark:text-white
+    text-xs
+    leading-tight
+    border-b border-r border-[#f2f3f5] dark:border-neutral-700
+    whitespace-nowrap`.replace(/\s+/g,` `),c=e=>e%2==0?`bg-[#f9fafb] dark:bg-slate-900/50 hover:bg-[#f3f4f6] dark:hover:bg-slate-800`:`bg-white dark:bg-slate-950 hover:bg-slate-50 dark:hover:bg-slate-900`,l=()=>`bg-blue-50 dark:bg-blue-950/50
+    hover:bg-blue-100 dark:hover:bg-blue-950/70
+    shadow-[inset_4px_0_0_0_var(--color-primary-500)]
+    dark:shadow-[inset_4px_0_0_0_var(--color-primary-400)]`.replace(/\s+/g,` `),u=()=>`hover:bg-[#f9fafb]
+    transition-colors duration-200
+    cursor-pointer`.replace(/\s+/g,` `);exports.getColumnAlignClasses=r,exports.getHoverableRowClasses=u,exports.getSelectedRowClasses=l,exports.getStripedRowClasses=c,exports.getTableBaseClasses=e,exports.getTableCellClasses=o,exports.getTableCellClassesNoTruncate=s,exports.getTableHeaderCellClasses=a,exports.getTableHeaderClasses=i,exports.getTableSizeClasses=n,exports.getTableVariantClasses=t;

package/dist/components/table/utils.esm.js

@@ -0,0 +1,16 @@
+//#region src/components/table/utils.ts
+var e = () => "w-full\n    border-collapse\n    text-left\n    table-fixed".replace(/\s+/g, " "), t = (e = "default") => ({
+	default: "",
+	bordered: "border border-neutral-200 dark:border-neutral-700",
+	striped: ""
+})[e], n = (e = "medium") => ({
+	small: "text-sm",
+	medium: "text-base",
+	large: "text-lg"
+})[e], r = (e = "left") => ({
+	left: "text-left justify-start",
+	center: "text-center justify-center",
+	right: "text-right justify-end"
+})[e], i = () => "font-medium\n    text-text-secondary\n    text-sm\n    uppercase\n    tracking-wider\n    bg-bg-base-secondary\n    leading-tight".replace(/\s+/g, " "), a = () => "px-6\n    py-1.5\n    text-text-secondary\n    text-sm\n    font-medium\n    leading-tight\n    border-b border-r border-border-secondary dark:border-border-tertiary\n    whitespace-nowrap\n    bg-bg-base-secondary".replace(/\s+/g, " "), o = () => "px-3\n    py-0.5\n    text-neutral-900 dark:text-white\n    text-xs\n    leading-tight\n    border-b border-r border-[#f2f3f5] dark:border-neutral-700\n    whitespace-nowrap\n    overflow-hidden\n    text-ellipsis".replace(/\s+/g, " "), s = () => "px-3\n    py-0.5\n    text-neutral-900 dark:text-white\n    text-xs\n    leading-tight\n    border-b border-r border-[#f2f3f5] dark:border-neutral-700\n    whitespace-nowrap".replace(/\s+/g, " "), c = (e) => e % 2 == 0 ? "bg-[#f9fafb] dark:bg-slate-900/50 hover:bg-[#f3f4f6] dark:hover:bg-slate-800" : "bg-white dark:bg-slate-950 hover:bg-slate-50 dark:hover:bg-slate-900", l = () => "bg-blue-50 dark:bg-blue-950/50\n    hover:bg-blue-100 dark:hover:bg-blue-950/70\n    shadow-[inset_4px_0_0_0_var(--color-primary-500)]\n    dark:shadow-[inset_4px_0_0_0_var(--color-primary-400)]".replace(/\s+/g, " "), u = () => "hover:bg-[#f9fafb]\n    transition-colors duration-200\n    cursor-pointer".replace(/\s+/g, " ");
+//#endregion
+export { r as getColumnAlignClasses, u as getHoverableRowClasses, l as getSelectedRowClasses, c as getStripedRowClasses, e as getTableBaseClasses, o as getTableCellClasses, s as getTableCellClassesNoTruncate, a as getTableHeaderCellClasses, i as getTableHeaderClasses, n as getTableSizeClasses, t as getTableVariantClasses };

package/dist/components/table-checkbox/TableCheckbox.cjs.js

@@ -0,0 +1 @@
+const e=require("../../node_modules/lucide-react/dist/esm/icons/check.cjs.js"),t=require("../../node_modules/lucide-react/dist/esm/icons/minus.cjs.js");let n=require("react"),r=require("react/jsx-runtime");var i=(0,n.forwardRef)(function({checked:i,indeterminate:a=!1,disabled:o=!1,onChange:s,pointerEventsNone:c=!1,ariaLabel:l},u){let d=(0,n.useRef)(null);(0,n.useEffect)(()=>{let e=d.current;e&&(e.indeterminate=a&&!i)},[a,i]);let f=a&&!i;return(0,r.jsxs)(`label`,{className:`relative inline-flex h-[18px] w-[18px] shrink-0 items-center justify-center ${o?`cursor-not-allowed`:`cursor-pointer`} ${c?`pointer-events-none`:``}`,style:{flex:`0 0 18px`},"aria-label":l,children:[(0,r.jsx)(`input`,{ref:e=>{d.current=e,typeof u==`function`?u(e):u&&(u.current=e)},type:`checkbox`,className:`peer sr-only`,checked:i,disabled:o,onChange:e=>s?.(e.target.checked)}),(0,r.jsx)(`span`,{className:`flex h-full w-full items-center justify-center rounded-md border-[1.5px] transition-colors ${i||f?`border-primary-500 bg-primary-500`:`border-neutral-300 bg-white dark:border-neutral-600 dark:bg-neutral-800`} ${o?`opacity-40`:``}`,children:f?(0,r.jsx)(t.Minus,{className:`h-3 w-3 text-white`,strokeWidth:3}):i?(0,r.jsx)(e.Check,{className:`h-3 w-3 text-white`,strokeWidth:3}):null})]})});exports.TableCheckbox=i;