@profitliga/ui 1.2.89 → 2.0.0

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

@@ -0,0 +1,152 @@
+import { defineComponent as P, useModel as U, useSlots as X, useId as j, useTemplateRef as G, computed as t, onMounted as J, watch as K, nextTick as O, openBlock as n, createElementBlock as f, mergeProps as s, unref as i, renderSlot as T, createTextVNode as $, toDisplayString as b, createCommentVNode as c, createElementVNode as q, withDirectives as Q, vModelText as W, createVNode as Z, mergeModels as I } from "vue";
+import { X as _ } from "@lucide/vue";
+import { useTestId as ee } from "../shared/useTestId.util.js";
+const te = ["for"], ae = ["id", "name", "rows", "placeholder", "disabled", "readonly", "required", "maxlength", "aria-label", "aria-invalid", "aria-describedby"], le = ["aria-label"], oe = {
+  key: 1,
+  class: "textarea-field__footer"
+}, re = ["id"], ue = /* @__PURE__ */ P({
+  inheritAttrs: !1,
+  __name: "Textarea",
+  props: /* @__PURE__ */ I({
+    size: { default: "default" },
+    label: { default: void 0 },
+    ariaLabel: { default: void 0 },
+    supportText: { default: void 0 },
+    errorMessage: { default: void 0 },
+    error: { type: Boolean, default: !1 },
+    placeholder: { default: void 0 },
+    disabled: { type: Boolean, default: !1 },
+    readonly: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    maxlength: { default: void 0 },
+    showCount: { type: Boolean, default: void 0 },
+    rows: { default: 3 },
+    resize: { default: "vertical" },
+    autosize: { type: Boolean, default: !1 },
+    maxHeight: { default: void 0 },
+    clearable: { type: Boolean, default: !1 },
+    name: { default: void 0 },
+    id: { default: void 0 },
+    testId: { default: void 0 }
+  }, {
+    modelValue: { default: "" },
+    modelModifiers: {}
+  }),
+  emits: /* @__PURE__ */ I(["input", "change", "focus", "blur", "clear"], ["update:modelValue"]),
+  setup(l, { expose: L, emit: R }) {
+    const e = l, v = R, m = U(l, "modelValue"), x = X(), d = ee(() => e.testId), y = j(), u = G("fieldRef"), g = t(() => e.id ?? `${y}-field`), z = t(() => `${y}-support`), h = t(() => e.error), w = t(() => h.value ? e.errorMessage ?? e.supportText : e.supportText), B = t(() => m.value?.length ?? 0), k = t(() => !!(e.label || x.label)), S = t(() => k.value ? e.ariaLabel : e.ariaLabel ?? e.placeholder), C = t(
+      () => e.clearable && B.value > 0 && !e.disabled && !e.readonly
+    ), V = t(() => e.maxlength === void 0 ? !1 : e.showCount ?? !0), p = t(
+      () => !!(w.value || x.support)
+    ), N = t(() => p.value || V.value), E = t(
+      () => p.value ? z.value : void 0
+    ), F = t(() => "Очистить поле"), A = t(() => e.autosize ? "none" : e.resize), D = t(() => [
+      "textarea-field",
+      `textarea-field--size-${e.size}`,
+      `textarea-field--resize-${A.value}`,
+      {
+        "textarea-field--error": h.value,
+        "textarea-field--disabled": e.disabled,
+        "textarea-field--readonly": e.readonly,
+        "textarea-field--autosize": e.autosize,
+        "textarea-field--clearable": C.value
+      }
+    ]), H = () => {
+      const o = u.value;
+      if (!o) return;
+      if (!e.autosize) {
+        o.style.height = "", o.style.overflowY = "";
+        return;
+      }
+      o.style.height = "auto";
+      const r = parseFloat(getComputedStyle(o).lineHeight) || 0, a = Math.max(o.scrollHeight, r * e.rows), M = e.maxHeight ? Math.min(a, e.maxHeight) : a;
+      o.style.height = `${M}px`, o.style.overflowY = a > M ? "auto" : "hidden";
+    };
+    J(H), K(
+      () => [
+        m.value,
+        e.autosize,
+        e.rows,
+        e.maxHeight,
+        e.size
+      ],
+      () => O(H)
+    );
+    const Y = () => {
+      e.disabled || e.readonly || (m.value = "", v("clear"), u.value?.focus());
+    };
+    return L({
+      el: u,
+      focus: () => u.value?.focus(),
+      blur: () => u.value?.blur(),
+      select: () => u.value?.select()
+    }), (o, r) => (n(), f("div", s({ class: D.value }, i(d)("root")), [
+      k.value ? (n(), f("label", s({
+        key: 0,
+        class: "textarea-field__label",
+        for: g.value
+      }, i(d)("label")), [
+        T(o.$slots, "label", {}, () => [
+          $(b(l.label), 1)
+        ], !0),
+        l.required ? (n(), f("span", s({
+          key: 0,
+          class: "textarea-field__required",
+          "aria-hidden": "true"
+        }, i(d)("required")), "*", 16)) : c("", !0)
+      ], 16, te)) : c("", !0),
+      q("div", s({ class: "textarea-field__control" }, i(d)("control")), [
+        Q(q("textarea", s({
+          id: g.value,
+          ref_key: "fieldRef",
+          ref: u,
+          "onUpdate:modelValue": r[0] || (r[0] = (a) => m.value = a),
+          class: "textarea-field__field",
+          name: l.name,
+          rows: l.rows,
+          placeholder: l.placeholder,
+          disabled: l.disabled,
+          readonly: l.readonly,
+          required: l.required,
+          maxlength: l.maxlength,
+          "aria-label": S.value,
+          "aria-invalid": h.value || void 0,
+          "aria-describedby": E.value
+        }, o.$attrs, {
+          onInput: r[1] || (r[1] = (a) => v("input", a)),
+          onChange: r[2] || (r[2] = (a) => v("change", a)),
+          onFocus: r[3] || (r[3] = (a) => v("focus", a)),
+          onBlur: r[4] || (r[4] = (a) => v("blur", a))
+        }), null, 16, ae), [
+          [W, m.value]
+        ]),
+        C.value ? (n(), f("button", s({
+          key: 0,
+          type: "button",
+          class: "textarea-field__action",
+          "aria-label": F.value
+        }, i(d)("clear"), { onClick: Y }), [
+          Z(i(_), { "stroke-width": 2 })
+        ], 16, le)) : c("", !0)
+      ], 16),
+      N.value ? (n(), f("div", oe, [
+        p.value ? (n(), f("p", s({
+          key: 0,
+          id: z.value,
+          class: "textarea-field__support"
+        }, i(d)("support")), [
+          T(o.$slots, "support", {}, () => [
+            $(b(w.value), 1)
+          ], !0)
+        ], 16, re)) : c("", !0),
+        V.value ? (n(), f("p", s({
+          key: 1,
+          class: "textarea-field__counter"
+        }, i(d)("counter")), b(B.value) + " / " + b(l.maxlength), 17)) : c("", !0)
+      ])) : c("", !0)
+    ], 16));
+  }
+});
+export {
+  ue as default
+};

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

@@ -0,0 +1,3 @@
+import { default as Textarea } from './Textarea.vue';
+export type { TextareaExpose, TextareaProps, TextareaResize, TextareaSize } from './Textarea.types';
+export { Textarea };

package/dist/components/v2/Toast/Toast.css

@@ -0,0 +1 @@
+.toast[data-v-e57a8866]{--toast-bg-color:transparent;--toast-icon-bg:transparent;--toast-icon-shadow:transparent;background-color:var(--toast-bg-color);width:100%;transition:transform var(--animation-duration) ease, opacity var(--animation-duration) ease;border-radius:.5rem;justify-content:flex-start;align-items:flex-start;gap:.5rem;padding:.75rem;display:flex;box-shadow:-.0625rem .0625rem .625rem #8d8f9340}.toast--dragging[data-v-e57a8866]{cursor:grabbing;-webkit-user-select:none;user-select:none;transition:none}.toast--swiping-out[data-v-e57a8866]{pointer-events:none}.toast__icon[data-v-e57a8866]{background-color:var(--toast-icon-bg);width:1.5rem;height:1.5rem;color:var(--theme-neutral-0);box-shadow:-.0341rem .0341rem .3409rem 0 var(--toast-icon-shadow);opacity:.7;border-radius:.4091rem;flex-shrink:0;justify-content:center;align-items:center;padding:.2727rem;display:flex;overflow:hidden}.toast__icon[data-v-e57a8866] svg{width:.9546rem;height:.9546rem}.toast__content[data-v-e57a8866]{flex-direction:column;flex:auto;justify-content:flex-start;align-items:flex-start;gap:.25rem;min-width:0;display:flex}.toast__header[data-v-e57a8866]{justify-content:flex-start;align-items:flex-start;gap:.75rem;width:100%;display:flex}.toast__title[data-v-e57a8866]{min-width:0;color:var(--theme-neutral-text-title);overflow-wrap:break-word;flex:auto;font-size:1.125rem;font-weight:500;line-height:1.5rem}.toast__close[data-v-e57a8866]{cursor:pointer;width:1.5rem;height:1.5rem;color:var(--theme-neutral-text-caption);transition:color var(--animation-duration) ease-in-out;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}.toast__close[data-v-e57a8866]:focus-visible{outline:2px solid var(--theme-primary-500);outline-offset:2px}.toast__close[data-v-e57a8866]:hover{color:var(--theme-neutral-text-title)}.toast__close[data-v-e57a8866] svg{width:100%;height:100%}.toast__description[data-v-e57a8866]{width:100%;color:var(--theme-neutral-text-body);overflow-wrap:break-word;font-size:.875rem;font-weight:400;line-height:1.25rem}.toast--info[data-v-e57a8866]{--toast-bg-color:var(--theme-info-100);--toast-icon-bg:var(--theme-info-600);--toast-icon-shadow:#02538fb3}.toast--success[data-v-e57a8866]{--toast-bg-color:var(--theme-primary-100);--toast-icon-bg:var(--theme-primary-600);--toast-icon-shadow:#008925b3}.toast--warning[data-v-e57a8866]{--toast-bg-color:var(--theme-warn-100);--toast-icon-bg:var(--theme-warn-600);--toast-icon-shadow:#d47d16b3}.toast--error[data-v-e57a8866]{--toast-bg-color:var(--theme-error-100);--toast-icon-bg:var(--theme-error-600);--toast-icon-shadow:#bd2429b3}

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

@@ -0,0 +1,67 @@
+import { TBreakpoints } from '../../../types/global.types';
+export type ToastVariant = 'info' | 'success' | 'warning' | 'error';
+export type ToastPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
+/** Направление свайпа, которым тост закрывается. `none` — свайп отключён. */
+export type ToastSwipeDirection = 'left' | 'right' | 'up' | 'down' | 'none';
+export interface ToastProps {
+    /** Смысловой вариант — цветовая схема и иконка. */
+    variant?: ToastVariant;
+    /** Заголовок. Можно заменить слотом `title`. */
+    title?: string;
+    /** Описание. Можно заменить слотом по умолчанию. */
+    description?: string;
+    /** Кнопка закрытия справа от заголовка. */
+    closable?: boolean;
+    /** Направление свайпа для закрытия. */
+    swipeDirection?: ToastSwipeDirection;
+    /** Доступное имя кнопки закрытия (у неё нет видимого текста). */
+    closeLabel?: string;
+    /** Базовый `data-testid`; внутренние части получают суффикс имени части. */
+    testId?: string;
+}
+export interface ToastEmits {
+    close: [];
+}
+/** Параметры одного тоста при вызове `toast()`. */
+export interface ToastOptions {
+    variant?: ToastVariant;
+    title?: string;
+    description?: string;
+    /** Время до автозакрытия в мс. `0` — не закрывать автоматически. */
+    duration?: number;
+    closable?: boolean;
+}
+/** Тост в очереди — те же параметры, но с заполненными значениями по умолчанию. */
+export interface ToastItem {
+    id: string;
+    variant: ToastVariant;
+    title: string;
+    description?: string;
+    duration: number;
+    closable: boolean;
+}
+/** Результат вызова `toast()` — позволяет закрыть или обновить конкретный тост. */
+export interface ToastHandle {
+    id: string;
+    dismiss: () => void;
+    update: (options: ToastOptions) => void;
+}
+export interface ToasterProps {
+    /** Угол экрана, в котором показывается стек тостов. */
+    position?: ToastPosition;
+    /** Отступ вьюпорта от краёв экрана в пикселях (десктоп). */
+    offset?: number;
+    /** Максимум одновременно показываемых тостов — лишние вытесняются. */
+    limit?: number;
+    zIndex?: number;
+    /** Брейкпоинт, ниже которого стек занимает всю ширину экрана. */
+    breakpointMobile?: TBreakpoints;
+    /** Направление свайпа. По умолчанию выводится из `position`. */
+    swipeDirection?: ToastSwipeDirection;
+    /** Доступное имя области с уведомлениями (`aria-label`). */
+    label?: string;
+    /** Доступное имя кнопки закрытия у каждого тоста. */
+    closeLabel?: string;
+    /** Базовый `data-testid`; внутренние части получают суффикс имени части. */
+    testId?: string;
+}

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

@@ -0,0 +1,37 @@
+import { ToastProps, ToastVariant, ToastSwipeDirection } from './Toast.types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        icon?(_: {}): any;
+        title?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {
+        rootRef: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<ToastProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    close: () => any;
+}, string, PublicProps, Readonly<ToastProps> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {
+    title: string;
+    variant: ToastVariant;
+    description: string;
+    swipeDirection: ToastSwipeDirection;
+    testId: string;
+    closable: boolean;
+    closeLabel: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+    rootRef: HTMLDivElement;
+}, HTMLDivElement>;
+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/Toast/Toast.vue.js

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

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

@@ -0,0 +1,146 @@
+import { defineComponent as K, useSlots as j, computed as n, useTemplateRef as q, ref as D, onBeforeUnmount as z, openBlock as d, createElementBlock as m, mergeProps as f, unref as r, createElementVNode as S, renderSlot as T, createBlock as J, resolveDynamicComponent as Q, createTextVNode as A, toDisplayString as B, createVNode as Z, createCommentVNode as y } from "vue";
+import { Ban as ee, CircleAlert as te, CircleCheck as oe, Info as ie, X as ne } from "@lucide/vue";
+import { DRAG_CLOSE_DURATION_MS as L } from "../shared/animation.const.js";
+import { useTestId as ae } from "../shared/useTestId.util.js";
+const se = ["role", "aria-live"], re = { class: "toast__content" }, le = {
+  key: 0,
+  class: "toast__header"
+}, ce = ["aria-label"], ue = 6, O = 32, de = 0.25, fe = 24, he = /* @__PURE__ */ K({
+  __name: "Toast",
+  props: {
+    variant: { default: "info" },
+    title: { default: void 0 },
+    description: { default: void 0 },
+    closable: { type: Boolean, default: !0 },
+    swipeDirection: { default: "right" },
+    closeLabel: { default: "Закрыть уведомление" },
+    testId: { default: void 0 }
+  },
+  emits: ["close"],
+  setup(a, { emit: X }) {
+    const t = a, g = X, C = j(), l = ae(() => t.testId), M = {
+      info: ie,
+      success: oe,
+      warning: te,
+      error: ee
+    }, $ = n(() => !!(t.title || C.title)), H = n(
+      () => !!(t.description || C.default)
+    ), P = n(
+      () => t.variant === "warning" || t.variant === "error"
+    ), N = n(() => P.value ? "alert" : "status"), V = n(() => P.value ? "assertive" : "polite"), s = n(() => t.swipeDirection === "none" ? null : t.swipeDirection === "up" || t.swipeDirection === "down" ? "y" : "x"), b = n(
+      () => t.swipeDirection === "right" || t.swipeDirection === "down" ? 1 : -1
+    ), E = q("rootRef"), v = D(!1), o = D(0), c = D(!1);
+    let p = !1, I = 0, k = 0, x, h = 0, w = 0, _ = 0;
+    function Y(e) {
+      !s.value || c.value || e.pointerType === "mouse" && e.button !== 0 || e.target.closest("button, a") || (p = !0, I = e.clientX, k = e.clientY, h = e.timeStamp, w = 0, _ = 0, e.currentTarget.setPointerCapture(e.pointerId));
+    }
+    function W(e) {
+      if (!p || !s.value) return;
+      const i = s.value === "x" ? e.clientX - I : e.clientY - k;
+      if (!v.value) {
+        if (Math.abs(i) < ue) return;
+        v.value = !0;
+      }
+      o.value = Math.max(0, i * b.value);
+      const u = e.timeStamp - h;
+      u > 0 && (_ = (o.value - w) / u, h = e.timeStamp, w = o.value);
+    }
+    function G() {
+      const e = E.value?.getBoundingClientRect();
+      if (!e) return 0;
+      const i = t.swipeDirection === "up" ? e.bottom : t.swipeDirection === "down" ? window.innerHeight - e.top : t.swipeDirection === "left" ? e.right : window.innerWidth - e.left;
+      return Math.max(0, i + fe);
+    }
+    function R() {
+      if (!p) return;
+      p = !1, v.value = !1;
+      const e = o.value > 0 && _ >= de;
+      if (!(o.value >= O || e)) {
+        o.value = 0;
+        return;
+      }
+      if (window.matchMedia?.("(prefers-reduced-motion: reduce)").matches) {
+        o.value = 0, g("close");
+        return;
+      }
+      o.value += G(), c.value = !0, x = setTimeout(() => g("close"), L);
+    }
+    z(() => clearTimeout(x));
+    const U = n(() => [
+      "toast",
+      `toast--${t.variant}`,
+      {
+        "toast--dragging": v.value,
+        "toast--swiping-out": c.value
+      }
+    ]), F = n(() => {
+      const e = s.value === "x" ? "pan-y" : s.value === "y" ? "pan-x" : void 0;
+      if (!o.value) return { touchAction: e };
+      const i = o.value * b.value, u = Math.min(1, o.value / O);
+      return {
+        touchAction: e,
+        transform: s.value === "x" ? `translateX(${i}px)` : `translateY(${i}px)`,
+        /* На уходе гасим полностью — за краем всё равно, но так мягче. */
+        opacity: c.value ? "0" : String(1 - u * 0.5),
+        /*
+         * Длительность задаётся отсюда, а не из CSS: по ней же заводится
+         * таймер на `close`, и разъезжаться этим двум значениям нельзя.
+         */
+        ...c.value ? { transitionDuration: `${L}ms` } : {}
+      };
+    });
+    return (e, i) => (d(), m("div", f({
+      ref_key: "rootRef",
+      ref: E,
+      class: U.value,
+      role: N.value,
+      "aria-live": V.value,
+      "aria-atomic": "true",
+      style: F.value
+    }, r(l)("toast"), {
+      onPointerdown: Y,
+      onPointermove: W,
+      onPointerup: R,
+      onPointercancel: R
+    }), [
+      S("div", f({
+        class: "toast__icon",
+        "aria-hidden": "true"
+      }, r(l)("icon")), [
+        T(e.$slots, "icon", {}, () => [
+          (d(), J(Q(M[a.variant]), { "stroke-width": 2 }))
+        ], !0)
+      ], 16),
+      S("div", re, [
+        $.value || a.closable ? (d(), m("div", le, [
+          S("p", f({ class: "toast__title" }, r(l)("title")), [
+            T(e.$slots, "title", {}, () => [
+              A(B(a.title), 1)
+            ], !0)
+          ], 16),
+          a.closable ? (d(), m("button", f({
+            key: 0,
+            type: "button",
+            class: "toast__close",
+            "aria-label": a.closeLabel
+          }, r(l)("close"), {
+            onClick: i[0] || (i[0] = (u) => g("close"))
+          }), [
+            Z(r(ne))
+          ], 16, ce)) : y("", !0)
+        ])) : y("", !0),
+        H.value ? (d(), m("p", f({
+          key: 1,
+          class: "toast__description"
+        }, r(l)("description")), [
+          T(e.$slots, "default", {}, () => [
+            A(B(a.description), 1)
+          ], !0)
+        ], 16)) : y("", !0)
+      ])
+    ], 16, se));
+  }
+});
+export {
+  he as default
+};

package/dist/components/v2/Toast/Toaster.css

@@ -0,0 +1 @@
+.toaster[data-v-6890b6d4]{width:23.75rem;max-width:calc(100vw - var(--toaster-offset) * 2);z-index:var(--toaster-z-index);pointer-events:none;flex-direction:column;gap:.5rem;display:flex;position:fixed}.toaster[data-v-6890b6d4]>*{pointer-events:auto}.toaster--top[data-v-6890b6d4]{top:var(--toaster-offset)}.toaster--bottom[data-v-6890b6d4]{bottom:var(--toaster-offset);flex-direction:column-reverse}.toaster--left[data-v-6890b6d4]{left:var(--toaster-offset)}.toaster--right[data-v-6890b6d4]{right:var(--toaster-offset)}.toaster--center[data-v-6890b6d4]{left:50%;transform:translate(-50%)}.toaster--mobile[data-v-6890b6d4]{width:auto;max-width:none;left:var(--toaster-offset);right:var(--toaster-offset);transform:none}.toast-enter-from[data-v-6890b6d4],.toast-leave-to[data-v-6890b6d4]{opacity:0;transform:var(--toaster-slide)}.toast-enter-active[data-v-6890b6d4],.toast-leave-active[data-v-6890b6d4],.toast-move[data-v-6890b6d4]{transition:transform var(--animation-duration) ease, opacity var(--animation-duration) ease}.toast-leave-active[data-v-6890b6d4]{width:100%;position:absolute}

package/dist/components/v2/Toast/Toaster.vue.d.ts

@@ -0,0 +1,15 @@
+import { ToasterProps, ToastSwipeDirection, ToastPosition } from './Toast.types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { TBreakpoints } from '../../../types/global.types';
+declare const _default: DefineComponent<ToasterProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ToasterProps> & Readonly<{}>, {
+    label: string;
+    offset: number;
+    position: ToastPosition;
+    zIndex: number;
+    breakpointMobile: TBreakpoints;
+    swipeDirection: ToastSwipeDirection;
+    testId: string;
+    limit: number;
+    closeLabel: string;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/v2/Toast/Toaster.vue.js

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

package/dist/components/v2/Toast/Toaster.vue2.js

@@ -0,0 +1,96 @@
+import { defineComponent as S, ref as x, computed as o, onMounted as y, onBeforeUnmount as L, watch as C, openBlock as i, createBlock as b, withCtx as T, createElementBlock as w, mergeProps as B, unref as a, createVNode as D, TransitionGroup as z, Fragment as E, renderList as Y, createCommentVNode as O } from "vue";
+import { breakpoints as P } from "../../../utils/breakpoints.util.js";
+import W from "../shared/Portal.vue.js";
+import { useTestId as X } from "../shared/useTestId.util.js";
+import A from "./Toast.vue.js";
+import { TOAST_DEFAULT_LIMIT as N, useToast as U } from "./useToast.js";
+const V = ["aria-label"], G = 10, Z = /* @__PURE__ */ S({
+  __name: "Toaster",
+  props: {
+    position: { default: "top-right" },
+    offset: { default: 24 },
+    limit: { default: N },
+    zIndex: { default: 9999 },
+    breakpointMobile: { default: "sm" },
+    swipeDirection: { default: void 0 },
+    label: { default: "Уведомления" },
+    closeLabel: { default: void 0 },
+    testId: { default: void 0 }
+  },
+  setup(r) {
+    const s = x([]), t = r, { toasts: h, dismiss: M, pause: f, resume: v, setLimit: _ } = U(), g = X(() => t.testId), l = /* @__PURE__ */ Symbol("toaster"), I = o(
+      () => s.value[0] === l
+    );
+    y(() => {
+      s.value = [...s.value, l], s.value.length > 1 && console.warn(
+        "[Toaster] Смонтировано несколько Toaster — очередь тостов общая, поэтому лишние экземпляры не отрисовываются. Оставьте один Toaster на приложение."
+      );
+    }), L(() => {
+      s.value = s.value.filter(
+        (m) => m !== l
+      );
+    });
+    const u = P.smaller(t.breakpointMobile), c = o(
+      () => t.position.startsWith("bottom") ? "bottom" : "top"
+    ), d = o(() => t.position.endsWith("left") ? "left" : t.position.endsWith("center") ? "center" : "right"), p = o(() => t.swipeDirection ? t.swipeDirection : u.value || d.value === "center" ? c.value === "top" ? "up" : "down" : d.value === "left" ? "left" : "right"), $ = o(() => {
+      switch (p.value) {
+        case "right":
+          return "translateX(120%)";
+        case "left":
+          return "translateX(-120%)";
+        case "down":
+          return "translateY(120%)";
+        case "up":
+          return "translateY(-120%)";
+        default:
+          return c.value === "top" ? "translateY(-120%)" : "translateY(120%)";
+      }
+    }), k = o(() => [
+      "toaster",
+      `toaster--${c.value}`,
+      `toaster--${d.value}`,
+      { "toaster--mobile": u.value }
+    ]), F = o(() => ({
+      "--toaster-offset": `${u.value ? G : t.offset}px`,
+      "--toaster-z-index": String(t.zIndex),
+      "--toaster-slide": $.value
+    }));
+    return C(() => t.limit, _, { immediate: !0 }), (m, K) => (i(), b(W, null, {
+      default: T(() => [
+        I.value ? (i(), w("div", B({
+          key: 0,
+          class: k.value,
+          style: F.value,
+          role: "region",
+          "aria-label": r.label
+        }, a(g)("viewport")), [
+          D(z, { name: "toast" }, {
+            default: T(() => [
+              (i(!0), w(E, null, Y(a(h), (e) => (i(), b(A, {
+                key: e.id,
+                variant: e.variant,
+                title: e.title,
+                description: e.description,
+                closable: e.closable,
+                "swipe-direction": p.value,
+                "close-label": r.closeLabel,
+                "test-id": r.testId,
+                "data-toast-id": e.id,
+                onMouseenter: (n) => a(f)(e.id),
+                onMouseleave: (n) => a(v)(e.id),
+                onFocusin: (n) => a(f)(e.id),
+                onFocusout: (n) => a(v)(e.id),
+                onClose: (n) => a(M)(e.id)
+              }, null, 8, ["variant", "title", "description", "closable", "swipe-direction", "close-label", "test-id", "data-toast-id", "onMouseenter", "onMouseleave", "onFocusin", "onFocusout", "onClose"]))), 128))
+            ]),
+            _: 1
+          })
+        ], 16, V)) : O("", !0)
+      ]),
+      _: 1
+    }));
+  }
+});
+export {
+  Z as default
+};

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

@@ -0,0 +1,5 @@
+import { default as Toast } from './Toast.vue';
+import { default as Toaster } from './Toaster.vue';
+export type { ToastEmits, ToastHandle, ToastItem, ToastOptions, ToastPosition, ToastProps, ToastSwipeDirection, ToastVariant, ToasterProps } from './Toast.types';
+export { TOAST_DEFAULT_DURATION_MS, TOAST_DEFAULT_LIMIT, toast, useToast } from './useToast';
+export { Toast, Toaster };

package/dist/components/v2/Toast/useToast.d.ts

@@ -0,0 +1,46 @@
+import { ToastHandle, ToastOptions, ToastVariant } from './Toast.types';
+import { ComputedRef } from 'vue';
+export declare const TOAST_DEFAULT_DURATION_MS = 5000;
+export declare const TOAST_DEFAULT_LIMIT = 3;
+/**
+ * Останавливает отсчёт автозакрытия — вызывается при наведении и фокусе,
+ * чтобы тост не исчез, пока пользователь его читает или взаимодействует с ним.
+ */
+declare function pause(id: string): void;
+declare function resume(id: string): void;
+declare function dismiss(id: string): void;
+declare function dismissAll(): void;
+declare function setLimit(value: number): void;
+declare function createToast(options?: ToastOptions): ToastHandle;
+/**
+ * Показывает тост. Варианты доступны как сокращения:
+ * `toast.success({ title: 'Готово' })`.
+ */
+export declare const toast: typeof createToast & {
+    info: (options?: ToastOptions) => ToastHandle;
+    success: (options?: ToastOptions) => ToastHandle;
+    warning: (options?: ToastOptions) => ToastHandle;
+    error: (options?: ToastOptions) => ToastHandle;
+};
+export declare function useToast(): {
+    toasts: ComputedRef<{
+        id: string;
+        variant: ToastVariant;
+        title: string;
+        description?: string | undefined;
+        duration: number;
+        closable: boolean;
+    }[]>;
+    toast: typeof createToast & {
+        info: (options?: ToastOptions) => ToastHandle;
+        success: (options?: ToastOptions) => ToastHandle;
+        warning: (options?: ToastOptions) => ToastHandle;
+        error: (options?: ToastOptions) => ToastHandle;
+    };
+    dismiss: typeof dismiss;
+    dismissAll: typeof dismissAll;
+    pause: typeof pause;
+    resume: typeof resume;
+    setLimit: typeof setLimit;
+};
+export {};