@sth87/shadcn-design-system 0.1.9 → 0.2.1

package/dist/esm/components/Table/TableFilter/data-table-filter-popover.js

@@ -2,13 +2,13 @@ import { jsx as a, jsxs as i, Fragment as d } from "react/jsx-runtime";
 import { X as V } from "lucide-react";
 import * as C from "react";
 import { Popover as N } from "../../Popover/index.js";
-import { DataTableSliderFilter as x } from "./data-table-slider-filter.js";
-import { DataTableDateFilter as w } from "./data-table-date-filter.js";
-import D from "../../Separator/Separator.js";
-import O from "../../Button/Button.js";
-import S from "../../Checkbox/Checkbox.js";
-import k from "../../Radio/Radio.js";
 import o from "../../Input/Input.js";
+import x from "../../Checkbox/Checkbox.js";
+import w from "../../Radio/Radio.js";
+import { DataTableSliderFilter as D } from "./data-table-slider-filter.js";
+import { DataTableDateFilter as O } from "./data-table-date-filter.js";
+import S from "../../Separator/Separator.js";
+import k from "../../Button/Button.js";
 function A({
   column: e,
   trigger: c,
@@ -42,7 +42,7 @@ function A({
       case "date":
       case "dateRange":
         return /* @__PURE__ */ a(
-          w,
+          O,
           {
             column: e,
             title: t.label ?? e.id,
@@ -51,7 +51,7 @@ function A({
         );
       case "range":
         return /* @__PURE__ */ a(
-          x,
+          D,
           {
             column: e,
             title: t.label ?? e.id
@@ -67,7 +67,7 @@ function A({
             {
               className: "ds:flex ds:items-center ds:space-x-2",
               children: /* @__PURE__ */ a(
-                S,
+                x,
                 {
                   checked: s.includes(l.value),
                   onCheckedChange: (b) => {
@@ -87,7 +87,7 @@ function A({
         } else {
           const s = e.getFilterValue();
           return /* @__PURE__ */ a(
-            k,
+            w,
             {
               value: s,
               onValueChange: (l) => e.setFilterValue(l),
@@ -113,9 +113,9 @@ function A({
       content: /* @__PURE__ */ i("div", { className: "ds:p-2 ds:min-w-32", children: [
         f(),
         F && /* @__PURE__ */ i(d, { children: [
-          /* @__PURE__ */ a(D, { className: "ds:mt-3 ds:mb-1" }),
+          /* @__PURE__ */ a(S, { className: "ds:mt-3 ds:mb-1" }),
           /* @__PURE__ */ i(
-            O,
+            k,
             {
               variant: "ghost",
               size: "sm",
@@ -135,4 +135,3 @@ function A({
 export {
   A as DataTableFilterPopover
 };
-//# sourceMappingURL=data-table-filter-popover.js.map

package/dist/esm/components/Table/TableFilter/data-table-slider-filter.js

@@ -1,80 +1,50 @@
-import { jsxs as d, jsx as t, Fragment as k } from "react/jsx-runtime";
+import { jsxs as d, jsx as s, Fragment as k } from "react/jsx-runtime";
 import { XCircle as I, PlusCircle as D } from "lucide-react";
 import * as m from "react";
-import { Popover as w } from "../../Popover/index.js";
-import "@radix-ui/react-slot";
-import "../../../packages/ui/src/components/button.js";
-import "../../../packages/ui/src/components/button-group.js";
-import "../../../packages/ui/src/components/input.js";
-import "../../../packages/ui/src/components/textarea.js";
-import "@radix-ui/react-label";
-import { cn as y } from "../../../packages/ui/src/lib/utils.js";
-import "../../../packages/ui/src/components/select.js";
-import "../../../packages/ui/src/components/combobox.js";
-import "@radix-ui/react-tooltip";
-import "react-day-picker";
-import "../../../packages/ui/src/components/popover.js";
-import "@radix-ui/react-separator";
-import "../../../packages/ui/src/components/switch.js";
-import "vaul";
-import "@radix-ui/react-scroll-area";
-import "../../../packages/ui/src/components/tree-view.js";
-import "@radix-ui/react-alert-dialog";
-import "@radix-ui/react-avatar";
-import "../../../packages/ui/src/components/badge.js";
-import "../../../packages/ui/src/components/checkbox.js";
-import "@radix-ui/react-collapsible";
-import "cmdk";
-import "@radix-ui/react-dialog";
-import "@radix-ui/react-dropdown-menu";
-import "../../../packages/ui/src/components/input-otp.js";
-import "../../../packages/ui/src/components/radio-group.js";
-import "../../../packages/ui/src/components/sidebar.js";
-import "@radix-ui/react-slider";
-import "../../../packages/ui/src/components/tabs.js";
-import "../../../packages/ui/src/components/toggle.js";
+import y from "../../Button/Button.js";
 import v from "../../Input/Input.js";
-import P from "../../Slider/Slider.js";
-import C from "../../Button/Button.js";
-import R from "../../Separator/Separator.js";
+import { Popover as w } from "../../Popover/index.js";
+import P from "../../Separator/Separator.js";
+import R from "../../Slider/Slider.js";
+import { cn as C } from "../../../packages/ui/src/lib/utils.js";
 function z(e) {
   return Array.isArray(e) && e.length === 2 && typeof e[0] == "number" && typeof e[1] == "number";
 }
 function T(e) {
   if (Array.isArray(e) && e.length === 2 && e.every(
-    (o) => (typeof o == "string" || typeof o == "number") && !Number.isNaN(o)
+    (i) => (typeof i == "string" || typeof i == "number") && !Number.isNaN(i)
   ))
     return [Number(e[0]), Number(e[1])];
 }
-function ve({
+function J({
   column: e,
-  title: o
+  title: i
 }) {
-  const c = m.useId(), p = T(e.getFilterValue()), u = e.columnDef.meta?.range, l = e.columnDef.meta?.unit, { min: i, max: a, step: V } = m.useMemo(() => {
-    let r = 0, s = 100;
-    if (u && z(u))
-      [r, s] = u;
+  const c = m.useId(), u = T(e.getFilterValue()), p = e.columnDef.meta?.range, o = e.columnDef.meta?.unit, { min: a, max: n, step: V } = m.useMemo(() => {
+    let r = 0, t = 100;
+    if (p && z(p))
+      [r, t] = p;
     else {
       const g = e.getFacetedMinMaxValues();
       if (g && Array.isArray(g) && g.length === 2) {
         const [N, x] = g;
-        typeof N == "number" && typeof x == "number" && (r = N, s = x);
+        typeof N == "number" && typeof x == "number" && (r = N, t = x);
       }
     }
-    const f = s - r, $ = f <= 20 ? 1 : f <= 100 ? Math.ceil(f / 20) : Math.ceil(f / 50);
-    return { min: r, max: s, step: $ };
-  }, [e, u]), n = m.useMemo(() => p ?? [i, a], [p, i, a]), h = m.useCallback((r) => r.toLocaleString(void 0, { maximumFractionDigits: 0 }), []), F = m.useCallback(
+    const f = t - r, $ = f <= 20 ? 1 : f <= 100 ? Math.ceil(f / 20) : Math.ceil(f / 50);
+    return { min: r, max: t, step: $ };
+  }, [e, p]), l = m.useMemo(() => u ?? [a, n], [u, a, n]), h = m.useCallback((r) => r.toLocaleString(void 0, { maximumFractionDigits: 0 }), []), F = m.useCallback(
     (r) => {
-      const s = Number(r.target.value);
-      !Number.isNaN(s) && s >= i && s <= n[1] && e.setFilterValue([s, n[1]]);
+      const t = Number(r.target.value);
+      !Number.isNaN(t) && t >= a && t <= l[1] && e.setFilterValue([t, l[1]]);
     },
-    [e, i, n]
+    [e, a, l]
   ), M = m.useCallback(
     (r) => {
-      const s = Number(r.target.value);
-      !Number.isNaN(s) && s <= a && s >= n[0] && e.setFilterValue([n[0], s]);
+      const t = Number(r.target.value);
+      !Number.isNaN(t) && t <= n && t >= l[0] && e.setFilterValue([l[0], t]);
     },
-    [e, a, n]
+    [e, n, l]
   ), S = m.useCallback(
     (r) => {
       Array.isArray(r) && r.length === 2 && e.setFilterValue(r);
@@ -87,71 +57,71 @@ function ve({
     [e]
   ), A = /* @__PURE__ */ d("div", { className: "ds:flex ds:w-auto ds:flex-col ds:gap-4", children: [
     /* @__PURE__ */ d("div", { className: "ds:flex ds:flex-col ds:gap-3", children: [
-      /* @__PURE__ */ t("p", { className: "ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70", children: o }),
+      /* @__PURE__ */ s("p", { className: "ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70", children: i }),
       /* @__PURE__ */ d("div", { className: "ds:flex ds:items-center ds:gap-4", children: [
-        /* @__PURE__ */ t("label", { htmlFor: `${c}-from`, className: "ds:sr-only", children: "From" }),
+        /* @__PURE__ */ s("label", { htmlFor: `${c}-from`, className: "ds:sr-only", children: "From" }),
         /* @__PURE__ */ d("div", { className: "ds:relative", children: [
-          /* @__PURE__ */ t(
+          /* @__PURE__ */ s(
             v,
             {
               id: `${c}-from`,
               type: "number",
-              "aria-valuemin": i,
-              "aria-valuemax": a,
+              "aria-valuemin": a,
+              "aria-valuemax": n,
               inputMode: "numeric",
               pattern: "[0-9]*",
-              placeholder: i.toString(),
-              min: i,
-              max: a,
-              value: n[0]?.toString(),
+              placeholder: a.toString(),
+              min: a,
+              max: n,
+              value: l[0]?.toString(),
               onChange: F,
-              className: y("ds:h-8 ds:w-24", l && "ds:pr-8")
+              className: C("ds:h-8 ds:w-24", o && "ds:pr-8")
             }
           ),
-          l && /* @__PURE__ */ t("span", { className: "ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm", children: l })
+          o && /* @__PURE__ */ s("span", { className: "ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm", children: o })
         ] }),
-        /* @__PURE__ */ t("label", { htmlFor: `${c}-to`, className: "ds:sr-only", children: "to" }),
+        /* @__PURE__ */ s("label", { htmlFor: `${c}-to`, className: "ds:sr-only", children: "to" }),
         /* @__PURE__ */ d("div", { className: "ds:relative", children: [
-          /* @__PURE__ */ t(
+          /* @__PURE__ */ s(
             v,
             {
               id: `${c}-to`,
               type: "number",
-              "aria-valuemin": i,
-              "aria-valuemax": a,
+              "aria-valuemin": a,
+              "aria-valuemax": n,
               inputMode: "numeric",
               pattern: "[0-9]*",
-              placeholder: a.toString(),
-              min: i,
-              max: a,
-              value: n[1]?.toString(),
+              placeholder: n.toString(),
+              min: a,
+              max: n,
+              value: l[1]?.toString(),
               onChange: M,
-              className: y("ds:h-8 ds:w-24", l && "ds:pr-8")
+              className: C("ds:h-8 ds:w-24", o && "ds:pr-8")
             }
           ),
-          l && /* @__PURE__ */ t("span", { className: "ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm", children: l })
+          o && /* @__PURE__ */ s("span", { className: "ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm", children: o })
         ] })
       ] }),
       /* @__PURE__ */ d("label", { htmlFor: `${c}-slider`, className: "ds:sr-only", children: [
-        o,
+        i,
         " slider"
       ] }),
-      /* @__PURE__ */ t(
-        P,
+      /* @__PURE__ */ s(
+        R,
         {
           id: `${c}-slider`,
-          min: i,
-          max: a,
+          min: a,
+          max: n,
           step: V,
-          value: n,
+          value: l,
           onValueChange: S
         }
       )
     ] }),
-    /* @__PURE__ */ t(
-      C,
+    /* @__PURE__ */ s(
+      y,
       {
-        "aria-label": `Clear ${o} filter`,
+        "aria-label": `Clear ${i} filter`,
         variant: "outline",
         size: "sm",
         onClick: b,
@@ -159,36 +129,35 @@ function ve({
       }
     )
   ] });
-  return /* @__PURE__ */ t(w, { content: A, children: /* @__PURE__ */ d(C, { variant: "outline", size: "sm", className: "ds:border-dashed ds:font-normal", children: [
-    p ? /* @__PURE__ */ t(
+  return /* @__PURE__ */ s(w, { content: A, children: /* @__PURE__ */ d(y, { variant: "outline", size: "sm", className: "ds:border-dashed ds:font-normal", children: [
+    u ? /* @__PURE__ */ s(
       "div",
       {
         role: "button",
-        "aria-label": `Clear ${o} filter`,
+        "aria-label": `Clear ${i} filter`,
         tabIndex: 0,
         className: "ds:rounded-sm ds:opacity-70 ds:transition-opacity ds:hover:opacity-100 ds:focus-visible:outline-none ds:focus-visible:ring-1 ds:focus-visible:ring-ring",
         onClick: b,
-        children: /* @__PURE__ */ t(I, {})
+        children: /* @__PURE__ */ s(I, {})
       }
-    ) : /* @__PURE__ */ t(D, {}),
-    /* @__PURE__ */ t("span", { children: o }),
-    p ? /* @__PURE__ */ d(k, { children: [
-      /* @__PURE__ */ t(
-        R,
+    ) : /* @__PURE__ */ s(D, {}),
+    /* @__PURE__ */ s("span", { children: i }),
+    u ? /* @__PURE__ */ d(k, { children: [
+      /* @__PURE__ */ s(
+        P,
         {
           orientation: "vertical",
           className: "ds:mx-0.5 ds:data-[orientation=vertical]:h-4"
         }
       ),
-      h(p[0]),
+      h(u[0]),
       " -",
       " ",
-      h(p[1]),
-      l ? ` ${l}` : ""
+      h(u[1]),
+      o ? ` ${o}` : ""
     ] }) : null
   ] }) });
 }
 export {
-  ve as DataTableSliderFilter
+  J as DataTableSliderFilter
 };
-//# sourceMappingURL=data-table-slider-filter.js.map

package/dist/esm/components/Table/data-table-column-header.js

@@ -1,113 +1,81 @@
-import { jsx as e, jsxs as d } from "react/jsx-runtime";
-import { ChevronDown as a, ChevronUp as p, ChevronsUpDown as c, Filter as m, X as f, EyeOff as h } from "lucide-react";
-import "@radix-ui/react-slot";
-import "../../packages/ui/src/components/button.js";
-import "../../packages/ui/src/components/button-group.js";
-import "../../packages/ui/src/components/input.js";
-import "../../packages/ui/src/components/textarea.js";
-import "@radix-ui/react-label";
+import { jsx as s, jsxs as a } from "react/jsx-runtime";
+import { ChevronDown as o, ChevronUp as n, ChevronsUpDown as p, Filter as f, X as h, EyeOff as v } from "lucide-react";
 import { cn as r } from "../../packages/ui/src/lib/utils.js";
-import "../../packages/ui/src/components/select.js";
-import "../../packages/ui/src/components/combobox.js";
-import "@radix-ui/react-tooltip";
-import "react";
-import "react-day-picker";
-import "../../packages/ui/src/components/popover.js";
-import "@radix-ui/react-separator";
-import "../../packages/ui/src/components/switch.js";
-import "vaul";
-import "@radix-ui/react-scroll-area";
-import "../../packages/ui/src/components/tree-view.js";
-import "@radix-ui/react-alert-dialog";
-import "@radix-ui/react-avatar";
-import "../../packages/ui/src/components/badge.js";
-import "../../packages/ui/src/components/checkbox.js";
-import "@radix-ui/react-collapsible";
-import "cmdk";
-import "@radix-ui/react-dialog";
-import "@radix-ui/react-dropdown-menu";
-import "../../packages/ui/src/components/input-otp.js";
-import "../../packages/ui/src/components/radio-group.js";
-import "../../packages/ui/src/components/sidebar.js";
-import "@radix-ui/react-slider";
-import "../../packages/ui/src/components/tabs.js";
-import "../../packages/ui/src/components/toggle.js";
-import v from "../DropdownMenu/DropdownMenu.js";
+import m from "../DropdownMenu/DropdownMenu.js";
 import { DataTableFilterPopover as u } from "./TableFilter/data-table-filter-popover.js";
 import b from "../Button/Button.js";
-function rt({
-  column: t,
-  label: n,
-  className: i
+function _({
+  column: e,
+  label: g,
+  className: d
 }) {
-  const o = n || (typeof t.columnDef.header == "string" ? t.columnDef.header : null);
-  if (!(t.getCanSort() || t.getCanHide() || t.getCanFilter()))
-    return /* @__PURE__ */ e("div", { className: r(i), children: o });
-  const g = /* @__PURE__ */ d("button", { className: "ds:-ml-1.5 ds:flex ds:h-8 ds:items-center ds:gap-1.5 ds:rounded-md ds:px-2 ds:py-1.5 ds:hover:bg-accent ds:focus:outline-none ds:focus:ring-1 ds:focus:ring-ring ds:data-[state=open]:bg-accent ds:[&_svg]:size-4 ds:[&_svg]:shrink-0 ds:[&_svg]:text-muted-foreground", children: [
-    o,
-    t.getCanSort() && (t.getIsSorted() === "desc" ? /* @__PURE__ */ e(a, {}) : t.getIsSorted() === "asc" ? /* @__PURE__ */ e(p, {}) : /* @__PURE__ */ e(c, {}))
-  ] }), l = t.getCanFilter() && t.columnDef.meta?.variant ? /* @__PURE__ */ e(
+  const i = g || (typeof e.columnDef.header == "string" ? e.columnDef.header : null);
+  if (!(e.getCanSort() || e.getCanHide() || e.getCanFilter()))
+    return /* @__PURE__ */ s("div", { className: r(d), children: i });
+  const l = /* @__PURE__ */ a("button", { className: "ds:-ml-1.5 ds:flex ds:h-8 ds:items-center ds:gap-1.5 ds:rounded-md ds:px-2 ds:py-1.5 ds:hover:bg-accent ds:focus:outline-none ds:focus:ring-1 ds:focus:ring-ring ds:data-[state=open]:bg-accent ds:[&_svg]:size-4 ds:[&_svg]:shrink-0 ds:[&_svg]:text-muted-foreground", children: [
+    i,
+    e.getCanSort() && (e.getIsSorted() === "desc" ? /* @__PURE__ */ s(o, {}) : e.getIsSorted() === "asc" ? /* @__PURE__ */ s(n, {}) : /* @__PURE__ */ s(p, {}))
+  ] }), c = e.getCanFilter() && e.columnDef.meta?.variant ? /* @__PURE__ */ s(
     u,
     {
-      column: t,
-      trigger: /* @__PURE__ */ e(
+      column: e,
+      trigger: /* @__PURE__ */ s(
         b,
         {
           variant: "ghost",
           className: r(
             "ds:hover:bg-accent ds:rounded ds:p-1",
-            t.getFilterValue() ? "ds:text-primary" : ""
+            e.getFilterValue() ? "ds:text-primary" : ""
           ),
-          children: /* @__PURE__ */ e(m, { className: "ds:size-4" })
+          children: /* @__PURE__ */ s(f, { className: "ds:size-4" })
         }
       )
     }
-  ) : null, s = [];
-  return t.getCanSort() && (s.push({
+  ) : null, t = [];
+  return e.getCanSort() && (t.push({
     key: "asc",
     type: "checkbox",
     label: "Asc",
-    icon: /* @__PURE__ */ e(p, {}),
-    checked: t.getIsSorted() === "asc",
-    onClick: () => t.toggleSorting(!1),
+    icon: /* @__PURE__ */ s(n, {}),
+    checked: e.getIsSorted() === "asc",
+    onClick: () => e.toggleSorting(!1),
     className: "ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground"
-  }), s.push({
+  }), t.push({
     key: "desc",
     type: "checkbox",
     label: "Desc",
-    icon: /* @__PURE__ */ e(a, {}),
-    checked: t.getIsSorted() === "desc",
-    onClick: () => t.toggleSorting(!0),
+    icon: /* @__PURE__ */ s(o, {}),
+    checked: e.getIsSorted() === "desc",
+    onClick: () => e.toggleSorting(!0),
     className: "ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground"
-  }), t.getIsSorted() && s.push({
+  }), e.getIsSorted() && t.push({
     key: "reset",
     type: "item",
     label: "Reset",
-    icon: /* @__PURE__ */ e(f, {}),
-    onClick: () => t.clearSorting(),
+    icon: /* @__PURE__ */ s(h, {}),
+    onClick: () => e.clearSorting(),
     className: "ds:pl-2 ds:[&_svg]:text-muted-foreground"
-  })), t.getCanHide() && s.push({
+  })), e.getCanHide() && t.push({
     key: "hide",
     type: "checkbox",
     label: "Hide",
-    icon: /* @__PURE__ */ e(h, {}),
-    checked: !t.getIsVisible(),
-    onClick: () => t.toggleVisibility(!1),
+    icon: /* @__PURE__ */ s(v, {}),
+    checked: !e.getIsVisible(),
+    onClick: () => e.toggleVisibility(!1),
     className: "ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground"
-  }), /* @__PURE__ */ d("div", { className: r("ds:flex ds:items-center ds:gap-1.5", i), children: [
-    /* @__PURE__ */ e(
-      v,
+  }), /* @__PURE__ */ a("div", { className: r("ds:flex ds:items-center ds:gap-1.5", d), children: [
+    /* @__PURE__ */ s(
+      m,
       {
-        trigger: g,
-        items: s,
+        trigger: l,
+        items: t,
         align: "start",
         contentClassName: "ds:w-28"
       }
     ),
-    l
+    c
   ] });
 }
 export {
-  rt as DataTableColumnHeader
+  _ as DataTableColumnHeader
 };
-//# sourceMappingURL=data-table-column-header.js.map

package/dist/esm/components/Table/data-table-pagination.js

@@ -1,79 +1,47 @@
-import { jsxs as o, jsx as r, Fragment as l } from "react/jsx-runtime";
-import { Pagination as g } from "../Pagination/index.js";
-import "@radix-ui/react-slot";
-import "../../packages/ui/src/components/button.js";
-import "../../packages/ui/src/components/button-group.js";
-import "../../packages/ui/src/components/input.js";
-import "../../packages/ui/src/components/textarea.js";
-import "@radix-ui/react-label";
-import { cn as f } from "../../packages/ui/src/lib/utils.js";
-import "../../packages/ui/src/components/select.js";
-import "../../packages/ui/src/components/combobox.js";
-import "@radix-ui/react-tooltip";
-import "react";
-import "lucide-react";
-import "react-day-picker";
-import "../../packages/ui/src/components/popover.js";
-import "@radix-ui/react-separator";
-import "../../packages/ui/src/components/switch.js";
-import "vaul";
-import "@radix-ui/react-scroll-area";
-import "../../packages/ui/src/components/tree-view.js";
-import "@radix-ui/react-alert-dialog";
-import "@radix-ui/react-avatar";
-import "../../packages/ui/src/components/badge.js";
-import "../../packages/ui/src/components/checkbox.js";
-import "@radix-ui/react-collapsible";
-import "cmdk";
-import "@radix-ui/react-dialog";
-import "@radix-ui/react-dropdown-menu";
-import "../../packages/ui/src/components/input-otp.js";
-import "../../packages/ui/src/components/radio-group.js";
-import "../../packages/ui/src/components/sidebar.js";
-import "@radix-ui/react-slider";
-import "../../packages/ui/src/components/tabs.js";
-import "../../packages/ui/src/components/toggle.js";
-import c from "../Select/Select.js";
-function Z({
+import { jsxs as t, jsx as a, Fragment as m } from "react/jsx-runtime";
+import f from "../Select/Select.js";
+import { Pagination as p } from "../Pagination/index.js";
+import { cn as c } from "../../packages/ui/src/lib/utils.js";
+function v({
   table: e,
-  pageSizeOptions: i = [5, 10, 20, 30, 40, 50, 100],
-  className: s,
-  showPageInfo: m = !1,
-  showPageSizeOptions: p = !1,
-  showRowSelectionCount: a = !1,
-  showPagination: d = !0,
-  ...n
+  pageSizeOptions: d = [5, 10, 20, 30, 40, 50, 100],
+  className: o,
+  showPageInfo: r = !1,
+  showPageSizeOptions: n = !1,
+  showRowSelectionCount: i = !1,
+  showPagination: l = !0,
+  ...g
 }) {
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ t(
     "div",
     {
-      className: f(
+      className: c(
         "ds:flex ds:w-full ds:flex-col-reverse ds:items-center ds:justify-between ds:gap-4 ds:overflow-auto ds:p-1 ds:sm:flex-row ds:sm:gap-8",
-        s
+        o
       ),
-      ...n,
+      ...g,
       children: [
-        /* @__PURE__ */ r("div", { className: "ds:flex-1 ds:whitespace-nowrap ds:text-muted-foreground ds:text-sm", children: a && /* @__PURE__ */ o(l, { children: [
+        /* @__PURE__ */ a("div", { className: "ds:flex-1 ds:whitespace-nowrap ds:text-muted-foreground ds:text-sm", children: i && /* @__PURE__ */ t(m, { children: [
           e.getFilteredSelectedRowModel().rows.length,
           " of",
           " ",
           e.getFilteredRowModel().rows.length,
           " row(s) selected."
         ] }) }),
-        /* @__PURE__ */ o("div", { className: "ds:flex ds:flex-col-reverse ds:items-center ds:gap-2 ds:sm:flex-row ds:sm:gap-2 ds:lg:gap-4", children: [
-          m && /* @__PURE__ */ o("div", { className: "ds:flex ds:items-center ds:justify-center ds:font-medium ds:text-sm", children: [
+        /* @__PURE__ */ t("div", { className: "ds:flex ds:flex-col-reverse ds:items-center ds:gap-2 ds:sm:flex-row ds:sm:gap-2 ds:lg:gap-4", children: [
+          r && /* @__PURE__ */ t("div", { className: "ds:flex ds:items-center ds:justify-center ds:font-medium ds:text-sm", children: [
             "Page ",
             e.getState().pagination.pageIndex + 1,
             " of",
             " ",
             e.getPageCount()
           ] }),
-          d && /* @__PURE__ */ r(
-            g,
+          l && /* @__PURE__ */ a(
+            p,
             {
               total: e.getPageCount(),
               currentPage: e.getState().pagination.pageIndex + 1,
-              onPageChange: (t) => e.setPageIndex(t - 1),
+              onPageChange: (s) => e.setPageIndex(s - 1),
               maxPages: 3,
               previousText: !1,
               nextText: !1,
@@ -81,16 +49,16 @@ function Z({
               showPreviousNext: !0
             }
           ),
-          p && /* @__PURE__ */ r(
-            c,
+          n && /* @__PURE__ */ a(
+            f,
             {
               value: `${e.getState().pagination.pageSize}`,
-              onValueChange: (t) => {
-                e.setPageSize(Number(t));
+              onValueChange: (s) => {
+                e.setPageSize(Number(s));
               },
-              options: i.map((t) => ({
-                value: `${t}`,
-                label: `${t} / page`
+              options: d.map((s) => ({
+                value: `${s}`,
+                label: `${s} / page`
               }))
             }
           )
@@ -100,6 +68,5 @@ function Z({
   );
 }
 export {
-  Z as DataTablePagination
+  v as DataTablePagination
 };
-//# sourceMappingURL=data-table-pagination.js.map