mada-design-system 0.5.13 → 0.7.0

package/index.es48.js

@@ -1,21 +1,21 @@
 import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import h from "./index.es144.js";
-import g from "./index.es145.js";
-import b from "./index.es146.js";
-import x from "./index.es147.js";
-import v from "./index.es148.js";
-import N from "./index.es149.js";
+import h from "./index.es147.js";
+import g from "./index.es148.js";
+import b from "./index.es149.js";
+import x from "./index.es150.js";
+import v from "./index.es151.js";
+import N from "./index.es152.js";
 import "./index.es2.js";
-import w from "./index.es87.js";
-import y from "./index.es150.js";
-import k from "./index.es151.js";
-import F from "./index.es152.js";
-import z from "./index.es153.js";
+import w from "./index.es89.js";
+import y from "./index.es153.js";
+import k from "./index.es154.js";
+import F from "./index.es155.js";
+import z from "./index.es156.js";
 import { Link as p } from "./index.es52.js";
-import { cn as u } from "./index.es86.js";
+import { cn as u } from "./index.es88.js";
 import { ShouldRender as f } from "./index.es15.js";
 import { Button as c } from "./index.es23.js";
-import { strings as i } from "./index.es98.js";
+import { strings as i } from "./index.es100.js";
 const K = ({ colors: t = "default", ...l }) => {
   var o;
   return /* @__PURE__ */ e(

package/index.es49.js

@@ -1,9 +1,9 @@
 import { jsxs as c, Fragment as u, jsx as t } from "react/jsx-runtime";
 import * as l from "react";
-import C from "./index.es116.js";
-import E from "./index.es115.js";
+import C from "./index.es119.js";
+import E from "./index.es118.js";
 import { Button as h } from "./index.es23.js";
-import { cn as g } from "./index.es86.js";
+import { cn as g } from "./index.es88.js";
 function B({ children: v, scrollAmount: p = 200, margin: a = 0, className: b = "", buttonClassName: i = "" }) {
   const [d, S] = l.useState(!1), [f, w] = l.useState(!1), o = l.useRef(null), r = l.useCallback(() => {
     const e = o.current, n = document.dir;

package/index.es5.js

@@ -1,9 +1,9 @@
-import { jsx as a } from "react/jsx-runtime";
-import { Slot as i } from "@radix-ui/react-slot";
-import { forwardRef as p } from "react";
-const o = p(({ as: t, children: n, asChild: r, ...e }, m) => /* @__PURE__ */ a(r ? i : t || "h1", { ref: m, ...e, children: n }));
-o.displayName = "Heading";
-const g = o;
+import { jsx as p } from "react/jsx-runtime";
+import { Slot as s } from "@radix-ui/react-slot";
+import { forwardRef as a } from "react";
+const o = a(({ as: t, children: r, asChild: e, ...m }, n) => /* @__PURE__ */ p(e ? s : t || "span", { ref: n, ...m, children: r }));
+o.displayName = "Text";
+const d = o;
 export {
-  g as default
+  d as default
 };

package/index.es50.js

@@ -1,26 +1,26 @@
 import { jsx as e, jsxs as d } from "react/jsx-runtime";
-import { cva as N } from "./index.es106.js";
+import { cva as N } from "./index.es109.js";
 import { createContext as C, useState as T, useEffect as b, useContext as z } from "react";
-import { useMediaQuery as D } from "./index.es104.js";
-import { THEME as l } from "./index.es154.js";
+import { useMediaQuery as D } from "./index.es105.js";
+import { THEME as l } from "./index.es157.js";
 import "./index.es2.js";
-import { cn as p, formatterTime as u } from "./index.es86.js";
-import k from "./index.es155.js";
-import I from "./index.es128.js";
-import H from "./index.es150.js";
-import A from "./index.es151.js";
-import w from "./index.es152.js";
-import V from "./index.es153.js";
-import { useThemeStore as M } from "./index.es97.js";
-import R from "./index.es156.js";
-import G from "./index.es157.js";
+import { cn as p, formatterTime as u } from "./index.es88.js";
+import k from "./index.es158.js";
+import I from "./index.es139.js";
+import H from "./index.es153.js";
+import A from "./index.es154.js";
+import w from "./index.es155.js";
+import V from "./index.es156.js";
+import { useThemeStore as M } from "./index.es99.js";
+import R from "./index.es159.js";
+import G from "./index.es160.js";
 import { Badge as L } from "./index.es21.js";
-import B from "./index.es158.js";
-import E from "./index.es90.js";
-import F from "./index.es87.js";
+import B from "./index.es161.js";
+import E from "./index.es92.js";
+import F from "./index.es89.js";
 import { ShouldRender as g } from "./index.es15.js";
 import { Button as m } from "./index.es23.js";
-import { strings as s } from "./index.es98.js";
+import { strings as s } from "./index.es100.js";
 const j = N("md:h-space-07    md:px-space-06 px-space-04 md:py-space-01 gap-space-02 py-space-02  [&>svg]:size-[20px] ", {
   variants: {
     colors: {

package/index.es51.js

@@ -1,7 +1,7 @@
 import { jsx as o, jsxs as v, Fragment as P } from "react/jsx-runtime";
 import * as g from "react";
 import * as C from "recharts";
-import { cn as i } from "./index.es86.js";
+import { cn as i } from "./index.es88.js";
 const I = { light: "", dark: ".dark" }, j = g.createContext(null);
 function $() {
   const s = g.useContext(j);

package/index.es52.js

@@ -1,8 +1,8 @@
 import { jsx as u } from "react/jsx-runtime";
 import { Slot as f } from "@radix-ui/react-slot";
-import { cva as p } from "./index.es106.js";
+import { cva as p } from "./index.es109.js";
 import * as m from "react";
-import { cn as x } from "./index.es86.js";
+import { cn as x } from "./index.es88.js";
 const v = p(
   "inline-flex items-center gap-space-02 justify-center transition-colors focus:outline focus:outline-2 focus:outline-offset-1",
   {

package/index.es53.js

@@ -1,13 +1,13 @@
 import { jsx as t, jsxs as i } from "react/jsx-runtime";
-import g from "./index.es159.js";
-import d from "./index.es160.js";
+import g from "./index.es162.js";
+import d from "./index.es163.js";
 import "./index.es2.js";
-import p from "./index.es135.js";
-import u from "./index.es161.js";
-import h from "./index.es162.js";
-import { strings as e } from "./index.es98.js";
+import p from "./index.es136.js";
+import u from "./index.es164.js";
+import h from "./index.es165.js";
+import { strings as e } from "./index.es100.js";
 import { Collapsible as S, CollapsibleTrigger as f, CollapsibleContent as x } from "./index.es27.js";
-import { Stack as r } from "./index.es43.js";
+import { Stack as r } from "./index.es42.js";
 import { Link as D } from "./index.es52.js";
 const A = ({ extension: a = ".gov.sa", linkProps: n, children: o, ...m }) => {
   const s = {

package/index.es54.js

@@ -1,8 +1,8 @@
 import { jsx as o } from "react/jsx-runtime";
 import { Slot as l } from "@radix-ui/react-slot";
-import { cva as g } from "./index.es106.js";
+import { cva as g } from "./index.es109.js";
 import * as f from "react";
-import { cn as t } from "./index.es86.js";
+import { cn as t } from "./index.es88.js";
 const m = g(
   "inline-flex items-center rounded-full gap-space-02 [&>svg]:size-space-05 font-medium text-body-02 justify-center focus:outline-border-black focus:outline focus:outline-2 focus:outline-offset-1 transition-colors  disabled:pointer-events-none disabled:cursor-not-allowed disabled:text-disabled-text-default-disabled disabled:bg-disabled-background-disabled",
   {

package/index.es55.js

@@ -1,7 +1,7 @@
 import { jsxs as s, Fragment as f, jsx as t } from "react/jsx-runtime";
-import { cva as y } from "./index.es106.js";
+import { cva as y } from "./index.es109.js";
 import { forwardRef as g } from "react";
-import { cn as c } from "./index.es86.js";
+import { cn as c } from "./index.es88.js";
 import "./index.es2.js";
 import { ShouldRender as p } from "./index.es15.js";
 const u = y("text-body-02", {

package/index.es56.js

@@ -1,10 +1,10 @@
 import { jsx as c, jsxs as p } from "react/jsx-runtime";
 import { useState as n } from "react";
 import "./index.es2.js";
-import d from "./index.es163.js";
-import y from "./index.es164.js";
-import { Stack as x } from "./index.es43.js";
-import { cn as m } from "./index.es86.js";
+import d from "./index.es166.js";
+import y from "./index.es167.js";
+import { Stack as x } from "./index.es42.js";
+import { cn as m } from "./index.es88.js";
 function B({ max: e = 5, onChange: a, value: l = 0, className: t, ...r }) {
   const [s, i] = n(0);
   return /* @__PURE__ */ c(x, { gap: "none", className: m(t), children: Array.from({ length: e }, (u, o) => /* @__PURE__ */ c(

package/index.es57.js

@@ -1,9 +1,9 @@
 import { jsx as r, jsxs as u } from "react/jsx-runtime";
 import * as a from "react";
-import { cn as i } from "./index.es86.js";
-import { cva as b } from "./index.es106.js";
+import { cn as i } from "./index.es88.js";
+import { cva as b } from "./index.es109.js";
 import { ShouldRender as x } from "./index.es15.js";
-import h from "./index.es165.js";
+import h from "./index.es168.js";
 const f = b("group relative flex shrink-0 items-start justify-start ", {
   variants: {
     variant: {

package/index.es58.js

@@ -1,10 +1,10 @@
 import { jsx as n, jsxs as L } from "react/jsx-runtime";
-import Q from "./index.es166.js";
+import Q from "./index.es169.js";
 import * as t from "react";
 import { Button as D } from "./index.es23.js";
-import U from "./index.es115.js";
-import V from "./index.es116.js";
-import { cn as f } from "./index.es86.js";
+import U from "./index.es118.js";
+import V from "./index.es119.js";
+import { cn as f } from "./index.es88.js";
 const G = t.createContext(null);
 function X() {
   const c = t.useContext(G);

package/index.es59.js

@@ -1,7 +1,7 @@
 import { jsx as r } from "react/jsx-runtime";
 import * as a from "@radix-ui/react-hover-card";
 import * as s from "react";
-import { cn as d } from "./index.es86.js";
+import { cn as d } from "./index.es88.js";
 const v = a.Root, u = a.Trigger, l = s.forwardRef(({ className: t, align: o = "center", variant: e, sideOffset: i = 4, ...n }, p) => /* @__PURE__ */ r(
   a.Content,
   {

package/index.es6.js

@@ -1,9 +1,45 @@
-import { jsx as p } from "react/jsx-runtime";
-import { Slot as s } from "@radix-ui/react-slot";
-import { forwardRef as a } from "react";
-const o = a(({ as: t, children: r, asChild: e, ...m }, n) => /* @__PURE__ */ p(e ? s : t || "span", { ref: n, ...m, children: r }));
-o.displayName = "Text";
-const d = o;
+import { jsx as t, jsxs as s } from "react/jsx-runtime";
+import * as l from "react";
+import { cn as n } from "./index.es88.js";
+import { strings as r } from "./index.es100.js";
+import c from "./index.es118.js";
+import m from "./index.es119.js";
+import d from "./index.es120.js";
+const v = ({ className: e, ...a }) => /* @__PURE__ */ t("nav", { role: "navigation", "aria-label": "pagination", className: n("mx-auto flex w-full justify-center", e), ...a }), p = l.forwardRef(({ className: e, ...a }, i) => /* @__PURE__ */ t("ul", { ref: i, className: n("flex flex-row items-center gap-space-02", e), ...a }));
+p.displayName = "PaginationContent";
+const f = l.forwardRef(({ className: e, ...a }, i) => /* @__PURE__ */ t("li", { ref: i, className: n("", e), ...a }));
+f.displayName = "PaginationItem";
+const o = ({ className: e, isActive: a, ...i }) => /* @__PURE__ */ t(
+  "button",
+  {
+    "aria-current": a ? "page" : void 0,
+    className: n(
+      "relative flex h-space-05 min-w-space-05 items-center justify-center gap-space-01 rounded text-body-01 text-text-default hover:bg-background-neutral-100 disabled:text-disabled-text-default-disabled disabled:pointer-events-none ",
+      `${a && "after:absolute after:bottom-0 after:h-[3px] after:w-full after:rounded-full after:bg-background-primary"}`,
+      e
+    ),
+    ...i
+  }
+);
+o.displayName = "PaginationLink";
+const g = ({ className: e, hasText: a, ...i }) => /* @__PURE__ */ s(o, { "aria-label": "Go to previous page", size: "default", className: n("px-space-01", e), ...i, children: [
+  /* @__PURE__ */ t(c, { className: "h-space-05 w-space-05 ltr:rotate-180" }),
+  a && /* @__PURE__ */ t("span", { className: "hidden sm:inline-block", children: r.Shared.previous })
+] });
+g.displayName = "PaginationPrevious";
+const w = ({ className: e, hasText: a, ...i }) => /* @__PURE__ */ s(o, { "aria-label": "Go to next page", size: "default", className: n("px-space-01", e), ...i, children: [
+  a && /* @__PURE__ */ t("span", { className: "hidden sm:inline-block", children: r.Shared.next }),
+  /* @__PURE__ */ t(m, { className: "h-space-05 w-space-05 ltr:rotate-180" })
+] }), y = ({ className: e, ...a }) => /* @__PURE__ */ s("span", { "aria-hidden": !0, className: n("flex h-9 w-9 items-center justify-center", e), ...a, children: [
+  /* @__PURE__ */ t(d, { className: "h-4 w-4" }),
+  /* @__PURE__ */ t("span", { className: "sr-only", children: r.Shared.morePages })
+] });
 export {
-  d as default
+  v as Pagination,
+  p as PaginationContent,
+  y as PaginationEllipsis,
+  f as PaginationItem,
+  o as PaginationLink,
+  w as PaginationNext,
+  g as PaginationPrevious
 };

package/index.es60.js

@@ -1,25 +1,33 @@
 import { jsx as t } from "react/jsx-runtime";
-import * as o from "@radix-ui/react-popover";
-import * as s from "react";
-import { cn as n } from "./index.es86.js";
-const f = o.Root, c = o.Trigger, v = o.Arrow, g = o.Close, m = s.forwardRef(({ className: e, align: a = "center", sideOffset: r = 4, ...d }, i) => /* @__PURE__ */ t(o.Portal, { children: /* @__PURE__ */ t(
-  o.Content,
-  {
-    ref: i,
-    align: a,
-    sideOffset: r,
-    className: n(
-      "z-50 rounded-2 border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      e
-    ),
-    ...d
-  }
-) }));
-m.displayName = o.Content.displayName;
+import * as e from "@radix-ui/react-popover";
+import { cn as d } from "./index.es88.js";
+function s({ ...o }) {
+  return /* @__PURE__ */ t(e.Root, { "data-slot": "popover", ...o });
+}
+function m({ ...o }) {
+  return /* @__PURE__ */ t(e.Trigger, { "data-slot": "popover-trigger", ...o });
+}
+function l({ className: o, align: r = "center", sideOffset: a = 4, ...n }) {
+  return /* @__PURE__ */ t(e.Portal, { children: /* @__PURE__ */ t(
+    e.Content,
+    {
+      "data-slot": "popover-content",
+      align: r,
+      sideOffset: a,
+      className: d(
+        "z-50 rounded-2 border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        o
+      ),
+      ...n
+    }
+  ) });
+}
+function f({ ...o }) {
+  return /* @__PURE__ */ t(e.Anchor, { "data-slot": "popover-anchor", ...o });
+}
 export {
-  f as Popover,
-  v as PopoverArrow,
-  g as PopoverClose,
-  m as PopoverContent,
-  c as PopoverTrigger
+  s as Popover,
+  f as PopoverAnchor,
+  l as PopoverContent,
+  m as PopoverTrigger
 };

package/index.es61.js

@@ -1,7 +1,7 @@
 import { jsxs as f, jsx as r } from "react/jsx-runtime";
 import * as e from "@radix-ui/react-progress";
 import * as n from "react";
-import { cn as s } from "./index.es86.js";
+import { cn as s } from "./index.es88.js";
 const c = n.forwardRef(
   ({ className: d, value: a, colors: o = "bg-primary", rounded: t, icon: i, ...l }, m) => /* @__PURE__ */ f("div", { className: "relative w-full", children: [
     /* @__PURE__ */ r(

package/index.es62.js

@@ -1,9 +1,9 @@
 import { jsx as e, jsxs as p } from "react/jsx-runtime";
 import * as r from "@radix-ui/react-radio-group";
 import * as a from "react";
-import { cva as h } from "./index.es106.js";
-import { cn as s } from "./index.es86.js";
-import m from "./index.es133.js";
+import { cva as h } from "./index.es109.js";
+import { cn as s } from "./index.es88.js";
+import m from "./index.es134.js";
 const u = h(
   "flex aspect-square   rounded-full enabled:active:data-[state=unchecked]:bg-control-pressed border border-control-border enabled:hover:bg-control-ripple-effect focus:ring-2 focus:ring-border-black focus:ring-offset-2 disabled:cursor-not-allowed disabled:border-border-disabled disabled:data-[state=checked]:text-control-disabled",
   {

package/index.es63.js

@@ -1,7 +1,7 @@
 import { jsxs as i, jsx as e } from "react/jsx-runtime";
 import * as r from "@radix-ui/react-scroll-area";
 import * as t from "react";
-import { cn as s } from "./index.es86.js";
+import { cn as s } from "./index.es88.js";
 const m = t.forwardRef(({ className: o, children: l, ...a }, c) => /* @__PURE__ */ i(r.Root, { ref: c, className: s("relative overflow-hidden", o), ...a, children: [
   /* @__PURE__ */ e(r.Viewport, { className: "h-full w-full rounded-[inherit]", children: l }),
   /* @__PURE__ */ e(d, {}),

package/index.es64.js

@@ -1,12 +1,12 @@
 import { jsxs as u, jsx as e } from "react/jsx-runtime";
 import B, { useState as g, useRef as w, useEffect as m } from "react";
-import { debounce as v, cn as R } from "./index.es86.js";
-import { strings as d } from "./index.es98.js";
+import { debounce as v, cn as R } from "./index.es88.js";
+import { strings as d } from "./index.es100.js";
 import { Button as j } from "./index.es23.js";
-import { Input as z } from "./index.es38.js";
-import f from "./index.es126.js";
-import { Stack as A } from "./index.es43.js";
-import D from "./index.es109.js";
+import { Input as z } from "./index.es37.js";
+import f from "./index.es129.js";
+import { Stack as A } from "./index.es42.js";
+import D from "./index.es112.js";
 const E = B.forwardRef(
   ({ placeholder: h = "Search...", value: a = "", type: t, validationMessage: s, onSearch: n, disabled: x = !1, debounceTime: i = 600, className: N = "", ...b }, C) => {
     const [r, c] = g(a), l = w();

package/index.es65.js

@@ -1,12 +1,12 @@
 import { jsx as a, jsxs as n } from "react/jsx-runtime";
 import * as d from "react";
 import * as e from "@radix-ui/react-select";
-import { cva as u } from "./index.es106.js";
-import { cn as s } from "./index.es86.js";
-import b from "./index.es102.js";
-import h from "./index.es167.js";
-import x from "./index.es135.js";
-import g from "./index.es165.js";
+import { cva as u } from "./index.es109.js";
+import { cn as s } from "./index.es88.js";
+import b from "./index.es103.js";
+import h from "./index.es170.js";
+import x from "./index.es136.js";
+import g from "./index.es168.js";
 const w = u(
   ` placeholder:text-form-field-text-placeholder data-[placeholder]:text-form-field-text-placeholder  text-form-field-text-filled after:bg-form-field-border-pressed group relative
     flex w-full items-center justify-between gap-space-01 whitespace-nowrap overflow-hidden

package/index.es66.js

@@ -1,7 +1,7 @@
 import { jsx as e } from "react/jsx-runtime";
 import * as o from "@radix-ui/react-separator";
 import * as i from "react";
-import { cn as l } from "./index.es86.js";
+import { cn as l } from "./index.es88.js";
 const s = i.forwardRef(
   ({ className: a, orientation: r = "horizontal", decorative: t = !0, ...m }, p) => /* @__PURE__ */ e(
     o.Root,

package/index.es67.js

@@ -1,17 +1,17 @@
 import { jsx as t, jsxs as p } from "react/jsx-runtime";
 import * as s from "@radix-ui/react-dialog";
-import { cva as C } from "./index.es106.js";
+import { cva as C } from "./index.es109.js";
 import l from "react";
-import { clsx as S } from "./index.es130.js";
-import { useMediaQuery as R } from "./index.es104.js";
-import { create as z } from "./index.es168.js";
-import { cn as r } from "./index.es86.js";
-import k from "./index.es87.js";
+import { clsx as S } from "./index.es131.js";
+import { useMediaQuery as R } from "./index.es105.js";
+import { create as z } from "./index.es171.js";
+import { cn as r } from "./index.es88.js";
+import k from "./index.es89.js";
 import { ShouldRender as h } from "./index.es15.js";
 import { Button as b } from "./index.es23.js";
-import T from "./index.es169.js";
-import D from "./index.es170.js";
-import F from "./index.es109.js";
+import T from "./index.es172.js";
+import D from "./index.es173.js";
+import F from "./index.es112.js";
 const x = z((a) => ({
   isCenter: !1,
   setIsCenter: (e) => a((o) => ({ isCenter: e ?? !o.isCenter }))

package/index.es68.js

@@ -1,16 +1,16 @@
 import { jsx as r, jsxs as S } from "react/jsx-runtime";
 import { Slot as h } from "@radix-ui/react-slot";
-import { cva as k } from "./index.es106.js";
+import { cva as k } from "./index.es109.js";
 import * as i from "react";
-import { useIsMobile as z } from "./index.es171.js";
-import { cn as o } from "./index.es86.js";
+import { useIsMobile as z } from "./index.es174.js";
+import { cn as o } from "./index.es88.js";
 import { Button as I } from "./index.es23.js";
-import { Input as B } from "./index.es38.js";
+import { Input as B } from "./index.es37.js";
 import { Separator as E } from "./index.es66.js";
 import { Sheet as T, SheetContent as A } from "./index.es67.js";
 import { Skeleton as M } from "./index.es69.js";
 import { TooltipProvider as O, Tooltip as G, TooltipTrigger as D, TooltipContent as K } from "./index.es79.js";
-import j from "./index.es172.js";
+import j from "./index.es175.js";
 const L = "sidebar:state", P = 60 * 60 * 24 * 7, V = "b", R = i.createContext(null);
 function y() {
   const a = i.useContext(R);

package/index.es69.js

@@ -1,5 +1,5 @@
 import { jsx as n } from "react/jsx-runtime";
-import { cn as r } from "./index.es86.js";
+import { cn as r } from "./index.es88.js";
 function i({ className: e, ...o }) {
   return /* @__PURE__ */ n("div", { className: r("bg-skeleton animate-pulse rounded-md", e), ...o });
 }