@profitliga/ui 2.0.2 → 2.0.4

package/dist/components/v2/FileUpload/FileUpload.vue2.js

@@ -1,15 +1,15 @@
 import { defineComponent as de, useModel as ne, useSlots as se, useId as re, computed as m, ref as p, watch as N, onBeforeUnmount as ue, openBlock as d, createElementBlock as n, mergeProps as r, unref as t, createElementVNode as o, renderSlot as S, createTextVNode as z, toDisplayString as v, createCommentVNode as u, createBlock as B, withCtx as P, createVNode as b, withModifiers as D, Fragment as U, renderList as ce, mergeModels as j } from "vue";
 import { CircleQuestionMark as fe, CircleAlert as me, ChevronLeft as pe, ChevronRight as ve, Download as be, FileUp as xe, ZoomIn as he } from "@lucide/vue";
-import { breakpoints as ke } from "../../../utils/breakpoints.util.js";
-import ge from "../File/File.vue.js";
-import ye from "../File/FilePreviewDialog.vue.js";
+import ke from "../File/File.vue.js";
+import ge from "../File/FilePreviewDialog.vue.js";
+import { useIsMobile as ye } from "../shared/useIsMobile.util.js";
 import { useTestId as _e } from "../shared/useTestId.util.js";
 import we from "../Tooltip/Tooltip.vue.js";
 import { useFileSelection as Ce } from "./useFileSelection.util.js";
 const Fe = ["aria-labelledby"], De = {
   key: 0,
   class: "file-upload__header"
-}, $e = { class: "file-upload__heading" }, Le = ["aria-label"], Te = { class: "file-upload__hint-content" }, Ie = { class: "file-upload__example-label" }, Se = ["src", "alt"], ze = { class: "file-upload__body" }, Be = {
+}, $e = { class: "file-upload__heading" }, Ie = ["aria-label"], Le = { class: "file-upload__hint-content" }, Te = { class: "file-upload__example-label" }, Se = ["src", "alt"], ze = { class: "file-upload__body" }, Be = {
   key: 0,
   class: "file-upload__list"
 }, Ae = { class: "file-upload__drop" }, Me = { class: "file-upload__drop-icon" }, Re = { class: "file-upload__drop-text" }, qe = { class: "file-upload__divider" }, Ve = { class: "file-upload__divider-text" }, Oe = ["disabled"], Ee = ["id", "name", "accept", "multiple", "disabled"], Ne = { class: "file-upload__example-label" }, Pe = ["aria-label"], Ue = ["src", "alt"], je = {
@@ -45,7 +45,7 @@ const Fe = ["aria-labelledby"], De = {
   }),
   emits: /* @__PURE__ */ j(["add", "remove", "reject", "preview", "exampleClick"], ["update:modelValue"]),
   setup(e, { emit: W }) {
-    const i = e, x = W, f = ne(e, "modelValue"), A = se(), s = _e(() => i.testId), $ = re(), M = `file-upload-title-${$}`, H = m(() => i.id ?? `${$}-file-upload`), g = ke.smaller(i.breakpointMobile), R = p(null), y = p(null), _ = p(!1), w = p(!1), C = p(null), L = p(!1), T = p(!1), I = m(() => !!(i.title || A.title)), q = m(() => !!(i.example || A.example)), Q = m(() => I.value || i.required), { addFiles: V, removeFile: O, isFull: Z } = Ce({
+    const i = e, x = W, f = ne(e, "modelValue"), A = se(), s = _e(() => i.testId), $ = re(), M = `file-upload-title-${$}`, H = m(() => i.id ?? `${$}-file-upload`), g = ye(i.breakpointMobile), R = p(null), y = p(null), _ = p(!1), w = p(!1), C = p(null), I = p(!1), L = p(!1), T = m(() => !!(i.title || A.title)), q = m(() => !!(i.example || A.example)), Q = m(() => T.value || i.required), { addFiles: V, removeFile: O, isFull: Z } = Ce({
       files: () => f.value,
       setFiles: (l) => {
         f.value = l;
@@ -108,11 +108,11 @@ const Fe = ["aria-labelledby"], De = {
     function k() {
       const l = y.value;
       if (!l) {
-        L.value = !1, T.value = !1;
+        I.value = !1, L.value = !1;
         return;
       }
       const a = l.scrollWidth - l.clientWidth;
-      L.value = l.scrollLeft > 1, T.value = l.scrollLeft < a - 1;
+      I.value = l.scrollLeft > 1, L.value = l.scrollLeft < a - 1;
     }
     let F;
     return N(y, (l) => {
@@ -131,11 +131,11 @@ const Fe = ["aria-labelledby"], De = {
     }), (l, a) => (d(), n("div", r({
       class: J.value,
       role: "group",
-      "aria-labelledby": I.value ? M : void 0
+      "aria-labelledby": T.value ? M : void 0
     }, { ...l.$attrs, ...t(s)("root") }), [
       Q.value ? (d(), n("div", De, [
         o("div", $e, [
-          I.value ? (d(), n("span", r({
+          T.value ? (d(), n("span", r({
             key: 0,
             id: M,
             class: "file-upload__title"
@@ -157,11 +157,11 @@ const Fe = ["aria-labelledby"], De = {
                 "aria-label": e.exampleLabel
               }, t(s)("example-hint")), [
                 b(t(fe), { "aria-hidden": "true" })
-              ], 16, Le)
+              ], 16, Ie)
             ]),
             default: P(() => [
-              o("span", Te, [
-                o("span", Ie, v(e.exampleLabel), 1),
+              o("span", Le, [
+                o("span", Te, v(e.exampleLabel), 1),
                 S(l.$slots, "example", {}, () => [
                   e.example ? (d(), n("img", {
                     key: 0,
@@ -192,7 +192,7 @@ const Fe = ["aria-labelledby"], De = {
           onDrop: D(te, ["prevent"])
         }), [
           f.value.length ? (d(), n("div", Be, [
-            !t(g) && L.value ? (d(), n("button", r({
+            !t(g) && I.value ? (d(), n("button", r({
               key: 0,
               type: "button",
               class: "file-upload__scroll file-upload__scroll--prev",
@@ -207,7 +207,7 @@ const Fe = ["aria-labelledby"], De = {
               ref: y,
               class: "file-upload__track"
             }, t(s)("track"), { onScroll: k }), [
-              (d(!0), n(U, null, ce(f.value, (c) => (d(), B(t(ge), {
+              (d(!0), n(U, null, ce(f.value, (c) => (d(), B(t(ke), {
                 key: c.id,
                 file: c,
                 disabled: e.disabled,
@@ -216,7 +216,7 @@ const Fe = ["aria-labelledby"], De = {
                 onRemove: (oe) => t(O)(c)
               }, null, 8, ["file", "disabled", "test-id", "onOpen", "onRemove"]))), 128))
             ], 16),
-            !t(g) && T.value ? (d(), n("button", r({
+            !t(g) && L.value ? (d(), n("button", r({
               key: 1,
               type: "button",
               class: "file-upload__scroll file-upload__scroll--next",
@@ -286,7 +286,7 @@ const Fe = ["aria-labelledby"], De = {
           ], 16, Pe)
         ], 16)) : u("", !0)
       ]),
-      e.preview ? (d(), B(t(ye), {
+      e.preview ? (d(), B(t(ge), {
         key: 1,
         open: w.value,
         "onUpdate:open": a[3] || (a[3] = (c) => w.value = c),

package/dist/components/v2/FormField/FormField.css

@@ -0,0 +1 @@
+.form-field-v2[data-v-80b99a34]{flex-direction:column;align-items:flex-start;width:100%;display:flex}.form-field-v2__label[data-v-80b99a34]{width:100%;color:var(--theme-neutral-text-title);overflow-wrap:break-word;cursor:pointer;align-items:center;gap:.125rem;padding:.375rem .6875rem .375rem .5rem;font-size:.875rem;font-weight:400;line-height:1rem;display:flex}.form-field-v2__required[data-v-80b99a34]{color:var(--theme-error-500);flex-shrink:0}.form-field-v2__control[data-v-80b99a34]{width:100%}.form-field-v2__message[data-v-80b99a34]{width:100%;color:var(--theme-neutral-text-caption);overflow-wrap:break-word;padding:.25rem .6875rem 0 .5rem;font-size:.625rem;font-weight:400;line-height:normal}.form-field-v2--error .form-field-v2__label[data-v-80b99a34],.form-field-v2--error .form-field-v2__message[data-v-80b99a34]{color:var(--theme-error-500)}

package/dist/components/v2/FormField/FormField.types.d.ts

@@ -0,0 +1,48 @@
+export interface FormFieldProps {
+    /**
+     * Подпись над контролом. Для подписи сложнее строки есть слот `label` —
+     * например «Комментарий» с уточнением мелким шрифтом рядом.
+     */
+    label?: string;
+    /**
+     * Обязательное поле: к подписи добавляется красная звёздочка, контрол
+     * получает `required` через проп слота. Проверку значения обёртка на себя
+     * не берёт — это забота формы.
+     */
+    required?: boolean;
+    /** Состояние ошибки: подпись краснеет, показывается `errorMessage`. */
+    error?: boolean;
+    /**
+     * Текст ошибки под контролом. Показывается только при `error: true`,
+     * поэтому проп можно держать заполненным постоянно — так же, как у `Input`.
+     */
+    errorMessage?: string;
+    /** Пояснение под контролом. В состоянии ошибки его место занимает `errorMessage`. */
+    supportText?: string;
+    /**
+     * Свой `id` контрола. По умолчанию генерируется — его нужно прокинуть в
+     * контрол из пропов слота, иначе клик по подписи не наведёт фокус.
+     */
+    id?: string;
+    /** Базовый `data-testid`; внутренние части получают суффикс имени части. */
+    testId?: string;
+}
+/**
+ * Обёртка не знает, что за контрол внутри, поэтому связывающие атрибуты
+ * отдаёт наружу: проставить их на нужный элемент может только потребитель.
+ */
+export interface FormFieldSlotProps {
+    /** `id` для контрола — на него ссылается `for` подписи. */
+    id: string;
+    /** `id` подписи под контролом; уходит в `aria-describedby` контрола. */
+    describedBy: string | undefined;
+    /** Дублирует проп `required` — чтобы не передавать его дважды. */
+    required: boolean;
+    /** Дублирует проп `error` — обычно уходит в `aria-invalid` контрола. */
+    error: boolean;
+}
+export interface FormFieldSlots {
+    default: (props: FormFieldSlotProps) => unknown;
+    /** Подпись целиком — вместо пропа `label`. Звёздочка добавляется сама. */
+    label?: () => unknown;
+}

package/dist/components/v2/FormField/FormField.vue.d.ts

@@ -0,0 +1,25 @@
+import { FormFieldProps, FormFieldSlots } from './FormField.types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<FormFieldSlots> & FormFieldSlots;
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<FormFieldProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<FormFieldProps> & Readonly<{}>, {
+    label: string;
+    required: boolean;
+    id: string;
+    error: boolean;
+    errorMessage: string;
+    testId: string;
+    supportText: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/v2/FormField/FormField.vue.js

@@ -0,0 +1,8 @@
+import './FormField.css';
+import o from "./FormField.vue2.js";
+/* empty css               */
+import r from "../../../_virtual/_plugin-vue_export-helper.js";
+const p = /* @__PURE__ */ r(o, [["__scopeId", "data-v-80b99a34"]]);
+export {
+  p as default
+};

package/dist/components/v2/FormField/FormField.vue2.js

@@ -0,0 +1,54 @@
+import { defineComponent as q, useSlots as B, useId as T, computed as s, openBlock as a, createElementBlock as d, mergeProps as t, unref as l, renderSlot as v, createTextVNode as $, toDisplayString as p, createCommentVNode as n, createElementVNode as h } from "vue";
+import { useTestId as k } from "../shared/useTestId.util.js";
+const _ = ["for"], S = /* @__PURE__ */ q({
+  inheritAttrs: !1,
+  __name: "FormField",
+  props: {
+    label: { default: void 0 },
+    required: { type: Boolean, default: !1 },
+    error: { type: Boolean, default: !1 },
+    errorMessage: { default: void 0 },
+    supportText: { default: void 0 },
+    id: { default: void 0 },
+    testId: { default: void 0 }
+  },
+  setup(r) {
+    const e = r, b = B(), o = k(() => e.testId), i = T(), c = s(() => e.id ?? `${i}-form-field`), g = `${i}-form-field-label`, m = `${i}-form-field-message`, y = s(() => !!(e.label || b.label)), u = s(() => e.error ? e.errorMessage ?? e.supportText : e.supportText), I = s(() => [
+      "form-field-v2",
+      { "form-field-v2--error": e.error }
+    ]);
+    return (f, x) => (a(), d("div", t({ class: I.value }, { ...f.$attrs, ...l(o)("root") }), [
+      y.value ? (a(), d("label", t({
+        key: 0,
+        id: g,
+        class: "form-field-v2__label",
+        for: c.value
+      }, l(o)("label")), [
+        v(f.$slots, "label", {}, () => [
+          $(p(r.label), 1)
+        ], !0),
+        r.required ? (a(), d("span", t({
+          key: 0,
+          class: "form-field-v2__required",
+          "aria-hidden": "true"
+        }, l(o)("required")), "*", 16)) : n("", !0)
+      ], 16, _)) : n("", !0),
+      h("div", t({ class: "form-field-v2__control" }, l(o)("control")), [
+        v(f.$slots, "default", {
+          id: c.value,
+          describedBy: u.value ? m : void 0,
+          required: r.required,
+          error: r.error
+        }, void 0, !0)
+      ], 16),
+      u.value ? (a(), d("p", t({
+        key: 1,
+        id: m,
+        class: "form-field-v2__message"
+      }, l(o)("message")), p(u.value), 17)) : n("", !0)
+    ], 16));
+  }
+});
+export {
+  S as default
+};

package/dist/components/v2/FormField/index.d.ts

@@ -0,0 +1,3 @@
+import { default as FormField } from './FormField.vue';
+export type { FormFieldProps, FormFieldSlotProps, FormFieldSlots } from './FormField.types';
+export { FormField };

package/dist/components/v2/Image/Image.css

@@ -0,0 +1 @@
+.image-v2[data-v-9056dfcb]{--image-v2-size:3rem;--image-v2-radius:.25rem;width:var(--image-v2-size);height:var(--image-v2-size);flex-shrink:0;position:relative}.image-v2--small[data-v-9056dfcb]{--image-v2-size:2rem;--image-v2-radius:.5rem}.image-v2--medium[data-v-9056dfcb]{--image-v2-size:3rem;--image-v2-radius:.25rem}.image-v2--large[data-v-9056dfcb]{--image-v2-size:6.625rem;--image-v2-radius:.5rem}.image-v2--full[data-v-9056dfcb]{--image-v2-size:100%;--image-v2-radius:0;aspect-ratio:1;height:auto}.image-v2__frame[data-v-9056dfcb]{border-radius:var(--image-v2-radius);background:0 0;border:none;width:100%;height:100%;padding:0;display:block;position:relative;overflow:hidden}.image-v2__picture[data-v-9056dfcb]{object-fit:cover;width:100%;height:100%;display:block}.image-v2__overlay[data-v-9056dfcb]{color:var(--theme-neutral-0);opacity:0;transition:opacity var(--animation-duration-fast) ease-in-out;background-color:#16161666;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.image-v2__overlay-icon[data-v-9056dfcb]{width:1.25rem;height:1.25rem}.image-v2--preview .image-v2__frame[data-v-9056dfcb]{cursor:pointer}.image-v2--preview .image-v2__frame[data-v-9056dfcb]:focus-visible{outline:2px solid var(--theme-primary-500);outline-offset:2px}.image-v2--preview .image-v2__frame:hover .image-v2__overlay[data-v-9056dfcb],.image-v2--preview .image-v2__frame:focus-visible .image-v2__overlay[data-v-9056dfcb]{opacity:1}.image-v2__delete[data-v-9056dfcb]{z-index:1;background-color:var(--theme-secondary-250);width:1.125rem;height:1.125rem;color:var(--theme-neutral-text-title);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;top:-.5625rem;right:-.5625rem}.image-v2__delete[data-v-9056dfcb]:focus-visible{outline:2px solid var(--theme-primary-500);outline-offset:2px}.image-v2__delete[data-v-9056dfcb]:hover{background-color:var(--theme-secondary-300)}.image-v2__delete-icon[data-v-9056dfcb]{width:.75rem;height:.75rem}.image-v2__preview[data-v-9056dfcb]{justify-content:center;align-items:center;width:100%;display:flex}.image-v2__preview-picture[data-v-9056dfcb]{object-fit:contain;max-width:100%;max-height:70dvh}

package/dist/components/v2/Image/Image.types.d.ts

@@ -0,0 +1,26 @@
+/** Размер плитки. `full` растягивает картинку по контейнеру. */
+export type ImageSize = 'small' | 'medium' | 'large' | 'full';
+export interface ImageProps {
+    /** Ссылка на картинку. */
+    src: string;
+    /**
+     * Описание картинки. Пустая строка — картинка декоративная и скрывается от
+     * скринридера; так же ведёт себя нативный `<img alt="">`.
+     */
+    alt?: string;
+    size?: ImageSize;
+    /** Показывать крестик удаления. Нажатие эмитит `delete`, сам ничего не удаляет. */
+    deletable?: boolean;
+    /** Доступное имя крестика удаления. */
+    deleteLabel?: string;
+    /** Клик по картинке открывает её на весь экран. */
+    preview?: boolean;
+    /** Доступное имя плитки, когда она открывает просмотр. */
+    previewLabel?: string;
+    /** Базовый `data-testid`; внутренние части получают суффикс имени части. */
+    testId?: string;
+}
+export interface ImageEmits {
+    /** Нажат крестик удаления. */
+    delete: [];
+}

package/dist/components/v2/Image/Image.vue.d.ts

@@ -0,0 +1,16 @@
+import { ImageProps, ImageSize } from './Image.types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+declare const _default: DefineComponent<ImageProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    delete: () => any;
+}, string, PublicProps, Readonly<ImageProps> & Readonly<{
+    onDelete?: (() => any) | undefined;
+}>, {
+    size: ImageSize;
+    alt: string;
+    testId: string;
+    deletable: boolean;
+    preview: boolean;
+    deleteLabel: string;
+    previewLabel: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/v2/Image/Image.vue.js

@@ -0,0 +1,8 @@
+import './Image.css';
+import o from "./Image.vue2.js";
+/* empty css           */
+import t from "../../../_virtual/_plugin-vue_export-helper.js";
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-9056dfcb"]]);
+export {
+  f as default
+};

package/dist/components/v2/Image/Image.vue2.js

@@ -0,0 +1,91 @@
+import { defineComponent as C, ref as I, computed as f, openBlock as r, createElementBlock as n, mergeProps as o, unref as t, createVNode as w, createCommentVNode as v, createBlock as b, resolveDynamicComponent as B, withCtx as m, createElementVNode as u, createTextVNode as N, toDisplayString as $ } from "vue";
+import { X as h, Eye as L } from "@lucide/vue";
+import V from "../Dialog/Dialog.vue.js";
+import { useTestId as x } from "../shared/useTestId.util.js";
+const D = ["aria-label"], E = ["src", "alt"], z = {
+  key: 0,
+  class: "image-v2__overlay",
+  "aria-hidden": "true"
+}, A = ["src", "alt"], U = /* @__PURE__ */ C({
+  inheritAttrs: !1,
+  __name: "Image",
+  props: {
+    src: {},
+    alt: { default: "" },
+    size: { default: "medium" },
+    deletable: { type: Boolean, default: !1 },
+    deleteLabel: { default: "Удалить изображение" },
+    preview: { type: Boolean, default: !1 },
+    previewLabel: { default: void 0 },
+    testId: { default: void 0 }
+  },
+  emits: ["delete"],
+  setup(e, { emit: p }) {
+    const l = e, g = p, i = x(() => l.testId), s = I(!1), c = f(
+      () => l.previewLabel || l.alt || "Открыть изображение"
+    ), y = f(() => [
+      "image-v2",
+      `image-v2--${l.size}`,
+      { "image-v2--preview": l.preview }
+    ]);
+    return (k, a) => (r(), n("div", o({ class: y.value }, { ...k.$attrs, ...t(i)("root") }), [
+      e.deletable ? (r(), n("button", o({
+        key: 0,
+        type: "button",
+        class: "image-v2__delete",
+        "aria-label": e.deleteLabel
+      }, t(i)("delete"), {
+        onClick: a[0] || (a[0] = (d) => g("delete"))
+      }), [
+        w(t(h), {
+          class: "image-v2__delete-icon",
+          "aria-hidden": "true"
+        })
+      ], 16, D)) : v("", !0),
+      (r(), b(B(e.preview ? "button" : "div"), o({
+        type: e.preview ? "button" : void 0,
+        "aria-label": e.preview ? c.value : void 0,
+        class: "image-v2__frame"
+      }, t(i)("frame"), {
+        onClick: a[1] || (a[1] = (d) => e.preview ? s.value = !0 : void 0)
+      }), {
+        default: m(() => [
+          u("img", o({
+            class: "image-v2__picture",
+            src: e.src,
+            alt: e.alt
+          }, t(i)("picture")), null, 16, E),
+          e.preview ? (r(), n("span", z, [
+            w(t(L), { class: "image-v2__overlay-icon" })
+          ])) : v("", !0)
+        ]),
+        _: 1
+      }, 16, ["type", "aria-label"])),
+      e.preview ? (r(), b(t(V), {
+        key: 1,
+        open: s.value,
+        "onUpdate:open": a[2] || (a[2] = (d) => s.value = d),
+        width: 960,
+        "close-button": { enabled: !0, label: "Закрыть просмотр" },
+        "test-id": e.testId ? `${e.testId}-preview` : void 0
+      }, {
+        title: m(() => [
+          N($(c.value), 1)
+        ]),
+        default: m(() => [
+          u("div", o({ class: "image-v2__preview" }, t(i)("preview")), [
+            u("img", {
+              class: "image-v2__preview-picture",
+              src: e.src,
+              alt: e.alt
+            }, null, 8, A)
+          ], 16)
+        ]),
+        _: 1
+      }, 8, ["open", "test-id"])) : v("", !0)
+    ], 16));
+  }
+});
+export {
+  U as default
+};

package/dist/components/v2/Image/ImageList.css

@@ -0,0 +1 @@
+.image-list-v2[data-v-2691f19b]{flex-wrap:wrap;gap:1.25rem;display:flex}

package/dist/components/v2/Image/ImageList.types.d.ts

@@ -0,0 +1,28 @@
+import { ImageSize } from './Image.types';
+export interface ImageListProps {
+    /**
+     * Ссылки на картинки. Именно массив строк, а не модель файла: у превью,
+     * пришедшего с сервера, нет ни имени, ни размера, ни mime — только адрес.
+     * Для файлов с метаданными есть `FileUpload`.
+     */
+    items: string[];
+    size?: ImageSize;
+    /** Показывать крестик удаления у каждой плитки. */
+    deletable?: boolean;
+    /** Клик по плитке открывает картинку на весь экран. */
+    preview?: boolean;
+    /**
+     * Как назвать плитку номер N для скринридера. По умолчанию —
+     * «Изображение 1», «Изображение 2» и так далее.
+     */
+    itemLabel?: (index: number, src: string) => string;
+    /** Базовый `data-testid`; внутренние части получают суффикс имени части. */
+    testId?: string;
+}
+export interface ImageListEmits {
+    /**
+     * Нажат крестик на плитке. Список ничего не удаляет сам — правит массив
+     * потребитель, как и у остальных полей v2.
+     */
+    delete: [index: number, src: string];
+}

package/dist/components/v2/Image/ImageList.vue.d.ts

@@ -0,0 +1,15 @@
+import { ImageListProps } from './ImageList.types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { ImageSize } from './Image.types';
+declare const _default: DefineComponent<ImageListProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    delete: (index: number, src: string) => any;
+}, string, PublicProps, Readonly<ImageListProps> & Readonly<{
+    onDelete?: ((index: number, src: string) => any) | undefined;
+}>, {
+    size: ImageSize;
+    testId: string;
+    deletable: boolean;
+    preview: boolean;
+    itemLabel: (index: number, src: string) => string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/v2/Image/ImageList.vue.js

@@ -0,0 +1,8 @@
+import './ImageList.css';
+import o from "./ImageList.vue2.js";
+/* empty css               */
+import t from "../../../_virtual/_plugin-vue_export-helper.js";
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-2691f19b"]]);
+export {
+  f as default
+};

package/dist/components/v2/Image/ImageList.vue2.js

@@ -0,0 +1,38 @@
+import { defineComponent as f, openBlock as i, createElementBlock as r, mergeProps as c, unref as v, Fragment as b, renderList as p, createBlock as I } from "vue";
+import { useTestId as g } from "../shared/useTestId.util.js";
+import B from "./Image.vue.js";
+const y = /* @__PURE__ */ f({
+  inheritAttrs: !1,
+  __name: "ImageList",
+  props: {
+    items: {},
+    size: { default: "medium" },
+    deletable: { type: Boolean, default: !1 },
+    preview: { type: Boolean, default: !1 },
+    itemLabel: { type: Function, default: void 0 },
+    testId: { default: void 0 }
+  },
+  emits: ["delete"],
+  setup(e, { emit: d }) {
+    const o = e, m = d, u = g(() => o.testId);
+    function n(l, s) {
+      return o.itemLabel?.(l, s) ?? `Изображение ${l + 1}`;
+    }
+    return (l, s) => (i(), r("div", c({ class: "image-list-v2" }, { ...l.$attrs, ...v(u)("root") }), [
+      (i(!0), r(b, null, p(e.items, (t, a) => (i(), I(B, {
+        key: t,
+        src: t,
+        alt: n(a, t),
+        size: e.size,
+        deletable: e.deletable,
+        "delete-label": `Удалить ${n(a, t)}`,
+        preview: e.preview,
+        "test-id": e.testId ? `${e.testId}-item` : void 0,
+        onDelete: (L) => m("delete", a, t)
+      }, null, 8, ["src", "alt", "size", "deletable", "delete-label", "preview", "test-id", "onDelete"]))), 128))
+    ], 16));
+  }
+});
+export {
+  y as default
+};

package/dist/components/v2/Image/index.d.ts

@@ -0,0 +1,5 @@
+import { default as Image } from './Image.vue';
+import { default as ImageList } from './ImageList.vue';
+export type { ImageEmits, ImageProps, ImageSize } from './Image.types';
+export type { ImageListEmits, ImageListProps } from './ImageList.types';
+export { Image, ImageList };

package/dist/components/v2/Input/Input.css

@@ -1 +1 @@
-.input-field[data-v-1ce017c1]{--field-height:2.5rem;--field-radius:.5rem;--field-padding-x:.5rem;--field-padding-y:.25rem;--field-font-size:.875rem;--field-line-height:1.25rem;--field-label-font-size:.875rem;--field-label-line-height:1rem;--field-icon-size:1rem;--field-chip-padding-x:.75rem;--field-chip-font-size:.875rem;--field-chip-icon-size:1rem;--field-border-color:var(--theme-neutral-border-default);--field-text-color:var(--theme-neutral-text-body);--field-placeholder-color:var(--theme-neutral-550);--field-label-color:var(--theme-neutral-text-title);--field-support-color:var(--theme-neutral-text-caption);--field-icon-color:var(--theme-neutral-icon-caption);flex-direction:column;justify-content:center;align-items:flex-start;width:100%;display:flex;position:relative}.input-field__label[data-v-1ce017c1]{width:100%;font-weight:400;font-size:var(--field-label-font-size);line-height:var(--field-label-line-height);color:var(--field-label-color);overflow-wrap:break-word;align-items:center;gap:.125rem;padding:.375rem .6875rem .375rem .5rem;display:flex}.input-field__required[data-v-1ce017c1]{color:var(--theme-error-500);flex-shrink:0}.input-field__control[data-v-1ce017c1]{width:100%;min-height:var(--field-height);padding:var(--field-padding-y) var(--field-padding-x);background-color:var(--theme-neutral-0);border:.0625rem solid var(--field-border-color);border-radius:var(--field-radius);transition:border-color var(--animation-duration-fast) ease;align-items:center;display:flex}.input-field__field[data-v-1ce017c1]{width:100%;min-width:0;font-family:inherit;font-weight:400;font-size:var(--field-font-size);line-height:var(--field-line-height);color:var(--field-text-color);background-color:#0000;border:none;outline:none;flex:auto}@media (max-width:1009.98px){.input-field__field[data-v-1ce017c1]{font-size:1rem}}.input-field__field[data-v-1ce017c1]::placeholder{color:var(--field-placeholder-color)}.input-field__field[data-v-1ce017c1]:disabled{cursor:not-allowed;-webkit-text-fill-color:var(--field-text-color);opacity:1}.input-field__field--multiline[data-v-1ce017c1]{resize:vertical;min-height:var(--field-line-height);padding:0;display:block;overflow:auto}.input-field__icon[data-v-1ce017c1]{width:1.375rem;height:1.125rem;color:var(--field-icon-color);flex-shrink:0;align-items:center;gap:.25rem;display:flex}.input-field__icon[data-v-1ce017c1] svg{width:var(--field-icon-size);height:var(--field-icon-size)}.input-field__icon--left[data-v-1ce017c1]{justify-content:flex-start}.input-field__icon--right[data-v-1ce017c1]{justify-content:flex-end;width:auto;min-width:1.375rem}.input-field__action[data-v-1ce017c1]{cursor:pointer;color:inherit;transition:color var(--animation-duration-fast) ease;background-color:#0000;border:none;justify-content:center;align-items:center;padding:0;display:flex}.input-field__action[data-v-1ce017c1]:hover:not(:disabled){color:var(--theme-primary-500)}.input-field__action[data-v-1ce017c1]:disabled{cursor:not-allowed}.input-field__action[data-v-1ce017c1]:focus-visible{outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem;border-radius:.25rem}.input-field__footer[data-v-1ce017c1]{pointer-events:none;justify-content:center;align-items:center;gap:.625rem;padding:.25rem .6875rem .25rem .5rem;display:flex;position:absolute;top:100%;left:0;right:0}.input-field__support[data-v-1ce017c1]{min-width:0;color:var(--field-support-color);overflow-wrap:break-word;flex:auto;font-size:.625rem;font-weight:400;line-height:normal}.input-field__counter[data-v-1ce017c1]{text-align:right;white-space:nowrap;color:var(--theme-neutral-550);flex-shrink:0;margin-left:auto;font-size:.625rem;font-weight:400;line-height:normal}.input-field--size-small[data-v-1ce017c1]{--field-height:2.25rem;--field-label-font-size:.75rem;--field-chip-padding-x:.5rem;--field-chip-font-size:.75rem;--field-chip-icon-size:.875rem}.input-field--size-large[data-v-1ce017c1]{--field-height:2.75rem;--field-radius:.75rem;--field-padding-y:.5rem;--field-font-size:1rem;--field-line-height:1.5rem;--field-label-font-size:1rem;--field-label-line-height:1.25rem;--field-icon-size:1.125rem;--field-chip-padding-x:1rem}.input-field--with-control-start[data-v-1ce017c1]{--field-padding-x:.25rem;--field-padding-y:.25rem}.input-field--with-control-start .input-field__control[data-v-1ce017c1]{gap:.5rem;padding-right:.75rem}.input-field--type-limit[data-v-1ce017c1]{--field-padding-y:.5rem}.input-field--type-limit .input-field__control[data-v-1ce017c1]{align-items:stretch}.input-field--type-limit .input-field__icon[data-v-1ce017c1]{align-items:flex-end}.input-field:not(.input-field--error):not(.input-field--disabled) .input-field__control[data-v-1ce017c1]:hover{--field-border-color:var(--theme-primary-300)}.input-field:not(.input-field--error):not(.input-field--disabled) .input-field__control[data-v-1ce017c1]:focus-within{--field-border-color:var(--theme-primary-500)}.input-field--error[data-v-1ce017c1]{--field-border-color:var(--theme-error-500);--field-label-color:var(--theme-error-500);--field-support-color:var(--theme-error-500)}.input-field--disabled[data-v-1ce017c1]{--field-border-color:var(--theme-neutral-border-disabled);--field-text-color:var(--theme-neutral-400);--field-placeholder-color:var(--theme-neutral-400);--field-label-color:var(--theme-neutral-400);--field-support-color:var(--theme-neutral-400);--field-icon-color:var(--theme-neutral-400)}.input-field--disabled .input-field__control[data-v-1ce017c1]{cursor:not-allowed}
+.input-field[data-v-b6defdd2]{--field-height:2.5rem;--field-radius:.5rem;--field-padding-x:.5rem;--field-padding-y:.25rem;--field-font-size:.875rem;--field-line-height:1.25rem;--field-label-font-size:.875rem;--field-label-line-height:1rem;--field-icon-size:1rem;--field-chip-padding-x:.75rem;--field-chip-font-size:.875rem;--field-chip-icon-size:1rem;--field-border-color:var(--theme-neutral-border-default);--field-text-color:var(--theme-neutral-text-body);--field-placeholder-color:var(--theme-neutral-550);--field-label-color:var(--theme-neutral-text-title);--field-support-color:var(--theme-neutral-text-caption);--field-icon-color:var(--theme-neutral-icon-caption);flex-direction:column;justify-content:center;align-items:flex-start;width:100%;display:flex;position:relative}.input-field__label[data-v-b6defdd2]{width:100%;font-weight:400;font-size:var(--field-label-font-size);line-height:var(--field-label-line-height);color:var(--field-label-color);overflow-wrap:break-word;align-items:center;gap:.125rem;padding:.375rem .6875rem .375rem .5rem;display:flex}.input-field__required[data-v-b6defdd2]{color:var(--theme-error-500);flex-shrink:0}.input-field__control[data-v-b6defdd2]{width:100%;min-height:var(--field-height);padding:var(--field-padding-y) var(--field-padding-x);background-color:var(--theme-neutral-0);border:.0625rem solid var(--field-border-color);border-radius:var(--field-radius);transition:border-color var(--animation-duration-fast) ease;align-items:center;display:flex}.input-field__field[data-v-b6defdd2]{width:100%;min-width:0;font-family:inherit;font-weight:400;font-size:var(--field-font-size);line-height:var(--field-line-height);color:var(--field-text-color);background-color:#0000;border:none;outline:none;flex:auto}@media (max-width:1009.98px){.input-field__field[data-v-b6defdd2]{font-size:1rem}}.input-field__field[data-v-b6defdd2]::placeholder{color:var(--field-placeholder-color)}.input-field__field[data-v-b6defdd2]:disabled{cursor:not-allowed;-webkit-text-fill-color:var(--field-text-color);opacity:1}.input-field__field--multiline[data-v-b6defdd2]{resize:vertical;min-height:var(--field-line-height);padding:0;display:block;overflow:auto}.input-field__icon[data-v-b6defdd2]{width:1.375rem;height:1.125rem;color:var(--field-icon-color);flex-shrink:0;align-items:center;gap:.25rem;display:flex}.input-field__icon[data-v-b6defdd2] svg{width:var(--field-icon-size);height:var(--field-icon-size)}.input-field__icon--left[data-v-b6defdd2]{justify-content:flex-start}.input-field__icon--right[data-v-b6defdd2]{justify-content:flex-end;width:auto;min-width:1.375rem}.input-field__action[data-v-b6defdd2]{cursor:pointer;color:inherit;transition:color var(--animation-duration-fast) ease;background-color:#0000;border:none;justify-content:center;align-items:center;padding:0;display:flex}.input-field__action[data-v-b6defdd2]:hover:not(:disabled){color:var(--theme-primary-500)}.input-field__action[data-v-b6defdd2]:disabled{cursor:not-allowed}.input-field__action[data-v-b6defdd2]:focus-visible{outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem;border-radius:.25rem}.input-field__footer[data-v-b6defdd2]{pointer-events:none;justify-content:center;align-items:center;gap:.625rem;padding:.25rem .6875rem .25rem .5rem;display:flex;position:absolute;top:100%;left:0;right:0}.input-field__support[data-v-b6defdd2]{min-width:0;color:var(--field-support-color);overflow-wrap:break-word;flex:auto;font-size:.625rem;font-weight:400;line-height:normal}.input-field__counter[data-v-b6defdd2]{text-align:right;white-space:nowrap;color:var(--theme-neutral-550);flex-shrink:0;margin-left:auto;font-size:.625rem;font-weight:400;line-height:normal}.input-field--size-small[data-v-b6defdd2]{--field-height:2.25rem;--field-label-font-size:.75rem;--field-chip-padding-x:.5rem;--field-chip-font-size:.75rem;--field-chip-icon-size:.875rem}.input-field--size-large[data-v-b6defdd2]{--field-height:2.75rem;--field-radius:.75rem;--field-padding-y:.5rem;--field-font-size:1rem;--field-line-height:1.5rem;--field-label-font-size:1rem;--field-label-line-height:1.25rem;--field-icon-size:1.125rem;--field-chip-padding-x:1rem}.input-field--with-control-start[data-v-b6defdd2]{--field-padding-x:.25rem;--field-padding-y:.25rem}.input-field--with-control-start .input-field__control[data-v-b6defdd2]{gap:.5rem;padding-right:.75rem}.input-field--type-limit[data-v-b6defdd2]{--field-padding-y:.5rem}.input-field--type-limit .input-field__control[data-v-b6defdd2]{align-items:stretch}.input-field--type-limit .input-field__icon[data-v-b6defdd2]{align-items:flex-end}.input-field:not(.input-field--error):not(.input-field--disabled) .input-field__control[data-v-b6defdd2]:hover{--field-border-color:var(--theme-primary-300)}.input-field:not(.input-field--error):not(.input-field--disabled) .input-field__control[data-v-b6defdd2]:focus-within{--field-border-color:var(--theme-primary-500)}.input-field--error[data-v-b6defdd2]{--field-border-color:var(--theme-error-500);--field-label-color:var(--theme-error-500);--field-support-color:var(--theme-error-500)}.input-field--disabled[data-v-b6defdd2]{--field-border-color:var(--theme-neutral-border-disabled);--field-text-color:var(--theme-neutral-400);--field-placeholder-color:var(--theme-neutral-400);--field-label-color:var(--theme-neutral-400);--field-support-color:var(--theme-neutral-400);--field-icon-color:var(--theme-neutral-400)}.input-field--disabled .input-field__control[data-v-b6defdd2]{cursor:not-allowed}

package/dist/components/v2/Input/Input.vue.js

@@ -2,7 +2,7 @@ import './Input.css';
 import o from "./Input.vue2.js";
 /* empty css           */
 import t from "../../../_virtual/_plugin-vue_export-helper.js";
-const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-1ce017c1"]]);
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-b6defdd2"]]);
 export {
-  m as default
+  f as default
 };