@profitliga/ui 2.0.4 → 2.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/v2/Button/Button.css +1 -1
- package/dist/components/v2/Button/Button.vue.js +2 -2
- package/dist/components/v2/Combobox/Combobox.css +1 -1
- package/dist/components/v2/Combobox/Combobox.types.d.ts +10 -2
- package/dist/components/v2/Combobox/Combobox.vue.js +1 -1
- package/dist/components/v2/Combobox/Combobox.vue2.js +118 -120
- package/dist/components/v2/Popover/Popover.css +1 -1
- package/dist/components/v2/Popover/Popover.types.d.ts +13 -0
- package/dist/components/v2/Popover/Popover.vue.d.ts +1 -0
- package/dist/components/v2/Popover/Popover.vue.js +2 -2
- package/dist/components/v2/Popover/Popover.vue2.js +34 -33
- package/dist/components/v2/Schedule/Schedule.css +1 -1
- package/dist/components/v2/Schedule/Schedule.vue.js +3 -3
- package/dist/components/v2/Schedule/Schedule.vue2.js +5 -4
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
.button[data-v-
|
|
1
|
+
.button[data-v-e970cf04]{--button-height:2.5rem;--button-padding-x:1.25rem;--button-radius:.5rem;--button-font-size:1rem;--button-line-height:1.25rem;--button-icon-size:1.125rem;--button-gap:.25rem;--button-shadow:none;--button-background:transparent;--button-color:var(--theme-neutral-text-body);--button-border-color:transparent;--button-background-hover:var(--button-background);--button-color-hover:var(--button-color);--button-background-active:var(--button-background-hover);--button-color-active:var(--button-color-hover);--button-background-focus:var(--button-background-hover);--button-color-focus:var(--button-color-hover);--button-outline-color:var(--theme-primary-300);--button-outline-width:.1875rem;--button-outline-offset:0;--button-background-disabled:transparent;--button-border-color-disabled:transparent;--button-color-disabled:var(--theme-neutral-300);justify-content:center;align-items:center;gap:var(--button-gap);box-sizing:border-box;width:max-content;height:var(--button-height);padding:0 var(--button-padding-x);font-family:inherit;font-weight:500;font-size:var(--button-font-size);line-height:var(--button-line-height);color:var(--button-color);background-color:var(--button-background);border:.0625rem solid var(--button-border-color);border-radius:var(--button-radius);box-shadow:var(--button-shadow);cursor:pointer;transition:background-color var(--animation-duration-fast) ease-in-out, border-color var(--animation-duration-fast) ease-in-out, color var(--animation-duration-fast) ease-in-out;display:inline-flex}.button[data-v-e970cf04]:hover:not(:disabled){color:var(--button-color-hover);background-color:var(--button-background-hover)}.button[data-v-e970cf04]:active:not(:disabled){color:var(--button-color-active);background-color:var(--button-background-active)}.button[data-v-e970cf04]:focus-visible{color:var(--button-color-focus);background-color:var(--button-background-focus);outline:var(--button-outline-width) solid var(--button-outline-color);outline-offset:var(--button-outline-offset)}.button[data-v-e970cf04]:disabled{color:var(--button-color-disabled);background-color:var(--button-background-disabled);border-color:var(--button-border-color-disabled);box-shadow:none;cursor:not-allowed}.button--extrasmall[data-v-e970cf04]{--button-height:1.5rem;--button-padding-x:.75rem;--button-font-size:.75rem;--button-line-height:1rem;--button-icon-size:.75rem;--button-shadow:var(--theme-shadow-button)}.button--small[data-v-e970cf04]{--button-height:2.25rem;--button-padding-x:1rem;--button-font-size:.875rem;--button-line-height:1rem;--button-icon-size:1rem}.button--large[data-v-e970cf04]{--button-height:2.75rem;--button-padding-x:1.5rem;--button-radius:.75rem;--button-font-size:1.125rem;--button-line-height:1.5rem;--button-icon-size:1.25rem;--button-gap:.5rem}.button--extralarge[data-v-e970cf04]{--button-height:3.5rem;--button-padding-x:1.5rem;--button-radius:.75rem;--button-font-size:1.25rem;--button-line-height:1.5rem;--button-icon-size:1.5rem;--button-gap:.5rem}.button--success[data-v-e970cf04]{--button-background:var(--theme-primary-500);--button-color:var(--theme-neutral-0);--button-background-hover:var(--theme-primary-400);--button-background-active:var(--theme-primary-600);--button-background-disabled:var(--theme-neutral-surface-disabled)}.button--success.button--contrast[data-v-e970cf04]{--button-background:var(--theme-primary-75);--button-color:var(--theme-primary-500);--button-background-hover:var(--theme-primary-200);--button-background-active:var(--theme-primary-300)}.button--success.button--outlined[data-v-e970cf04]{--button-background:var(--theme-neutral-0);--button-color:var(--theme-neutral-text-body);--button-border-color:var(--theme-primary-500);--button-background-hover:var(--theme-primary-50);--button-color-hover:var(--theme-primary-500);--button-background-active:var(--theme-primary-75);--button-background-disabled:transparent;--button-border-color-disabled:var(--theme-neutral-border-disabled)}.button--success.button--text[data-v-e970cf04]{--button-background:transparent;--button-color:var(--theme-primary-500);--button-background-hover:var(--theme-primary-75);--button-background-active:var(--theme-primary-75);--button-background-disabled:transparent}.button--success.button--text-plain[data-v-e970cf04]{--button-background:transparent;--button-color:var(--theme-neutral-text-body);--button-background-hover:transparent;--button-background-active:transparent;--button-color-hover:var(--theme-primary-500);--button-color-active:var(--theme-primary-600);--button-background-disabled:transparent}.button--danger[data-v-e970cf04]{--button-background:var(--theme-error-500);--button-color:var(--theme-neutral-0);--button-background-hover:var(--theme-error-400);--button-background-active:var(--theme-error-600);--button-outline-color:var(--theme-error-300);--button-background-disabled:var(--theme-neutral-surface-disabled)}.button--danger.button--contrast[data-v-e970cf04]{--button-background:var(--theme-error-50);--button-color:var(--theme-error-700);--button-background-hover:var(--theme-error-100);--button-background-active:var(--theme-error-200)}.button--danger.button--outlined[data-v-e970cf04]{--button-background:var(--theme-neutral-0);--button-color:var(--theme-error-500);--button-border-color:var(--theme-error-500);--button-background-hover:var(--theme-error-50);--button-background-active:var(--theme-error-200);--button-background-disabled:transparent;--button-border-color-disabled:var(--theme-neutral-border-disabled)}.button--danger.button--text[data-v-e970cf04]{--button-background:transparent;--button-color:var(--theme-error-500);--button-background-hover:var(--theme-error-50);--button-background-active:var(--theme-error-200);--button-background-disabled:transparent}.button--danger.button--text-plain[data-v-e970cf04]{--button-background:transparent;--button-color:var(--theme-neutral-text-body);--button-background-hover:transparent;--button-background-active:transparent;--button-color-hover:var(--theme-error-500);--button-color-active:var(--theme-error-600);--button-background-disabled:transparent}.button--secondary.button--outlined[data-v-e970cf04]{--button-background:var(--theme-neutral-0);--button-color:var(--theme-neutral-text-body);--button-border-color:var(--theme-neutral-border-default);--button-background-hover:var(--theme-neutral-200);--button-background-active:var(--theme-neutral-400_40);--button-border-color-disabled:var(--theme-neutral-border-default)}.button--secondary.button--text[data-v-e970cf04]{--button-background-hover:var(--theme-neutral-200);--button-background-active:var(--theme-neutral-250);--button-outline-color:var(--theme-neutral-500);--button-background-focus:var(--theme-neutral-250)}.button--secondary-blue[data-v-e970cf04]{--button-background:var(--theme-secondary-200);--button-color:var(--theme-neutral-text-body);--button-background-hover:var(--theme-secondary-300);--button-background-active:var(--theme-secondary-350);--button-background-disabled:var(--theme-neutral-surface-disabled)}.button--link[data-v-e970cf04]{--button-color:var(--theme-info-400)}.button--link[data-v-e970cf04],.button--text-plain[data-v-e970cf04]{--button-height:auto;--button-padding-x:0;--button-radius:.25rem;--button-shadow:none;--button-outline-offset:.25rem}.button--link[data-v-e970cf04]:hover:not(:disabled){text-underline-offset:.125rem;text-decoration:underline}.button--icon-end[data-v-e970cf04]{flex-direction:row-reverse}.button--icon-only[data-v-e970cf04]{width:var(--button-height);padding:0}.button--rounded[data-v-e970cf04]{--button-radius:6.1875rem}.button--full[data-v-e970cf04]{width:100%}.button--loading[data-v-e970cf04]{cursor:wait}.button__icon[data-v-e970cf04]{width:var(--button-icon-size);height:var(--button-icon-size);color:currentColor;flex-shrink:0}.button__label[data-v-e970cf04]{white-space:nowrap}.button__spinner[data-v-e970cf04]{box-sizing:border-box;width:var(--button-icon-size);height:var(--button-icon-size);border:.125rem solid;border-top-color:#0000;border-radius:50%;flex-shrink:0;animation:.6s linear infinite button-spin-e970cf04}@keyframes button-spin-e970cf04{to{transform:rotate(1turn)}}@media (prefers-reduced-motion:reduce){.button__spinner[data-v-e970cf04]{animation:none}}
|
|
@@ -2,7 +2,7 @@ import './Button.css';
|
|
|
2
2
|
import o from "./Button.vue2.js";
|
|
3
3
|
/* empty css */
|
|
4
4
|
import t from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
5
|
-
const
|
|
5
|
+
const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-e970cf04"]]);
|
|
6
6
|
export {
|
|
7
|
-
|
|
7
|
+
p as default
|
|
8
8
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.combobox[data-v-
|
|
1
|
+
.combobox[data-v-461ad782]{--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-461ad782]{--combobox-field-height:2.25rem;--combobox-label-font-size:.75rem}.combobox--large[data-v-461ad782]{--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-461ad782]{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;align-items:center;gap:.125rem;padding:.375rem .5rem;display:flex}.combobox__required[data-v-461ad782]{color:var(--theme-error-500);flex-shrink:0}.combobox__field[data-v-461ad782]{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-461ad782]{flex:auto;align-items:center;gap:.25rem;min-width:0;display:flex}.combobox__input[data-v-461ad782]{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-461ad782]{font-size:1rem}}.combobox__input[data-v-461ad782]::placeholder{color:var(--theme-neutral-550)}.combobox__input[data-v-461ad782]:disabled{color:var(--theme-neutral-text-disabled);cursor:not-allowed}.combobox__input[data-v-461ad782]:disabled::placeholder{color:var(--theme-neutral-text-disabled)}.combobox__input[data-v-461ad782]:read-only{cursor:pointer}.combobox__chips[data-v-461ad782]{flex:0 auto;order:1;align-items:center;gap:.25rem;min-width:0;display:flex;overflow:hidden}.combobox__chip[data-v-461ad782]{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-461ad782]{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.combobox__chip-remove[data-v-461ad782]{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-461ad782]:hover:not(:disabled){color:var(--theme-neutral-text-body)}.combobox__chip-remove[data-v-461ad782]:focus-visible{outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem}.combobox__chip-remove[data-v-461ad782]:disabled{cursor:not-allowed}.combobox__chip-icon[data-v-461ad782],.combobox__chip-avatar[data-v-461ad782]{flex-shrink:0;width:.75rem;height:.75rem}.combobox__chip-avatar[data-v-461ad782]{object-fit:cover;border-radius:50%}.combobox__chip--measured[data-v-461ad782]{visibility:hidden;pointer-events:none;position:absolute;top:0;left:-9999px}.combobox__chip--counter[data-v-461ad782]{color:var(--theme-neutral-text-caption);flex-shrink:0;order:2}.combobox__clear-button[data-v-461ad782]{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-461ad782]:hover{color:var(--theme-neutral-text-body)}.combobox__clear-button[data-v-461ad782]:focus-visible{outline:2px solid var(--theme-primary-500);outline-offset:2px}.combobox__clear[data-v-461ad782]{width:1rem;height:1rem}.combobox__arrow-button[data-v-461ad782]{cursor:pointer;background:0 0;border:none;flex-shrink:0;align-items:center;margin:0;padding:0;display:flex}.combobox__arrow-button[data-v-461ad782]:disabled{cursor:not-allowed}.combobox__arrow[data-v-461ad782]{width:1.125rem;height:1.125rem;color:var(--theme-neutral-text-body);transition:transform var(--animation-duration-fast) ease}.combobox__message[data-v-461ad782]{color:var(--theme-neutral-text-body);margin:0;padding:.25rem .5rem;font-size:.625rem;font-weight:400;line-height:1.2}.combobox[data-v-461ad782]:hover:not(.combobox--disabled){--combobox-border-color:var(--theme-primary-300)}.combobox--open[data-v-461ad782],.combobox--open[data-v-461ad782]:hover{--combobox-border-color:var(--theme-primary-500)}.combobox--open .combobox__arrow[data-v-461ad782]{transform:rotate(180deg)}.combobox--invalid[data-v-461ad782]{--combobox-border-color:var(--theme-error-500)}.combobox--invalid .combobox__label[data-v-461ad782],.combobox--invalid .combobox__message[data-v-461ad782]{color:var(--theme-error-500)}.combobox--invalid[data-v-461ad782]:hover:not(.combobox--disabled){--combobox-border-color:var(--theme-error-500)}.combobox--disabled[data-v-461ad782]{--combobox-border-color:var(--theme-neutral-border-disabled)}.combobox--disabled .combobox__field[data-v-461ad782]{cursor:not-allowed}.combobox--disabled .combobox__label[data-v-461ad782],.combobox--disabled .combobox__message[data-v-461ad782],.combobox--disabled .combobox__arrow[data-v-461ad782]{color:var(--theme-neutral-text-disabled)}.combobox--disabled .combobox__label[data-v-461ad782]{cursor:not-allowed}.combobox__field[data-v-461ad782]:has(.combobox__input:focus-visible){outline:.125rem solid var(--theme-primary-500);outline-offset:.125rem}.combobox-list[data-v-461ad782]{flex-direction:column;display:flex}.combobox-list__search[data-v-461ad782]{padding:.5rem .5rem 0}.combobox-list__scroll[data-v-461ad782]{max-height:15rem;overflow-y:auto}.combobox-list__options[data-v-461ad782]{flex-direction:column;gap:.5rem;height:max-content;padding:.5rem;display:flex}.combobox-list__option[data-v-461ad782]{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-461ad782]:hover:not(.combobox-list__option--disabled),.combobox-list__option--active[data-v-461ad782]{background-color:var(--theme-secondary-50)}.combobox-list__option--disabled[data-v-461ad782]{cursor:not-allowed;opacity:.5}.combobox-list__label[data-v-461ad782]{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-width:0;overflow:hidden}.combobox-list__status[data-v-461ad782]{color:var(--theme-neutral-text-caption);margin:0;padding:.25rem .5rem;font-size:.875rem;line-height:1.25rem}
|
|
@@ -51,6 +51,10 @@ export interface ComboboxSlots<T extends ComboboxOptionData = ComboboxOptionData
|
|
|
51
51
|
/**
|
|
52
52
|
* Пустой список. `notFound` разделяет два случая: вариантов нет вовсе
|
|
53
53
|
* (`false`) или ни один не подошёл под запрос (`true`).
|
|
54
|
+
*
|
|
55
|
+
* Различает по непустому запросу, поэтому работает и при `filter: false`,
|
|
56
|
+
* где фильтрует сервер и «не нашли» приходит таким же пустым `options`,
|
|
57
|
+
* как и «вариантов нет».
|
|
54
58
|
*/
|
|
55
59
|
empty?: (props: {
|
|
56
60
|
notFound: boolean;
|
|
@@ -111,9 +115,13 @@ export interface ComboboxProps<T extends ComboboxOptionData = ComboboxOptionData
|
|
|
111
115
|
* её, запрос было бы негде набрать.
|
|
112
116
|
*/
|
|
113
117
|
hideEmptyList?: boolean;
|
|
114
|
-
/** Текст пустого списка, когда
|
|
118
|
+
/** Текст пустого списка, когда запроса ещё не было, а показывать нечего. */
|
|
115
119
|
emptyText?: string;
|
|
116
|
-
/**
|
|
120
|
+
/**
|
|
121
|
+
* Текст пустого списка, когда под запрос ничего не подошло. Показывается,
|
|
122
|
+
* как только в поле есть непустой запрос, — в том числе при
|
|
123
|
+
* `filter: false`, где пустой ответ приходит с сервера.
|
|
124
|
+
*/
|
|
117
125
|
notFoundText?: string;
|
|
118
126
|
/** Текст строки загрузки при `loading`. */
|
|
119
127
|
loadingText?: string;
|
|
@@ -2,7 +2,7 @@ import './Combobox.css';
|
|
|
2
2
|
import o from "./Combobox.vue2.js";
|
|
3
3
|
/* empty css */
|
|
4
4
|
import t from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
5
|
-
const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-
|
|
5
|
+
const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-461ad782"]]);
|
|
6
6
|
export {
|
|
7
7
|
p as default
|
|
8
8
|
};
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { Search as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import { useIsMobile as
|
|
8
|
-
import { useTestId as
|
|
9
|
-
const
|
|
1
|
+
import { defineComponent as ze, useModel as _e, useId as Ue, useAttrs as Xe, computed as u, ref as E, useTemplateRef as I, shallowRef as Ke, watch as R, onMounted as je, nextTick as W, onBeforeUnmount as Qe, openBlock as r, createElementBlock as v, mergeProps as f, unref as s, createTextVNode as Y, toDisplayString as w, createCommentVNode as x, createVNode as M, withCtx as Z, createElementVNode as y, renderSlot as G, Fragment as we, renderList as Ce, createBlock as ee, resolveDynamicComponent as He, withModifiers as ae, mergeModels as Ie } from "vue";
|
|
2
|
+
import { Search as Je, CircleX as Ye, X as Ze, ChevronDown as ea } from "@lucide/vue";
|
|
3
|
+
import aa from "../Input/Input.vue.js";
|
|
4
|
+
import la from "../Popover/Popover.vue.js";
|
|
5
|
+
import ta from "../Radio/RadioMarker.vue.js";
|
|
6
|
+
import oa from "../Select/SelectCheckMarker.vue.js";
|
|
7
|
+
import { useIsMobile as ia } from "../shared/useIsMobile.util.js";
|
|
8
|
+
import { useTestId as sa } from "../shared/useTestId.util.js";
|
|
9
|
+
const ua = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "aria-label", "aria-describedby", "aria-activedescendant", "aria-required"], na = ["aria-hidden"], ra = ["src"], ca = { class: "combobox__chip-label" }, da = ["disabled", "tabindex", "aria-label", "onClick"], va = ["aria-hidden"], fa = ["aria-label"], ba = ["disabled"], ma = { class: "combobox-list" }, ha = {
|
|
10
10
|
key: 0,
|
|
11
11
|
class: "combobox-list__search"
|
|
12
|
-
},
|
|
12
|
+
}, pa = ["aria-label", "aria-multiselectable"], xa = ["id", "aria-selected", "aria-disabled", "onClick", "onMouseenter"], ya = { class: "combobox-list__label" }, ga = 64, Ta = /* @__PURE__ */ ze({
|
|
13
13
|
inheritAttrs: !1,
|
|
14
14
|
__name: "Combobox",
|
|
15
|
-
props: /* @__PURE__ */
|
|
15
|
+
props: /* @__PURE__ */ Ie({
|
|
16
16
|
options: {},
|
|
17
17
|
multiple: { type: Boolean, default: !1 },
|
|
18
18
|
filter: { type: Boolean, default: !0 },
|
|
@@ -46,18 +46,18 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
46
46
|
search: { default: "" },
|
|
47
47
|
searchModifiers: {}
|
|
48
48
|
}),
|
|
49
|
-
emits: /* @__PURE__ */
|
|
50
|
-
setup(i, { emit:
|
|
51
|
-
const o = i, p =
|
|
49
|
+
emits: /* @__PURE__ */ Ie(["change", "select", "search", "clear"], ["update:modelValue", "update:search"]),
|
|
50
|
+
setup(i, { emit: Re }) {
|
|
51
|
+
const o = i, p = Re, S = _e(i, "modelValue"), n = _e(i, "search"), N = Ue(), le = `combobox-input-${N}`, te = `combobox-label-${N}`, C = `combobox-list-${N}`, oe = `combobox-message-${N}`, d = sa(() => o.testId), z = Xe(), Me = u(() => ({
|
|
52
52
|
class: z.class,
|
|
53
53
|
style: z.style
|
|
54
|
-
})),
|
|
54
|
+
})), Se = u(() => {
|
|
55
55
|
const { class: e, style: a, ...l } = z;
|
|
56
56
|
return l;
|
|
57
|
-
}), k =
|
|
57
|
+
}), k = ia(o.breakpointMobile), b = E(!1), ie = I("fieldRef"), V = I("contentRef"), se = I("chipsRef"), ue = I("counterRef"), L = I("inputRef"), ne = I("listRef"), _ = E(Number.MAX_SAFE_INTEGER), U = E(0), c = E(-1), m = u(() => {
|
|
58
58
|
const e = S.value;
|
|
59
59
|
return e == null ? [] : Array.isArray(e) ? e : [e];
|
|
60
|
-
}), X =
|
|
60
|
+
}), X = Ke(/* @__PURE__ */ new Map());
|
|
61
61
|
R(
|
|
62
62
|
[m, () => o.options],
|
|
63
63
|
() => {
|
|
@@ -81,53 +81,53 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
81
81
|
() => T.value.map((e) => e.label).join(", ")
|
|
82
82
|
), K = u(
|
|
83
83
|
() => o.multiple && T.value.length > 0
|
|
84
|
-
),
|
|
84
|
+
), Te = u(
|
|
85
85
|
() => !o.multiple && !o.disabled && m.value.length > 0
|
|
86
|
-
),
|
|
86
|
+
), $e = u(() => "Очистить поле"), D = u(
|
|
87
87
|
() => Math.max(0, T.value.length - _.value)
|
|
88
|
-
), $ = E(!1),
|
|
88
|
+
), $ = E(!1), Ae = u(() => b.value && $.value ? n.value : o.multiple ? "" : re.value), Be = u(() => K.value ? "" : o.placeholder), g = u(() => {
|
|
89
89
|
const e = n.value.trim().toLowerCase();
|
|
90
90
|
return !o.filter || !e ? o.options : o.options.filter(
|
|
91
91
|
(a) => a.label.toLowerCase().includes(e)
|
|
92
92
|
);
|
|
93
|
-
}),
|
|
93
|
+
}), Ee = u(
|
|
94
94
|
() => o.loading || g.value.length > 0
|
|
95
|
-
),
|
|
96
|
-
get: () => b.value && (!o.hideEmptyList || k.value ||
|
|
95
|
+
), ce = u(() => n.value.trim().length > 0), de = u(() => ce.value || o.options.length > 0), F = u({
|
|
96
|
+
get: () => b.value && (!o.hideEmptyList || k.value || Ee.value || ce.value),
|
|
97
97
|
set: (e) => {
|
|
98
98
|
b.value = e;
|
|
99
99
|
}
|
|
100
100
|
}), j = u(
|
|
101
101
|
() => o.invalid ? o.errorText ?? o.supportText : o.supportText
|
|
102
|
-
),
|
|
103
|
-
() =>
|
|
102
|
+
), Ne = u(() => o.width ?? U.value), ve = u(
|
|
103
|
+
() => F.value && c.value !== -1 ? `${C}-option-${c.value}` : void 0
|
|
104
104
|
), Ve = u(() => [
|
|
105
105
|
"combobox",
|
|
106
106
|
`combobox--${o.size}`,
|
|
107
107
|
{
|
|
108
108
|
/* Стрелка и рамка следуют за видимым списком, а не за намерением открыть. */
|
|
109
|
-
"combobox--open":
|
|
109
|
+
"combobox--open": F.value,
|
|
110
110
|
"combobox--invalid": o.invalid,
|
|
111
111
|
"combobox--disabled": o.disabled,
|
|
112
112
|
"combobox--multiple": o.multiple
|
|
113
113
|
}
|
|
114
114
|
]);
|
|
115
|
-
function
|
|
115
|
+
function A(e) {
|
|
116
116
|
return m.value.includes(e);
|
|
117
117
|
}
|
|
118
118
|
function Q(e) {
|
|
119
119
|
const a = g.value[e];
|
|
120
120
|
return !!a && !a?.disabled;
|
|
121
121
|
}
|
|
122
|
-
function
|
|
122
|
+
function fe() {
|
|
123
123
|
return g.value.findIndex((e, a) => Q(a));
|
|
124
124
|
}
|
|
125
|
-
function
|
|
125
|
+
function Le() {
|
|
126
126
|
for (let e = g.value.length - 1; e >= 0; e -= 1)
|
|
127
127
|
if (Q(e)) return e;
|
|
128
128
|
return -1;
|
|
129
129
|
}
|
|
130
|
-
function
|
|
130
|
+
function be(e, a) {
|
|
131
131
|
const l = g.value.length;
|
|
132
132
|
if (l === 0) return -1;
|
|
133
133
|
let t = e;
|
|
@@ -135,20 +135,20 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
135
135
|
if (t = (t + a + l) % l, Q(t)) return t;
|
|
136
136
|
return -1;
|
|
137
137
|
}
|
|
138
|
-
function
|
|
138
|
+
function q() {
|
|
139
139
|
k.value || L.value?.focus();
|
|
140
140
|
}
|
|
141
|
-
function
|
|
141
|
+
function B() {
|
|
142
142
|
o.disabled || b.value || (b.value = !0);
|
|
143
143
|
}
|
|
144
144
|
function O() {
|
|
145
145
|
b.value = !1;
|
|
146
146
|
}
|
|
147
|
-
function
|
|
148
|
-
o.disabled || (S.value = void 0, p("change", void 0), p("clear"), $.value = !1, n.value && (n.value = "", p("search", "")),
|
|
147
|
+
function De() {
|
|
148
|
+
o.disabled || (S.value = void 0, p("change", void 0), p("clear"), $.value = !1, n.value && (n.value = "", p("search", "")), q());
|
|
149
149
|
}
|
|
150
|
-
function
|
|
151
|
-
e.stopPropagation(), !o.disabled && (
|
|
150
|
+
function Fe(e) {
|
|
151
|
+
e.stopPropagation(), !o.disabled && (B(), q());
|
|
152
152
|
}
|
|
153
153
|
function qe() {
|
|
154
154
|
if (!o.disabled) {
|
|
@@ -156,40 +156,40 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
156
156
|
O();
|
|
157
157
|
return;
|
|
158
158
|
}
|
|
159
|
-
|
|
159
|
+
B(), q();
|
|
160
160
|
}
|
|
161
161
|
}
|
|
162
|
-
function
|
|
162
|
+
function me(e) {
|
|
163
163
|
const a = e.target.value;
|
|
164
|
-
$.value = !0, n.value = a, p("search", a),
|
|
164
|
+
$.value = !0, n.value = a, p("search", a), B();
|
|
165
165
|
}
|
|
166
|
-
function
|
|
166
|
+
function Oe(e) {
|
|
167
167
|
k.value || e.preventDefault();
|
|
168
168
|
}
|
|
169
|
-
function
|
|
169
|
+
function Pe(e, a) {
|
|
170
170
|
a || (c.value = e);
|
|
171
171
|
}
|
|
172
|
-
function
|
|
172
|
+
function he(e) {
|
|
173
173
|
switch (e.key) {
|
|
174
174
|
case "ArrowDown":
|
|
175
175
|
if (e.preventDefault(), !b.value) {
|
|
176
|
-
|
|
176
|
+
B();
|
|
177
177
|
break;
|
|
178
178
|
}
|
|
179
|
-
c.value =
|
|
179
|
+
c.value = be(c.value, 1);
|
|
180
180
|
break;
|
|
181
181
|
case "ArrowUp":
|
|
182
182
|
if (e.preventDefault(), !b.value) {
|
|
183
|
-
|
|
183
|
+
B();
|
|
184
184
|
break;
|
|
185
185
|
}
|
|
186
|
-
c.value = c.value === -1 ?
|
|
186
|
+
c.value = c.value === -1 ? Le() : be(c.value, -1);
|
|
187
187
|
break;
|
|
188
188
|
case "Enter": {
|
|
189
189
|
if (!b.value) break;
|
|
190
190
|
const a = g.value[c.value];
|
|
191
191
|
if (!a) break;
|
|
192
|
-
e.preventDefault(),
|
|
192
|
+
e.preventDefault(), pe(a);
|
|
193
193
|
break;
|
|
194
194
|
}
|
|
195
195
|
case "Escape":
|
|
@@ -206,29 +206,29 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
206
206
|
if (!o.multiple || n.value) break;
|
|
207
207
|
const a = m.value[m.value.length - 1];
|
|
208
208
|
if (a === void 0) break;
|
|
209
|
-
|
|
209
|
+
xe(a);
|
|
210
210
|
break;
|
|
211
211
|
}
|
|
212
212
|
}
|
|
213
213
|
}
|
|
214
|
-
function
|
|
214
|
+
function pe(e) {
|
|
215
215
|
if (!(e.disabled || o.disabled)) {
|
|
216
216
|
if (o.multiple) {
|
|
217
|
-
const a =
|
|
218
|
-
S.value = a, p("change", a), n.value && (n.value = "", p("search", "")),
|
|
217
|
+
const a = A(e.value) ? m.value.filter((l) => l !== e.value) : [...m.value, e.value];
|
|
218
|
+
S.value = a, p("change", a), n.value && (n.value = "", p("search", "")), q();
|
|
219
219
|
} else
|
|
220
220
|
S.value = e.value, p("change", e.value), O(), k.value || L.value?.focus();
|
|
221
221
|
p("select", e);
|
|
222
222
|
}
|
|
223
223
|
}
|
|
224
|
-
function
|
|
224
|
+
function xe(e) {
|
|
225
225
|
if (o.disabled) return;
|
|
226
226
|
const a = m.value.filter((l) => l !== e);
|
|
227
227
|
S.value = a, p("change", a);
|
|
228
228
|
}
|
|
229
229
|
function H() {
|
|
230
230
|
if (!o.multiple) return;
|
|
231
|
-
const e =
|
|
231
|
+
const e = V.value, a = se.value;
|
|
232
232
|
if (!e || !a) return;
|
|
233
233
|
const l = Array.from(
|
|
234
234
|
a.querySelectorAll('[data-chip="item"]')
|
|
@@ -237,39 +237,39 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
237
237
|
_.value = Number.MAX_SAFE_INTEGER;
|
|
238
238
|
return;
|
|
239
239
|
}
|
|
240
|
-
const t = Number.parseFloat(getComputedStyle(a).columnGap) || 0, h = Number.parseFloat(getComputedStyle(e).columnGap) || 0,
|
|
241
|
-
let
|
|
242
|
-
for (const
|
|
243
|
-
const
|
|
244
|
-
if (
|
|
245
|
-
|
|
240
|
+
const t = Number.parseFloat(getComputedStyle(a).columnGap) || 0, h = Number.parseFloat(getComputedStyle(e).columnGap) || 0, ye = D.value ? (ue.value?.offsetWidth ?? 0) + h : 0, We = e.clientWidth - ye - ga - h;
|
|
241
|
+
let ge = 0, J = 0;
|
|
242
|
+
for (const Ge of l) {
|
|
243
|
+
const ke = ge + (J ? t : 0) + Ge.offsetWidth;
|
|
244
|
+
if (ke > We) break;
|
|
245
|
+
ge = ke, J += 1;
|
|
246
246
|
}
|
|
247
247
|
_.value = Math.max(J, 1);
|
|
248
248
|
}
|
|
249
249
|
let P;
|
|
250
|
-
return
|
|
250
|
+
return je(() => {
|
|
251
251
|
const e = ie.value;
|
|
252
252
|
e && (U.value = e.getBoundingClientRect().width, W(H), P = new ResizeObserver((a) => {
|
|
253
253
|
for (const l of a)
|
|
254
254
|
l.target === e && (U.value = l.borderBoxSize?.[0]?.inlineSize ?? e.getBoundingClientRect().width);
|
|
255
255
|
H();
|
|
256
|
-
}), P.observe(e),
|
|
257
|
-
}),
|
|
256
|
+
}), P.observe(e), V.value && P.observe(V.value));
|
|
257
|
+
}), Qe(() => P?.disconnect()), R(
|
|
258
258
|
() => T.value.map((e) => e.value).join("|"),
|
|
259
259
|
() => {
|
|
260
260
|
_.value = Number.MAX_SAFE_INTEGER, W(H);
|
|
261
261
|
}
|
|
262
262
|
), R([g, n], () => {
|
|
263
|
-
c.value = n.value ?
|
|
263
|
+
c.value = n.value ? fe() : -1;
|
|
264
264
|
}), R(b, (e) => {
|
|
265
265
|
if (e) {
|
|
266
|
-
c.value = n.value ?
|
|
266
|
+
c.value = n.value ? fe() : -1, $.value = !1, !k.value && !o.multiple && re.value && W(() => L.value?.select());
|
|
267
267
|
return;
|
|
268
268
|
}
|
|
269
269
|
c.value = -1, $.value = !1, n.value && (n.value = "", p("search", ""));
|
|
270
270
|
}), R(c, (e) => {
|
|
271
271
|
e !== -1 && W(() => {
|
|
272
|
-
|
|
272
|
+
ne.value?.querySelector(
|
|
273
273
|
`#${CSS.escape(`${C}-option-${e}`)}`
|
|
274
274
|
)?.scrollIntoView({ block: "nearest" });
|
|
275
275
|
});
|
|
@@ -278,7 +278,7 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
278
278
|
(e) => {
|
|
279
279
|
e && O();
|
|
280
280
|
}
|
|
281
|
-
), (e, a) => (r(), v("div", f({ class: Ve.value }, { ...
|
|
281
|
+
), (e, a) => (r(), v("div", f({ class: Ve.value }, { ...Me.value, ...s(d)("root") }), [
|
|
282
282
|
i.label ? (r(), v("label", f({
|
|
283
283
|
key: 0,
|
|
284
284
|
id: te,
|
|
@@ -292,10 +292,10 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
292
292
|
"aria-hidden": "true"
|
|
293
293
|
}, s(d)("required")), "*", 16)) : x("", !0)
|
|
294
294
|
], 16)) : x("", !0),
|
|
295
|
-
M(s(
|
|
296
|
-
open:
|
|
297
|
-
"onUpdate:open": a[1] || (a[1] = (l) =>
|
|
298
|
-
width:
|
|
295
|
+
M(s(la), {
|
|
296
|
+
open: F.value,
|
|
297
|
+
"onUpdate:open": a[1] || (a[1] = (l) => F.value = l),
|
|
298
|
+
width: Ne.value,
|
|
299
299
|
side: i.side,
|
|
300
300
|
"side-offset": i.sideOffset,
|
|
301
301
|
align: i.align,
|
|
@@ -312,10 +312,10 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
312
312
|
ref_key: "fieldRef",
|
|
313
313
|
ref: ie,
|
|
314
314
|
class: "combobox__field"
|
|
315
|
-
}, s(d)("field"), { onClick:
|
|
315
|
+
}, s(d)("field"), { onClick: Fe }), [
|
|
316
316
|
y("div", {
|
|
317
317
|
ref_key: "contentRef",
|
|
318
|
-
ref:
|
|
318
|
+
ref: V,
|
|
319
319
|
class: "combobox__content"
|
|
320
320
|
}, [
|
|
321
321
|
y("input", f({
|
|
@@ -328,30 +328,30 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
328
328
|
autocomplete: "off",
|
|
329
329
|
spellcheck: "false",
|
|
330
330
|
"aria-autocomplete": "list",
|
|
331
|
-
value:
|
|
332
|
-
placeholder:
|
|
331
|
+
value: Ae.value,
|
|
332
|
+
placeholder: Be.value,
|
|
333
333
|
disabled: i.disabled,
|
|
334
334
|
readonly: s(k),
|
|
335
335
|
"aria-labelledby": i.label ? te : void 0,
|
|
336
336
|
"aria-label": i.label ? void 0 : i.ariaLabel,
|
|
337
337
|
"aria-describedby": j.value ? oe : void 0,
|
|
338
|
-
"aria-activedescendant":
|
|
338
|
+
"aria-activedescendant": ve.value,
|
|
339
339
|
"aria-required": i.required || void 0
|
|
340
340
|
}, {
|
|
341
341
|
...l,
|
|
342
|
-
...
|
|
342
|
+
...Se.value,
|
|
343
343
|
...s(d)("input")
|
|
344
344
|
}, {
|
|
345
|
-
onInput:
|
|
346
|
-
onKeydown:
|
|
347
|
-
}), null, 16,
|
|
345
|
+
onInput: me,
|
|
346
|
+
onKeydown: he
|
|
347
|
+
}), null, 16, ua),
|
|
348
348
|
K.value ? (r(), v("span", {
|
|
349
349
|
key: 0,
|
|
350
350
|
ref_key: "chipsRef",
|
|
351
351
|
ref: se,
|
|
352
352
|
class: "combobox__chips"
|
|
353
353
|
}, [
|
|
354
|
-
(r(!0), v(
|
|
354
|
+
(r(!0), v(we, null, Ce(T.value, (t, h) => (r(), v("span", f({
|
|
355
355
|
key: t.value,
|
|
356
356
|
"data-chip": "item",
|
|
357
357
|
class: ["combobox__chip", {
|
|
@@ -368,12 +368,12 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
368
368
|
class: "combobox__chip-avatar",
|
|
369
369
|
src: t.avatar,
|
|
370
370
|
alt: ""
|
|
371
|
-
}, null, 8,
|
|
371
|
+
}, null, 8, ra)) : t.icon ? (r(), ee(He(t.icon), {
|
|
372
372
|
key: 1,
|
|
373
373
|
class: "combobox__chip-icon",
|
|
374
374
|
"aria-hidden": "true"
|
|
375
375
|
})) : x("", !0),
|
|
376
|
-
y("span",
|
|
376
|
+
y("span", ca, w(t.label), 1)
|
|
377
377
|
], !0),
|
|
378
378
|
y("button", f({
|
|
379
379
|
type: "button",
|
|
@@ -382,38 +382,38 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
382
382
|
tabindex: h >= _.value ? -1 : void 0,
|
|
383
383
|
"aria-label": `Убрать ${t.label}`
|
|
384
384
|
}, { ref_for: !0 }, s(d)("chip-remove", t.value), {
|
|
385
|
-
onClick: ae((
|
|
385
|
+
onClick: ae((ye) => xe(t.value), ["stop"])
|
|
386
386
|
}), [
|
|
387
|
-
M(s(
|
|
387
|
+
M(s(Ye), {
|
|
388
388
|
class: "combobox__chip-icon",
|
|
389
389
|
"aria-hidden": "true"
|
|
390
390
|
})
|
|
391
|
-
], 16,
|
|
391
|
+
], 16, da)
|
|
392
392
|
], 16, na))), 128))
|
|
393
393
|
], 512)) : x("", !0),
|
|
394
394
|
K.value ? (r(), v("span", f({
|
|
395
395
|
key: 1,
|
|
396
396
|
ref_key: "counterRef",
|
|
397
|
-
ref:
|
|
397
|
+
ref: ue,
|
|
398
398
|
class: ["combobox__chip combobox__chip--counter", {
|
|
399
399
|
"combobox__chip--measured": !D.value
|
|
400
400
|
}],
|
|
401
401
|
"aria-hidden": !D.value || void 0
|
|
402
|
-
}, s(d)("chip-counter")), " +" + w(D.value || 1), 17,
|
|
402
|
+
}, s(d)("chip-counter")), " +" + w(D.value || 1), 17, va)) : x("", !0)
|
|
403
403
|
], 512),
|
|
404
|
-
|
|
404
|
+
Te.value ? (r(), v("button", f({
|
|
405
405
|
key: 0,
|
|
406
406
|
type: "button",
|
|
407
407
|
class: "combobox__clear-button",
|
|
408
|
-
"aria-label":
|
|
408
|
+
"aria-label": $e.value
|
|
409
409
|
}, s(d)("clear"), {
|
|
410
|
-
onClick: ae(
|
|
410
|
+
onClick: ae(De, ["stop"])
|
|
411
411
|
}), [
|
|
412
|
-
M(s(
|
|
412
|
+
M(s(Ze), {
|
|
413
413
|
class: "combobox__clear",
|
|
414
414
|
"aria-hidden": "true"
|
|
415
415
|
})
|
|
416
|
-
], 16,
|
|
416
|
+
], 16, fa)) : x("", !0),
|
|
417
417
|
y("button", f({
|
|
418
418
|
type: "button",
|
|
419
419
|
class: "combobox__arrow-button",
|
|
@@ -423,39 +423,39 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
423
423
|
}, s(d)("arrow"), {
|
|
424
424
|
onClick: ae(qe, ["stop"])
|
|
425
425
|
}), [
|
|
426
|
-
M(s(
|
|
427
|
-
], 16,
|
|
426
|
+
M(s(ea), { class: "combobox__arrow" })
|
|
427
|
+
], 16, ba)
|
|
428
428
|
], 16)
|
|
429
429
|
]),
|
|
430
430
|
default: Z(() => [
|
|
431
|
-
y("div",
|
|
432
|
-
s(k) ? (r(), v("div",
|
|
433
|
-
M(s(
|
|
431
|
+
y("div", ma, [
|
|
432
|
+
s(k) ? (r(), v("div", ha, [
|
|
433
|
+
M(s(aa), f({
|
|
434
434
|
modelValue: n.value,
|
|
435
435
|
"onUpdate:modelValue": a[0] || (a[0] = (l) => n.value = l),
|
|
436
436
|
"native-type": "search",
|
|
437
437
|
placeholder: i.searchPlaceholder,
|
|
438
438
|
"aria-label": i.searchPlaceholder,
|
|
439
439
|
"aria-controls": C,
|
|
440
|
-
"aria-activedescendant":
|
|
440
|
+
"aria-activedescendant": ve.value,
|
|
441
441
|
"aria-autocomplete": "list",
|
|
442
442
|
autocomplete: "off",
|
|
443
443
|
spellcheck: "false"
|
|
444
444
|
}, s(d)("search"), {
|
|
445
|
-
onInput:
|
|
446
|
-
onKeydown:
|
|
445
|
+
onInput: me,
|
|
446
|
+
onKeydown: he
|
|
447
447
|
}), {
|
|
448
448
|
prefix: Z(() => [
|
|
449
|
-
M(s(
|
|
449
|
+
M(s(Je), { "aria-hidden": "true" })
|
|
450
450
|
]),
|
|
451
451
|
_: 1
|
|
452
452
|
}, 16, ["modelValue", "placeholder", "aria-label", "aria-activedescendant"])
|
|
453
453
|
])) : x("", !0),
|
|
454
454
|
y("div", {
|
|
455
455
|
ref_key: "listRef",
|
|
456
|
-
ref:
|
|
456
|
+
ref: ne,
|
|
457
457
|
class: "combobox-list__scroll",
|
|
458
|
-
onMousedown:
|
|
458
|
+
onMousedown: Oe
|
|
459
459
|
}, [
|
|
460
460
|
y("div", {
|
|
461
461
|
id: C,
|
|
@@ -472,7 +472,7 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
472
472
|
Y(w(i.loadingText), 1)
|
|
473
473
|
], !0)
|
|
474
474
|
], 16)) : x("", !0),
|
|
475
|
-
(r(!0), v(
|
|
475
|
+
(r(!0), v(we, null, Ce(g.value, (l, t) => (r(), v("div", f({
|
|
476
476
|
id: `${C}-option-${t}`,
|
|
477
477
|
key: l.value,
|
|
478
478
|
role: "option",
|
|
@@ -480,43 +480,41 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
480
480
|
"combobox-list__option--active": c.value === t,
|
|
481
481
|
"combobox-list__option--disabled": l.disabled
|
|
482
482
|
}],
|
|
483
|
-
"aria-selected":
|
|
483
|
+
"aria-selected": A(l.value),
|
|
484
484
|
"aria-disabled": l.disabled || void 0
|
|
485
485
|
}, { ref_for: !0 }, s(d)("option", l.value), {
|
|
486
|
-
onClick: (h) =>
|
|
487
|
-
onMouseenter: (h) =>
|
|
486
|
+
onClick: (h) => pe(l),
|
|
487
|
+
onMouseenter: (h) => Pe(t, l.disabled)
|
|
488
488
|
}), [
|
|
489
|
-
i.multiple ? (r(), ee(
|
|
489
|
+
i.multiple ? (r(), ee(oa, {
|
|
490
490
|
key: 0,
|
|
491
|
-
checked:
|
|
491
|
+
checked: A(l.value),
|
|
492
492
|
disabled: l.disabled,
|
|
493
493
|
state: c.value === t ? "hover" : "default"
|
|
494
|
-
}, null, 8, ["checked", "disabled", "state"])) : (r(), ee(s(
|
|
494
|
+
}, null, 8, ["checked", "disabled", "state"])) : (r(), ee(s(ta), {
|
|
495
495
|
key: 1,
|
|
496
|
-
checked:
|
|
496
|
+
checked: A(l.value),
|
|
497
497
|
disabled: l.disabled,
|
|
498
498
|
state: c.value === t ? "hover" : "default"
|
|
499
499
|
}, null, 8, ["checked", "disabled", "state"])),
|
|
500
500
|
G(e.$slots, "option", {
|
|
501
501
|
option: l,
|
|
502
|
-
selected:
|
|
502
|
+
selected: A(l.value),
|
|
503
503
|
active: c.value === t,
|
|
504
504
|
index: t
|
|
505
505
|
}, () => [
|
|
506
|
-
y("span",
|
|
506
|
+
y("span", ya, w(l.label), 1)
|
|
507
507
|
], !0)
|
|
508
|
-
], 16,
|
|
508
|
+
], 16, xa))), 128)),
|
|
509
509
|
!i.loading && !g.value.length ? (r(), v("p", f({
|
|
510
510
|
key: 1,
|
|
511
511
|
class: "combobox-list__status"
|
|
512
512
|
}, s(d)("empty")), [
|
|
513
|
-
G(e.$slots, "empty", {
|
|
514
|
-
|
|
515
|
-
}, () => [
|
|
516
|
-
Y(w(i.options.length ? i.notFoundText : i.emptyText), 1)
|
|
513
|
+
G(e.$slots, "empty", { notFound: de.value }, () => [
|
|
514
|
+
Y(w(de.value ? i.notFoundText : i.emptyText), 1)
|
|
517
515
|
], !0)
|
|
518
516
|
], 16)) : x("", !0)
|
|
519
|
-
], 8,
|
|
517
|
+
], 8, pa)
|
|
520
518
|
], 544)
|
|
521
519
|
])
|
|
522
520
|
]),
|
|
@@ -531,5 +529,5 @@ const sa = ["value", "placeholder", "disabled", "readonly", "aria-labelledby", "
|
|
|
531
529
|
}
|
|
532
530
|
});
|
|
533
531
|
export {
|
|
534
|
-
|
|
532
|
+
Ta as default
|
|
535
533
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.popover-trigger[data-v-
|
|
1
|
+
.popover-trigger[data-v-cb7adfa2]{display:block}.popover-trigger--content[data-v-cb7adfa2]{width:fit-content}.popover-mobile[data-v-cb7adfa2]{width:100%}.popover-content[data-v-cb7adfa2]{z-index:1001;background-color:var(--theme-neutral-0);filter:drop-shadow(-1px 1px 10px #8d8f9340);border-radius:16px;position:fixed}.popover-content[data-state=open][data-v-cb7adfa2]{animation:fadeIn var(--animation-duration) ease-in-out}.popover-content[data-state=closed][data-v-cb7adfa2]{animation:fadeOut var(--animation-duration) ease-in-out}.popover-arrow[data-v-cb7adfa2]{background-color:var(--theme-neutral-0);pointer-events:none;width:10px;height:10px;position:absolute;transform:rotate(45deg)}.popover-arrow--bottom[data-v-cb7adfa2]{top:-5px}.popover-arrow--top[data-v-cb7adfa2]{bottom:-5px}.popover-arrow--right[data-v-cb7adfa2]{left:-5px}.popover-arrow--left[data-v-cb7adfa2]{right:-5px}
|
|
@@ -32,6 +32,19 @@ export interface PopoverProps {
|
|
|
32
32
|
* именно на него — иначе связь ведёт на безролевую обёртку.
|
|
33
33
|
*/
|
|
34
34
|
triggerControls?: string;
|
|
35
|
+
/**
|
|
36
|
+
* Ширина обёртки слота `trigger`.
|
|
37
|
+
*
|
|
38
|
+
* По умолчанию `full` — обёртка блочная и занимает всю доступную ширину.
|
|
39
|
+
* Так нужно тем, у кого сам триггер растянут по ней (`Select` задаёт
|
|
40
|
+
* кнопке `width: 100%`, и от `content` она схлопнулась бы в ноль).
|
|
41
|
+
*
|
|
42
|
+
* `content` обтягивает содержимое. Нужно полям, которые в макете идут по
|
|
43
|
+
* своему содержимому, а не по ширине контейнера: иначе обёртка
|
|
44
|
+
* растягивается на всю строку, ловит клики мимо поля и сдвигает точку, от
|
|
45
|
+
* которой считается положение попапа.
|
|
46
|
+
*/
|
|
47
|
+
triggerWidth?: 'full' | 'content';
|
|
35
48
|
/**
|
|
36
49
|
* Удерживать фокус внутри попапа, пока он открыт, и вернуть его на триггер
|
|
37
50
|
* при закрытии. Отключается для попапов, которые управляют фокусом сами.
|
|
@@ -49,6 +49,7 @@ declare const __VLS_component: DefineComponent<__VLS_PublicProps, {}, {}, {}, {}
|
|
|
49
49
|
labelledBy: string;
|
|
50
50
|
triggerHasPopup: "dialog" | "menu" | "listbox" | "grid" | "tree";
|
|
51
51
|
triggerControls: string;
|
|
52
|
+
triggerWidth: "full" | "content";
|
|
52
53
|
}, {}, {}, {}, string, ComponentProvideOptions, false, {
|
|
53
54
|
triggerRef: HTMLSpanElement;
|
|
54
55
|
contentRef: HTMLDivElement;
|
|
@@ -2,7 +2,7 @@ import './Popover.css';
|
|
|
2
2
|
import o from "./Popover.vue2.js";
|
|
3
3
|
/* empty css */
|
|
4
4
|
import r from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
5
|
-
const
|
|
5
|
+
const f = /* @__PURE__ */ r(o, [["__scopeId", "data-v-cb7adfa2"]]);
|
|
6
6
|
export {
|
|
7
|
-
|
|
7
|
+
f as default
|
|
8
8
|
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { defineComponent as se, useModel as ae, useId as le, computed as
|
|
1
|
+
import { defineComponent as se, useModel as ae, useId as le, computed as m, useTemplateRef as W, reactive as F, ref as re, watch as de, onBeforeUnmount as fe, openBlock as h, createElementBlock as T, Fragment as ue, mergeProps as z, unref as c, renderSlot as S, createCommentVNode as A, createBlock as K, withCtx as U, createElementVNode as G, mergeModels as Z, nextTick as ce } from "vue";
|
|
2
2
|
import { onClickOutside as pe } from "../../../utils/onClickOutside.util.js";
|
|
3
|
-
import { useFocusTrap as
|
|
3
|
+
import { useFocusTrap as ge } from "../../../utils/useFocusTrap.util.js";
|
|
4
4
|
import ve from "../BottomSheet/BottomSheet.vue.js";
|
|
5
5
|
import { ANIMATION_DURATION_MS as j } from "../shared/animation.const.js";
|
|
6
|
-
import
|
|
6
|
+
import me from "../shared/Portal.vue.js";
|
|
7
7
|
import { useDelayedVisibility as he } from "../shared/useDelayedVisibility.util.js";
|
|
8
8
|
import { useIsMobile as we } from "../shared/useIsMobile.util.js";
|
|
9
9
|
import { useTestId as be } from "../shared/useTestId.util.js";
|
|
@@ -25,6 +25,7 @@ const Oe = { class: "popover-mobile" }, xe = ["role", "aria-label", "aria-labell
|
|
|
25
25
|
labelledBy: { default: void 0 },
|
|
26
26
|
triggerHasPopup: { default: "dialog" },
|
|
27
27
|
triggerControls: { default: void 0 },
|
|
28
|
+
triggerWidth: { default: "full" },
|
|
28
29
|
trapFocus: { type: Boolean, default: !0 },
|
|
29
30
|
testId: { default: void 0 }
|
|
30
31
|
}, {
|
|
@@ -32,14 +33,14 @@ const Oe = { class: "popover-mobile" }, xe = ["role", "aria-label", "aria-labell
|
|
|
32
33
|
openModifiers: {}
|
|
33
34
|
}),
|
|
34
35
|
emits: /* @__PURE__ */ Z(["escapeKeyDown", "pointerDownOutside"], ["update:open"]),
|
|
35
|
-
setup(
|
|
36
|
-
const e =
|
|
36
|
+
setup(s, { emit: q }) {
|
|
37
|
+
const e = s, w = q, r = ae(s, "open"), H = we(e.breakpointMobile), E = `popover-content-${le()}`, I = be(() => e.testId), J = m(
|
|
37
38
|
() => e.label || e.labelledBy ? "dialog" : void 0
|
|
38
39
|
);
|
|
39
40
|
function Q() {
|
|
40
41
|
r.value = !r.value;
|
|
41
42
|
}
|
|
42
|
-
const X =
|
|
43
|
+
const X = m(() => ({
|
|
43
44
|
"aria-haspopup": e.triggerHasPopup,
|
|
44
45
|
"aria-expanded": r.value,
|
|
45
46
|
"aria-controls": r.value ? E : void 0
|
|
@@ -47,25 +48,25 @@ const Oe = { class: "popover-mobile" }, xe = ["role", "aria-label", "aria-labell
|
|
|
47
48
|
function N() {
|
|
48
49
|
r.value = !1;
|
|
49
50
|
}
|
|
50
|
-
const Y =
|
|
51
|
+
const Y = m(() => r.value && !H.value), b = W("triggerRef"), g = W("contentRef"), R = ge(() => g.value);
|
|
51
52
|
ye({
|
|
52
53
|
host: () => b.value,
|
|
53
54
|
isOpen: () => r.value,
|
|
54
55
|
contentId: () => e.triggerControls ?? E,
|
|
55
56
|
hasPopup: () => e.triggerHasPopup
|
|
56
57
|
});
|
|
57
|
-
const l =
|
|
58
|
+
const l = F({
|
|
58
59
|
top: 0,
|
|
59
60
|
left: 0,
|
|
60
61
|
side: e.side
|
|
61
|
-
}), y =
|
|
62
|
+
}), y = F({ x: 0, y: 0 }), B = re(!1);
|
|
62
63
|
function _() {
|
|
63
|
-
const o = b.value,
|
|
64
|
-
if (!o || !
|
|
65
|
-
const t = o.getBoundingClientRect(), n =
|
|
64
|
+
const o = b.value, a = g.value;
|
|
65
|
+
if (!o || !a) return;
|
|
66
|
+
const t = o.getBoundingClientRect(), n = a.getBoundingClientRect(), x = window.innerWidth, V = window.innerHeight, $ = V - t.bottom, D = t.top, C = t.left, L = x - t.right;
|
|
66
67
|
let i = e.side;
|
|
67
68
|
const M = i === "top" || i === "bottom" ? n.height : n.width;
|
|
68
|
-
i === "bottom" &&
|
|
69
|
+
i === "bottom" && $ < M + e.sideOffset && D > $ ? i = "top" : i === "top" && D < M + e.sideOffset && $ > D ? i = "bottom" : i === "right" && L < M + e.sideOffset && C > L ? i = "left" : i === "left" && C < M + e.sideOffset && L > C && (i = "right");
|
|
69
70
|
let f, u;
|
|
70
71
|
i === "bottom" || i === "top" ? (f = i === "bottom" ? t.bottom + e.sideOffset : t.top - n.height - e.sideOffset, e.align === "start" ? u = t.left + e.alignOffset : e.align === "end" ? u = t.right - n.width - e.alignOffset : u = t.left + t.width / 2 - n.width / 2 + e.alignOffset) : (u = i === "right" ? t.right + e.sideOffset : t.left - n.width - e.sideOffset, e.align === "start" ? f = t.top + e.alignOffset : e.align === "end" ? f = t.bottom - n.height - e.alignOffset : f = t.top + t.height / 2 - n.height / 2 + e.alignOffset), u = Math.min(
|
|
71
72
|
Math.max(u, p),
|
|
@@ -81,19 +82,19 @@ const Oe = { class: "popover-mobile" }, xe = ["role", "aria-label", "aria-labell
|
|
|
81
82
|
)
|
|
82
83
|
), l.top = f, l.left = u, l.side = i, y.x = t.left + t.width / 2, y.y = t.top + t.height / 2, B.value = !0;
|
|
83
84
|
}
|
|
84
|
-
const ee =
|
|
85
|
+
const ee = m(() => ({
|
|
85
86
|
top: `${l.top}px`,
|
|
86
87
|
left: `${l.left}px`,
|
|
87
88
|
width: `${e.width}px`,
|
|
88
89
|
visibility: B.value ? void 0 : "hidden",
|
|
89
90
|
...e.zIndex !== "auto" ? { zIndex: e.zIndex } : {}
|
|
90
|
-
})), te =
|
|
91
|
+
})), te = m(() => {
|
|
91
92
|
if (l.side === "top" || l.side === "bottom") {
|
|
92
93
|
const n = Math.max(12, e.width - 12 - k), x = y.x - l.left - k / 2;
|
|
93
94
|
return { left: `${Math.min(Math.max(x, 12), n)}px` };
|
|
94
95
|
}
|
|
95
|
-
const o =
|
|
96
|
-
return { top: `${Math.min(Math.max(t, 12),
|
|
96
|
+
const o = g.value?.offsetHeight ?? 0, a = Math.max(12, o - 12 - k), t = y.y - l.top - k / 2;
|
|
97
|
+
return { top: `${Math.min(Math.max(t, 12), a)}px` };
|
|
97
98
|
});
|
|
98
99
|
function d() {
|
|
99
100
|
ce(_);
|
|
@@ -117,31 +118,31 @@ const Oe = { class: "popover-mobile" }, xe = ["role", "aria-label", "aria-labell
|
|
|
117
118
|
}
|
|
118
119
|
);
|
|
119
120
|
let O, v;
|
|
120
|
-
return de(
|
|
121
|
+
return de(g, (o) => {
|
|
121
122
|
O?.(), v?.disconnect(), o ? (O = pe(o, oe, {
|
|
122
123
|
ignore: [b]
|
|
123
124
|
}), v = new ResizeObserver(d), v.observe(o)) : (O = void 0, v = void 0);
|
|
124
125
|
}), fe(() => {
|
|
125
126
|
O?.(), v?.disconnect(), document.removeEventListener("keydown", P), window.removeEventListener("resize", d), window.removeEventListener("scroll", d, !0), R.deactivate();
|
|
126
|
-
}), (o,
|
|
127
|
+
}), (o, a) => (h(), T(ue, null, [
|
|
127
128
|
o.$slots.trigger ? (h(), T("span", z({
|
|
128
129
|
key: 0,
|
|
129
130
|
ref_key: "triggerRef",
|
|
130
131
|
ref: b,
|
|
131
|
-
class: "popover-trigger"
|
|
132
|
+
class: ["popover-trigger", `popover-trigger--${s.triggerWidth}`]
|
|
132
133
|
}, c(I)("trigger"), { onClick: Q }), [
|
|
133
134
|
S(o.$slots, "trigger", { props: X.value }, void 0, !0)
|
|
134
135
|
], 16)) : A("", !0),
|
|
135
|
-
c(H) ? (h(),
|
|
136
|
+
c(H) ? (h(), K(c(ve), {
|
|
136
137
|
key: 1,
|
|
137
138
|
open: r.value,
|
|
138
|
-
"onUpdate:open":
|
|
139
|
-
"disable-outside-pointer-events":
|
|
140
|
-
label:
|
|
141
|
-
"labelled-by":
|
|
142
|
-
"test-id":
|
|
143
|
-
onEscapeKeyDown:
|
|
144
|
-
onPointerDownOutside:
|
|
139
|
+
"onUpdate:open": a[0] || (a[0] = (t) => r.value = t),
|
|
140
|
+
"disable-outside-pointer-events": s.disableOutsidePointerEvents,
|
|
141
|
+
label: s.label,
|
|
142
|
+
"labelled-by": s.labelledBy,
|
|
143
|
+
"test-id": s.testId,
|
|
144
|
+
onEscapeKeyDown: a[1] || (a[1] = (t) => w("escapeKeyDown", t)),
|
|
145
|
+
onPointerDownOutside: a[2] || (a[2] = (t) => w("pointerDownOutside", t))
|
|
145
146
|
}, {
|
|
146
147
|
default: U(() => [
|
|
147
148
|
G("div", Oe, [
|
|
@@ -149,20 +150,20 @@ const Oe = { class: "popover-mobile" }, xe = ["role", "aria-label", "aria-labell
|
|
|
149
150
|
])
|
|
150
151
|
]),
|
|
151
152
|
_: 3
|
|
152
|
-
}, 8, ["open", "disable-outside-pointer-events", "label", "labelled-by", "test-id"])) : c(ie) ? (h(),
|
|
153
|
+
}, 8, ["open", "disable-outside-pointer-events", "label", "labelled-by", "test-id"])) : c(ie) ? (h(), K(me, { key: 2 }, {
|
|
153
154
|
default: U(() => [
|
|
154
155
|
G("div", z({
|
|
155
156
|
id: E,
|
|
156
157
|
ref_key: "contentRef",
|
|
157
|
-
ref:
|
|
158
|
+
ref: g,
|
|
158
159
|
role: J.value,
|
|
159
|
-
"aria-label":
|
|
160
|
-
"aria-labelledby":
|
|
160
|
+
"aria-label": s.labelledBy ? void 0 : s.label,
|
|
161
|
+
"aria-labelledby": s.labelledBy,
|
|
161
162
|
"data-state": c(ne),
|
|
162
163
|
class: "popover-content",
|
|
163
164
|
style: ee.value
|
|
164
165
|
}, { ...o.$attrs, ...c(I)("content") }), [
|
|
165
|
-
|
|
166
|
+
s.arrow ? (h(), T("div", z({
|
|
166
167
|
key: 0,
|
|
167
168
|
class: ["popover-arrow", `popover-arrow--${l.side}`],
|
|
168
169
|
style: te.value
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.schedule-field[data-v-
|
|
1
|
+
.schedule-field[data-v-7ca326fb]{max-width:100%;height:var(--input-height);background-color:var(--theme-neutral-0);border:1px solid var(--input-border-color);padding:var(--input-padding);cursor:pointer;border-radius:8px;justify-content:flex-start;align-items:center;gap:4px;display:flex;overflow:hidden}.schedule-field[data-v-7ca326fb]:hover{border-color:var(--input-border-color-hover)}.schedule-field__main[data-v-7ca326fb]{min-width:0;height:100%;font:inherit;text-align:left;cursor:inherit;background:0 0;border:none;flex:auto;justify-content:flex-start;align-items:center;gap:4px;padding:0;display:flex}.schedule-field__main[data-v-7ca326fb]:focus-visible{outline:2px solid var(--theme-primary-500);outline-offset:-2px}.schedule-field__main[data-v-7ca326fb]:disabled{cursor:not-allowed}.schedule-field--open[data-v-7ca326fb]{border-color:var(--input-border-color-focus)}.schedule-field--disabled[data-v-7ca326fb]{cursor:not-allowed;opacity:.6}.schedule-field--small[data-v-7ca326fb]{height:var(--input-height-small)}.schedule-field--large[data-v-7ca326fb]{height:var(--input-height-large)}.schedule-field__icon[data-v-7ca326fb]{color:var(--theme-neutral-icon-caption);flex:none}.schedule-field__placeholder[data-v-7ca326fb],.schedule-field__value[data-v-7ca326fb]{white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:var(--input-font-size);overflow:hidden}.schedule-field__placeholder[data-v-7ca326fb]{color:var(--input-color-placeholder)}.schedule-field__value[data-v-7ca326fb]{color:var(--theme-neutral-text-body)}.schedule-field__clear[data-v-7ca326fb]{width:16px;height:16px;color:var(--color-neutral-text-caption);cursor:pointer;background:0 0;border:none;flex:none;margin-left:auto;padding:0}.schedule-field__clear[data-v-7ca326fb]:focus-visible{outline:2px solid var(--theme-primary-500);outline-offset:2px}.schedule-field__clear svg[data-v-7ca326fb]{width:100%;height:100%}.schedule-field__clear[data-v-7ca326fb]:hover{color:var(--color-error-500)}.schedule-panel[data-v-7ca326fb]{flex-direction:column;gap:20px;padding:24px;display:flex}.schedule-panel--mobile[data-v-7ca326fb]{gap:16px;padding:0 16px 16px}.schedule-panel__header[data-v-7ca326fb]{justify-content:space-between;align-items:center;gap:8px;display:flex}.schedule-panel__title[data-v-7ca326fb]{color:var(--theme-neutral-text-title);font-size:1.125rem;font-weight:500;line-height:1.5}.schedule-panel__close[data-v-7ca326fb]{width:24px;height:24px;color:var(--theme-neutral-text-title);cursor:pointer;background:0 0;border:none;flex:none;justify-content:center;align-items:center;padding:0;display:flex}.schedule-panel__close[data-v-7ca326fb]:focus-visible{outline:2px solid var(--theme-primary-500);outline-offset:2px}.schedule-panel__rows[data-v-7ca326fb]{flex-direction:column;gap:12px;display:flex}.schedule-row[data-v-7ca326fb]{align-items:center;gap:12px;display:flex}.schedule-row__day[data-v-7ca326fb]{cursor:pointer;flex:0 0 120px;align-items:center;gap:8px;min-width:0;display:flex;position:relative}.schedule-row__checkbox[data-v-7ca326fb]{opacity:0;cursor:pointer;width:20px;height:20px;margin:0;position:absolute}.schedule-row__checkbox:checked+.schedule-row__box[data-v-7ca326fb]{background-color:var(--theme-primary-500);border-color:var(--theme-primary-500);color:var(--theme-neutral-icon-negative)}.schedule-row__checkbox:checked+.schedule-row__box svg[data-v-7ca326fb]{opacity:1}.schedule-row__checkbox:hover+.schedule-row__box[data-v-7ca326fb]{border-color:var(--input-border-color-hover)}.schedule-row__checkbox:focus-visible+.schedule-row__box[data-v-7ca326fb]{outline:2px solid var(--theme-primary-500);outline-offset:2px}.schedule-row__box[data-v-7ca326fb]{background-color:var(--theme-neutral-0);border:1px solid var(--theme-neutral-border-default);width:20px;height:20px;transition:background-color var(--animation-duration-fast) ease, border-color var(--animation-duration-fast) ease;border-radius:5px;flex:none;justify-content:center;align-items:center;display:flex}.schedule-row__box svg[data-v-7ca326fb]{opacity:0;transition:opacity var(--animation-duration-fast) ease}.schedule-row__label[data-v-7ca326fb]{white-space:nowrap;text-overflow:ellipsis;min-width:0;color:var(--theme-neutral-text-subtitle);font-size:.75rem;line-height:1rem;overflow:hidden}.schedule-row__times[data-v-7ca326fb]{flex:auto;align-items:center;gap:6px;min-width:0;display:flex}.schedule-row__preposition[data-v-7ca326fb]{color:var(--theme-neutral-text-body);flex:none;font-size:.75rem;line-height:1rem}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import './Schedule.css';
|
|
2
2
|
import o from "./Schedule.vue2.js";
|
|
3
3
|
/* empty css */
|
|
4
|
-
import
|
|
5
|
-
const
|
|
4
|
+
import t from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
5
|
+
const e = /* @__PURE__ */ t(o, [["__scopeId", "data-v-7ca326fb"]]);
|
|
6
6
|
export {
|
|
7
|
-
|
|
7
|
+
e as default
|
|
8
8
|
};
|
|
@@ -39,8 +39,8 @@ const ce = ["disabled", "aria-label"], fe = {
|
|
|
39
39
|
modelModifiers: {}
|
|
40
40
|
}),
|
|
41
41
|
emits: /* @__PURE__ */ B(["apply"], ["update:modelValue"]),
|
|
42
|
-
setup(n, { emit:
|
|
43
|
-
const d = n,
|
|
42
|
+
setup(n, { emit: g }) {
|
|
43
|
+
const d = n, z = g, p = X(n, "modelValue"), c = ue(() => d.testId), S = `schedule-title-${q()}`, b = M(!1), V = ie(d.breakpointMobile), $ = y(() => d.labels?.title ?? "Расписание"), F = y(() => d.labels?.from ?? "с"), N = y(() => d.labels?.to ?? "до"), O = y(
|
|
44
44
|
() => d.width === "full" ? "100%" : `${d.width}px`
|
|
45
45
|
);
|
|
46
46
|
function C(t) {
|
|
@@ -106,7 +106,7 @@ const ce = ["disabled", "aria-label"], fe = {
|
|
|
106
106
|
a.active && (t[e] = { from: a.from, to: a.to });
|
|
107
107
|
}
|
|
108
108
|
const s = Object.keys(t).length > 0 ? t : null;
|
|
109
|
-
p.value = s,
|
|
109
|
+
p.value = s, z("apply", s), b.value = !1;
|
|
110
110
|
}
|
|
111
111
|
function j() {
|
|
112
112
|
p.value = null, u.value = C(null);
|
|
@@ -118,6 +118,7 @@ const ce = ["disabled", "aria-label"], fe = {
|
|
|
118
118
|
align: "start",
|
|
119
119
|
arrow: !1,
|
|
120
120
|
width: Ce,
|
|
121
|
+
"trigger-width": "content",
|
|
121
122
|
"breakpoint-mobile": n.breakpointMobile,
|
|
122
123
|
label: l(V) ? void 0 : $.value,
|
|
123
124
|
"labelled-by": l(V) ? S : void 0,
|
|
@@ -201,7 +202,7 @@ const ce = ["disabled", "aria-label"], fe = {
|
|
|
201
202
|
i("span", we, h(n.dayLabels?.[e] ?? l(E)[e]), 1)
|
|
202
203
|
]),
|
|
203
204
|
i("div", ke, [
|
|
204
|
-
i("span", Le, h(
|
|
205
|
+
i("span", Le, h(F.value), 1),
|
|
205
206
|
v(I, f({
|
|
206
207
|
modelValue: u.value[e].from,
|
|
207
208
|
"onUpdate:modelValue": (a) => u.value[e].from = a,
|