@volverjs/ui-vue 0.0.1-beta.11 → 0.0.1-beta.12

package/dist/components/VvSelect/VvSelect.es.js

@@ -1,7 +1,8 @@
-import { toRefs as K, computed as S, h as W, unref as v, defineComponent as q, openBlock as j, createElementBlock as C, normalizeClass as F, createElementVNode as B, toDisplayString as N, createCommentVNode as x, Fragment as R, renderList as X, createTextVNode as T, useSlots as Y, ref as E, watch as ee, withKeys as P, withDirectives as te, vModelText as re, createVNode as $, mergeProps as ne } from "vue";
-import { toReactive as se, useFocus as le, refDebounced as oe, onClickOutside as ae } from "@vueuse/core";
-import { v4 as H } from "uuid";
-const m = {
+import { toRefs as q, computed as w, h as ce, unref as d, defineComponent as T, openBlock as S, createElementBlock as A, normalizeClass as z, createElementVNode as B, toDisplayString as E, createCommentVNode as _, Fragment as U, renderList as Y, createTextVNode as ee, ref as F, inject as de, createBlock as I, mergeProps as L, useSlots as te, renderSlot as G, createVNode as M, watch as fe, withKeys as Q, withDirectives as pe, vModelText as ye } from "vue";
+import { toReactive as me, useFocus as ve, refDebounced as ge, onClickOutside as he } from "@vueuse/core";
+import { v4 as Z } from "uuid";
+import { iconExists as H, Icon as be, addIcon as Se } from "@iconify/vue";
+const V = {
   equals(t, r, e) {
     return e ? this.resolveFieldData(t, e) === this.resolveFieldData(r, e) : this.deepEquals(t, r);
   },
@@ -10,35 +11,35 @@ const m = {
       return !0;
     if (t && r && typeof t == "object" && typeof r == "object") {
       const e = Array.isArray(t), u = Array.isArray(r);
-      let n, s, i;
+      let s, o, c;
       if (e && u) {
-        if (s = t.length, s != r.length)
+        if (o = t.length, o != r.length)
           return !1;
-        for (n = s; n-- !== 0; )
-          if (!this.deepEquals(t[n], r[n]))
+        for (s = o; s-- !== 0; )
+          if (!this.deepEquals(t[s], r[s]))
             return !1;
         return !0;
       }
       if (e != u)
         return !1;
-      const p = t instanceof Date, o = r instanceof Date;
-      if (p != o)
+      const m = t instanceof Date, a = r instanceof Date;
+      if (m != a)
         return !1;
-      if (p && o)
+      if (m && a)
         return t.getTime() == r.getTime();
-      const g = t instanceof RegExp, b = r instanceof RegExp;
-      if (g != b)
+      const h = t instanceof RegExp, i = r instanceof RegExp;
+      if (h != i)
         return !1;
-      if (g && b)
+      if (h && i)
         return t.toString() == r.toString();
-      const l = Object.keys(t);
-      if (s = l.length, s !== Object.keys(r).length)
+      const n = Object.keys(t);
+      if (o = n.length, o !== Object.keys(r).length)
         return !1;
-      for (n = s; n-- !== 0; )
-        if (!Object.prototype.hasOwnProperty.call(r, l[n]))
+      for (s = o; s-- !== 0; )
+        if (!Object.prototype.hasOwnProperty.call(r, n[s]))
           return !1;
-      for (n = s; n-- !== 0; )
-        if (i = l[n], !this.deepEquals(t[i], r[i]))
+      for (s = o; s-- !== 0; )
+        if (c = n[s], !this.deepEquals(t[c], r[c]))
           return !1;
       return !0;
     }
@@ -51,10 +52,10 @@ const m = {
       {
         const e = r.split(".");
         let u = t;
-        for (let n = 0, s = e.length; n < s; ++n) {
+        for (let s = 0, o = e.length; s < o; ++s) {
           if (t == null)
             return null;
-          u = u[e[n]];
+          u = u[e[s]];
         }
         return u;
       }
@@ -96,21 +97,21 @@ const m = {
   },
   removeFromList(t, r) {
     const e = this.findIndexInList(t, r);
-    return e > -1 ? r.filter((u, n) => n !== e) : r;
+    return e > -1 ? r.filter((u, s) => s !== e) : r;
   },
   isString(t) {
     return typeof t == "string" || t instanceof String;
   },
   propsToObject(t) {
     return Object.keys(t).reduce((r, e) => {
-      var u, n, s, i, p;
-      return this.isFunction(t[e]) ? r[e] = t[e]() : Array.isArray(t[e]) ? r[e] = t[e][0]() : (u = t[e]) != null && u.type && (Array.isArray(t[e].type) ? r[e] = ((n = t[e]) == null ? void 0 : n.default) || ((s = t[e]) == null ? void 0 : s.type[0]()) : r[e] = ((i = t[e]) == null ? void 0 : i.default) || ((p = t[e]) == null ? void 0 : p.type())), r;
+      var u, s, o, c, m;
+      return this.isFunction(t[e]) ? r[e] = t[e]() : Array.isArray(t[e]) ? r[e] = t[e][0]() : (u = t[e]) != null && u.type && (Array.isArray(t[e].type) ? r[e] = ((s = t[e]) == null ? void 0 : s.default) || ((o = t[e]) == null ? void 0 : o.type[0]()) : r[e] = ((c = t[e]) == null ? void 0 : c.default) || ((m = t[e]) == null ? void 0 : m.type())), r;
     }, {});
   },
   filterArray(t, r, e) {
-    return t.filter((u) => r.some((n) => typeof n == "string" ? u[e] == n : this.equals(
+    return t.filter((u) => r.some((s) => typeof s == "string" ? u[e] == s : this.equals(
       u[e],
-      n[e]
+      s[e]
     )));
   },
   kebabCase(t) {
@@ -120,31 +121,31 @@ const m = {
         /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
       )) == null ? void 0 : r.join("-")) == null ? void 0 : e.toLowerCase();
   }
-}, ue = {
+}, re = {
   valid: Boolean,
   validLabel: [String, Array]
-}, ie = {
+}, ne = {
   error: Boolean,
   errorLabel: [String, Array]
-}, ce = {
+}, se = {
   loading: Boolean,
   loadingLabel: String
-}, I = {
+}, J = {
   disabled: Boolean
-}, de = {
+}, le = {
   readonly: Boolean
-}, M = {
+}, X = {
   modifiers: [String, Array]
-}, fe = {
+}, oe = {
   hintLabel: { type: String, default: "" }
-}, pe = {
-  ...ue,
-  ...ie,
-  ...fe,
-  ...ce,
-  ...I,
-  ...de,
-  ...M,
+}, Ve = {
+  ...re,
+  ...ne,
+  ...oe,
+  ...se,
+  ...J,
+  ...le,
+  ...X,
   modelValue: [String, Array, Object],
   label: String,
   labelNoResult: { type: String, default: "No results" },
@@ -166,13 +167,14 @@ const m = {
   labelKey: { type: String, default: "label" },
   valueKey: { type: String, default: "value" },
   iconLeft: String,
-  iconRight: String
+  iconRight: String,
+  native: Boolean
 };
-function D(t) {
-  return Array.isArray(t) ? t.filter((r) => m.isString(r)).reduce((r, e) => r.length > 0 ? r + `
+function R(t) {
+  return Array.isArray(t) ? t.filter((r) => V.isString(r)).reduce((r, e) => r.length > 0 ? r + `
 ` + e : e, "") : t;
 }
-function ye(t, r) {
+function ae(t, r) {
   return {
     name: "HintSlot",
     props: {
@@ -182,43 +184,43 @@ function ye(t, r) {
       }
     },
     setup(e) {
-      const u = K(t), {
-        error: n,
-        valid: s,
-        hint: i,
-        loading: p
+      const u = q(t), {
+        error: s,
+        valid: o,
+        hint: c,
+        loading: m
       } = r, {
-        hintLabel: o,
-        modelValue: g,
-        valid: b,
-        validLabel: l,
-        error: h,
-        errorLabel: a
-      } = u, d = m.resolveFieldData(u, "loading"), y = m.resolveFieldData(
+        hintLabel: a,
+        modelValue: h,
+        valid: i,
+        validLabel: n,
+        error: v,
+        errorLabel: l
+      } = u, y = V.resolveFieldData(u, "loading"), b = V.resolveFieldData(
         u,
         "loadingLabel"
-      ), V = S(() => h.value ? !!(h.value && n || (a == null ? void 0 : a.value) && Array.isArray(a.value) && a.value.length > 0 || (a == null ? void 0 : a.value) && m.isNotEmpty(a.value)) : !1), k = S(() => !!(o && o.value || i || s || l && l.value || V.value || (d == null ? void 0 : d.value) && p || (d == null ? void 0 : d.value) && (y == null ? void 0 : y.value))), _ = S(() => {
-        const O = se({
-          hintLabel: o,
-          modelValue: g,
-          valid: b,
-          validLabel: l,
-          error: h,
-          errorLabel: a,
-          loading: d,
-          loadingLabel: y,
+      ), O = w(() => v.value ? !!(v.value && s || (l == null ? void 0 : l.value) && Array.isArray(l.value) && l.value.length > 0 || (l == null ? void 0 : l.value) && V.isNotEmpty(l.value)) : !1), $ = w(() => !!(a && a.value || c || o || n && n.value || O.value || (y == null ? void 0 : y.value) && m || (y == null ? void 0 : y.value) && (b == null ? void 0 : b.value))), f = w(() => {
+        const C = me({
+          hintLabel: a,
+          modelValue: h,
+          valid: i,
+          validLabel: n,
+          error: v,
+          errorLabel: l,
+          loading: y,
+          loadingLabel: b,
           ...e.params
         });
-        return h != null && h.value ? (n == null ? void 0 : n(O)) || D(a == null ? void 0 : a.value) || (o == null ? void 0 : o.value) : b != null && b.value ? (s == null ? void 0 : s(O)) || D(l == null ? void 0 : l.value) || (o == null ? void 0 : o.value) : d != null && d.value ? (p == null ? void 0 : p(O)) || D(y == null ? void 0 : y.value) || (o == null ? void 0 : o.value) : (i == null ? void 0 : i(O)) || D(o == null ? void 0 : o.value) || (o == null ? void 0 : o.value);
+        return v != null && v.value ? (s == null ? void 0 : s(C)) || R(l == null ? void 0 : l.value) || (a == null ? void 0 : a.value) : i != null && i.value ? (o == null ? void 0 : o(C)) || R(n == null ? void 0 : n.value) || (a == null ? void 0 : a.value) : y != null && y.value ? (m == null ? void 0 : m(C)) || R(b == null ? void 0 : b.value) || (a == null ? void 0 : a.value) : (c == null ? void 0 : c(C)) || R(a == null ? void 0 : a.value) || (a == null ? void 0 : a.value);
       });
       return {
-        hasHint: k,
-        hintContent: _
+        hasHint: $,
+        hintContent: f
       };
     },
     render() {
       if (this.hasHint)
-        return W(
+        return ce(
           "pre",
           { style: { "white-space": "pre" } },
           this.hintContent
@@ -226,22 +228,22 @@ function ye(t, r) {
     }
   };
 }
-function Z(t, r) {
+function x(t, r) {
   const e = { [`${t}`]: !0 };
   return {
-    bemCssClasses: S(() => Object.keys(r).reduce((n, s) => {
-      const i = v(r[s]) || !1;
-      if (!i)
-        return n;
-      if (s === "modifiers") {
-        const p = Array.isArray(i) ? i : [i];
+    bemCssClasses: w(() => Object.keys(r).reduce((s, o) => {
+      const c = d(r[o]) || !1;
+      if (!c)
+        return s;
+      if (o === "modifiers") {
+        const m = Array.isArray(c) ? c : [c];
         return {
-          ...n,
-          ...p.reduce(
-            (o, g) => ({
-              ...o,
-              [`${t}--${m.kebabCase(
-                g
+          ...s,
+          ...m.reduce(
+            (a, h) => ({
+              ...a,
+              [`${t}--${V.kebabCase(
+                h
               )}`]: !0
             }),
             {}
@@ -249,15 +251,15 @@ function Z(t, r) {
         };
       } else
         return {
-          ...n,
-          [`${t}--${m.kebabCase(s)}`]: i
+          ...s,
+          [`${t}--${V.kebabCase(o)}`]: c
         };
     }, e) || {})
   };
 }
-const me = {
-  ...I,
-  ...M,
+const Ae = {
+  ...J,
+  ...X,
   modelValue: [String, Array, Object],
   labelNoResult: { type: String, default: "No results" },
   options: {
@@ -269,179 +271,365 @@ const me = {
   maxValues: [Number, String],
   labelKey: { type: String, default: "label" },
   valueKey: { type: String, default: "value" }
-}, ge = { key: 0 }, he = ["for"], ve = ["id", "type", "value", "checked", "disabled"], be = /* @__PURE__ */ q({
+}, we = { key: 0 }, Oe = ["for"], je = ["id", "type", "value", "checked", "disabled"], Ce = /* @__PURE__ */ T({
   __name: "VvDropdown",
-  props: me,
+  props: Ae,
   emits: ["update:modelValue"],
   setup(t, { emit: r }) {
-    const e = t, u = H(), { modifiers: n, disabled: s } = K(e), { bemCssClasses: i } = Z("vv-dropdown", {
-      modifiers: n,
-      disabled: s
+    const e = t, u = Z(), { modifiers: s, disabled: o } = q(e), { bemCssClasses: c } = x("vv-dropdown", {
+      modifiers: s,
+      disabled: o
     });
-    function p(l) {
-      return Array.isArray(e.modelValue) ? m.contains(l, e.modelValue) || m.contains(o(l), e.modelValue) : m.equals(l, e.modelValue) || m.equals(o(l), e.modelValue);
+    function m(n) {
+      return Array.isArray(e.modelValue) ? V.contains(n, e.modelValue) || V.contains(a(n), e.modelValue) : V.equals(n, e.modelValue) || V.equals(a(n), e.modelValue);
     }
-    function o(l) {
-      return typeof l == "string" ? l : String(l[e.valueKey]);
+    function a(n) {
+      return typeof n == "string" ? n : String(n[e.valueKey]);
     }
-    function g(l) {
-      return typeof l == "string" ? l : l[e.labelKey];
+    function h(n) {
+      return typeof n == "string" ? n : n[e.labelKey];
     }
-    function b(l) {
-      var y, V;
-      const h = l.target;
-      let a = h.value;
-      if (a = (e.useObject ? (y = e.options) == null ? void 0 : y.find(
-        (k) => k[e.valueKey] == a
-      ) : null) || a, e.multiple) {
-        if (typeof e.maxValues < "u" && e.maxValues >= 0 && ((V = e.modelValue) == null ? void 0 : V.length) >= e.maxValues && (Array.isArray(e.modelValue) && !m.contains(a, e.modelValue) || e.maxValues == 0)) {
-          h.checked = !1;
+    function i(n) {
+      var b, O;
+      const v = n.target;
+      let l = v.value;
+      if (l = (e.useObject ? (b = e.options) == null ? void 0 : b.find(
+        ($) => $[e.valueKey] == l
+      ) : null) || l, e.multiple) {
+        if (typeof e.maxValues < "u" && e.maxValues >= 0 && ((O = e.modelValue) == null ? void 0 : O.length) >= e.maxValues && (Array.isArray(e.modelValue) && !V.contains(l, e.modelValue) || e.maxValues == 0)) {
+          v.checked = !1;
           return;
         }
-        Array.isArray(e.modelValue) ? a = m.contains(a, e.modelValue) ? m.removeFromList(a, e.modelValue) : [...e.modelValue, a] : a = [a];
+        Array.isArray(e.modelValue) ? l = V.contains(l, e.modelValue) ? V.removeFromList(l, e.modelValue) : [...e.modelValue, l] : l = [l];
       }
-      r("update:modelValue", a);
+      r("update:modelValue", l);
     }
-    return (l, h) => {
-      var a;
-      return j(), C("ul", {
-        class: F(v(i)),
+    return (n, v) => {
+      var l;
+      return S(), A("ul", {
+        class: z(d(c)),
         role: "listbox"
       }, [
-        (a = l.options) != null && a.length ? x("", !0) : (j(), C("li", ge, [
-          B("label", null, N(l.labelNoResult), 1)
+        (l = n.options) != null && l.length ? _("", !0) : (S(), A("li", we, [
+          B("label", null, E(n.labelNoResult), 1)
         ])),
-        (j(!0), C(R, null, X(l.options, (d, y) => {
-          var V;
-          return j(), C("li", { key: y }, [
+        (S(!0), A(U, null, Y(n.options, (y, b) => {
+          var O;
+          return S(), A("li", { key: b }, [
             B("label", {
-              for: `dropdown-${y}-${v(u)}`
+              for: `dropdown-${b}-${d(u)}`
             }, [
               B("input", {
-                id: `dropdown-${y}-${v(u)}`,
-                type: l.multiple ? "checkbox" : "radio",
-                value: o(d),
-                checked: p(d),
-                disabled: typeof d == "object" ? (V = d.disabled) != null ? V : v(s) : v(s),
-                onInput: b
-              }, null, 40, ve),
-              T(" " + N(g(d)), 1)
-            ], 8, he)
+                id: `dropdown-${b}-${d(u)}`,
+                type: n.multiple ? "checkbox" : "radio",
+                value: a(y),
+                checked: m(y),
+                disabled: typeof y == "object" ? (O = y.disabled) != null ? O : d(o) : d(o),
+                onInput: i
+              }, null, 40, je),
+              ee(" " + E(h(y)), 1)
+            ], 8, Oe)
           ]);
         }), 128))
       ], 2);
     };
   }
-}), Ve = ["id"], Ae = {
+}), ke = {
+  ...re,
+  ...ne,
+  ...oe,
+  ...se,
+  ...J,
+  ...le,
+  ...X,
+  modelValue: {
+    type: [String, Object],
+    required: !0
+  },
+  label: String,
+  placeholder: String,
+  options: {
+    type: Array,
+    required: !0
+  },
+  useObject: Boolean,
+  labelKey: { type: String, default: "label" },
+  valueKey: { type: String, default: "value" },
+  iconLeft: String,
+  iconRight: String,
+  modifiers: [String, Array]
+}, $e = "ds", _e = {
+  color: String,
+  width: {
+    type: [String, Number]
+  },
+  height: {
+    type: [String, Number]
+  },
+  name: {
+    type: String,
+    required: !0
+  },
+  provider: {
+    type: String
+  },
+  prefix: {
+    type: String,
+    default: "normal"
+  },
+  src: String,
+  horizontalFlip: Boolean,
+  verticalFlip: Boolean,
+  flip: String,
+  mode: String,
+  inline: Boolean,
+  rotate: [Number, String],
+  onLoad: Function,
+  svg: String,
+  modifiers: {
+    type: [String, Array]
+  }
+}, W = /* @__PURE__ */ T({
+  __name: "VvIcon",
+  props: _e,
+  setup(t) {
+    const r = t, e = F(!0), { modifiers: u } = q(r), s = de($e), { bemCssClasses: o } = x("vv-icon", {
+      modifiers: u
+    }), c = w(() => r.provider || (s == null ? void 0 : s.provider)), m = w(() => {
+      const i = r.name || "", n = `@${c.value}:${r.prefix}:${r.name}`;
+      return H(i) ? i : H(n) ? n : (s == null ? void 0 : s.iconsCollections.find((v) => {
+        const l = `@${c.value}:${v.prefix}:${i}`;
+        if (H(l))
+          return l;
+      })) || i;
+    });
+    function a(i) {
+      let n = null;
+      if (typeof window > "u") {
+        const { JSDOM: b } = require("jsdom");
+        n = new b().window;
+      }
+      return (n ? new n.DOMParser() : new window.DOMParser()).parseFromString(i, "text/html").querySelector("svg");
+    }
+    function h(i) {
+      const n = a(i), v = (n == null ? void 0 : n.innerHTML.trim()) || "";
+      n && v && Se(`@${c.value}:${r.prefix}:${r.name}`, {
+        body: v,
+        height: n.viewBox.baseVal.height,
+        width: n.viewBox.baseVal.width
+      });
+    }
+    return s && (r.src ? (e.value = !1, s.fetchIcon(r.src).then((i) => {
+      i && (h(i), e.value = !0);
+    }).catch((i) => {
+      throw new Error(`During fetch icon: ${i == null ? void 0 : i.message}`);
+    })) : r.svg && h(r.svg)), (i, n) => e.value ? (S(), I(d(be), L({
+      key: 0,
+      class: d(o)
+    }, {
+      ...i.$props,
+      provider: d(c),
+      icon: d(m)
+    }), null, 16, ["class"])) : _("", !0);
+  }
+}), Be = ["for"], Ee = { class: "vv-select__wrapper" }, Ne = ["id", "value", "disabled"], De = {
+  key: 0,
+  value: "",
+  disabled: "",
+  selected: ""
+}, Pe = ["disabled", "value"], Ke = /* @__PURE__ */ T({
+  __name: "VvNativeSelect",
+  props: ke,
+  emits: ["update:modelValue"],
+  setup(t, { emit: r }) {
+    const e = t, u = te(), s = ae(e, u), {
+      modifiers: o,
+      disabled: c,
+      readonly: m,
+      loading: a,
+      iconLeft: h,
+      iconRight: i,
+      error: n,
+      valid: v
+    } = q(e), l = Z(), { bemCssClasses: y } = x("vv-select", {
+      modifiers: o,
+      loading: a,
+      readonly: m,
+      iconLeft: h,
+      iconRight: i,
+      valid: v,
+      invalid: n,
+      dirty: w(() => V.isNotEmpty(e.modelValue))
+    });
+    function b(f) {
+      return typeof f == "string" ? f : f[e.valueKey];
+    }
+    function O(f) {
+      return typeof f == "string" ? f : f[e.labelKey];
+    }
+    function $(f) {
+      var N;
+      const C = f.target, k = (e.useObject ? (N = e.options) == null ? void 0 : N.find(
+        (D) => D[e.valueKey] == C.value
+      ) : null) || C.value;
+      r("update:modelValue", k);
+    }
+    return (f, C) => {
+      var P;
+      return S(), A("div", {
+        class: z(d(y))
+      }, [
+        f.label ? (S(), A("label", {
+          key: 0,
+          for: d(l)
+        }, E(f.label), 9, Be)) : _("", !0),
+        B("div", Ee, [
+          G(f.$slots, "icon-left", {}, () => [
+            d(h) ? (S(), I(W, {
+              key: 0,
+              name: d(h)
+            }, null, 8, ["name"])) : _("", !0)
+          ]),
+          B("select", {
+            id: d(l),
+            value: typeof f.modelValue == "string" ? f.modelValue : (P = f.modelValue) == null ? void 0 : P[f.valueKey],
+            disabled: d(c) || d(m),
+            onInput: $
+          }, [
+            f.placeholder ? (S(), A("option", De, E(f.placeholder), 1)) : _("", !0),
+            (S(!0), A(U, null, Y(f.options, (k, N) => {
+              var D;
+              return S(), A("option", {
+                key: N,
+                disabled: typeof k == "object" ? (D = k.disabled) != null ? D : d(c) : d(c),
+                value: b(k)
+              }, E(O(k)), 9, Pe);
+            }), 128))
+          ], 40, Ne),
+          G(f.$slots, "icon-right", {}, () => [
+            d(i) ? (S(), I(W, {
+              key: 0,
+              name: d(i)
+            }, null, 8, ["name"])) : _("", !0)
+          ])
+        ]),
+        M(d(s), { class: "vv-select__hint" })
+      ], 2);
+    };
+  }
+}), Fe = ["id"], qe = {
   key: 0,
   for: "select"
-}, Se = ["placeholder"], ke = /* @__PURE__ */ q({
+}, Re = ["placeholder"], Le = /* @__PURE__ */ T({
   __name: "VvSelect",
-  props: pe,
+  props: Ve,
   emits: ["update:modelValue", "change:search"],
   setup(t, { emit: r }) {
-    const e = t, u = Y(), n = ye(e, u), s = E(), i = E();
-    le(i, { initialValue: !0 });
-    const p = H(), o = E(""), g = oe(
-      o,
+    const e = t, u = te(), s = ae(e, u), o = F(), c = F();
+    ve(c, { initialValue: !0 });
+    const m = Z(), a = F(""), h = ge(
+      a,
       Number(e.debounceSearch)
-    ), b = E(!1), {
-      modifiers: l,
-      disabled: h,
-      readonly: a,
-      loading: d,
-      iconLeft: y,
-      iconRight: V,
-      valid: k,
-      error: _
-    } = K(e);
-    ee(
-      g,
-      () => r("change:search", g.value)
+    ), i = F(!1), {
+      modifiers: n,
+      disabled: v,
+      readonly: l,
+      loading: y,
+      iconLeft: b,
+      iconRight: O,
+      valid: $,
+      error: f
+    } = q(e);
+    fe(
+      h,
+      () => r("change:search", h.value)
     );
-    const { bemCssClasses: O } = Z("vv-select", {
-      modifiers: l,
-      disabled: h,
-      loading: d,
-      readonly: a,
-      iconLeft: y,
-      iconRight: V,
-      valid: k,
-      invalid: _,
-      dirty: S(() => m.isNotEmpty(e.modelValue))
-    }), z = S(
+    const { bemCssClasses: C } = x("vv-select", {
+      modifiers: n,
+      disabled: v,
+      loading: y,
+      readonly: l,
+      iconLeft: b,
+      iconRight: O,
+      valid: $,
+      invalid: f,
+      dirty: w(() => V.isNotEmpty(e.modelValue))
+    }), P = w(
       () => {
-        var c;
-        return (c = e.options) == null ? void 0 : c.every((f) => typeof f == "object");
+        var p;
+        return (p = e.options) == null ? void 0 : p.every((g) => typeof g == "object");
       }
-    ), U = S(
-      () => e.searchable ? L.value : e.options
-    ), L = S(() => {
-      var c;
-      return (c = e.options) == null ? void 0 : c.filter((f) => typeof f == "string" ? f.toLowerCase().includes(g.value.toLowerCase().trim()) : f[e.labelKey].toLowerCase().includes(g.value.toLowerCase().trim()));
-    }), G = S(() => {
-      var f, A;
-      if (e.multiple && ((f = e.modelValue) == null ? void 0 : f.length) && Array.isArray(e.modelValue))
-        return z.value ? m.filterArray(
+    ), k = w(
+      () => e.searchable ? N.value : e.options
+    ), N = w(() => {
+      var p;
+      return (p = e.options) == null ? void 0 : p.filter((g) => typeof g == "string" ? g.toLowerCase().includes(h.value.toLowerCase().trim()) : g[e.labelKey].toLowerCase().includes(h.value.toLowerCase().trim()));
+    }), D = w(() => {
+      var g, j;
+      if (e.multiple && ((g = e.modelValue) == null ? void 0 : g.length) && Array.isArray(e.modelValue))
+        return P.value ? V.filterArray(
           e.options,
           e.modelValue,
           e.valueKey
-        ).map((w) => w[e.labelKey]).join(e.separator) : e.modelValue.join(e.separator);
-      const c = e.useObject ? e.modelValue : (A = e.options) == null ? void 0 : A.find(
-        (w) => typeof w == "object" ? w[e.valueKey] == e.modelValue : w == e.modelValue
+        ).map((K) => K[e.labelKey]).join(e.separator) : e.modelValue.join(e.separator);
+      const p = e.useObject ? e.modelValue : (j = e.options) == null ? void 0 : j.find(
+        (K) => typeof K == "object" ? K[e.valueKey] == e.modelValue : K == e.modelValue
       );
-      return typeof c == "object" ? c == null ? void 0 : c[e.labelKey] : c;
+      return typeof p == "object" ? p == null ? void 0 : p[e.labelKey] : p;
     });
-    ae(s, () => {
-      s.value.open = !1;
+    he(o, () => {
+      o.value.open = !1;
     });
-    function J(c) {
-      const f = c.target;
-      b.value = f.open;
+    function ie(p) {
+      const g = p.target;
+      i.value = g.open;
     }
-    function Q(c) {
-      s.value && !e.multiple && (s.value.open = !1), r("update:modelValue", c);
+    function ue(p) {
+      o.value && !e.multiple && (o.value.open = !1), r("update:modelValue", p);
     }
-    return (c, f) => (j(), C("div", {
-      id: v(p),
-      class: F(v(O))
+    return (p, g) => p.native ? (S(), I(Ke, L({ key: 1 }, e, {
+      "onUpdate:modelValue": g[4] || (g[4] = (j) => r("update:modelValue", j))
+    }), null, 16)) : (S(), A("div", {
+      key: 0,
+      id: d(m),
+      class: z(d(C))
     }, [
-      c.label ? (j(), C("label", Ae, N(c.label), 1)) : x("", !0),
+      p.label ? (S(), A("label", qe, E(p.label), 1)) : _("", !0),
       B("details", {
         ref_key: "dropdown",
-        ref: s,
+        ref: o,
         role: "list",
         class: "vv-select__wrapper",
-        onClick: f[2] || (f[2] = (A) => v(h) || v(a) ? A.preventDefault() : null),
-        onKeyup: f[3] || (f[3] = P((A) => s.value.open = !1, ["esc"])),
-        onToggle: J
+        onClick: g[2] || (g[2] = (j) => d(v) || d(l) ? j.preventDefault() : null),
+        onKeyup: g[3] || (g[3] = Q((j) => o.value.open = !1, ["esc"])),
+        onToggle: ie
       }, [
         B("summary", {
           class: "vv-select__input",
           "aria-haspopup": "listbox",
-          onKeyup: f[1] || (f[1] = P((A) => c.searchable ? A.preventDefault() : null, ["space"]))
+          onKeyup: g[1] || (g[1] = Q((j) => p.searchable ? j.preventDefault() : null, ["space"]))
         }, [
-          c.searchable && b.value ? te((j(), C("input", {
+          p.searchable && i.value ? pe((S(), A("input", {
             key: 0,
             ref_key: "inputSearch",
-            ref: i,
-            "onUpdate:modelValue": f[0] || (f[0] = (A) => o.value = A),
-            placeholder: c.searchPlaceholder
-          }, null, 8, Se)), [
-            [re, o.value]
-          ]) : (j(), C(R, { key: 1 }, [
-            T(N(v(G) || c.placeholder), 1)
+            ref: c,
+            "onUpdate:modelValue": g[0] || (g[0] = (j) => a.value = j),
+            placeholder: p.searchPlaceholder
+          }, null, 8, Re)), [
+            [ye, a.value]
+          ]) : (S(), A(U, { key: 1 }, [
+            ee(E(d(D) || p.placeholder), 1)
           ], 64))
         ], 32),
-        $(be, ne({
+        M(Ce, L({
           ...e,
-          options: v(U)
-        }, { "onUpdate:modelValue": Q }), null, 16)
+          options: d(k)
+        }, { "onUpdate:modelValue": ue }), null, 16)
       ], 544),
-      $(v(n), { class: "vv-select__hint" })
-    ], 10, Ve));
+      M(d(s), { class: "vv-select__hint" })
+    ], 10, Fe));
   }
 });
 export {
-  ke as default
+  Le as default
 };