@topvisor/ui 1.0.26-2 → 1.0.26-4

package/formsExt/formsExt.js

@@ -1,11 +1,11 @@
-import { Core as te } from "../core/app.js";
-import { defineComponent as E, ref as b, computed as z, createElementBlock as h, openBlock as p, normalizeClass as $, createCommentVNode as A, createElementVNode as M, toDisplayString as w, createVNode as R, withKeys as B, withModifiers as S, createBlock as T, createSlots as X, withCtx as k, createTextVNode as L, watch as I, toRef as le, mergeProps as Y, mergeModels as G, useModel as Q, Fragment as N, renderList as D, withDirectives as Z, vModelRadio as ae, resolveDirective as se, unref as O, renderSlot as H } from "vue";
-import { w as ne, _ as F, f as re, d as ie, u as ue, C as de } from "../.chunks/forms-BEMrEl5V.es.js";
+import { Core as oe } from "../core/app.js";
+import { defineComponent as E, ref as b, computed as z, createElementBlock as h, openBlock as p, normalizeClass as C, createCommentVNode as A, createElementVNode as M, toDisplayString as $, createVNode as U, withKeys as B, withModifiers as T, createBlock as S, createSlots as G, withCtx as k, createTextVNode as L, watch as I, toRef as le, mergeProps as Y, mergeModels as D, useModel as Q, Fragment as N, renderList as H, withDirectives as Z, vModelRadio as ae, resolveDirective as se, unref as O, renderSlot as F } from "vue";
+import { w as ne, _ as R, f as re, d as ie, u as ue, C as de } from "../.chunks/forms-BEMrEl5V.es.js";
 import { invertKeyboardLayout as pe } from "../utils/keyboard.js";
 import { TopPopup as ce, TopPopupListItem as j, TopPopupWidgetInput as me } from "../popup/popup.js";
 import { _ as fe } from "../.chunks/menu.vue_vue_type_style_index_0_lang-DzNVeeZl.es.js";
-const oe = ["../assets/formsExt.css"].map((n) => import.meta.resolve(n));
-te.insertCSSLinkToPage(oe, !0);
+const te = ["../assets/formsExt.css"].map((n) => import.meta.resolve(n));
+oe.insertCSSLinkToPage(te, !0);
 const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
   __name: "editArea",
   props: {
@@ -31,19 +31,19 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
   },
   emits: ["submit", "close", "clickOnTitle"],
   setup(n, { emit: s }) {
-    const e = n, o = s, m = b(e.defaultValue), g = b(e.isFocused), u = z(() => m.value !== e.defaultValue), f = (l) => {
-      o("submit", l), m.value = e.defaultValue;
+    const e = n, t = s, m = b(e.defaultValue), g = b(e.isFocused), u = z(() => m.value !== e.defaultValue), f = (l) => {
+      t("submit", l), m.value = e.defaultValue;
     }, d = () => {
       if (e.forceShowCloseBtn && !u.value) {
-        o("close");
+        t("close");
         return;
       }
       m.value = e.defaultValue;
     }, v = () => {
-      e.attachToKeyboard && o("clickOnTitle");
+      e.attachToKeyboard && t("clickOnTitle");
     };
     return (l, y) => (p(), h("div", {
-      class: $({
+      class: C({
         "top-editArea": !0,
         "top-editArea-attachedToKeyboard": l.attachToKeyboard
       })
@@ -52,15 +52,15 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
         key: 0,
         class: "top-editArea_title",
         onClick: y[0] || (y[0] = (r) => v())
-      }, w(l.title), 1)) : A("", !0),
+      }, $(l.title), 1)) : A("", !0),
       M("div", {
-        class: $({
+        class: C({
           "top-editArea_form": !0,
           "top-error": l.isError,
           "top-focus": g.value
         })
       }, [
-        R(ne, {
+        U(ne, {
           modelValue: m.value,
           "onUpdate:modelValue": y[1] || (y[1] = (r) => m.value = r),
           name: l.name,
@@ -77,36 +77,36 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
           onBlur: y[3] || (y[3] = () => g.value = !1),
           onKeyup: [
             B(d, ["esc"]),
-            y[4] || (y[4] = B(S((r) => f(m.value), ["ctrl"]), ["enter"]))
+            y[4] || (y[4] = B(T((r) => f(m.value), ["ctrl"]), ["enter"]))
           ]
         }, null, 8, ["modelValue", "name", "placeholder", "rows", "minHeight", "expandable", "disabled", "readonly", "isError", "hint"]),
         M("div", ve, [
-          u.value || l.forceShowCloseBtn ? (p(), T(F, {
+          u.value || l.forceShowCloseBtn ? (p(), S(R, {
             key: 0,
             icon: l.$core.state.isMobile ? "" : "",
             class: "top-editArea_button",
             color: "theme",
             styling: "soft",
             onClick: d
-          }, X({ _: 2 }, [
+          }, G({ _: 2 }, [
             l.$core.state.isMobile ? void 0 : {
               name: "default",
               fn: k(() => [
-                L(w(l.cancelText), 1)
+                L($(l.cancelText), 1)
               ]),
               key: "0"
             }
           ]), 1032, ["icon"])) : A("", !0),
-          u.value ? (p(), T(F, {
+          u.value ? (p(), S(R, {
             key: 1,
             class: "top-editArea_button",
             icon: l.$core.state.isMobile ? "" : "",
             onClick: y[5] || (y[5] = (r) => f(m.value))
-          }, X({ _: 2 }, [
+          }, G({ _: 2 }, [
             l.$core.state.isMobile ? void 0 : {
               name: "default",
               fn: k(() => [
-                L(w(l.submitText), 1)
+                L($(l.submitText), 1)
               ]),
               key: "0"
             }
@@ -124,21 +124,21 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
   },
   emits: ["update:modelValue"],
   setup(n, { emit: s }) {
-    const e = n, o = b(e.modelValue);
+    const e = n, t = b(e.modelValue);
     I(le(e.modelValue), () => {
-      o.value = e.modelValue;
+      t.value = e.modelValue;
     });
     const m = s, g = () => {
-      m("update:modelValue", o.value);
+      m("update:modelValue", t.value);
     };
     return (u, f) => (p(), h("div", he, [
-      R(re, Y(u.input, {
-        onKeydownCapture: f[0] || (f[0] = B(S((d) => o.value = u.modelValue, ["stop"]), ["esc"])),
-        onKeydown: B(S(g, ["stop"]), ["enter"]),
-        modelValue: o.value,
-        "onUpdate:modelValue": f[1] || (f[1] = (d) => o.value = d)
+      U(re, Y(u.input, {
+        onKeydownCapture: f[0] || (f[0] = B(T((d) => t.value = u.modelValue, ["stop"]), ["esc"])),
+        onKeydown: B(T(g, ["stop"]), ["enter"]),
+        modelValue: t.value,
+        "onUpdate:modelValue": f[1] || (f[1] = (d) => t.value = d)
       }), null, 16, ["onKeydown", "modelValue"]),
-      o.value !== u.modelValue ? (p(), T(F, Y({
+      t.value !== u.modelValue ? (p(), S(R, Y({
         key: 0,
         icon: "",
         styling: "soft"
@@ -148,9 +148,9 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
 }), be = ["data-top-icon", "onClick"], Ve = {
   key: 0,
   class: "top-radioGroup_circle"
-}, Ae = ["value", "disabled"], Ce = /* @__PURE__ */ E({
+}, Ae = ["value", "disabled"], we = /* @__PURE__ */ E({
   __name: "radioGroup",
-  props: /* @__PURE__ */ G({
+  props: /* @__PURE__ */ D({
     modelValue: {},
     radiosProps: {},
     showIndicator: { type: Boolean },
@@ -162,26 +162,26 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
     },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ G(["update:modelValue"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ D(["update:modelValue"], ["update:modelValue"]),
   setup(n, { emit: s }) {
-    const e = Q(n, "modelValue"), o = n, m = b(null);
+    const e = Q(n, "modelValue"), t = n, m = b(null);
     I(e, () => {
       var u, f, d, v, l;
-      (u = o.radiosProps) != null && u.some((y) => y.value === e.value) || (e.value = ((d = (f = o.radiosProps) == null ? void 0 : f[0]) == null ? void 0 : d.value) ?? ""), (l = (v = m.value) == null ? void 0 : v.querySelector(".radioGroup_item-selected")) == null || l.scrollIntoView();
+      (u = t.radiosProps) != null && u.some((y) => y.value === e.value) || (e.value = ((d = (f = t.radiosProps) == null ? void 0 : f[0]) == null ? void 0 : d.value) ?? ""), (l = (v = m.value) == null ? void 0 : v.querySelector(".radioGroup_item-selected")) == null || l.scrollIntoView();
     }, { immediate: !0 });
     const g = "radioGroup-" + Math.random();
     return (u, f) => (p(), h("div", {
       ref_key: "elRef",
       ref: m,
-      class: $({
+      class: C({
         "top-radioGroup": !0,
         "top-scrollBarXHidding": !0,
         ["top-size_" + u.size]: !!u.size,
         "top-error": u.isError
       })
     }, [
-      (p(!0), h(N, null, D(u.radiosProps, (d) => (p(), h("label", {
-        class: $({
+      (p(!0), h(N, null, H(u.radiosProps, (d) => (p(), h("label", {
+        class: C({
           "top-radioGroup_item-selected": d.value === e.value,
           "top-radioGroup_item": !0,
           "top-forms-focusable": !0,
@@ -190,13 +190,13 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
         "data-top-icon": d.icon,
         onClick: (v) => e.value = d.value
       }, [
-        L(w(d.title) + " ", 1),
+        L($(d.title) + " ", 1),
         u.showIndicator ? (p(), h("span", Ve)) : A("", !0),
         Z(M("input", {
           "onUpdate:modelValue": f[0] || (f[0] = (v) => e.value = v),
           name: g,
           type: "radio",
-          class: $({
+          class: C({
             "top-unvisible": !0
           }),
           value: d.value,
@@ -207,8 +207,8 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
       ], 10, be))), 256))
     ], 2));
   }
-}), $e = (n, s, e) => {
-  const o = b([]), m = b(!1);
+}), Ce = (n, s, e) => {
+  const t = b([]), m = b(!1);
   let g = "", u;
   n && !n.params.limit && (n.params.limit = 100);
   const f = async () => {
@@ -231,22 +231,22 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
     if (!n) return;
     n.params.offset = 0, n.params.search = g;
     const r = await f();
-    r && (u = r.nextOffset, o.value = r.result);
+    r && (u = r.nextOffset, t.value = r.result);
   }, v = async () => {
     if (!n || !u || m.value) return;
     n.params.offset = u, n.params.search = g;
     const r = await f();
-    r && (u = r.nextOffset, o.value = o.value.concat(r.result));
+    r && (u = r.nextOffset, t.value = t.value.concat(r.result));
   }, l = ie(() => d(), 200);
   return {
-    items: o,
+    items: t,
     isLoading: m,
     loadAppend: v,
     setSearchTextAndLoad: (r, V = !0) => {
-      n && (r.length < s || r === g && o.value.length || (g = r, V ? l() : d()));
+      n && (r.length < s || r === g && t.value.length || (g = r, V ? l() : d()));
     }
   };
-}, we = { class: "top-selector2_itemMulti top-ellipsis" }, ke = /* @__PURE__ */ E({
+}, $e = { class: "top-selector2_itemMulti top-ellipsis" }, ke = /* @__PURE__ */ E({
   __name: "itemMulti",
   props: {
     id: {},
@@ -254,26 +254,26 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
   },
   emits: ["delete"],
   setup(n) {
-    return (s, e) => (p(), h("div", we, [
-      L(w(s.name) + " ", 1),
+    return (s, e) => (p(), h("div", $e, [
+      L($(s.name) + " ", 1),
       M("span", {
         class: "top-selector2_itemMultiDelete",
         "data-top-icon": "",
-        onClick: e[0] || (e[0] = (o) => s.$emit("delete", s.id)),
-        onMousedown: e[1] || (e[1] = S(() => {
+        onClick: e[0] || (e[0] = (t) => s.$emit("delete", s.id)),
+        onMousedown: e[1] || (e[1] = T(() => {
         }, ["stop"]))
       }, null, 32)
     ]));
   }
-}), Te = {
+}), Se = {
   key: 0,
   class: "top-selector2_activeItems"
-}, Se = {
+}, Te = {
   key: 1,
   class: "top-selector2_activeName top-ellipsis"
 }, Ie = /* @__PURE__ */ E({
   __name: "selector2",
-  props: /* @__PURE__ */ G({
+  props: /* @__PURE__ */ D({
     modelValue: {},
     items: { default: () => [] },
     multiselect: { type: Boolean },
@@ -287,21 +287,22 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
     appendAllValue: { type: Boolean },
     addChanger: { type: Boolean },
     placeholder: {},
-    showSelectedInInput: { type: Boolean, default: !0 }
+    showSelectedInInput: { type: Boolean, default: !0 },
+    showSearch: { type: Boolean, default: !0 }
   }, {
     modelValue: {},
     modelModifiers: {}
   }),
   emits: ["update:modelValue"],
   setup(n) {
-    const s = n, e = Q(n, "modelValue"), o = b(""), m = () => {
-      o.value = "", v.items.value = [];
+    const s = n, e = Q(n, "modelValue"), t = b(""), m = () => {
+      t.value = "", v.items.value = [];
     }, g = {
       id: 0,
       name: ue().Common.All
     }, u = b(null), f = b(null), d = () => {
-      var t;
-      return (t = u.value) == null ? void 0 : t.popup;
+      var o;
+      return (o = u.value) == null ? void 0 : o.popup;
     };
     window.__STORYBOOK_PREVIEW__ && !s.modelValue && I(
       () => s.multiselect,
@@ -310,148 +311,153 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
       },
       { immediate: !0 }
     );
-    const v = $e(s.apiRequest, s.minLength, s.useCache), l = z(() => {
-      const t = [];
-      return !s.multiselect && s.appendAllValue && t.push(g), s.items.forEach((a) => t.push({ ...a })), t;
-    }), y = (t, a = !0) => a && t.id === null ? Array.isArray(e.value) ? e.value.some((c) => c.id === t.id && c.name === t.name) : t.name === e.value.name : Array.isArray(e.value) ? e.value.some((c) => c.id === t.id) : t.id === e.value.id, r = z(() => {
-      const t = o.value.toLowerCase(), a = pe(t);
+    const v = Ce(s.apiRequest, s.minLength, s.useCache), l = z(() => {
+      const o = [];
+      return !s.multiselect && s.appendAllValue && o.push(g), s.items.forEach((a) => o.push({ ...a })), o;
+    }), y = (o, a = !0) => a && o.id === null ? Array.isArray(e.value) ? e.value.some((c) => c.id === o.id && c.name === o.name) : o.name === e.value.name : Array.isArray(e.value) ? e.value.some((c) => c.id === o.id) : o.id === e.value.id, r = z(() => {
+      const o = t.value.toLowerCase(), a = pe(o);
       let c = [];
       return l.value.forEach((i) => {
-        const C = i.name.toLowerCase();
-        (i.id === Number(t) || C.includes(t) || C.includes(a)) && (C === t || C === a ? c.unshift(i) : c.push(i));
-      }), c.push(...v.items.value), s.appendSearchToResult && o.value && (!c.length || c[0].name.toLowerCase() !== t) && c.push({
+        const w = i.name.toLowerCase();
+        (i.id === Number(o) || w.includes(o) || w.includes(a)) && (w === o || w === a ? c.unshift(i) : c.push(i));
+      }), c.push(...v.items.value), s.appendSearchToResult && t.value && (!c.length || c[0].name.toLowerCase() !== o) && c.push({
         id: null,
-        name: o.value
+        name: t.value
       }), s.multiselect && (c = c.filter((i) => !y(i))), c;
     }), V = b(v.isLoading.value);
     I(v.isLoading, () => {
       V.value = v.isLoading.value;
     });
-    const _ = async (t) => {
+    const _ = async (o) => {
       var a, c;
       if (s.multiselect) {
-        if (!Array.isArray(e.value) || y(t))
+        if (!Array.isArray(e.value) || y(o))
           return;
-        s.apiRequest && o.value && (V.value = !0);
+        s.apiRequest && t.value && (V.value = !0);
         const i = [...e.value];
-        i.push({ ...t }), e.value = i, de.state.isMobile ? (a = d()) == null || a.close() : setTimeout(() => {
-          var C, U, W, J;
-          (C = d()) == null || C.recalcPosition(), (J = (W = (U = d()) == null ? void 0 : U.elPopupWidget) == null ? void 0 : W.querySelector("input")) == null || J.focus(), o.value && m();
+        i.push({ ...o }), e.value = i, de.state.isMobile ? (a = d()) == null || a.close() : setTimeout(() => {
+          var w, W, J, X;
+          (w = d()) == null || w.recalcPosition(), (X = (J = (W = d()) == null ? void 0 : W.elPopupWidget) == null ? void 0 : J.querySelector("input")) == null || X.focus(), t.value && m();
         });
       } else
-        JSON.stringify(t) !== JSON.stringify(e.value) && (e.value = { ...t }), (c = d()) == null || c.close();
+        JSON.stringify(o) !== JSON.stringify(e.value) && (e.value = { ...o }), (c = d()) == null || c.close();
     }, P = () => {
       if (!Array.isArray(e.value)) {
         const a = (l.value.findIndex((c) => c.id === e.value.id) + 1) % l.value.length;
         e.value = { ...l.value[a] };
       }
-    }, q = async (t) => {
-      Array.isArray(e.value) && (e.value = e.value.filter((a) => a.id !== t), setTimeout(() => {
+    }, q = async (o) => {
+      Array.isArray(e.value) && (e.value = e.value.filter((a) => a.id !== o), setTimeout(() => {
         var a;
         (a = d()) == null || a.recalcPosition();
       }));
     }, K = b(!1);
     s.apiRequest && (I(K, () => {
-      K.value && v.setSearchTextAndLoad(o.value, !1);
-    }), I(o, () => v.setSearchTextAndLoad(o.value)));
-    const x = (t) => {
-      const a = t.target;
+      K.value && v.setSearchTextAndLoad(t.value, !1);
+    }), I(t, () => v.setSearchTextAndLoad(t.value)));
+    const x = (o) => {
+      const a = o.target;
       a.scrollTop / (a.scrollHeight - a.offsetHeight) > 0.8 && v.loadAppend();
     }, ee = () => {
-      var t;
-      K.value = !1, (t = f.value) == null || t.focus(), o.value && m();
+      var o;
+      K.value = !1, (o = f.value) == null || o.focus(), t.value && m();
     };
-    return (t, a) => {
+    return (o, a) => {
       const c = se("top-focus");
-      return p(), T(O(ce), {
+      return p(), S(O(ce), {
         ref_key: "popupRef",
         ref: u,
         onOpen: a[3] || (a[3] = (i) => K.value = !0),
         onClose: a[4] || (a[4] = (i) => ee()),
-        onScrollContentList: a[5] || (a[5] = (i) => t.apiRequest ? x(i) : void 0),
+        onScrollContentList: a[5] || (a[5] = (i) => o.apiRequest ? x(i) : void 0),
         notch: !1,
         transitionDuration: 0
-      }, {
+      }, G({
         opener: k(() => [
           Z((p(), h("div", {
             ref_key: "elRef",
             ref: f,
-            class: $({
+            class: C({
               "top-selector2": !0,
-              "top-selector2-multiselect": t.multiselect,
-              ["top-size_" + t.size]: !0,
-              "top-disabled": t.disabled,
-              "top-forms-focusable": !t.disabled,
-              "top-error": t.isError
+              "top-selector2-multiselect": o.multiselect,
+              ["top-size_" + o.size]: !0,
+              "top-disabled": o.disabled,
+              "top-forms-focusable": !o.disabled,
+              "top-error": o.isError
             }),
             onKeydown: [
-              a[0] || (a[0] = B(S((i) => i.currentTarget.click(), ["stop", "prevent"]), ["up", "down", "enter", "space"])),
+              a[0] || (a[0] = B(T((i) => i.currentTarget.click(), ["stop", "prevent"]), ["up", "down", "enter", "space"])),
               a[1] || (a[1] = B((i) => e.value = [], ["delete"]))
             ],
             tabindex: "0"
           }, [
-            t.multiselect ? (p(), h("div", Te, [
-              (p(!0), h(N, null, D(e.value, (i) => (p(), T(ke, {
+            o.multiselect ? (p(), h("div", Se, [
+              (p(!0), h(N, null, H(e.value, (i) => (p(), S(ke, {
                 id: i.id,
                 name: i.name,
                 onDelete: q
               }, null, 8, ["id", "name"]))), 256))
             ])) : A("", !0),
-            t.multiselect ? A("", !0) : (p(), h("span", Se, w(Array.isArray(e.value) ? "" : e.value.name), 1)),
-            t.addChanger && !t.multiselect && l.value.length > 1 && !t.disabled ? (p(), h("span", {
+            o.multiselect ? A("", !0) : (p(), h("span", Te, $(Array.isArray(e.value) ? "" : e.value.name), 1)),
+            o.addChanger && !o.multiselect && l.value.length > 1 && !o.disabled ? (p(), h("span", {
               key: 2,
               class: "top-changer top-changer-selector",
-              onClick: S(P, ["stop"])
+              onClick: T(P, ["stop"])
             })) : A("", !0)
           ], 34)), [
             [
               c,
-              t.isError,
+              o.isError,
               void 0,
               { onupdate: !0 }
             ]
           ])
         ]),
-        widget: k(() => [
-          R(O(me), {
-            title: "Поиск",
-            icon: "",
-            modelValue: o.value,
-            "onUpdate:modelValue": a[2] || (a[2] = (i) => o.value = i),
-            isLoading: V.value,
-            placeholder: !Array.isArray(e.value) && !t.multiselect && t.showSelectedInInput ? e.value.name : t.placeholder
-          }, null, 8, ["modelValue", "isLoading", "placeholder"])
-        ]),
         contentList: k(() => [
-          (p(!0), h(N, null, D(r.value, (i) => (p(), T(O(j), {
-            class: $({
-              "top-active": !Array.isArray(e.value) && !t.multiselect && e.value.name === i.name
+          (p(!0), h(N, null, H(r.value, (i) => (p(), S(O(j), {
+            class: C({
+              "top-active": !Array.isArray(e.value) && !o.multiselect && e.value.name === i.name
             }),
             key: i.id ?? void 0,
-            onClick: S((C) => _(i), ["stop"])
+            onClick: T((w) => _(i), ["stop"])
           }, {
             default: k(() => [
-              t.$slots.item ? H(t.$slots, "item", {
+              o.$slots.item ? F(o.$slots, "item", {
                 key: 0,
                 item: i
               }) : (p(), h(N, { key: 1 }, [
-                L(w(i.name), 1)
+                L($(i.name), 1)
               ], 64))
             ]),
             _: 2
           }, 1032, ["class", "onClick"]))), 128)),
-          !V.value && !r.value.length ? (p(), T(O(j), {
+          !V.value && !r.value.length ? (p(), S(O(j), {
             key: 0,
             type: "regular"
           }, {
             default: k(() => [
-              L(w(t.$i18n.Common.No_results), 1)
+              L($(o.$i18n.Common.No_results), 1)
             ]),
             _: 1
           })) : A("", !0)
         ]),
-        _: 3
-      }, 512);
+        _: 2
+      }, [
+        o.showSearch ? {
+          name: "widget",
+          fn: k(() => [
+            U(O(me), {
+              title: "Поиск",
+              icon: "",
+              modelValue: t.value,
+              "onUpdate:modelValue": a[2] || (a[2] = (i) => t.value = i),
+              isLoading: V.value,
+              placeholder: !Array.isArray(e.value) && !o.multiselect && o.showSelectedInInput ? e.value.name : o.placeholder
+            }, null, 8, ["modelValue", "isLoading", "placeholder"])
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1536);
     };
   }
 }), Be = ["data-top-icon"], Le = { class: "top-info_text" }, Ee = {
@@ -466,7 +472,7 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
   },
   setup(n) {
     return (s, e) => (p(), h("div", {
-      class: $({
+      class: C({
         "top-info": !0,
         ["top-size_" + s.size]: !0,
         ["top-info-styling_" + s.styling]: !0
@@ -474,14 +480,14 @@ const ve = { class: "top-editArea_footer" }, ye = /* @__PURE__ */ E({
       "data-top-icon": s.icon
     }, [
       M("div", Le, [
-        H(s.$slots, "default")
+        F(s.$slots, "default")
       ]),
       s.$slots.additional ? (p(), h("span", Ee, [
-        H(s.$slots, "additional")
+        F(s.$slots, "additional")
       ])) : A("", !0)
     ], 10, Be));
   }
-}), Ge = ye, De = ge, He = Ce, Fe = Ie, Re = fe, Ue = Me;
+}), Ge = ye, De = ge, He = we, Fe = Ie, Re = fe, Ue = Me;
 export {
   Ge as TopEditArea,
   De as TopEditInput,