@hybridcore/ui 1.0.1 → 1.1.0

package/dist/components/card/index.js

@@ -1,30 +1,37 @@
-import { jsx as l, jsxs as C } from "react/jsx-runtime";
-import { g as _, a as $, s as M, _ as c, u as j, b as w, c as T, P as o, d as E, e as q, f as k, h as Z, L as G, B as O, i as J, j as K, k as Q, l as X } from "../../styled-BzmaMjR_.js";
-import * as x from "react";
-function Y(e) {
-  return $("MuiCardActions", e);
+import { jsx as o, jsxs as c } from "react/jsx-runtime";
+import { Box as p, Avatar as b } from "@mui/material";
+import { LandscapeCardRoot as A, LandscapeInfoBox as I, LandscapeCardExtraActions as P, PortraitCardRoot as _, PortraitCardExtraActions as L } from "./styled.js";
+import { a as m, _ as v } from "../../extends-C3382pL0.js";
+import * as M from "react";
+import { P as t } from "../../createTheme-agWfFD64.js";
+import { g as w, u as O, c as N, a as S, b as B } from "../../chainPropTypes-DtBfUj5o.js";
+import { g as T, s as j } from "../../styled-Iq9jsO4F.js";
+import { C as y } from "../../CardContent-C8PxkJz4.js";
+import { T as d } from "../../Typography-XIiVCSto.js";
+function U(e) {
+  return T("MuiCardActions", e);
 }
-_("MuiCardActions", ["root", "spacing"]);
-const ee = ["disableSpacing", "className"], oe = (e) => {
+w("MuiCardActions", ["root", "spacing"]);
+const D = ["disableSpacing", "className"], H = (e) => {
   const {
-    classes: t,
+    classes: i,
     disableSpacing: n
   } = e;
-  return E({
+  return S({
     root: ["root", !n && "spacing"]
-  }, Y, t);
-}, te = M("div", {
+  }, U, i);
+}, z = j("div", {
   name: "MuiCardActions",
   slot: "Root",
-  overridesResolver: (e, t) => {
+  overridesResolver: (e, i) => {
     const {
       ownerState: n
     } = e;
-    return [t.root, !n.disableSpacing && t.spacing];
+    return [i.root, !n.disableSpacing && i.spacing];
   }
 })(({
   ownerState: e
-}) => c({
+}) => m({
   display: "flex",
   alignItems: "center",
   padding: 8
@@ -32,23 +39,23 @@ const ee = ["disableSpacing", "className"], oe = (e) => {
   "& > :not(style) ~ :not(style)": {
     marginLeft: 8
   }
-})), V = /* @__PURE__ */ x.forwardRef(function(t, n) {
-  const r = j({
-    props: t,
+})), k = /* @__PURE__ */ M.forwardRef(function(i, n) {
+  const r = O({
+    props: i,
     name: "MuiCardActions"
   }), {
     disableSpacing: s = !1,
-    className: a
-  } = r, d = w(r, ee), i = c({}, r, {
+    className: h
+  } = r, a = v(r, D), l = m({}, r, {
     disableSpacing: s
-  }), g = oe(i);
-  return /* @__PURE__ */ l(te, c({
-    className: T(g.root, a),
-    ownerState: i,
+  }), u = H(l);
+  return /* @__PURE__ */ o(z, m({
+    className: N(u.root, h),
+    ownerState: l,
     ref: n
-  }, d));
+  }, a));
 });
-process.env.NODE_ENV !== "production" && (V.propTypes = {
+process.env.NODE_ENV !== "production" && (k.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -56,117 +63,53 @@ process.env.NODE_ENV !== "production" && (V.propTypes = {
   /**
    * The content of the component.
    */
-  children: o.node,
+  children: t.node,
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: o.object,
+  classes: t.object,
   /**
    * @ignore
    */
-  className: o.string,
+  className: t.string,
   /**
    * If `true`, the actions do not have additional margin.
    * @default false
    */
-  disableSpacing: o.bool,
+  disableSpacing: t.bool,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
+  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object])
 });
-function ne(e) {
-  return $("MuiCardContent", e);
+function $(e) {
+  return T("MuiCardMedia", e);
 }
-_("MuiCardContent", ["root"]);
-const re = ["className", "component"], se = (e) => {
+w("MuiCardMedia", ["root", "media", "img"]);
+const V = ["children", "className", "component", "image", "src", "style"], F = (e) => {
   const {
-    classes: t
-  } = e;
-  return E({
-    root: ["root"]
-  }, ne, t);
-}, ie = M("div", {
-  name: "MuiCardContent",
-  slot: "Root",
-  overridesResolver: (e, t) => t.root
-})(() => ({
-  padding: 16,
-  "&:last-child": {
-    paddingBottom: 24
-  }
-})), D = /* @__PURE__ */ x.forwardRef(function(t, n) {
-  const r = j({
-    props: t,
-    name: "MuiCardContent"
-  }), {
-    className: s,
-    component: a = "div"
-  } = r, d = w(r, re), i = c({}, r, {
-    component: a
-  }), g = se(i);
-  return /* @__PURE__ */ l(ie, c({
-    as: a,
-    className: T(g.root, s),
-    ownerState: i,
-    ref: n
-  }, d));
-});
-process.env.NODE_ENV !== "production" && (D.propTypes = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * The content of the component.
-   */
-  children: o.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: o.object,
-  /**
-   * @ignore
-   */
-  className: o.string,
-  /**
-   * The component used for the root node.
-   * Either a string to use a HTML element or a component.
-   */
-  component: o.elementType,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
-});
-function ae(e) {
-  return $("MuiCardMedia", e);
-}
-_("MuiCardMedia", ["root", "media", "img"]);
-const le = ["children", "className", "component", "image", "src", "style"], ce = (e) => {
-  const {
-    classes: t,
+    classes: i,
     isMediaComponent: n,
     isImageComponent: r
   } = e;
-  return E({
+  return S({
     root: ["root", n && "media", r && "img"]
-  }, ae, t);
-}, de = M("div", {
+  }, $, i);
+}, G = j("div", {
   name: "MuiCardMedia",
   slot: "Root",
-  overridesResolver: (e, t) => {
+  overridesResolver: (e, i) => {
     const {
       ownerState: n
     } = e, {
       isMediaComponent: r,
       isImageComponent: s
     } = n;
-    return [t.root, r && t.media, s && t.img];
+    return [i.root, r && i.media, s && i.img];
   }
 })(({
   ownerState: e
-}) => c({
+}) => m({
   display: "block",
   backgroundSize: "cover",
   backgroundRepeat: "no-repeat",
@@ -176,37 +119,37 @@ const le = ["children", "className", "component", "image", "src", "style"], ce =
 }, e.isImageComponent && {
   // ⚠️ object-fit is not supported by IE11.
   objectFit: "cover"
-})), pe = ["video", "audio", "picture", "iframe", "img"], ue = ["picture", "img"], F = /* @__PURE__ */ x.forwardRef(function(t, n) {
-  const r = j({
-    props: t,
+})), q = ["video", "audio", "picture", "iframe", "img"], J = ["picture", "img"], x = /* @__PURE__ */ M.forwardRef(function(i, n) {
+  const r = O({
+    props: i,
     name: "MuiCardMedia"
   }), {
     children: s,
-    className: a,
-    component: d = "div",
-    image: i,
-    src: g,
+    className: h,
+    component: a = "div",
+    image: l,
+    src: u,
     style: f
-  } = r, y = w(r, le), m = pe.indexOf(d) !== -1, p = !m && i ? c({
-    backgroundImage: `url("${i}")`
-  }, f) : f, u = c({}, r, {
-    component: d,
-    isMediaComponent: m,
-    isImageComponent: ue.indexOf(d) !== -1
-  }), h = ce(u);
-  return /* @__PURE__ */ l(de, c({
-    className: T(h.root, a),
-    as: d,
-    role: !m && i ? "img" : void 0,
+  } = r, E = v(r, V), g = q.indexOf(a) !== -1, R = !g && l ? m({
+    backgroundImage: `url("${l}")`
+  }, f) : f, C = m({}, r, {
+    component: a,
+    isMediaComponent: g,
+    isImageComponent: J.indexOf(a) !== -1
+  }), W = F(C);
+  return /* @__PURE__ */ o(G, m({
+    className: N(W.root, h),
+    as: a,
+    role: !g && l ? "img" : void 0,
     ref: n,
-    style: p,
-    ownerState: u,
-    src: m ? i || g : void 0
-  }, y, {
+    style: R,
+    ownerState: C,
+    src: g ? l || u : void 0
+  }, E, {
     children: s
   }));
 });
-process.env.NODE_ENV !== "production" && (F.propTypes = {
+process.env.NODE_ENV !== "production" && (x.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -214,735 +157,54 @@ process.env.NODE_ENV !== "production" && (F.propTypes = {
   /**
    * The content of the component.
    */
-  children: q(o.node, (e) => !e.children && !e.image && !e.src && !e.component ? new Error("MUI: Either `children`, `image`, `src` or `component` prop must be specified.") : null),
+  children: B(t.node, (e) => !e.children && !e.image && !e.src && !e.component ? new Error("MUI: Either `children`, `image`, `src` or `component` prop must be specified.") : null),
   /**
    * Override or extend the styles applied to the component.
    */
-  classes: o.object,
+  classes: t.object,
   /**
    * @ignore
    */
-  className: o.string,
+  className: t.string,
   /**
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
-  component: o.elementType,
+  component: t.elementType,
   /**
    * Image to be displayed as a background image.
    * Either `image` or `src` prop must be specified.
    * Note that caller must specify height otherwise the image will not be visible.
    */
-  image: o.string,
+  image: t.string,
   /**
    * An alias for `image` property.
    * Available only with media components.
    * Media components: `video`, `audio`, `picture`, `iframe`, `img`.
    */
-  src: o.string,
+  src: t.string,
   /**
    * @ignore
    */
-  style: o.object,
+  style: t.object,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object])
-});
-function fe(e) {
-  return $("MuiTypography", e);
-}
-_("MuiTypography", ["root", "h1", "h2", "h3", "h4", "h5", "h6", "subtitle1", "subtitle2", "body1", "body2", "inherit", "button", "caption", "overline", "alignLeft", "alignRight", "alignCenter", "alignJustify", "noWrap", "gutterBottom", "paragraph"]);
-const me = ["align", "className", "component", "gutterBottom", "noWrap", "paragraph", "variant", "variantMapping"], ge = (e) => {
-  const {
-    align: t,
-    gutterBottom: n,
-    noWrap: r,
-    paragraph: s,
-    variant: a,
-    classes: d
-  } = e, i = {
-    root: ["root", a, e.align !== "inherit" && `align${k(t)}`, n && "gutterBottom", r && "noWrap", s && "paragraph"]
-  };
-  return E(i, fe, d);
-}, he = M("span", {
-  name: "MuiTypography",
-  slot: "Root",
-  overridesResolver: (e, t) => {
-    const {
-      ownerState: n
-    } = e;
-    return [t.root, n.variant && t[n.variant], n.align !== "inherit" && t[`align${k(n.align)}`], n.noWrap && t.noWrap, n.gutterBottom && t.gutterBottom, n.paragraph && t.paragraph];
-  }
-})(({
-  theme: e,
-  ownerState: t
-}) => c({
-  margin: 0
-}, t.variant === "inherit" && {
-  // Some elements, like <button> on Chrome have default font that doesn't inherit, reset this.
-  font: "inherit"
-}, t.variant !== "inherit" && e.typography[t.variant], t.align !== "inherit" && {
-  textAlign: t.align
-}, t.noWrap && {
-  overflow: "hidden",
-  textOverflow: "ellipsis",
-  whiteSpace: "nowrap"
-}, t.gutterBottom && {
-  marginBottom: "0.35em"
-}, t.paragraph && {
-  marginBottom: 16
-})), L = {
-  h1: "h1",
-  h2: "h2",
-  h3: "h3",
-  h4: "h4",
-  h5: "h5",
-  h6: "h6",
-  subtitle1: "h6",
-  subtitle2: "h6",
-  body1: "p",
-  body2: "p",
-  inherit: "p"
-}, ye = {
-  primary: "primary.main",
-  textPrimary: "text.primary",
-  secondary: "secondary.main",
-  textSecondary: "text.secondary",
-  error: "error.main"
-}, ve = (e) => ye[e] || e, S = /* @__PURE__ */ x.forwardRef(function(t, n) {
-  const r = j({
-    props: t,
-    name: "MuiTypography"
-  }), s = ve(r.color), a = Z(c({}, r, {
-    color: s
-  })), {
-    align: d = "inherit",
-    className: i,
-    component: g,
-    gutterBottom: f = !1,
-    noWrap: y = !1,
-    paragraph: m = !1,
-    variant: p = "body1",
-    variantMapping: u = L
-  } = a, h = w(a, me), v = c({}, a, {
-    align: d,
-    color: s,
-    className: i,
-    component: g,
-    gutterBottom: f,
-    noWrap: y,
-    paragraph: m,
-    variant: p,
-    variantMapping: u
-  }), b = g || (m ? "p" : u[p] || L[p]) || "span", N = ge(v);
-  return /* @__PURE__ */ l(he, c({
-    as: b,
-    ref: n,
-    ownerState: v,
-    className: T(N.root, i)
-  }, h));
-});
-process.env.NODE_ENV !== "production" && (S.propTypes = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * Set the text-align on the component.
-   * @default 'inherit'
-   */
-  align: o.oneOf(["center", "inherit", "justify", "left", "right"]),
-  /**
-   * The content of the component.
-   */
-  children: o.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: o.object,
-  /**
-   * @ignore
-   */
-  className: o.string,
-  /**
-   * The component used for the root node.
-   * Either a string to use a HTML element or a component.
-   */
-  component: o.elementType,
-  /**
-   * If `true`, the text will have a bottom margin.
-   * @default false
-   */
-  gutterBottom: o.bool,
-  /**
-   * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.
-   *
-   * Note that text overflow can only happen with block or inline-block level elements
-   * (the element needs to have a width in order to overflow).
-   * @default false
-   */
-  noWrap: o.bool,
-  /**
-   * If `true`, the element will be a paragraph element.
-   * @default false
-   */
-  paragraph: o.bool,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
-  /**
-   * Applies the theme typography styles.
-   * @default 'body1'
-   */
-  variant: o.oneOfType([o.oneOf(["body1", "body2", "button", "caption", "h1", "h2", "h3", "h4", "h5", "h6", "inherit", "overline", "subtitle1", "subtitle2"]), o.string]),
-  /**
-   * The component maps the variant prop to a range of different HTML element types.
-   * For instance, subtitle1 to `<h6>`.
-   * If you wish to change that mapping, you can provide your own.
-   * Alternatively, you can use the `component` prop.
-   * @default {
-   *   h1: 'h1',
-   *   h2: 'h2',
-   *   h3: 'h3',
-   *   h4: 'h4',
-   *   h5: 'h5',
-   *   h6: 'h6',
-   *   subtitle1: 'h6',
-   *   subtitle2: 'h6',
-   *   body1: 'p',
-   *   body2: 'p',
-   *   inherit: 'p',
-   * }
-   */
-  variantMapping: o.object
-});
-function be(e, t) {
-  typeof e == "function" ? e(t) : e && (e.current = t);
-}
-function xe(...e) {
-  return x.useMemo(() => e.every((t) => t == null) ? null : (t) => {
-    e.forEach((n) => {
-      be(n, t);
-    });
-  }, e);
-}
-function Ce(e) {
-  return typeof e == "string";
-}
-function Se(e, t, n) {
-  return e === void 0 || Ce(e) ? t : c({}, t, {
-    ownerState: c({}, t.ownerState, n)
-  });
-}
-function we(e, t = []) {
-  if (e === void 0)
-    return {};
-  const n = {};
-  return Object.keys(e).filter((r) => r.match(/^on[A-Z]/) && typeof e[r] == "function" && !t.includes(r)).forEach((r) => {
-    n[r] = e[r];
-  }), n;
-}
-function H(e) {
-  if (e === void 0)
-    return {};
-  const t = {};
-  return Object.keys(e).filter((n) => !(n.match(/^on[A-Z]/) && typeof e[n] == "function")).forEach((n) => {
-    t[n] = e[n];
-  }), t;
-}
-function Ne(e) {
-  const {
-    getSlotProps: t,
-    additionalProps: n,
-    externalSlotProps: r,
-    externalForwardedProps: s,
-    className: a
-  } = e;
-  if (!t) {
-    const u = T(n == null ? void 0 : n.className, a, s == null ? void 0 : s.className, r == null ? void 0 : r.className), h = c({}, n == null ? void 0 : n.style, s == null ? void 0 : s.style, r == null ? void 0 : r.style), v = c({}, n, s, r);
-    return u.length > 0 && (v.className = u), Object.keys(h).length > 0 && (v.style = h), {
-      props: v,
-      internalRef: void 0
-    };
-  }
-  const d = we(c({}, s, r)), i = H(r), g = H(s), f = t(d), y = T(f == null ? void 0 : f.className, n == null ? void 0 : n.className, a, s == null ? void 0 : s.className, r == null ? void 0 : r.className), m = c({}, f == null ? void 0 : f.style, n == null ? void 0 : n.style, s == null ? void 0 : s.style, r == null ? void 0 : r.style), p = c({}, f, n, g, i);
-  return y.length > 0 && (p.className = y), Object.keys(m).length > 0 && (p.style = m), {
-    props: p,
-    internalRef: f.ref
-  };
-}
-function Oe(e, t, n) {
-  return typeof e == "function" ? e(t, n) : e;
-}
-function Te(e) {
-  return $("MuiSvgIcon", e);
-}
-_("MuiSvgIcon", ["root", "colorPrimary", "colorSecondary", "colorAction", "colorError", "colorDisabled", "fontSizeInherit", "fontSizeSmall", "fontSizeMedium", "fontSizeLarge"]);
-const Me = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"], Re = (e) => {
-  const {
-    color: t,
-    fontSize: n,
-    classes: r
-  } = e, s = {
-    root: ["root", t !== "inherit" && `color${k(t)}`, `fontSize${k(n)}`]
-  };
-  return E(s, Te, r);
-}, Pe = M("svg", {
-  name: "MuiSvgIcon",
-  slot: "Root",
-  overridesResolver: (e, t) => {
-    const {
-      ownerState: n
-    } = e;
-    return [t.root, n.color !== "inherit" && t[`color${k(n.color)}`], t[`fontSize${k(n.fontSize)}`]];
-  }
-})(({
-  theme: e,
-  ownerState: t
-}) => {
-  var n, r, s, a, d, i, g, f, y, m, p, u, h;
-  return {
-    userSelect: "none",
-    width: "1em",
-    height: "1em",
-    display: "inline-block",
-    // the <svg> will define the property that has `currentColor`
-    // for example heroicons uses fill="none" and stroke="currentColor"
-    fill: t.hasSvgAsChild ? void 0 : "currentColor",
-    flexShrink: 0,
-    transition: (n = e.transitions) == null || (r = n.create) == null ? void 0 : r.call(n, "fill", {
-      duration: (s = e.transitions) == null || (s = s.duration) == null ? void 0 : s.shorter
-    }),
-    fontSize: {
-      inherit: "inherit",
-      small: ((a = e.typography) == null || (d = a.pxToRem) == null ? void 0 : d.call(a, 20)) || "1.25rem",
-      medium: ((i = e.typography) == null || (g = i.pxToRem) == null ? void 0 : g.call(i, 24)) || "1.5rem",
-      large: ((f = e.typography) == null || (y = f.pxToRem) == null ? void 0 : y.call(f, 35)) || "2.1875rem"
-    }[t.fontSize],
-    // TODO v5 deprecate, v6 remove for sx
-    color: (m = (p = (e.vars || e).palette) == null || (p = p[t.color]) == null ? void 0 : p.main) != null ? m : {
-      action: (u = (e.vars || e).palette) == null || (u = u.action) == null ? void 0 : u.active,
-      disabled: (h = (e.vars || e).palette) == null || (h = h.action) == null ? void 0 : h.disabled,
-      inherit: void 0
-    }[t.color]
-  };
-}), z = /* @__PURE__ */ x.forwardRef(function(t, n) {
-  const r = j({
-    props: t,
-    name: "MuiSvgIcon"
-  }), {
-    children: s,
-    className: a,
-    color: d = "inherit",
-    component: i = "svg",
-    fontSize: g = "medium",
-    htmlColor: f,
-    inheritViewBox: y = !1,
-    titleAccess: m,
-    viewBox: p = "0 0 24 24"
-  } = r, u = w(r, Me), h = /* @__PURE__ */ x.isValidElement(s) && s.type === "svg", v = c({}, r, {
-    color: d,
-    component: i,
-    fontSize: g,
-    instanceFontSize: t.fontSize,
-    inheritViewBox: y,
-    viewBox: p,
-    hasSvgAsChild: h
-  }), b = {};
-  y || (b.viewBox = p);
-  const N = Re(v);
-  return /* @__PURE__ */ C(Pe, c({
-    as: i,
-    className: T(N.root, a),
-    focusable: "false",
-    color: f,
-    "aria-hidden": m ? void 0 : !0,
-    role: m ? "img" : void 0,
-    ref: n
-  }, b, u, h && s.props, {
-    ownerState: v,
-    children: [h ? s.props.children : s, m ? /* @__PURE__ */ l("title", {
-      children: m
-    }) : null]
-  }));
-});
-process.env.NODE_ENV !== "production" && (z.propTypes = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * Node passed into the SVG element.
-   */
-  children: o.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: o.object,
-  /**
-   * @ignore
-   */
-  className: o.string,
-  /**
-   * The color of the component.
-   * It supports both default and custom theme colors, which can be added as shown in the
-   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
-   * You can use the `htmlColor` prop to apply a color attribute to the SVG element.
-   * @default 'inherit'
-   */
-  color: o.oneOfType([o.oneOf(["inherit", "action", "disabled", "primary", "secondary", "error", "info", "success", "warning"]), o.string]),
-  /**
-   * The component used for the root node.
-   * Either a string to use a HTML element or a component.
-   */
-  component: o.elementType,
-  /**
-   * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.
-   * @default 'medium'
-   */
-  fontSize: o.oneOfType([o.oneOf(["inherit", "large", "medium", "small"]), o.string]),
-  /**
-   * Applies a color attribute to the SVG element.
-   */
-  htmlColor: o.string,
-  /**
-   * If `true`, the root node will inherit the custom `component`'s viewBox and the `viewBox`
-   * prop will be ignored.
-   * Useful when you want to reference a custom `component` and have `SvgIcon` pass that
-   * `component`'s viewBox to the root node.
-   * @default false
-   */
-  inheritViewBox: o.bool,
-  /**
-   * The shape-rendering attribute. The behavior of the different options is described on the
-   * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering).
-   * If you are having issues with blurry icons you should investigate this prop.
-   */
-  shapeRendering: o.string,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
-  /**
-   * Provides a human-readable title for the element that contains it.
-   * https://www.w3.org/TR/SVG-access/#Equivalent
-   */
-  titleAccess: o.string,
-  /**
-   * Allows you to redefine what the coordinates without units mean inside an SVG element.
-   * For example, if the SVG element is 500 (width) by 200 (height),
-   * and you pass viewBox="0 0 50 20",
-   * this means that the coordinates inside the SVG will go from the top left corner (0,0)
-   * to bottom right (50,20) and each unit will be worth 10px.
-   * @default '0 0 24 24'
-   */
-  viewBox: o.string
-});
-z.muiName = "SvgIcon";
-function ke(e, t) {
-  function n(r, s) {
-    return /* @__PURE__ */ l(z, c({
-      "data-testid": `${t}Icon`,
-      ref: s
-    }, r, {
-      children: e
-    }));
-  }
-  return process.env.NODE_ENV !== "production" && (n.displayName = `${t}Icon`), n.muiName = z.muiName, /* @__PURE__ */ x.memo(/* @__PURE__ */ x.forwardRef(n));
-}
-const _e = ["className", "elementType", "ownerState", "externalForwardedProps", "getSlotOwnerState", "internalForwardedProps"], $e = ["component", "slots", "slotProps"], je = ["component"];
-function Ee(e, t) {
-  const {
-    className: n,
-    elementType: r,
-    ownerState: s,
-    externalForwardedProps: a,
-    getSlotOwnerState: d,
-    internalForwardedProps: i
-  } = t, g = w(t, _e), {
-    component: f,
-    slots: y = {
-      [e]: void 0
-    },
-    slotProps: m = {
-      [e]: void 0
-    }
-  } = a;
-  w(a, $e);
-  const p = y[e] || r, u = Oe(m[e], s), h = Ne(c({
-    className: n
-  }, g, {
-    externalForwardedProps: void 0,
-    externalSlotProps: u
-  })), {
-    props: {
-      component: v
-    },
-    internalRef: b
-  } = h, N = w(h.props, je), I = xe(b, u == null ? void 0 : u.ref, t.ref), A = d ? d(N) : {}, R = c({}, s, A), P = v, B = Se(p, c({}, e === "root", !y[e] && i, N, P && {
-    as: P
-  }, {
-    ref: I
-  }), R);
-  return Object.keys(A).forEach((W) => {
-    delete B[W];
-  }), [p, B];
-}
-const Ae = ke(/* @__PURE__ */ l("path", {
-  d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
-}), "Person");
-function Ie(e) {
-  return $("MuiAvatar", e);
-}
-_("MuiAvatar", ["root", "colorDefault", "circular", "rounded", "square", "img", "fallback"]);
-const Be = ["alt", "children", "className", "component", "slots", "slotProps", "imgProps", "sizes", "src", "srcSet", "variant"], ze = (e) => {
-  const {
-    classes: t,
-    variant: n,
-    colorDefault: r
-  } = e;
-  return E({
-    root: ["root", n, r && "colorDefault"],
-    img: ["img"],
-    fallback: ["fallback"]
-  }, Ie, t);
-}, We = M("div", {
-  name: "MuiAvatar",
-  slot: "Root",
-  overridesResolver: (e, t) => {
-    const {
-      ownerState: n
-    } = e;
-    return [t.root, t[n.variant], n.colorDefault && t.colorDefault];
-  }
-})(({
-  theme: e
-}) => ({
-  position: "relative",
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  flexShrink: 0,
-  width: 40,
-  height: 40,
-  fontFamily: e.typography.fontFamily,
-  fontSize: e.typography.pxToRem(20),
-  lineHeight: 1,
-  borderRadius: "50%",
-  overflow: "hidden",
-  userSelect: "none",
-  variants: [{
-    props: {
-      variant: "rounded"
-    },
-    style: {
-      borderRadius: (e.vars || e).shape.borderRadius
-    }
-  }, {
-    props: {
-      variant: "square"
-    },
-    style: {
-      borderRadius: 0
-    }
-  }, {
-    props: {
-      colorDefault: !0
-    },
-    style: c({
-      color: (e.vars || e).palette.background.default
-    }, e.vars ? {
-      backgroundColor: e.vars.palette.Avatar.defaultBg
-    } : c({
-      backgroundColor: e.palette.grey[400]
-    }, e.applyStyles("dark", {
-      backgroundColor: e.palette.grey[600]
-    })))
-  }]
-})), De = M("img", {
-  name: "MuiAvatar",
-  slot: "Img",
-  overridesResolver: (e, t) => t.img
-})({
-  width: "100%",
-  height: "100%",
-  textAlign: "center",
-  // Handle non-square image. The property isn't supported by IE11.
-  objectFit: "cover",
-  // Hide alt text.
-  color: "transparent",
-  // Hide the image broken icon, only works on Chrome.
-  textIndent: 1e4
-}), Fe = M(Ae, {
-  name: "MuiAvatar",
-  slot: "Fallback",
-  overridesResolver: (e, t) => t.fallback
-})({
-  width: "75%",
-  height: "75%"
-});
-function Ue({
-  crossOrigin: e,
-  referrerPolicy: t,
-  src: n,
-  srcSet: r
-}) {
-  const [s, a] = x.useState(!1);
-  return x.useEffect(() => {
-    if (!n && !r)
-      return;
-    a(!1);
-    let d = !0;
-    const i = new Image();
-    return i.onload = () => {
-      d && a("loaded");
-    }, i.onerror = () => {
-      d && a("error");
-    }, i.crossOrigin = e, i.referrerPolicy = t, i.src = n, r && (i.srcset = r), () => {
-      d = !1;
-    };
-  }, [e, t, n, r]), s;
-}
-const U = /* @__PURE__ */ x.forwardRef(function(t, n) {
-  const r = j({
-    props: t,
-    name: "MuiAvatar"
-  }), {
-    alt: s,
-    children: a,
-    className: d,
-    component: i = "div",
-    slots: g = {},
-    slotProps: f = {},
-    imgProps: y,
-    sizes: m,
-    src: p,
-    srcSet: u,
-    variant: h = "circular"
-  } = r, v = w(r, Be);
-  let b = null;
-  const N = Ue(c({}, y, {
-    src: p,
-    srcSet: u
-  })), I = p || u, A = I && N !== "error", R = c({}, r, {
-    colorDefault: !A,
-    component: i,
-    variant: h
-  }), P = ze(R), [B, W] = Ee("img", {
-    className: P.img,
-    elementType: De,
-    externalForwardedProps: {
-      slots: g,
-      slotProps: {
-        img: c({}, y, f.img)
-      }
-    },
-    additionalProps: {
-      alt: s,
-      src: p,
-      srcSet: u,
-      sizes: m
-    },
-    ownerState: R
-  });
-  return A ? b = /* @__PURE__ */ l(B, c({}, W)) : a || a === 0 ? b = a : I && s ? b = s[0] : b = /* @__PURE__ */ l(Fe, {
-    ownerState: R,
-    className: P.fallback
-  }), /* @__PURE__ */ l(We, c({
-    as: i,
-    ownerState: R,
-    className: T(P.root, d),
-    ref: n
-  }, v, {
-    children: b
-  }));
-});
-process.env.NODE_ENV !== "production" && (U.propTypes = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * Used in combination with `src` or `srcSet` to
-   * provide an alt attribute for the rendered `img` element.
-   */
-  alt: o.string,
-  /**
-   * Used to render icon or text elements inside the Avatar if `src` is not set.
-   * This can be an element, or just a string.
-   */
-  children: o.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: o.object,
-  /**
-   * @ignore
-   */
-  className: o.string,
-  /**
-   * The component used for the root node.
-   * Either a string to use a HTML element or a component.
-   */
-  component: o.elementType,
-  /**
-   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
-   * It can be used to listen for the loading error event.
-   * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
-   */
-  imgProps: o.object,
-  /**
-   * The `sizes` attribute for the `img` element.
-   */
-  sizes: o.string,
-  /**
-   * The props used for each slot inside.
-   * @default {}
-   */
-  slotProps: o.shape({
-    img: o.oneOfType([o.func, o.object])
-  }),
-  /**
-   * The components used for each slot inside.
-   * @default {}
-   */
-  slots: o.shape({
-    img: o.elementType
-  }),
-  /**
-   * The `src` attribute for the `img` element.
-   */
-  src: o.string,
-  /**
-   * The `srcSet` attribute for the `img` element.
-   * Use this attribute for responsive image display.
-   */
-  srcSet: o.string,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
-  /**
-   * The shape of the avatar.
-   * @default 'circular'
-   */
-  variant: o.oneOfType([o.oneOf(["circular", "rounded", "square"]), o.string])
+  sx: t.oneOfType([t.arrayOf(t.oneOfType([t.func, t.object, t.bool])), t.func, t.object])
 });
-const Ve = ({
+const ne = ({
   title: e,
-  text: t,
+  text: i,
   image: n,
   orientation: r = "portrait",
   avatar: s,
-  actions: a,
-  extraActions: d,
-  extraInfo: i,
-  stats: g
-}) => r === "landscape" ? /* @__PURE__ */ C(G, { children: [
-  /* @__PURE__ */ l(
-    F,
+  actions: h,
+  extraActions: a,
+  extraInfo: l,
+  stats: u
+}) => r === "landscape" ? /* @__PURE__ */ c(A, { children: [
+  /* @__PURE__ */ o(
+    x,
     {
       component: "img",
       alt: e,
@@ -950,18 +212,18 @@ const Ve = ({
       sx: { width: 330, height: 200 }
     }
   ),
-  /* @__PURE__ */ C(D, { children: [
-    /* @__PURE__ */ l(O, { flex: 1, children: /* @__PURE__ */ C(
-      O,
+  /* @__PURE__ */ c(y, { children: [
+    /* @__PURE__ */ o(p, { flex: 1, children: /* @__PURE__ */ c(
+      p,
       {
         display: "flex",
         flexDirection: "column",
         justifyContent: "space-between",
         height: "100%",
         children: [
-          /* @__PURE__ */ C(O, { children: [
-            /* @__PURE__ */ l(
-              S,
+          /* @__PURE__ */ c(p, { children: [
+            /* @__PURE__ */ o(
+              d,
               {
                 gutterBottom: !0,
                 variant: "subtitle1",
@@ -976,8 +238,8 @@ const Ve = ({
                 children: e
               }
             ),
-            /* @__PURE__ */ l(
-              S,
+            /* @__PURE__ */ o(
+              d,
               {
                 variant: "caption",
                 component: "p",
@@ -990,18 +252,18 @@ const Ve = ({
                   WebkitBoxOrient: "vertical",
                   lineHeight: "16px"
                 },
-                children: /* @__PURE__ */ l("small", { children: t })
+                children: /* @__PURE__ */ o("small", { children: i })
               }
             )
           ] }),
-          /* @__PURE__ */ l(O, { children: g })
+          /* @__PURE__ */ o(p, { children: u })
         ]
       }
     ) }),
-    /* @__PURE__ */ C(J, { children: [
-      /* @__PURE__ */ l(U, { src: s.image, sx: { width: 42, height: 42 } }),
-      /* @__PURE__ */ l(
-        S,
+    /* @__PURE__ */ c(I, { children: [
+      /* @__PURE__ */ o(b, { src: s.image, sx: { width: 42, height: 42 } }),
+      /* @__PURE__ */ o(
+        d,
         {
           variant: "subtitle2",
           sx: {
@@ -1012,32 +274,32 @@ const Ve = ({
           children: s.title
         }
       ),
-      /* @__PURE__ */ l(
-        S,
+      /* @__PURE__ */ o(
+        d,
         {
           variant: "caption",
           sx: { color: "text.secondary", lineHeight: "12px" },
-          children: /* @__PURE__ */ l("small", { children: s.subTitle })
+          children: /* @__PURE__ */ o("small", { children: s.subTitle })
         }
       ),
-      /* @__PURE__ */ l(K, { children: d }),
-      /* @__PURE__ */ l(
-        S,
+      /* @__PURE__ */ o(P, { children: a }),
+      /* @__PURE__ */ o(
+        d,
         {
           variant: "caption",
           sx: { color: "text.secondary", lineHeight: "12px" },
-          children: /* @__PURE__ */ l("small", { children: i })
+          children: /* @__PURE__ */ o("small", { children: l })
         }
       ),
-      /* @__PURE__ */ l(O, { display: "flex", mt: 1, width: "100%", children: a })
+      /* @__PURE__ */ o(p, { display: "flex", mt: 1, width: "100%", children: h })
     ] })
   ] })
-] }) : /* @__PURE__ */ C(Q, { children: [
-  /* @__PURE__ */ l(F, { component: "img", alt: e, height: "172", image: n }),
-  /* @__PURE__ */ C(D, { children: [
-    /* @__PURE__ */ l(S, { gutterBottom: !0, variant: "subtitle1", component: "h3", noWrap: !0, children: e }),
-    /* @__PURE__ */ l(
-      S,
+] }) : /* @__PURE__ */ c(_, { children: [
+  /* @__PURE__ */ o(x, { component: "img", alt: e, height: "172", image: n }),
+  /* @__PURE__ */ c(y, { children: [
+    /* @__PURE__ */ o(d, { gutterBottom: !0, variant: "subtitle1", component: "h3", noWrap: !0, children: e }),
+    /* @__PURE__ */ o(
+      d,
       {
         variant: "caption",
         component: "p",
@@ -1050,12 +312,12 @@ const Ve = ({
           WebkitBoxOrient: "vertical",
           lineHeight: "16px"
         },
-        children: /* @__PURE__ */ l("small", { children: t })
+        children: /* @__PURE__ */ o("small", { children: i })
       }
     )
   ] }),
-  /* @__PURE__ */ C(
-    V,
+  /* @__PURE__ */ c(
+    k,
     {
       sx: {
         display: "flex",
@@ -1063,11 +325,11 @@ const Ve = ({
         p: (f) => f.spacing(2)
       },
       children: [
-        /* @__PURE__ */ C(O, { display: "flex", justifyItems: "center", children: [
-          /* @__PURE__ */ l(U, { src: s.image, sx: { width: 29, height: 29 } }),
-          /* @__PURE__ */ C(O, { display: "flex", flexDirection: "column", ml: 1, children: [
-            /* @__PURE__ */ l(
-              S,
+        /* @__PURE__ */ c(p, { display: "flex", justifyItems: "center", children: [
+          /* @__PURE__ */ o(b, { src: s.image, sx: { width: 29, height: 29 } }),
+          /* @__PURE__ */ c(p, { display: "flex", flexDirection: "column", ml: 1, children: [
+            /* @__PURE__ */ o(
+              d,
               {
                 variant: "subtitle2",
                 sx: {
@@ -1079,23 +341,23 @@ const Ve = ({
                 children: s.title
               }
             ),
-            /* @__PURE__ */ l(
-              S,
+            /* @__PURE__ */ o(
+              d,
               {
                 variant: "caption",
                 sx: { color: "text.secondary" },
                 noWrap: !0,
-                children: /* @__PURE__ */ l("small", { children: s.subTitle })
+                children: /* @__PURE__ */ o("small", { children: s.subTitle })
               }
             )
           ] })
         ] }),
-        /* @__PURE__ */ l(O, { display: "flex", children: a })
+        /* @__PURE__ */ o(p, { display: "flex", children: h })
       ]
     }
   ),
-  d !== void 0 && /* @__PURE__ */ l(X, { className: "extra-actions", children: d })
+  a !== void 0 && /* @__PURE__ */ o(L, { className: "extra-actions", children: a })
 ] });
 export {
-  Ve as Card
+  ne as Card
 };