@hybridcore/ui 1.4.31 → 1.4.33

package/dist/AccordionDetails-mpRYHtGq.js

@@ -0,0 +1,743 @@
+import { a as i, _ as k } from "./objectWithoutPropertiesLoose-DJteAcBH.js";
+import * as a from "react";
+import { r as le } from "./createStyled-CUatW1r9.js";
+import { P as e } from "./createTheme-DrgvKMA_.js";
+import { g as L, u as B, c as P, a as q, b as pe } from "./useThemeProps-BlXpIqSE.js";
+import { s as E } from "./styled-DkqItiLo.js";
+import { g as F, d as ue } from "./createTheme-DVoJnXAT.js";
+import { jsx as g, jsxs as ne } from "react/jsx-runtime";
+import { P as fe } from "./Paper-DRRYGupP.js";
+import { u as me } from "./useControlled-BYdyS7Pn.js";
+import { T as ge, g as oe } from "./utils-BRsEqTye.js";
+import { u as be } from "./useTheme-B6oa3v5u.js";
+import { e as he, a as xe, B as ye } from "./ButtonBase-CgQC8DUB.js";
+function Ce(o) {
+  return F("MuiCollapse", o);
+}
+L("MuiCollapse", ["root", "horizontal", "vertical", "entered", "hidden", "wrapper", "wrapperInner"]);
+const Ee = ["addEndListener", "children", "className", "collapsedSize", "component", "easing", "in", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting", "orientation", "style", "timeout", "TransitionComponent"], ve = (o) => {
+  const {
+    orientation: n,
+    classes: r
+  } = o, s = {
+    root: ["root", `${n}`],
+    entered: ["entered"],
+    hidden: ["hidden"],
+    wrapper: ["wrapper", `${n}`],
+    wrapperInner: ["wrapperInner", `${n}`]
+  };
+  return q(s, Ce, r);
+}, Re = E("div", {
+  name: "MuiCollapse",
+  slot: "Root",
+  overridesResolver: (o, n) => {
+    const {
+      ownerState: r
+    } = o;
+    return [n.root, n[r.orientation], r.state === "entered" && n.entered, r.state === "exited" && !r.in && r.collapsedSize === "0px" && n.hidden];
+  }
+})(({
+  theme: o,
+  ownerState: n
+}) => i({
+  height: 0,
+  overflow: "hidden",
+  transition: o.transitions.create("height")
+}, n.orientation === "horizontal" && {
+  height: "auto",
+  width: 0,
+  transition: o.transitions.create("width")
+}, n.state === "entered" && i({
+  height: "auto",
+  overflow: "visible"
+}, n.orientation === "horizontal" && {
+  width: "auto"
+}), n.state === "exited" && !n.in && n.collapsedSize === "0px" && {
+  visibility: "hidden"
+})), Te = E("div", {
+  name: "MuiCollapse",
+  slot: "Wrapper",
+  overridesResolver: (o, n) => n.wrapper
+})(({
+  ownerState: o
+}) => i({
+  // Hack to get children with a negative margin to not falsify the height computation.
+  display: "flex",
+  width: "100%"
+}, o.orientation === "horizontal" && {
+  width: "auto",
+  height: "100%"
+})), Ae = E("div", {
+  name: "MuiCollapse",
+  slot: "WrapperInner",
+  overridesResolver: (o, n) => n.wrapperInner
+})(({
+  ownerState: o
+}) => i({
+  width: "100%"
+}, o.orientation === "horizontal" && {
+  width: "auto",
+  height: "100%"
+})), Q = /* @__PURE__ */ a.forwardRef(function(n, r) {
+  const s = B({
+    props: n,
+    name: "MuiCollapse"
+  }), {
+    addEndListener: d,
+    children: u,
+    className: f,
+    collapsedSize: l = "0px",
+    component: y,
+    easing: $,
+    in: b,
+    onEnter: v,
+    onEntered: R,
+    onEntering: T,
+    onExit: M,
+    onExited: c,
+    onExiting: m,
+    orientation: C = "vertical",
+    style: A,
+    timeout: h = ue.standard,
+    // eslint-disable-next-line react/prop-types
+    TransitionComponent: H = ge
+  } = s, V = k(s, Ee), w = i({}, s, {
+    orientation: C,
+    collapsedSize: l
+  }), N = ve(w), Y = be(), Z = a.useRef(), S = a.useRef(null), J = a.useRef(), W = typeof l == "number" ? `${l}px` : l, z = C === "horizontal", I = z ? "width" : "height";
+  a.useEffect(() => () => {
+    clearTimeout(Z.current);
+  }, []);
+  const G = a.useRef(null), te = xe(r, G), O = (t) => (p) => {
+    if (t) {
+      const x = G.current;
+      p === void 0 ? t(x) : t(x, p);
+    }
+  }, K = () => S.current ? S.current[z ? "clientWidth" : "clientHeight"] : 0, re = O((t, p) => {
+    S.current && z && (S.current.style.position = "absolute"), t.style[I] = W, v && v(t, p);
+  }), se = O((t, p) => {
+    const x = K();
+    S.current && z && (S.current.style.position = "");
+    const {
+      duration: j,
+      easing: U
+    } = oe({
+      style: A,
+      timeout: h,
+      easing: $
+    }, {
+      mode: "enter"
+    });
+    if (h === "auto") {
+      const ee = Y.transitions.getAutoHeightDuration(x);
+      t.style.transitionDuration = `${ee}ms`, J.current = ee;
+    } else
+      t.style.transitionDuration = typeof j == "string" ? j : `${j}ms`;
+    t.style[I] = `${x}px`, t.style.transitionTimingFunction = U, T && T(t, p);
+  }), ie = O((t, p) => {
+    t.style[I] = "auto", R && R(t, p);
+  }), ae = O((t) => {
+    t.style[I] = `${K()}px`, M && M(t);
+  }), ce = O(c), de = O((t) => {
+    const p = K(), {
+      duration: x,
+      easing: j
+    } = oe({
+      style: A,
+      timeout: h,
+      easing: $
+    }, {
+      mode: "exit"
+    });
+    if (h === "auto") {
+      const U = Y.transitions.getAutoHeightDuration(p);
+      t.style.transitionDuration = `${U}ms`, J.current = U;
+    } else
+      t.style.transitionDuration = typeof x == "string" ? x : `${x}ms`;
+    t.style[I] = W, t.style.transitionTimingFunction = j, m && m(t);
+  });
+  return /* @__PURE__ */ g(H, i({
+    in: b,
+    onEnter: re,
+    onEntered: ie,
+    onEntering: se,
+    onExit: ae,
+    onExited: ce,
+    onExiting: de,
+    addEndListener: (t) => {
+      h === "auto" && (Z.current = setTimeout(t, J.current || 0)), d && d(G.current, t);
+    },
+    nodeRef: G,
+    timeout: h === "auto" ? null : h
+  }, V, {
+    children: (t, p) => /* @__PURE__ */ g(Re, i({
+      as: y,
+      className: P(N.root, f, {
+        entered: N.entered,
+        exited: !b && W === "0px" && N.hidden
+      }[t]),
+      style: i({
+        [z ? "minWidth" : "minHeight"]: W
+      }, A),
+      ownerState: i({}, w, {
+        state: t
+      }),
+      ref: te
+    }, p, {
+      children: /* @__PURE__ */ g(Te, {
+        ownerState: i({}, w, {
+          state: t
+        }),
+        className: N.wrapper,
+        ref: S,
+        children: /* @__PURE__ */ g(Ae, {
+          ownerState: i({}, w, {
+            state: t
+          }),
+          className: N.wrapperInner,
+          children: u
+        })
+      })
+    }))
+  }));
+});
+process.env.NODE_ENV !== "production" && (Q.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * Add a custom transition end trigger. Called with the transitioning DOM
+   * node and a done callback. Allows for more fine grained transition end
+   * logic. Note: Timeouts are still used as a fallback if provided.
+   */
+  addEndListener: e.func,
+  /**
+   * The content node to be collapsed.
+   */
+  children: e.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The width (horizontal) or height (vertical) of the container when collapsed.
+   * @default '0px'
+   */
+  collapsedSize: e.oneOfType([e.number, e.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: he,
+  /**
+   * The transition timing function.
+   * You may specify a single easing or a object containing enter and exit values.
+   */
+  easing: e.oneOfType([e.shape({
+    enter: e.string,
+    exit: e.string
+  }), e.string]),
+  /**
+   * If `true`, the component will transition in.
+   */
+  in: e.bool,
+  /**
+   * @ignore
+   */
+  onEnter: e.func,
+  /**
+   * @ignore
+   */
+  onEntered: e.func,
+  /**
+   * @ignore
+   */
+  onEntering: e.func,
+  /**
+   * @ignore
+   */
+  onExit: e.func,
+  /**
+   * @ignore
+   */
+  onExited: e.func,
+  /**
+   * @ignore
+   */
+  onExiting: e.func,
+  /**
+   * The transition orientation.
+   * @default 'vertical'
+   */
+  orientation: e.oneOf(["horizontal", "vertical"]),
+  /**
+   * @ignore
+   */
+  style: e.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   *
+   * Set to 'auto' to automatically calculate transition time based on height.
+   * @default duration.standard
+   */
+  timeout: e.oneOfType([e.oneOf(["auto"]), e.number, e.shape({
+    appear: e.number,
+    enter: e.number,
+    exit: e.number
+  })])
+});
+Q.muiSupportAuto = !0;
+const X = /* @__PURE__ */ a.createContext({});
+process.env.NODE_ENV !== "production" && (X.displayName = "AccordionContext");
+function we(o) {
+  return F("MuiAccordion", o);
+}
+const _ = L("MuiAccordion", ["root", "rounded", "expanded", "disabled", "gutters", "region"]), Ne = ["children", "className", "defaultExpanded", "disabled", "disableGutters", "expanded", "onChange", "square", "TransitionComponent", "TransitionProps"], Se = (o) => {
+  const {
+    classes: n,
+    square: r,
+    expanded: s,
+    disabled: d,
+    disableGutters: u
+  } = o;
+  return q({
+    root: ["root", !r && "rounded", s && "expanded", d && "disabled", !u && "gutters"],
+    region: ["region"]
+  }, we, n);
+}, $e = E(fe, {
+  name: "MuiAccordion",
+  slot: "Root",
+  overridesResolver: (o, n) => {
+    const {
+      ownerState: r
+    } = o;
+    return [{
+      [`& .${_.region}`]: n.region
+    }, n.root, !r.square && n.rounded, !r.disableGutters && n.gutters];
+  }
+})(({
+  theme: o
+}) => {
+  const n = {
+    duration: o.transitions.duration.shortest
+  };
+  return {
+    position: "relative",
+    transition: o.transitions.create(["margin"], n),
+    overflowAnchor: "none",
+    // Keep the same scrolling position
+    "&:before": {
+      position: "absolute",
+      left: 0,
+      top: -1,
+      right: 0,
+      height: 1,
+      content: '""',
+      opacity: 1,
+      backgroundColor: (o.vars || o).palette.divider,
+      transition: o.transitions.create(["opacity", "background-color"], n)
+    },
+    "&:first-of-type": {
+      "&:before": {
+        display: "none"
+      }
+    },
+    [`&.${_.expanded}`]: {
+      "&:before": {
+        opacity: 0
+      },
+      "&:first-of-type": {
+        marginTop: 0
+      },
+      "&:last-of-type": {
+        marginBottom: 0
+      },
+      "& + &": {
+        "&:before": {
+          display: "none"
+        }
+      }
+    },
+    [`&.${_.disabled}`]: {
+      backgroundColor: (o.vars || o).palette.action.disabledBackground
+    }
+  };
+}, ({
+  theme: o,
+  ownerState: n
+}) => i({}, !n.square && {
+  borderRadius: 0,
+  "&:first-of-type": {
+    borderTopLeftRadius: (o.vars || o).shape.borderRadius,
+    borderTopRightRadius: (o.vars || o).shape.borderRadius
+  },
+  "&:last-of-type": {
+    borderBottomLeftRadius: (o.vars || o).shape.borderRadius,
+    borderBottomRightRadius: (o.vars || o).shape.borderRadius,
+    // Fix a rendering issue on Edge
+    "@supports (-ms-ime-align: auto)": {
+      borderBottomLeftRadius: 0,
+      borderBottomRightRadius: 0
+    }
+  }
+}, !n.disableGutters && {
+  [`&.${_.expanded}`]: {
+    margin: "16px 0"
+  }
+})), Me = /* @__PURE__ */ a.forwardRef(function(n, r) {
+  const s = B({
+    props: n,
+    name: "MuiAccordion"
+  }), {
+    children: d,
+    className: u,
+    defaultExpanded: f = !1,
+    disabled: l = !1,
+    disableGutters: y = !1,
+    expanded: $,
+    onChange: b,
+    square: v = !1,
+    TransitionComponent: R = Q,
+    TransitionProps: T
+  } = s, M = k(s, Ne), [c, m] = me({
+    controlled: $,
+    default: f,
+    name: "Accordion",
+    state: "expanded"
+  }), C = a.useCallback((N) => {
+    m(!c), b && b(N, !c);
+  }, [c, b, m]), [A, ...h] = a.Children.toArray(d), H = a.useMemo(() => ({
+    expanded: c,
+    disabled: l,
+    disableGutters: y,
+    toggle: C
+  }), [c, l, y, C]), V = i({}, s, {
+    square: v,
+    disabled: l,
+    disableGutters: y,
+    expanded: c
+  }), w = Se(V);
+  return /* @__PURE__ */ ne($e, i({
+    className: P(w.root, u),
+    ref: r,
+    ownerState: V,
+    square: v
+  }, M, {
+    children: [/* @__PURE__ */ g(X.Provider, {
+      value: H,
+      children: A
+    }), /* @__PURE__ */ g(R, i({
+      in: c,
+      timeout: "auto"
+    }, T, {
+      children: /* @__PURE__ */ g("div", {
+        "aria-labelledby": A.props.id,
+        id: A.props["aria-controls"],
+        role: "region",
+        className: w.region,
+        children: h
+      })
+    }))]
+  }));
+});
+process.env.NODE_ENV !== "production" && (Me.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * The content of the component.
+   */
+  children: pe(e.node.isRequired, (o) => {
+    const n = a.Children.toArray(o.children)[0];
+    return le.isFragment(n) ? new Error("MUI: The Accordion doesn't accept a Fragment as a child. Consider providing an array instead.") : /* @__PURE__ */ a.isValidElement(n) ? null : new Error("MUI: Expected the first child of Accordion to be a valid element.");
+  }),
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * If `true`, expands the accordion by default.
+   * @default false
+   */
+  defaultExpanded: e.bool,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: e.bool,
+  /**
+   * If `true`, it removes the margin between two expanded accordion items and the increase of height.
+   * @default false
+   */
+  disableGutters: e.bool,
+  /**
+   * If `true`, expands the accordion, otherwise collapse it.
+   * Setting this prop enables control over the accordion.
+   */
+  expanded: e.bool,
+  /**
+   * Callback fired when the expand/collapse state is changed.
+   *
+   * @param {React.SyntheticEvent} event The event source of the callback. **Warning**: This is a generic event not a change event.
+   * @param {boolean} expanded The `expanded` state of the accordion.
+   */
+  onChange: e.func,
+  /**
+   * If `true`, rounded corners are disabled.
+   * @default false
+   */
+  square: e.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The component used for the transition.
+   * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.
+   * @default Collapse
+   */
+  TransitionComponent: e.elementType,
+  /**
+   * Props applied to the transition element.
+   * By default, the element is based on this [`Transition`](http://reactcommunity.org/react-transition-group/transition/) component.
+   */
+  TransitionProps: e.object
+});
+function Oe(o) {
+  return F("MuiAccordionSummary", o);
+}
+const D = L("MuiAccordionSummary", ["root", "expanded", "focusVisible", "disabled", "gutters", "contentGutters", "content", "expandIconWrapper"]), De = ["children", "className", "expandIcon", "focusVisibleClassName", "onClick"], ze = (o) => {
+  const {
+    classes: n,
+    expanded: r,
+    disabled: s,
+    disableGutters: d
+  } = o;
+  return q({
+    root: ["root", r && "expanded", s && "disabled", !d && "gutters"],
+    focusVisible: ["focusVisible"],
+    content: ["content", r && "expanded", !d && "contentGutters"],
+    expandIconWrapper: ["expandIconWrapper", r && "expanded"]
+  }, Oe, n);
+}, Ie = E(ye, {
+  name: "MuiAccordionSummary",
+  slot: "Root",
+  overridesResolver: (o, n) => n.root
+})(({
+  theme: o,
+  ownerState: n
+}) => {
+  const r = {
+    duration: o.transitions.duration.shortest
+  };
+  return i({
+    display: "flex",
+    minHeight: 48,
+    padding: o.spacing(0, 2),
+    transition: o.transitions.create(["min-height", "background-color"], r),
+    [`&.${D.focusVisible}`]: {
+      backgroundColor: (o.vars || o).palette.action.focus
+    },
+    [`&.${D.disabled}`]: {
+      opacity: (o.vars || o).palette.action.disabledOpacity
+    },
+    [`&:hover:not(.${D.disabled})`]: {
+      cursor: "pointer"
+    }
+  }, !n.disableGutters && {
+    [`&.${D.expanded}`]: {
+      minHeight: 64
+    }
+  });
+}), je = E("div", {
+  name: "MuiAccordionSummary",
+  slot: "Content",
+  overridesResolver: (o, n) => n.content
+})(({
+  theme: o,
+  ownerState: n
+}) => i({
+  display: "flex",
+  flexGrow: 1,
+  margin: "12px 0"
+}, !n.disableGutters && {
+  transition: o.transitions.create(["margin"], {
+    duration: o.transitions.duration.shortest
+  }),
+  [`&.${D.expanded}`]: {
+    margin: "20px 0"
+  }
+})), Pe = E("div", {
+  name: "MuiAccordionSummary",
+  slot: "ExpandIconWrapper",
+  overridesResolver: (o, n) => n.expandIconWrapper
+})(({
+  theme: o
+}) => ({
+  display: "flex",
+  color: (o.vars || o).palette.action.active,
+  transform: "rotate(0deg)",
+  transition: o.transitions.create("transform", {
+    duration: o.transitions.duration.shortest
+  }),
+  [`&.${D.expanded}`]: {
+    transform: "rotate(180deg)"
+  }
+})), Ve = /* @__PURE__ */ a.forwardRef(function(n, r) {
+  const s = B({
+    props: n,
+    name: "MuiAccordionSummary"
+  }), {
+    children: d,
+    className: u,
+    expandIcon: f,
+    focusVisibleClassName: l,
+    onClick: y
+  } = s, $ = k(s, De), {
+    disabled: b = !1,
+    disableGutters: v,
+    expanded: R,
+    toggle: T
+  } = a.useContext(X), M = (C) => {
+    T && T(C), y && y(C);
+  }, c = i({}, s, {
+    expanded: R,
+    disabled: b,
+    disableGutters: v
+  }), m = ze(c);
+  return /* @__PURE__ */ ne(Ie, i({
+    focusRipple: !1,
+    disableRipple: !0,
+    disabled: b,
+    component: "div",
+    "aria-expanded": R,
+    className: P(m.root, u),
+    focusVisibleClassName: P(m.focusVisible, l),
+    onClick: M,
+    ref: r,
+    ownerState: c
+  }, $, {
+    children: [/* @__PURE__ */ g(je, {
+      className: m.content,
+      ownerState: c,
+      children: d
+    }), f && /* @__PURE__ */ g(Pe, {
+      className: m.expandIconWrapper,
+      ownerState: c,
+      children: f
+    })]
+  }));
+});
+process.env.NODE_ENV !== "production" && (Ve.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * The content of the component.
+   */
+  children: e.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The icon to display as the expand indicator.
+   */
+  expandIcon: e.node,
+  /**
+   * This prop can help identify which element has keyboard focus.
+   * The class name will be applied when the element gains the focus through keyboard interaction.
+   * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).
+   * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).
+   * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components
+   * if needed.
+   */
+  focusVisibleClassName: e.string,
+  /**
+   * @ignore
+   */
+  onClick: e.func,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
+});
+function We(o) {
+  return F("MuiAccordionDetails", o);
+}
+L("MuiAccordionDetails", ["root"]);
+const Ge = ["className"], Ue = (o) => {
+  const {
+    classes: n
+  } = o;
+  return q({
+    root: ["root"]
+  }, We, n);
+}, _e = E("div", {
+  name: "MuiAccordionDetails",
+  slot: "Root",
+  overridesResolver: (o, n) => n.root
+})(({
+  theme: o
+}) => ({
+  padding: o.spacing(1, 2, 2)
+})), ke = /* @__PURE__ */ a.forwardRef(function(n, r) {
+  const s = B({
+    props: n,
+    name: "MuiAccordionDetails"
+  }), {
+    className: d
+  } = s, u = k(s, Ge), f = s, l = Ue(f);
+  return /* @__PURE__ */ g(_e, i({
+    className: P(l.root, d),
+    ref: r,
+    ownerState: f
+  }, u));
+});
+process.env.NODE_ENV !== "production" && (ke.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * The content of the component.
+   */
+  children: e.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
+});
+export {
+  Me as A,
+  Ve as a,
+  ke as b
+};