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