import { defineComponent as B, mergeModels as D, useModel as z, ref as b, computed as f, resolveComponent as n, createBlock as y, openBlock as _, withCtx as m, createElementVNode as c, normalizeStyle as L, withDirectives as U, createElementBlock as $, createVNode as d, unref as E, vShow as H, Fragment as N, renderList as O, toDisplayString as g, normalizeClass as q } from "vue";
import { u as A } from "./vue-i18n-C1hP_yGq.js";
const K = (s, u) => {
  const t = s.__vccOpts || s;
  for (const [o, i] of u)
    t[o] = i;
  return t;
}, P = { class: "fm-typo-en-body-lg-400 flex gap-4 text-fm-color-typo-primary" }, T = { class: "fm-typo-en-body-lg-400 line-clamp-1" }, j = { class: "sticky top-0" }, Q = /* @__PURE__ */ B({
  __name: "SelectComponent",
  props: /* @__PURE__ */ D({
    items: {
      type: Array,
      default: () => []
    },
    placeHolder: {
      type: String,
      default: ""
    },
    label: {
      type: String,
      default: ""
    },
    disableSearch: {
      type: Boolean,
      default: !1
    }
  }, {
    modelValue: { required: !0 },
    modelModifiers: {}
  }),
  emits: ["update:modelValue"],
  setup(s) {
    const { t: u } = A(), t = z(s, "modelValue"), o = s, i = (e) => {
      t.value = e.value, setTimeout(() => {
        r.value = !1;
      }, 0);
    }, r = b(!1), p = b(""), F = f(
      () => o.items.filter(
        (e) => e.label.toLowerCase().indexOf(p.value.toLowerCase()) !== -1
      )
    ), x = f(
      () => {
        var e;
        return ((e = o.items.find((a) => a.value === t.value)) == null ? void 0 : e.label) ?? u("report.common.select");
      }
    ), w = f(() => o.items.filter((e) => e.value === t.value));
    return (e, a) => {
      const M = n("FmIcon"), V = n("FmField"), S = n("FmSearch"), C = n("FmMenuDivider"), k = n("FmMenuItem"), I = n("FmMenu");
      return _(), y(I, {
        trigger: "click",
        shift: !0,
        "max-height": 300,
        width: 200,
        onMenuChanged: a[1] || (a[1] = (v) => {
          r.value = v;
        })
      }, {
        "menu-button": m(() => [
          c("p", P, g(o.label), 1),
          d(V, {
            class: q(["cursor-pointer", `${r.value ? "border-fm-color-primary" : ""}`]),
            focused: r.value
          }, {
            append: m(() => [
              d(M, {
                color: "black",
                name: r.value ? "expand_less" : "expand_more",
                size: "md"
              }, null, 8, ["name"])
            ]),
            default: m(() => [
              c("div", T, g(x.value), 1)
            ]),
            _: 1
          }, 8, ["class", "focused"])
        ]),
        "menu-wrapper": m(({ maxHeight: v }) => [
          c("div", {
            style: L({ maxHeight: `${v}px` }),
            class: "bg-fm-color-neutral-white overflow-y-auto overflow-x-hidden rounded-md shadow-light-300 w-[250px]"
          }, [
            U(c("div", j, [
              d(S, {
                modelValue: p.value,
                "onUpdate:modelValue": a[0] || (a[0] = (l) => p.value = l),
                placeholder: E(u)("report.select.filterPlaceholder")
              }, null, 8, ["modelValue", "placeholder"]),
              d(C)
            ], 512), [
              [H, !o.disableSearch]
            ]),
            (_(!0), $(N, null, O(F.value, (l) => (_(), y(k, {
              key: l.value,
              label: l.label,
              sublabel: l.sublabel,
              "model-value": w.value.some((h) => h.value === l.value),
              value: l.value,
              "onUpdate:modelValue": (h) => i(l)
            }, null, 8, ["label", "sublabel", "model-value", "value", "onUpdate:modelValue"]))), 128))
          ], 4)
        ]),
        _: 1
      });
    };
  }
});
export {
  K as _,
  Q as a
};
