import { jsx as c, jsxs as I } from "react/jsx-runtime";
import * as a from "@radix-ui/react-popover";
import { useComboboxSelectors as p, useComboboxControls as P, comboboxSelectors as N, comboboxActions as g, useActiveComboboxStore as j, useComboboxContentState as k, useComboboxContent as z, useComboboxItem as B } from "@udecode/plate-combobox";
import { useEventEditorSelectors as D, useEditorSelector as O, usePlateSelectors as F, useEditorRef as K } from "@udecode/plate-core";
import { createVirtualRef as L } from "@udecode/plate-floating";
import { useEffect as T, forwardRef as V } from "react";
import { zIndexLayers as _ } from "../../helpers/zIndexLayers.es.js";
import { merge as q } from "../../../../utilities/merge.es.js";
const y = V(
  ({ combobox: o, index: t, item: r, onRenderItem: n, className: e, ...s }, m) => {
    const { props: i } = B({ item: r, index: t, combobox: o, onRenderItem: n });
    return /* @__PURE__ */ c(
      "div",
      {
        ref: m,
        className: q([
          "tw-relative tw-flex tw-h-9 tw-cursor-pointer tw-select-none tw-items-center tw-rounded-sm tw-px-2 tw-py-1.5 tw-text-sm tw-outline-none tw-transition-colors",
          "tw-text-text-weak tw-text-body-medium tw-px-5 hover:tw-bg-box-neutral hover:tw-text-box-neutral-inverse-hover data-[highlighted=true]:tw-text-box-neutral-inverse-hover data-[highlighted=true]:tw-bg-box-neutral data-[highlighted=true]:hover:tw-bg-box-neutral-hover",
          e
        ]),
        ...i,
        ...s
      }
    );
  }
);
y.displayName = "ComboboxItem";
function G(o) {
  const { component: t, items: r, portalElement: n, combobox: e, onRenderItem: s } = o, m = K(), i = p.filteredItems(), u = j(), d = k({ items: r, combobox: e }), { menuProps: x, targetRange: w } = z(d);
  return /* @__PURE__ */ I(a.Root, { open: !0, children: [
    /* @__PURE__ */ c(a.PopoverAnchor, { virtualRef: L(m, w ?? void 0) }),
    /* @__PURE__ */ c(a.Portal, { container: n, children: /* @__PURE__ */ I(
      a.Content,
      {
        ...x,
        sideOffset: 5,
        style: { zIndex: _.combobox },
        side: "bottom",
        align: "start",
        className: "tw-m-0 tw-max-h-[288px] tw-w-[270px] tw-overflow-scroll tw-rounded-md tw-bg-base tw-py-2 tw-shadow-md tw-border tw-border-line-strong",
        onOpenAutoFocus: (b) => b.preventDefault(),
        children: [
          t ? t({ store: u }) : null,
          i.map((b, l) => /* @__PURE__ */ c(
            y,
            {
              item: b,
              combobox: e,
              index: l,
              onRenderItem: s
            },
            b.key
          ))
        ]
      }
    ) })
  ] });
}
function Y({
  id: o,
  trigger: t,
  searchPattern: r,
  onSelectItem: n,
  controlled: e,
  maxSuggestions: s,
  filter: m,
  sort: i,
  disabled: u,
  ...d
}) {
  var f, h, v;
  const x = p.items(), w = u ?? (x.length === 0 && !((f = d.items) != null && f.length)), b = (v = (h = D).focus) == null ? void 0 : v.call(h), l = P(), E = p.activeId(), R = O((C) => !!C.selection, []), S = F().id();
  return T(() => {
    const { [o]: C, ...A } = N.state().byId;
    g.byId(A), g.setComboboxById({
      id: o,
      trigger: t,
      searchPattern: r,
      controlled: e,
      onSelectItem: n,
      maxSuggestions: s,
      filter: m,
      sort: i
    });
  }, [o, t, r, e, n, s, m, i]), !l || !R || b !== S || E !== o || w ? null : /* @__PURE__ */ c(G, { combobox: l, ...d });
}
export {
  Y as Combobox,
  G as ComboboxContent,
  y as ComboboxItem
};
//# sourceMappingURL=Combobox.es.js.map
