@profitliga/ui 2.0.1 → 2.0.3

package/dist/components/BottomSheet/BottomSheet.css

@@ -1 +1 @@
-[data-v-9d7c3b6e] .drawer-content__header{display:none}[data-v-9d7c3b6e] .drag-closing-overlay{visibility:hidden}[data-v-9d7c3b6e] .drawer-content{height:max-content;max-height:calc(100vh - 40px)}.drawer-content[data-v-9d7c3b6e]{flex-direction:column;height:max-content;display:flex}.drawer-content--bottom[data-v-9d7c3b6e]{max-height:100%!important}[data-v-9d7c3b6e] .drawer-content__content{height:max-content;max-height:100vh;padding:0}[data-v-9d7c3b6e] .drawer-content__wrapper{gap:0;height:100%;overflow:hidden}.bottom-sheet-handle[data-v-9d7c3b6e]{cursor:grab;touch-action:none;flex-shrink:0;justify-content:center;align-items:flex-end;width:100%;height:24px;display:flex}.bottom-sheet-handle[data-v-9d7c3b6e]:active{cursor:grabbing}.bottom-sheet-handle__dot[data-v-9d7c3b6e]{background-color:var(--theme-neutral-icon-primary);border-radius:2px;width:48px;height:4px}.bottom-sheet-body[data-v-9d7c3b6e]{flex:1;justify-content:flex-start;align-items:flex-start;width:100%;height:max-content;min-height:0;display:flex;overflow-y:auto}
+[data-v-7b1882bc] .drawer-content__header{display:none}[data-v-7b1882bc] .drag-closing-overlay{visibility:hidden}[data-v-7b1882bc] .drawer-content{height:max-content;max-height:calc(100vh - 40px)}.drawer-content[data-v-7b1882bc]{flex-direction:column;height:max-content;display:flex}.drawer-content--bottom[data-v-7b1882bc]{max-height:100%!important}[data-v-7b1882bc] .drawer-content__content{height:max-content;max-height:100vh;padding:0}[data-v-7b1882bc] .drawer-content__wrapper{gap:0;height:100%;overflow:hidden}.bottom-sheet-handle[data-v-7b1882bc]{cursor:grab;touch-action:none;flex-shrink:0;justify-content:center;align-items:flex-end;width:100%;height:24px;display:flex}.bottom-sheet-handle[data-v-7b1882bc]:active{cursor:grabbing}.bottom-sheet-handle__dot[data-v-7b1882bc]{background-color:var(--theme-neutral-icon-primary);border-radius:2px;width:48px;height:4px}.bottom-sheet-body[data-v-7b1882bc]{flex:1;justify-content:flex-start;align-items:flex-start;width:100%;height:max-content;min-height:0;display:flex;overflow-y:auto}

package/dist/components/BottomSheet/BottomSheet.vue.js

@@ -2,7 +2,7 @@ import './BottomSheet.css';
 import o from "./BottomSheet.vue2.js";
 /* empty css                 */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-9d7c3b6e"]]);
+const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-7b1882bc"]]);
 export {
   p as default
 };

package/dist/components/BottomSheet/BottomSheet.vue2.js

@@ -1,91 +1,91 @@
-import { defineComponent as E, useModel as T, useTemplateRef as Y, ref as a, watch as z, nextTick as k, openBlock as $, createBlock as D, unref as l, withCtx as d, renderSlot as M, createCommentVNode as B, createVNode as m, createElementVNode as v, normalizeStyle as w, normalizeClass as L, withModifiers as S, mergeModels as N } from "vue";
-import R from "../Drawer/DrawerContent.vue.js";
-import V from "../Drawer/DrawerOverlay.vue.js";
-import H from "../Drawer/DrawerPortal.vue.js";
-import I from "../Drawer/DrawerRoot.vue.js";
-import O from "../Drawer/DrawerTrigger.vue.js";
-const U = { class: "bottom-sheet-body" }, K = /* @__PURE__ */ E({
+import { defineComponent as x, useModel as E, useTemplateRef as T, ref as a, watch as Y, nextTick as z, openBlock as _, createBlock as $, withCtx as i, renderSlot as D, createCommentVNode as k, createVNode as c, createElementVNode as d, normalizeStyle as M, normalizeClass as B, withModifiers as L, mergeModels as S } from "vue";
+import N from "../Drawer/DrawerContent.vue.js";
+import R from "../Drawer/DrawerOverlay.vue.js";
+import V from "../Drawer/DrawerPortal.vue.js";
+import H from "../Drawer/DrawerRoot.vue.js";
+import I from "../Drawer/DrawerTrigger.vue.js";
+const O = { class: "bottom-sheet-body" }, J = /* @__PURE__ */ x({
   __name: "BottomSheet",
-  props: /* @__PURE__ */ N({
+  props: /* @__PURE__ */ S({
     zIndex: { default: 1003 }
   }, {
     open: { type: Boolean, default: !1 },
     openModifiers: {}
   }),
   emits: ["update:open"],
-  setup(p, { expose: y }) {
-    const s = T(p, "open"), f = Y("content"), o = a(!1), u = a(!1), n = a(0), r = a(0), c = a(0), b = (e) => {
-      o.value = !0, r.value = e.touches[0].clientY;
-    }, C = (e) => {
+  setup(m, { expose: w }) {
+    const l = E(m, "open"), v = T("content"), o = a(!1), s = a(!1), n = a(0), u = a(0), f = a(0), y = (e) => {
+      o.value = !0, u.value = e.touches[0].clientY;
+    }, b = (e) => {
       if (!o.value) return;
-      const t = e.touches[0].clientY - r.value;
+      const t = e.touches[0].clientY - u.value;
       t > 0 && (e.preventDefault(), n.value = t);
-    }, h = () => {
+    }, p = () => {
       if (!o.value) return;
-      const e = c.value * 0.3;
-      n.value > e ? (n.value = c.value + 50, o.value = !1, setTimeout(() => {
-        u.value = !0, s.value = !1;
+      const e = f.value * 0.3;
+      n.value > e ? (n.value = f.value + 50, o.value = !1, setTimeout(() => {
+        s.value = !0, l.value = !1;
       }, 200)) : (n.value = 0, o.value = !1);
-    }, x = (e) => {
-      o.value = !0, r.value = e.clientY;
-      const t = (g) => {
+    }, C = (e) => {
+      o.value = !0, u.value = e.clientY;
+      const t = (h) => {
         if (!o.value) return;
-        const _ = g.clientY - r.value;
-        _ > 0 && (g.preventDefault(), n.value = _);
-      }, i = () => {
-        h(), document.removeEventListener("mousemove", t), document.removeEventListener("mouseup", i);
+        const g = h.clientY - u.value;
+        g > 0 && (h.preventDefault(), n.value = g);
+      }, r = () => {
+        p(), document.removeEventListener("mousemove", t), document.removeEventListener("mouseup", r);
       };
-      document.addEventListener("mousemove", t), document.addEventListener("mouseup", i);
+      document.addEventListener("mousemove", t), document.addEventListener("mouseup", r);
     };
-    return z(s, async (e) => {
-      e && (u.value = !1, n.value = 0, await k(), f.value?.$el && (c.value = f.value.$el.offsetHeight));
-    }), y({
-      $elContent: f.value
-    }), (e, t) => ($(), D(l(I), {
-      open: s.value,
-      "onUpdate:open": t[0] || (t[0] = (i) => s.value = i)
+    return Y(l, async (e) => {
+      e && (s.value = !1, n.value = 0, await z(), v.value?.$el && (f.value = v.value.$el.offsetHeight));
+    }), w({
+      $elContent: v.value
+    }), (e, t) => (_(), $(H, {
+      open: l.value,
+      "onUpdate:open": t[0] || (t[0] = (r) => l.value = r)
     }, {
-      default: d(() => [
-        e.$slots.trigger ? ($(), D(l(O), {
+      default: i(() => [
+        e.$slots.trigger ? (_(), $(I, {
           key: 0,
           "as-child": ""
         }, {
-          default: d(() => [
-            M(e.$slots, "trigger", {}, void 0, !0)
+          default: i(() => [
+            D(e.$slots, "trigger", {}, void 0, !0)
           ]),
           _: 3
-        })) : B("", !0),
-        m(l(H), null, {
-          default: d(() => [
-            v("div", {
-              style: w(`position: relative; z-index: ${p.zIndex}`)
+        })) : k("", !0),
+        c(V, null, {
+          default: i(() => [
+            d("div", {
+              style: M(`position: relative; z-index: ${m.zIndex}`)
             }, [
-              m(l(V), {
-                class: L({ "drag-closing-overlay": u.value })
+              c(R, {
+                class: B({ "drag-closing-overlay": s.value })
               }, null, 8, ["class"]),
-              m(l(R), {
+              c(N, {
                 ref: "content",
                 position: "bottom",
                 "close-button": { enabled: !1 },
-                style: w({
+                style: M({
                   transform: n.value > 0 ? `translateY(${n.value}px)` : void 0,
                   transition: o.value ? "none" : "transform 0.2s ease-out",
-                  animation: u.value ? "none" : void 0,
+                  animation: s.value ? "none" : void 0,
                   overflow: "visible"
                 })
               }, {
-                default: d(() => [
-                  v("div", {
+                default: i(() => [
+                  d("div", {
                     class: "bottom-sheet-handle",
-                    onTouchstart: b,
-                    onTouchmove: S(C, ["prevent"]),
-                    onTouchend: h,
-                    onMousedown: x
+                    onTouchstart: y,
+                    onTouchmove: L(b, ["prevent"]),
+                    onTouchend: p,
+                    onMousedown: C
                   }, [...t[1] || (t[1] = [
-                    v("div", { class: "bottom-sheet-handle__dot" }, null, -1)
+                    d("div", { class: "bottom-sheet-handle__dot" }, null, -1)
                   ])], 32),
-                  v("div", U, [
-                    M(e.$slots, "default", {}, void 0, !0)
+                  d("div", O, [
+                    D(e.$slots, "default", {}, void 0, !0)
                   ])
                 ]),
                 _: 3
@@ -100,5 +100,5 @@ const U = { class: "bottom-sheet-body" }, K = /* @__PURE__ */ E({
   }
 });
 export {
-  K as default
+  J as default
 };

package/dist/components/Drawer/Drawer.vue.d.ts

@@ -35,8 +35,8 @@ declare const __VLS_component: DefineComponent<__VLS_PublicProps, {}, {}, {}, {}
     closeButton: IDrawerCloseProps;
     position: "right" | "left" | "top" | "bottom";
     zIndex: number;
-    contentClass: string | string[];
     breakpointMobile: TBreakpoints;
+    contentClass: string | string[];
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/Drawer/Drawer.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as c, useModel as g, toRef as b, unref as f, openBlock as a, createBlock as s, createSlots as k, withCtx as o, renderSlot as n, createCommentVNode as $, createVNode as d, createElementVNode as v, normalizeStyle as w, normalizeClass as z, mergeModels as h } from "vue";
+import { defineComponent as p, useModel as c, toRef as g, unref as b, openBlock as a, createBlock as s, createSlots as k, withCtx as o, renderSlot as n, createCommentVNode as $, createVNode as d, createElementVNode as v, normalizeStyle as w, normalizeClass as z, mergeModels as h } from "vue";
 import { breakpoints as y } from "../../utils/breakpoints.util.js";
 import C from "../BottomSheet/BottomSheet.vue.js";
 import M from "./DrawerContent.vue.js";
@@ -6,7 +6,7 @@ import B from "./DrawerOverlay.vue.js";
 import I from "./DrawerPortal.vue.js";
 import S from "./DrawerRoot.vue.js";
 import D from "./DrawerTrigger.vue.js";
-const q = /* @__PURE__ */ c({
+const q = /* @__PURE__ */ p({
   __name: "Drawer",
   props: /* @__PURE__ */ h({
     position: { default: "right" },
@@ -21,8 +21,8 @@ const q = /* @__PURE__ */ c({
   }),
   emits: ["update:open"],
   setup(e) {
-    const m = e, l = g(e, "open"), u = b(m, "breakpointMobile"), p = y.smaller(u.value);
-    return (t, i) => f(p) ? (a(), s(f(C), {
+    const f = e, l = c(e, "open"), m = g(f, "breakpointMobile"), u = y.smaller(m.value);
+    return (t, i) => b(u) ? (a(), s(C, {
       key: 0,
       open: l.value,
       "onUpdate:open": i[0] || (i[0] = (r) => l.value = r),

package/dist/components/RangeCalendar/RangeCalendar.css

@@ -1 +1 @@
-.calendar--vertical[data-v-c7cc1a94]{padding:0 40px}.button--absolute[data-v-c7cc1a94]{position:absolute;top:50%}.button--absolute.button-prev[data-v-c7cc1a94]{left:0}.button--absolute.button-next[data-v-c7cc1a94]{right:0}.mounth-title[data-v-c7cc1a94]{color:var(--theme-neutral-text-body);text-transform:capitalize;margin:0 auto 8px;font-size:20px;font-weight:700;line-height:24px}
+.calendar--vertical[data-v-ab011612]{padding:0 40px}.button--absolute[data-v-ab011612]{position:absolute;top:50%}.button--absolute.button-prev[data-v-ab011612]{left:0}.button--absolute.button-next[data-v-ab011612]{right:0}.mounth-title[data-v-ab011612]{color:var(--theme-neutral-text-body);text-transform:capitalize;margin:0 auto 8px;font-size:20px;font-weight:700;line-height:24px}

package/dist/components/RangeCalendar/RangeCalendar.vue.js

@@ -2,7 +2,7 @@ import './RangeCalendar.css';
 import a from "./RangeCalendar.vue2.js";
 /* empty css                   */
 import o from "../../_virtual/_plugin-vue_export-helper.js";
-const e = /* @__PURE__ */ o(a, [["__scopeId", "data-v-c7cc1a94"]]);
+const m = /* @__PURE__ */ o(a, [["__scopeId", "data-v-ab011612"]]);
 export {
-  e as default
+  m as default
 };

package/dist/components/RangeCalendar/RangeCalendar.vue2.js

@@ -1,17 +1,17 @@
-import { defineComponent as B, useModel as k, openBlock as t, createBlock as o, unref as a, mergeProps as x, withCtx as l, createVNode as n, normalizeStyle as O, normalizeClass as y, createCommentVNode as p, createElementBlock as r, Fragment as d, renderList as m, toDisplayString as C, createTextVNode as D, mergeModels as b } from "vue";
+import { defineComponent as B, useModel as k, openBlock as a, createBlock as n, mergeProps as x, unref as f, withCtx as t, createVNode as l, normalizeStyle as O, normalizeClass as y, createCommentVNode as p, createElementBlock as o, Fragment as u, renderList as d, toDisplayString as C, createTextVNode as D, mergeModels as b } from "vue";
 import { useForwardPropsEmits as w, RangeCalendarGridHead as S } from "reka-ui";
-import H from "./RangeCalendarCell.vue.js";
-import N from "./RangeCalendarCellTrigger.vue.js";
-import P from "./RangeCalendarGrid.vue.js";
-import $ from "./RangeCalendarGridBody.vue.js";
+import { dayjs as H } from "../../utils/dayjs.util.js";
+import N from "./RangeCalendarCell.vue.js";
+import P from "./RangeCalendarCellTrigger.vue.js";
+import $ from "./RangeCalendarGrid.vue.js";
+import z from "./RangeCalendarGridBody.vue.js";
 import h from "./RangeCalendarGridRow.vue.js";
-import z from "./RangeCalendarHeadCell.vue.js";
-import F from "./RangeCalendarHeader.vue.js";
-import G from "./RangeCalendarHeading.vue.js";
-import Y from "./RangeCalendarNext.vue.js";
-import T from "./RangeCalendarPrev.vue.js";
-import j from "./RangeCalendarRoot.vue.js";
-import { dayjs as E } from "../../utils/dayjs.util.js";
+import F from "./RangeCalendarHeadCell.vue.js";
+import G from "./RangeCalendarHeader.vue.js";
+import Y from "./RangeCalendarHeading.vue.js";
+import T from "./RangeCalendarNext.vue.js";
+import j from "./RangeCalendarPrev.vue.js";
+import E from "./RangeCalendarRoot.vue.js";
 const L = {
   key: 0,
   class: "mounth-title"
@@ -55,9 +55,9 @@ const L = {
   emits: /* @__PURE__ */ b(["update:modelValue", "update:validModelValue", "update:placeholder", "update:startValue"], ["update:modelValue"]),
   setup(e, { emit: v }) {
     const c = k(e, "modelValue"), V = w(e, v);
-    return (W, g) => (t(), o(a(j), x(a(V), {
+    return (W, g) => (a(), n(E, x(f(V), {
       modelValue: c.value,
-      "onUpdate:modelValue": g[0] || (g[0] = (s) => c.value = s),
+      "onUpdate:modelValue": g[0] || (g[0] = (m) => c.value = m),
       "number-of-months": e.numberOfMonths,
       class: [{ "calendar--vertical": e.orientation === "vertical" }],
       style: {
@@ -65,14 +65,14 @@ const L = {
         position: "relative"
       }
     }), {
-      default: l(({ grid: s, weekDays: M }) => [
-        n(a(F), {
+      default: t(({ grid: m, weekDays: M }) => [
+        l(G, {
           style: O({
             gridColumn: e.orientation === "vertical" ? "span 1" : `span ${e.numberOfMonths}`
           })
         }, {
-          default: l(() => [
-            n(a(T), {
+          default: t(() => [
+            l(j, {
               class: y([
                 "button-prev",
                 {
@@ -80,8 +80,8 @@ const L = {
                 }
               ])
             }, null, 8, ["class"]),
-            e.orientation === "horizontal" || e.numberOfMonths === 1 ? (t(), o(a(G), { key: 0 })) : p("", !0),
-            n(a(Y), {
+            e.orientation === "horizontal" || e.numberOfMonths === 1 ? (a(), n(Y, { key: 0 })) : p("", !0),
+            l(T, {
               class: y([
                 "button-next",
                 {
@@ -92,18 +92,18 @@ const L = {
           ]),
           _: 1
         }, 8, ["style"]),
-        (t(!0), r(d, null, m(s, (i) => (t(), o(a(P), {
-          key: i.value.toString()
+        (a(!0), o(u, null, d(m, (r) => (a(), n($, {
+          key: r.value.toString()
         }, {
-          default: l(() => [
-            e.orientation === "vertical" && e.numberOfMonths > 1 ? (t(), r("span", L, C(a(E)(i.value.toString()).format("MMMM, YYYY")), 1)) : p("", !0),
-            n(a(S), null, {
-              default: l(() => [
-                n(a(h), null, {
-                  default: l(() => [
-                    (t(!0), r(d, null, m(M, (u) => (t(), o(a(z), { key: u }, {
-                      default: l(() => [
-                        D(C(u), 1)
+          default: t(() => [
+            e.orientation === "vertical" && e.numberOfMonths > 1 ? (a(), o("span", L, C(f(H)(r.value.toString()).format("MMMM, YYYY")), 1)) : p("", !0),
+            l(f(S), null, {
+              default: t(() => [
+                l(h, null, {
+                  default: t(() => [
+                    (a(!0), o(u, null, d(M, (i) => (a(), n(F, { key: i }, {
+                      default: t(() => [
+                        D(C(i), 1)
                       ]),
                       _: 2
                     }, 1024))), 128))
@@ -113,20 +113,20 @@ const L = {
               ]),
               _: 2
             }, 1024),
-            n(a($), null, {
-              default: l(() => [
-                (t(!0), r(d, null, m(i.rows, (u, R) => (t(), o(a(h), {
+            l(z, null, {
+              default: t(() => [
+                (a(!0), o(u, null, d(r.rows, (i, R) => (a(), n(h, {
                   key: `weekDate-${R}`
                 }, {
-                  default: l(() => [
-                    (t(!0), r(d, null, m(u, (f) => (t(), o(a(H), {
-                      key: f.toString(),
-                      date: f
+                  default: t(() => [
+                    (a(!0), o(u, null, d(i, (s) => (a(), n(N, {
+                      key: s.toString(),
+                      date: s
                     }, {
-                      default: l(() => [
-                        n(a(N), {
-                          day: f,
-                          month: i.value
+                      default: t(() => [
+                        l(P, {
+                          day: s,
+                          month: r.value
                         }, null, 8, ["day", "month"])
                       ]),
                       _: 2

package/dist/components/v2/Checkbox/Checkbox.css

@@ -1 +1 @@
-.checkbox[data-v-1bd56882]{--checkbox-color:var(--theme-neutral-border-default);cursor:pointer;align-items:flex-start;gap:.5rem;display:inline-flex}.checkbox__input[data-v-1bd56882]{clip-path:inset(50%);white-space:nowrap;border:0;width:.0625rem;height:.0625rem;margin:-.0625rem;padding:0;position:absolute;overflow:hidden}.checkbox__box[data-v-1bd56882]{width:1.25rem;height:1.25rem;color:var(--theme-neutral-0);border:.0625rem solid var(--checkbox-color);transition:background-color var(--animation-duration-fast) ease, border-color var(--animation-duration-fast) ease, outline-color var(--animation-duration-fast) ease;border-radius:.3125rem;flex-shrink:0;justify-content:center;align-items:center;display:flex}.checkbox__mark[data-v-1bd56882]{width:100%;height:100%}.checkbox__text[data-v-1bd56882]{flex-direction:column;gap:.25rem;min-width:0;display:flex}.checkbox__label[data-v-1bd56882]{color:var(--theme-neutral-text-title);overflow-wrap:break-word;font-size:.875rem;font-weight:400;line-height:1.25rem}.checkbox__description[data-v-1bd56882]{color:var(--theme-neutral-text-caption);overflow-wrap:break-word;font-size:1rem;font-weight:400;line-height:1.25rem}.checkbox[data-v-1bd56882]:not(:has(.checkbox__description)){align-items:center}.checkbox--icon-right[data-v-1bd56882]{flex-direction:row-reverse}.checkbox--checked .checkbox__box[data-v-1bd56882]{background-color:var(--checkbox-color)}.checkbox--checked[data-v-1bd56882]{--checkbox-color:var(--theme-primary-500)}.checkbox[data-v-1bd56882]:hover:not(.checkbox--disabled){--checkbox-color:var(--theme-primary-300)}.checkbox[data-v-1bd56882]:has(.checkbox__input:focus-visible){--checkbox-color:var(--theme-primary-300)}.checkbox:has(.checkbox__input:focus-visible) .checkbox__box[data-v-1bd56882]{outline:.0625rem solid var(--theme-primary-300);outline-offset:.125rem}.checkbox[data-v-1bd56882]:active:not(.checkbox--disabled){--checkbox-color:var(--theme-primary-700)}.checkbox--disabled[data-v-1bd56882]{--checkbox-color:var(--theme-neutral-surface-disabled);cursor:not-allowed;opacity:.5}.checkbox--disabled .checkbox__label[data-v-1bd56882]{color:var(--theme-neutral-400)}.checkbox--disabled.checkbox--checked[data-v-1bd56882]{--checkbox-color:var(--theme-neutral-icon-disabled)}
+.checkbox-v2[data-v-b2ea32b4]{--checkbox-color:var(--theme-neutral-border-default);cursor:pointer;align-items:flex-start;gap:.5rem;display:inline-flex}.checkbox-v2__input[data-v-b2ea32b4]{clip-path:inset(50%);white-space:nowrap;border:0;width:.0625rem;height:.0625rem;margin:-.0625rem;padding:0;position:absolute;overflow:hidden}.checkbox-v2__box[data-v-b2ea32b4]{width:1.25rem;height:1.25rem;color:var(--theme-neutral-0);border:.0625rem solid var(--checkbox-color);transition:background-color var(--animation-duration-fast) ease, border-color var(--animation-duration-fast) ease, outline-color var(--animation-duration-fast) ease;border-radius:.3125rem;flex-shrink:0;justify-content:center;align-items:center;display:flex}.checkbox-v2__mark[data-v-b2ea32b4]{width:100%;height:100%}.checkbox-v2__text[data-v-b2ea32b4]{flex-direction:column;gap:.25rem;min-width:0;display:flex}.checkbox-v2__label[data-v-b2ea32b4]{color:var(--theme-neutral-text-title);overflow-wrap:break-word;font-size:.875rem;font-weight:400;line-height:1.25rem}.checkbox-v2__description[data-v-b2ea32b4]{color:var(--theme-neutral-text-caption);overflow-wrap:break-word;font-size:1rem;font-weight:400;line-height:1.25rem}.checkbox-v2[data-v-b2ea32b4]:not(:has(.checkbox-v2__description)){align-items:center}.checkbox-v2--icon-right[data-v-b2ea32b4]{flex-direction:row-reverse}.checkbox-v2--checked .checkbox-v2__box[data-v-b2ea32b4]{background-color:var(--checkbox-color)}.checkbox-v2--checked[data-v-b2ea32b4]{--checkbox-color:var(--theme-primary-500)}.checkbox-v2[data-v-b2ea32b4]:hover:not(.checkbox-v2--disabled){--checkbox-color:var(--theme-primary-300)}.checkbox-v2[data-v-b2ea32b4]:has(.checkbox-v2__input:focus-visible){--checkbox-color:var(--theme-primary-300)}.checkbox-v2:has(.checkbox-v2__input:focus-visible) .checkbox-v2__box[data-v-b2ea32b4]{outline:.0625rem solid var(--theme-primary-300);outline-offset:.125rem}.checkbox-v2[data-v-b2ea32b4]:active:not(.checkbox-v2--disabled){--checkbox-color:var(--theme-primary-700)}.checkbox-v2--disabled[data-v-b2ea32b4]{--checkbox-color:var(--theme-neutral-surface-disabled);cursor:not-allowed;opacity:.5}.checkbox-v2--disabled .checkbox-v2__label[data-v-b2ea32b4]{color:var(--theme-neutral-400)}.checkbox-v2--disabled.checkbox-v2--checked[data-v-b2ea32b4]{--checkbox-color:var(--theme-neutral-icon-disabled)}

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

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

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

@@ -1,20 +1,20 @@
-import { defineComponent as $, useModel as x, useSlots as R, useId as T, useTemplateRef as E, computed as n, watchEffect as N, openBlock as l, createElementBlock as o, mergeProps as d, unref as c, createElementVNode as f, createCommentVNode as b, renderSlot as y, createTextVNode as g, toDisplayString as w, mergeModels as L } from "vue";
+import { defineComponent as $, useModel as x, useSlots as R, useId as T, useTemplateRef as E, computed as n, watchEffect as N, openBlock as l, createElementBlock as o, mergeProps as d, unref as c, createElementVNode as v, createCommentVNode as f, renderSlot as y, createTextVNode as g, toDisplayString as w, mergeModels as L } from "vue";
 import { useTestId as P } from "../shared/useTestId.util.js";
 const S = ["for"], D = ["id", "name", "value", "checked", "disabled", "aria-label", "aria-labelledby"], A = {
   key: 0,
-  class: "checkbox__mark",
+  class: "checkbox-v2__mark",
   viewBox: "0 0 20 20",
   fill: "none",
   xmlns: "http://www.w3.org/2000/svg"
 }, H = {
   key: 1,
-  class: "checkbox__mark",
+  class: "checkbox-v2__mark",
   viewBox: "0 0 20 20",
   fill: "none",
   xmlns: "http://www.w3.org/2000/svg"
 }, Z = {
   key: 0,
-  class: "checkbox__text"
+  class: "checkbox-v2__text"
 }, z = /* @__PURE__ */ $({
   inheritAttrs: !1,
   __name: "Checkbox",
@@ -37,18 +37,18 @@ const S = ["for"], D = ["id", "name", "value", "checked", "disabled", "aria-labe
   }),
   emits: /* @__PURE__ */ L(["change"], ["update:modelValue", "update:indeterminate"]),
   setup(e, { emit: B }) {
-    const t = e, C = B, u = x(e, "modelValue"), r = x(e, "indeterminate"), m = R(), i = P(() => t.testId), V = T(), h = E("inputRef"), v = n(() => t.id ?? `${V}-checkbox`), k = n(() => !!(t.label || m.default)), p = n(
-      () => !!(t.description || m.description)
+    const t = e, C = B, u = x(e, "modelValue"), r = x(e, "indeterminate"), h = R(), i = P(() => t.testId), V = T(), b = E("inputRef"), m = n(() => t.id ?? `${V}-checkbox`), k = n(() => !!(t.label || h.default)), p = n(
+      () => !!(t.description || h.description)
     ), I = n(() => k.value || p.value), M = n(() => [
-      "checkbox",
-      `checkbox--icon-${t.iconPosition}`,
+      "checkbox-v2",
+      `checkbox-v2--icon-${t.iconPosition}`,
       {
-        "checkbox--checked": u.value || r.value,
-        "checkbox--disabled": t.disabled
+        "checkbox-v2--checked": u.value || r.value,
+        "checkbox-v2--disabled": t.disabled
       }
     ]);
     N(() => {
-      h.value && (h.value.indeterminate = r.value);
+      b.value && (b.value.indeterminate = r.value);
     });
     function _(s) {
       if (t.disabled) return;
@@ -57,14 +57,14 @@ const S = ["for"], D = ["id", "name", "value", "checked", "disabled", "aria-labe
     }
     return (s, a) => (l(), o("label", d({
       class: M.value,
-      for: v.value
+      for: m.value
     }, c(i)("root")), [
-      f("input", d({
-        id: v.value,
+      v("input", d({
+        id: m.value,
         ref_key: "inputRef",
-        ref: h,
+        ref: b,
         type: "checkbox",
-        class: "checkbox__input",
+        class: "checkbox-v2__input",
         name: e.name,
         value: e.value,
         checked: u.value,
@@ -72,41 +72,41 @@ const S = ["for"], D = ["id", "name", "value", "checked", "disabled", "aria-labe
         "aria-label": e.ariaLabel,
         "aria-labelledby": e.ariaLabelledby
       }, { ...s.$attrs, ...c(i)("input") }, { onChange: _ }), null, 16, D),
-      f("span", d({
-        class: "checkbox__box",
+      v("span", d({
+        class: "checkbox-v2__box",
         "aria-hidden": "true"
       }, c(i)("box")), [
         r.value ? (l(), o("svg", A, [...a[0] || (a[0] = [
-          f("path", {
+          v("path", {
             d: "M4 10H16",
             stroke: "currentColor",
             "stroke-width": "2"
           }, null, -1)
         ])])) : u.value ? (l(), o("svg", H, [...a[1] || (a[1] = [
-          f("path", {
+          v("path", {
             d: "M8.13636 13.70149L5.03409 10.25373L4 11.40299L8.13636 16L17 6.14925L15.9659 5L8.13636 13.70149Z",
             fill: "currentColor"
           }, null, -1)
-        ])])) : b("", !0)
+        ])])) : f("", !0)
       ], 16),
       I.value ? (l(), o("span", Z, [
         k.value ? (l(), o("span", d({
           key: 0,
-          class: "checkbox__label"
+          class: "checkbox-v2__label"
         }, c(i)("label")), [
           y(s.$slots, "default", {}, () => [
             g(w(e.label), 1)
           ], !0)
-        ], 16)) : b("", !0),
+        ], 16)) : f("", !0),
         p.value ? (l(), o("span", d({
           key: 1,
-          class: "checkbox__description"
+          class: "checkbox-v2__description"
         }, c(i)("description")), [
           y(s.$slots, "description", {}, () => [
             g(w(e.description), 1)
           ], !0)
-        ], 16)) : b("", !0)
-      ])) : b("", !0)
+        ], 16)) : f("", !0)
+      ])) : f("", !0)
     ], 16, S));
   }
 });

package/dist/components/v2/Combobox/Combobox.css

@@ -1 +1 @@
-.combobox[data-v-8c5e944b]{--combobox-field-height:2.5rem;--combobox-field-radius:.5rem;--combobox-font-size:.875rem;--combobox-line-height:1.25rem;--combobox-label-font-size:.875rem;--combobox-label-line-height:1rem;--combobox-border-color:var(--theme-neutral-border-default);flex-direction:column;display:flex}.combobox--small[data-v-8c5e944b]{--combobox-field-height:2.25rem;--combobox-label-font-size:.75rem}.combobox--large[data-v-8c5e944b]{--combobox-field-height:2.75rem;--combobox-field-radius:.75rem;--combobox-font-size:1rem;--combobox-line-height:1.5rem;--combobox-label-font-size:1rem;--combobox-label-line-height:1.25rem}.combobox__label[data-v-8c5e944b]{font-weight:400;font-size:var(--combobox-label-font-size);line-height:var(--combobox-label-line-height);color:var(--theme-neutral-text-title);cursor:pointer;padding:.375rem .5rem}.combobox__field[data-v-8c5e944b]{min-height:var(--combobox-field-height);background-color:var(--theme-neutral-0);border:.0625rem solid var(--combobox-border-color);border-radius:var(--combobox-field-radius);cursor:text;transition:border-color var(--animation-duration-fast) ease;align-items:center;gap:.25rem;padding:.25rem .5rem;display:flex}.combobox__content[data-v-8c5e944b]{flex:auto;align-items:center;gap:.25rem;min-width:0;display:flex}.combobox__input[data-v-8c5e944b]{min-width:2rem;font-family:inherit;font-weight:400;font-size:var(--combobox-font-size);line-height:var(--combobox-line-height);color:var(--theme-neutral-text-body);text-overflow:ellipsis;background:0 0;border:none;outline:none;flex:4rem;order:3;padding:0}@media (max-width:1009.98px){.combobox__input[data-v-8c5e944b]{font-size:1rem}}.combobox__input[data-v-8c5e944b]::placeholder{color:var(--theme-neutral-550)}.combobox__input[data-v-8c5e944b]:disabled{color:var(--theme-neutral-text-disabled);cursor:not-allowed}.combobox__input[data-v-8c5e944b]:disabled::placeholder{color:var(--theme-neutral-text-disabled)}.combobox__input[data-v-8c5e944b]:read-only{cursor:pointer}.combobox__chips[data-v-8c5e944b]{flex:0 auto;order:1;align-items:center;gap:.25rem;min-width:0;display:flex;overflow:hidden}.combobox__chip[data-v-8c5e944b]{max-width:100%;height:1.125rem;color:var(--theme-neutral-text-subtitle);background-color:var(--theme-neutral-surface-icon);border-radius:.375rem;flex-shrink:0;align-items:center;gap:.5rem;padding:0 .375rem;font-size:.75rem;font-weight:400;line-height:1rem;display:flex}.combobox__chip-label[data-v-8c5e944b]{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.combobox__chip-remove[data-v-8c5e944b]{color:var(--theme-neutral-icon-caption);cursor:pointer;transition:color var(--animation-duration-fast) ease;background:0 0;border:none;align-items:center;margin:0;padding:0;display:flex}.combobox__chip-remove[data-v-8c5e944b]:hover:not(:disabled){color:var(--theme-neutral-text-body)}.combobox__chip-remove[data-v-8c5e944b]:focus-visible{outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem}.combobox__chip-remove[data-v-8c5e944b]:disabled{cursor:not-allowed}.combobox__chip-icon[data-v-8c5e944b],.combobox__chip-avatar[data-v-8c5e944b]{flex-shrink:0;width:.75rem;height:.75rem}.combobox__chip-avatar[data-v-8c5e944b]{object-fit:cover;border-radius:50%}.combobox__chip--measured[data-v-8c5e944b]{visibility:hidden;pointer-events:none;position:absolute;top:0;left:-9999px}.combobox__chip--counter[data-v-8c5e944b]{color:var(--theme-neutral-text-caption);flex-shrink:0;order:2}.combobox__arrow-button[data-v-8c5e944b]{cursor:pointer;background:0 0;border:none;flex-shrink:0;align-items:center;margin:0;padding:0;display:flex}.combobox__arrow-button[data-v-8c5e944b]:disabled{cursor:not-allowed}.combobox__arrow[data-v-8c5e944b]{width:1.125rem;height:1.125rem;color:var(--theme-neutral-text-body);transition:transform var(--animation-duration-fast) ease}.combobox__message[data-v-8c5e944b]{color:var(--theme-neutral-text-body);margin:0;padding:.25rem .5rem;font-size:.625rem;font-weight:400;line-height:1.2}.combobox[data-v-8c5e944b]:hover:not(.combobox--disabled){--combobox-border-color:var(--theme-primary-300)}.combobox--open[data-v-8c5e944b],.combobox--open[data-v-8c5e944b]:hover{--combobox-border-color:var(--theme-primary-500)}.combobox--open .combobox__arrow[data-v-8c5e944b]{transform:rotate(180deg)}.combobox--invalid[data-v-8c5e944b]{--combobox-border-color:var(--theme-error-500)}.combobox--invalid .combobox__label[data-v-8c5e944b],.combobox--invalid .combobox__message[data-v-8c5e944b]{color:var(--theme-error-500)}.combobox--invalid[data-v-8c5e944b]:hover:not(.combobox--disabled){--combobox-border-color:var(--theme-error-500)}.combobox--disabled[data-v-8c5e944b]{--combobox-border-color:var(--theme-neutral-border-disabled)}.combobox--disabled .combobox__field[data-v-8c5e944b]{cursor:not-allowed}.combobox--disabled .combobox__label[data-v-8c5e944b],.combobox--disabled .combobox__message[data-v-8c5e944b],.combobox--disabled .combobox__arrow[data-v-8c5e944b]{color:var(--theme-neutral-text-disabled)}.combobox--disabled .combobox__label[data-v-8c5e944b]{cursor:not-allowed}.combobox__field[data-v-8c5e944b]:has(.combobox__input:focus-visible){outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem}.combobox-list[data-v-8c5e944b]{flex-direction:column;display:flex}.combobox-list__search[data-v-8c5e944b]{padding:.5rem .5rem 0}.combobox-list__options[data-v-8c5e944b]{flex-direction:column;gap:.5rem;max-height:15rem;padding:.5rem;display:flex;overflow-y:auto}.combobox-list__option[data-v-8c5e944b]{width:100%;min-height:2rem;color:var(--theme-neutral-text-title);text-align:left;cursor:pointer;transition:background-color var(--animation-duration-fast) ease;background-color:#0000;border-radius:.5rem;align-items:center;gap:.5rem;padding:.25rem .5rem;font-size:.875rem;font-weight:400;line-height:1.25rem;display:flex}.combobox-list__option[data-v-8c5e944b]:hover:not(.combobox-list__option--disabled),.combobox-list__option--active[data-v-8c5e944b]{background-color:var(--theme-secondary-50)}.combobox-list__option--disabled[data-v-8c5e944b]{cursor:not-allowed;opacity:.5}.combobox-list__label[data-v-8c5e944b]{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-width:0;overflow:hidden}.combobox-list__status[data-v-8c5e944b]{color:var(--theme-neutral-text-caption);margin:0;padding:.25rem .5rem;font-size:.875rem;line-height:1.25rem}
+.combobox[data-v-a7d76bc3]{--combobox-field-height:2.5rem;--combobox-field-radius:.5rem;--combobox-font-size:.875rem;--combobox-line-height:1.25rem;--combobox-label-font-size:.875rem;--combobox-label-line-height:1rem;--combobox-border-color:var(--theme-neutral-border-default);flex-direction:column;display:flex}.combobox--small[data-v-a7d76bc3]{--combobox-field-height:2.25rem;--combobox-label-font-size:.75rem}.combobox--large[data-v-a7d76bc3]{--combobox-field-height:2.75rem;--combobox-field-radius:.75rem;--combobox-font-size:1rem;--combobox-line-height:1.5rem;--combobox-label-font-size:1rem;--combobox-label-line-height:1.25rem}.combobox__label[data-v-a7d76bc3]{font-weight:400;font-size:var(--combobox-label-font-size);line-height:var(--combobox-label-line-height);color:var(--theme-neutral-text-title);cursor:pointer;padding:.375rem .5rem}.combobox__field[data-v-a7d76bc3]{min-height:var(--combobox-field-height);background-color:var(--theme-neutral-0);border:.0625rem solid var(--combobox-border-color);border-radius:var(--combobox-field-radius);cursor:text;transition:border-color var(--animation-duration-fast) ease;align-items:center;gap:.25rem;padding:.25rem .5rem;display:flex}.combobox__content[data-v-a7d76bc3]{flex:auto;align-items:center;gap:.25rem;min-width:0;display:flex}.combobox__input[data-v-a7d76bc3]{min-width:2rem;font-family:inherit;font-weight:400;font-size:var(--combobox-font-size);line-height:var(--combobox-line-height);color:var(--theme-neutral-text-body);text-overflow:ellipsis;background:0 0;border:none;outline:none;flex:4rem;order:3;padding:0}@media (max-width:1009.98px){.combobox__input[data-v-a7d76bc3]{font-size:1rem}}.combobox__input[data-v-a7d76bc3]::placeholder{color:var(--theme-neutral-550)}.combobox__input[data-v-a7d76bc3]:disabled{color:var(--theme-neutral-text-disabled);cursor:not-allowed}.combobox__input[data-v-a7d76bc3]:disabled::placeholder{color:var(--theme-neutral-text-disabled)}.combobox__input[data-v-a7d76bc3]:read-only{cursor:pointer}.combobox__chips[data-v-a7d76bc3]{flex:0 auto;order:1;align-items:center;gap:.25rem;min-width:0;display:flex;overflow:hidden}.combobox__chip[data-v-a7d76bc3]{max-width:100%;height:1.125rem;color:var(--theme-neutral-text-subtitle);background-color:var(--theme-neutral-surface-icon);border-radius:.375rem;flex-shrink:0;align-items:center;gap:.5rem;padding:0 .375rem;font-size:.75rem;font-weight:400;line-height:1rem;display:flex}.combobox__chip-label[data-v-a7d76bc3]{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.combobox__chip-remove[data-v-a7d76bc3]{color:var(--theme-neutral-icon-caption);cursor:pointer;transition:color var(--animation-duration-fast) ease;background:0 0;border:none;align-items:center;margin:0;padding:0;display:flex}.combobox__chip-remove[data-v-a7d76bc3]:hover:not(:disabled){color:var(--theme-neutral-text-body)}.combobox__chip-remove[data-v-a7d76bc3]:focus-visible{outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem}.combobox__chip-remove[data-v-a7d76bc3]:disabled{cursor:not-allowed}.combobox__chip-icon[data-v-a7d76bc3],.combobox__chip-avatar[data-v-a7d76bc3]{flex-shrink:0;width:.75rem;height:.75rem}.combobox__chip-avatar[data-v-a7d76bc3]{object-fit:cover;border-radius:50%}.combobox__chip--measured[data-v-a7d76bc3]{visibility:hidden;pointer-events:none;position:absolute;top:0;left:-9999px}.combobox__chip--counter[data-v-a7d76bc3]{color:var(--theme-neutral-text-caption);flex-shrink:0;order:2}.combobox__clear-button[data-v-a7d76bc3]{color:var(--theme-neutral-icon-caption);cursor:pointer;transition:color var(--animation-duration-fast) ease;background:0 0;border:none;flex-shrink:0;align-items:center;margin:0;padding:0;display:flex}.combobox__clear-button[data-v-a7d76bc3]:hover{color:var(--theme-neutral-text-body)}.combobox__clear-button[data-v-a7d76bc3]:focus-visible{outline:2px solid var(--theme-primary-500);outline-offset:2px}.combobox__clear[data-v-a7d76bc3]{width:1rem;height:1rem}.combobox__arrow-button[data-v-a7d76bc3]{cursor:pointer;background:0 0;border:none;flex-shrink:0;align-items:center;margin:0;padding:0;display:flex}.combobox__arrow-button[data-v-a7d76bc3]:disabled{cursor:not-allowed}.combobox__arrow[data-v-a7d76bc3]{width:1.125rem;height:1.125rem;color:var(--theme-neutral-text-body);transition:transform var(--animation-duration-fast) ease}.combobox__message[data-v-a7d76bc3]{color:var(--theme-neutral-text-body);margin:0;padding:.25rem .5rem;font-size:.625rem;font-weight:400;line-height:1.2}.combobox[data-v-a7d76bc3]:hover:not(.combobox--disabled){--combobox-border-color:var(--theme-primary-300)}.combobox--open[data-v-a7d76bc3],.combobox--open[data-v-a7d76bc3]:hover{--combobox-border-color:var(--theme-primary-500)}.combobox--open .combobox__arrow[data-v-a7d76bc3]{transform:rotate(180deg)}.combobox--invalid[data-v-a7d76bc3]{--combobox-border-color:var(--theme-error-500)}.combobox--invalid .combobox__label[data-v-a7d76bc3],.combobox--invalid .combobox__message[data-v-a7d76bc3]{color:var(--theme-error-500)}.combobox--invalid[data-v-a7d76bc3]:hover:not(.combobox--disabled){--combobox-border-color:var(--theme-error-500)}.combobox--disabled[data-v-a7d76bc3]{--combobox-border-color:var(--theme-neutral-border-disabled)}.combobox--disabled .combobox__field[data-v-a7d76bc3]{cursor:not-allowed}.combobox--disabled .combobox__label[data-v-a7d76bc3],.combobox--disabled .combobox__message[data-v-a7d76bc3],.combobox--disabled .combobox__arrow[data-v-a7d76bc3]{color:var(--theme-neutral-text-disabled)}.combobox--disabled .combobox__label[data-v-a7d76bc3]{cursor:not-allowed}.combobox__field[data-v-a7d76bc3]:has(.combobox__input:focus-visible){outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem}.combobox-list[data-v-a7d76bc3]{flex-direction:column;display:flex}.combobox-list__search[data-v-a7d76bc3]{padding:.5rem .5rem 0}.combobox-list__scroll[data-v-a7d76bc3]{max-height:15rem;overflow-y:auto}.combobox-list__options[data-v-a7d76bc3]{flex-direction:column;gap:.5rem;height:max-content;padding:.5rem;display:flex}.combobox-list__option[data-v-a7d76bc3]{width:100%;min-height:2rem;color:var(--theme-neutral-text-title);text-align:left;cursor:pointer;transition:background-color var(--animation-duration-fast) ease;background-color:#0000;border-radius:.5rem;align-items:flex-start;gap:.5rem;padding:.375rem .5rem;font-size:.875rem;font-weight:400;line-height:1.25rem;display:flex}.combobox-list__option[data-v-a7d76bc3]:hover:not(.combobox-list__option--disabled),.combobox-list__option--active[data-v-a7d76bc3]{background-color:var(--theme-secondary-50)}.combobox-list__option--disabled[data-v-a7d76bc3]{cursor:not-allowed;opacity:.5}.combobox-list__label[data-v-a7d76bc3]{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-width:0;overflow:hidden}.combobox-list__status[data-v-a7d76bc3]{color:var(--theme-neutral-text-caption);margin:0;padding:.25rem .5rem;font-size:.875rem;line-height:1.25rem}

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

@@ -1,4 +1,4 @@
-import { Component } from 'vue';
+import { Component, VNodeChild } from 'vue';
 import { TBreakpoints } from '../../../types/global.types';
 import { PopoverAlign, PopoverSide } from '../Popover';
 export type ComboboxSize = 'small' | 'default' | 'large';
@@ -12,8 +12,54 @@ export interface ComboboxOptionData {
     /** Картинка 12×12 (аватар) перед подписью выбранного значения. */
     avatar?: string;
 }
-export interface ComboboxProps {
-    options: ComboboxOptionData[];
+/**
+ * Слоты перекрывают то, что компонент рисует по данным варианта: сначала
+ * проверяется слот, и только без него в дело идёт `label` и тексты из пропов.
+ *
+ * Параметр `T` — тип варианта у потребителя. Он же приезжает в слот, поэтому
+ * из разметки видны собственные поля данных (ИНН, адрес), а не только
+ * `ComboboxOptionData`.
+ */
+export interface ComboboxSlots<T extends ComboboxOptionData = ComboboxOptionData> {
+    /**
+     * Строка списка. Маркер выбора остаётся снаружи слота — он часть
+     * механики выбора, а не содержимого варианта.
+     *
+     * Внутри `role="option"`, поэтому интерактивные элементы (кнопки, ссылки,
+     * поля) сюда класть нельзя: скринридер до них не доберётся.
+     */
+    option?: (props: {
+        option: T;
+        /** Вариант входит в текущее значение. */
+        selected: boolean;
+        /** Строка под курсором или выбрана с клавиатуры. */
+        active: boolean;
+        index: number;
+    }) => VNodeChild;
+    /**
+     * Содержимое чипа выбранного значения при `multiple`. Кнопка «убрать»
+     * остаётся снаружи — без неё значение нечем снять.
+     *
+     * Ширину чипов компонент меряет, чтобы спрятать лишние за счётчик «+n»:
+     * содержимое переменной ширины это переживает, а вот `width` в процентах
+     * внутри слота меряться будет не от того.
+     */
+    chip?: (props: {
+        option: T;
+        index: number;
+    }) => VNodeChild;
+    /**
+     * Пустой список. `notFound` разделяет два случая: вариантов нет вовсе
+     * (`false`) или ни один не подошёл под запрос (`true`).
+     */
+    empty?: (props: {
+        notFound: boolean;
+    }) => VNodeChild;
+    /** Строка загрузки при `loading`. Прежние варианты остаются под ней. */
+    loading?: () => VNodeChild;
+}
+export interface ComboboxProps<T extends ComboboxOptionData = ComboboxOptionData> {
+    options: T[];
     /** Множественный выбор: список не закрывается, значения показываются чипами. */
     multiple?: boolean;
     /**
@@ -39,6 +85,20 @@ export interface ComboboxProps {
     invalid?: boolean;
     size?: ComboboxSize;
     disabled?: boolean;
+    /**
+     * Не раскрывать список, пока показывать нечего: ни вариантов, ни загрузки.
+     * Пригодится серверному поиску, где до первого запроса список пуст и пустая
+     * плашка только мешает.
+     *
+     * Внутреннее состояние «открыт» при этом сохраняется: как только придут
+     * варианты или включится `loading`, список раскроется сам, без повторного
+     * клика. По умолчанию выключено — пустое состояние со своим текстом и слотом
+     * `empty` остаётся штатным поведением.
+     *
+     * На мобильных не действует: там поле поиска живёт внутри шторки, и, спрятав
+     * её, запрос было бы негде набрать.
+     */
+    hideEmptyList?: boolean;
     /** Текст пустого списка, когда вариантов нет вовсе. */
     emptyText?: string;
     /** Текст пустого списка, когда под запрос ничего не подошло. */