import { jsx as o } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
import L from "classnames";
import { useMemo as m } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
import { ButtonVariant as M } from "../../../Button/types.js";
import k from "../../../Typography/Typography.js";
import { TypographyVariant as Y, TypographyElement as F } from "../../../Typography/types.js";
import { DEFAULT_BUTTON_CLASSNAME as E } from "../../../Button/constants.js";
import { DROPDOWN_BUTTON_ICON_CLASS as j, DROPDOWN_BUTTON_TEXT_CLASS as w, DROPDOWN_BUTTON_MULTI_SELECT_COUNTER_CLASS as H, DROPDOWN_BUTTON_COLLAPSE_INDICATOR_CLASS as X, DROPDOWN_BUTTON_CLEAR_CLASS as q, DROPDOWN_BUTTON_CLASS as z, DROPDOWN_BUTTON_VALID_CLASS as G, DROPDOWN_BUTTON_INVALID_CLASS as J, DROPDOWN_BUTTON_READONLY_CLASS as Q, DROPDOWN_BUTTON_HAS_SELECTION_CLASS as Z, DROPDOWN_BUTTON_ACTIVE_CLASS as $ } from "../constants.js";
import { InteractionKeyCode as B } from "../../../../types.js";
import oo from "../../../../../core/Context/preact/useCoreContext.js";
import { Fragment as ao } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/dist/preact.module.js";
import ro from "../../../Img/Img.js";
import { Icon as R } from "../../../Icon/Icon.js";
import eo from "../../../Button/Button.js";
import { boolOrFalse as U } from "../../../../../utils/value/bool.js";
import { getModifierClasses as to } from "../../../../../utils/preact/className.js";
const no = ({
  active: t,
  disabled: O,
  className: e,
  filterable: n,
  toggleButtonRef: l,
  buttonVariant: c,
  ...a
}) => {
  const r = c ?? M.SECONDARY, s = m(() => to(E, [r], [E]), [r]), N = m(() => n ? L(s, e) : e, [s, e, n]);
  return n ? /* @__PURE__ */ o("div", { ...a, className: N, ref: l }) : /* @__PURE__ */ o(
    eo,
    {
      ...a,
      className: N,
      disabled: O,
      variant: r,
      ref: l,
      "aria-label": a["aria-label"],
      "aria-labelledby": a["aria-labelledby"]
    }
  );
}, uo = ({
  active: t,
  clearable: O,
  filterable: e,
  multiSelect: n,
  placeholder: l,
  onClear: c,
  readonly: a,
  showList: r,
  withoutCollapseIndicator: s,
  buttonVariant: N,
  isInvalid: T,
  isValid: P,
  name: h,
  toggleList: x,
  onButtonKeyDown: y,
  toggleButtonRef: I,
  ariaDescribedBy: W,
  id: g,
  renderButtonContent: d,
  selectListId: D,
  onInput: v,
  onFilterInputKeyDown: V,
  filterInputRef: K,
  appliedFilterNumber: S,
  "aria-label": C,
  "aria-labelledby": A
}) => {
  const { i18n: b } = oo(), _ = m(() => l?.trim() || b.get("common.inputs.select.placeholder"), [b, l]), i = m(() => U(n) ? void 0 : t[0], [t, n]), f = m(() => i?.name?.trim() || _, [i, _]), u = m(() => U(O) && !!t.length && !a, [t, O, a]);
  return /* @__PURE__ */ o(
    no,
    {
      buttonVariant: N,
      active: t,
      disabled: a,
      "aria-disabled": a,
      "aria-expanded": r,
      "aria-haspopup": "dialog",
      "aria-invalid": T,
      className: L(z, {
        [$]: r,
        [Z]: !!t.length,
        [Q]: a,
        [J]: T,
        [G]: P
      }),
      filterable: e,
      name: h,
      onClick: a ? void 0 : x,
      onKeyDown: a ? void 0 : y,
      role: !e || r ? "button" : void 0,
      tabIndex: 0,
      title: f,
      toggleButtonRef: I,
      type: e ? void 0 : "button",
      "aria-describedby": W,
      id: g,
      ...r && e ? {} : { "aria-label": C, "aria-labelledby": A },
      children: [
        d ? d({ item: i }) : r && e ? /* @__PURE__ */ o(
          "input",
          {
            "aria-autocomplete": "list",
            "aria-label": C,
            "aria-labelledby": A,
            "aria-controls": D,
            "aria-expanded": r,
            "aria-owns": D,
            "aria-invalid": T,
            autoComplete: "off",
            className: "adyen-pe-filter-input",
            onInput: v,
            onKeyDown: V,
            placeholder: _,
            ref: K,
            role: "combobox",
            type: "text"
          }
        ) : /* @__PURE__ */ o(ao, { children: [
          i?.icon && /* @__PURE__ */ o(ro, { className: j, src: i.icon, alt: i?.name?.trim() ?? "" }),
          /* @__PURE__ */ o("span", { className: w, children: i?.selectedOptionName?.trim() || f }),
          n && S > 0 && /* @__PURE__ */ o("div", { className: H, children: /* @__PURE__ */ o(k, { el: F.SPAN, variant: Y.BODY, stronger: !0, children: S }) })
        ] }),
        !s && !u && /* @__PURE__ */ o("span", { className: X, children: /* @__PURE__ */ o(R, { name: "chevron-down" }) }),
        u && /* @__PURE__ */ o(
          "span",
          {
            role: "button",
            tabIndex: 0,
            className: q,
            onClick: c,
            onKeyDown: (p) => {
              (p.code === B.ENTER || p.code === B.SPACE) && c?.(p);
            },
            children: /* @__PURE__ */ o(R, { name: "cross-circle-fill" })
          }
        )
      ]
    }
  );
};
export {
  uo as default
};
