mada-design-system 0.3.1 → 0.4.0

package/index.es332.js

@@ -1,8 +1,78 @@
-function u(e, r) {
-  return process.env.NODE_ENV === "production" ? () => null : function(...n) {
-    return e(...n) || r(...n);
-  };
+import d from "./index.es329.js";
+import { handleBreakpoints as f } from "./index.es333.js";
+import { getPath as l } from "./index.es330.js";
+import y from "./index.es334.js";
+import h from "./index.es338.js";
+const v = {
+  m: "margin",
+  p: "padding"
+}, E = {
+  t: "Top",
+  r: "Right",
+  b: "Bottom",
+  l: "Left",
+  x: ["Left", "Right"],
+  y: ["Top", "Bottom"]
+}, p = {
+  marginX: "mx",
+  marginY: "my",
+  paddingX: "px",
+  paddingY: "py"
+}, N = h((e) => {
+  if (e.length > 2)
+    if (p[e])
+      e = p[e];
+    else
+      return [e];
+  const [n, t] = e.split(""), r = v[n], a = E[t] || "";
+  return Array.isArray(a) ? a.map((o) => r + o) : [r + a];
+}), s = ["m", "mt", "mr", "mb", "ml", "mx", "my", "margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginX", "marginY", "marginInline", "marginInlineStart", "marginInlineEnd", "marginBlock", "marginBlockStart", "marginBlockEnd"], m = ["p", "pt", "pr", "pb", "pl", "px", "py", "padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "paddingX", "paddingY", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "paddingBlock", "paddingBlockStart", "paddingBlockEnd"], b = [...s, ...m];
+function I(e, n, t, r) {
+  var a;
+  const o = (a = l(e, n, !1)) != null ? a : t;
+  return typeof o == "number" ? (i) => typeof i == "string" ? i : (process.env.NODE_ENV, o * i) : Array.isArray(o) ? (i) => typeof i == "string" ? i : (process.env.NODE_ENV !== "production" && Number.isInteger(i) && i > o.length - 1, o[i]) : typeof o == "function" ? o : (process.env.NODE_ENV, () => {
+  });
 }
+function B(e) {
+  return I(e, "spacing", 8, "spacing");
+}
+function S(e, n) {
+  if (typeof n == "string" || n == null)
+    return n;
+  const t = Math.abs(n), r = e(t);
+  return n >= 0 ? r : typeof r == "number" ? -r : `-${r}`;
+}
+function T(e, n) {
+  return (t) => e.reduce((r, a) => (r[a] = S(n, t), r), {});
+}
+function $(e, n, t, r) {
+  if (n.indexOf(t) === -1)
+    return null;
+  const a = N(t), o = T(a, r), i = e[t];
+  return f(e, i, o);
+}
+function u(e, n) {
+  const t = B(e.theme);
+  return Object.keys(e).map((r) => $(e, n, r, t)).reduce(y, {});
+}
+function c(e) {
+  return u(e, s);
+}
+c.propTypes = process.env.NODE_ENV !== "production" ? s.reduce((e, n) => (e[n] = d, e), {}) : {};
+c.filterProps = s;
+function g(e) {
+  return u(e, m);
+}
+g.propTypes = process.env.NODE_ENV !== "production" ? m.reduce((e, n) => (e[n] = d, e), {}) : {};
+g.filterProps = m;
+process.env.NODE_ENV !== "production" && b.reduce((e, n) => (e[n] = d, e), {});
 export {
-  u as default
+  B as createUnarySpacing,
+  I as createUnaryUnit,
+  T as getStyleFromPropValue,
+  S as getValue,
+  c as margin,
+  s as marginKeys,
+  g as padding,
+  m as paddingKeys
 };

package/index.es333.js

@@ -1,26 +1,57 @@
-import r from "./index.es212.js";
-import c from "./index.es332.js";
-function m(n) {
-  const {
-    prototype: e = {}
-  } = n;
-  return !!e.isReactComponent;
+const c = {
+  xs: 0,
+  // phone
+  sm: 600,
+  // tablet
+  md: 900,
+  // small laptop
+  lg: 1200,
+  // desktop
+  xl: 1536
+  // large screen
+}, k = {
+  // Sorted ASC by size. That's important.
+  // It can't be configured as it's used statically for propTypes.
+  keys: ["xs", "sm", "md", "lg", "xl"],
+  up: (t) => `@media (min-width:${c[t]}px)`
+};
+function m(t, e, n) {
+  const s = t.theme || {};
+  if (Array.isArray(e)) {
+    const r = s.breakpoints || k;
+    return e.reduce((u, o, i) => (u[r.up(r.keys[i])] = n(e[i]), u), {});
+  }
+  if (typeof e == "object") {
+    const r = s.breakpoints || k;
+    return Object.keys(e).reduce((u, o) => {
+      if (Object.keys(r.values || c).indexOf(o) !== -1) {
+        const i = r.up(o);
+        u[i] = n(e[o], o);
+      } else {
+        const i = o;
+        u[i] = e[i];
+      }
+      return u;
+    }, {});
+  }
+  return n(e);
+}
+function y(t = {}) {
+  var e;
+  return ((e = t.keys) == null ? void 0 : e.reduce((s, d) => {
+    const r = t.up(d);
+    return s[r] = {}, s;
+  }, {})) || {};
 }
-function l(n, e, p, f, s) {
-  const o = n[e], u = s || e;
-  if (o == null || // When server-side rendering React doesn't warn either.
-  // This is not an accurate check for SSR.
-  // This is only in place for Emotion compat.
-  // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
-  typeof window > "u")
-    return null;
-  let t;
-  const i = o.type;
-  return typeof i == "function" && !m(i) && (t = "Did you accidentally use a plain function component for an element instead?"), t !== void 0 ? new Error(`Invalid ${f} \`${u}\` supplied to \`${p}\`. Expected an element that can hold a ref. ${t} For more information see https://mui.com/r/caveat-with-refs-guide`) : null;
+function f(t, e) {
+  return t.reduce((n, s) => {
+    const d = n[s];
+    return (!d || Object.keys(d).length === 0) && delete n[s], n;
+  }, e);
 }
-const a = c(r.element, l);
-a.isRequired = c(r.element.isRequired, l);
-const R = a;
 export {
-  R as default
+  y as createEmptyBreakpointObject,
+  m as handleBreakpoints,
+  f as removeUnusedBreakpoints,
+  c as values
 };

package/index.es334.js

@@ -1,23 +1,10 @@
-import c from "./index.es212.js";
-import l from "./index.es332.js";
-function f(n) {
-  const {
-    prototype: e = {}
-  } = n;
-  return !!e.isReactComponent;
+import f from "./index.es272.js";
+function o(e, r) {
+  return r ? f(e, r, {
+    clone: !1
+    // No need to clone deep, it's way faster.
+  }) : e;
 }
-function u(n, e, i, r, p) {
-  const t = n[e], a = p || e;
-  if (t == null || // When server-side rendering React doesn't warn either.
-  // This is not an accurate check for SSR.
-  // This is only in place for emotion compat.
-  // TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
-  typeof window > "u")
-    return null;
-  let o;
-  return typeof t == "function" && !f(t) && (o = "Did you accidentally provide a plain function component instead?"), o !== void 0 ? new Error(`Invalid ${r} \`${a}\` supplied to \`${i}\`. Expected an element type that can hold a ref. ${o} For more information see https://mui.com/r/caveat-with-refs-guide`) : null;
-}
-const m = l(c.elementType, u);
 export {
-  m as default
+  o as default
 };

package/index.es335.js

@@ -1,8 +1,78 @@
-import { __module as r } from "./index.es371.js";
-import { __require as e } from "./index.es372.js";
-import { __require as o } from "./index.es373.js";
-process.env.NODE_ENV === "production" ? r.exports = e() : r.exports = o();
-var i = r.exports;
+import r from "./index.es330.js";
+import c from "./index.es331.js";
+import { createUnaryUnit as p, getValue as a } from "./index.es332.js";
+import { handleBreakpoints as l } from "./index.es333.js";
+import s from "./index.es329.js";
+const u = (o) => {
+  if (o.gap !== void 0 && o.gap !== null) {
+    const e = p(o.theme, "spacing", 8, "gap"), n = (t) => ({
+      gap: a(e, t)
+    });
+    return l(o, o.gap, n);
+  }
+  return null;
+};
+u.propTypes = process.env.NODE_ENV !== "production" ? {
+  gap: s
+} : {};
+u.filterProps = ["gap"];
+const i = (o) => {
+  if (o.columnGap !== void 0 && o.columnGap !== null) {
+    const e = p(o.theme, "spacing", 8, "columnGap"), n = (t) => ({
+      columnGap: a(e, t)
+    });
+    return l(o, o.columnGap, n);
+  }
+  return null;
+};
+i.propTypes = process.env.NODE_ENV !== "production" ? {
+  columnGap: s
+} : {};
+i.filterProps = ["columnGap"];
+const m = (o) => {
+  if (o.rowGap !== void 0 && o.rowGap !== null) {
+    const e = p(o.theme, "spacing", 8, "rowGap"), n = (t) => ({
+      rowGap: a(e, t)
+    });
+    return l(o, o.rowGap, n);
+  }
+  return null;
+};
+m.propTypes = process.env.NODE_ENV !== "production" ? {
+  rowGap: s
+} : {};
+m.filterProps = ["rowGap"];
+const g = r({
+  prop: "gridColumn"
+}), d = r({
+  prop: "gridRow"
+}), f = r({
+  prop: "gridAutoFlow"
+}), w = r({
+  prop: "gridAutoColumns"
+}), G = r({
+  prop: "gridAutoRows"
+}), A = r({
+  prop: "gridTemplateColumns"
+}), T = r({
+  prop: "gridTemplateRows"
+}), y = r({
+  prop: "gridTemplateAreas"
+}), P = r({
+  prop: "gridArea"
+});
+c(u, i, m, g, d, f, w, G, A, T, y, P);
 export {
-  i as r
+  i as columnGap,
+  u as gap,
+  P as gridArea,
+  w as gridAutoColumns,
+  f as gridAutoFlow,
+  G as gridAutoRows,
+  g as gridColumn,
+  d as gridRow,
+  y as gridTemplateAreas,
+  A as gridTemplateColumns,
+  T as gridTemplateRows,
+  m as rowGap
 };

package/index.es336.js

@@ -1,5 +1,26 @@
-import e from "./index.es212.js";
-const o = e.oneOfType([e.func, e.object]), f = o;
+import o from "./index.es330.js";
+import p from "./index.es331.js";
+function r(e, t) {
+  return t === "grey" ? t : e;
+}
+const n = o({
+  prop: "color",
+  themeKey: "palette",
+  transform: r
+}), c = o({
+  prop: "bgcolor",
+  cssProperty: "backgroundColor",
+  themeKey: "palette",
+  transform: r
+}), m = o({
+  prop: "backgroundColor",
+  themeKey: "palette",
+  transform: r
+});
+p(n, c, m);
 export {
-  f as default
+  m as backgroundColor,
+  c as bgcolor,
+  n as color,
+  r as paletteTransform
 };

package/index.es337.js

@@ -1,6 +1,64 @@
-function e(t, n) {
-  typeof t == "function" ? t(n) : t && (t.current = n);
+import r from "./index.es330.js";
+import a from "./index.es331.js";
+import { handleBreakpoints as p, values as d } from "./index.es333.js";
+function i(t) {
+  return t <= 1 && t !== 0 ? `${t * 100}%` : t;
 }
+const f = r({
+  prop: "width",
+  transform: i
+}), s = (t) => {
+  if (t.maxWidth !== void 0 && t.maxWidth !== null) {
+    const h = (e) => {
+      var n, o;
+      const m = ((n = t.theme) == null || (n = n.breakpoints) == null || (n = n.values) == null ? void 0 : n[e]) || d[e];
+      return m ? ((o = t.theme) == null || (o = o.breakpoints) == null ? void 0 : o.unit) !== "px" ? {
+        maxWidth: `${m}${t.theme.breakpoints.unit}`
+      } : {
+        maxWidth: m
+      } : {
+        maxWidth: i(e)
+      };
+    };
+    return p(t, t.maxWidth, h);
+  }
+  return null;
+};
+s.filterProps = ["maxWidth"];
+const l = r({
+  prop: "minWidth",
+  transform: i
+}), u = r({
+  prop: "height",
+  transform: i
+}), x = r({
+  prop: "maxHeight",
+  transform: i
+}), c = r({
+  prop: "minHeight",
+  transform: i
+});
+r({
+  prop: "size",
+  cssProperty: "width",
+  transform: i
+});
+r({
+  prop: "size",
+  cssProperty: "height",
+  transform: i
+});
+const g = r({
+  prop: "boxSizing"
+});
+a(f, s, l, u, x, c, g);
 export {
-  e as default
+  g as boxSizing,
+  u as height,
+  x as maxHeight,
+  s as maxWidth,
+  c as minHeight,
+  l as minWidth,
+  i as sizingTransform,
+  f as width
 };

package/index.es338.js

@@ -1,21 +1,7 @@
-class t {
-  constructor() {
-    this.currentId = null, this.clear = () => {
-      this.currentId !== null && (clearTimeout(this.currentId), this.currentId = null);
-    }, this.disposeEffect = () => this.clear;
-  }
-  static create() {
-    return new t();
-  }
-  /**
-   * Executes `fn` after `delay`, clearing any previously scheduled call.
-   */
-  start(r, e) {
-    this.clear(), this.currentId = setTimeout(() => {
-      this.currentId = null, e();
-    }, r);
-  }
+function u(t) {
+  const n = {};
+  return (e) => (n[e] === void 0 && (n[e] = t(e)), n[e]);
 }
 export {
-  t as Timeout
+  u as default
 };

package/index.es339.js

@@ -1,68 +1,60 @@
-import * as a from "react";
-import { Timeout as o } from "./index.es338.js";
-let n = !0, s = !1;
-const c = new o(), f = {
-  text: !0,
-  search: !0,
-  url: !0,
-  tel: !0,
-  email: !0,
-  password: !0,
-  number: !0,
-  date: !0,
-  month: !0,
-  week: !0,
-  time: !0,
-  datetime: !0,
-  "datetime-local": !0
+import v from "./index.es195.js";
+import f from "./index.es194.js";
+const h = ["values", "unit", "step"], $ = (i) => {
+  const t = Object.keys(i).map((r) => ({
+    key: r,
+    val: i[r]
+  })) || [];
+  return t.sort((r, u) => r.val - u.val), t.reduce((r, u) => f({}, r, {
+    [u.key]: u.val
+  }), {});
 };
-function d(e) {
+function w(i) {
   const {
-    type: t,
-    tagName: r
-  } = e;
-  return !!(r === "INPUT" && f[t] && !e.readOnly || r === "TEXTAREA" && !e.readOnly || e.isContentEditable);
-}
-function h(e) {
-  e.metaKey || e.altKey || e.ctrlKey || (n = !0);
-}
-function i() {
-  n = !1;
-}
-function y() {
-  this.visibilityState === "hidden" && s && (n = !0);
-}
-function m(e) {
-  e.addEventListener("keydown", h, !0), e.addEventListener("mousedown", i, !0), e.addEventListener("pointerdown", i, !0), e.addEventListener("touchstart", i, !0), e.addEventListener("visibilitychange", y, !0);
-}
-function b(e) {
-  const {
-    target: t
-  } = e;
-  try {
-    return t.matches(":focus-visible");
-  } catch {
+    // The breakpoint **start** at this value.
+    // For instance with the first breakpoint xs: [xs, sm).
+    values: t = {
+      xs: 0,
+      // phone
+      sm: 600,
+      // tablet
+      md: 900,
+      // small laptop
+      lg: 1200,
+      // desktop
+      xl: 1536
+      // large screen
+    },
+    unit: r = "px",
+    step: u = 5
+  } = i, m = v(i, h), c = $(t), n = Object.keys(c);
+  function s(e) {
+    return `@media (min-width:${typeof t[e] == "number" ? t[e] : e}${r})`;
   }
-  return n || d(t);
-}
-function w() {
-  const e = a.useCallback((u) => {
-    u != null && m(u.ownerDocument);
-  }, []), t = a.useRef(!1);
-  function r() {
-    return t.current ? (s = !0, c.start(100, () => {
-      s = !1;
-    }), t.current = !1, !0) : !1;
+  function l(e) {
+    return `@media (max-width:${(typeof t[e] == "number" ? t[e] : e) - u / 100}${r})`;
+  }
+  function a(e, o) {
+    const d = n.indexOf(o);
+    return `@media (min-width:${typeof t[e] == "number" ? t[e] : e}${r}) and (max-width:${(d !== -1 && typeof t[n[d]] == "number" ? t[n[d]] : o) - u / 100}${r})`;
+  }
+  function p(e) {
+    return n.indexOf(e) + 1 < n.length ? a(e, n[n.indexOf(e) + 1]) : s(e);
   }
-  function l(u) {
-    return b(u) ? (t.current = !0, !0) : !1;
+  function x(e) {
+    const o = n.indexOf(e);
+    return o === 0 ? s(n[1]) : o === n.length - 1 ? l(n[o]) : a(e, n[n.indexOf(e) + 1]).replace("@media", "@media not all and");
   }
-  return {
-    isFocusVisibleRef: t,
-    onFocus: l,
-    onBlur: r,
-    ref: e
-  };
+  return f({
+    keys: n,
+    values: c,
+    up: s,
+    down: l,
+    between: a,
+    only: p,
+    not: x,
+    unit: r
+  }, m);
 }
 export {
   w as default

package/index.es34.js

@@ -4,7 +4,7 @@ import * as s from "react";
 import { FormProvider as p, Controller as I, useFormContext as x } from "./index.es35.js";
 import { useController as j, useFieldArray as k, useForm as A, useFormState as E, useWatch as W } from "./index.es35.js";
 import { Label as C } from "./index.es38.js";
-import { cn as c } from "./index.es82.js";
+import { cn as c } from "./index.es84.js";
 const D = (e) => /* @__PURE__ */ n(p, { ...e }), f = s.createContext({}), M = ({
   ...e
 }) => /* @__PURE__ */ n(f.Provider, { value: { name: e.name }, children: /* @__PURE__ */ n(I, { ...e }) }), l = () => {

package/index.es340.js

@@ -1,18 +1,15 @@
-import f from "./index.es210.js";
-function b(i, l) {
-  const s = f({}, l);
-  return Object.keys(i).forEach((t) => {
-    if (t.toString().match(/^(components|slots)$/))
-      s[t] = f({}, i[t], s[t]);
-    else if (t.toString().match(/^(componentsProps|slotProps)$/)) {
-      const n = i[t] || {}, c = l[t];
-      s[t] = {}, !c || !Object.keys(c) ? s[t] = n : !n || !Object.keys(n) ? s[t] = c : (s[t] = f({}, c), Object.keys(n).forEach((e) => {
-        s[t][e] = b(n[e], c[e]);
-      }));
-    } else
-      s[t] === void 0 && (s[t] = i[t]);
-  }), s;
+import { createUnarySpacing as c } from "./index.es332.js";
+function u(e = 8) {
+  if (e.mui)
+    return e;
+  const o = c({
+    spacing: e
+  }), n = (...r) => (process.env.NODE_ENV !== "production" && r.length <= 4, (r.length === 0 ? [1] : r).map((a) => {
+    const t = o(a);
+    return typeof t == "number" ? `${t}px` : t;
+  }).join(" "));
+  return n.mui = !0, n;
 }
 export {
-  b as default
+  u as default
 };

package/index.es341.js

@@ -1,17 +1,6 @@
-const t = (e) => e, a = () => {
-  let e = t;
-  return {
-    configure(r) {
-      e = r;
-    },
-    generate(r) {
-      return e(r);
-    },
-    reset() {
-      e = t;
-    }
-  };
-}, n = a(), s = n;
+const s = {
+  borderRadius: 4
+}, a = s;
 export {
-  s as default
+  a as default
 };

package/index.es342.js

@@ -1,18 +1,12 @@
-const s = (t) => t.scrollTop;
-function l(t, e) {
-  var r, a;
-  const {
-    timeout: n,
-    easing: i,
-    style: o = {}
-  } = t;
-  return {
-    duration: (r = o.transitionDuration) != null ? r : typeof n == "number" ? n : n[e.mode] || 0,
-    easing: (a = o.transitionTimingFunction) != null ? a : typeof i == "object" ? i[e.mode] : i,
-    delay: o.transitionDelay
-  };
+import * as n from "react";
+import { T as o } from "./index.es343.js";
+function r(e) {
+  return Object.keys(e).length === 0;
+}
+function s(e = null) {
+  const t = n.useContext(o);
+  return !t || r(t) ? e : t;
 }
 export {
-  l as getTransitionProps,
-  s as reflow
+  s as default
 };