mada-design-system 0.5.10 → 0.5.12

package/index.es4.js

@@ -1,113 +1,171 @@
-import { jsx as n, jsxs as u, Fragment as E } from "react/jsx-runtime";
-import { useReactTable as Q, flexRender as R } from "./index.es101.js";
-import { Skeleton as D } from "./index.es68.js";
-import { Table as V, TableHeader as W, TableRow as h, TableHead as q, TableBody as G, TableCell as T } from "./index.es71.js";
-import { clsx as p } from "./index.es102.js";
-import I, { useState as J, useEffect as y } from "react";
-import { useMediaQuery as K } from "./index.es103.js";
-import { PaginationDescription as O, LinesPerPage as U, Pagination as X } from "./index.es12.js";
-import { getCoreRowModel as Y, getPaginationRowModel as Z } from "./index.es104.js";
-function me({
-  columns: i,
-  data: d,
-  loading: m,
-  NoDataComponent: j,
-  itemsPerPage: f,
-  hasPagination: v = !0,
-  onClickRow: g,
-  isFirstRowSelected: r = !1,
+import { jsx as c, jsxs as S, Fragment as U } from "react/jsx-runtime";
+import { useReactTable as W, flexRender as z } from "./index.es102.js";
+import { Checkbox as j } from "./index.es26.js";
+import { Skeleton as L } from "./index.es69.js";
+import { Table as X, TableHeader as Y, TableRow as C, TableHead as Z, TableBody as $, TableCell as A } from "./index.es72.js";
+import F, { useState as h, useEffect as B } from "react";
+import { useMediaQuery as ee } from "./index.es103.js";
+import { cn as d } from "./index.es86.js";
+import { PaginationDescription as ae, LinesPerPage as le, Pagination as oe } from "./index.es13.js";
+import { getCoreRowModel as ce, getPaginationRowModel as ne } from "./index.es104.js";
+function Ne({
+  columns: f,
+  data: m,
+  loading: g,
+  NoDataComponent: _,
+  itemsPerPage: b,
+  hasPagination: E = !0,
+  onClickRow: r,
+  isFirstRowSelected: w = !1,
+  enableRowSelection: p,
+  enableMultiRowSelection: N,
+  rowSelection: Q,
+  onRowSelectionChange: V,
+  theme: a,
   ...e
 }) {
-  var w;
-  const L = I.useMemo(() => m ? Array(f || 10).fill({}) : d, [m, f, d]), [c, z] = J(f || 10), F = I.useMemo(
-    () => m ? i.map((a) => ({
-      ...a,
-      cell: () => /* @__PURE__ */ n(D, { className: "h-8 w-full" })
-    })) : i,
-    [m, i]
-  ), t = Q({
-    data: L,
-    columns: F,
-    getCoreRowModel: Y(),
-    getPaginationRowModel: Z()
-  }), H = K("(min-width: 801px)"), s = t.getState().pagination.pageIndex + 1, _ = (a) => {
-    t.resetRowSelection(), a.toggleSelected(!a.getIsSelected()), g && g(a);
+  var P, R, I, M, y;
+  const q = F.useMemo(() => g ? Array(b || 10).fill({}) : m, [g, b, m]), [u, G] = h(b || 10), J = F.useMemo(() => {
+    let l = g ? f.map((s) => ({
+      ...s,
+      cell: () => /* @__PURE__ */ c(L, { className: "h-8 w-full" })
+    })) : f;
+    return p && !g && (l = [{
+      id: "select",
+      header: N ? ({ table: n }) => {
+        var i;
+        return /* @__PURE__ */ c(
+          j,
+          {
+            checked: n.getIsAllPageRowsSelected(),
+            onCheckedChange: (t) => n.toggleAllPageRowsSelected(!!t),
+            "aria-label": "Select all",
+            className: d((i = a == null ? void 0 : a.headerSelect) == null ? void 0 : i.className),
+            size: "sm",
+            colors: "primary"
+          }
+        );
+      } : (
+        // to preserve the place of the checkbox when multi selection is not enabled
+        () => /* @__PURE__ */ c("div", { role: "checkbox", className: "w-[48px]", "aria-hidden": "true" })
+      ),
+      cell: ({ row: n }) => {
+        var i;
+        return /* @__PURE__ */ c(
+          j,
+          {
+            checked: n.getIsSelected(),
+            onCheckedChange: (t) => n.toggleSelected(!!t),
+            "aria-label": "Select row",
+            className: d((i = a == null ? void 0 : a.bodySelect) == null ? void 0 : i.className),
+            size: "sm",
+            colors: "primary"
+          }
+        );
+      },
+      enableSorting: !1,
+      enableHiding: !1
+    }, ...l]), l;
+  }, [g, f, p, N]), o = W({
+    data: q,
+    columns: J,
+    getCoreRowModel: ce(),
+    getPaginationRowModel: ne(),
+    onRowSelectionChange: V,
+    state: {
+      rowSelection: Q || {}
+    },
+    enableRowSelection: p,
+    enableMultiRowSelection: N,
+    getRowId: (l) => l.id
+    // Provide a way to identify rows
+  }), K = ee("(min-width: 801px)"), x = o.getState().pagination.pageIndex + 1, O = (l) => {
+    r && (p ? N ? l.toggleSelected(!l.getIsSelected()) : (o.resetRowSelection(), l.toggleSelected(!0)) : (o.resetRowSelection(), l.toggleSelected(!l.getIsSelected())), r(l));
   };
-  y(() => {
-    const a = t.getRowModel().rows;
-    if (!r || !a.length || !d.length)
+  return B(() => {
+    const l = o.getRowModel().rows;
+    if (!w || !l.length || !m.length)
       return;
-    const o = a[0];
-    t.resetRowSelection(), o.toggleSelected(!0), g && g(o);
-  }, [r, t, d]), y(() => {
-    t.setPageSize(c);
-  }, [t, c]);
-  const A = i == null ? void 0 : i.some((a) => {
-    var o;
-    return (a == null ? void 0 : a.meta) && ((o = a == null ? void 0 : a.meta) == null ? void 0 : o.className);
-  });
-  return H ? /* @__PURE__ */ u(E, { children: [
-    /* @__PURE__ */ n("div", { className: "overflow-hidden rounded-t-3", children: /* @__PURE__ */ u(V, { className: p(!A && "w-full table-fixed"), children: [
-      /* @__PURE__ */ n(W, { children: t.getHeaderGroups().map((a) => /* @__PURE__ */ n(h, { children: a.headers.map((o) => {
-        var l;
-        return /* @__PURE__ */ n(q, { colSpan: ((l = o.column.columnDef.meta) == null ? void 0 : l.headerColSpan) ?? 1, children: o.isPlaceholder ? null : R(o.column.columnDef.header, o.getContext()) }, o.id);
-      }) }, a.id)) }),
-      /* @__PURE__ */ n(G, { children: (w = t.getRowModel().rows) != null && w.length ? t.getRowModel().rows.map((a, o) => /* @__PURE__ */ n(
-        h,
-        {
-          "data-state": a.getIsSelected() && "selected",
-          onClick: () => _(a),
-          className: p(g && "cursor-pointer"),
-          children: a.getVisibleCells().map((l) => {
-            var x, S, P, C, N, b, M;
-            const B = R(l.column.columnDef.cell, l.getContext());
-            return /* @__PURE__ */ n(
-              T,
-              {
-                colSpan: ((x = l.column.columnDef.meta) == null ? void 0 : x.cellColSpan) ?? 1,
-                className: p((C = (P = (S = l == null ? void 0 : l.column) == null ? void 0 : S.columnDef) == null ? void 0 : P.meta) == null ? void 0 : C.className),
-                "data-title": (N = l.column.columnDef.header) == null ? void 0 : N.toString(),
-                isLast: ((M = (b = t == null ? void 0 : t.getRowModel()) == null ? void 0 : b.rows) == null ? void 0 : M.length) - 1 === o,
-                children: B
-              },
-              l.id
-            );
-          })
-        },
-        a.id
-      )) : /* @__PURE__ */ n(h, { children: /* @__PURE__ */ n(T, { colSpan: i.length, className: "h-24 text-center", children: j }) }) })
+    const s = l[0];
+    o.resetRowSelection(), s.toggleSelected(!0), r && r(s);
+  }, [w, o, m]), B(() => {
+    o.setPageSize(u);
+  }, [o, u]), K ? /* @__PURE__ */ S(U, { children: [
+    /* @__PURE__ */ c("div", { className: "overflow-hidden rounded-t-3", children: /* @__PURE__ */ S(X, { className: d("w-full table-fixed", (P = a == null ? void 0 : a.table) == null ? void 0 : P.className), children: [
+      /* @__PURE__ */ c(Y, { className: d((R = a == null ? void 0 : a.tableHeader) == null ? void 0 : R.className), children: o.getHeaderGroups().map((l) => {
+        var s;
+        return /* @__PURE__ */ c(C, { className: d((s = a == null ? void 0 : a.tableRow) == null ? void 0 : s.className), children: l.headers.map((n) => {
+          var i, t;
+          return /* @__PURE__ */ c(
+            Z,
+            {
+              colSpan: ((i = n.column.columnDef.meta) == null ? void 0 : i.headerColSpan) ?? 1,
+              className: d((t = a == null ? void 0 : a.tableHead) == null ? void 0 : t.className),
+              children: n.isPlaceholder ? null : z(n.column.columnDef.header, n.getContext())
+            },
+            n.id
+          );
+        }) }, l.id);
+      }) }),
+      /* @__PURE__ */ c($, { className: d((I = a == null ? void 0 : a.tableBody) == null ? void 0 : I.className), children: (M = o.getRowModel().rows) != null && M.length ? o.getRowModel().rows.map((l, s) => {
+        var n;
+        return /* @__PURE__ */ c(
+          C,
+          {
+            "data-state": l.getIsSelected() && "selected",
+            onClick: () => O(l),
+            className: d(r && "cursor-pointer", (n = a == null ? void 0 : a.tableRow) == null ? void 0 : n.className),
+            children: l.getVisibleCells().map((i) => {
+              var T, D, H, k, v;
+              const t = z(i.column.columnDef.cell, i.getContext());
+              return /* @__PURE__ */ c(
+                A,
+                {
+                  colSpan: ((T = i.column.columnDef.meta) == null ? void 0 : T.cellColSpan) ?? 1,
+                  className: (D = a == null ? void 0 : a.tableCell) == null ? void 0 : D.className,
+                  "data-title": (H = i.column.columnDef.header) == null ? void 0 : H.toString(),
+                  isLast: ((v = (k = o == null ? void 0 : o.getRowModel()) == null ? void 0 : k.rows) == null ? void 0 : v.length) - 1 === s,
+                  children: t
+                },
+                i.id
+              );
+            })
+          },
+          l.id
+        );
+      }) : /* @__PURE__ */ c(C, { className: (y = a == null ? void 0 : a.tableRow) == null ? void 0 : y.className, children: /* @__PURE__ */ c(A, { colSpan: f.length, className: "h-24 text-center", children: _ }) }) })
     ] }) }),
-    !!t.getFilteredRowModel().rows.length && v && /* @__PURE__ */ u("div", { className: "flex items-center justify-end  px-space-04 py-space-02", children: [
-      m ? /* @__PURE__ */ n(D, { className: "ml-auto h-[20px] w-space-12" }) : /* @__PURE__ */ n(
-        O,
+    !!o.getFilteredRowModel().rows.length && E && /* @__PURE__ */ S("div", { className: "flex items-center justify-end  px-space-04 py-space-02", children: [
+      g ? /* @__PURE__ */ c(L, { className: "me-auto h-[20px] w-space-12" }) : /* @__PURE__ */ c(
+        ae,
         {
-          currentPage: (e == null ? void 0 : e.pageNumber) ?? s,
-          limit: c,
-          totalCount: (e == null ? void 0 : e.totalItems) ?? t.getFilteredRowModel().rows.length
+          currentPage: (e == null ? void 0 : e.pageNumber) ?? x,
+          limit: u,
+          totalCount: (e == null ? void 0 : e.totalItems) ?? o.getFilteredRowModel().rows.length
         }
       ),
-      /* @__PURE__ */ u("div", { className: "flex items-center gap-x-space-03", children: [
-        /* @__PURE__ */ n(
-          U,
+      /* @__PURE__ */ S("div", { className: "flex items-center gap-x-space-03", children: [
+        /* @__PURE__ */ c(
+          le,
           {
-            value: c,
-            onChange: (a) => {
-              e != null && e.onPageChange && (e == null || e.onPageChange(1)), z(+a), e != null && e.setLimit && (e == null || e.setLimit(+a));
+            value: u,
+            onChange: (l) => {
+              e != null && e.onPageChange && (e == null || e.onPageChange(1)), G(+l), e != null && e.setLimit && (e == null || e.setLimit(+l));
             }
           }
         ),
-        /* @__PURE__ */ n(
-          X,
+        /* @__PURE__ */ c(
+          oe,
           {
             withoutText: !0,
             className: "justify-center",
-            totalItems: e != null && e.totalItems ? e == null ? void 0 : e.totalItems : t.getFilteredRowModel().rows.length ?? 0,
-            selectedPage: (e == null ? void 0 : e.pageNumber) ?? s,
-            itemsPerPage: Number(c),
-            onPageChange: (a) => {
+            totalItems: e != null && e.totalItems ? e == null ? void 0 : e.totalItems : o.getFilteredRowModel().rows.length ?? 0,
+            selectedPage: (e == null ? void 0 : e.pageNumber) ?? x,
+            itemsPerPage: Number(u),
+            onPageChange: (l) => {
               if (e != null && e.onPageChange)
-                return e == null ? void 0 : e.onPageChange(a);
-              t.setPageIndex(a - 1);
+                return e == null ? void 0 : e.onPageChange(l);
+              o.setPageIndex(l - 1);
             }
           }
         )
@@ -116,6 +174,6 @@ function me({
   ] }) : null;
 }
 export {
-  me as DataTable,
-  me as default
+  Ne as DataTable,
+  Ne as default
 };

package/index.es40.js

@@ -1,247 +1,20 @@
-import { jsx as l } from "react/jsx-runtime";
-import { cva as n } from "./index.es105.js";
-import { clsx as x } from "./index.es102.js";
-const y = n("grid", {
+import { jsx as s } from "react/jsx-runtime";
+import * as a from "@radix-ui/react-label";
+import { cva as i } from "./index.es105.js";
+import * as m from "react";
+import { cn as l } from "./index.es86.js";
+const d = i("peer-disabled:cursor-not-allowed peer-disabled:opacity-70", {
   variants: {
-    cols: {
-      1: "grid-cols-1",
-      2: "grid-cols-2",
-      3: "grid-cols-3",
-      4: "grid-cols-4",
-      5: "grid-cols-5",
-      6: "grid-cols-6",
-      7: "grid-cols-7",
-      8: "grid-cols-8",
-      9: "grid-cols-9",
-      10: "grid-cols-10",
-      11: "grid-cols-11",
-      12: "grid-cols-12"
-    },
-    gap: {
-      none: "",
-      1: "gap-space-01",
-      2: "gap-space-02",
-      3: "gap-space-03",
-      4: "gap-space-04",
-      5: "gap-space-05",
-      6: "gap-space-06",
-      7: "gap-space-07",
-      8: "gap-space-08",
-      9: "gap-space-09",
-      10: "gap-space-10",
-      11: "gap-space-11",
-      12: "gap-space-12"
-    },
-    gapX: {
-      none: "",
-      1: "gap-x-space-01",
-      2: "gap-x-space-02",
-      3: "gap-x-space-03",
-      4: "gap-x-space-04",
-      5: "gap-x-space-05",
-      6: "gap-x-space-06",
-      7: "gap-x-space-07",
-      8: "gap-x-space-08",
-      9: "gap-x-space-09",
-      10: "gap-x-space-10",
-      11: "gap-x-space-11",
-      12: "gap-x-space-12"
-    },
-    gapY: {
-      none: "",
-      1: "gap-y-space-01",
-      2: "gap-y-space-02",
-      3: "gap-y-space-03",
-      4: "gap-y-space-04",
-      5: "gap-y-space-05",
-      6: "gap-y-space-06",
-      7: "gap-y-space-07",
-      8: "gap-y-space-08",
-      9: "gap-y-space-09",
-      10: "gap-y-space-10",
-      11: "gap-y-space-11",
-      12: "gap-y-space-12"
-    },
-    autoFlow: {
-      row: "grid-flow-row",
-      col: "grid-flow-col",
-      dense: "grid-flow-dense",
-      rowDense: "grid-flow-row-dense",
-      colDense: "grid-flow-col-dense"
-    },
-    alignItems: {
-      start: "items-start",
-      center: "items-center",
-      end: "items-end",
-      stretch: "items-stretch"
-    },
-    justifyItems: {
-      start: "justify-items-start",
-      center: "justify-items-center",
-      end: "justify-items-end",
-      stretch: "justify-items-stretch"
-    },
-    alignContent: {
-      start: "content-start",
-      center: "content-center",
-      end: "content-end",
-      between: "content-between",
-      around: "content-around",
-      evenly: "content-evenly"
-    },
-    justifyContent: {
-      start: "justify-start",
-      center: "justify-center",
-      end: "justify-end",
-      between: "justify-between",
-      around: "justify-around",
-      evenly: "justify-evenly"
+    size: {
+      default: "text-body-02",
+      sm: "text-body-01"
     }
   },
   defaultVariants: {
-    cols: 12,
-    gap: 1,
-    gapX: "none",
-    gapY: "none",
-    autoFlow: "row",
-    alignItems: "stretch",
-    justifyItems: "stretch",
-    alignContent: "start",
-    justifyContent: "start"
+    size: "sm"
   }
-}), b = ({
-  cols: s,
-  gap: a,
-  gapX: p,
-  gapY: c,
-  autoFlow: e,
-  alignItems: o,
-  justifyItems: t,
-  alignContent: g,
-  justifyContent: r,
-  className: i,
-  children: d,
-  ...m
-}) => /* @__PURE__ */ l(
-  "div",
-  {
-    className: y({
-      cols: s,
-      gap: a,
-      gapX: p,
-      gapY: c,
-      autoFlow: e,
-      alignItems: o,
-      justifyItems: t,
-      alignContent: g,
-      justifyContent: r,
-      className: i
-    }),
-    ...m,
-    children: d
-  }
-), f = n("", {
-  variants: {
-    base: {
-      1: "col-span-1",
-      2: "col-span-2",
-      3: "col-span-3",
-      4: "col-span-4",
-      5: "col-span-5",
-      6: "col-span-6",
-      7: "col-span-7",
-      8: "col-span-8",
-      9: "col-span-9",
-      10: "col-span-10",
-      11: "col-span-11",
-      12: "col-span-12"
-    },
-    sm: {
-      1: "sm:col-span-1",
-      2: "sm:col-span-2",
-      3: "sm:col-span-3",
-      4: "sm:col-span-4",
-      5: "sm:col-span-5",
-      6: "sm:col-span-6",
-      7: "sm:col-span-7",
-      8: "sm:col-span-8",
-      9: "sm:col-span-9",
-      10: "sm:col-span-10",
-      11: "sm:col-span-11",
-      12: "sm:col-span-12"
-    },
-    md: {
-      1: "md:col-span-1",
-      2: "md:col-span-2",
-      3: "md:col-span-3",
-      4: "md:col-span-4",
-      5: "md:col-span-5",
-      6: "md:col-span-6",
-      7: "md:col-span-7",
-      8: "md:col-span-8",
-      9: "md:col-span-9",
-      10: "md:col-span-10",
-      11: "md:col-span-11",
-      12: "md:col-span-12"
-    },
-    lg: {
-      1: "lg:col-span-1",
-      2: "lg:col-span-2",
-      3: "lg:col-span-3",
-      4: "lg:col-span-4",
-      5: "lg:col-span-5",
-      6: "lg:col-span-6",
-      7: "lg:col-span-7",
-      8: "lg:col-span-8",
-      9: "lg:col-span-9",
-      10: "lg:col-span-10",
-      11: "lg:col-span-11",
-      12: "lg:col-span-12"
-    },
-    xl: {
-      1: "xl:col-span-1",
-      2: "xl:col-span-2",
-      3: "xl:col-span-3",
-      4: "xl:col-span-4",
-      5: "xl:col-span-5",
-      6: "xl:col-span-6",
-      7: "xl:col-span-7",
-      8: "xl:col-span-8",
-      9: "xl:col-span-9",
-      10: "xl:col-span-10",
-      11: "xl:col-span-11",
-      12: "xl:col-span-12"
-    },
-    "2xl": {
-      1: "2xl:col-span-1",
-      2: "2xl:col-span-2",
-      3: "2xl:col-span-3",
-      4: "2xl:col-span-4",
-      5: "2xl:col-span-5",
-      6: "2xl:col-span-6",
-      7: "2xl:col-span-7",
-      8: "2xl:col-span-8",
-      9: "2xl:col-span-9",
-      10: "2xl:col-span-10",
-      11: "2xl:col-span-11",
-      12: "2xl:col-span-12"
-    }
-  },
-  defaultVariants: {
-    base: 1
-  }
-}), v = ({ columns: s, children: a, className: p, ...c }) => /* @__PURE__ */ l(
-  "div",
-  {
-    className: x(
-      f(typeof s == "number" ? { base: s } : typeof s == "object" && s !== null ? s : {}),
-      p
-    ),
-    ...c,
-    children: a
-  }
-);
+}), p = m.forwardRef(({ className: o, size: e, ...t }, r) => /* @__PURE__ */ s(a.Root, { ref: r, className: l(d({ size: e }), o), ...t }));
+p.displayName = a.Root.displayName;
 export {
-  b as Grid,
-  v as GridItem
+  p as Label
 };

package/index.es404.js

@@ -1,4 +1,4 @@
-import t from "./index.es337.js";
+import t from "./index.es335.js";
 export {
   t as default
 };

package/index.es405.js

@@ -2,13 +2,13 @@ import G from "./index.es196.js";
 import U from "./index.es197.js";
 import * as e from "react";
 import _ from "./index.es198.js";
-import { clsx as c } from "./index.es102.js";
+import { clsx as c } from "./index.es128.js";
 import j from "./index.es210.js";
 import F from "./index.es219.js";
 import J from "./index.es428.js";
 import i from "./index.es407.js";
 import { jsx as k } from "react/jsx-runtime";
-import { keyframes as E } from "./index.es393.js";
+import { keyframes as E } from "./index.es387.js";
 import Q from "./index.es252.js";
 const Z = ["center", "classes", "className"];
 let y = (r) => r, V, D, K, S;

package/index.es408.js

@@ -2,12 +2,12 @@ import x from "./index.es196.js";
 import z from "./index.es197.js";
 import * as $ from "react";
 import o from "./index.es198.js";
-import { clsx as T } from "./index.es102.js";
+import { clsx as T } from "./index.es128.js";
 import b from "./index.es219.js";
 import w from "./index.es210.js";
 import { getSvgIconUtilityClass as C } from "./index.es430.js";
 import { jsxs as R, jsx as I } from "react/jsx-runtime";
-import g from "./index.es337.js";
+import g from "./index.es335.js";
 import O from "./index.es218.js";
 const B = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"], N = (e) => {
   const {