mada-design-system 0.0.9 → 0.0.11

package/index.es36.js

@@ -1,47 +1,37 @@
-import { jsxs as u, jsx as e } from "react/jsx-runtime";
-import { cva as c } from "./index.es89.js";
-import * as f from "react";
-import { cn as m } from "./index.es69.js";
-const p = c(
-  "inline-flex items-center h-[4rem] w-full border px-space-04  text-base  hover:border-foreground disabled:cursor-not-allowed disabled:text-disabled aria-[invalid=true]:border-error",
-  {
-    variants: {
-      variant: {
-        default: "bg-muted",
-        outline: "bg-transparent"
-      },
-      rounded: {
-        default: "rounded-2",
-        full: "rounded-4"
-      },
-      colors: {
-        default: "border-input",
-        success: "border-success",
-        destructive: "border-error"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      rounded: "default",
-      colors: "default"
+import { jsx as t, jsxs as l } from "react/jsx-runtime";
+import { OTPInput as c } from "./index.es127.js";
+import * as a from "react";
+import { cn as s } from "./index.es76.js";
+const p = a.forwardRef(
+  ({ className: e, ...r }, n) => /* @__PURE__ */ t(c, { ref: n, containerClassName: s("flex items-center gap-2", e), ...r })
+);
+p.displayName = "InputOTP";
+const m = a.forwardRef(({ className: e, ...r }, n) => /* @__PURE__ */ t("div", { ref: n, className: s("flex items-center", e), ...r }));
+m.displayName = "InputOTPGroup";
+const f = a.forwardRef(
+  ({ char: e, hasFakeCaret: r, isActive: n, className: i, ...o }, d) => /* @__PURE__ */ l(
+    "div",
+    {
+      ref: d,
+      className: s(
+        "relative flex h-10 w-10 items-center justify-center border-y border-r border-input text-sm transition-all first:rounded-l-md first:border-l last:rounded-r-md",
+        n && "z-10 ring-2 ring-ring ring-offset-background",
+        i
+      ),
+      ...o,
+      children: [
+        e,
+        r && /* @__PURE__ */ t("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ t("div", { className: "animate-caret-blink h-4 w-px bg-foreground duration-1000" }) })
+      ]
     }
-  }
-), b = f.forwardRef(
-  ({ className: d, variant: i, rounded: l, type: s, colors: o, startAdornment: r, endAdornment: a, ...t }, n) => /* @__PURE__ */ u("div", { className: m(p({ variant: i, rounded: l, colors: o }), d), "aria-invalid": t["aria-invalid"], children: [
-    r && /* @__PURE__ */ e("div", { className: " me-space-02 ", children: r }),
-    /* @__PURE__ */ e(
-      "input",
-      {
-        type: s,
-        className: "outline-none py-space-03 w-full bg-transparent file:border-0 file:bg-transparent  file:text-sm file:font-mdium placeholder:text-foreground-secondary  ",
-        ref: n,
-        ...t
-      }
-    ),
-    a && /* @__PURE__ */ e("div", { className: "ms-space-02", children: a })
-  ] })
+  )
 );
-b.displayName = "Input";
+f.displayName = "InputOTPSlot";
+const u = a.forwardRef(({ ...e }, r) => /* @__PURE__ */ t("div", { ref: r, role: "separator", ...e, children: /* @__PURE__ */ t("div", { className: "flex size-space-05 items-center justify-center", children: /* @__PURE__ */ t("div", { className: "size-space-01 rounded-full bg-foreground" }) }) }));
+u.displayName = "InputOTPSeparator";
 export {
-  b as Input
+  p as InputOTP,
+  m as InputOTPGroup,
+  u as InputOTPSeparator,
+  f as InputOTPSlot
 };

package/index.es360.js

@@ -1,4 +1,8 @@
-var r = {};
+import * as e from "react";
+var n = function(a) {
+  return a();
+}, t = e["useInsertionEffect"] ? e["useInsertionEffect"] : !1, c = t || n, f = t || e.useLayoutEffect;
 export {
-  r as __exports
+  c as useInsertionEffectAlwaysWithSyncFallback,
+  f as useInsertionEffectWithLayoutFallback
 };

package/index.es361.js

@@ -1,4 +1,134 @@
-var e = {};
+import w from "./index.es379.js";
+import C from "./index.es380.js";
+import E from "./index.es378.js";
+var _ = !1, x = /[A-Z]|^ms/g, O = /_EMO_([^_]+?)_([^]*?)_EMO_/g, d = function(n) {
+  return n.charCodeAt(1) === 45;
+}, p = function(n) {
+  return n != null && typeof n != "boolean";
+}, h = /* @__PURE__ */ E(function(r) {
+  return d(r) ? r : r.replace(x, "-$&").toLowerCase();
+}), y = function(n, e) {
+  switch (n) {
+    case "animation":
+    case "animationName":
+      if (typeof e == "string")
+        return e.replace(O, function(f, a, t) {
+          return s = {
+            name: a,
+            styles: t,
+            next: s
+          }, a;
+        });
+  }
+  return C[n] !== 1 && !d(n) && typeof e == "number" && e !== 0 ? e + "px" : e;
+}, A = "Component selectors can only be used in conjunction with @emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware compiler transform.";
+function m(r, n, e) {
+  if (e == null)
+    return "";
+  var f = e;
+  if (f.__emotion_styles !== void 0)
+    return f;
+  switch (typeof e) {
+    case "boolean":
+      return "";
+    case "object": {
+      var a = e;
+      if (a.anim === 1)
+        return s = {
+          name: a.name,
+          styles: a.styles,
+          next: s
+        }, a.name;
+      var t = e;
+      if (t.styles !== void 0) {
+        var o = t.next;
+        if (o !== void 0)
+          for (; o !== void 0; )
+            s = {
+              name: o.name,
+              styles: o.styles,
+              next: s
+            }, o = o.next;
+        var i = t.styles + ";";
+        return i;
+      }
+      return M(r, n, e);
+    }
+    case "function": {
+      if (r !== void 0) {
+        var u = s, c = e(r);
+        return s = u, m(r, n, c);
+      }
+      break;
+    }
+  }
+  var l = e;
+  if (n == null)
+    return l;
+  var v = n[l];
+  return v !== void 0 ? v : l;
+}
+function M(r, n, e) {
+  var f = "";
+  if (Array.isArray(e))
+    for (var a = 0; a < e.length; a++)
+      f += m(r, n, e[a]) + ";";
+  else
+    for (var t in e) {
+      var o = e[t];
+      if (typeof o != "object") {
+        var i = o;
+        n != null && n[i] !== void 0 ? f += t + "{" + n[i] + "}" : p(i) && (f += h(t) + ":" + y(t, i) + ";");
+      } else {
+        if (t === "NO_COMPONENT_SELECTOR" && _)
+          throw new Error(A);
+        if (Array.isArray(o) && typeof o[0] == "string" && (n == null || n[o[0]] === void 0))
+          for (var u = 0; u < o.length; u++)
+            p(o[u]) && (f += h(t) + ":" + y(t, o[u]) + ";");
+        else {
+          var c = m(r, n, o);
+          switch (t) {
+            case "animation":
+            case "animationName": {
+              f += h(t) + ":" + c + ";";
+              break;
+            }
+            default:
+              f += t + "{" + c + "}";
+          }
+        }
+      }
+    }
+  return f;
+}
+var b = /label:\s*([^\s;{]+)\s*(;|$)/g, s;
+function R(r, n, e) {
+  if (r.length === 1 && typeof r[0] == "object" && r[0] !== null && r[0].styles !== void 0)
+    return r[0];
+  var f = !0, a = "";
+  s = void 0;
+  var t = r[0];
+  if (t == null || t.raw === void 0)
+    f = !1, a += m(e, n, t);
+  else {
+    var o = t;
+    a += o[0];
+  }
+  for (var i = 1; i < r.length; i++)
+    if (a += m(e, n, r[i]), f) {
+      var u = t;
+      a += u[i];
+    }
+  b.lastIndex = 0;
+  for (var c = "", l; (l = b.exec(a)) !== null; )
+    c += "-" + l[1];
+  var v = w(a) + c;
+  return {
+    name: v,
+    styles: a,
+    next: s
+  };
+}
 export {
-  e as __exports
+  R as serializeStyles
 };

package/index.es362.js

@@ -1,75 +1,17 @@
-import * as n from "react";
-import e from "./index.es153.js";
-import { clsx as a } from "./index.es86.js";
-import { jsx as u } from "react/jsx-runtime";
-function x(c) {
-  const {
-    className: m,
-    classes: i,
-    pulsate: p = !1,
-    rippleX: d,
-    rippleY: f,
-    rippleSize: s,
-    in: t,
-    onExited: l,
-    timeout: r
-  } = c, [o, b] = n.useState(!1), h = a(m, i.ripple, i.rippleVisible, p && i.ripplePulsate), N = {
-    width: s,
-    height: s,
-    top: -(s / 2) + f,
-    left: -(s / 2) + d
-  }, g = a(i.child, o && i.childLeaving, p && i.childPulsate);
-  return !t && !o && b(!0), n.useEffect(() => {
-    if (!t && l != null) {
-      const v = setTimeout(l, r);
-      return () => {
-        clearTimeout(v);
-      };
-    }
-  }, [l, t, r]), /* @__PURE__ */ u("span", {
-    className: h,
-    style: N,
-    children: /* @__PURE__ */ u("span", {
-      className: g
-    })
-  });
-}
-process.env.NODE_ENV !== "production" && (x.propTypes = {
-  /**
-   * Override or extend the styles applied to the component.
-   * See [CSS API](#css) below for more details.
-   */
-  classes: e.object.isRequired,
-  className: e.string,
-  /**
-   * @ignore - injected from TransitionGroup
-   */
-  in: e.bool,
-  /**
-   * @ignore - injected from TransitionGroup
-   */
-  onExited: e.func,
-  /**
-   * If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element.
-   */
-  pulsate: e.bool,
-  /**
-   * Diameter of the ripple.
-   */
-  rippleSize: e.number,
-  /**
-   * Horizontal position of the ripple center.
-   */
-  rippleX: e.number,
-  /**
-   * Vertical position of the ripple center.
-   */
-  rippleY: e.number,
-  /**
-   * exit delay
-   */
-  timeout: e.number.isRequired
-});
-export {
-  x as default
-};
+import { __require as t } from "./index.es224.js";
+var e = t(), a = {
+  $$typeof: !0,
+  render: !0,
+  defaultProps: !0,
+  displayName: !0,
+  propTypes: !0
+}, p = {
+  $$typeof: !0,
+  compare: !0,
+  defaultProps: !0,
+  displayName: !0,
+  propTypes: !0,
+  type: !0
+}, r = {};
+r[e.ForwardRef] = a;
+r[e.Memo] = p;

package/index.es363.js

@@ -1,11 +1,9 @@
-function f(t) {
-  if (t === void 0)
-    return {};
-  const e = {};
-  return Object.keys(t).filter((n) => !(n.match(/^on[A-Z]/) && typeof t[n] == "function")).forEach((n) => {
-    e[n] = t[n];
-  }), e;
+function c(t, r) {
+  const e = this;
+  return e.vars && typeof e.getColorSchemeSelector == "function" ? {
+    [e.getColorSchemeSelector(t).replace(/(\[[^\]]+\])/, "*:where($1)")]: r
+  } : e.palette.mode === t ? r : {};
 }
 export {
-  f as default
+  c as default
 };

package/index.es364.js

@@ -1,5 +1,7 @@
-function e(t, n) {
-  typeof t == "function" ? t(n) : t && (t.current = n);
+function e(o, r) {
+  return e = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(t, n) {
+    return t.__proto__ = n, t;
+  }, e(o, r);
 }
 export {
   e as default

package/index.es365.js

@@ -1,9 +1,6 @@
-import r from "./index.es175.js";
-import t from "./index.es176.js";
-function n(o) {
-  return r("MuiSvgIcon", o);
+function i(s, a) {
+  return s.classList ? !!a && s.classList.contains(a) : (" " + (s.className.baseVal || s.className) + " ").indexOf(" " + a + " ") !== -1;
 }
-t("MuiSvgIcon", ["root", "colorPrimary", "colorSecondary", "colorAction", "colorError", "colorDisabled", "fontSizeInherit", "fontSizeSmall", "fontSizeMedium", "fontSizeLarge"]);
 export {
-  n as getSvgIconUtilityClass
+  i as default
 };

package/index.es366.js

@@ -0,0 +1,4 @@
+import o from "./index.es275.js";
+export {
+  o as default
+};

package/index.es367.js

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

package/index.es368.js

@@ -0,0 +1,253 @@
+import G from "./index.es191.js";
+import U from "./index.es192.js";
+import * as e from "react";
+import _ from "./index.es193.js";
+import { clsx as c } from "./index.es92.js";
+import j from "./index.es205.js";
+import F from "./index.es214.js";
+import J from "./index.es389.js";
+import i from "./index.es370.js";
+import { jsx as k } from "react/jsx-runtime";
+import { keyframes as E } from "./index.es358.js";
+import Q from "./index.es230.js";
+const Z = ["center", "classes", "className"];
+let y = (r) => r, V, D, K, S;
+const w = 550, v = 80, tt = E(V || (V = y`
+  0% {
+    transform: scale(0);
+    opacity: 0.1;
+  }
+
+  100% {
+    transform: scale(1);
+    opacity: 0.3;
+  }
+`)), et = E(D || (D = y`
+  0% {
+    opacity: 1;
+  }
+
+  100% {
+    opacity: 0;
+  }
+`)), it = E(K || (K = y`
+  0% {
+    transform: scale(1);
+  }
+
+  50% {
+    transform: scale(0.92);
+  }
+
+  100% {
+    transform: scale(1);
+  }
+`)), rt = j("span", {
+  name: "MuiTouchRipple",
+  slot: "Root"
+})({
+  overflow: "hidden",
+  pointerEvents: "none",
+  position: "absolute",
+  zIndex: 0,
+  top: 0,
+  right: 0,
+  bottom: 0,
+  left: 0,
+  borderRadius: "inherit"
+}), ot = j(J, {
+  name: "MuiTouchRipple",
+  slot: "Ripple"
+})(S || (S = y`
+  opacity: 0;
+  position: absolute;
+
+  &.${0} {
+    opacity: 0.3;
+    transform: scale(1);
+    animation-name: ${0};
+    animation-duration: ${0}ms;
+    animation-timing-function: ${0};
+  }
+
+  &.${0} {
+    animation-duration: ${0}ms;
+  }
+
+  & .${0} {
+    opacity: 1;
+    display: block;
+    width: 100%;
+    height: 100%;
+    border-radius: 50%;
+    background-color: currentColor;
+  }
+
+  & .${0} {
+    opacity: 0;
+    animation-name: ${0};
+    animation-duration: ${0}ms;
+    animation-timing-function: ${0};
+  }
+
+  & .${0} {
+    position: absolute;
+    /* @noflip */
+    left: 0px;
+    top: 0;
+    animation-name: ${0};
+    animation-duration: 2500ms;
+    animation-timing-function: ${0};
+    animation-iteration-count: infinite;
+    animation-delay: 200ms;
+  }
+`), i.rippleVisible, tt, w, ({
+  theme: r
+}) => r.transitions.easing.easeInOut, i.ripplePulsate, ({
+  theme: r
+}) => r.transitions.duration.shorter, i.child, i.childLeaving, et, w, ({
+  theme: r
+}) => r.transitions.easing.easeInOut, i.childPulsate, it, ({
+  theme: r
+}) => r.transitions.easing.easeInOut), q = /* @__PURE__ */ e.forwardRef(function(A, H) {
+  const I = F({
+    props: A,
+    name: "MuiTouchRipple"
+  }), {
+    center: L = !1,
+    classes: n = {},
+    className: W
+  } = I, B = U(I, Z), [N, X] = e.useState([]), Y = e.useRef(0), h = e.useRef(null);
+  e.useEffect(() => {
+    h.current && (h.current(), h.current = null);
+  }, [N]);
+  const T = e.useRef(!1), d = e.useRef(0), o = e.useRef(null), z = e.useRef(null);
+  e.useEffect(() => () => {
+    d.current && clearTimeout(d.current);
+  }, []);
+  const $ = e.useCallback((t) => {
+    const {
+      pulsate: a,
+      rippleX: s,
+      rippleY: g,
+      rippleSize: b,
+      cb: P
+    } = t;
+    X((l) => [...l, /* @__PURE__ */ k(ot, {
+      classes: {
+        ripple: c(n.ripple, i.ripple),
+        rippleVisible: c(n.rippleVisible, i.rippleVisible),
+        ripplePulsate: c(n.ripplePulsate, i.ripplePulsate),
+        child: c(n.child, i.child),
+        childLeaving: c(n.childLeaving, i.childLeaving),
+        childPulsate: c(n.childPulsate, i.childPulsate)
+      },
+      timeout: w,
+      pulsate: a,
+      rippleX: s,
+      rippleY: g,
+      rippleSize: b
+    }, Y.current)]), Y.current += 1, h.current = P;
+  }, [n]), R = e.useCallback((t = {}, a = {}, s = () => {
+  }) => {
+    const {
+      pulsate: g = !1,
+      center: b = L || a.pulsate,
+      fakeElement: P = !1
+      // For test purposes
+    } = a;
+    if ((t == null ? void 0 : t.type) === "mousedown" && T.current) {
+      T.current = !1;
+      return;
+    }
+    (t == null ? void 0 : t.type) === "touchstart" && (T.current = !0);
+    const l = P ? null : z.current, u = l ? l.getBoundingClientRect() : {
+      width: 0,
+      height: 0,
+      left: 0,
+      top: 0
+    };
+    let p, m, f;
+    if (b || t === void 0 || t.clientX === 0 && t.clientY === 0 || !t.clientX && !t.touches)
+      p = Math.round(u.width / 2), m = Math.round(u.height / 2);
+    else {
+      const {
+        clientX: x,
+        clientY: C
+      } = t.touches && t.touches.length > 0 ? t.touches[0] : t;
+      p = Math.round(x - u.left), m = Math.round(C - u.top);
+    }
+    if (b)
+      f = Math.sqrt((2 * u.width ** 2 + u.height ** 2) / 3), f % 2 === 0 && (f += 1);
+    else {
+      const x = Math.max(Math.abs((l ? l.clientWidth : 0) - p), p) * 2 + 2, C = Math.max(Math.abs((l ? l.clientHeight : 0) - m), m) * 2 + 2;
+      f = Math.sqrt(x ** 2 + C ** 2);
+    }
+    t != null && t.touches ? o.current === null && (o.current = () => {
+      $({
+        pulsate: g,
+        rippleX: p,
+        rippleY: m,
+        rippleSize: f,
+        cb: s
+      });
+    }, d.current = setTimeout(() => {
+      o.current && (o.current(), o.current = null);
+    }, v)) : $({
+      pulsate: g,
+      rippleX: p,
+      rippleY: m,
+      rippleSize: f,
+      cb: s
+    });
+  }, [L, $]), O = e.useCallback(() => {
+    R({}, {
+      pulsate: !0
+    });
+  }, [R]), M = e.useCallback((t, a) => {
+    if (clearTimeout(d.current), (t == null ? void 0 : t.type) === "touchend" && o.current) {
+      o.current(), o.current = null, d.current = setTimeout(() => {
+        M(t, a);
+      });
+      return;
+    }
+    o.current = null, X((s) => s.length > 0 ? s.slice(1) : s), h.current = a;
+  }, []);
+  return e.useImperativeHandle(H, () => ({
+    pulsate: O,
+    start: R,
+    stop: M
+  }), [O, R, M]), /* @__PURE__ */ k(rt, G({
+    className: c(i.root, n.root, W),
+    ref: z
+  }, B, {
+    children: /* @__PURE__ */ k(Q, {
+      component: null,
+      exit: !0,
+      children: N
+    })
+  }));
+});
+process.env.NODE_ENV !== "production" && (q.propTypes = {
+  /**
+   * If `true`, the ripple starts at the center of the component
+   * rather than at the point of interaction.
+   */
+  center: _.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   * See [CSS API](#css) below for more details.
+   */
+  classes: _.object,
+  /**
+   * @ignore
+   */
+  className: _.string
+});
+const Rt = q;
+export {
+  v as DELAY_RIPPLE,
+  ot as TouchRippleRipple,
+  rt as TouchRippleRoot,
+  Rt as default
+};

package/index.es369.js

@@ -0,0 +1,10 @@
+import s from "./index.es216.js";
+import e from "./index.es215.js";
+function n(t) {
+  return e("MuiButtonBase", t);
+}
+const o = s("MuiButtonBase", ["root", "disabled", "focusVisible"]), l = o;
+export {
+  l as default,
+  n as getButtonBaseUtilityClass
+};