kiban-design-system 3.7.0 → 3.9.0

package/dist/components/data-table/components/DataTableFooter.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from "react";
+import type { PaginationState } from "@tanstack/react-table";
+import type { Table } from "@tanstack/react-table";
+interface DataTableFooterProps<TData> {
+    table: Table<TData>;
+    pagination?: PaginationState & {
+        hasNextPage?: boolean;
+    };
+    footer?: ReactNode;
+    canGoPrevious: boolean;
+    canGoNext: boolean;
+}
+export declare function DataTableFooter<TData>({ table, pagination, footer, canGoPrevious, canGoNext, }: DataTableFooterProps<TData>): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=DataTableFooter.d.ts.map

package/dist/components/data-table/components/DataTableFooter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableFooter.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/components/DataTableFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAE7D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAEnD,UAAU,oBAAoB,CAAC,KAAK;IAClC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IACpB,UAAU,CAAC,EAAE,eAAe,GAAG;QAAE,WAAW,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;IACzD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,EACrC,KAAK,EACL,UAAU,EACV,MAAM,EACN,aAAa,EACb,SAAS,GACV,EAAE,oBAAoB,CAAC,KAAK,CAAC,kDAmB7B"}

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

@@ -0,0 +1,25 @@
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { DataTablePagination as o } from "./DataTablePagination.js";
+function m({
+  table: r,
+  pagination: t,
+  footer: n,
+  canGoPrevious: l,
+  canGoNext: s
+}) {
+  const a = n ?? /* @__PURE__ */ e("div", {});
+  return !t && !n ? null : /* @__PURE__ */ i("div", { className: "flex items-center justify-between py-3 px-6 bg-slate-50", children: [
+    a,
+    t ? /* @__PURE__ */ e("div", { className: "flex items-center space-x-2", children: /* @__PURE__ */ e(
+      o,
+      {
+        table: r,
+        canGoPrevious: l,
+        canGoNext: s
+      }
+    ) }) : null
+  ] });
+}
+export {
+  m as DataTableFooter
+};

package/dist/components/data-table/components/DataTableHeader.d.ts

@@ -0,0 +1,8 @@
+import type { Table } from "@tanstack/react-table";
+interface DataTableHeaderProps<TData> {
+    table: Table<TData>;
+    isScrolled: boolean;
+}
+export declare function DataTableHeader<TData>({ table, isScrolled, }: DataTableHeaderProps<TData>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=DataTableHeader.d.ts.map

package/dist/components/data-table/components/DataTableHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/components/DataTableHeader.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAInD,UAAU,oBAAoB,CAAC,KAAK;IAClC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;CACrB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,EACrC,KAAK,EACL,UAAU,GACX,EAAE,oBAAoB,CAAC,KAAK,CAAC,2CA2B7B"}

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

@@ -0,0 +1,27 @@
+import { jsx as t } from "react/jsx-runtime";
+import { TableHeader as m, TableRow as n } from "../../ui/table.js";
+import { DataTableHeaderCell as f } from "./DataTableHeaderCell.js";
+import { getStickyColumns as d, calculateStickyOffset as p } from "../utils/stickyColumns.js";
+function T({
+  table: s,
+  isScrolled: c
+}) {
+  const e = s.getHeaderGroups(), r = e.length > 0 ? d(e[0].headers) : [];
+  return /* @__PURE__ */ t(m, { children: e.map((a) => /* @__PURE__ */ t(n, { children: a.headers.map((o, l) => {
+    const i = p(r, l);
+    return /* @__PURE__ */ t(
+      f,
+      {
+        header: o,
+        index: l,
+        stickyColumnIndices: r,
+        isScrolled: c,
+        leftOffset: i
+      },
+      o.id
+    );
+  }) }, a.id)) });
+}
+export {
+  T as DataTableHeader
+};

package/dist/components/data-table/components/DataTableHeaderCell.d.ts

@@ -0,0 +1,11 @@
+import { type Header } from "@tanstack/react-table";
+interface DataTableHeaderCellProps<TData> {
+    header: Header<TData, unknown>;
+    index: number;
+    stickyColumnIndices: number[];
+    isScrolled: boolean;
+    leftOffset: number;
+}
+export declare function DataTableHeaderCell<TData>({ header, index, stickyColumnIndices, isScrolled, leftOffset, }: DataTableHeaderCellProps<TData>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=DataTableHeaderCell.d.ts.map

package/dist/components/data-table/components/DataTableHeaderCell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableHeaderCell.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/components/DataTableHeaderCell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAShE,UAAU,wBAAwB,CAAC,KAAK;IACtC,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,mBAAmB,EAAE,MAAM,EAAE,CAAC;IAC9B,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,EACzC,MAAM,EACN,KAAK,EACL,mBAAmB,EACnB,UAAU,EACV,UAAU,GACX,EAAE,wBAAwB,CAAC,KAAK,CAAC,2CAwIjC"}

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

@@ -0,0 +1,81 @@
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { flexRender as y } from "@tanstack/react-table";
+import { TableHead as S } from "../../ui/table.js";
+import { cn as m } from "../../../lib/utils.js";
+import { ChevronUp as I, ChevronDown as N } from "lucide-react";
+import { Tooltip as v, TooltipTrigger as D, TooltipContent as w } from "../../ui/tooltip.js";
+import { iconMap as T } from "../utils/iconMap.js";
+function L({
+  header: t,
+  index: u,
+  stickyColumnIndices: x,
+  isScrolled: g,
+  leftOffset: d
+}) {
+  const i = x.includes(u), a = t.column.columnDef.meta, p = t.column.columnDef.enableSorting, l = p === !0 && t.column.getCanSort(), f = t.column.getIsSorted(), b = () => {
+    if (!l) return;
+    const e = t.column.getIsSorted();
+    e === !1 || e === "desc" ? t.column.toggleSorting(!1) : t.column.toggleSorting(!0);
+  }, h = () => {
+    if (!p || !l) return null;
+    const e = f === "asc", s = f === "desc";
+    return /* @__PURE__ */ r("div", { className: "mr-1 flex flex-col items-center justify-center", children: [
+      /* @__PURE__ */ n(
+        I,
+        {
+          className: m("w-[14px] h-[14px]", e ? "text-slate-600" : "text-slate-400")
+        }
+      ),
+      /* @__PURE__ */ n(
+        N,
+        {
+          className: m("w-[14px] h-[14px] -mt-0.5", s ? "text-slate-600" : "text-slate-400")
+        }
+      )
+    ] });
+  }, C = () => {
+    if (!a?.help) return null;
+    const { icon: e, tooltip: s } = a.help;
+    let o = null;
+    if (e)
+      if (typeof e == "string") {
+        const c = T[e.toLowerCase()];
+        c && (o = /* @__PURE__ */ n(c, { className: "w-4 h-4 text-slate-400" }));
+      } else typeof e == "object" && e !== null && "type" in e && "props" in e ? o = e : typeof e == "function" ? o = /* @__PURE__ */ n(e, { className: "w-4 h-4 text-slate-400" }) : typeof e == "object" && e !== null && "$$typeof" in e ? o = /* @__PURE__ */ n(e, { className: "w-4 h-4 text-slate-400" }) : o = e;
+    return o ? /* @__PURE__ */ r(v, { children: [
+      /* @__PURE__ */ n(D, { asChild: !0, children: /* @__PURE__ */ n(
+        "button",
+        {
+          type: "button",
+          className: "ml-1 inline-flex items-center text-slate-400 hover:text-slate-600 focus:outline-none",
+          "aria-label": `Help: ${s}`,
+          children: o
+        }
+      ) }),
+      /* @__PURE__ */ n(w, { children: /* @__PURE__ */ n("p", { children: s }) })
+    ] }) : null;
+  };
+  return /* @__PURE__ */ n(
+    S,
+    {
+      className: m(
+        "bg-slate-50 font-semibold px-6 py-1 min-h-8",
+        "text-sm leading-5 text-slate-500 tracking-[-0.04em]",
+        i && "sticky z-30 bg-slate-50",
+        i && g && "border-r",
+        l && "cursor-pointer select-none hover:bg-slate-100"
+      ),
+      style: i ? { left: `${d}px` } : void 0,
+      onClick: l ? b : void 0,
+      children: t.isPlaceholder ? null : /* @__PURE__ */ r("div", { className: "flex items-center gap-1", children: [
+        h(),
+        y(t.column.columnDef.header, t.getContext()),
+        C()
+      ] })
+    },
+    t.id
+  );
+}
+export {
+  L as DataTableHeaderCell
+};

package/dist/components/data-table/components/DataTablePagination.d.ts

@@ -0,0 +1,9 @@
+import type { Table } from "@tanstack/react-table";
+interface DataTablePaginationProps<TData> {
+    table: Table<TData>;
+    canGoPrevious: boolean;
+    canGoNext: boolean;
+}
+export declare function DataTablePagination<TData>({ table, canGoPrevious, canGoNext, }: DataTablePaginationProps<TData>): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=DataTablePagination.d.ts.map

package/dist/components/data-table/components/DataTablePagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTablePagination.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/components/DataTablePagination.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAEnD,UAAU,wBAAwB,CAAC,KAAK;IACtC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IACpB,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,EACzC,KAAK,EACL,aAAa,EACb,SAAS,GACV,EAAE,wBAAwB,CAAC,KAAK,CAAC,2CAuBjC"}

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

@@ -0,0 +1,36 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { Button as a } from "../../ui/button.js";
+import { ChevronLeft as o, ChevronRight as n } from "lucide-react";
+function c({
+  table: s,
+  canGoPrevious: i,
+  canGoNext: t
+}) {
+  return /* @__PURE__ */ l("div", { className: "flex items-center space-x-2", children: [
+    /* @__PURE__ */ e(
+      a,
+      {
+        variant: "outline",
+        size: "sm",
+        onClick: () => s.previousPage(),
+        disabled: !i,
+        className: "w-8 h-8 bg-slate-200 border-none hover:bg-slate-300 shadow-none disabled:opacity-100 disabled:bg-slate-100 disabled:[&>svg]:text-slate-400",
+        children: /* @__PURE__ */ e(o, { className: "size-4" })
+      }
+    ),
+    /* @__PURE__ */ e(
+      a,
+      {
+        variant: "outline",
+        size: "sm",
+        onClick: () => s.nextPage(),
+        disabled: !t,
+        className: "w-8 h-8 bg-slate-200 border-none hover:bg-slate-300 shadow-none disabled:opacity-100 disabled:bg-slate-100 disabled:[&>svg]:text-slate-400",
+        children: /* @__PURE__ */ e(n, { className: "size-4" })
+      }
+    )
+  ] });
+}
+export {
+  c as DataTablePagination
+};

package/dist/components/data-table/components/DataTableTotalsRow.d.ts

@@ -0,0 +1,10 @@
+import type { Table } from "@tanstack/react-table";
+interface DataTableTotalsRowProps<TData> {
+    table: Table<TData>;
+    totals: Partial<Record<string, string | number>>;
+    isScrolled: boolean;
+    totalsLabel?: string;
+}
+export declare function DataTableTotalsRow<TData>({ table, totals, isScrolled, totalsLabel, }: DataTableTotalsRowProps<TData>): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=DataTableTotalsRow.d.ts.map

package/dist/components/data-table/components/DataTableTotalsRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableTotalsRow.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/components/DataTableTotalsRow.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAGnD,UAAU,uBAAuB,CAAC,KAAK;IACrC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC;IACjD,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,EACxC,KAAK,EACL,MAAM,EACN,UAAU,EACV,WAAuB,GACxB,EAAE,uBAAuB,CAAC,KAAK,CAAC,kDAkGhC"}

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

@@ -0,0 +1,95 @@
+import { jsx as o } from "react/jsx-runtime";
+import { TableCell as r, TableRow as S } from "../../ui/table.js";
+import { cn as i } from "../../../lib/utils.js";
+import { getStickyColumns as N, calculateStickyOffset as u } from "../utils/stickyColumns.js";
+function C({
+  table: x,
+  totals: b,
+  isScrolled: p,
+  totalsLabel: g = "Totales"
+}) {
+  const h = x.getHeaderGroups();
+  if (!b || h.length === 0) return null;
+  const c = h[0].headers, e = N(c), l = [];
+  let t = 0;
+  if (c.forEach((a, s) => {
+    const n = a.column.id, y = b[n], f = e.includes(s), k = u(e, s);
+    if (y !== void 0) {
+      if (t > 0) {
+        const m = s - t, d = e.includes(m), I = u(
+          e,
+          m
+        );
+        l.push(
+          /* @__PURE__ */ o(
+            r,
+            {
+              colSpan: t,
+              className: i(
+                "px-6 py-2 font-semibold text-sm leading-5 min-h-9 bg-slate-200 text-slate-900",
+                d && "sticky z-20",
+                d && p && "border-r border-slate-200"
+              ),
+              ...d ? { style: { left: `${I}px` } } : {}
+            },
+            `total-spacer-${m}`
+          )
+        ), t = 0;
+      }
+      l.push(
+        /* @__PURE__ */ o(
+          r,
+          {
+            className: i(
+              "px-6 py-2 font-semibold text-sm leading-5 min-h-9 bg-slate-200 text-slate-900",
+              f && "sticky z-20",
+              f && p && "border-r border-slate-200"
+            ),
+            ...f ? { style: { left: `${k}px` } } : {},
+            children: y
+          },
+          `total-${n}`
+        )
+      );
+    } else
+      t += 1;
+  }), t > 0) {
+    const a = c.length - t, s = e.includes(a), n = u(e, a);
+    l.push(
+      /* @__PURE__ */ o(
+        r,
+        {
+          colSpan: t,
+          className: i(
+            "px-6 py-2 font-semibold text-sm leading-5 min-h-9 bg-slate-200 text-slate-900",
+            s && "sticky z-20",
+            s && p && "border-r border-slate-200"
+          ),
+          ...s ? { style: { left: `${n}px` } } : {}
+        },
+        "total-spacer-end"
+      )
+    );
+  }
+  if (l.length === 0) {
+    const a = e.includes(0);
+    l.push(
+      /* @__PURE__ */ o(
+        r,
+        {
+          colSpan: c.length,
+          className: i(
+            "px-6 py-2 font-semibold text-sm leading-5 min-h-9 bg-slate-200 text-slate-900",
+            a && "sticky z-20"
+          ),
+          children: g
+        },
+        "total-label"
+      )
+    );
+  }
+  return /* @__PURE__ */ o(S, { className: "bg-slate-200", children: l });
+}
+export {
+  C as DataTableTotalsRow
+};

package/dist/components/data-table/data-table.d.ts

@@ -0,0 +1,26 @@
+import { type ColumnDef, type OnChangeFn, type PaginationState, type SortingState } from "@tanstack/react-table";
+import { type ReactNode } from "react";
+interface DataTableProps<TData, TValue> {
+    columns: ColumnDef<TData, TValue>[];
+    data: TData[];
+    pageCount?: number;
+    pagination?: PaginationState & {
+        hasNextPage?: boolean;
+    };
+    onPaginationChange?: OnChangeFn<PaginationState>;
+    enableRowSelection?: boolean;
+    onSelectionChange?: (selectedRows: TData[]) => void;
+    totals?: Partial<Record<string, string | number>>;
+    totalsPosition?: "top" | "bottom";
+    totalsLabel?: string;
+    footer?: ReactNode;
+    sorting?: SortingState;
+    onSortingChange?: OnChangeFn<SortingState>;
+    className?: string;
+    emptyMessage?: string;
+}
+declare function DataTable<TData extends {
+    id: string;
+}, TValue>({ columns, data, pagination, pageCount, onPaginationChange, enableRowSelection, onSelectionChange, totals, totalsPosition, totalsLabel, footer, sorting, onSortingChange, className, emptyMessage, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
+export { DataTable };
+//# sourceMappingURL=data-table.d.ts.map

package/dist/components/data-table/data-table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../../src/components/data-table/data-table.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,SAAS,EAGd,KAAK,UAAU,EACf,KAAK,eAAe,EACpB,KAAK,YAAY,EAElB,MAAM,uBAAuB,CAAC;AAS/B,OAAO,EAAuB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAS5D,UAAU,cAAc,CAAC,KAAK,EAAE,MAAM;IACpC,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,EAAE,CAAC;IACpC,IAAI,EAAE,KAAK,EAAE,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,eAAe,GAAG;QAAE,WAAW,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;IACzD,kBAAkB,CAAC,EAAE,UAAU,CAAC,eAAe,CAAC,CAAC;IACjD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,iBAAiB,CAAC,EAAE,CAAC,YAAY,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACpD,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC;IAClD,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,eAAe,CAAC,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,iBAAS,SAAS,CAAC,KAAK,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,MAAM,EAAE,EACvD,OAAO,EACP,IAAI,EACJ,UAAU,EACV,SAAS,EACT,kBAAkB,EAClB,kBAA0B,EAC1B,iBAAiB,EACjB,MAAM,EACN,cAAyB,EACzB,WAAW,EACX,MAAM,EACN,OAAO,EACP,eAAe,EACf,SAAS,EACT,YAA4B,GAC7B,EAAE,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,2CAuI/B;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}

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

@@ -0,0 +1,134 @@
+import { jsxs as d, jsx as o } from "react/jsx-runtime";
+import { useReactTable as E, flexRender as V } from "@tanstack/react-table";
+import { Table as W, TableBody as $, TableRow as T, TableCell as C } from "../ui/table.js";
+import { cn as S } from "../../lib/utils.js";
+import { useState as q, useEffect as A } from "react";
+import { useDataTableColumns as J } from "./hooks/useDataTableColumns.js";
+import { useDataTableConfig as K } from "./hooks/useDataTableConfig.js";
+import { useStickyColumns as L } from "./hooks/useStickyColumns.js";
+import { DataTableHeader as Q } from "./components/DataTableHeader.js";
+import { DataTableTotalsRow as k } from "./components/DataTableTotalsRow.js";
+import { DataTableFooter as U } from "./components/DataTableFooter.js";
+import { getStickyColumns as X, calculateStickyOffset as Y } from "./utils/stickyColumns.js";
+function ne({
+  columns: y,
+  data: n,
+  pagination: t,
+  pageCount: w,
+  onPaginationChange: N,
+  enableRowSelection: m = !1,
+  onSelectionChange: i,
+  totals: l,
+  totalsPosition: f = "bottom",
+  totalsLabel: u,
+  footer: R,
+  sorting: v,
+  onSortingChange: D,
+  className: P,
+  emptyMessage: G = "No results."
+}) {
+  const [b, F] = q({}), g = J(
+    y,
+    m
+  ), I = K({
+    data: n,
+    columns: g,
+    enableRowSelection: m,
+    rowSelection: b,
+    setRowSelection: F,
+    pageCount: w,
+    pagination: t,
+    onPaginationChange: N,
+    sorting: v,
+    onSortingChange: D
+  }), e = E(I), { tableRef: M, isScrolled: c } = L();
+  A(() => {
+    if (m && i) {
+      const r = e.getFilteredSelectedRowModel().rows.map((s) => s.original);
+      i(r);
+    }
+  }, [b]);
+  const j = t ? n.length < t?.pageSize || !t?.hasNextPage : void 0, z = t ? t?.pageIndex === 1 : void 0, H = t ? !j : e.getCanNextPage(), O = t ? !z : e.getCanPreviousPage(), h = e.getHeaderGroups(), p = h.length > 0 ? X(h[0].headers) : [];
+  return /* @__PURE__ */ d(
+    "div",
+    {
+      className: S(
+        "flex flex-col border border-solid border-slate-200 rounded-xl overflow-hidden",
+        P
+      ),
+      children: [
+        /* @__PURE__ */ d(W, { ref: M, children: [
+          /* @__PURE__ */ o(Q, { table: e, isScrolled: c }),
+          /* @__PURE__ */ d($, { children: [
+            f === "top" && l && /* @__PURE__ */ o(
+              k,
+              {
+                table: e,
+                totals: l,
+                isScrolled: c,
+                totalsLabel: u
+              }
+            ),
+            e.getRowModel().rows?.length ? e.getRowModel().rows.map((r) => /* @__PURE__ */ o(
+              T,
+              {
+                "data-state": r.getIsSelected() && "selected",
+                className: "[&:hover>td]:bg-slate-50",
+                children: r.getVisibleCells().map((s, x) => {
+                  const a = p.includes(x), B = a ? Y(p, x) : 0;
+                  return /* @__PURE__ */ o(
+                    C,
+                    {
+                      className: S(
+                        "px-6 py-2 bg-background ease-in transition-all duration-200",
+                        "text-sm leading-5 font-normal min-h-9 text-slate-900 tracking-[-0.04em]",
+                        a && "sticky z-20 bg-background",
+                        a && c && "border-r border-slate-200"
+                      ),
+                      ...a ? { style: { left: `${B}px` } } : {},
+                      children: V(
+                        s.column.columnDef.cell,
+                        s.getContext()
+                      )
+                    },
+                    s.id
+                  );
+                })
+              },
+              r.id
+            )) : /* @__PURE__ */ o(T, { children: /* @__PURE__ */ o(
+              C,
+              {
+                colSpan: g.length,
+                className: "h-24 text-center",
+                children: G
+              }
+            ) }),
+            f === "bottom" && l && /* @__PURE__ */ o(
+              k,
+              {
+                table: e,
+                totals: l,
+                isScrolled: c,
+                totalsLabel: u
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ o(
+          U,
+          {
+            table: e,
+            pagination: t,
+            footer: R,
+            canGoPrevious: O,
+            canGoNext: H
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  ne as DataTable
+};

package/dist/components/data-table/hooks/useDataTableColumns.d.ts

@@ -0,0 +1,5 @@
+import type { ColumnDef } from "@tanstack/react-table";
+export declare function useDataTableColumns<TData extends {
+    id: string;
+}, TValue>(columns: ColumnDef<TData, TValue>[], enableRowSelection: boolean): ColumnDef<TData, TValue>[];
+//# sourceMappingURL=useDataTableColumns.d.ts.map

package/dist/components/data-table/hooks/useDataTableColumns.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataTableColumns.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/hooks/useDataTableColumns.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAA+B,MAAM,uBAAuB,CAAC;AAGpF,wBAAgB,mBAAmB,CAAC,KAAK,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,MAAM,EACtE,OAAO,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,CAAC,EAAE,EACnC,kBAAkB,EAAE,OAAO,8BAyD5B"}

package/dist/components/data-table/hooks/useDataTableColumns.js

@@ -0,0 +1,39 @@
+import { jsx as c } from "react/jsx-runtime";
+import { useMemo as o } from "react";
+import { Checkbox as a } from "../../ui/checkbox.js";
+function f(s, r) {
+  const l = o(() => s.map((e) => e.id && !("accessorKey" in e) && !("accessorFn" in e) ? {
+    ...e,
+    accessorKey: e.id
+  } : e), [s]);
+  return o(() => r ? [{
+    id: "select",
+    header: ({ table: t }) => {
+      const n = t.getIsAllPageRowsSelected(), i = t.getIsSomePageRowsSelected();
+      return /* @__PURE__ */ c(
+        a,
+        {
+          checked: n ? !0 : i ? "indeterminate" : !1,
+          onCheckedChange: (d) => t.toggleAllPageRowsSelected(!!d),
+          "aria-label": "Select all"
+        }
+      );
+    },
+    cell: ({ row: t }) => /* @__PURE__ */ c(
+      a,
+      {
+        checked: t.getIsSelected(),
+        onCheckedChange: (n) => t.toggleSelected(!!n),
+        "aria-label": "Select row"
+      }
+    ),
+    enableSorting: !1,
+    enableHiding: !1,
+    meta: {
+      sticky: "left"
+    }
+  }, ...l] : l, [l, r]);
+}
+export {
+  f as useDataTableColumns
+};

package/dist/components/data-table/hooks/useDataTableConfig.d.ts

@@ -0,0 +1,18 @@
+import type { TableOptions, OnChangeFn, PaginationState, SortingState, RowSelectionState } from "@tanstack/react-table";
+export declare function useDataTableConfig<TData extends {
+    id: string;
+}>({ data, columns, enableRowSelection, rowSelection, setRowSelection, pageCount, pagination, onPaginationChange, sorting, onSortingChange, }: {
+    data: TData[];
+    columns: any[];
+    enableRowSelection: boolean;
+    rowSelection: RowSelectionState;
+    setRowSelection: (updater: RowSelectionState | ((prev: RowSelectionState) => RowSelectionState)) => void;
+    pageCount?: number;
+    pagination?: PaginationState & {
+        hasNextPage?: boolean;
+    };
+    onPaginationChange?: OnChangeFn<PaginationState>;
+    sorting?: SortingState;
+    onSortingChange?: OnChangeFn<SortingState>;
+}): TableOptions<TData>;
+//# sourceMappingURL=useDataTableConfig.d.ts.map

package/dist/components/data-table/hooks/useDataTableConfig.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataTableConfig.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/hooks/useDataTableConfig.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,YAAY,EACZ,UAAU,EACV,eAAe,EACf,YAAY,EACZ,iBAAiB,EAClB,MAAM,uBAAuB,CAAC;AAO/B,wBAAgB,kBAAkB,CAAC,KAAK,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,EAC/D,IAAI,EACJ,OAAO,EACP,kBAAkB,EAClB,YAAY,EACZ,eAAe,EACf,SAAS,EACT,UAAU,EACV,kBAAkB,EAClB,OAAO,EACP,eAAe,GAChB,EAAE;IACD,IAAI,EAAE,KAAK,EAAE,CAAC;IACd,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,kBAAkB,EAAE,OAAO,CAAC;IAC5B,YAAY,EAAE,iBAAiB,CAAC;IAChC,eAAe,EAAE,CAAC,OAAO,EAAE,iBAAiB,GAAG,CAAC,CAAC,IAAI,EAAE,iBAAiB,KAAK,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACzG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,eAAe,GAAG;QAAE,WAAW,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;IACzD,kBAAkB,CAAC,EAAE,UAAU,CAAC,eAAe,CAAC,CAAC;IACjD,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,eAAe,CAAC,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC;CAC5C,GAAG,YAAY,CAAC,KAAK,CAAC,CAqEtB"}

package/dist/components/data-table/hooks/useDataTableConfig.js

@@ -0,0 +1,54 @@
+import { useMemo as n } from "react";
+import { getCoreRowModel as M, getPaginationRowModel as R, getSortedRowModel as m } from "@tanstack/react-table";
+function S({
+  data: d,
+  columns: g,
+  enableRowSelection: l,
+  rowSelection: f,
+  setRowSelection: s,
+  pageCount: o,
+  pagination: t,
+  onPaginationChange: a,
+  sorting: r,
+  onSortingChange: i
+}) {
+  return n(() => {
+    const e = {
+      data: d,
+      columns: g,
+      getCoreRowModel: M(),
+      getRowId: (u) => u.id,
+      enableSorting: !0
+      // Habilitar sorting a nivel de tabla
+    };
+    return l && (e.enableRowSelection = !0, e.onRowSelectionChange = s, e.state = {
+      rowSelection: f
+    }), o && (e.pageCount = o), t && (e.manualPagination = !0, e.state = {
+      ...e.state,
+      pagination: {
+        pageIndex: t.pageIndex,
+        pageSize: t.pageSize
+      }
+    }, e.getPaginationRowModel = R()), a && (e.onPaginationChange = a), i ? (e.manualSorting = !0, e.onSortingChange = i, e.state = {
+      ...e.state,
+      sorting: r || []
+    }) : (e.getSortedRowModel = m(), e.state = {
+      ...e.state,
+      sorting: r || []
+    }), e;
+  }, [
+    d,
+    g,
+    l,
+    f,
+    s,
+    o,
+    t,
+    a,
+    r,
+    i
+  ]);
+}
+export {
+  S as useDataTableConfig
+};

package/dist/components/data-table/hooks/useStickyColumns.d.ts

@@ -0,0 +1,5 @@
+export declare function useStickyColumns(): {
+    tableRef: import("react").RefObject<HTMLTableElement | null>;
+    isScrolled: boolean;
+};
+//# sourceMappingURL=useStickyColumns.d.ts.map

package/dist/components/data-table/hooks/useStickyColumns.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStickyColumns.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/hooks/useStickyColumns.ts"],"names":[],"mappings":"AAEA,wBAAgB,gBAAgB;;;EAqB/B"}