import { jsx as d } from "react/jsx-runtime";
import { useState as D, useCallback as L, useMemo as s } from "react";
import { g as M } from "../../../../CommandPrimitive-DexRxw-2.js";
import p from "../../../jtl-dropdown/types/DropdownItem.js";
import T from "../../../jtl-dropdown/JTLDropdown.js";
import j from "../../../button/Button.js";
const F = ({
  maxLength: i,
  placeholder: a,
  value: r,
  onValueChange: S,
  onBlur: b,
  onFocus: c,
  searchConfig: t,
  showFocusBorder: x,
  className: I,
  type: w,
  disabled: k,
  ref: y
}) => {
  const [e, f] = D(() => (t == null ? void 0 : t.defaultSelectedItem) || []), o = t == null ? void 0 : t.onSelectionChange, u = L(
    (l) => {
      const n = e.includes(l) ? e.filter((B) => B !== l) : [...e, l];
      f(n), o == null || o(n, r ?? "");
    },
    [e, o, r]
  ), m = s(() => t ? t.groups.flatMap((l) => [
    {
      type: p.Label,
      label: l.heading
    },
    {
      type: p.Separator
    },
    ...l.items.map((n) => ({
      type: p.Checkbox,
      label: n.label,
      isSelected: e.includes(n.value),
      onClick: () => {
        u(n.value);
      }
    }))
  ]) : [], [t, e, u]), v = s(() => !t || m.length === 0 ? null : /* @__PURE__ */ d(T, { position: "right", menuItems: m, width: "var(--width-w-72)", children: /* @__PURE__ */ d(j, { variant: "ghost", size: "icon", icon: "Settings2" }) }), [m, t]);
  return /* @__PURE__ */ d(
    M,
    {
      ref: y,
      maxLength: i,
      placeholder: a,
      value: r,
      onValueChange: S,
      onBlur: b,
      onFocus: c,
      suffix: v,
      showFocusBorder: x,
      className: I,
      type: w,
      disabled: k
    }
  );
};
export {
  F as default
};
//# sourceMappingURL=CommandInput.js.map
