@profitliga/ui 1.2.89 → 2.0.0

package/dist/components/v2/Tabs/TabsList.vue2.js

@@ -0,0 +1,70 @@
+import { defineComponent as h, inject as y, useTemplateRef as k, computed as d, openBlock as g, createElementBlock as w, mergeProps as A, unref as B, renderSlot as T } from "vue";
+import { useTestId as D } from "../shared/useTestId.util.js";
+import { TABS_KEY as R } from "./tabs.context.js";
+const $ = ["aria-orientation", "aria-label", "aria-labelledby"], K = /* @__PURE__ */ h({
+  inheritAttrs: !1,
+  __name: "TabsList",
+  props: {
+    label: { default: void 0 },
+    labelledBy: { default: void 0 },
+    testId: { default: void 0 }
+  },
+  setup(o) {
+    const b = o, m = D(() => b.testId), l = y(R, void 0), c = k("listRef"), s = d(() => l?.orientation.value ?? "horizontal"), v = d(() => [
+      "tabs-list",
+      `tabs-list--${l?.variant.value ?? "primary"}`,
+      `tabs-list--${l?.size.value ?? "default"}`,
+      `tabs-list--${s.value}`,
+      { "tabs-list--full": l?.full.value }
+    ]);
+    function i() {
+      const t = c.value;
+      return t ? Array.from(
+        t.querySelectorAll('[role="tab"]')
+      ).filter((e) => !e.disabled) : [];
+    }
+    function n(t) {
+      t && (t.focus(), l?.activationMode.value !== "manual" && t.click());
+    }
+    function f(t, e) {
+      const a = i();
+      if (a.length === 0) return;
+      const r = a.indexOf(e);
+      n(a[((r === -1 ? t === 1 ? -1 : 0 : r) + t + a.length) % a.length]);
+    }
+    function p(t) {
+      const e = s.value === "horizontal", a = e ? "ArrowRight" : "ArrowDown", r = e ? "ArrowLeft" : "ArrowUp";
+      switch (t.key) {
+        case a:
+          t.preventDefault(), f(1, t.target);
+          break;
+        case r:
+          t.preventDefault(), f(-1, t.target);
+          break;
+        case "Home":
+          t.preventDefault(), n(i()[0]);
+          break;
+        case "End": {
+          t.preventDefault();
+          const u = i();
+          n(u[u.length - 1]);
+          break;
+        }
+      }
+    }
+    return (t, e) => (g(), w("div", A({
+      ref_key: "listRef",
+      ref: c,
+      class: v.value,
+      role: "tablist",
+      "aria-orientation": s.value,
+      "aria-label": o.labelledBy ? void 0 : o.label,
+      "aria-labelledby": o.labelledBy
+    }, { ...t.$attrs, ...B(m)("list") }, { onKeydown: p }), [
+      T(t.$slots, "default", {}, void 0, !0)
+    ], 16, $));
+  }
+});
+export {
+  K as default
+};

package/dist/components/v2/Tabs/TabsTrigger.css

@@ -0,0 +1 @@
+.tabs-trigger[data-v-c9a13bd2]{--tabs-trigger-height:2rem;box-sizing:border-box;min-height:var(--tabs-trigger-height);font:inherit;color:var(--theme-neutral-text-caption);white-space:nowrap;cursor:pointer;transition:background-color var(--animation-duration-fast) ease-in-out, color var(--animation-duration-fast) ease-in-out;background:0 0;border:none;border-radius:.5rem;flex-shrink:0;justify-content:center;align-items:center;gap:.5rem;margin:0;padding:.375rem 1rem;font-size:.875rem;font-weight:600;line-height:1rem;display:flex}.tabs-trigger[data-v-c9a13bd2]:focus-visible{outline:2px solid var(--theme-primary-500);outline-offset:-2px}.tabs-trigger--large[data-v-c9a13bd2]{--tabs-trigger-height:2.75rem}.tabs-trigger[data-v-c9a13bd2]:hover:not(:disabled):not(.tabs-trigger--active){background-color:var(--theme-secondary-250)}.tabs-trigger[data-v-c9a13bd2]:disabled{cursor:not-allowed;opacity:.5}.tabs-trigger--active[data-v-c9a13bd2]{box-shadow:0 0 .75rem #437e924d}.tabs-trigger--primary.tabs-trigger--active[data-v-c9a13bd2]{color:var(--theme-neutral-0);background-color:var(--theme-primary-500)}.tabs-trigger--primary.tabs-trigger--active[data-v-c9a13bd2]:hover:not(:disabled){background-color:var(--theme-primary-600)}.tabs-trigger--secondary.tabs-trigger--active[data-v-c9a13bd2]{color:var(--theme-neutral-text-subtitle);background-color:var(--theme-neutral-0)}.tabs-trigger--full[data-v-c9a13bd2]{flex:1 1 0;min-width:max-content}.tabs-trigger__icon[data-v-c9a13bd2]{flex-shrink:0;width:1.125rem;height:1.125rem}.tabs-trigger__label[data-v-c9a13bd2]{min-width:0}

package/dist/components/v2/Tabs/TabsTrigger.vue.d.ts

@@ -0,0 +1,26 @@
+import { TabsTriggerProps } from './Tabs.types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, Component, ComponentProvideOptions } from 'vue';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+        counter?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<TabsTriggerProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TabsTriggerProps> & Readonly<{}>, {
+    label: string;
+    disabled: boolean;
+    icon: Component;
+    count: number | string;
+    testId: 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/Tabs/TabsTrigger.vue.js

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

package/dist/components/v2/Tabs/TabsTrigger.vue2.js

@@ -0,0 +1,68 @@
+import { defineComponent as T, inject as I, computed as r, provide as y, onMounted as B, openBlock as n, createElementBlock as C, mergeProps as u, unref as d, createBlock as c, resolveDynamicComponent as k, createCommentVNode as v, createElementVNode as h, renderSlot as g, createTextVNode as E, toDisplayString as S } from "vue";
+import { useTestId as $ } from "../shared/useTestId.util.js";
+import { TABS_KEY as A, TABS_TRIGGER_KEY as D } from "./tabs.context.js";
+import N from "./TabsCounter.vue.js";
+const V = ["id", "aria-selected", "aria-controls", "tabindex", "disabled", "data-state", "data-value"], Y = /* @__PURE__ */ T({
+  inheritAttrs: !1,
+  __name: "TabsTrigger",
+  props: {
+    value: {},
+    label: { default: void 0 },
+    icon: { default: void 0 },
+    count: { default: void 0 },
+    disabled: { type: Boolean, default: !1 },
+    testId: { default: void 0 }
+  },
+  setup(a) {
+    const t = a, s = $(() => t.testId), e = I(A, void 0), l = r(() => e?.selected.value === t.value), i = r(
+      () => t.disabled || !!e?.disabled.value
+    ), b = r(() => e?.triggerId(t.value)), f = r(
+      () => e?.hasContent(t.value) ? e.contentId(t.value) : void 0
+    ), m = r(() => [
+      "tabs-trigger",
+      `tabs-trigger--${e?.variant.value ?? "primary"}`,
+      `tabs-trigger--${e?.size.value ?? "default"}`,
+      {
+        "tabs-trigger--active": l.value,
+        "tabs-trigger--full": e?.full.value
+      }
+    ]);
+    y(D, { active: l });
+    function p() {
+      i.value || e?.select(t.value);
+    }
+    return B(() => {
+      i.value || e?.registerTrigger(t.value);
+    }), (o, x) => (n(), C("button", u({
+      id: b.value,
+      type: "button",
+      role: "tab",
+      class: m.value,
+      "aria-selected": l.value,
+      "aria-controls": f.value,
+      tabindex: l.value ? 0 : -1,
+      disabled: i.value,
+      "data-state": l.value ? "active" : "inactive",
+      "data-value": String(a.value)
+    }, { ...o.$attrs, ...d(s)("trigger") }, { onClick: p }), [
+      a.icon ? (n(), c(k(a.icon), {
+        key: 0,
+        class: "tabs-trigger__icon",
+        "aria-hidden": "true"
+      })) : v("", !0),
+      h("span", u({ class: "tabs-trigger__label" }, d(s)("label")), [
+        g(o.$slots, "default", {}, () => [
+          E(S(a.label), 1)
+        ], !0)
+      ], 16),
+      a.count !== void 0 ? (n(), c(N, {
+        key: 1,
+        value: a.count
+      }, null, 8, ["value"])) : v("", !0),
+      g(o.$slots, "counter", {}, void 0, !0)
+    ], 16, V));
+  }
+});
+export {
+  Y as default
+};

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

@@ -0,0 +1,7 @@
+import { default as Tabs } from './Tabs.vue';
+import { default as TabsContent } from './TabsContent.vue';
+import { default as TabsCounter } from './TabsCounter.vue';
+import { default as TabsList } from './TabsList.vue';
+import { default as TabsTrigger } from './TabsTrigger.vue';
+export type { TabsActivationMode, TabsContentProps, TabsCounterProps, TabsListProps, TabsOrientation, TabsProps, TabsSize, TabsTriggerProps, TabsValue, TabsVariant } from './Tabs.types';
+export { Tabs, TabsContent, TabsCounter, TabsList, TabsTrigger };

package/dist/components/v2/Tabs/tabs.context.d.ts

@@ -0,0 +1,40 @@
+import { InjectionKey, Ref } from 'vue';
+import { TabsActivationMode, TabsOrientation, TabsSize, TabsValue, TabsVariant } from './Tabs.types';
+/**
+ * Общий контекст переключателя. Корень раздаёт оформление и текущий выбор,
+ * список — навигацию с клавиатуры, кнопки и панели — связку `id`.
+ */
+export interface TabsContext {
+    variant: Ref<TabsVariant>;
+    size: Ref<TabsSize>;
+    orientation: Ref<TabsOrientation>;
+    full: Ref<boolean>;
+    disabled: Ref<boolean>;
+    activationMode: Ref<TabsActivationMode>;
+    selected: Ref<TabsValue | undefined>;
+    select: (value: TabsValue) => void;
+    triggerId: (value: TabsValue) => string;
+    contentId: (value: TabsValue) => string;
+    /**
+     * Панели необязательны: без `TabsContent` переключатель работает как
+     * сегментированный контрол. `aria-controls` проставляется только когда
+     * панель действительно есть в разметке, иначе ссылка вела бы в никуда.
+     */
+    hasContent: (value: TabsValue) => boolean;
+    registerContent: (value: TabsValue) => void;
+    unregisterContent: (value: TabsValue) => void;
+    /** Первая появившаяся вкладка становится активной, если выбора ещё нет. */
+    registerTrigger: (value: TabsValue) => void;
+}
+export declare const TABS_KEY: InjectionKey<TabsContext>;
+/** Контекст одной кнопки — нужен `TabsCounter`, вложенному в слот. */
+export interface TabsTriggerContext {
+    active: Ref<boolean>;
+}
+export declare const TABS_TRIGGER_KEY: InjectionKey<TabsTriggerContext>;
+/**
+ * Значение вкладки попадает в `id`, поэтому из него убирается всё, что нельзя
+ * положить в атрибут: пробелы и спецсимволы ломают `getElementById` и
+ * связку `aria-controls`/`aria-labelledby`.
+ */
+export declare function toIdPart(value: TabsValue): string;

package/dist/components/v2/Tabs/tabs.context.js

@@ -0,0 +1,9 @@
+const r = /* @__PURE__ */ Symbol("tabs"), o = /* @__PURE__ */ Symbol("tabs-trigger");
+function n(t) {
+  return String(t).replace(/[^\w-]/g, "_");
+}
+export {
+  r as TABS_KEY,
+  o as TABS_TRIGGER_KEY,
+  n as toIdPart
+};

package/dist/components/v2/Tag/Tag.css

@@ -0,0 +1 @@
+.tag[data-v-3d0a4354]{--tag-radius:.5rem;--tag-font-size:.75rem;--tag-close-size:.625rem;--tag-background:var(--theme-primary-500_20);font-weight:700;font-size:var(--tag-font-size);color:var(--theme-neutral-text-body);background-color:var(--tag-background);border-radius:var(--tag-radius);align-items:center;padding:.25rem .5rem;line-height:1rem;display:inline-flex}.tag--large[data-v-3d0a4354]{--tag-radius:.75rem;--tag-font-size:.875rem;--tag-close-size:1.125rem}.tag--neutral[data-v-3d0a4354]{--tag-background:var(--theme-neutral-400_40)}.tag--warn[data-v-3d0a4354]{--tag-background:color-mix(in srgb, var(--theme-warn-500) 20%, transparent)}.tag--info[data-v-3d0a4354]{--tag-background:color-mix(in srgb, var(--theme-info-500) 20%, transparent)}.tag__main[data-v-3d0a4354]{align-items:center;gap:.25rem;min-width:0;display:flex}.tag__icon[data-v-3d0a4354]{flex-shrink:0;width:.875rem;height:.875rem}.tag__label[data-v-3d0a4354]{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.tag__close[data-v-3d0a4354]{color:inherit;cursor:pointer;transition:opacity var(--animation-duration-fast) ease;background:0 0;border:none;flex-shrink:0;align-items:center;margin:0;padding:0;display:flex}.tag__close[data-v-3d0a4354]:hover{opacity:.7}.tag__close[data-v-3d0a4354]:focus-visible{outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem;border-radius:.125rem}.tag__close-icon[data-v-3d0a4354]{width:var(--tag-close-size);height:var(--tag-close-size)}.tag--stacked[data-v-3d0a4354]{--tag-background:transparent;flex-direction:column;align-items:flex-start;gap:.125rem;font-size:.875rem;font-weight:500}.tag__description[data-v-3d0a4354]{font-size:.75rem;font-weight:400;line-height:1rem}

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

@@ -0,0 +1,22 @@
+import { Component } from 'vue';
+export type TagTone = 'primary' | 'neutral' | 'warn' | 'info';
+export type TagSize = 'small' | 'large';
+export interface TagProps {
+    /** Текст метки. Можно передать слотом по умолчанию. */
+    label?: string;
+    /**
+     * Вторая строка под меткой. Включает вариант из макета без заливки: там
+     * важна пара «значение — пояснение», а не выделение цветом.
+     */
+    description?: string;
+    tone?: TagTone;
+    size?: TagSize;
+    /** Крестик, снимающий метку. Слушайте `close`. */
+    closable?: boolean;
+    /** Иконка перед текстом. */
+    icon?: Component;
+    /** Доступное имя крестика — по умолчанию собирается из текста метки. */
+    closeLabel?: string;
+    /** Базовый `data-testid`; внутренние части получают суффикс имени части. */
+    testId?: string;
+}

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

@@ -0,0 +1,32 @@
+import { TagProps, TagSize, TagTone } from './Tag.types';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, Component, ComponentProvideOptions } from 'vue';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<TagProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    close: () => any;
+}, string, PublicProps, Readonly<TagProps> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {
+    label: string;
+    size: TagSize;
+    icon: Component;
+    description: string;
+    testId: string;
+    tone: TagTone;
+    closable: boolean;
+    closeLabel: 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/Tag/Tag.vue.js

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

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

@@ -0,0 +1,64 @@
+import { defineComponent as v, useSlots as k, computed as d, openBlock as l, createElementBlock as n, mergeProps as s, unref as a, createElementVNode as u, createBlock as y, resolveDynamicComponent as C, createCommentVNode as i, renderSlot as $, createTextVNode as B, toDisplayString as m, createVNode as h } from "vue";
+import { X as N } from "@lucide/vue";
+import { useTestId as V } from "../shared/useTestId.util.js";
+const I = { class: "tag__main" }, L = ["aria-label"], E = /* @__PURE__ */ v({
+  inheritAttrs: !1,
+  __name: "Tag",
+  props: {
+    label: { default: void 0 },
+    description: { default: void 0 },
+    tone: { default: "primary" },
+    size: { default: "small" },
+    closable: { type: Boolean, default: !1 },
+    icon: { default: void 0 },
+    closeLabel: { default: void 0 },
+    testId: { default: void 0 }
+  },
+  emits: ["close"],
+  setup(e, { emit: f }) {
+    const t = e, b = f;
+    k();
+    const o = V(() => t.testId), g = d(
+      () => t.label ? `Убрать ${t.label}` : "Убрать метку"
+    ), p = d(() => [
+      "tag",
+      `tag--${t.size}`,
+      `tag--${t.tone}`,
+      { "tag--stacked": !!t.description }
+    ]);
+    return (c, r) => (l(), n("span", s({ class: p.value }, { ...c.$attrs, ...a(o)("root") }), [
+      u("span", I, [
+        e.icon ? (l(), y(C(e.icon), {
+          key: 0,
+          class: "tag__icon",
+          "aria-hidden": "true"
+        })) : i("", !0),
+        u("span", s({ class: "tag__label" }, a(o)("label")), [
+          $(c.$slots, "default", {}, () => [
+            B(m(e.label), 1)
+          ], !0)
+        ], 16),
+        e.closable && !e.description ? (l(), n("button", s({
+          key: 1,
+          type: "button",
+          class: "tag__close",
+          "aria-label": e.closeLabel ?? g.value
+        }, a(o)("close"), {
+          onClick: r[0] || (r[0] = (S) => b("close"))
+        }), [
+          h(a(N), {
+            class: "tag__close-icon",
+            "aria-hidden": "true"
+          })
+        ], 16, L)) : i("", !0)
+      ]),
+      e.description ? (l(), n("span", s({
+        key: 0,
+        class: "tag__description"
+      }, a(o)("description")), m(e.description), 17)) : i("", !0)
+    ], 16));
+  }
+});
+export {
+  E as default
+};

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

@@ -0,0 +1,3 @@
+import { default as Tag } from './Tag.vue';
+export type { TagProps, TagSize, TagTone } from './Tag.types';
+export { Tag };

package/dist/components/v2/Textarea/Textarea.css

@@ -0,0 +1 @@
+.textarea-field[data-v-8e6b12bd]{--field-height:2.5rem;--field-radius:.5rem;--field-padding-x:.5rem;--field-padding-y:.5rem;--field-font-size:.875rem;--field-line-height:1.25rem;--field-label-font-size:.875rem;--field-label-line-height:1rem;--field-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}.textarea-field__label[data-v-8e6b12bd]{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}.textarea-field__required[data-v-8e6b12bd]{color:var(--theme-error-500);flex-shrink:0}.textarea-field__control[data-v-8e6b12bd]{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:flex-start;display:flex;position:relative}.textarea-field__field[data-v-8e6b12bd]{width:100%;min-width:0;min-height:var(--field-line-height);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;padding:0;display:block}@media (max-width:1009.98px){.textarea-field__field[data-v-8e6b12bd]{font-size:1rem}}.textarea-field__field[data-v-8e6b12bd]::placeholder{color:var(--field-placeholder-color)}.textarea-field__field[data-v-8e6b12bd]:disabled{cursor:not-allowed;-webkit-text-fill-color:var(--field-text-color);opacity:1}.textarea-field__action[data-v-8e6b12bd]{top:var(--field-padding-y);right:var(--field-padding-x);cursor:pointer;color:var(--field-icon-color);transition:color var(--animation-duration-fast) ease;background-color:#0000;border:none;justify-content:center;align-items:center;padding:0;display:flex;position:absolute}.textarea-field__action[data-v-8e6b12bd] svg{width:var(--field-icon-size);height:var(--field-icon-size)}.textarea-field__action[data-v-8e6b12bd]:hover:not(:disabled){color:var(--theme-primary-500)}.textarea-field__action[data-v-8e6b12bd]:disabled{cursor:not-allowed}.textarea-field__action[data-v-8e6b12bd]:focus-visible{outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem;border-radius:.25rem}.textarea-field__footer[data-v-8e6b12bd]{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}.textarea-field__support[data-v-8e6b12bd]{min-width:0;color:var(--field-support-color);overflow-wrap:break-word;flex:auto;font-size:.625rem;font-weight:400;line-height:normal}.textarea-field__counter[data-v-8e6b12bd]{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}.textarea-field--size-small[data-v-8e6b12bd]{--field-height:2.25rem;--field-label-font-size:.75rem}.textarea-field--size-large[data-v-8e6b12bd]{--field-height:2.75rem;--field-radius:.75rem;--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}.textarea-field--resize-vertical .textarea-field__field[data-v-8e6b12bd]{resize:vertical;overflow:auto}.textarea-field--resize-none .textarea-field__field[data-v-8e6b12bd]{resize:none}.textarea-field--clearable .textarea-field__field[data-v-8e6b12bd]{margin-right:calc(var(--field-icon-size) + .25rem)}.textarea-field--autosize .textarea-field__field[data-v-8e6b12bd]{overflow:hidden}.textarea-field:not(.textarea-field--error):not(.textarea-field--disabled) .textarea-field__control[data-v-8e6b12bd]:hover{--field-border-color:var(--theme-primary-300)}.textarea-field:not(.textarea-field--error):not(.textarea-field--disabled) .textarea-field__control[data-v-8e6b12bd]:focus-within{--field-border-color:var(--theme-primary-500)}.textarea-field--error[data-v-8e6b12bd]{--field-border-color:var(--theme-error-500);--field-label-color:var(--theme-error-500);--field-support-color:var(--theme-error-500)}.textarea-field--disabled[data-v-8e6b12bd]{--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)}.textarea-field--disabled .textarea-field__control[data-v-8e6b12bd]{cursor:not-allowed}.textarea-field--disabled .textarea-field__field[data-v-8e6b12bd]{resize:none}

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

@@ -0,0 +1,59 @@
+/**
+ * Многострочное поле v2. Выделено из `Input` с `type: 'limit'`: та же обвязка
+ * (подпись, пояснение, ошибка, счётчик символов), но своё поведение высоты —
+ * `rows` задаёт стартовый размер, дальше поле тянется мышью или само под
+ * контент при `autosize`.
+ */
+export type TextareaSize = 'small' | 'default' | 'large';
+/** Направление ручного ресайза. При `autosize` игнорируется — высотой управляет компонент. */
+export type TextareaResize = 'none' | 'vertical';
+export interface TextareaProps {
+    /** Размер поля */
+    size?: TextareaSize;
+    /** Подпись над полем. Можно заменить слотом `label` */
+    label?: string;
+    /**
+     * Доступное имя поля для скринридера. Нужно, когда видимой подписи нет —
+     * иначе им становится `placeholder`
+     */
+    ariaLabel?: string;
+    /** Пояснение под полем. Можно заменить слотом `support` */
+    supportText?: string;
+    /**
+     * Текст ошибки. Показывается вместо `supportText` только при `error: true`,
+     * поэтому его можно держать в пропе постоянно
+     */
+    errorMessage?: string;
+    /** Состояние ошибки: красит поле и показывает `errorMessage` */
+    error?: boolean;
+    placeholder?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    required?: boolean;
+    /** Максимальная длина значения и знаменатель счётчика */
+    maxlength?: number;
+    /** Счётчик символов. По умолчанию виден, если задан `maxlength` */
+    showCount?: boolean;
+    /** Стартовое количество строк */
+    rows?: number;
+    /** Направление ручного ресайза. При `autosize` принудительно `none` */
+    resize?: TextareaResize;
+    /** Поле само подстраивает высоту под контент — ручной ресайз при этом выключен */
+    autosize?: boolean;
+    /**
+     * Предел роста при `autosize` в пикселях. После него появляется прокрутка.
+     * Без него поле растёт неограниченно
+     */
+    maxHeight?: number;
+    /** Кнопка очистки в правом верхнем углу — появляется при непустом значении */
+    clearable?: boolean;
+    name?: string;
+    /** Собственный `id`. По умолчанию генерируется */
+    id?: string;
+    testId?: string;
+}
+export interface TextareaExpose {
+    focus: () => void;
+    blur: () => void;
+    select: () => void;
+}

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

@@ -0,0 +1,68 @@
+import { TextareaProps, TextareaSize, TextareaResize } from './Textarea.types';
+import { DefineComponent, ShallowRef, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+type __VLS_Props = TextareaProps;
+type __VLS_PublicProps = {
+    modelValue?: string;
+} & __VLS_Props;
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        label?(_: {}): any;
+        support?(_: {}): any;
+    };
+    refs: {
+        fieldRef: HTMLTextAreaElement;
+    };
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: DefineComponent<__VLS_PublicProps, {
+    el: Readonly< ShallowRef<HTMLTextAreaElement | null>>;
+    focus: () => void | undefined;
+    blur: () => void | undefined;
+    select: () => void | undefined;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+    input: (event: Event) => any;
+    clear: () => any;
+    "update:modelValue": (value: string) => any;
+    blur: (event: FocusEvent) => any;
+    change: (event: Event) => any;
+    focus: (event: FocusEvent) => any;
+}, string, PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onInput?: ((event: Event) => any) | undefined;
+    onClear?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onBlur?: ((event: FocusEvent) => any) | undefined;
+    onChange?: ((event: Event) => any) | undefined;
+    onFocus?: ((event: FocusEvent) => any) | undefined;
+}>, {
+    label: string;
+    size: TextareaSize;
+    placeholder: string;
+    disabled: boolean;
+    required: boolean;
+    id: string;
+    error: boolean;
+    resize: TextareaResize;
+    readonly: boolean;
+    name: string;
+    rows: number;
+    errorMessage: string;
+    maxlength: number;
+    maxHeight: number;
+    ariaLabel: string;
+    testId: string;
+    clearable: boolean;
+    supportText: string;
+    showCount: boolean;
+    autosize: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {
+    fieldRef: HTMLTextAreaElement;
+}, 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/Textarea/Textarea.vue.js

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