@krosoft/react 0.0.161 → 0.0.163

package/dist/DataTable-CSupYrnN.js

@@ -0,0 +1,506 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { u as ae } from "./useDataTable-CxcA5S-s.js";
+import { ay as P, aM as $, aA as W, aC as se, $ as B, az as ie } from "./toggle-group-BASGy2mQ.js";
+import "./alert-B78CiTYe.js";
+import "@radix-ui/react-aspect-ratio";
+import { B as y } from "./tooltip-BWyFpIxo.js";
+import "@radix-ui/react-collapsible";
+import "./sheet-Gop1cIaU.js";
+import { MoreVerticalIcon as ne, Loader2Icon as le, GripVerticalIcon as de, ArrowUpIcon as oe, ArrowDownIcon as ce, ArrowUpDownIcon as me, ChevronLeftIcon as he, ChevronRightIcon as ge, SettingsIcon as ue } from "lucide-react";
+import "react-resizable-panels";
+import "clsx";
+import "tailwind-merge";
+import "./select-MWzbMBAS.js";
+import "next-themes";
+import "sonner";
+import "react";
+const L = [5, 10, 30, 50, 100], pe = L[1];
+function fe({ actions: d, row: a }) {
+  const o = d.filter((r) => r.visible === void 0 || r.visible(a));
+  if (o.length === 0)
+    return null;
+  const s = o.filter((r) => r.overflow !== !0), m = o.filter((r) => r.overflow === !0);
+  return /* @__PURE__ */ t("div", { className: "flex items-center justify-center gap-1", children: [
+    s.map((r, h) => {
+      var c;
+      const g = r.icon;
+      return /* @__PURE__ */ t(
+        y,
+        {
+          variant: r.variant ?? "ghost",
+          size: "sm",
+          disabled: ((c = r.disabled) == null ? void 0 : c.call(r, a)) ?? !1,
+          className: `h-7 px-2 text-muted-foreground hover:text-foreground ${r.className ?? ""}`,
+          onClick: (n) => {
+            n.stopPropagation(), r.onClick(a);
+          },
+          children: [
+            g !== void 0 && /* @__PURE__ */ e(g, { className: "size-3.5" }),
+            r.label
+          ]
+        },
+        h
+      );
+    }),
+    m.length > 0 && /* @__PURE__ */ t(P, { children: [
+      /* @__PURE__ */ e($, { asChild: !0, children: /* @__PURE__ */ e(y, { variant: "ghost", size: "icon", className: "h-7 w-7 text-muted-foreground hover:text-foreground", children: /* @__PURE__ */ e(ne, { className: "size-3.5" }) }) }),
+      /* @__PURE__ */ e(
+        W,
+        {
+          align: "end",
+          onClick: (r) => {
+            r.stopPropagation();
+          },
+          children: m.map((r, h) => {
+            var c;
+            const g = r.icon;
+            return /* @__PURE__ */ t(
+              se,
+              {
+                disabled: ((c = r.disabled) == null ? void 0 : c.call(r, a)) ?? !1,
+                onClick: () => {
+                  r.onClick(a);
+                },
+                className: r.className,
+                children: [
+                  g !== void 0 && /* @__PURE__ */ e("span", { className: "mr-2 size-4 flex items-center justify-center", children: /* @__PURE__ */ e(g, { className: "size-4" }) }),
+                  r.label
+                ]
+              },
+              h
+            );
+          })
+        }
+      )
+    ] })
+  ] });
+}
+function xe({
+  isLoading: d,
+  colSpanCount: a,
+  noDataMessage: o,
+  paginatedData: s,
+  getRowId: m,
+  onRowClick: r,
+  hasBulkActions: h,
+  selectedRows: g,
+  toggleRowSelection: c,
+  visibleColumnsArray: n,
+  columnWidths: N,
+  hasActions: z,
+  actions: v,
+  columns: w,
+  bordered: k = !1
+}) {
+  const D = (u, p) => {
+    const i = w.find((b) => b.key === p);
+    if ((i == null ? void 0 : i.renderCell) !== void 0)
+      return i.renderCell(u);
+    const x = u[p];
+    return /* @__PURE__ */ e("span", { className: "text-sm truncate", children: x != null ? String(x) : "-" });
+  };
+  return d ? /* @__PURE__ */ e("tbody", { className: "divide-y divide-gray-200 dark:divide-gray-800", children: /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e("td", { colSpan: a, className: "py-8 text-center", children: /* @__PURE__ */ t("div", { className: "flex flex-col items-center justify-center gap-2 text-muted-foreground", children: [
+    /* @__PURE__ */ e(le, { className: "h-6 w-6 animate-spin text-primary" }),
+    /* @__PURE__ */ e("span", { className: "text-sm", children: "Chargement..." })
+  ] }) }) }) }) : s.length === 0 ? /* @__PURE__ */ e("tbody", { className: "divide-y divide-gray-200 dark:divide-gray-800", children: /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e("td", { colSpan: a, className: "py-8 text-center text-sm text-muted-foreground", children: o }) }) }) : /* @__PURE__ */ e("tbody", { className: "divide-y divide-gray-200 dark:divide-gray-800", children: s.map((u) => {
+    const p = m(u);
+    return /* @__PURE__ */ t(
+      "tr",
+      {
+        className: `group hover:bg-muted/50 dark:hover:bg-gray-900/50 transition-colors ${r !== void 0 ? "cursor-pointer" : ""}`,
+        onClick: () => r == null ? void 0 : r(u),
+        children: [
+          h ? /* @__PURE__ */ e(
+            "td",
+            {
+              className: "p-1 text-center align-middle",
+              style: { width: "32px", minWidth: "32px", maxWidth: "32px" },
+              onClick: (i) => {
+                i.stopPropagation();
+              },
+              children: /* @__PURE__ */ e("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ e(
+                B,
+                {
+                  checked: g.includes(p),
+                  onCheckedChange: () => {
+                    c(p);
+                  }
+                }
+              ) })
+            }
+          ) : null,
+          n.map((i, x) => {
+            const b = x === n.length - 1;
+            return /* @__PURE__ */ e(
+              "td",
+              {
+                className: `px-2 py-2 relative ${k && !b ? "border-r border-gray-100 dark:border-gray-800" : ""} ${i.className ?? ""}`,
+                style: { width: N[i.key] },
+                children: /* @__PURE__ */ e("div", { className: "w-full h-full", children: D(u, i.key) })
+              },
+              i.key
+            );
+          }),
+          z ? /* @__PURE__ */ e(
+            "td",
+            {
+              className: "p-1 text-center align-middle whitespace-nowrap",
+              style: { minWidth: "32px" },
+              onClick: (i) => {
+                i.stopPropagation();
+              },
+              children: v !== void 0 && v.length > 0 ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ e(fe, { actions: v, row: u }) }) : null
+            }
+          ) : null
+        ]
+      },
+      p
+    );
+  }) });
+}
+function ve({ selectedRows: d, setSelectedRows: a, bulkActions: o }) {
+  return /* @__PURE__ */ t("div", { className: "bg-muted/60 dark:bg-gray-900/60 border border-border px-3 py-1.5 flex items-center justify-between rounded-lg", children: [
+    /* @__PURE__ */ t("div", { className: "flex items-center gap-4", children: [
+      /* @__PURE__ */ t("span", { className: "text-sm font-medium text-primary ml-1", children: [
+        d.length,
+        " sélectionné(s)"
+      ] }),
+      /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: o.map((s, m) => {
+        const r = s.icon;
+        return /* @__PURE__ */ t(
+          y,
+          {
+            variant: "outline",
+            size: "sm",
+            onClick: () => {
+              s.onClick(d, () => {
+                a([]);
+              });
+            },
+            className: `h-7 bg-background shadow-sm text-xs px-2.5 ${s.variant === "destructive" ? "text-destructive border-destructive/30 hover:bg-destructive/10 hover:text-destructive" : "text-foreground"}`,
+            children: [
+              r !== void 0 && /* @__PURE__ */ e("span", { className: "mr-1.5 flex items-center justify-center", children: /* @__PURE__ */ e(r, { className: "h-3.5 w-3.5" }) }),
+              s.label
+            ]
+          },
+          m
+        );
+      }) })
+    ] }),
+    /* @__PURE__ */ e(
+      y,
+      {
+        variant: "ghost",
+        size: "sm",
+        onClick: () => {
+          a([]);
+        },
+        className: "text-xs text-muted-foreground hover:text-foreground h-7 px-2",
+        children: "Désélectionner"
+      }
+    )
+  ] });
+}
+function be({
+  hasBulkActions: d,
+  selectedRows: a,
+  totalItems: o,
+  toggleSelectAll: s,
+  visibleColumnsArray: m,
+  draggableColumns: r,
+  resizableColumns: h,
+  columnWidths: g,
+  sortColumn: c,
+  sortDirection: n,
+  handleSort: N,
+  handleDragStart: z,
+  handleDragOver: v,
+  handleDrop: w,
+  handleMouseDown: k,
+  hasActions: D,
+  settingsNode: u,
+  bordered: p = !1
+}) {
+  let i = !1;
+  a.length === o && o > 0 ? i = !0 : a.length > 0 && (i = "indeterminate");
+  const x = (l) => l.sortable !== !0 ? null : c === l.key ? n === "asc" ? /* @__PURE__ */ e(oe, { className: "size-3.5 text-foreground" }) : /* @__PURE__ */ e(ce, { className: "size-3.5 text-foreground" }) : /* @__PURE__ */ e(me, { className: "size-3.5 text-muted-foreground/50 group-hover:text-muted-foreground transition-colors" }), b = (l, I) => {
+    const S = I !== !1, C = l.sortable === !0;
+    return /* @__PURE__ */ t(
+      "th",
+      {
+        className: [
+          "px-2 py-2 text-left text-sm font-medium text-gray-900 dark:text-gray-100 relative group",
+          p ? "border-r border-gray-200 dark:border-gray-800" : "",
+          C ? "cursor-pointer select-none" : "",
+          l.className ?? ""
+        ].filter(Boolean).join(" "),
+        style: { width: g[l.key] },
+        draggable: S,
+        onClick: () => {
+          N(l.key);
+        },
+        onDragStart: (f) => {
+          S ? z(f, l.key) : f.preventDefault();
+        },
+        onDragOver: (f) => {
+          v(f, l.key);
+        },
+        onDrop: (f) => {
+          w(f, l.key);
+        },
+        children: [
+          /* @__PURE__ */ t("div", { className: "flex items-center justify-between pr-2", children: [
+            /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: [
+              S ? /* @__PURE__ */ e(de, { className: "size-4 text-gray-400 cursor-grab dark:text-gray-300 shrink-0" }) : null,
+              /* @__PURE__ */ e("span", { className: "truncate", children: l.label })
+            ] }),
+            /* @__PURE__ */ e("div", { className: "ml-1 shrink-0", children: x(l) })
+          ] }),
+          h ? /* @__PURE__ */ e(
+            "div",
+            {
+              className: "absolute right-0 top-0 bottom-0 w-2 cursor-col-resize hover:bg-blue-500 opacity-0 group-hover:opacity-50 transition-opacity",
+              onMouseDown: (f) => {
+                k(f, l.key);
+              }
+            }
+          ) : null
+        ]
+      },
+      l.key
+    );
+  };
+  return /* @__PURE__ */ e("thead", { className: "bg-muted/50 dark:bg-gray-900/50 border-b border-gray-200 dark:border-gray-800", children: /* @__PURE__ */ t("tr", { children: [
+    d ? /* @__PURE__ */ e("th", { className: "p-1 flex-shrink-0 text-center align-middle", style: { width: "32px", minWidth: "32px", maxWidth: "32px" }, children: /* @__PURE__ */ e("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ e(B, { checked: i, onCheckedChange: s }) }) }) : null,
+    m.map((l) => b(l, r)),
+    D || u !== void 0 ? /* @__PURE__ */ e("th", { className: "p-1 text-center align-middle", style: { minWidth: "32px" }, children: u }) : null
+  ] }) });
+}
+function ye({
+  totalItems: d,
+  startIndex: a,
+  endIndex: o,
+  pageSize: s,
+  setPageSize: m,
+  currentPage: r,
+  setCurrentPage: h,
+  pageSizeOptions: g,
+  totalPages: c
+}) {
+  return /* @__PURE__ */ t("div", { className: "px-4 py-2 border-t border-gray-200 dark:border-gray-800 flex items-center justify-between bg-muted/50 dark:bg-gray-900/50 flex-wrap gap-2", children: [
+    /* @__PURE__ */ t("div", { className: "text-sm text-muted-foreground", children: [
+      d === 0 ? "0" : `${String(a + 1)} - ${String(o)}`,
+      " sur ",
+      d
+    ] }),
+    /* @__PURE__ */ t("div", { className: "flex items-center gap-4", children: [
+      /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ e("span", { className: "text-sm text-muted-foreground", children: "Lignes par page :" }),
+        /* @__PURE__ */ e(
+          "select",
+          {
+            value: s,
+            onChange: (n) => {
+              m(Number(n.target.value)), h(1);
+            },
+            className: "border border-input bg-background rounded px-2 py-1 text-sm text-foreground",
+            children: g.map((n) => /* @__PURE__ */ e("option", { value: n, children: n }, n))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ e(
+          y,
+          {
+            variant: "outline",
+            size: "sm",
+            className: "h-8 w-8 p-0",
+            onClick: () => {
+              h((n) => Math.max(1, n - 1));
+            },
+            disabled: r === 1,
+            children: /* @__PURE__ */ e(he, { className: "size-4" })
+          }
+        ),
+        /* @__PURE__ */ t("span", { className: "text-sm text-muted-foreground", children: [
+          "Page ",
+          r,
+          " sur ",
+          c
+        ] }),
+        /* @__PURE__ */ e(
+          y,
+          {
+            variant: "outline",
+            size: "sm",
+            className: "h-8 w-8 p-0",
+            onClick: () => {
+              h((n) => Math.min(c, n + 1));
+            },
+            disabled: r === c,
+            children: /* @__PURE__ */ e(ge, { className: "size-4" })
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+function Ne({ columns: d, visibleColumns: a, toggleColumnVisibility: o }) {
+  return /* @__PURE__ */ t(P, { children: [
+    /* @__PURE__ */ e($, { asChild: !0, children: /* @__PURE__ */ e(y, { variant: "outline", size: "sm", className: "size-7 p-0 bg-white hover:bg-gray-100 dark:bg-gray-900 shadow-sm border-gray-200 dark:border-gray-800", children: /* @__PURE__ */ e(ue, { className: "size-3.5 text-gray-600 dark:text-gray-300" }) }) }),
+    /* @__PURE__ */ e(W, { align: "end", className: "w-56", children: d.map((s) => /* @__PURE__ */ e(
+      ie,
+      {
+        checked: a.has(s.key),
+        onCheckedChange: () => {
+          o(s.key);
+        },
+        children: s.label
+      },
+      s.key
+    )) })
+  ] });
+}
+function He({
+  data: d,
+  columns: a,
+  getRowId: o,
+  onRowClick: s,
+  actions: m,
+  bulkActions: r,
+  draggableColumns: h = !1,
+  resizableColumns: g = !1,
+  columnVisibility: c = !1,
+  isLoading: n = !1,
+  bordered: N = !1,
+  noDataMessage: z = "Aucun résultat",
+  defaultPageSize: v = pe,
+  pageSizeOptions: w = L,
+  totalRows: k,
+  currentPage: D,
+  pageSize: u,
+  onPageChange: p,
+  onPageSizeChange: i,
+  sortColumn: x,
+  sortDirection: b,
+  onSortChange: l
+}) {
+  const {
+    sortColumn: I,
+    sortDirection: S,
+    selectedRows: C,
+    setSelectedRows: f,
+    visibleColumns: H,
+    columnWidths: j,
+    safeCurrentPage: O,
+    totalPages: U,
+    startIndex: V,
+    endIndex: G,
+    tableRef: q,
+    hasActions: A,
+    hasBulkActions: M,
+    visibleColumnsArray: T,
+    colSpanCount: E,
+    paginatedData: F,
+    handleSort: J,
+    handleMouseDown: Q,
+    handleDragStart: X,
+    handleDragOver: Y,
+    handleDrop: Z,
+    toggleColumnVisibility: _,
+    toggleRowSelection: K,
+    toggleSelectAll: R,
+    pageSize: ee,
+    setPageSize: re,
+    setCurrentPage: te
+  } = ae({
+    data: d,
+    columns: a,
+    getRowId: o,
+    defaultPageSize: v,
+    actions: m,
+    bulkActions: r,
+    columnVisibility: c,
+    totalRows: k,
+    currentPage: D,
+    pageSize: u,
+    onPageChange: p,
+    onPageSizeChange: i,
+    sortColumn: x,
+    sortDirection: b,
+    onSortChange: l
+  });
+  return /* @__PURE__ */ t("div", { className: "space-y-4", children: [
+    C.length > 0 && r !== void 0 && r.length > 0 && /* @__PURE__ */ e(ve, { selectedRows: C, setSelectedRows: f, bulkActions: r }),
+    /* @__PURE__ */ t("div", { className: "w-full bg-card dark:bg-gray-950 rounded-md border border-gray-200 dark:border-gray-800 overflow-hidden", children: [
+      /* @__PURE__ */ e("div", { className: "overflow-x-auto", children: /* @__PURE__ */ t("table", { ref: q, className: "w-full", children: [
+        /* @__PURE__ */ e(
+          be,
+          {
+            hasBulkActions: M,
+            selectedRows: C,
+            totalItems: d.length,
+            toggleSelectAll: R,
+            visibleColumnsArray: T,
+            draggableColumns: h,
+            resizableColumns: g,
+            columnWidths: j,
+            sortColumn: I,
+            sortDirection: S,
+            handleSort: J,
+            handleDragStart: X,
+            handleDragOver: Y,
+            handleDrop: Z,
+            handleMouseDown: Q,
+            hasActions: A,
+            bordered: N,
+            settingsNode: c ? /* @__PURE__ */ e(Ne, { columns: a, visibleColumns: H, toggleColumnVisibility: _ }) : void 0
+          }
+        ),
+        /* @__PURE__ */ e(
+          xe,
+          {
+            bordered: N,
+            isLoading: n,
+            colSpanCount: E,
+            noDataMessage: z,
+            paginatedData: F,
+            getRowId: o,
+            onRowClick: s,
+            hasBulkActions: M,
+            selectedRows: C,
+            toggleRowSelection: K,
+            visibleColumnsArray: T,
+            columnWidths: j,
+            hasActions: A || c,
+            actions: m,
+            columns: a
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ e(
+        ye,
+        {
+          totalItems: k ?? d.length,
+          startIndex: V,
+          endIndex: G,
+          pageSize: ee,
+          setPageSize: re,
+          currentPage: O,
+          setCurrentPage: te,
+          pageSizeOptions: w,
+          totalPages: U
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  He as D,
+  fe as T,
+  xe as a,
+  ve as b,
+  be as c,
+  ye as d,
+  Ne as e
+};