mada-design-system 0.0.9 → 0.0.10

package/index.es340.js

@@ -1,253 +1,19 @@
-import G from "./index.es151.js";
-import U from "./index.es152.js";
-import * as e from "react";
-import _ from "./index.es153.js";
-import { clsx as c } from "./index.es86.js";
-import j from "./index.es165.js";
-import F from "./index.es174.js";
-import J from "./index.es362.js";
-import i from "./index.es342.js";
-import { jsx as k } from "react/jsx-runtime";
-import { keyframes as E } from "./index.es325.js";
-import Q from "./index.es200.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;
+const e = {
+  50: "#e8f5e9",
+  100: "#c8e6c9",
+  200: "#a5d6a7",
+  300: "#81c784",
+  400: "#66bb6a",
+  500: "#4caf50",
+  600: "#43a047",
+  700: "#388e3c",
+  800: "#2e7d32",
+  900: "#1b5e20",
+  A100: "#b9f6ca",
+  A200: "#69f0ae",
+  A400: "#00e676",
+  A700: "#00c853"
+}, a = e;
 export {
-  v as DELAY_RIPPLE,
-  ot as TouchRippleRipple,
-  rt as TouchRippleRoot,
-  Rt as default
+  a as default
 };

package/index.es341.js

@@ -1,10 +1,7 @@
-import s from "./index.es176.js";
-import e from "./index.es175.js";
-function n(t) {
-  return e("MuiButtonBase", t);
+import e from "./index.es369.js";
+function p(o, t) {
+  o.prototype = Object.create(t.prototype), o.prototype.constructor = o, e(o, t);
 }
-const o = s("MuiButtonBase", ["root", "disabled", "focusVisible"]), l = o;
 export {
-  l as default,
-  n as getButtonBaseUtilityClass
+  p as default
 };

package/index.es342.js

@@ -1,5 +1,7 @@
-import e from "./index.es176.js";
-const l = e("MuiTouchRipple", ["root", "ripple", "rippleVisible", "ripplePulsate", "child", "childLeaving", "childPulsate"]), s = l;
+import i from "./index.es370.js";
+function c(s, a) {
+  s.classList ? s.classList.add(a) : i(s, a) || (typeof s.className == "string" ? s.className = s.className + " " + a : s.setAttribute("class", (s.className && s.className.baseVal || "") + " " + a));
+}
 export {
-  s as default
+  c as default
 };

package/index.es343.js

@@ -1,4 +1,9 @@
-import t from "./index.es270.js";
+function c(s, a) {
+  return s.replace(new RegExp("(^|\\s)" + a + "(?:\\s|$)", "g"), "$1").replace(/\s+/g, " ").replace(/^\s*|\s*$/g, "");
+}
+function r(s, a) {
+  s.classList ? s.classList.remove(a) : typeof s.className == "string" ? s.className = c(s.className, a) : s.setAttribute("class", c(s.className && s.className.baseVal || "", a));
+}
 export {
-  t as default
+  r as default
 };

package/index.es344.js

@@ -1,4 +1,338 @@
-import f from "./index.es253.js";
+import C from "./index.es190.js";
+import D from "./index.es341.js";
+import o from "./index.es191.js";
+import v from "react";
+import b from "react-dom";
+import S from "./index.es350.js";
+import { timeoutsShape as R } from "./index.es345.js";
+import O from "./index.es348.js";
+import { forceReflow as k } from "./index.es346.js";
+var x = "unmounted", f = "exited", l = "entering", h = "entered", T = "exiting", p = /* @__PURE__ */ function(d) {
+  D(u, d);
+  function u(i, e) {
+    var t;
+    t = d.call(this, i, e) || this;
+    var n = e, r = n && !n.isMounting ? i.enter : i.appear, s;
+    return t.appearStatus = null, i.in ? r ? (s = f, t.appearStatus = l) : s = h : i.unmountOnExit || i.mountOnEnter ? s = x : s = f, t.state = {
+      status: s
+    }, t.nextCallback = null, t;
+  }
+  u.getDerivedStateFromProps = function(e, t) {
+    var n = e.in;
+    return n && t.status === x ? {
+      status: f
+    } : null;
+  };
+  var a = u.prototype;
+  return a.componentDidMount = function() {
+    this.updateStatus(!0, this.appearStatus);
+  }, a.componentDidUpdate = function(e) {
+    var t = null;
+    if (e !== this.props) {
+      var n = this.state.status;
+      this.props.in ? n !== l && n !== h && (t = l) : (n === l || n === h) && (t = T);
+    }
+    this.updateStatus(!1, t);
+  }, a.componentWillUnmount = function() {
+    this.cancelNextCallback();
+  }, a.getTimeouts = function() {
+    var e = this.props.timeout, t, n, r;
+    return t = n = r = e, e != null && typeof e != "number" && (t = e.exit, n = e.enter, r = e.appear !== void 0 ? e.appear : n), {
+      exit: t,
+      enter: n,
+      appear: r
+    };
+  }, a.updateStatus = function(e, t) {
+    if (e === void 0 && (e = !1), t !== null)
+      if (this.cancelNextCallback(), t === l) {
+        if (this.props.unmountOnExit || this.props.mountOnEnter) {
+          var n = this.props.nodeRef ? this.props.nodeRef.current : b.findDOMNode(this);
+          n && k(n);
+        }
+        this.performEnter(e);
+      } else
+        this.performExit();
+    else
+      this.props.unmountOnExit && this.state.status === f && this.setState({
+        status: x
+      });
+  }, a.performEnter = function(e) {
+    var t = this, n = this.props.enter, r = this.context ? this.context.isMounting : e, s = this.props.nodeRef ? [r] : [b.findDOMNode(this), r], c = s[0], m = s[1], N = this.getTimeouts(), g = r ? N.appear : N.enter;
+    if (!e && !n || S.disabled) {
+      this.safeSetState({
+        status: h
+      }, function() {
+        t.props.onEntered(c);
+      });
+      return;
+    }
+    this.props.onEnter(c, m), this.safeSetState({
+      status: l
+    }, function() {
+      t.props.onEntering(c, m), t.onTransitionEnd(g, function() {
+        t.safeSetState({
+          status: h
+        }, function() {
+          t.props.onEntered(c, m);
+        });
+      });
+    });
+  }, a.performExit = function() {
+    var e = this, t = this.props.exit, n = this.getTimeouts(), r = this.props.nodeRef ? void 0 : b.findDOMNode(this);
+    if (!t || S.disabled) {
+      this.safeSetState({
+        status: f
+      }, function() {
+        e.props.onExited(r);
+      });
+      return;
+    }
+    this.props.onExit(r), this.safeSetState({
+      status: T
+    }, function() {
+      e.props.onExiting(r), e.onTransitionEnd(n.exit, function() {
+        e.safeSetState({
+          status: f
+        }, function() {
+          e.props.onExited(r);
+        });
+      });
+    });
+  }, a.cancelNextCallback = function() {
+    this.nextCallback !== null && (this.nextCallback.cancel(), this.nextCallback = null);
+  }, a.safeSetState = function(e, t) {
+    t = this.setNextCallback(t), this.setState(e, t);
+  }, a.setNextCallback = function(e) {
+    var t = this, n = !0;
+    return this.nextCallback = function(r) {
+      n && (n = !1, t.nextCallback = null, e(r));
+    }, this.nextCallback.cancel = function() {
+      n = !1;
+    }, this.nextCallback;
+  }, a.onTransitionEnd = function(e, t) {
+    this.setNextCallback(t);
+    var n = this.props.nodeRef ? this.props.nodeRef.current : b.findDOMNode(this), r = e == null && !this.props.addEndListener;
+    if (!n || r) {
+      setTimeout(this.nextCallback, 0);
+      return;
+    }
+    if (this.props.addEndListener) {
+      var s = this.props.nodeRef ? [this.nextCallback] : [n, this.nextCallback], c = s[0], m = s[1];
+      this.props.addEndListener(c, m);
+    }
+    e != null && setTimeout(this.nextCallback, e);
+  }, a.render = function() {
+    var e = this.state.status;
+    if (e === x)
+      return null;
+    var t = this.props, n = t.children;
+    t.in, t.mountOnEnter, t.unmountOnExit, t.appear, t.enter, t.exit, t.timeout, t.addEndListener, t.onEnter, t.onEntering, t.onEntered, t.onExit, t.onExiting, t.onExited, t.nodeRef;
+    var r = C(t, ["children", "in", "mountOnEnter", "unmountOnExit", "appear", "enter", "exit", "timeout", "addEndListener", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "nodeRef"]);
+    return (
+      // allows for nested Transitions
+      /* @__PURE__ */ v.createElement(O.Provider, {
+        value: null
+      }, typeof n == "function" ? n(e, r) : v.cloneElement(v.Children.only(n), r))
+    );
+  }, u;
+}(v.Component);
+p.contextType = O;
+p.propTypes = process.env.NODE_ENV !== "production" ? {
+  /**
+   * A React reference to DOM element that need to transition:
+   * https://stackoverflow.com/a/51127130/4671932
+   *
+   *   - When `nodeRef` prop is used, `node` is not passed to callback functions
+   *      (e.g. `onEnter`) because user already has direct access to the node.
+   *   - When changing `key` prop of `Transition` in a `TransitionGroup` a new
+   *     `nodeRef` need to be provided to `Transition` with changed `key` prop
+   *     (see
+   *     [test/CSSTransition-test.js](https://github.com/reactjs/react-transition-group/blob/13435f897b3ab71f6e19d724f145596f5910581c/test/CSSTransition-test.js#L362-L437)).
+   */
+  nodeRef: o.shape({
+    current: typeof Element > "u" ? o.any : function(d, u, a, i, e, t) {
+      var n = d[u];
+      return o.instanceOf(n && "ownerDocument" in n ? n.ownerDocument.defaultView.Element : Element)(d, u, a, i, e, t);
+    }
+  }),
+  /**
+   * A `function` child can be used instead of a React element. This function is
+   * called with the current transition status (`'entering'`, `'entered'`,
+   * `'exiting'`, `'exited'`), which can be used to apply context
+   * specific props to a component.
+   *
+   * ```jsx
+   * <Transition in={this.state.in} timeout={150}>
+   *   {state => (
+   *     <MyComponent className={`fade fade-${state}`} />
+   *   )}
+   * </Transition>
+   * ```
+   */
+  children: o.oneOfType([o.func.isRequired, o.element.isRequired]).isRequired,
+  /**
+   * Show the component; triggers the enter or exit states
+   */
+  in: o.bool,
+  /**
+   * By default the child component is mounted immediately along with
+   * the parent `Transition` component. If you want to "lazy mount" the component on the
+   * first `in={true}` you can set `mountOnEnter`. After the first enter transition the component will stay
+   * mounted, even on "exited", unless you also specify `unmountOnExit`.
+   */
+  mountOnEnter: o.bool,
+  /**
+   * By default the child component stays mounted after it reaches the `'exited'` state.
+   * Set `unmountOnExit` if you'd prefer to unmount the component after it finishes exiting.
+   */
+  unmountOnExit: o.bool,
+  /**
+   * By default the child component does not perform the enter transition when
+   * it first mounts, regardless of the value of `in`. If you want this
+   * behavior, set both `appear` and `in` to `true`.
+   *
+   * > **Note**: there are no special appear states like `appearing`/`appeared`, this prop
+   * > only adds an additional enter transition. However, in the
+   * > `<CSSTransition>` component that first enter transition does result in
+   * > additional `.appear-*` classes, that way you can choose to style it
+   * > differently.
+   */
+  appear: o.bool,
+  /**
+   * Enable or disable enter transitions.
+   */
+  enter: o.bool,
+  /**
+   * Enable or disable exit transitions.
+   */
+  exit: o.bool,
+  /**
+   * The duration of the transition, in milliseconds.
+   * Required unless `addEndListener` is provided.
+   *
+   * You may specify a single timeout for all transitions:
+   *
+   * ```jsx
+   * timeout={500}
+   * ```
+   *
+   * or individually:
+   *
+   * ```jsx
+   * timeout={{
+   *  appear: 500,
+   *  enter: 300,
+   *  exit: 500,
+   * }}
+   * ```
+   *
+   * - `appear` defaults to the value of `enter`
+   * - `enter` defaults to `0`
+   * - `exit` defaults to `0`
+   *
+   * @type {number | { enter?: number, exit?: number, appear?: number }}
+   */
+  timeout: function(u) {
+    var a = R;
+    u.addEndListener || (a = a.isRequired);
+    for (var i = arguments.length, e = new Array(i > 1 ? i - 1 : 0), t = 1; t < i; t++)
+      e[t - 1] = arguments[t];
+    return a.apply(void 0, [u].concat(e));
+  },
+  /**
+   * Add a custom transition end trigger. Called with the transitioning
+   * DOM node and a `done` callback. Allows for more fine grained transition end
+   * logic. Timeouts are still used as a fallback if provided.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * ```jsx
+   * addEndListener={(node, done) => {
+   *   // use the css transitionend event to mark the finish of a transition
+   *   node.addEventListener('transitionend', done, false);
+   * }}
+   * ```
+   */
+  addEndListener: o.func,
+  /**
+   * Callback fired before the "entering" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool) -> void
+   */
+  onEnter: o.func,
+  /**
+   * Callback fired after the "entering" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool)
+   */
+  onEntering: o.func,
+  /**
+   * Callback fired after the "entered" status is applied. An extra parameter
+   * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement, isAppearing: bool) -> void
+   */
+  onEntered: o.func,
+  /**
+   * Callback fired before the "exiting" status is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement) -> void
+   */
+  onExit: o.func,
+  /**
+   * Callback fired after the "exiting" status is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed.
+   *
+   * @type Function(node: HtmlElement) -> void
+   */
+  onExiting: o.func,
+  /**
+   * Callback fired after the "exited" status is applied.
+   *
+   * **Note**: when `nodeRef` prop is passed, `node` is not passed
+   *
+   * @type Function(node: HtmlElement) -> void
+   */
+  onExited: o.func
+} : {};
+function E() {
+}
+p.defaultProps = {
+  in: !1,
+  mountOnEnter: !1,
+  unmountOnExit: !1,
+  appear: !1,
+  enter: !0,
+  exit: !0,
+  onEnter: E,
+  onEntering: E,
+  onEntered: E,
+  onExit: E,
+  onExiting: E,
+  onExited: E
+};
+p.UNMOUNTED = x;
+p.EXITED = f;
+p.ENTERING = l;
+p.ENTERED = h;
+p.EXITING = T;
+const q = p;
 export {
-  f as default
+  h as ENTERED,
+  l as ENTERING,
+  f as EXITED,
+  T as EXITING,
+  x as UNMOUNTED,
+  q as default
 };