import { r as Z, s as rr, _ as n, t as or, P as r, J as b } from "./PrizeCard-C2El3VOB.js";
import * as O from "react";
import { s, j as tr, u as nr, a as h, c as ar } from "./Button-DPGn5NZd.js";
import { u as er } from "./useForwardedInput-BtJQsvkW.js";
import { jsxs as ir, jsx as y } from "react/jsx-runtime";
function lr(t) {
  return rr("MuiInput", t);
}
const S = Z("MuiInput", ["root", "input", "formControl", "focused", "disabled", "error", "adornedStart", "adornedEnd", "colorPrimary", "colorNeutral", "colorDanger", "colorSuccess", "colorWarning", "colorContext", "sizeSm", "sizeMd", "sizeLg", "variantPlain", "variantOutlined", "variantSoft", "variantSolid", "fullWidth", "startDecorator", "endDecorator"]), sr = ["propsToForward", "rootStateClasses", "inputStateClasses", "getRootProps", "getInputProps", "formControl", "focused", "error", "disabled", "fullWidth", "size", "color", "variant", "startDecorator", "endDecorator", "component", "slots", "slotProps"], dr = (t) => {
  const {
    disabled: o,
    fullWidth: p,
    variant: e,
    color: i,
    size: l
  } = t, d = {
    root: ["root", o && "disabled", p && "fullWidth", e && `variant${b(e)}`, i && `color${b(i)}`, l && `size${b(l)}`],
    input: ["input"],
    startDecorator: ["startDecorator"],
    endDecorator: ["endDecorator"]
  };
  return ar(d, lr, {});
}, pr = s("div")(({
  theme: t,
  ownerState: o
}) => {
  var p, e, i, l, d, u;
  const c = (p = t.variants[`${o.variant}`]) == null ? void 0 : p[o.color];
  return [n({
    "--Input-radius": t.vars.radius.sm,
    "--Input-gap": "0.5rem",
    "--Input-placeholderColor": "inherit",
    "--Input-placeholderOpacity": 0.64,
    "--Input-decoratorColor": t.vars.palette.text.icon,
    "--Input-focused": "0",
    "--Input-focusedThickness": t.vars.focus.thickness,
    "--Input-focusedHighlight": (e = t.vars.palette[o.color === "neutral" ? "primary" : o.color]) == null ? void 0 : e[500],
    [`&:not([${tr}])`]: n({}, o.instanceColor && {
      "--_Input-focusedHighlight": (i = t.vars.palette[o.instanceColor === "neutral" ? "primary" : o.instanceColor]) == null ? void 0 : i[500]
    }, {
      "--Input-focusedHighlight": `var(--_Input-focusedHighlight, ${t.vars.palette.focusVisible})`
    })
  }, o.size === "sm" && {
    "--Input-minHeight": "2rem",
    "--Input-paddingInline": "0.5rem",
    "--Input-decoratorChildHeight": "min(1.5rem, var(--Input-minHeight))",
    "--Icon-fontSize": t.vars.fontSize.xl
  }, o.size === "md" && {
    "--Input-minHeight": "2.25rem",
    "--Input-paddingInline": "0.75rem",
    "--Input-decoratorChildHeight": "min(1.75rem, var(--Input-minHeight))",
    "--Icon-fontSize": t.vars.fontSize.xl2
  }, o.size === "lg" && {
    "--Input-minHeight": "2.75rem",
    "--Input-paddingInline": "1rem",
    "--Input-gap": "0.75rem",
    "--Input-decoratorChildHeight": "min(2.25rem, var(--Input-minHeight))",
    "--Icon-fontSize": t.vars.fontSize.xl2
  }, {
    // variables for controlling child components
    "--Input-decoratorChildOffset": "min(calc(var(--Input-paddingInline) - (var(--Input-minHeight) - 2 * var(--variant-borderWidth, 0px) - var(--Input-decoratorChildHeight)) / 2), var(--Input-paddingInline))",
    "--_Input-paddingBlock": "max((var(--Input-minHeight) - 2 * var(--variant-borderWidth, 0px) - var(--Input-decoratorChildHeight)) / 2, 0px)",
    "--Input-decoratorChildRadius": "max(var(--Input-radius) - var(--variant-borderWidth, 0px) - var(--_Input-paddingBlock), min(var(--_Input-paddingBlock) + var(--variant-borderWidth, 0px), var(--Input-radius) / 2))",
    "--Button-minHeight": "var(--Input-decoratorChildHeight)",
    "--Button-paddingBlock": "0px",
    // to ensure that the height of the button is equal to --Button-minHeight
    "--IconButton-size": "var(--Input-decoratorChildHeight)",
    "--Button-radius": "var(--Input-decoratorChildRadius)",
    "--IconButton-radius": "var(--Input-decoratorChildRadius)",
    boxSizing: "border-box"
  }, o.variant !== "plain" && {
    boxShadow: t.shadow.xs
  }, {
    minWidth: 0,
    minHeight: "var(--Input-minHeight)"
  }, o.fullWidth && {
    width: "100%"
  }, {
    cursor: "text",
    position: "relative",
    display: "flex",
    paddingInline: "var(--Input-paddingInline)",
    borderRadius: "var(--Input-radius)"
  }, t.typography[`body-${o.size}`], c, {
    backgroundColor: (l = c == null ? void 0 : c.backgroundColor) != null ? l : t.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(--Input-focusedInset, inset) 0 0 0 calc(var(--Input-focused) * var(--Input-focusedThickness)) var(--Input-focusedHighlight)"
    }
  }), {
    "&:hover": n({}, (d = t.variants[`${o.variant}Hover`]) == null ? void 0 : d[o.color], {
      backgroundColor: null
      // it is not common to change background on hover for Input
    }),
    [`&.${S.disabled}`]: (u = t.variants[`${o.variant}Disabled`]) == null ? void 0 : u[o.color],
    "&:focus-within::before": {
      "--Input-focused": "1"
    }
  }];
}), cr = s("input")(({
  ownerState: t
}) => ({
  border: "none",
  // remove the native input width
  minWidth: 0,
  // remove the native input width
  outline: 0,
  // remove the native input outline
  padding: 0,
  // remove the native input padding
  flex: 1,
  color: "inherit",
  backgroundColor: "transparent",
  fontFamily: "inherit",
  fontSize: "inherit",
  fontStyle: "inherit",
  fontWeight: "inherit",
  lineHeight: "inherit",
  textOverflow: "ellipsis",
  "&:-webkit-autofill": n({
    paddingInline: "var(--Input-paddingInline)"
  }, !t.startDecorator && {
    marginInlineStart: "calc(-1 * var(--Input-paddingInline))",
    paddingInlineStart: "var(--Input-paddingInline)",
    borderTopLeftRadius: "calc(var(--Input-radius) - var(--variant-borderWidth, 0px))",
    borderBottomLeftRadius: "calc(var(--Input-radius) - var(--variant-borderWidth, 0px))"
  }, !t.endDecorator && {
    marginInlineEnd: "calc(-1 * var(--Input-paddingInline))",
    paddingInlineEnd: "var(--Input-paddingInline)",
    borderTopRightRadius: "calc(var(--Input-radius) - var(--variant-borderWidth, 0px))",
    borderBottomRightRadius: "calc(var(--Input-radius) - var(--variant-borderWidth, 0px))"
  }),
  "&::-webkit-input-placeholder": {
    color: "var(--Input-placeholderColor)",
    opacity: "var(--Input-placeholderOpacity)"
  },
  "&::-moz-placeholder": {
    // Firefox 19+
    color: "var(--Input-placeholderColor)",
    opacity: "var(--Input-placeholderOpacity)"
  },
  "&:-ms-input-placeholder": {
    // IE11
    color: "var(--Input-placeholderColor)",
    opacity: "var(--Input-placeholderOpacity)"
  },
  "&::-ms-input-placeholder": {
    // Edge
    color: "var(--Input-placeholderColor)",
    opacity: "var(--Input-placeholderOpacity)"
  }
})), ur = s("div")({
  "--Button-margin": "0 0 0 calc(var(--Input-decoratorChildOffset) * -1)",
  "--IconButton-margin": "0 0 0 calc(var(--Input-decoratorChildOffset) * -1)",
  "--Icon-margin": "0 0 0 calc(var(--Input-paddingInline) / -4)",
  display: "inherit",
  alignItems: "center",
  paddingBlock: "var(--unstable_InputPaddingBlock)",
  // for wrapping Autocomplete's tags
  flexWrap: "wrap",
  // for wrapping Autocomplete's tags
  marginInlineEnd: "var(--Input-gap)",
  color: "var(--Input-decoratorColor)",
  cursor: "initial"
}), Ir = s("div")({
  "--Button-margin": "0 calc(var(--Input-decoratorChildOffset) * -1) 0 0",
  "--IconButton-margin": "0 calc(var(--Input-decoratorChildOffset) * -1) 0 0",
  "--Icon-margin": "0 calc(var(--Input-paddingInline) / -4) 0 0",
  display: "inherit",
  alignItems: "center",
  marginInlineStart: "var(--Input-gap)",
  color: "var(--Input-decoratorColor)",
  cursor: "initial"
}), vr = s(pr, {
  name: "JoyInput",
  slot: "Root",
  overridesResolver: (t, o) => o.root
})({}), gr = s(cr, {
  name: "JoyInput",
  slot: "Input",
  overridesResolver: (t, o) => o.input
})({}), hr = s(ur, {
  name: "JoyInput",
  slot: "StartDecorator",
  overridesResolver: (t, o) => o.startDecorator
})({}), fr = s(Ir, {
  name: "JoyInput",
  slot: "EndDecorator",
  overridesResolver: (t, o) => o.endDecorator
})({}), mr = /* @__PURE__ */ O.forwardRef(function(o, p) {
  var e, i, l, d, u, c;
  const C = nr({
    props: o,
    name: "JoyInput"
  }), x = er(n({}, C, {
    disabledInProp: o.disabled
  }), S), {
    propsToForward: _,
    rootStateClasses: H,
    inputStateClasses: R,
    getRootProps: P,
    getInputProps: T,
    formControl: a,
    focused: W,
    error: $ = !1,
    disabled: k,
    fullWidth: E = !1,
    size: B = "md",
    color: N = "neutral",
    variant: F = "outlined",
    startDecorator: D,
    endDecorator: z,
    component: j,
    slots: J = {},
    slotProps: L = {}
  } = x, V = or(x, sr);
  if (process.env.NODE_ENV !== "production") {
    const m = a == null ? void 0 : a.registerEffect;
    O.useEffect(() => {
      if (m)
        return m();
    }, [m]);
  }
  const f = (e = (i = o.error) != null ? i : a == null ? void 0 : a.error) != null ? e : $, U = (l = (d = o.size) != null ? d : a == null ? void 0 : a.size) != null ? l : B, M = (u = o.color) != null ? u : f ? "danger" : (c = a == null ? void 0 : a.color) != null ? c : N, I = n({
    instanceColor: f ? "danger" : o.color
  }, C, {
    fullWidth: E,
    color: M,
    disabled: k,
    error: f,
    focused: W,
    size: U,
    variant: F
  }), v = dr(I), g = n({}, V, {
    component: j,
    slots: J,
    slotProps: L
  }), [q, w] = h("root", {
    ref: p,
    className: [v.root, H],
    elementType: vr,
    getSlotProps: P,
    externalForwardedProps: g,
    ownerState: I
  }), [A, G] = h("input", n({}, a && {
    additionalProps: {
      id: a.htmlFor,
      "aria-describedby": a["aria-describedby"]
    }
  }, {
    className: [v.input, R],
    elementType: gr,
    getSlotProps: T,
    internalForwardedProps: _,
    externalForwardedProps: g,
    ownerState: I
  })), [K, Q] = h("startDecorator", {
    className: v.startDecorator,
    elementType: hr,
    externalForwardedProps: g,
    ownerState: I
  }), [X, Y] = h("endDecorator", {
    className: v.endDecorator,
    elementType: fr,
    externalForwardedProps: g,
    ownerState: I
  });
  return /* @__PURE__ */ ir(q, n({}, w, {
    children: [D && /* @__PURE__ */ y(K, n({}, Q, {
      children: D
    })), /* @__PURE__ */ y(A, n({}, G)), z && /* @__PURE__ */ y(X, n({}, Y, {
      children: z
    }))]
  }));
});
process.env.NODE_ENV !== "production" && (mr.propTypes = {
  // ┌────────────────────────────── Warning ──────────────────────────────┐
  // │ These PropTypes are generated from the TypeScript type definitions. │
  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
  // └─────────────────────────────────────────────────────────────────────┘
  /**
   * @ignore
   */
  autoComplete: r.string,
  /**
   * @ignore
   */
  autoFocus: r.bool,
  /**
   * @ignore
   */
  children: r.node,
  /**
   * Class name applied to the root element.
   */
  className: r.string,
  /**
   * 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
   */
  defaultValue: r.oneOfType([r.arrayOf(r.string), r.number, 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,
  /**
   * If `true`, the input will take up the full width of its container.
   * @default false
   */
  fullWidth: r.bool,
  /**
   * @ignore
   */
  id: r.string,
  /**
   * @ignore
   */
  name: r.string,
  /**
   * @ignore
   */
  onChange: r.func,
  /**
   * @ignore
   */
  placeholder: r.string,
  /**
   * @ignore
   */
  readOnly: r.bool,
  /**
   * @ignore
   */
  required: r.bool,
  /**
   * 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]),
  /**
   * @ignore
   */
  value: r.oneOfType([r.arrayOf(r.string), r.number, r.string]),
  /**
   * 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 {
  mr as I,
  pr as S,
  cr as a,
  ur as b,
  Ir as c
};
