import { jsxs as d, jsx as l } from "react/jsx-runtime";
import { useButton as ee } from "@react-aria/button";
import { useFocusRing as le, FocusScope as oe } from "@react-aria/focus";
import { useState as i, useRef as te, useId as re, useEffect as f, useCallback as se } from "react";
import { usePopper as ae } from "react-popper";
import { CheckboxState as V } from "../Checkbox/Checkbox.es.js";
import { Checklist as ne, ChecklistDirection as ce } from "../Checklist/Checklist.es.js";
import { useDropdownAutoHeight as ue, DEFAULT_DROPDOWN_MAX_HEIGHT as ie } from "../../hooks/useDropdownAutoHeight.es.js";
import { EnablePortalWrapper as pe } from "../../utilities/dialogs/EnablePortalWrapper.es.js";
import { merge as de } from "../../utilities/merge.es.js";
import { Validation as fe } from "../../utilities/validation.es.js";
import { useClickOutside as we, getPaddingClasses as he } from "./helpers.es.js";
import { Trigger as ge, TriggerEmphasis as me } from "../Trigger/Trigger.es.js";
import { Text as S } from "../../typography/Text/Text.es.js";
import { Tag as j, TagSize as w, TagType as B } from "../Tag/Tag.es.js";
import { TextInput as be } from "../TextInput/TextInput.es.js";
var xe = /* @__PURE__ */ ((o) => (o.Default = "Default", o.Summarized = "Summarized", o))(xe || {}), ve = /* @__PURE__ */ ((o) => (o.Small = "Small", o.Medium = "Medium", o))(ve || {});
const Se = ({
  items: o,
  activeItemKeys: a,
  onSelectionChange: h,
  ariaLabel: C = "Select list",
  disabled: T = !1,
  placeholder: D,
  label: M,
  type: k = "Default",
  size: g = "Medium",
  validation: L = fe.Default,
  summarizedLabel: N,
  indeterminateItemKeys: t,
  flip: W = !1,
  emphasis: _ = me.Default,
  enablePortal: G = !0,
  filterLabel: U,
  emptyFilteredResultsLabel: X
}) => {
  const [n, m] = i(!1), [b, O] = i([]), [P, q] = i(""), c = te(null), [z, F] = i(null), [u, J] = i(null), { isFocusVisible: Q, focusProps: Y } = le(), { maxHeight: E } = ue({ current: u }, { isOpen: n, autoResize: !0 }), A = a.length > 0, Z = N ?? [a.length, "selected"].join(" ");
  we(null, () => m(!1), [c == null ? void 0 : c.current, z]);
  const $ = E !== ie, R = re(), x = () => m((e) => !e), { buttonProps: y } = ee(
    {
      onPress: x,
      onKeyDown: (e) => {
        e.key === "Escape" && m(!1);
      },
      elementType: "div"
    },
    { current: u }
  ), I = (e) => {
    const r = new Set(a);
    r.has(e) ? r.delete(e) : r.add(e), h(Array.from(r));
  }, K = (e) => {
    e.code === "Space" && x();
  }, H = () => n ? B.SelectedWithFocus : B.Selected;
  f(() => {
    F(c == null ? void 0 : c.current);
  }, []), f(() => {
    O(
      o.map((e) => t != null && t.includes(e.value) ? { ...e, label: e.value, state: V.Mixed } : { ...e, label: e.value })
    );
  }, [o, t]);
  const v = se(
    (e) => {
      q(e), O(
        o.reduce((r, s) => s.isCategory || s.isDivider || s.value.toLowerCase().includes(e.toLowerCase()) ? t != null && t.includes(s.value) ? [...r, { ...s, label: s.value, state: V.Mixed }] : [...r, { ...s, label: s.value }] : r, [])
      );
    },
    [t, o]
  );
  f(() => {
    !n && v("");
  }, [n, v]);
  const p = ae(u, z, {
    placement: "bottom-start",
    strategy: "fixed",
    modifiers: [
      {
        name: "offset",
        options: {
          offset: [0, 8]
        }
      },
      {
        name: "flip",
        enabled: W
      }
    ]
  });
  return f(() => {
    (async () => {
      p.update && await p.update();
    })().catch(console.error);
  }, [a]), /* @__PURE__ */ d("div", { className: "tw-relative", ref: c, children: [
    /* @__PURE__ */ l(
      ge,
      {
        disabled: T,
        buttonProps: y,
        isFocusVisible: Q,
        isOpen: n,
        validation: L,
        emphasis: _,
        children: /* @__PURE__ */ l("div", { className: de(["tw-flex tw-flex-1 tw-gap-2", he(g)]), ref: J, children: /* @__PURE__ */ l(
          "div",
          {
            className: "tw-flex tw-flex-1 tw-gap-2 focus:tw-outline-0",
            onClick: x,
            role: "combobox",
            "aria-expanded": n,
            "aria-controls": R,
            "aria-label": C,
            ...Y,
            tabIndex: 0,
            onKeyDown: K,
            children: /* @__PURE__ */ d("div", { className: "tw-flex tw-flex-wrap tw-gap-2 tw-outline-none tw-items-center tw-min-h-[28px]", children: [
              M && A && /* @__PURE__ */ l(S, { weight: "strong", children: M }),
              k === "Default" && a.map((e) => /* @__PURE__ */ l(
                j,
                {
                  type: H(),
                  label: e.toString(),
                  size: g === "Small" ? w.Small : w.Medium,
                  onClick: T ? void 0 : () => I(e)
                },
                e
              )),
              k === "Summarized" && (A || N) && /* @__PURE__ */ l(
                j,
                {
                  type: H(),
                  label: Z,
                  size: g === "Small" ? w.Small : w.Medium,
                  onClick: (t == null ? void 0 : t.length) === 0 ? () => h([]) : void 0
                }
              ),
              a.length === 0 && D && /* @__PURE__ */ l(S, { color: "weak", children: D })
            ] })
          }
        ) })
      }
    ),
    n && $ && /* @__PURE__ */ l(pe, { enablePortal: G, children: /* @__PURE__ */ l(
      "div",
      {
        id: R,
        ref: F,
        className: "tw-absolute tw-left-0 tw-w-full tw-overflow-hidden tw-p-0 tw-shadow-mid tw-list-none tw-m-0 tw-mt-2 tw-z-[120000] tw-bg-base tw-min-w-[18rem]",
        style: {
          ...p.styles.popper,
          width: u == null ? void 0 : u.getBoundingClientRect().width
        },
        ...p.attributes.popper,
        children: /* @__PURE__ */ d(oe, { restoreFocus: !0, children: [
          /* @__PURE__ */ l("div", { className: "tw-p-4 tw-pb-0", children: /* @__PURE__ */ l(
            be,
            {
              value: P,
              placeholder: U,
              clearable: !0,
              onChange: v,
              focusOnMount: !0
            }
          ) }),
          /* @__PURE__ */ d(
            "div",
            {
              className: "tw-p-4 tw-overflow-y-auto tw-overflow-x-hidden tw-w-full tw-relative",
              style: { maxHeight: E },
              children: [
                b.length > 0 && /* @__PURE__ */ l(
                  ne,
                  {
                    activeValues: a.map((e) => e.toString()),
                    setActiveValues: h,
                    checkboxes: b.filter((e) => !e.isDivider && !e.isCategory),
                    direction: ce.Vertical,
                    ariaLabel: C
                  }
                ),
                b.length === 0 && P !== "" && /* @__PURE__ */ l(S, { size: "small", color: "weak", children: X })
              ]
            }
          )
        ] })
      },
      "content"
    ) })
  ] });
};
Se.displayName = "FondueFilterableMultiSelect";
export {
  Se as FilterableMultiSelect,
  ve as FilterableMultiSelectSize,
  xe as FilterableMultiSelectType
};
//# sourceMappingURL=FilterableMultiSelect.es.js.map
