mediacube-ui-v2 0.0.343 → 0.0.345

package/dist/ai-catalog/index.json

@@ -1,6 +1,6 @@
 {
   "catalogSchemaVersion": 2,
-  "libraryVersion": "0.0.343",
+  "libraryVersion": "0.0.345",
   "packageName": "mediacube-ui-v2",
   "pathHash": "9b6f3b8016b22ac7",
   "componentCount": 76,

package/dist/components/elements/McFieldSelect/McFieldSelect.vue2.js

@@ -1,29 +1,29 @@
-import { defineComponent as He, defineAsyncComponent as q, useSlots as je, inject as Ie, ref as p, computed as i, onBeforeUnmount as Ye, watch as K, openBlock as s, createElementBlock as O, normalizeStyle as Ge, normalizeClass as ue, createElementVNode as T, renderSlot as $, createBlock as u, unref as a, withCtx as r, createTextVNode as E, toDisplayString as f, createCommentVNode as _, createVNode as S, mergeProps as Ue, createSlots as J, nextTick as de } from "vue";
-import Xe from "vue-multiselect";
-import { Directions as me } from "../../../enums/ui/Directions2.js";
-import { useFieldErrors as Ke } from "../../../composables/useFieldErrors2.js";
-import { SelectGroupKeys as w, SelectListDirections as Je } from "../../../enums/Select2.js";
-import { PreviewSizes as pe } from "../../../enums/Preview2.js";
-import { TitleVariations as fe } from "../../../enums/Title2.js";
-import { TooltipPositions as Qe } from "../../../enums/Tooltip2.js";
-import { Weights as Q } from "../../../enums/ui/Weights2.js";
-import { ChipSize as Ze } from "../../../enums/Chip2.js";
-import { useTheme as et } from "../../../composables/useTheme2.js";
-import { useThrottleFn as tt } from "@vueuse/core";
+import { defineComponent as Ie, defineAsyncComponent as q, useSlots as Ye, inject as Ge, ref as d, computed as i, onBeforeUnmount as Ue, watch as J, openBlock as s, createElementBlock as O, normalizeStyle as Xe, normalizeClass as de, createElementVNode as T, renderSlot as $, createBlock as u, unref as a, withCtx as r, createTextVNode as E, toDisplayString as f, createCommentVNode as _, createVNode as S, mergeProps as Ke, createSlots as Q, nextTick as me } from "vue";
+import Je from "vue-multiselect";
+import { Directions as pe } from "../../../enums/ui/Directions2.js";
+import { useFieldErrors as Qe } from "../../../composables/useFieldErrors2.js";
+import { SelectGroupKeys as w, SelectListDirections as Ze } from "../../../enums/Select2.js";
+import { PreviewSizes as fe } from "../../../enums/Preview2.js";
+import { TitleVariations as ve } from "../../../enums/Title2.js";
+import { TooltipPositions as et } from "../../../enums/Tooltip2.js";
+import { Weights as Z } from "../../../enums/ui/Weights2.js";
+import { ChipSize as tt } from "../../../enums/Chip2.js";
+import { useTheme as lt } from "../../../composables/useTheme2.js";
+import { useThrottleFn as ot } from "@vueuse/core";
 import h from "../McTitle/McTitle.vue2.js";
 import '../../../assets/components/elements/McSvgIcon/index.css';import '../../../assets/components/elements/McTitle/index.css';/* empty css                    */
-import H from "../McSvgIcon/McSvgIcon.vue2.js";
+import j from "../McSvgIcon/McSvgIcon.vue2.js";
 /* empty css                      */
-const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc-field-select__main" }, at = {
+const nt = ["dir"], at = { class: "mc-field-select__header" }, rt = { class: "mc-field-select__main" }, it = {
   key: 1,
   class: "mc-field-select__single-label"
-}, rt = {
+}, st = {
   key: 0,
   class: "mc-field-select__prepend"
-}, it = {
+}, ct = {
   key: 0,
   class: "mc-field-select__footer"
-}, st = { key: 1 }, xt = /* @__PURE__ */ He({
+}, ut = { key: 1 }, Vt = /* @__PURE__ */ Ie({
   __name: "McFieldSelect",
   props: {
     /**
@@ -250,7 +250,7 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
     },
     dir: {
       type: String,
-      default: me.Ltr
+      default: pe.Ltr
     },
     /**
      * На какое после смотреть что бы считать его заголовком строки
@@ -268,11 +268,11 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
     }
   },
   emits: ["original-input", "tag", "search-change", "update:modelValue", "handle-open", "handle-close"],
-  setup(k, { emit: ve }) {
-    const j = q(() => import("../McAvatar/McAvatar.vue.js")), ge = q(() => import("../McTooltip/McTooltip.vue.js")), Z = q(() => import("../../patterns/McPreview/McPreview.vue.js")), he = q(() => import("../McChip/McChip.vue.js")), C = ve, ye = je(), ee = Ie("dsOptions", {}), e = k, d = et("select"), y = Ke(e.errors), L = p(null), x = p(null), I = p(null), A = p([]), g = p(null), z = p(), F = p(!1), N = p(null), Y = p(null), P = p(null), B = i(() => e.options.some(
+  setup(k, { emit: ge }) {
+    const H = q(() => import("../McAvatar/McAvatar.vue.js")), he = q(() => import("../McTooltip/McTooltip.vue.js")), ee = q(() => import("../../patterns/McPreview/McPreview.vue.js")), ye = q(() => import("../McChip/McChip.vue.js")), C = ge, be = Ye(), te = Ge("dsOptions", {}), e = k, m = lt("select"), y = Qe(e.errors), L = d(null), x = d(null), I = d(null), A = d([]), g = d(null), z = d(), F = d(!1), N = d(null), Y = d(null), P = d(null), B = i(() => e.options.some(
       (t) => Object.prototype.hasOwnProperty.call(t, w.Label) && Object.prototype.hasOwnProperty.call(t, w.Values) && //@ts-ignore
       Array.isArray(t[w.Values])
-    )), te = i(() => !!e.title), le = i(() => e.avatar || e.icon), V = i(() => e.multiple), be = i(() => V.value ? !!(e.modelValue || [])?.length : !!e.modelValue), _e = i(() => e.noResultsText ?? ee.componentTranslations?.select?.noResultsText), Se = i(() => e.emptyList ?? ee.componentTranslations?.select?.emptyList), we = i(() => ({
+    )), le = i(() => !!e.title), oe = i(() => e.avatar || e.icon), V = i(() => e.multiple), _e = i(() => V.value ? !!(e.modelValue || [])?.length : !!e.modelValue), Se = i(() => e.noResultsText ?? te.componentTranslations?.select?.noResultsText), we = i(() => e.emptyList ?? te.componentTranslations?.select?.emptyList), ke = i(() => ({
       label: e.titleField,
       trackBy: e.valueField,
       loading: e.loading,
@@ -301,33 +301,33 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
         const n = l[e.valueField];
         return t.has(String(n)) ? !1 : (t.add(String(n)), !0);
       });
-    }), oe = i(() => B.value ? R.value.map((t) => t[w.Values]).flat() : R.value), ke = i(() => new Map(oe.value.map((t) => [String(t[e.valueField]), t]))), Ce = i(() => e.dir === me.Rtl), xe = i(() => ({
+    }), ne = i(() => B.value ? R.value.map((t) => t[w.Values]).flat() : R.value), Ce = i(() => new Map(ne.value.map((t) => [String(t[e.valueField]), t]))), xe = i(() => e.dir === pe.Rtl), Be = i(() => ({
       "mc-field-select": !0,
       "mc-field-select--error": !!y.errorText.value,
       "mc-field-select--disabled": e.disabled,
       [`mc-field-select--bg-${e.backgroundColor}`]: !!e.backgroundColor,
-      "mc-field-select--is-empty-options-list": Te.value || e.loading,
-      "mc-field-select--with-preview": e.optionWithPreview && be.value,
+      "mc-field-select--is-empty-options-list": Ee.value || e.loading,
+      "mc-field-select--with-preview": e.optionWithPreview && _e.value,
       "mc-field-select--max-height": !!e.maxHeight,
-      "mc-field-select--rtl": Ce.value,
-      "mc-field-select--hide-arrow": !!ye.arrow
-    })), Be = i(() => `${e.title}${e.required ? " *" : ""}`), Ve = i(() => {
+      "mc-field-select--rtl": xe.value,
+      "mc-field-select--hide-arrow": !!be.arrow
+    })), Ve = i(() => `${e.title}${e.required ? " *" : ""}`), Te = i(() => {
       const t = ["gray", "dark-gray", "black"], o = ["white"];
-      let l = "gray", n = e.backgroundColor, c = e.backgroundColor, m = "black";
-      return (!e.backgroundColor || o.includes(e.backgroundColor)) && (n = d.component.color), t.includes(e.backgroundColor) && (m = "white", l = "white", n = "black"), e.disabled && !e.backgroundColor && (c = "hover-gray"), {
+      let l = "gray", n = e.backgroundColor, c = e.backgroundColor, p = "black";
+      return (!e.backgroundColor || o.includes(e.backgroundColor)) && (n = m.component.color), t.includes(e.backgroundColor) && (p = "white", l = "white", n = "black"), e.disabled && !e.backgroundColor && (c = "hover-gray"), {
         "--mc-field-select-max-height": e.maxHeight,
-        "--mc-field-select-bg-color": c && d.colors[c],
-        "--mc-field-select-color": d.colors[d.component.color],
-        "--mc-field-select-selected-color": d.colors[d.component.selected],
-        "--mc-field-select-border-color": n && d.colors[n],
-        "--mc-field-select-label-color": d.colors[m],
-        "--mc-field-select-placeholder-color": d.colors[l]
+        "--mc-field-select-bg-color": c && m.colors[c],
+        "--mc-field-select-color": m.colors[m.component.color],
+        "--mc-field-select-selected-color": m.colors[m.component.selected],
+        "--mc-field-select-border-color": n && m.colors[n],
+        "--mc-field-select-label-color": m.colors[p],
+        "--mc-field-select-placeholder-color": m.colors[l]
       };
-    }), Te = i(() => e.hideSelected && !L.value || !e.options.length ? e.multiple ? B.value ? !1 : Array.isArray(e.modelValue) && e.options.length === e.modelValue.length : !!e.modelValue && R.value?.length === 1 && !L.value : e.options.length === 0 ? !e.options.length : !1), M = i({
+    }), Ee = i(() => e.hideSelected && !L.value || !e.options.length ? e.multiple ? B.value ? !1 : Array.isArray(e.modelValue) && e.options.length === e.modelValue.length : !!e.modelValue && R.value?.length === 1 && !L.value : e.options.length === 0 ? !e.options.length : !1), M = i({
       get() {
         let t = V.value ? e.modelValue || [] : [e.modelValue].filter(Boolean);
         t = t.map((l) => {
-          const n = ke.value.get(String(l));
+          const n = Ce.value.get(String(l));
           return {
             [e.titleField]: n?.[e.titleField] || l,
             [e.valueField]: n?.[e.valueField] || l,
@@ -344,25 +344,25 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
         let o = V.value ? Array.isArray(t) ? t : [] : [t];
         o = o.filter(Boolean).map((n) => n[e.valueField]);
         const [l] = o;
-        $e(t), Oe(V.value ? o : l);
+        Ae(t), $e(V.value ? o : l);
       }
-    }), ne = (t = e.options) => {
+    }), ae = (t = e.options) => {
       const o = /* @__PURE__ */ new Set(), l = B.value ? t.flatMap((c) => c[w.Values] ?? []) : t, n = [...A.value, ...l];
       A.value = n.filter((c) => {
-        const m = c[e.valueField];
-        if (o.has(String(m))) return !1;
-        const b = e.modelValue?.constructor === Array ? e.modelValue.map((U) => String(U)).includes(String(c[e.valueField])) : String(c[e.valueField]) === String(e.modelValue);
-        return b && o.add(String(m)), b;
+        const p = c[e.valueField];
+        if (o.has(String(p))) return !1;
+        const b = e.modelValue?.constructor === Array ? e.modelValue.map((X) => String(X)).includes(String(c[e.valueField])) : String(c[e.valueField]) === String(e.modelValue);
+        return b && o.add(String(p)), b;
       });
-    }, ae = (t) => {
+    }, re = (t) => {
       if (!t || t.nodeType !== Node.ELEMENT_NODE || t === document.documentElement)
         return document.documentElement;
       const { overflow: o, overflowY: l } = getComputedStyle(t);
-      if (["auto", "scroll"].some((m) => [o, l].includes(m)))
+      if (["auto", "scroll"].some((p) => [o, l].includes(p)))
         return t;
       const c = t.parentNode;
-      return !c || c.nodeType !== Node.ELEMENT_NODE ? document.documentElement : ae(c);
-    }, Ee = (t) => {
+      return !c || c.nodeType !== Node.ELEMENT_NODE ? document.documentElement : re(c);
+    }, Le = (t) => {
       if (!t) return null;
       let o = t.parentElement;
       for (; o && o !== document.body; ) {
@@ -371,7 +371,7 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
         o = o.parentElement;
       }
       return null;
-    }, re = i(() => ["iPhone", "iPad"].some((t) => navigator?.platform?.includes(t)) && window.visualViewport?.offsetTop || 0), D = tt(() => {
+    }, ie = i(() => ["iPhone", "iPad"].some((t) => navigator?.platform?.includes(t)) && window.visualViewport?.offsetTop || 0), D = ot(() => {
       if (!g.value || !x.value) return;
       const {
         top: t = 0,
@@ -379,38 +379,38 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
         height: l = 0,
         width: n = 0,
         left: c = 0
-      } = I.value?.getBoundingClientRect() || {}, m = g.value.getBoundingClientRect(), b = x.value;
+      } = I.value?.getBoundingClientRect() || {}, p = g.value.getBoundingClientRect(), b = x.value;
       if (!b) return;
-      const U = t - m.top, Re = o - m.bottom;
-      if (U >= -l && Re < l) {
-        const v = b.$refs.list, W = Ee(v), Me = W ? W.left : 0, ce = W ? W.top : 0;
-        v.style.width = `${n}px`, v.style.position = "fixed", v.style.left = `${c - Me}px`;
-        const De = I.value?.querySelector(".mc-field-select__header")?.offsetHeight, We = 8;
-        let X = e.openDirection;
-        switch (X === Je.Auto && (X = b?.isAbove ? "top" : "bottom"), X) {
+      const X = t - p.top, De = o - p.bottom;
+      if (X >= -l && De < l) {
+        const v = b.$refs.list, W = Le(v), We = W ? W.left : 0, ue = W ? W.top : 0;
+        v.style.width = `${n}px`, v.style.position = "fixed", v.style.left = `${c - We}px`;
+        const qe = I.value?.querySelector(".mc-field-select__header")?.offsetHeight, je = 8;
+        let K = e.openDirection;
+        switch (K === Ze.Auto && (K = b?.isAbove ? "top" : "bottom"), K) {
           case "top": {
-            const qe = t + (te.value ? De + We : 0) + re.value - v.getBoundingClientRect().height - 8;
-            v.style.top = `${qe - ce}px`, v.style.bottom = "auto";
+            const He = t + (le.value ? qe + je : 0) + ie.value - v.getBoundingClientRect().height - 8;
+            v.style.top = `${He - ue}px`, v.style.bottom = "auto";
             break;
           }
           case "bottom":
-            v.style.bottom = "auto", v.style.top = `${t + re.value + l - ce}px`;
+            v.style.bottom = "auto", v.style.top = `${t + ie.value + l - ue}px`;
             break;
         }
       } else if (!/Android/i.test(navigator.userAgent))
         return b.deactivate();
-    }, 16), Le = () => {
-      G(), g.value = ae(x.value.$el) || document.documentElement, g.value.addEventListener("scroll", D), z.value?.disconnect(), z.value = new ResizeObserver(D), z.value.observe(g.value);
-    }, ie = (t) => {
+    }, 16), Fe = () => {
+      G(), g.value = re(x.value.$el) || document.documentElement, g.value.addEventListener("scroll", D), z.value?.disconnect(), z.value = new ResizeObserver(D), z.value.observe(g.value);
+    }, se = (t) => {
       const o = { [e.titleField]: t, [e.valueField]: t };
       A.value.push(o), M.value = V.value ? [...M.value, o] : o, C("tag", t);
-    }, Fe = (t) => {
-      L.value = t, C("search-change", t);
     }, Oe = (t) => {
-      y.toggleErrorVisible(), C("update:modelValue", t);
+      L.value = t, C("search-change", t);
     }, $e = (t) => {
+      y.toggleErrorVisible(), C("update:modelValue", t);
+    }, Ae = (t) => {
       C("original-input", t);
-    }, Ae = () => {
+    }, ze = () => {
       const t = x.value;
       if (!t?.$refs?.list) return;
       const o = t.$refs.list;
@@ -419,38 +419,40 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
       const l = document.createElement("div");
       l.className = "mc-field-select mc-field-select--list-portal";
       const n = document.createElement("div");
-      n.className = "multiselect", n.appendChild(o), l.appendChild(n), document.body.appendChild(l), P.value = l, F.value = !0, de(D);
-    }, se = () => {
+      n.className = "multiselect", n.appendChild(o), l.appendChild(n), document.body.appendChild(l), P.value = l, F.value = !0, me(D);
+    }, ce = () => {
       if (!F.value || !N.value) return;
       const o = x.value?.$refs?.list, l = P.value;
       o && l?.contains(o) && N.value.insertBefore(o, Y.value), l?.remove(), F.value = !1, N.value = null, Y.value = null, P.value = null;
-    }, ze = () => {
-      C("handle-open"), e.renderAbsoluteList && (Le(), de(Ae));
+    }, Ne = () => {
+      C("handle-open"), e.renderAbsoluteList && (Fe(), me(ze));
     }, G = () => {
       z.value?.disconnect(), g.value && (g.value.removeEventListener("scroll", D), g.value = null);
-    }, Ne = () => {
-      e.taggable && Pe(), F.value && se(), G(), C("handle-close");
-    }, Pe = () => {
+    }, U = d(!1), Pe = () => {
+      U.value = !0;
+    }, Re = () => {
+      U.value ? U.value = !1 : e.taggable && Me(), F.value && ce(), G(), C("handle-close");
+    }, Me = () => {
       const t = L.value?.trim();
-      !t || oe.value.some(
+      !t || ne.value.some(
         (l) => String(l[e.titleField]).toLowerCase() === t.toLowerCase()
-      ) || (ie(t), L.value = "");
+      ) || (se(t), L.value = "");
     };
-    return Ye(() => {
-      F.value && se(), G();
-    }), K(
+    return Ue(() => {
+      F.value && ce(), G();
+    }), J(
       () => e.options,
       (t) => {
-        ne(t);
+        ae(t);
       },
       { immediate: !0 }
-    ), K(
+    ), J(
       () => e.modelValue,
       () => {
-        ne();
+        ae();
       },
       { immediate: !0, deep: !0 }
-    ), K(
+    ), J(
       () => e.errors,
       (t) => {
         y.setError(t);
@@ -459,44 +461,45 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
       ref_key: "field_select_wrapper_ref",
       ref: I,
       dir: k.dir,
-      class: ue(xe.value),
-      style: Ge(Ve.value)
+      class: de(Be.value),
+      style: Xe(Te.value)
     }, [
-      T("div", ot, [
+      T("div", at, [
         $(t.$slots, "header", {}, () => [
-          te.value ? (s(), u(h, {
+          le.value ? (s(), u(h, {
             key: 0,
             "max-width": "100%",
-            weight: a(Q).Medium
+            weight: a(Z).Medium
           }, {
             default: r(() => [
-              E(f(Be.value), 1)
+              E(f(Ve.value), 1)
             ]),
             _: 1
           }, 8, ["weight"])) : _("", !0)
         ])
       ]),
-      T("div", nt, [
-        S(a(Xe), Ue({
+      T("div", rt, [
+        S(a(Je), Ke({
           ref_key: "field_select_ref",
           ref: x,
           modelValue: M.value,
           "onUpdate:modelValue": o[0] || (o[0] = (l) => M.value = l)
-        }, we.value, {
-          onTag: ie,
-          onSearchChange: Fe,
-          onOpen: ze,
-          onClose: Ne
-        }), J({
+        }, ke.value, {
+          onTag: se,
+          onSelect: Pe,
+          onSearchChange: Oe,
+          onOpen: Ne,
+          onClose: Re
+        }), Q({
           singleLabel: r(({ option: l }) => [
-            e.optionWithPreview ? (s(), u(a(Z), {
+            e.optionWithPreview ? (s(), u(a(ee), {
               key: 0,
               class: "option__desc",
-              size: a(pe).L
-            }, J({
+              size: a(fe).L
+            }, Q({
               top: r(() => [
                 S(h, {
-                  weight: a(Q).SemiBold,
+                  weight: a(Z).SemiBold,
                   "html-data": l[e.titleField]
                 }, null, 8, ["weight", "html-data"])
               ]),
@@ -508,12 +511,12 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
               l.icon || l.avatar ? {
                 name: "left",
                 fn: r(() => [
-                  l.icon ? (s(), u(H, {
+                  l.icon ? (s(), u(j, {
                     key: 0,
                     name: l.icon,
                     color: l.iconColor || "main",
                     size: "400"
-                  }, null, 8, ["name", "color"])) : (s(), u(a(j), {
+                  }, null, 8, ["name", "color"])) : (s(), u(a(H), {
                     key: 1,
                     src: l.avatar,
                     size: "400",
@@ -537,43 +540,43 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
                 ]),
                 key: "1"
               } : void 0
-            ]), 1032, ["size"])) : (s(), O("div", at, [
-              le.value ? (s(), O("div", rt, [
-                k.avatar ? (s(), u(a(j), {
+            ]), 1032, ["size"])) : (s(), O("div", it, [
+              oe.value ? (s(), O("div", st, [
+                k.avatar ? (s(), u(a(H), {
                   key: 0,
                   src: k.avatar
-                }, null, 8, ["src"])) : (s(), u(H, {
+                }, null, 8, ["src"])) : (s(), u(j, {
                   key: 1,
                   color: l.iconColor || "main",
                   name: e.icon
                 }, null, 8, ["color", "name"]))
               ])) : _("", !0),
               T("div", {
-                class: ue(["mc-field-select__label-text", le.value ? "mc-field-select__label-text--indent-left" : ""])
+                class: de(["mc-field-select__label-text", oe.value ? "mc-field-select__label-text--indent-left" : ""])
               }, f(l ? l[e.titleField] : k.placeholder), 3)
             ]))
           ]),
           noResult: r(() => [
             $(t.$slots, "noResult", {}, () => [
-              T("span", null, f(_e.value), 1)
+              T("span", null, f(Se.value), 1)
             ])
           ]),
           noOptions: r(() => [
             $(t.$slots, "noOptions", {}, () => [
-              T("span", null, f(Se.value), 1)
+              T("span", null, f(we.value), 1)
             ])
           ]),
           tag: r((l) => [
-            S(a(he), {
-              size: a(Ze).Xs,
+            S(a(ye), {
+              size: a(tt).Xs,
               class: "multiselect__tag",
-              variation: `${a(d).component.selected}-invert`,
+              variation: `${a(m).component.selected}-invert`,
               "text-color": "black",
               closable: !l?.option?.hasOwnProperty("is_closable") || l?.option?.is_closable,
               onClose: (n) => l.remove(l.option)
             }, {
               button: r(() => [
-                S(H, {
+                S(j, {
                   size: "250",
                   name: "cancel"
                 })
@@ -598,14 +601,14 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
                 ]),
                 _: 2
               }, 1024)) : _("", !0),
-              e.optionWithPreview ? (s(), u(a(Z), {
+              e.optionWithPreview ? (s(), u(a(ee), {
                 key: 1,
                 class: "option__desc",
-                size: a(pe).L
-              }, J({
+                size: a(fe).L
+              }, Q({
                 top: r(() => [
                   S(h, {
-                    weight: a(Q).SemiBold,
+                    weight: a(Z).SemiBold,
                     "html-data": l[e.titleField]
                   }, null, 8, ["weight", "html-data"])
                 ]),
@@ -614,12 +617,12 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
                 l.icon || l.avatar ? {
                   name: "left",
                   fn: r(() => [
-                    l.icon ? (s(), u(H, {
+                    l.icon ? (s(), u(j, {
                       key: 0,
                       name: l.icon,
                       color: l.iconColor || "main",
                       size: "400"
-                    }, null, 8, ["name", "color"])) : (s(), u(a(j), {
+                    }, null, 8, ["name", "color"])) : (s(), u(a(H), {
                       key: 1,
                       src: l.avatar,
                       size: "400",
@@ -640,12 +643,12 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
                   ]),
                   key: "1"
                 } : void 0
-              ]), 1032, ["size"])) : (s(), u(a(ge), {
+              ]), 1032, ["size"])) : (s(), u(a(he), {
                 key: 2,
                 class: "mc-field-select__options-tooltip-target",
                 "max-width": "m",
                 color: "black",
-                placement: a(Qe).Top,
+                placement: a(et).Top,
                 content: l[e.titleField]
               }, {
                 default: r(() => [
@@ -658,21 +661,21 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
           } : void 0
         ]), 1040, ["modelValue"])
       ]),
-      a(y).errorText.value || e.helpText || t.$slots.footer ? (s(), O("div", it, [
+      a(y).errorText.value || e.helpText || t.$slots.footer ? (s(), O("div", ct, [
         a(y).errorText.value ? (s(), u(h, {
           key: 0,
           "tag-name": "div",
           color: "red",
-          variation: a(fe).Overline,
+          variation: a(ve).Overline,
           "max-width": "100%",
           "html-data": a(y).errorText.value
         }, null, 8, ["variation", "html-data"])) : _("", !0),
-        a(y).errorText.value ? (s(), O("br", st)) : _("", !0),
+        a(y).errorText.value ? (s(), O("br", ut)) : _("", !0),
         $(t.$slots, "footer", {}, () => [
           e.helpText ? (s(), u(h, {
             key: 0,
             "tag-name": "div",
-            variation: a(fe).Overline,
+            variation: a(ve).Overline,
             color: "gray",
             "max-width": "100%",
             "pre-line": ""
@@ -684,9 +687,9 @@ const lt = ["dir"], ot = { class: "mc-field-select__header" }, nt = { class: "mc
           }, 8, ["variation"])) : _("", !0)
         ])
       ])) : _("", !0)
-    ], 14, lt));
+    ], 14, nt));
   }
 });
 export {
-  xt as default
+  Vt as default
 };

package/dist/styles/mixins.scss

@@ -382,7 +382,17 @@
   }
 }
 
-@mixin editor-default-styles($main-font-size: $font-size-300, $main-line-height: $line-height-300) {
+/**
+ * $preserve-empty-lines — сохранять пустые строки, набранные в редакторе (Enter x2 / Shift+Enter).
+ * По умолчанию выключено: пустые параграфы прячутся, как и раньше.
+ * Включать только там, где рендерится контент из визуального редактора, и пустая строка —
+ * осмысленная часть вёрстки автора. Для текстов из бэка/переводов оставлять false.
+ */
+@mixin editor-default-styles(
+  $main-font-size: $font-size-300,
+  $main-line-height: $line-height-300,
+  $preserve-empty-lines: false
+) {
   p,
   strong,
   em,
@@ -395,6 +405,21 @@
       display: none;
     }
   }
+  @if $preserve-empty-lines {
+    /**
+     * Пустой <p> без контента имеет нулевую высоту, а висящий <br> в конце абзаца
+     * браузер не отрисовывает вовсе. Zero-width space даёт последней строке содержимое,
+     * поэтому отступ, который автор видит в редакторе, не схлопывается при показе.
+     */
+    p {
+      &:empty {
+        display: block;
+      }
+      &::after {
+        content: '\200B';
+      }
+    }
+  }
   ol,
   ul {
     margin-block-start: 0;
@@ -704,8 +729,8 @@
 }
 
 
-@mixin editor-notification-styles {
-  @include editor-default-styles;
+@mixin editor-notification-styles($preserve-empty-lines: false) {
+  @include editor-default-styles($preserve-empty-lines: $preserve-empty-lines);
   h1 {
     margin-bottom: $space-250;
     img {
@@ -751,7 +776,7 @@
   }
 }
 
-@mixin editor-assist-styles {
+@mixin editor-assist-styles($preserve-empty-lines: false) {
   img {
     max-width: 100%;
     width: 100%;
@@ -759,5 +784,5 @@
     object-fit: cover;
     margin: 16px 0;
   }
-  @include editor-default-styles;
+  @include editor-default-styles($preserve-empty-lines: $preserve-empty-lines);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mediacube-ui-v2",
-  "version": "0.0.343",
+  "version": "0.0.345",
   "license": "MIT",
   "description": "Design system for Mediacube services",
   "sideEffects": [