mada-design-system 0.5.10 → 0.5.12

package/index.es14.js

@@ -1,5 +1,43 @@
-const r = ({ other: e, children: l, shouldRender: n }) => n ? l : e ?? null;
+import { jsx as r, jsxs as d } from "react/jsx-runtime";
+import a from "react";
+import { useMediaQuery as l } from "./index.es103.js";
+import { cn as m } from "./index.es86.js";
+import { Button as n } from "./index.es23.js";
+import { Sheet as i, SheetTrigger as c, SheetContent as p, SheetHeader as f, SheetClose as h, SheetFooter as u } from "./index.es67.js";
+import S from "./index.es108.js";
+const T = i, b = a.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(c, { asChild: !0, children: /* @__PURE__ */ r(n, { ref: t, colors: "primary", className: m("flex items-center gap-space-02", e), ...o }) }));
+b.displayName = "SheetFormTrigger";
+const x = a.forwardRef(({ className: e, ...o }, t) => {
+  const s = l("(min-width: 768px)");
+  return /* @__PURE__ */ r(
+    p,
+    {
+      ref: t,
+      className: m(
+        "flex flex-col rounded-tl-4 rounded-tr-4 bg-card p-0 data-[side=bottom]:max-md:h-[93%] sm:max-w-[60rem] md:rounded-tl-none md:rounded-tr-none",
+        e
+      ),
+      side: s ? "left" : "bottom",
+      "data-side": s ? "left" : "bottom",
+      ...o
+    }
+  );
+});
+x.displayName = "SheetFormContent";
+const F = ({ className: e, title: o, ...t }) => /* @__PURE__ */ d(f, { className: m("flex flex-row items-center justify-between border-b border-input px-space-05 py-space-04", e), ...t, children: [
+  /* @__PURE__ */ r("h1", { className: "text-subtitle-02 font-bold", children: o }),
+  /* @__PURE__ */ r(h, { children: /* @__PURE__ */ r(S, {}) })
+] });
+F.displayName = "SheetFormHeader";
+const g = ({ className: e, title: o, ...t }) => /* @__PURE__ */ r(u, { className: m("absolute bottom-0 left-0 mt-auto w-full bg-background p-space-05", e), ...t });
+g.displayName = "SheetFormFooter";
+const y = a.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r("div", { ref: t, className: m("mb-space-11 overflow-auto p-space-05 text-foreground", e), ...o }));
+y.displayName = "SheetFormBody";
 export {
-  r as ShouldRender,
-  r as default
+  T as SheetForm,
+  y as SheetFormBody,
+  x as SheetFormContent,
+  g as SheetFormFooter,
+  F as SheetFormHeader,
+  b as SheetFormTrigger
 };

package/index.es140.js

@@ -1,4 +1,4 @@
-import L from "./index.es193.js";
+import L from "./index.es182.js";
 const C = L("HighlightOff", [
   [
     "path",

package/index.es141.js

@@ -1,4 +1,4 @@
-import t from "./index.es193.js";
+import t from "./index.es182.js";
 const r = t("FilterAlt", [
   [
     "path",

package/index.es148.js

@@ -1,4 +1,4 @@
-import C from "./index.es193.js";
+import C from "./index.es182.js";
 const t = C("Visibility", [
   [
     "path",

package/index.es149.js

@@ -1,4 +1,4 @@
-import o from "./index.es193.js";
+import o from "./index.es182.js";
 const t = o("ZoomOut", [
   [
     "path",

package/index.es15.js

@@ -1,189 +1,5 @@
-import { jsx as t, jsxs as l } from "react/jsx-runtime";
-import { useSortable as R } from "./index.es107.js";
-import { cva as I } from "./index.es105.js";
-import * as n from "react";
-import { cn as d } from "./index.es85.js";
-import { strings as m } from "./index.es97.js";
-import { ComboboxControlNoForm as T } from "./index.es7.js";
-import { Button as N } from "./index.es22.js";
-import { DropdownMenu as V, DropdownMenuTrigger as k, DropdownMenuContent as A, DropdownMenuItem as j } from "./index.es32.js";
-import B from "./index.es116.js";
-import M from "./index.es117.js";
-import { Stack as S } from "./index.es42.js";
-import H from "./index.es118.js";
-const F = I("flex gap-space-04 flex-grow", {
-  variants: {
-    direction: {
-      col: "flex-col",
-      row: "flex-row"
-    }
-  },
-  defaultVariants: {
-    direction: "col"
-  }
-}), L = n.forwardRef(
-  ({ className: r, onConfigChange: e, isDragOverlay: s, isEditMode: a, config: o, isOver: i, children: p, ...u }, f) => {
-    const [c, b] = n.useState(!1), { attributes: w, listeners: g, setNodeRef: z, isDragging: x, transform: h, transition: W } = R({
-      id: o.alias,
-      disabled: !a || c
-    }), y = {
-      transform: h ? `translate3d(${h.x}px, ${h.y}px, 0)` : void 0,
-      transition: W
-    };
-    return /* @__PURE__ */ t(
-      "div",
-      {
-        ref: z,
-        ...w,
-        ...a && !s ? g : {},
-        className: d(
-          "cursor-auto rounded-3 border-2 transition-all duration-200",
-          a && !s && ["border-dashed", i ? "border-2 border-primary" : "border-border", x && "opacity-50"],
-          s && ["border border-solid border-primary"],
-          !a && "border-transparent",
-          o.size === "full" ? "sm:col-span-2" : "sm:col-span-1",
-          a && "cursor-move"
-        ),
-        children: /* @__PURE__ */ t(
-          "div",
-          {
-            style: y,
-            className: d(
-              "rounded-3 bg-background shadow-card-shadow transition-all duration-200",
-              x && "invisible",
-              a && "hover:shadow-card-hover-02"
-            ),
-            children: /* @__PURE__ */ l("div", { className: "flex flex-col", children: [
-              a && /* @__PURE__ */ t(
-                v,
-                {
-                  isResizable: o.isResizable,
-                  isMandatory: o.isMandatory,
-                  size: o.size,
-                  onSizeChange: (D) => e == null ? void 0 : e({ alias: o.alias, size: D }),
-                  onDelete: () => {
-                    e == null || e({ alias: o.alias, isVisible: !1 });
-                  },
-                  onButtonHover: b
-                }
-              ),
-              /* @__PURE__ */ t(
-                "div",
-                {
-                  ref: f,
-                  className: d(
-                    "flex h-[380px] flex-col gap-space-04 rounded-3 border border-border-secondary bg-card p-space-04 transition-all duration-200",
-                    { "pointer-events-none": a },
-                    r
-                  ),
-                  ...u,
-                  children: p
-                }
-              )
-            ] })
-          }
-        )
-      }
-    );
-  }
-);
-L.displayName = "Widget";
-const $ = n.forwardRef(({ className: r, ...e }, s) => /* @__PURE__ */ t("div", { ref: s, className: d("flex items-center justify-between bg-card", r), ...e }));
-$.displayName = "WidgetHeader";
-const P = n.forwardRef(({ className: r, children: e, ...s }, a) => /* @__PURE__ */ t("h3", { ref: a, className: d("flex items-center gap-space-02 text-subtitle-01 font-bold text-card-foreground", r), ...s, children: e }));
-P.displayName = "WidgetTitle";
-const q = ({ actions: r }) => {
-  if (r.length === 1) {
-    const { label: e, icon: s, onClick: a, "data-testid": o, ...i } = r[0];
-    return /* @__PURE__ */ l(
-      N,
-      {
-        onClick: a,
-        variant: i.variant,
-        "data-testid": o,
-        size: i.size,
-        ...i,
-        className: d(i.className),
-        children: [
-          s,
-          e
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ l(V, { children: [
-    /* @__PURE__ */ t(k, { asChild: !0, children: /* @__PURE__ */ t(N, { variant: "text", colors: "neutral", size: "icon", children: /* @__PURE__ */ t(B, { className: "h-5 w-5" }) }) }),
-    /* @__PURE__ */ t(A, { className: "min-w-[232px]", children: r.map((e) => {
-      const { label: s, icon: a, "data-testid": o, onClick: i } = e;
-      return /* @__PURE__ */ l(j, { onClick: i, className: "cursor-pointer", "data-testid": o, children: [
-        a && /* @__PURE__ */ t("span", { className: "mr-2", children: a }),
-        s
-      ] }, e == null ? void 0 : e.label);
-    }) })
-  ] });
-};
-q.displayName = "WidgetActions";
-const G = n.forwardRef(
-  ({ className: r, direction: e, ...s }, a) => /* @__PURE__ */ t("div", { ref: a, className: d(F({ direction: e }), "overflow-hidden", r), ...s })
-);
-G.displayName = "WidgetContent";
-const J = (r) => ({
-  onMouseEnter: () => r(!0),
-  onMouseLeave: () => r(!1),
-  onTouchStart: () => r(!0),
-  onTouchEnd: () => {
-    setTimeout(() => r(!1), 100);
-  }
-}), v = n.forwardRef(
-  ({ onSizeChange: r, isMandatory: e, isResizable: s, onDelete: a, size: o, className: i, onButtonHover: p, ...u }, f) => {
-    const c = J(p ?? (() => {
-    }));
-    return /* @__PURE__ */ l(
-      "div",
-      {
-        ref: f,
-        className: d(
-          "relative z-50 flex min-h-space-09 items-center justify-between gap-space-01 rounded-3 bg-background p-space-02",
-          i
-        ),
-        ...u,
-        children: [
-          /* @__PURE__ */ t(M, { className: "size-[18px]" }),
-          /* @__PURE__ */ l(S, { gap: 2, alignItems: "center", children: [
-            s && /* @__PURE__ */ t("div", { ...c, children: /* @__PURE__ */ t(
-              T,
-              {
-                className: "hidden sm:flex",
-                rounded: "default",
-                size: "sm",
-                options: [
-                  { Name: m.DragAndDrop.Half, Value: "half" },
-                  { Name: m.DragAndDrop.Full, Value: "full" }
-                ],
-                optionLabel: "Name",
-                optionValue: "Value",
-                placeholder: m.DragAndDrop.Width,
-                onChange: (b) => {
-                  r && r(b);
-                },
-                value: o ?? ""
-              }
-            ) }),
-            !e && /* @__PURE__ */ t("div", { ...c, children: /* @__PURE__ */ l(N, { variant: "outline", size: "sm", onClick: a, className: "gap-space-01", rounded: "default", children: [
-              /* @__PURE__ */ t(H, { className: "size-[20px]" }),
-              m.DragAndDrop.Delete
-            ] }) })
-          ] })
-        ]
-      }
-    );
-  }
-);
-v.displayName = "WidgetEditMode";
+const r = ({ other: e, children: l, shouldRender: n }) => n ? l : e ?? null;
 export {
-  L as Widget,
-  q as WidgetActions,
-  G as WidgetContent,
-  $ as WidgetHeader,
-  P as WidgetTitle
+  r as ShouldRender,
+  r as default
 };

package/index.es150.js

@@ -1,4 +1,4 @@
-import o from "./index.es193.js";
+import o from "./index.es182.js";
 const H = o("ZoomIn", [
   [
     "path",

package/index.es151.js

@@ -1,4 +1,4 @@
-import C from "./index.es193.js";
+import C from "./index.es182.js";
 const e = C("HearingDisabled", [
   [
     "path",

package/index.es153.js

@@ -1,4 +1,4 @@
-import a from "./index.es193.js";
+import a from "./index.es182.js";
 const V = a("CalendarToday", [
   [
     "path",

package/index.es154.js

@@ -1,4 +1,4 @@
-import C from "./index.es193.js";
+import C from "./index.es182.js";
 const L = C("LightMode", [
   [
     "path",

package/index.es155.js

@@ -1,4 +1,4 @@
-import C from "./index.es193.js";
+import C from "./index.es182.js";
 const e = C("DarkMode", [
   [
     "path",

package/index.es156.js

@@ -1,4 +1,4 @@
-import r from "./index.es193.js";
+import r from "./index.es182.js";
 const C = r("ErrorOutline", [
   [
     "path",

package/index.es159.js

@@ -1,4 +1,4 @@
-import H from "./index.es193.js";
+import H from "./index.es182.js";
 const o = H("Link", [
   [
     "path",

package/index.es16.js

@@ -1,53 +1,189 @@
-import { jsxs as l, jsx as s } from "react/jsx-runtime";
-import * as r from "@radix-ui/react-accordion";
-import * as d from "react";
-import { cn as n } from "./index.es85.js";
-const c = d.createContext({
-  size: "default",
-  isLeading: !1
-}), p = d.forwardRef(({ children: e, size: t, isLeading: a, ...i }, o) => /* @__PURE__ */ l(r.Root, { ref: o, ...i, children: [
-  /* @__PURE__ */ s(c.Provider, { value: { size: t, isLeading: a }, children: e }),
-  " "
-] }));
-p.displayName = "Accordion";
-const f = d.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ s(r.Item, { ref: a, className: n("flex flex-col border-b border-b-border-neutral-primary", e), ...t }));
-f.displayName = "AccordionItem";
-const m = d.forwardRef(({ className: e, children: t, ...a }, i) => {
-  const o = d.useContext(c);
-  return /* @__PURE__ */ s(r.Header, { className: "flex", children: /* @__PURE__ */ s(
-    r.Trigger,
-    {
-      ref: i,
-      className: n(
-        "group flex flex-1 items-center gap-space-04 border-2 border-transparent px-space-04  text-body-02 text-text-default transition-all hover:bg-button-background-neutral-hovered focus:border-border-black focus:bg-transparent focus:outline-none active:bg-button-background-neutral-pressed disabled:text-disabled-text-default-disabled [&>svg]:size-space-04",
-        {
-          "py-space-04 font-bold": o.size === "default",
-          "py-space-03 font-semibold": o.size === "sm",
-          "py-space-02 font-semibold": o.size === "xs",
-          "justify-between ": !o.isLeading,
-          "flex-row-reverse justify-end": o.isLeading
-        },
-        e
-      ),
-      ...a,
-      children: t
+import { jsx as t, jsxs as l } from "react/jsx-runtime";
+import { useSortable as R } from "./index.es107.js";
+import { cva as I } from "./index.es105.js";
+import * as n from "react";
+import { cn as d } from "./index.es86.js";
+import { strings as m } from "./index.es98.js";
+import { ComboboxControlNoForm as T } from "./index.es8.js";
+import { Button as N } from "./index.es23.js";
+import { DropdownMenu as V, DropdownMenuTrigger as k, DropdownMenuContent as A, DropdownMenuItem as j } from "./index.es33.js";
+import B from "./index.es115.js";
+import M from "./index.es116.js";
+import { Stack as S } from "./index.es43.js";
+import H from "./index.es117.js";
+const F = I("flex gap-space-04 flex-grow", {
+  variants: {
+    direction: {
+      col: "flex-col",
+      row: "flex-row"
     }
-  ) });
-});
-m.displayName = r.Trigger.displayName;
-const b = d.forwardRef(({ className: e, children: t, ...a }, i) => /* @__PURE__ */ s(
-  r.Content,
-  {
-    ref: i,
-    className: "overflow-hidden text-body-02 text-text-paragraph-primary transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down data-[disabled]:text-disabled-text-default-disabled",
-    ...a,
-    children: /* @__PURE__ */ s("div", { className: n("pb-space-05 pe-space-08 ps-space-04 pt-space-02", e), children: t })
+  },
+  defaultVariants: {
+    direction: "col"
   }
-));
-b.displayName = r.Content.displayName;
+}), L = n.forwardRef(
+  ({ className: r, onConfigChange: e, isDragOverlay: s, isEditMode: a, config: o, isOver: i, children: p, ...u }, f) => {
+    const [c, b] = n.useState(!1), { attributes: w, listeners: g, setNodeRef: z, isDragging: x, transform: h, transition: W } = R({
+      id: o.alias,
+      disabled: !a || c
+    }), y = {
+      transform: h ? `translate3d(${h.x}px, ${h.y}px, 0)` : void 0,
+      transition: W
+    };
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ref: z,
+        ...w,
+        ...a && !s ? g : {},
+        className: d(
+          "cursor-auto rounded-3 border-2 transition-all duration-200",
+          a && !s && ["border-dashed", i ? "border-2 border-primary" : "border-border", x && "opacity-50"],
+          s && ["border border-solid border-primary"],
+          !a && "border-transparent",
+          o.size === "full" ? "sm:col-span-2" : "sm:col-span-1",
+          a && "cursor-move"
+        ),
+        children: /* @__PURE__ */ t(
+          "div",
+          {
+            style: y,
+            className: d(
+              "rounded-3 bg-background shadow-card-shadow transition-all duration-200",
+              x && "invisible",
+              a && "hover:shadow-card-hover-02"
+            ),
+            children: /* @__PURE__ */ l("div", { className: "flex flex-col", children: [
+              a && /* @__PURE__ */ t(
+                v,
+                {
+                  isResizable: o.isResizable,
+                  isMandatory: o.isMandatory,
+                  size: o.size,
+                  onSizeChange: (D) => e == null ? void 0 : e({ alias: o.alias, size: D }),
+                  onDelete: () => {
+                    e == null || e({ alias: o.alias, isVisible: !1 });
+                  },
+                  onButtonHover: b
+                }
+              ),
+              /* @__PURE__ */ t(
+                "div",
+                {
+                  ref: f,
+                  className: d(
+                    "flex h-[380px] flex-col gap-space-04 rounded-3 border border-border-secondary bg-card p-space-04 transition-all duration-200",
+                    { "pointer-events-none": a },
+                    r
+                  ),
+                  ...u,
+                  children: p
+                }
+              )
+            ] })
+          }
+        )
+      }
+    );
+  }
+);
+L.displayName = "Widget";
+const $ = n.forwardRef(({ className: r, ...e }, s) => /* @__PURE__ */ t("div", { ref: s, className: d("flex items-center justify-between bg-card", r), ...e }));
+$.displayName = "WidgetHeader";
+const P = n.forwardRef(({ className: r, children: e, ...s }, a) => /* @__PURE__ */ t("h3", { ref: a, className: d("flex items-center gap-space-02 text-subtitle-01 font-bold text-card-foreground", r), ...s, children: e }));
+P.displayName = "WidgetTitle";
+const q = ({ actions: r }) => {
+  if (r.length === 1) {
+    const { label: e, icon: s, onClick: a, "data-testid": o, ...i } = r[0];
+    return /* @__PURE__ */ l(
+      N,
+      {
+        onClick: a,
+        variant: i.variant,
+        "data-testid": o,
+        size: i.size,
+        ...i,
+        className: d(i.className),
+        children: [
+          s,
+          e
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ l(V, { children: [
+    /* @__PURE__ */ t(k, { asChild: !0, children: /* @__PURE__ */ t(N, { variant: "text", colors: "neutral", size: "icon", children: /* @__PURE__ */ t(B, { className: "h-5 w-5" }) }) }),
+    /* @__PURE__ */ t(A, { className: "min-w-[232px]", children: r.map((e) => {
+      const { label: s, icon: a, "data-testid": o, onClick: i } = e;
+      return /* @__PURE__ */ l(j, { onClick: i, className: "cursor-pointer", "data-testid": o, children: [
+        a && /* @__PURE__ */ t("span", { className: "mr-2", children: a }),
+        s
+      ] }, e == null ? void 0 : e.label);
+    }) })
+  ] });
+};
+q.displayName = "WidgetActions";
+const G = n.forwardRef(
+  ({ className: r, direction: e, ...s }, a) => /* @__PURE__ */ t("div", { ref: a, className: d(F({ direction: e }), "overflow-hidden", r), ...s })
+);
+G.displayName = "WidgetContent";
+const J = (r) => ({
+  onMouseEnter: () => r(!0),
+  onMouseLeave: () => r(!1),
+  onTouchStart: () => r(!0),
+  onTouchEnd: () => {
+    setTimeout(() => r(!1), 100);
+  }
+}), v = n.forwardRef(
+  ({ onSizeChange: r, isMandatory: e, isResizable: s, onDelete: a, size: o, className: i, onButtonHover: p, ...u }, f) => {
+    const c = J(p ?? (() => {
+    }));
+    return /* @__PURE__ */ l(
+      "div",
+      {
+        ref: f,
+        className: d(
+          "relative z-50 flex min-h-space-09 items-center justify-between gap-space-01 rounded-3 bg-background p-space-02",
+          i
+        ),
+        ...u,
+        children: [
+          /* @__PURE__ */ t(M, { className: "size-[18px]" }),
+          /* @__PURE__ */ l(S, { gap: 2, alignItems: "center", children: [
+            s && /* @__PURE__ */ t("div", { ...c, children: /* @__PURE__ */ t(
+              T,
+              {
+                className: "hidden sm:flex",
+                rounded: "default",
+                size: "sm",
+                options: [
+                  { Name: m.DragAndDrop.Half, Value: "half" },
+                  { Name: m.DragAndDrop.Full, Value: "full" }
+                ],
+                optionLabel: "Name",
+                optionValue: "Value",
+                placeholder: m.DragAndDrop.Width,
+                onChange: (b) => {
+                  r && r(b);
+                },
+                value: o ?? ""
+              }
+            ) }),
+            !e && /* @__PURE__ */ t("div", { ...c, children: /* @__PURE__ */ l(N, { variant: "outline", size: "sm", onClick: a, className: "gap-space-01", rounded: "default", children: [
+              /* @__PURE__ */ t(H, { className: "size-[20px]" }),
+              m.DragAndDrop.Delete
+            ] }) })
+          ] })
+        ]
+      }
+    );
+  }
+);
+v.displayName = "WidgetEditMode";
 export {
-  p as Accordion,
-  b as AccordionContent,
-  f as AccordionItem,
-  m as AccordionTrigger
+  L as Widget,
+  q as WidgetActions,
+  G as WidgetContent,
+  $ as WidgetHeader,
+  P as WidgetTitle
 };

package/index.es160.js

@@ -1,4 +1,4 @@
-import C from "./index.es193.js";
+import C from "./index.es182.js";
 const o = C("Lock", [
   [
     "path",

package/index.es161.js

@@ -1,4 +1,4 @@
-import L from "./index.es193.js";
+import L from "./index.es182.js";
 const t = L("StarBorder", [
   [
     "path",

package/index.es162.js

@@ -1,4 +1,4 @@
-import L from "./index.es193.js";
+import L from "./index.es182.js";
 const a = L("Star", [
   [
     "path",

package/index.es163.js

@@ -1,4 +1,4 @@
-import e from "./index.es193.js";
+import e from "./index.es182.js";
 const c = e("Check", [
   [
     "path",

package/index.es164.js

@@ -1,6 +1,6 @@
 import { useRef as l, useState as f, useCallback as p, useEffect as c } from "react";
-import { areOptionsEqual as E, arePluginsEqual as O, canUseDOM as w } from "./index.es185.js";
-import m from "./index.es186.js";
+import { areOptionsEqual as E, arePluginsEqual as O, canUseDOM as w } from "./index.es189.js";
+import m from "./index.es190.js";
 function b(e = {}, r = []) {
   const t = l(e), n = l(r), [u, s] = f(), [a, d] = f(), o = p(() => {
     u && u.reInit(t.current, n.current);

package/index.es165.js

@@ -1,4 +1,4 @@
-import r from "./index.es193.js";
+import r from "./index.es182.js";
 const e = r("KeyboardArrowUp", [
   [
     "path",

package/index.es166.js

@@ -1,6 +1,6 @@
-import { createStore as s } from "./index.es187.js";
+import { createStore as s } from "./index.es191.js";
 import u from "react";
-import a from "./index.es188.js";
+import a from "./index.es192.js";
 const { useDebugValue: E } = u, { useSyncExternalStoreWithSelector: l } = a;
 const c = (t) => t;
 function d(t, e = c, o) {

package/index.es167.js

@@ -1,4 +1,4 @@
-import V from "./index.es193.js";
+import V from "./index.es182.js";
 const e = V("ViewSidebar", [
   [
     "path",

package/index.es168.js

@@ -1,4 +1,4 @@
-import t from "./index.es193.js";
+import t from "./index.es182.js";
 const V = t("WidthFull", [
   [
     "path",