import { _ as g, t as L, N as M, P as r, r as de, s as ue, J as A } from "./PrizeCard-C2El3VOB.js";
import * as f from "react";
import { u as pe, o as J } from "./useEventCallback-Dqgs56Ox.js";
import { n as xe, d as U, s as F, u as fe, a as $, c as ge } from "./Button-DPGn5NZd.js";
import { u as he } from "./useForwardedInput-BtJQsvkW.js";
import { jsxs as j, jsx as I } from "react/jsx-runtime";
function ve(a, e = 166) {
  let p;
  function s(...d) {
    const u = () => {
      a.apply(this, d);
    };
    clearTimeout(p), p = setTimeout(u, e);
  }
  return s.clear = () => {
    clearTimeout(p);
  }, s;
}
function $e(a) {
  const {
    checked: e,
    defaultChecked: p,
    disabled: s,
    onBlur: d,
    onChange: u,
    onFocus: h,
    onFocusVisible: v,
    readOnly: m,
    required: S
  } = a, [T, w] = pe({
    controlled: e,
    default: !!p,
    name: "Switch",
    state: "checked"
  }), k = (c) => (t) => {
    var i;
    t.nativeEvent.defaultPrevented || (w(t.target.checked), u == null || u(t), (i = c.onChange) == null || i.call(c, t));
  }, {
    isFocusVisibleRef: b,
    onBlur: H,
    onFocus: R,
    ref: B
  } = xe(), [n, o] = f.useState(!1);
  s && n && o(!1), f.useEffect(() => {
    b.current = n;
  }, [n, b]);
  const l = f.useRef(null), x = (c) => (t) => {
    var i;
    l.current || (l.current = t.currentTarget), R(t), b.current === !0 && (o(!0), v == null || v(t)), h == null || h(t), (i = c.onFocus) == null || i.call(c, t);
  }, z = (c) => (t) => {
    var i;
    H(t), b.current === !1 && o(!1), d == null || d(t), (i = c.onBlur) == null || i.call(c, t);
  }, y = U(B, l);
  return {
    checked: T,
    disabled: !!s,
    focusVisible: n,
    getInputProps: (c = {}) => g({
      checked: e,
      defaultChecked: p,
      disabled: s,
      readOnly: m,
      ref: y,
      required: S,
      type: "checkbox",
      role: "switch",
      "aria-checked": e
    }, c, {
      onChange: k(c),
      onFocus: x(c),
      onBlur: z(c)
    }),
    inputRef: y,
    readOnly: !!m
  };
}
const me = ["onChange", "maxRows", "minRows", "style", "value"];
function E(a) {
  return parseInt(a, 10) || 0;
}
const Te = {
  shadow: {
    // Visibility needed to hide the extra text area on iPads
    visibility: "hidden",
    // Remove from the content flow
    position: "absolute",
    // Ignore the scrollbar width
    overflow: "hidden",
    height: 0,
    top: 0,
    left: 0,
    // Create a new layer, increase the isolation of the computed values
    transform: "translateZ(0)"
  }
};
function be(a) {
  return a == null || Object.keys(a).length === 0 || a.outerHeightStyle === 0 && !a.overflowing;
}
const q = /* @__PURE__ */ f.forwardRef(function(e, p) {
  const {
    onChange: s,
    maxRows: d,
    minRows: u = 1,
    style: h,
    value: v
  } = e, m = L(e, me), {
    current: S
  } = f.useRef(v != null), T = f.useRef(null), w = U(p, T), k = f.useRef(null), b = f.useRef(null), H = f.useCallback(() => {
    const n = T.current, l = J(n).getComputedStyle(n);
    if (l.width === "0px")
      return {
        outerHeightStyle: 0,
        overflowing: !1
      };
    const x = b.current;
    x.style.width = l.width, x.value = n.value || e.placeholder || "x", x.value.slice(-1) === `
` && (x.value += " ");
    const z = l.boxSizing, y = E(l.paddingBottom) + E(l.paddingTop), C = E(l.borderBottomWidth) + E(l.borderTopWidth), c = x.scrollHeight;
    x.value = "x";
    const t = x.scrollHeight;
    let i = c;
    u && (i = Math.max(Number(u) * t, i)), d && (i = Math.min(Number(d) * t, i)), i = Math.max(i, t);
    const P = i + (z === "border-box" ? y + C : 0), N = Math.abs(i - c) <= 1;
    return {
      outerHeightStyle: P,
      overflowing: N
    };
  }, [d, u, e.placeholder]), R = f.useCallback(() => {
    const n = H();
    if (be(n))
      return;
    const o = n.outerHeightStyle, l = T.current;
    k.current !== o && (k.current = o, l.style.height = `${o}px`), l.style.overflow = n.overflowing ? "hidden" : "";
  }, [H]);
  M(() => {
    const n = () => {
      R();
    };
    let o;
    const l = () => {
      cancelAnimationFrame(o), o = requestAnimationFrame(() => {
        n();
      });
    }, x = ve(n), z = T.current, y = J(z);
    y.addEventListener("resize", x);
    let C;
    return typeof ResizeObserver < "u" && (C = new ResizeObserver(process.env.NODE_ENV === "test" ? l : n), C.observe(z)), () => {
      x.clear(), cancelAnimationFrame(o), y.removeEventListener("resize", x), C && C.disconnect();
    };
  }, [H, R]), M(() => {
    R();
  });
  const B = (n) => {
    S || R(), s && s(n);
  };
  return /* @__PURE__ */ j(f.Fragment, {
    children: [/* @__PURE__ */ I("textarea", g({
      value: v,
      onChange: B,
      ref: w,
      rows: u,
      style: h
    }, m)), /* @__PURE__ */ I("textarea", {
      "aria-hidden": !0,
      className: e.className,
      readOnly: !0,
      ref: b,
      tabIndex: -1,
      style: g({}, Te.shadow, h, {
        paddingTop: 0,
        paddingBottom: 0
      })
    })]
  });
});
process.env.NODE_ENV !== "production" && (q.propTypes = {
  // ┌────────────────────────────── Warning ──────────────────────────────┐
  // │ These PropTypes are generated from the TypeScript type definitions. │
  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
  // └─────────────────────────────────────────────────────────────────────┘
  /**
   * @ignore
   */
  className: r.string,
  /**
   * Maximum number of rows to display.
   */
  maxRows: r.oneOfType([r.number, r.string]),
  /**
   * Minimum number of rows to display.
   * @default 1
   */
  minRows: r.oneOfType([r.number, r.string]),
  /**
   * @ignore
   */
  onChange: r.func,
  /**
   * @ignore
   */
  placeholder: r.string,
  /**
   * @ignore
   */
  style: r.object,
  /**
   * @ignore
   */
  value: r.oneOfType([r.arrayOf(r.string), r.number, r.string])
});
function ye(a) {
  return ue("MuiTextarea", a);
}
const Z = de("MuiTextarea", ["root", "textarea", "startDecorator", "endDecorator", "formControl", "disabled", "error", "focused", "colorPrimary", "colorNeutral", "colorDanger", "colorSuccess", "colorWarning", "colorContext", "sizeSm", "sizeMd", "sizeLg", "variantPlain", "variantOutlined", "variantSoft"]), Ce = ["propsToForward", "rootStateClasses", "inputStateClasses", "getRootProps", "getInputProps", "formControl", "focused", "error", "disabled", "size", "color", "variant", "startDecorator", "endDecorator", "minRows", "maxRows", "component", "slots", "slotProps"], Re = (a) => {
  const {
    disabled: e,
    variant: p,
    color: s,
    size: d
  } = a, u = {
    root: ["root", e && "disabled", p && `variant${A(p)}`, s && `color${A(s)}`, d && `size${A(d)}`],
    textarea: ["textarea"],
    startDecorator: ["startDecorator"],
    endDecorator: ["endDecorator"]
  };
  return ge(u, ye, {});
}, ze = F("div", {
  name: "JoyTextarea",
  slot: "Root",
  overridesResolver: (a, e) => e.root
})(({
  theme: a,
  ownerState: e
}) => {
  var p, s, d, u, h, v;
  const m = (p = a.variants[`${e.variant}`]) == null ? void 0 : p[e.color];
  return [g({
    "--Textarea-radius": a.vars.radius.sm,
    "--Textarea-gap": "0.5rem",
    "--Textarea-placeholderColor": "inherit",
    "--Textarea-placeholderOpacity": 0.64,
    "--Textarea-decoratorColor": a.vars.palette.text.icon,
    "--Textarea-focused": "0",
    "--Textarea-focusedThickness": a.vars.focus.thickness,
    "--Textarea-focusedHighlight": (s = a.vars.palette[e.color === "neutral" ? "primary" : e.color]) == null ? void 0 : s[500],
    '&:not([data-inverted-colors="false"])': g({}, e.instanceColor && {
      "--_Textarea-focusedHighlight": (d = a.vars.palette[e.instanceColor === "neutral" ? "primary" : e.instanceColor]) == null ? void 0 : d[500]
    }, {
      "--Textarea-focusedHighlight": `var(--_Textarea-focusedHighlight, ${a.vars.palette.focusVisible})`
    })
  }, e.size === "sm" && {
    "--Textarea-minHeight": "2rem",
    "--Textarea-paddingBlock": "calc(0.375rem - 0.5px - var(--variant-borderWidth, 0px))",
    // to match Input because <textarea> does not center the text at the middle like <input>
    "--Textarea-paddingInline": "0.5rem",
    "--Textarea-decoratorChildHeight": "min(1.5rem, var(--Textarea-minHeight))",
    "--Icon-fontSize": a.vars.fontSize.xl
  }, e.size === "md" && {
    "--Textarea-minHeight": "2.25rem",
    "--Textarea-paddingBlock": "calc(0.375rem - var(--variant-borderWidth, 0px))",
    "--Textarea-paddingInline": "0.75rem",
    "--Textarea-decoratorChildHeight": "min(1.75rem, var(--Textarea-minHeight))",
    "--Icon-fontSize": a.vars.fontSize.xl2
  }, e.size === "lg" && {
    "--Textarea-minHeight": "3rem",
    "--Textarea-paddingBlock": "calc(0.75rem - var(--variant-borderWidth, 0px))",
    "--Textarea-paddingInline": "1rem",
    "--Textarea-gap": "0.75rem",
    "--Textarea-decoratorChildHeight": "min(2.375rem, var(--Textarea-minHeight))",
    "--Icon-fontSize": a.vars.fontSize.xl2
  }, {
    // variables for controlling child components
    "--_Textarea-paddingBlock": "max((var(--Textarea-minHeight) - 2 * var(--variant-borderWidth, 0px) - var(--Textarea-decoratorChildHeight)) / 2, 0px)",
    "--Textarea-decoratorChildRadius": "max(var(--Textarea-radius) - var(--variant-borderWidth, 0px) - var(--_Textarea-paddingBlock), min(var(--_Textarea-paddingBlock) + var(--variant-borderWidth, 0px), var(--Textarea-radius) / 2))",
    "--Button-minHeight": "var(--Textarea-decoratorChildHeight)",
    "--Button-paddingBlock": "0px",
    // to ensure that the height of the button is equal to --Button-minHeight
    "--IconButton-size": "var(--Textarea-decoratorChildHeight)",
    "--Button-radius": "var(--Textarea-decoratorChildRadius)",
    "--IconButton-radius": "var(--Textarea-decoratorChildRadius)",
    boxSizing: "border-box"
  }, e.variant !== "plain" && {
    boxShadow: a.shadow.xs
  }, {
    minWidth: 0,
    minHeight: "var(--Textarea-minHeight)",
    cursor: "text",
    position: "relative",
    display: "flex",
    flexDirection: "column",
    paddingInlineStart: "var(--Textarea-paddingInline)",
    // the paddingInlineEnd is added to the textarea. It looks better when the scrollbar appears.
    paddingBlock: "var(--Textarea-paddingBlock)",
    borderRadius: "var(--Textarea-radius)"
  }, a.typography[`body-${e.size}`], m, {
    backgroundColor: (u = m == null ? void 0 : m.backgroundColor) != null ? u : a.vars.palette.background.surface,
    "&::before": {
      boxSizing: "border-box",
      content: '""',
      display: "block",
      position: "absolute",
      pointerEvents: "none",
      top: 0,
      left: 0,
      right: 0,
      bottom: 0,
      zIndex: 1,
      borderRadius: "inherit",
      margin: "calc(var(--variant-borderWidth, 0px) * -1)",
      // for outlined variant
      boxShadow: "var(--Textarea-focusedInset, inset) 0 0 0 calc(var(--Textarea-focused) * var(--Textarea-focusedThickness)) var(--Textarea-focusedHighlight)"
    }
  }), {
    "&:hover": g({}, (h = a.variants[`${e.variant}Hover`]) == null ? void 0 : h[e.color], {
      backgroundColor: null,
      // it is not common to change background on hover for Textarea
      cursor: "text"
    }),
    [`&.${Z.disabled}`]: (v = a.variants[`${e.variant}Disabled`]) == null ? void 0 : v[e.color],
    "&:focus-within::before": {
      "--Textarea-focused": "1"
    }
  }];
}), ke = F(q, {
  name: "JoyTextarea",
  slot: "Textarea",
  overridesResolver: (a, e) => e.textarea
})({
  resize: "none",
  border: "none",
  // remove the native textarea width
  minWidth: 0,
  // remove the native textarea width
  outline: 0,
  // remove the native textarea outline
  padding: 0,
  // remove the native textarea padding
  paddingInlineEnd: "var(--Textarea-paddingInline)",
  flex: "auto",
  alignSelf: "stretch",
  color: "inherit",
  backgroundColor: "transparent",
  fontFamily: "inherit",
  fontSize: "inherit",
  fontStyle: "inherit",
  fontWeight: "inherit",
  lineHeight: "inherit",
  "&::-webkit-input-placeholder": {
    color: "var(--Textarea-placeholderColor)",
    opacity: "var(--Textarea-placeholderOpacity)"
  },
  "&::-moz-placeholder": {
    // Firefox 19+
    color: "var(--Textarea-placeholderColor)",
    opacity: "var(--Textarea-placeholderOpacity)"
  },
  "&:-ms-input-placeholder": {
    // IE11
    color: "var(--Textarea-placeholderColor)",
    opacity: "var(--Textarea-placeholderOpacity)"
  },
  "&::-ms-input-placeholder": {
    // Edge
    color: "var(--Textarea-placeholderColor)",
    opacity: "var(--Textarea-placeholderOpacity)"
  }
}), He = F("div", {
  name: "JoyTextarea",
  slot: "StartDecorator",
  overridesResolver: (a, e) => e.startDecorator
})({
  display: "flex",
  marginInlineStart: "calc(var(--Textarea-paddingBlock) - var(--Textarea-paddingInline))",
  marginInlineEnd: "var(--Textarea-paddingBlock)",
  marginBlockEnd: "var(--Textarea-gap)",
  color: "var(--Textarea-decoratorColor)",
  cursor: "initial"
}), Se = F("div", {
  name: "JoyTextarea",
  slot: "EndDecorator",
  overridesResolver: (a, e) => e.endDecorator
})({
  display: "flex",
  marginInlineStart: "calc(var(--Textarea-paddingBlock) - var(--Textarea-paddingInline))",
  marginInlineEnd: "var(--Textarea-paddingBlock)",
  marginBlockStart: "var(--Textarea-gap)",
  color: "var(--Textarea-decoratorColor)",
  cursor: "initial"
}), we = /* @__PURE__ */ f.forwardRef(function(e, p) {
  var s, d, u, h, v, m, S, T;
  const w = fe({
    props: e,
    name: "JoyTextarea"
  }), k = he(w, Z), {
    propsToForward: b,
    rootStateClasses: H,
    inputStateClasses: R,
    getRootProps: B,
    getInputProps: n,
    formControl: o,
    focused: l,
    error: x = !1,
    disabled: z = !1,
    size: y = "md",
    color: C = "neutral",
    variant: c = "outlined",
    startDecorator: t,
    endDecorator: i,
    minRows: P,
    maxRows: N,
    component: G,
    slots: K = {},
    slotProps: Q = {}
  } = k, X = L(k, Ce);
  if (process.env.NODE_ENV !== "production") {
    const V = o == null ? void 0 : o.registerEffect;
    f.useEffect(() => {
      if (V)
        return V();
    }, [V]);
  }
  const Y = (s = (d = e.disabled) != null ? d : o == null ? void 0 : o.disabled) != null ? s : z, W = (u = (h = e.error) != null ? h : o == null ? void 0 : o.error) != null ? u : x, ee = (v = (m = e.size) != null ? m : o == null ? void 0 : o.size) != null ? v : y, re = (S = e.color) != null ? S : W ? "danger" : (T = o == null ? void 0 : o.color) != null ? T : C, D = g({
    instanceColor: W ? "danger" : e.color
  }, w, {
    color: re,
    disabled: Y,
    error: W,
    focused: l,
    size: ee,
    variant: c
  }), O = Re(D), _ = g({}, X, {
    component: G,
    slots: K,
    slotProps: Q
  }), [ae, oe] = $("root", {
    ref: p,
    className: [O.root, H],
    elementType: ze,
    externalForwardedProps: _,
    getSlotProps: B,
    ownerState: D
  }), [te, ne] = $("textarea", {
    additionalProps: {
      id: o == null ? void 0 : o.htmlFor,
      "aria-describedby": o == null ? void 0 : o["aria-describedby"]
    },
    className: [O.textarea, R],
    elementType: ke,
    internalForwardedProps: g({}, b, {
      minRows: P,
      maxRows: N
    }),
    externalForwardedProps: _,
    getSlotProps: n,
    ownerState: D
  }), [ie, se] = $("startDecorator", {
    className: O.startDecorator,
    elementType: He,
    externalForwardedProps: _,
    ownerState: D
  }), [le, ce] = $("endDecorator", {
    className: O.endDecorator,
    elementType: Se,
    externalForwardedProps: _,
    ownerState: D
  });
  return /* @__PURE__ */ j(ae, g({}, oe, {
    children: [t && /* @__PURE__ */ I(ie, g({}, se, {
      children: t
    })), /* @__PURE__ */ I(te, g({}, ne)), i && /* @__PURE__ */ I(le, g({}, ce, {
      children: i
    }))]
  }));
});
process.env.NODE_ENV !== "production" && (we.propTypes = {
  // ┌────────────────────────────── Warning ──────────────────────────────┐
  // │ These PropTypes are generated from the TypeScript type definitions. │
  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
  // └─────────────────────────────────────────────────────────────────────┘
  /**
   * @ignore
   */
  children: r.node,
  /**
   * The color of the component. It supports those theme colors that make sense for this component.
   * @default 'neutral'
   */
  color: r.oneOfType([r.oneOf(["danger", "neutral", "primary", "success", "warning"]), r.string]),
  /**
   * @ignore
   */
  disabled: r.bool,
  /**
   * Trailing adornment for this input.
   */
  endDecorator: r.node,
  /**
   * If `true`, the `input` will indicate an error.
   * The prop defaults to the value (`false`) inherited from the parent FormControl component.
   * @default false
   */
  error: r.bool,
  /**
   * Maximum number of rows to display.
   */
  maxRows: r.oneOfType([r.number, r.string]),
  /**
   * Minimum number of rows to display.
   * @default 1
   */
  minRows: r.oneOfType([r.number, r.string]),
  /**
   * The size of the component.
   * @default 'md'
   */
  size: r.oneOfType([r.oneOf(["sm", "md", "lg"]), r.string]),
  /**
   * Leading adornment for this input.
   */
  startDecorator: r.node,
  /**
   * The system prop that allows defining system overrides as well as additional CSS styles.
   */
  sx: r.oneOfType([r.arrayOf(r.oneOfType([r.func, r.object, r.bool])), r.func, r.object]),
  /**
   * The [global variant](https://mui.com/joy-ui/main-features/global-variants/) to use.
   * @default 'outlined'
   */
  variant: r.oneOfType([r.oneOf(["outlined", "plain", "soft", "solid"]), r.string])
});
export {
  we as T,
  $e as u
};
