import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
import { forwardRef, Fragment } from "react";
import { Box } from "../Box/Box.mjs";
import { Field } from "../private/Field/Field.mjs";
import { field } from "./Dropdown.css.mjs";
import { Text } from "../Accordion/AccordionItem.mjs";
import { IconChevron } from "../icons/IconChevron/IconChevron.mjs";
const Dropdown = forwardRef(
  (props, ref) => {
    const {
      children,
      value,
      onChange,
      onBlur,
      onFocus,
      placeholder,
      disabled,
      ...restProps
    } = props;
    return /* @__PURE__ */ jsx(
      Field,
      {
        ...restProps,
        disabled,
        prefix: void 0,
        secondaryMessage: null,
        value,
        children: (overlays, { className, paddingRight, ...fieldProps }, icon) => /* @__PURE__ */ jsxs(Fragment, { children: [
          icon,
          /* @__PURE__ */ jsx(
            Box,
            {
              component: "select",
              value,
              defaultValue: typeof value === "undefined" ? "" : void 0,
              onChange,
              onBlur,
              onFocus,
              placeholder,
              className: [field, className],
              ...fieldProps,
              ref,
              children: /* @__PURE__ */ jsxs(Fragment$1, { children: [
                !value || placeholder ? /* @__PURE__ */ jsx("option", { value: "", disabled: true, children: disabled ? "" : placeholder }) : null,
                children
              ] })
            }
          ),
          overlays,
          /* @__PURE__ */ jsx(
            Box,
            {
              position: "absolute",
              display: "flex",
              alignItems: "center",
              justifyContent: "center",
              pointerEvents: "none",
              height: "touchable",
              width: "touchable",
              top: 0,
              right: 0,
              children: /* @__PURE__ */ jsx(Text, { baseline: false, children: /* @__PURE__ */ jsx(IconChevron, { tone: disabled ? "secondary" : void 0 }) })
            }
          )
        ] })
      }
    );
  }
);
Dropdown.displayName = "Dropdown";
export {
  Dropdown
};
