"use strict";
const jsxRuntime = require("react/jsx-runtime");
const React = require("react");
const styles_lib_components_Button_Button_cjs = require("../../Button/Button.cjs");
const styles_lib_components_Accordion_Accordion_cjs = require("../../Accordion/Accordion.cjs");
const styles_lib_components_Box_Box_cjs = require("../../Box/Box.cjs");
const styles_lib_components_private_InlineField_InlineField_css_cjs = require("./InlineField.css.cjs");
const styles_lib_components_Box_BackgroundContext_cjs = require("../../Box/BackgroundContext.cjs");
const styles_lib_components_Accordion_AccordionItem_cjs = require("../../Accordion/AccordionItem.cjs");
const tones = ["neutral", "critical"];
const Indicator = ({
  type,
  checked,
  hover = false,
  disabled = false
}) => {
  const isCheckbox = type === "checkbox";
  const iconTone = (() => {
    if (disabled) {
      return "secondary";
    }
    if (hover) {
      return "formAccent";
    }
  })();
  return isCheckbox ? /* @__PURE__ */ jsxRuntime.jsxs(
    styles_lib_components_Box_Box_cjs.Box,
    {
      height: "full",
      transition: "fast",
      position: "relative",
      className: styles_lib_components_private_InlineField_InlineField_css_cjs.checkboxIndicator,
      children: [
        /* @__PURE__ */ jsxRuntime.jsx(
          styles_lib_components_Box_Box_cjs.Box,
          {
            position: "absolute",
            inset: 0,
            transition: "fast",
            opacity: checked !== "mixed" ? 0 : void 0,
            children: /* @__PURE__ */ jsxRuntime.jsx(styles_lib_components_Accordion_AccordionItem_cjs.IconMinus, { size: "fill", tone: iconTone })
          }
        ),
        /* @__PURE__ */ jsxRuntime.jsx(
          styles_lib_components_Box_Box_cjs.Box,
          {
            position: "absolute",
            inset: 0,
            transition: "fast",
            opacity: checked !== true ? 0 : void 0,
            children: /* @__PURE__ */ jsxRuntime.jsx(styles_lib_components_Accordion_AccordionItem_cjs.IconTick, { size: "fill", tone: iconTone })
          }
        )
      ]
    }
  ) : /* @__PURE__ */ jsxRuntime.jsx(
    styles_lib_components_Box_Box_cjs.Box,
    {
      background: disabled ? { lightMode: "neutralLight", darkMode: "surfaceDark" } : "formAccent",
      transition: "fast",
      width: "full",
      height: "full",
      borderRadius: "full",
      className: styles_lib_components_private_InlineField_InlineField_css_cjs.radioIndicator
    }
  );
};
const StyledInput = React.forwardRef(
  ({
    id,
    name,
    value,
    checked,
    data,
    onChange,
    type,
    tone = "neutral",
    disabled = false,
    required,
    tabIndex,
    size = "standard",
    "aria-describedby": ariaDescribedBy,
    "aria-labelledby": ariaLabelledBy,
    "aria-label": ariaLabel,
    ...restProps
  }, forwardedRef) => {
    const defaultRef = React.useRef(null);
    const ref = forwardedRef || defaultRef;
    const indeterminateRef = React.useRef(false);
    if (tones.indexOf(tone) === -1) {
      throw new Error(`Invalid tone: ${tone}`);
    }
    const isCheckbox = type === "checkbox";
    const fieldBorderRadius = isCheckbox ? "standard" : "full";
    const accentBackground = disabled ? "neutralLight" : "formAccent";
    const isMixed = isCheckbox && checked === "mixed";
    const fieldBackground = disabled ? { lightMode: "neutralSoft", darkMode: "neutral" } : { lightMode: "surface" };
    const defaultBorder = checked ? "formAccent" : "default";
    React.useEffect(() => {
      if (ref && typeof ref === "object" && ref.current && isCheckbox) {
        ref.current.indeterminate = isMixed;
        indeterminateRef.current = isMixed;
      }
    }, [ref, isMixed, isCheckbox]);
    const { lightMode } = styles_lib_components_Box_BackgroundContext_cjs.useBackgroundLightness();
    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
      /* @__PURE__ */ jsxRuntime.jsx(
        styles_lib_components_Box_Box_cjs.Box,
        {
          component: "input",
          type,
          id,
          name,
          value,
          onChange: isMixed ? (e) => {
            if (ref && typeof ref === "object" && ref.current) {
              ref.current.indeterminate = indeterminateRef.current;
            }
            if (typeof onChange === "function") {
              onChange(e);
            }
          } : onChange,
          checked: checked === "mixed" ? false : checked,
          position: "absolute",
          zIndex: 1,
          className: [
            styles_lib_components_private_InlineField_InlineField_css_cjs.realField,
            styles_lib_components_private_InlineField_InlineField_css_cjs.sizeVars[size],
            isMixed ? styles_lib_components_private_InlineField_InlineField_css_cjs.isMixed : void 0
          ],
          cursor: !disabled ? "pointer" : void 0,
          opacity: 0,
          "aria-describedby": ariaDescribedBy,
          "aria-labelledby": ariaLabelledBy,
          "aria-label": ariaLabel,
          "aria-checked": isMixed ? "mixed" : checked,
          "aria-required": required,
          disabled,
          ref,
          tabIndex,
          ...styles_lib_components_Accordion_Accordion_cjs.buildDataAttributes({ data, validateRestProps: restProps })
        }
      ),
      /* @__PURE__ */ jsxRuntime.jsxs(
        styles_lib_components_Box_Box_cjs.Box,
        {
          flexShrink: 0,
          position: "relative",
          className: [styles_lib_components_private_InlineField_InlineField_css_cjs.fakeField, styles_lib_components_private_InlineField_InlineField_css_cjs.sizeVars[size]],
          background: fieldBackground,
          borderRadius: fieldBorderRadius,
          children: [
            /* @__PURE__ */ jsxRuntime.jsx(
              styles_lib_components_Button_Button_cjs.FieldOverlay,
              {
                variant: disabled ? "disabled" : defaultBorder,
                borderRadius: fieldBorderRadius,
                visible: tone !== "critical" || disabled,
                className: {
                  [styles_lib_components_private_InlineField_InlineField_css_cjs.hideBorderOnDarkBackgroundInLightMode]: lightMode === "dark"
                }
              }
            ),
            /* @__PURE__ */ jsxRuntime.jsx(
              styles_lib_components_Button_Button_cjs.FieldOverlay,
              {
                variant: "critical",
                borderRadius: fieldBorderRadius,
                visible: tone === "critical" && !disabled
              }
            ),
            /* @__PURE__ */ jsxRuntime.jsx(
              styles_lib_components_Button_Button_cjs.FieldOverlay,
              {
                variant: tone === "critical" && isCheckbox ? tone : void 0,
                background: isCheckbox ? accentBackground : void 0,
                borderRadius: fieldBorderRadius,
                className: styles_lib_components_private_InlineField_InlineField_css_cjs.selected,
                children: /* @__PURE__ */ jsxRuntime.jsx(Indicator, { type, disabled, checked })
              }
            ),
            /* @__PURE__ */ jsxRuntime.jsx(
              styles_lib_components_Button_Button_cjs.FieldOverlay,
              {
                variant: "focus",
                borderRadius: fieldBorderRadius,
                className: styles_lib_components_private_InlineField_InlineField_css_cjs.focusOverlay
              }
            ),
            /* @__PURE__ */ jsxRuntime.jsx(
              styles_lib_components_Button_Button_cjs.FieldOverlay,
              {
                variant: "formAccent",
                borderRadius: fieldBorderRadius,
                className: styles_lib_components_private_InlineField_InlineField_css_cjs.hoverOverlay,
                children: /* @__PURE__ */ jsxRuntime.jsx(Indicator, { type, hover: true, checked: true })
              }
            )
          ]
        }
      )
    ] });
  }
);
exports.StyledInput = StyledInput;
