fansunited-frontend-components 0.0.39 → 0.0.40

package/chunks/Avatar-CQCrd1m-.js

@@ -0,0 +1,352 @@
+import { l as I, m as k, s as z, _ as c, P as e, q as R, t as j, v as h, w as L, y as _, x as N } from "./PrizeCard-gMp7I66d.js";
+import * as p from "react";
+import { c as V } from "./CheckCircle-ClY-iOQ5.js";
+import { jsx as v } from "react/jsx-runtime";
+const W = V(/* @__PURE__ */ v("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 q(r) {
+  return I("MuiAvatar", r);
+}
+k("MuiAvatar", ["root", "colorPrimary", "colorNeutral", "colorDanger", "colorSuccess", "colorWarning", "colorContext", "fallback", "sizeSm", "sizeMd", "sizeLg", "img", "variantOutlined", "variantSoft", "variantSolid"]);
+function H(r) {
+  return I("MuiAvatarGroup", r);
+}
+k("MuiAvatarGroup", ["root"]);
+const B = ["className", "color", "component", "size", "variant", "children", "slots", "slotProps"], C = /* @__PURE__ */ p.createContext(void 0);
+process.env.NODE_ENV !== "production" && (C.displayName = "AvatarGroupContext");
+const K = () => _({
+  root: ["root"]
+}, H, {}), Q = z("div", {
+  name: "JoyAvatarGroup",
+  slot: "Root",
+  overridesResolver: (r, o) => o.root
+})(({
+  ownerState: r,
+  theme: o
+}) => c({}, r.size === "sm" && {
+  "--AvatarGroup-gap": "-0.375rem",
+  "--Avatar-ringSize": "2px"
+}, r.size === "md" && {
+  "--AvatarGroup-gap": "-0.5rem",
+  "--Avatar-ringSize": "2px"
+}, r.size === "lg" && {
+  "--AvatarGroup-gap": "-0.625rem",
+  "--Avatar-ringSize": "4px"
+}, {
+  "--Avatar-ring": `0 0 0 var(--Avatar-ringSize) var(--Avatar-ringColor, ${o.vars.palette.background.surface})`,
+  "--Avatar-marginInlineStart": "var(--AvatarGroup-gap)",
+  display: "flex",
+  marginInlineStart: "calc(-1 * var(--AvatarGroup-gap))"
+})), X = /* @__PURE__ */ p.forwardRef(function(o, a) {
+  const t = R({
+    props: o,
+    name: "JoyAvatarGroup"
+  }), {
+    className: s,
+    color: n,
+    component: i = "div",
+    size: l = "md",
+    variant: f,
+    children: d,
+    slots: m = {},
+    slotProps: g = {}
+  } = t, T = j(t, B), y = p.useMemo(() => c({}, t, {
+    color: n,
+    component: i,
+    size: l,
+    variant: f
+  }), [n, i, t, l, f]), b = K(), [x, O] = h("root", {
+    ref: a,
+    className: L(b.root, s),
+    elementType: Q,
+    externalForwardedProps: c({}, T, {
+      component: i,
+      slots: m,
+      slotProps: g
+    }),
+    ownerState: y
+  });
+  return /* @__PURE__ */ v(C.Provider, {
+    value: y,
+    children: /* @__PURE__ */ v(x, c({}, O, {
+      children: d
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" && (X.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Used to render icon or text elements inside the AvatarGroup if `src` is not set.
+   * This can be an element, or just a string.
+   */
+  children: e.node,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The color of the component. It supports those theme colors that make sense for this component.
+   * @default 'neutral'
+   */
+  color: e.oneOfType([e.oneOf(["danger", "neutral", "primary", "success", "warning"]), e.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: e.elementType,
+  /**
+   * The size of the component.
+   * It accepts theme values between 'sm' and 'lg'.
+   * @default 'md'
+   */
+  size: e.oneOfType([e.oneOf(["lg", "md", "sm"]), e.string]),
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: e.shape({
+    root: e.oneOfType([e.func, e.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: e.shape({
+    root: e.elementType
+  }),
+  /**
+   * 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 [global variant](https://mui.com/joy-ui/main-features/global-variants/) to use.
+   * @default 'soft'
+   */
+  variant: e.oneOfType([e.oneOf(["outlined", "plain", "soft", "solid"]), e.string])
+});
+const Y = ["alt", "color", "size", "variant", "src", "srcSet", "children", "component", "slots", "slotProps"], Z = (r) => {
+  const {
+    size: o,
+    variant: a,
+    color: t,
+    src: s,
+    srcSet: n
+  } = r, i = {
+    root: ["root", a && `variant${N(a)}`, t && `color${N(t)}`, o && `size${N(o)}`],
+    img: [(s || n) && "img"],
+    fallback: ["fallback"]
+  };
+  return _(i, q, {});
+}, ee = z("div", {
+  name: "JoyAvatar",
+  slot: "Root",
+  overridesResolver: (r, o) => o.root
+})(({
+  theme: r,
+  ownerState: o
+}) => {
+  var a;
+  return c({
+    "--Icon-color": o.color !== "neutral" || o.variant === "solid" ? "currentColor" : r.vars.palette.text.icon
+  }, r.typography[`title-${o.size}`], o.size === "sm" && {
+    width: "var(--Avatar-size, 2rem)",
+    height: "var(--Avatar-size, 2rem)",
+    fontSize: "calc(var(--Avatar-size, 2rem) * 0.4375)"
+    // default as 14px
+  }, o.size === "md" && {
+    width: "var(--Avatar-size, 2.5rem)",
+    height: "var(--Avatar-size, 2.5rem)",
+    fontSize: "calc(var(--Avatar-size, 2.5rem) * 0.4)"
+    // default as 16px
+  }, o.size === "lg" && {
+    width: "var(--Avatar-size, 3rem)",
+    height: "var(--Avatar-size, 3rem)",
+    fontSize: "calc(var(--Avatar-size, 3rem) * 0.375)"
+    // default as 18px
+  }, {
+    marginInlineStart: "var(--Avatar-marginInlineStart)",
+    boxShadow: "var(--Avatar-ring)",
+    position: "relative",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0,
+    lineHeight: 1,
+    overflow: "hidden",
+    borderRadius: "var(--Avatar-radius, 50%)",
+    userSelect: "none"
+  }, (a = r.variants[o.variant]) == null ? void 0 : a[o.color]);
+}), oe = z("img", {
+  name: "JoyAvatar",
+  slot: "Img",
+  overridesResolver: (r, o) => o.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
+}), re = z(W, {
+  name: "JoyAvatar",
+  slot: "Fallback",
+  overridesResolver: (r, o) => o.fallback
+})({
+  width: "64%",
+  height: "64%"
+});
+function te({
+  crossOrigin: r,
+  referrerPolicy: o,
+  src: a,
+  srcSet: t
+}) {
+  const [s, n] = p.useState(!1);
+  return p.useEffect(() => {
+    if (!a && !t)
+      return;
+    n(!1);
+    let i = !0;
+    const l = new Image();
+    return l.onload = () => {
+      i && n("loaded");
+    }, l.onerror = () => {
+      i && n("error");
+    }, l.crossOrigin = r, l.referrerPolicy = o, a && (l.src = a), t && (l.srcset = t), () => {
+      i = !1;
+    };
+  }, [r, o, a, t]), s;
+}
+const ae = /* @__PURE__ */ p.forwardRef(function(o, a) {
+  const t = R({
+    props: o,
+    name: "JoyAvatar"
+  }), s = p.useContext(C), {
+    alt: n,
+    color: i = "neutral",
+    size: l = "md",
+    variant: f = "soft",
+    src: d,
+    srcSet: m,
+    children: g,
+    component: T,
+    slots: y = {},
+    slotProps: b = {}
+  } = t, x = j(t, Y), O = o.variant || (s == null ? void 0 : s.variant) || f, w = o.color || (s == null ? void 0 : s.color) || i, F = o.size || (s == null ? void 0 : s.size) || l;
+  let u = null;
+  const A = c({}, t, {
+    color: w,
+    size: F,
+    variant: O,
+    grouped: !!s
+  }), P = Z(A), S = c({}, x, {
+    component: T,
+    slots: y,
+    slotProps: b
+  }), [$, E] = h("root", {
+    ref: a,
+    className: P.root,
+    elementType: ee,
+    externalForwardedProps: S,
+    ownerState: A
+  }), [M, G] = h("img", {
+    additionalProps: {
+      alt: n,
+      src: d,
+      srcSet: m
+    },
+    className: P.img,
+    elementType: oe,
+    externalForwardedProps: S,
+    ownerState: A
+  }), [J, U] = h("fallback", {
+    className: P.fallback,
+    elementType: re,
+    externalForwardedProps: S,
+    ownerState: A
+  }), D = te(c({}, G, {
+    src: d,
+    srcSet: m
+  }));
+  return (d || m) && D !== "error" ? u = /* @__PURE__ */ v(M, c({}, G)) : g != null ? u = g : n ? u = n[0] : u = /* @__PURE__ */ v(J, c({}, U)), /* @__PURE__ */ v($, c({}, E, {
+    children: u
+  }));
+});
+process.env.NODE_ENV !== "production" && (ae.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Used in combination with `src` or `srcSet` to
+   * provide an alt attribute for the rendered `img` element.
+   */
+  alt: e.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: e.node,
+  /**
+   * The color of the component. It supports those theme colors that make sense for this component.
+   * @default 'neutral'
+   */
+  color: e.oneOfType([e.oneOf(["danger", "neutral", "primary", "success", "warning"]), e.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: e.elementType,
+  /**
+   * The size of the component.
+   * It accepts theme values between 'sm' and 'lg'.
+   * @default 'md'
+   */
+  size: e.oneOfType([e.oneOf(["lg", "md", "sm"]), e.string]),
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: e.shape({
+    fallback: e.oneOfType([e.func, e.object]),
+    img: e.oneOfType([e.func, e.object]),
+    root: e.oneOfType([e.func, e.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: e.shape({
+    fallback: e.elementType,
+    img: e.elementType,
+    root: e.elementType
+  }),
+  /**
+   * The `src` attribute for the `img` element.
+   */
+  src: e.string,
+  /**
+   * The `srcSet` attribute for the `img` element.
+   * Use this attribute for responsive image display.
+   */
+  srcSet: 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]),
+  /**
+   * The [global variant](https://mui.com/joy-ui/main-features/global-variants/) to use.
+   * @default 'soft'
+   */
+  variant: e.oneOfType([e.oneOf(["outlined", "plain", "soft", "solid"]), e.string])
+});
+export {
+  ae as A
+};