import { defineComponent as x, openBlock as u, createElementBlock as v, createVNode as l, unref as k, createElementVNode as I, toDisplayString as $, ref as m, onMounted as z, computed as B, resolveComponent as C, resolveDirective as D, Fragment as b, withCtx as _, createTextVNode as V, withDirectives as M, renderList as N, createBlock as U, normalizeClass as q } from "vue";
import { l as w, _ as y, m as E, a as O } from "./index-a857af7d.mjs";
const R = { class: "name" }, j = /* @__PURE__ */ x({
  __name: "pickerSingle",
  props: {
    icon: {
      type: String,
      required: !0,
      default: ""
    }
  },
  emits: ["iconChoosed"],
  setup(d, { emit: p }) {
    let i = d;
    const s = p;
    function e() {
      s("iconChoosed", i.icon);
    }
    return (c, n) => (u(), v("div", {
      class: "icon-holder",
      onClick: e
    }, [
      l(w, {
        size: "3em",
        icon: k(i).icon,
        onClick: e
      }, null, 8, ["icon"]),
      I("span", R, $(d.icon), 1)
    ]));
  }
});
const A = /* @__PURE__ */ y(j, [["__scopeId", "data-v-11fae865"]]), F = { class: "icon-list" }, T = /* @__PURE__ */ x({
  __name: "pickerList",
  emits: ["iconChoosed", "closePopover"],
  setup(d, { expose: p, emit: i }) {
    const s = i, e = m([]), c = m(""), n = m(0), f = () => {
      n.value = Math.min(n.value + 60, r.value.length), console.log("load is called" + n.value);
    };
    z(() => {
      let t = [];
      for (const [o] of Object.entries(E))
        t.push(o);
      e.value = t;
    });
    const r = B(() => c.value ? e.value.filter((t) => t.toUpperCase().indexOf(c.value.toUpperCase()) >= 0) : e.value);
    function g() {
      f();
    }
    return p({ show: g }), (t, o) => {
      const h = C("el-button"), L = C("el-button-group"), P = C("el-input"), S = D("infinite-scroll");
      return u(), v(b, null, [
        l(P, {
          modelValue: c.value,
          "onUpdate:modelValue": o[2] || (o[2] = (a) => c.value = a),
          clearable: "",
          placeholder: "You should input something to filter icons ."
        }, {
          append: _(() => [
            l(L, null, {
              default: _(() => [
                l(h, {
                  onClick: o[0] || (o[0] = (a) => s("iconChoosed", void 0))
                }, {
                  default: _(() => [
                    V("Clear")
                  ]),
                  _: 1
                }),
                l(h, {
                  onClick: o[1] || (o[1] = (a) => s("closePopover"))
                }, {
                  default: _(() => [
                    V("Cose")
                  ]),
                  _: 1
                })
              ]),
              _: 1
            })
          ]),
          _: 1
        }, 8, ["modelValue"]),
        M((u(), v("ul", F, [
          (u(!0), v(b, null, N(Math.min(n.value, r.value.length), (a) => (u(), v("li", {
            key: a,
            class: "icon-item"
          }, [
            l(A, {
              icon: r.value[a - 1],
              onIconChoosed: (H) => s("iconChoosed", k(O)(r.value[a - 1]))
            }, null, 8, ["icon", "onIconChoosed"])
          ]))), 128))
        ])), [
          [S, f]
        ])
      ], 64);
    };
  }
});
const Y = /* @__PURE__ */ y(T, [["__scopeId", "data-v-699b595c"]]), G = /* @__PURE__ */ x({
  __name: "index",
  props: {
    modelValue: {
      type: String,
      required: !1,
      default: ""
    }
  },
  emits: ["update:modelValue"],
  setup(d, { emit: p }) {
    let i = d;
    const s = p, e = m(!1);
    function c() {
      e.value = !0;
    }
    const n = m(null);
    function f() {
      n.value.show();
    }
    function r(t) {
      s("update:modelValue", t), e.value = !1;
    }
    const g = () => {
      e.value = !1;
    };
    return (t, o) => {
      const h = C("el-popover");
      return u(), U(h, {
        visible: e.value,
        placement: "bottom",
        width: "100%",
        teleported: !0,
        onShow: f
      }, {
        reference: _(() => [
          I("div", {
            class: q(["icon", { icon_empty: !k(i).modelValue }]),
            onClick: c
          }, [
            l(w, {
              size: "large",
              icon: k(i).modelValue
            }, null, 8, ["icon"])
          ], 2)
        ]),
        default: _(() => [
          l(Y, {
            ref_key: "pickerListRef",
            ref: n,
            onIconChoosed: r,
            onClosePopover: g
          }, null, 512)
        ]),
        _: 1
      }, 8, ["visible"]);
    };
  }
});
const Q = /* @__PURE__ */ y(G, [["__scopeId", "data-v-f675c29a"]]);
export {
  Q as default
};
