@feugene/granularity 0.4.0 → 0.4.2

package/dist/components/GrSelect/chunks/GrSelect-9wRWAu2R.js

@@ -0,0 +1,443 @@
+import { vClickOutside } from "../../../directives/clickOutside.js";
+import { t as GrInput_default } from "../../GrInput/chunks/GrInput-ghxaTf6d.js";
+import { a as linkBaseClass, i as grSelectTriggerClass, n as grSelectNativeClass, r as grSelectPanelClasses, t as defaultBaseClass } from "../../../chunks/grSelectStyles-B7doeAQp.js";
+import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onUnmounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, vShow, watch, withCtx, withDirectives, withKeys, withModifiers } from "vue";
+//#region src/components/GrSelect/GrSelect.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"value",
+	"multiple",
+	"disabled",
+	"aria-label"
+];
+var _hoisted_2 = {
+	key: 0,
+	value: ""
+};
+var _hoisted_3 = ["value"];
+var _hoisted_4 = ["value"];
+var _hoisted_5 = {
+	key: 0,
+	"data-testid": "ds-select-chevron",
+	class: "absolute top-1/2 -translate-y-1/2 right-3 text-[var(--muted-fg)] pointer-events-none"
+};
+var _hoisted_6 = [
+	"disabled",
+	"aria-label",
+	"aria-expanded"
+];
+var _hoisted_7 = { class: "min-w-0 flex-1" };
+var _hoisted_8 = {
+	key: 0,
+	class: "shrink-0 h-4 w-4",
+	"aria-hidden": "true"
+};
+var _hoisted_9 = {
+	key: 1,
+	"data-testid": "ds-select-chevron",
+	class: "shrink-0 text-[var(--muted-fg)] pointer-events-none"
+};
+var _hoisted_10 = ["disabled", "aria-label"];
+var _hoisted_11 = {
+	key: 0,
+	class: "p-2 border-b border-[var(--brd)]"
+};
+var _hoisted_12 = ["aria-multiselectable"];
+var _hoisted_13 = ["aria-selected", "onClick"];
+var _hoisted_14 = { class: "flex items-center gap-2 min-w-0" };
+var _hoisted_15 = { class: "truncate" };
+//#endregion
+//#region src/components/GrSelect/GrSelect.vue
+var GrSelect_default = /* @__PURE__ */ defineComponent({
+	__name: "GrSelect",
+	props: {
+		modelValue: {},
+		options: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		ariaLabel: { default: void 0 },
+		view: { default: "default" },
+		size: { default: "md" },
+		placeholder: { default: void 0 },
+		multiple: {
+			type: Boolean,
+			default: false
+		},
+		optionsView: { default: "native" },
+		allowCustomValue: {
+			type: Boolean,
+			default: false
+		},
+		customValuePlaceholder: { default: "Add value…" },
+		dropdownMaxHeight: { default: 280 },
+		closeOnSelect: {
+			type: Boolean,
+			default: true
+		},
+		clearable: {
+			type: Boolean,
+			default: false
+		},
+		clearLabel: { default: "Clear" },
+		variant: { default: "primary" },
+		underline: { default: "auto" }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const baseClassName = computed(() => props.view === "link" ? linkBaseClass : defaultBaseClass);
+		const rootClass = computed(() => props.view === "link" ? "relative inline-block align-baseline" : "relative w-full");
+		const emit = __emit;
+		const optionsResolved = computed(() => props.options ?? []);
+		function modelToArray(value) {
+			if (Array.isArray(value)) return value;
+			if (!value) return [];
+			return [value];
+		}
+		const modelSingle = computed(() => {
+			return Array.isArray(props.modelValue) ? props.modelValue[0] ?? "" : props.modelValue;
+		});
+		const modelMultiple = computed(() => modelToArray(props.modelValue));
+		const selectedValues = computed(() => {
+			return props.multiple ? modelMultiple.value : modelSingle.value ? [modelSingle.value] : [];
+		});
+		const hasSelection = computed(() => selectedValues.value.length > 0);
+		const selectedOptions = computed(() => {
+			const byValue = new Map(optionsResolved.value.map((o) => [o.value, o]));
+			return selectedValues.value.map((v) => byValue.get(v) ?? {
+				value: v,
+				label: v
+			});
+		});
+		const hasModelInOptions = computed(() => {
+			if (props.multiple) return false;
+			return optionsResolved.value.some((o) => o.value === modelSingle.value);
+		});
+		const displayLabel = computed(() => {
+			if (props.multiple) {
+				if (!selectedValues.value.length) return "";
+				return selectedValues.value.map((v) => optionsResolved.value.find((o) => o.value === v)?.label ?? v).join(", ");
+			}
+			return optionsResolved.value.find((o) => o.value === modelSingle.value)?.label ?? modelSingle.value;
+		});
+		const displayText = computed(() => {
+			if (hasSelection.value) return displayLabel.value;
+			return props.placeholder ?? "";
+		});
+		const nativeCustomOptionVisible = computed(() => {
+			if (!props.allowCustomValue) return false;
+			if (props.optionsView !== "native") return false;
+			if (props.multiple) return false;
+			if (!props.options) return false;
+			if (modelSingle.value === "") return false;
+			return !hasModelInOptions.value;
+		});
+		const customValue = ref("");
+		const open = ref(false);
+		const rootEl = ref(null);
+		const panelEl = ref(null);
+		const customInputRef = ref(null);
+		const clickOutsideExclude = [() => panelEl.value];
+		const panelStyle = ref({
+			left: "0px",
+			top: "0px",
+			width: "0px",
+			zIndex: "2147483647"
+		});
+		function syncPanelPosition() {
+			if (typeof window === "undefined") return;
+			const root = rootEl.value;
+			if (!root) return;
+			const rect = root.getBoundingClientRect();
+			panelStyle.value = {
+				left: `${rect.left}px`,
+				top: `${rect.bottom + 8}px`,
+				width: `${rect.width}px`,
+				zIndex: "2147483647"
+			};
+		}
+		function bindPanelPositionListeners() {
+			if (typeof window === "undefined") return;
+			window.addEventListener("resize", syncPanelPosition);
+			window.addEventListener("scroll", syncPanelPosition, true);
+		}
+		function unbindPanelPositionListeners() {
+			if (typeof window === "undefined") return;
+			window.removeEventListener("resize", syncPanelPosition);
+			window.removeEventListener("scroll", syncPanelPosition, true);
+		}
+		function closeDropdown() {
+			open.value = false;
+		}
+		function toggleDropdown() {
+			if (props.disabled) return;
+			open.value = !open.value;
+		}
+		function closeOnEscape(e) {
+			if (e.key === "Escape") closeDropdown();
+		}
+		watch(open, async (isOpen) => {
+			if (typeof document === "undefined") return;
+			document.removeEventListener("keydown", closeOnEscape);
+			unbindPanelPositionListeners();
+			if (isOpen) document.addEventListener("keydown", closeOnEscape);
+			if (!isOpen) {
+				customValue.value = "";
+				return;
+			}
+			bindPanelPositionListeners();
+			await nextTick();
+			syncPanelPosition();
+			if (props.allowCustomValue) customInputRef.value?.focus();
+		}, { immediate: true });
+		onUnmounted(() => {
+			if (typeof document === "undefined") return;
+			document.removeEventListener("keydown", closeOnEscape);
+			unbindPanelPositionListeners();
+		});
+		const panelClasses = computed(() => {
+			return grSelectPanelClasses;
+		});
+		const visibleOptions = computed(() => {
+			const base = optionsResolved.value;
+			const withCustom = (() => {
+				if (!props.allowCustomValue) return base;
+				if (props.multiple) return base;
+				if (modelSingle.value === "") return base;
+				if (hasModelInOptions.value) return base;
+				return [{
+					value: modelSingle.value,
+					label: modelSingle.value
+				}, ...base];
+			})();
+			if (!props.allowCustomValue) return withCustom;
+			const q = customValue.value.trim().toLowerCase();
+			if (!q) return withCustom;
+			return withCustom.filter((o) => {
+				return o.label.toLowerCase().includes(q) || o.value.toLowerCase().includes(q);
+			});
+		});
+		const canAddCustom = computed(() => {
+			if (!props.allowCustomValue) return false;
+			if (props.optionsView !== "panel") return false;
+			const v = customValue.value.trim();
+			if (!v) return false;
+			if (props.multiple) {
+				if (selectedValues.value.includes(v)) return false;
+				return !optionsResolved.value.some((o) => o.value === v);
+			}
+			if (v === modelSingle.value) return false;
+			return !optionsResolved.value.some((o) => o.value === v);
+		});
+		function emitValue(value) {
+			emit("update:modelValue", value);
+		}
+		function isSelected(value) {
+			return selectedValues.value.includes(value);
+		}
+		function selectValue(value) {
+			emitValue(value);
+			if (props.closeOnSelect) closeDropdown();
+		}
+		function toggleValue(value) {
+			if (!props.multiple) {
+				selectValue(value);
+				return;
+			}
+			const next = selectedValues.value.slice();
+			const idx = next.indexOf(value);
+			if (idx >= 0) next.splice(idx, 1);
+			else next.push(value);
+			emitValue(next);
+			if (props.closeOnSelect) closeDropdown();
+		}
+		function addCustom() {
+			const v = customValue.value.trim();
+			if (!v) return;
+			toggleValue(v);
+		}
+		const showNativeChevron = computed(() => {
+			return props.optionsView === "native" && props.view !== "link" && !props.multiple;
+		});
+		const nativeClearOptionVisible = computed(() => {
+			if (!props.clearable) return false;
+			if (props.optionsView !== "native") return false;
+			if (props.multiple) return false;
+			if (!props.options) return true;
+			return !props.options.some((o) => o.value === "");
+		});
+		const panelClearVisible = computed(() => {
+			if (!props.clearable) return false;
+			if (props.optionsView !== "panel") return false;
+			if (props.view === "link") return false;
+			return hasSelection.value;
+		});
+		const nativeClassName = computed(() => {
+			return grSelectNativeClass({
+				view: props.view,
+				size: props.size,
+				disabled: props.disabled,
+				variant: props.variant,
+				underline: props.underline,
+				showNativeChevron: showNativeChevron.value
+			});
+		});
+		const triggerClassName = computed(() => {
+			return grSelectTriggerClass({
+				view: props.view,
+				optionsView: props.optionsView,
+				size: props.size,
+				disabled: props.disabled,
+				variant: props.variant,
+				underline: props.underline
+			});
+		});
+		function onChange(e) {
+			const el = e.target;
+			if (props.multiple) {
+				emit("update:modelValue", Array.from(el.selectedOptions, (o) => o.value));
+				return;
+			}
+			emit("update:modelValue", el.value);
+		}
+		function clearSelection() {
+			if (props.disabled) return;
+			emitValue(props.multiple ? [] : "");
+		}
+		return (_ctx, _cache) => {
+			return __props.optionsView === "native" ? (openBlock(), createElementBlock("div", {
+				key: 0,
+				"data-ds-select": "",
+				class: normalizeClass(rootClass.value)
+			}, [createElementVNode("select", {
+				"data-ds-select-native": "",
+				value: __props.multiple ? modelMultiple.value : modelSingle.value,
+				multiple: __props.multiple,
+				disabled: __props.disabled,
+				"aria-label": __props.ariaLabel,
+				class: normalizeClass([baseClassName.value, nativeClassName.value]),
+				onChange
+			}, [nativeClearOptionVisible.value ? (openBlock(), createElementBlock("option", _hoisted_2)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default", {}, () => [nativeCustomOptionVisible.value ? (openBlock(), createElementBlock("option", {
+				key: 0,
+				value: modelSingle.value
+			}, toDisplayString(modelSingle.value), 9, _hoisted_3)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (opt) => {
+				return openBlock(), createElementBlock("option", {
+					key: opt.value,
+					value: opt.value
+				}, toDisplayString(opt.label), 9, _hoisted_4);
+			}), 128))])], 42, _hoisted_1), showNativeChevron.value ? (openBlock(), createElementBlock("span", _hoisted_5, [..._cache[1] || (_cache[1] = [createElementVNode("span", {
+				class: "i-lucide-chevron-down h-4 w-4",
+				"aria-hidden": "true"
+			}, null, -1)])])) : createCommentVNode("", true)], 2)) : withDirectives((openBlock(), createElementBlock("div", {
+				key: 1,
+				ref_key: "rootEl",
+				ref: rootEl,
+				"data-ds-select": "",
+				class: normalizeClass(rootClass.value)
+			}, [
+				createElementVNode("button", {
+					"data-testid": "ds-select-trigger",
+					"data-ds-select-trigger": "",
+					type: "button",
+					disabled: __props.disabled,
+					"aria-label": __props.ariaLabel,
+					role: "combobox",
+					"aria-readonly": "true",
+					"aria-expanded": open.value ? "true" : "false",
+					class: normalizeClass([baseClassName.value, triggerClassName.value]),
+					onClick: toggleDropdown
+				}, [createElementVNode("span", _hoisted_7, [renderSlot(_ctx.$slots, "value", {
+					selectedOptions: selectedOptions.value,
+					selectedValues: selectedValues.value,
+					displayLabel: displayLabel.value,
+					placeholder: __props.placeholder,
+					hasSelection: hasSelection.value
+				}, () => [createElementVNode("span", { class: normalizeClass(["block truncate", !hasSelection.value ? "text-[var(--muted-fg)]" : ""]) }, toDisplayString(displayText.value), 3)])]), panelClearVisible.value ? (openBlock(), createElementBlock("span", _hoisted_8)) : (openBlock(), createElementBlock("span", _hoisted_9, [..._cache[2] || (_cache[2] = [createElementVNode("span", {
+					class: "i-lucide-chevron-down h-4 w-4",
+					"aria-hidden": "true"
+				}, null, -1)])]))], 10, _hoisted_6),
+				panelClearVisible.value ? (openBlock(), createElementBlock("button", {
+					key: 0,
+					"data-testid": "ds-select-clear",
+					"data-ds-select-clear": "",
+					type: "button",
+					class: "absolute top-1/2 -translate-y-1/2 right-3 h-6 w-6 inline-flex items-center justify-center rounded-md text-[var(--muted-fg)] hover:text-[var(--fg)] hover:bg-[color-mix(in_srgb,var(--muted)_25%,transparent)] disabled:opacity-50",
+					disabled: __props.disabled,
+					"aria-label": __props.clearLabel,
+					onClick: withModifiers(clearSelection, ["stop"])
+				}, [..._cache[3] || (_cache[3] = [createElementVNode("span", {
+					class: "i-lucide-x h-4 w-4",
+					"aria-hidden": "true"
+				}, null, -1)])], 8, _hoisted_10)) : createCommentVNode("", true),
+				(openBlock(), createBlock(Teleport, { to: "body" }, [createVNode(Transition, {
+					"enter-active-class": "transition ease-out duration-150",
+					"enter-from-class": "transform opacity-0 scale-95",
+					"enter-to-class": "transform opacity-100 scale-100",
+					"leave-active-class": "transition ease-in duration-100",
+					"leave-from-class": "transform opacity-100 scale-100",
+					"leave-to-class": "transform opacity-0 scale-95"
+				}, {
+					default: withCtx(() => [withDirectives(createElementVNode("div", {
+						ref_key: "panelEl",
+						ref: panelEl,
+						"data-testid": "ds-select-panel",
+						"data-ds-select-panel": "",
+						class: "fixed w-full",
+						style: normalizeStyle(panelStyle.value)
+					}, [createElementVNode("div", { class: normalizeClass(panelClasses.value) }, [__props.allowCustomValue ? (openBlock(), createElementBlock("div", _hoisted_11, [createVNode(GrInput_default, {
+						ref_key: "customInputRef",
+						ref: customInputRef,
+						modelValue: customValue.value,
+						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => customValue.value = $event),
+						"data-testid": "ds-select-custom-input",
+						type: "text",
+						placeholder: __props.customValuePlaceholder,
+						size: "sm",
+						onKeydown: withKeys(withModifiers(addCustom, ["prevent"]), ["enter"])
+					}, null, 8, [
+						"modelValue",
+						"placeholder",
+						"onKeydown"
+					])])) : createCommentVNode("", true), createElementVNode("div", {
+						"data-ds-select-listbox": "",
+						class: "p-1 overflow-auto",
+						style: normalizeStyle({ maxHeight: `${__props.dropdownMaxHeight}px` }),
+						role: "listbox",
+						"aria-multiselectable": __props.multiple ? "true" : void 0
+					}, [canAddCustom.value ? (openBlock(), createElementBlock("button", {
+						key: 0,
+						"data-testid": "ds-select-add-option",
+						"data-ds-select-add-option": "",
+						type: "button",
+						class: "w-full rounded-[10px] px-3 py-2 text-left text-[13px] hover:bg-[color-mix(in_srgb,var(--muted)_30%,transparent)]",
+						onClick: addCustom
+					}, " Add “" + toDisplayString(customValue.value.trim()) + "” ", 1)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(visibleOptions.value, (opt) => {
+						return openBlock(), createElementBlock("button", {
+							key: opt.value,
+							"data-ds-select-option": "",
+							type: "button",
+							role: "option",
+							"aria-selected": isSelected(opt.value) ? "true" : "false",
+							class: "w-full rounded-[10px] px-3 py-2 text-left text-[13px] hover:bg-[color-mix(in_srgb,var(--muted)_30%,transparent)]",
+							onClick: ($event) => toggleValue(opt.value)
+						}, [renderSlot(_ctx.$slots, "option", {
+							option: opt,
+							selected: isSelected(opt.value)
+						}, () => [createElementVNode("span", _hoisted_14, [createElementVNode("span", {
+							class: normalizeClass(["h-4 w-4 shrink-0", isSelected(opt.value) ? "i-lucide-check text-[var(--primary)]" : ""]),
+							"aria-hidden": "true"
+						}, null, 2), createElementVNode("span", _hoisted_15, toDisplayString(opt.label), 1)])])], 8, _hoisted_13);
+					}), 128))], 12, _hoisted_12)], 2)], 4), [[vShow, open.value]])]),
+					_: 3
+				})]))
+			], 2)), [[unref(vClickOutside), {
+				handler: closeDropdown,
+				enabled: open.value,
+				exclude: clickOutsideExclude
+			}]]);
+		};
+	}
+});
+//#endregion
+export { GrSelect_default as t };

package/dist/components/GrSelect/chunks/GrSelect-9wRWAu2R.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrSelect-9wRWAu2R.js","names":[],"sources":["../../../../src/components/GrSelect/GrSelect.vue","../../../../src/components/GrSelect/GrSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, nextTick, onUnmounted, ref, watch } from 'vue'\n\nimport GrInput from '../GrInput/GrInput.vue'\nimport { vClickOutside } from '../../directives'\n\nimport {\n  defaultBaseClass,\n  grSelectNativeClass,\n  grSelectPanelClasses,\n  grSelectTriggerClass,\n  linkBaseClass,\n  type GrSelectModelValue,\n  type GrSelectOption,\n  type GrSelectOptionsView,\n  type GrSelectSize,\n  type GrSelectUnderline,\n  type GrSelectVariant,\n  type GrSelectView,\n} from './grSelectStyles'\n\nexport type {\n  GrSelectModelValue,\n  GrSelectOption,\n  GrSelectOptionsView,\n  GrSelectSize,\n  GrSelectUnderline,\n  GrSelectVariant,\n  GrSelectView,\n} from './grSelectStyles'\n\n/**\n * Пропсы публичного DS-примитива «Select».\n */\nexport interface GrSelectProps {\n  modelValue: GrSelectModelValue\n  options?: GrSelectOption[]\n  disabled?: boolean\n  ariaLabel?: string\n  view?: GrSelectView\n  size?: GrSelectSize\n  /** Placeholder (показывается, когда значение не выбрано). */\n  placeholder?: string\n  /** Multiple selection. */\n  multiple?: boolean\n  /** Как отображать список опций: нативный `<select>` или кастомная панель. */\n  optionsView?: GrSelectOptionsView\n  /** Разрешает ввод/выбор значения, которого нет в `options`. */\n  allowCustomValue?: boolean\n  /** Placeholder для инпута кастомного значения (только в `optionsView=\"panel\"`). */\n  customValuePlaceholder?: string\n  /** Максимальная высота панели (только в `optionsView=\"panel\"`). */\n  dropdownMaxHeight?: number\n  /** Закрывать панель после выбора (только в `optionsView=\"panel\"`). */\n  closeOnSelect?: boolean\n  /** Разрешает очистку выбранного значения. */\n  clearable?: boolean\n  /** i18n-label для кнопки очистки (`aria-label`). */\n  clearLabel?: string\n  /**\n   * Цвет/вариант ссылки для `view=\"link\"` (аналогично `GrLink`).\n   * В `view=\"default\"` не используется.\n   */\n  variant?: GrSelectVariant\n  /**\n   * Подчёркивание для `view=\"link\"` (аналогично `GrLink`).\n   * В `view=\"default\"` не используется.\n   */\n  underline?: GrSelectUnderline\n}\n\nconst props = withDefaults(\n  defineProps<GrSelectProps>(),\n  {\n    options: undefined,\n    disabled: false,\n    ariaLabel: undefined,\n    view: 'default',\n    size: 'md',\n\n    placeholder: undefined,\n    multiple: false,\n\n    optionsView: 'native',\n    allowCustomValue: false,\n    customValuePlaceholder: 'Add value…',\n    dropdownMaxHeight: 280,\n    closeOnSelect: true,\n    clearable: false,\n    clearLabel: 'Clear',\n    variant: 'primary',\n    underline: 'auto',\n  },\n)\n\nconst baseClassName = computed(() => props.view === 'link' ? linkBaseClass : defaultBaseClass)\n\nconst rootClass = computed(() => props.view === 'link' ? 'relative inline-block align-baseline' : 'relative w-full')\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: GrSelectModelValue): void\n}>()\n\nconst optionsResolved = computed(() => props.options ?? [])\n\nfunction modelToArray(value: GrSelectModelValue): string[] {\n  if (Array.isArray(value)) return value\n  if (!value) return []\n  return [value]\n}\n\nconst modelSingle = computed(() => {\n  return Array.isArray(props.modelValue) ? (props.modelValue[0] ?? '') : props.modelValue\n})\n\nconst modelMultiple = computed(() => modelToArray(props.modelValue))\n\nconst selectedValues = computed(() => {\n  return props.multiple ? modelMultiple.value : (modelSingle.value ? [modelSingle.value] : [])\n})\n\nconst hasSelection = computed(() => selectedValues.value.length > 0)\n\nconst selectedOptions = computed<GrSelectOption[]>(() => {\n  const byValue = new Map(optionsResolved.value.map(o => [o.value, o]))\n  return selectedValues.value.map((v) => byValue.get(v) ?? { value: v, label: v })\n})\n\nconst hasModelInOptions = computed(() => {\n  if (props.multiple) return false\n  return optionsResolved.value.some((o) => o.value === modelSingle.value)\n})\n\nconst displayLabel = computed(() => {\n  if (props.multiple) {\n    if (!selectedValues.value.length) return ''\n    return selectedValues.value\n      .map((v) => optionsResolved.value.find((o) => o.value === v)?.label ?? v)\n      .join(', ')\n  }\n\n  return optionsResolved.value.find((o) => o.value === modelSingle.value)?.label ?? modelSingle.value\n})\n\nconst displayText = computed(() => {\n  if (hasSelection.value) return displayLabel.value\n  return props.placeholder ?? ''\n})\n\nconst nativeCustomOptionVisible = computed(() => {\n  if (!props.allowCustomValue) return false\n  if (props.optionsView !== 'native') return false\n  if (props.multiple) return false\n  if (!props.options) return false\n  if (modelSingle.value === '') return false\n  return !hasModelInOptions.value\n})\n\nconst customValue = ref('')\nconst open = ref(false)\nconst rootEl = ref<HTMLElement | null>(null)\nconst panelEl = ref<HTMLElement | null>(null)\nconst customInputRef = ref<InstanceType<typeof GrInput> | null>(null)\nconst clickOutsideExclude = [() => panelEl.value]\nconst panelStyle = ref<Record<string, string>>({\n  left: '0px',\n  top: '0px',\n  width: '0px',\n  zIndex: '2147483647',\n})\n\nfunction syncPanelPosition(): void {\n  if (typeof window === 'undefined') return\n\n  const root = rootEl.value\n  if (!root) return\n\n  const rect = root.getBoundingClientRect()\n\n  panelStyle.value = {\n    left: `${rect.left}px`,\n    top: `${rect.bottom + 8}px`,\n    width: `${rect.width}px`,\n    zIndex: '2147483647',\n  }\n}\n\nfunction bindPanelPositionListeners(): void {\n  if (typeof window === 'undefined') return\n  window.addEventListener('resize', syncPanelPosition)\n  window.addEventListener('scroll', syncPanelPosition, true)\n}\n\nfunction unbindPanelPositionListeners(): void {\n  if (typeof window === 'undefined') return\n  window.removeEventListener('resize', syncPanelPosition)\n  window.removeEventListener('scroll', syncPanelPosition, true)\n}\n\nfunction closeDropdown(): void {\n  open.value = false\n}\n\nfunction toggleDropdown(): void {\n  if (props.disabled) return\n  open.value = !open.value\n}\n\nfunction closeOnEscape(e: KeyboardEvent): void {\n  if (e.key === 'Escape') closeDropdown()\n}\n\nwatch(\n  open,\n  async (isOpen) => {\n    if (typeof document === 'undefined') return\n\n    document.removeEventListener('keydown', closeOnEscape)\n    unbindPanelPositionListeners()\n\n    if (isOpen) document.addEventListener('keydown', closeOnEscape)\n\n    if (!isOpen) {\n      customValue.value = ''\n      return\n    }\n\n    bindPanelPositionListeners()\n    await nextTick()\n    syncPanelPosition()\n\n    if (props.allowCustomValue) {\n      customInputRef.value?.focus()\n    }\n  },\n  { immediate: true },\n)\n\nonUnmounted(() => {\n  if (typeof document === 'undefined') return\n  document.removeEventListener('keydown', closeOnEscape)\n  unbindPanelPositionListeners()\n})\n\nconst panelClasses = computed(() => {\n  return grSelectPanelClasses\n})\n\nconst visibleOptions = computed(() => {\n  const base = optionsResolved.value\n\n  const withCustom = (() => {\n    if (!props.allowCustomValue) return base\n    if (props.multiple) return base\n    if (modelSingle.value === '') return base\n    if (hasModelInOptions.value) return base\n    return [{ value: modelSingle.value, label: modelSingle.value }, ...base]\n  })()\n\n  if (!props.allowCustomValue) return withCustom\n\n  const q = customValue.value.trim().toLowerCase()\n  if (!q) return withCustom\n\n  return withCustom.filter((o) => {\n    return o.label.toLowerCase().includes(q) || o.value.toLowerCase().includes(q)\n  })\n})\n\nconst canAddCustom = computed(() => {\n  if (!props.allowCustomValue) return false\n  if (props.optionsView !== 'panel') return false\n  const v = customValue.value.trim()\n  if (!v) return false\n\n  if (props.multiple) {\n    if (selectedValues.value.includes(v)) return false\n    return !optionsResolved.value.some((o) => o.value === v)\n  }\n\n  if (v === modelSingle.value) return false\n  return !optionsResolved.value.some((o) => o.value === v)\n})\n\nfunction emitValue(value: GrSelectModelValue): void {\n  emit('update:modelValue', value)\n}\n\nfunction isSelected(value: string): boolean {\n  return selectedValues.value.includes(value)\n}\n\nfunction selectValue(value: string): void {\n  emitValue(value)\n  if (props.closeOnSelect) {\n    closeDropdown()\n  }\n}\n\nfunction toggleValue(value: string): void {\n  if (!props.multiple) {\n    selectValue(value)\n    return\n  }\n\n  const next = selectedValues.value.slice()\n  const idx = next.indexOf(value)\n  if (idx >= 0) {\n    next.splice(idx, 1)\n  }\n  else {\n    next.push(value)\n  }\n\n  emitValue(next)\n  if (props.closeOnSelect) {\n    closeDropdown()\n  }\n}\n\nfunction addCustom(): void {\n  const v = customValue.value.trim()\n  if (!v) return\n  toggleValue(v)\n}\n\nconst showNativeChevron = computed(() => {\n  return props.optionsView === 'native' && props.view !== 'link' && !props.multiple\n})\n\nconst nativeClearOptionVisible = computed(() => {\n  if (!props.clearable) return false\n  if (props.optionsView !== 'native') return false\n  if (props.multiple) return false\n  if (!props.options) return true\n  return !props.options.some(o => o.value === '')\n})\n\nconst panelClearVisible = computed(() => {\n  if (!props.clearable) return false\n  if (props.optionsView !== 'panel') return false\n  if (props.view === 'link') return false\n  return hasSelection.value\n})\n\nconst nativeClassName = computed(() => {\n  return grSelectNativeClass({\n    view: props.view,\n    size: props.size,\n    disabled: props.disabled,\n    variant: props.variant,\n    underline: props.underline,\n    showNativeChevron: showNativeChevron.value,\n  })\n})\n\nconst triggerClassName = computed(() => {\n  return grSelectTriggerClass({\n    view: props.view,\n    optionsView: props.optionsView,\n    size: props.size,\n    disabled: props.disabled,\n    variant: props.variant,\n    underline: props.underline,\n  })\n})\n\nfunction onChange(e: Event): void {\n  const el = e.target as HTMLSelectElement\n\n  if (props.multiple) {\n    const values = Array.from(el.selectedOptions, o => o.value)\n    emit('update:modelValue', values)\n    return\n  }\n\n  emit('update:modelValue', el.value)\n}\n\nfunction clearSelection(): void {\n  if (props.disabled) return\n  emitValue(props.multiple ? [] : '')\n}\n</script>\n\n<template>\n  <div\n    v-if=\"optionsView === 'native'\"\n    data-ds-select\n    :class=\"rootClass\"\n  >\n    <select\n      data-ds-select-native\n      :value=\"multiple ? modelMultiple : modelSingle\"\n      :multiple=\"multiple\"\n      :disabled=\"disabled\"\n      :aria-label=\"ariaLabel\"\n      :class=\"[baseClassName, nativeClassName]\"\n      @change=\"onChange\"\n    >\n      <option v-if=\"nativeClearOptionVisible\" value=\"\" />\n\n      <slot>\n        <option v-if=\"nativeCustomOptionVisible\" :value=\"modelSingle\">\n          {{ modelSingle }}\n        </option>\n        <option v-for=\"opt in options\" :key=\"opt.value\" :value=\"opt.value\">\n          {{ opt.label }}\n        </option>\n      </slot>\n    </select>\n\n    <span\n      v-if=\"showNativeChevron\"\n      data-testid=\"ds-select-chevron\"\n      class=\"absolute top-1/2 -translate-y-1/2 right-3 text-[var(--muted-fg)] pointer-events-none\"\n    >\n      <span class=\"i-lucide-chevron-down h-4 w-4\" aria-hidden=\"true\" />\n    </span>\n  </div>\n\n  <div\n    v-else\n    ref=\"rootEl\"\n    v-click-outside=\"{ handler: closeDropdown, enabled: open, exclude: clickOutsideExclude }\"\n    data-ds-select\n    :class=\"rootClass\"\n  >\n    <button\n      data-testid=\"ds-select-trigger\"\n      data-ds-select-trigger\n      type=\"button\"\n      :disabled=\"disabled\"\n      :aria-label=\"ariaLabel\"\n      role=\"combobox\"\n      aria-readonly=\"true\"\n      :aria-expanded=\"open ? 'true' : 'false'\"\n      :class=\"[baseClassName, triggerClassName]\"\n      @click=\"toggleDropdown\"\n    >\n      <span class=\"min-w-0 flex-1\">\n        <slot\n          name=\"value\"\n          :selected-options=\"selectedOptions\"\n          :selected-values=\"selectedValues\"\n          :display-label=\"displayLabel\"\n          :placeholder=\"placeholder\"\n          :has-selection=\"hasSelection\"\n        >\n          <span\n            class=\"block truncate\"\n            :class=\"!hasSelection ? 'text-[var(--muted-fg)]' : ''\"\n          >\n            {{ displayText }}\n          </span>\n        </slot>\n      </span>\n\n      <span\n        v-if=\"panelClearVisible\"\n        class=\"shrink-0 h-4 w-4\"\n        aria-hidden=\"true\"\n      />\n\n      <span\n        v-else\n        data-testid=\"ds-select-chevron\"\n        class=\"shrink-0 text-[var(--muted-fg)] pointer-events-none\"\n      >\n        <span class=\"i-lucide-chevron-down h-4 w-4\" aria-hidden=\"true\" />\n      </span>\n    </button>\n\n    <button\n      v-if=\"panelClearVisible\"\n      data-testid=\"ds-select-clear\"\n      data-ds-select-clear\n      type=\"button\"\n      class=\"absolute top-1/2 -translate-y-1/2 right-3 h-6 w-6 inline-flex items-center justify-center rounded-md text-[var(--muted-fg)] hover:text-[var(--fg)] hover:bg-[color-mix(in_srgb,var(--muted)_25%,transparent)] disabled:opacity-50\"\n      :disabled=\"disabled\"\n      :aria-label=\"clearLabel\"\n      @click.stop=\"clearSelection\"\n    >\n      <span class=\"i-lucide-x h-4 w-4\" aria-hidden=\"true\" />\n    </button>\n\n    <teleport to=\"body\">\n      <transition\n        enter-active-class=\"transition ease-out duration-150\"\n        enter-from-class=\"transform opacity-0 scale-95\"\n        enter-to-class=\"transform opacity-100 scale-100\"\n        leave-active-class=\"transition ease-in duration-100\"\n        leave-from-class=\"transform opacity-100 scale-100\"\n        leave-to-class=\"transform opacity-0 scale-95\"\n      >\n        <div\n          v-show=\"open\"\n          ref=\"panelEl\"\n          data-testid=\"ds-select-panel\"\n          data-ds-select-panel\n          class=\"fixed w-full\"\n          :style=\"panelStyle\"\n        >\n          <div :class=\"panelClasses\">\n            <div v-if=\"allowCustomValue\" class=\"p-2 border-b border-[var(--brd)]\">\n              <GrInput\n                ref=\"customInputRef\"\n                v-model=\"customValue\"\n                data-testid=\"ds-select-custom-input\"\n                type=\"text\"\n                :placeholder=\"customValuePlaceholder\"\n                size=\"sm\"\n                @keydown.enter.prevent=\"addCustom\"\n              />\n            </div>\n\n            <div\n              data-ds-select-listbox\n              class=\"p-1 overflow-auto\"\n              :style=\"{ maxHeight: `${dropdownMaxHeight}px` }\"\n              role=\"listbox\"\n              :aria-multiselectable=\"multiple ? 'true' : undefined\"\n            >\n              <button\n                v-if=\"canAddCustom\"\n                data-testid=\"ds-select-add-option\"\n                data-ds-select-add-option\n                type=\"button\"\n                class=\"w-full rounded-[10px] px-3 py-2 text-left text-[13px] hover:bg-[color-mix(in_srgb,var(--muted)_30%,transparent)]\"\n                @click=\"addCustom\"\n              >\n                Add “{{ customValue.trim() }}”\n              </button>\n\n              <button\n                v-for=\"opt in visibleOptions\"\n                :key=\"opt.value\"\n                data-ds-select-option\n                type=\"button\"\n                role=\"option\"\n                :aria-selected=\"isSelected(opt.value) ? 'true' : 'false'\"\n                class=\"w-full rounded-[10px] px-3 py-2 text-left text-[13px] hover:bg-[color-mix(in_srgb,var(--muted)_30%,transparent)]\"\n                @click=\"toggleValue(opt.value)\"\n              >\n                <slot name=\"option\" :option=\"opt\" :selected=\"isSelected(opt.value)\">\n                  <span class=\"flex items-center gap-2 min-w-0\">\n                    <span\n                      class=\"h-4 w-4 shrink-0\"\n                      :class=\"isSelected(opt.value) ? 'i-lucide-check text-[var(--primary)]' : ''\"\n                      aria-hidden=\"true\"\n                    />\n                    <span class=\"truncate\">{{ opt.label }}</span>\n                  </span>\n                </slot>\n              </button>\n            </div>\n          </div>\n        </div>\n      </transition>\n    </teleport>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, onUnmounted, ref, watch } from 'vue'\n\nimport GrInput from '../GrInput/GrInput.vue'\nimport { vClickOutside } from '../../directives'\n\nimport {\n  defaultBaseClass,\n  grSelectNativeClass,\n  grSelectPanelClasses,\n  grSelectTriggerClass,\n  linkBaseClass,\n  type GrSelectModelValue,\n  type GrSelectOption,\n  type GrSelectOptionsView,\n  type GrSelectSize,\n  type GrSelectUnderline,\n  type GrSelectVariant,\n  type GrSelectView,\n} from './grSelectStyles'\n\nexport type {\n  GrSelectModelValue,\n  GrSelectOption,\n  GrSelectOptionsView,\n  GrSelectSize,\n  GrSelectUnderline,\n  GrSelectVariant,\n  GrSelectView,\n} from './grSelectStyles'\n\n/**\n * Пропсы публичного DS-примитива «Select».\n */\nexport interface GrSelectProps {\n  modelValue: GrSelectModelValue\n  options?: GrSelectOption[]\n  disabled?: boolean\n  ariaLabel?: string\n  view?: GrSelectView\n  size?: GrSelectSize\n  /** Placeholder (показывается, когда значение не выбрано). */\n  placeholder?: string\n  /** Multiple selection. */\n  multiple?: boolean\n  /** Как отображать список опций: нативный `<select>` или кастомная панель. */\n  optionsView?: GrSelectOptionsView\n  /** Разрешает ввод/выбор значения, которого нет в `options`. */\n  allowCustomValue?: boolean\n  /** Placeholder для инпута кастомного значения (только в `optionsView=\"panel\"`). */\n  customValuePlaceholder?: string\n  /** Максимальная высота панели (только в `optionsView=\"panel\"`). */\n  dropdownMaxHeight?: number\n  /** Закрывать панель после выбора (только в `optionsView=\"panel\"`). */\n  closeOnSelect?: boolean\n  /** Разрешает очистку выбранного значения. */\n  clearable?: boolean\n  /** i18n-label для кнопки очистки (`aria-label`). */\n  clearLabel?: string\n  /**\n   * Цвет/вариант ссылки для `view=\"link\"` (аналогично `GrLink`).\n   * В `view=\"default\"` не используется.\n   */\n  variant?: GrSelectVariant\n  /**\n   * Подчёркивание для `view=\"link\"` (аналогично `GrLink`).\n   * В `view=\"default\"` не используется.\n   */\n  underline?: GrSelectUnderline\n}\n\nconst props = withDefaults(\n  defineProps<GrSelectProps>(),\n  {\n    options: undefined,\n    disabled: false,\n    ariaLabel: undefined,\n    view: 'default',\n    size: 'md',\n\n    placeholder: undefined,\n    multiple: false,\n\n    optionsView: 'native',\n    allowCustomValue: false,\n    customValuePlaceholder: 'Add value…',\n    dropdownMaxHeight: 280,\n    closeOnSelect: true,\n    clearable: false,\n    clearLabel: 'Clear',\n    variant: 'primary',\n    underline: 'auto',\n  },\n)\n\nconst baseClassName = computed(() => props.view === 'link' ? linkBaseClass : defaultBaseClass)\n\nconst rootClass = computed(() => props.view === 'link' ? 'relative inline-block align-baseline' : 'relative w-full')\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: GrSelectModelValue): void\n}>()\n\nconst optionsResolved = computed(() => props.options ?? [])\n\nfunction modelToArray(value: GrSelectModelValue): string[] {\n  if (Array.isArray(value)) return value\n  if (!value) return []\n  return [value]\n}\n\nconst modelSingle = computed(() => {\n  return Array.isArray(props.modelValue) ? (props.modelValue[0] ?? '') : props.modelValue\n})\n\nconst modelMultiple = computed(() => modelToArray(props.modelValue))\n\nconst selectedValues = computed(() => {\n  return props.multiple ? modelMultiple.value : (modelSingle.value ? [modelSingle.value] : [])\n})\n\nconst hasSelection = computed(() => selectedValues.value.length > 0)\n\nconst selectedOptions = computed<GrSelectOption[]>(() => {\n  const byValue = new Map(optionsResolved.value.map(o => [o.value, o]))\n  return selectedValues.value.map((v) => byValue.get(v) ?? { value: v, label: v })\n})\n\nconst hasModelInOptions = computed(() => {\n  if (props.multiple) return false\n  return optionsResolved.value.some((o) => o.value === modelSingle.value)\n})\n\nconst displayLabel = computed(() => {\n  if (props.multiple) {\n    if (!selectedValues.value.length) return ''\n    return selectedValues.value\n      .map((v) => optionsResolved.value.find((o) => o.value === v)?.label ?? v)\n      .join(', ')\n  }\n\n  return optionsResolved.value.find((o) => o.value === modelSingle.value)?.label ?? modelSingle.value\n})\n\nconst displayText = computed(() => {\n  if (hasSelection.value) return displayLabel.value\n  return props.placeholder ?? ''\n})\n\nconst nativeCustomOptionVisible = computed(() => {\n  if (!props.allowCustomValue) return false\n  if (props.optionsView !== 'native') return false\n  if (props.multiple) return false\n  if (!props.options) return false\n  if (modelSingle.value === '') return false\n  return !hasModelInOptions.value\n})\n\nconst customValue = ref('')\nconst open = ref(false)\nconst rootEl = ref<HTMLElement | null>(null)\nconst panelEl = ref<HTMLElement | null>(null)\nconst customInputRef = ref<InstanceType<typeof GrInput> | null>(null)\nconst clickOutsideExclude = [() => panelEl.value]\nconst panelStyle = ref<Record<string, string>>({\n  left: '0px',\n  top: '0px',\n  width: '0px',\n  zIndex: '2147483647',\n})\n\nfunction syncPanelPosition(): void {\n  if (typeof window === 'undefined') return\n\n  const root = rootEl.value\n  if (!root) return\n\n  const rect = root.getBoundingClientRect()\n\n  panelStyle.value = {\n    left: `${rect.left}px`,\n    top: `${rect.bottom + 8}px`,\n    width: `${rect.width}px`,\n    zIndex: '2147483647',\n  }\n}\n\nfunction bindPanelPositionListeners(): void {\n  if (typeof window === 'undefined') return\n  window.addEventListener('resize', syncPanelPosition)\n  window.addEventListener('scroll', syncPanelPosition, true)\n}\n\nfunction unbindPanelPositionListeners(): void {\n  if (typeof window === 'undefined') return\n  window.removeEventListener('resize', syncPanelPosition)\n  window.removeEventListener('scroll', syncPanelPosition, true)\n}\n\nfunction closeDropdown(): void {\n  open.value = false\n}\n\nfunction toggleDropdown(): void {\n  if (props.disabled) return\n  open.value = !open.value\n}\n\nfunction closeOnEscape(e: KeyboardEvent): void {\n  if (e.key === 'Escape') closeDropdown()\n}\n\nwatch(\n  open,\n  async (isOpen) => {\n    if (typeof document === 'undefined') return\n\n    document.removeEventListener('keydown', closeOnEscape)\n    unbindPanelPositionListeners()\n\n    if (isOpen) document.addEventListener('keydown', closeOnEscape)\n\n    if (!isOpen) {\n      customValue.value = ''\n      return\n    }\n\n    bindPanelPositionListeners()\n    await nextTick()\n    syncPanelPosition()\n\n    if (props.allowCustomValue) {\n      customInputRef.value?.focus()\n    }\n  },\n  { immediate: true },\n)\n\nonUnmounted(() => {\n  if (typeof document === 'undefined') return\n  document.removeEventListener('keydown', closeOnEscape)\n  unbindPanelPositionListeners()\n})\n\nconst panelClasses = computed(() => {\n  return grSelectPanelClasses\n})\n\nconst visibleOptions = computed(() => {\n  const base = optionsResolved.value\n\n  const withCustom = (() => {\n    if (!props.allowCustomValue) return base\n    if (props.multiple) return base\n    if (modelSingle.value === '') return base\n    if (hasModelInOptions.value) return base\n    return [{ value: modelSingle.value, label: modelSingle.value }, ...base]\n  })()\n\n  if (!props.allowCustomValue) return withCustom\n\n  const q = customValue.value.trim().toLowerCase()\n  if (!q) return withCustom\n\n  return withCustom.filter((o) => {\n    return o.label.toLowerCase().includes(q) || o.value.toLowerCase().includes(q)\n  })\n})\n\nconst canAddCustom = computed(() => {\n  if (!props.allowCustomValue) return false\n  if (props.optionsView !== 'panel') return false\n  const v = customValue.value.trim()\n  if (!v) return false\n\n  if (props.multiple) {\n    if (selectedValues.value.includes(v)) return false\n    return !optionsResolved.value.some((o) => o.value === v)\n  }\n\n  if (v === modelSingle.value) return false\n  return !optionsResolved.value.some((o) => o.value === v)\n})\n\nfunction emitValue(value: GrSelectModelValue): void {\n  emit('update:modelValue', value)\n}\n\nfunction isSelected(value: string): boolean {\n  return selectedValues.value.includes(value)\n}\n\nfunction selectValue(value: string): void {\n  emitValue(value)\n  if (props.closeOnSelect) {\n    closeDropdown()\n  }\n}\n\nfunction toggleValue(value: string): void {\n  if (!props.multiple) {\n    selectValue(value)\n    return\n  }\n\n  const next = selectedValues.value.slice()\n  const idx = next.indexOf(value)\n  if (idx >= 0) {\n    next.splice(idx, 1)\n  }\n  else {\n    next.push(value)\n  }\n\n  emitValue(next)\n  if (props.closeOnSelect) {\n    closeDropdown()\n  }\n}\n\nfunction addCustom(): void {\n  const v = customValue.value.trim()\n  if (!v) return\n  toggleValue(v)\n}\n\nconst showNativeChevron = computed(() => {\n  return props.optionsView === 'native' && props.view !== 'link' && !props.multiple\n})\n\nconst nativeClearOptionVisible = computed(() => {\n  if (!props.clearable) return false\n  if (props.optionsView !== 'native') return false\n  if (props.multiple) return false\n  if (!props.options) return true\n  return !props.options.some(o => o.value === '')\n})\n\nconst panelClearVisible = computed(() => {\n  if (!props.clearable) return false\n  if (props.optionsView !== 'panel') return false\n  if (props.view === 'link') return false\n  return hasSelection.value\n})\n\nconst nativeClassName = computed(() => {\n  return grSelectNativeClass({\n    view: props.view,\n    size: props.size,\n    disabled: props.disabled,\n    variant: props.variant,\n    underline: props.underline,\n    showNativeChevron: showNativeChevron.value,\n  })\n})\n\nconst triggerClassName = computed(() => {\n  return grSelectTriggerClass({\n    view: props.view,\n    optionsView: props.optionsView,\n    size: props.size,\n    disabled: props.disabled,\n    variant: props.variant,\n    underline: props.underline,\n  })\n})\n\nfunction onChange(e: Event): void {\n  const el = e.target as HTMLSelectElement\n\n  if (props.multiple) {\n    const values = Array.from(el.selectedOptions, o => o.value)\n    emit('update:modelValue', values)\n    return\n  }\n\n  emit('update:modelValue', el.value)\n}\n\nfunction clearSelection(): void {\n  if (props.disabled) return\n  emitValue(props.multiple ? [] : '')\n}\n</script>\n\n<template>\n  <div\n    v-if=\"optionsView === 'native'\"\n    data-ds-select\n    :class=\"rootClass\"\n  >\n    <select\n      data-ds-select-native\n      :value=\"multiple ? modelMultiple : modelSingle\"\n      :multiple=\"multiple\"\n      :disabled=\"disabled\"\n      :aria-label=\"ariaLabel\"\n      :class=\"[baseClassName, nativeClassName]\"\n      @change=\"onChange\"\n    >\n      <option v-if=\"nativeClearOptionVisible\" value=\"\" />\n\n      <slot>\n        <option v-if=\"nativeCustomOptionVisible\" :value=\"modelSingle\">\n          {{ modelSingle }}\n        </option>\n        <option v-for=\"opt in options\" :key=\"opt.value\" :value=\"opt.value\">\n          {{ opt.label }}\n        </option>\n      </slot>\n    </select>\n\n    <span\n      v-if=\"showNativeChevron\"\n      data-testid=\"ds-select-chevron\"\n      class=\"absolute top-1/2 -translate-y-1/2 right-3 text-[var(--muted-fg)] pointer-events-none\"\n    >\n      <span class=\"i-lucide-chevron-down h-4 w-4\" aria-hidden=\"true\" />\n    </span>\n  </div>\n\n  <div\n    v-else\n    ref=\"rootEl\"\n    v-click-outside=\"{ handler: closeDropdown, enabled: open, exclude: clickOutsideExclude }\"\n    data-ds-select\n    :class=\"rootClass\"\n  >\n    <button\n      data-testid=\"ds-select-trigger\"\n      data-ds-select-trigger\n      type=\"button\"\n      :disabled=\"disabled\"\n      :aria-label=\"ariaLabel\"\n      role=\"combobox\"\n      aria-readonly=\"true\"\n      :aria-expanded=\"open ? 'true' : 'false'\"\n      :class=\"[baseClassName, triggerClassName]\"\n      @click=\"toggleDropdown\"\n    >\n      <span class=\"min-w-0 flex-1\">\n        <slot\n          name=\"value\"\n          :selected-options=\"selectedOptions\"\n          :selected-values=\"selectedValues\"\n          :display-label=\"displayLabel\"\n          :placeholder=\"placeholder\"\n          :has-selection=\"hasSelection\"\n        >\n          <span\n            class=\"block truncate\"\n            :class=\"!hasSelection ? 'text-[var(--muted-fg)]' : ''\"\n          >\n            {{ displayText }}\n          </span>\n        </slot>\n      </span>\n\n      <span\n        v-if=\"panelClearVisible\"\n        class=\"shrink-0 h-4 w-4\"\n        aria-hidden=\"true\"\n      />\n\n      <span\n        v-else\n        data-testid=\"ds-select-chevron\"\n        class=\"shrink-0 text-[var(--muted-fg)] pointer-events-none\"\n      >\n        <span class=\"i-lucide-chevron-down h-4 w-4\" aria-hidden=\"true\" />\n      </span>\n    </button>\n\n    <button\n      v-if=\"panelClearVisible\"\n      data-testid=\"ds-select-clear\"\n      data-ds-select-clear\n      type=\"button\"\n      class=\"absolute top-1/2 -translate-y-1/2 right-3 h-6 w-6 inline-flex items-center justify-center rounded-md text-[var(--muted-fg)] hover:text-[var(--fg)] hover:bg-[color-mix(in_srgb,var(--muted)_25%,transparent)] disabled:opacity-50\"\n      :disabled=\"disabled\"\n      :aria-label=\"clearLabel\"\n      @click.stop=\"clearSelection\"\n    >\n      <span class=\"i-lucide-x h-4 w-4\" aria-hidden=\"true\" />\n    </button>\n\n    <teleport to=\"body\">\n      <transition\n        enter-active-class=\"transition ease-out duration-150\"\n        enter-from-class=\"transform opacity-0 scale-95\"\n        enter-to-class=\"transform opacity-100 scale-100\"\n        leave-active-class=\"transition ease-in duration-100\"\n        leave-from-class=\"transform opacity-100 scale-100\"\n        leave-to-class=\"transform opacity-0 scale-95\"\n      >\n        <div\n          v-show=\"open\"\n          ref=\"panelEl\"\n          data-testid=\"ds-select-panel\"\n          data-ds-select-panel\n          class=\"fixed w-full\"\n          :style=\"panelStyle\"\n        >\n          <div :class=\"panelClasses\">\n            <div v-if=\"allowCustomValue\" class=\"p-2 border-b border-[var(--brd)]\">\n              <GrInput\n                ref=\"customInputRef\"\n                v-model=\"customValue\"\n                data-testid=\"ds-select-custom-input\"\n                type=\"text\"\n                :placeholder=\"customValuePlaceholder\"\n                size=\"sm\"\n                @keydown.enter.prevent=\"addCustom\"\n              />\n            </div>\n\n            <div\n              data-ds-select-listbox\n              class=\"p-1 overflow-auto\"\n              :style=\"{ maxHeight: `${dropdownMaxHeight}px` }\"\n              role=\"listbox\"\n              :aria-multiselectable=\"multiple ? 'true' : undefined\"\n            >\n              <button\n                v-if=\"canAddCustom\"\n                data-testid=\"ds-select-add-option\"\n                data-ds-select-add-option\n                type=\"button\"\n                class=\"w-full rounded-[10px] px-3 py-2 text-left text-[13px] hover:bg-[color-mix(in_srgb,var(--muted)_30%,transparent)]\"\n                @click=\"addCustom\"\n              >\n                Add “{{ customValue.trim() }}”\n              </button>\n\n              <button\n                v-for=\"opt in visibleOptions\"\n                :key=\"opt.value\"\n                data-ds-select-option\n                type=\"button\"\n                role=\"option\"\n                :aria-selected=\"isSelected(opt.value) ? 'true' : 'false'\"\n                class=\"w-full rounded-[10px] px-3 py-2 text-left text-[13px] hover:bg-[color-mix(in_srgb,var(--muted)_30%,transparent)]\"\n                @click=\"toggleValue(opt.value)\"\n              >\n                <slot name=\"option\" :option=\"opt\" :selected=\"isSelected(opt.value)\">\n                  <span class=\"flex items-center gap-2 min-w-0\">\n                    <span\n                      class=\"h-4 w-4 shrink-0\"\n                      :class=\"isSelected(opt.value) ? 'i-lucide-check text-[var(--primary)]' : ''\"\n                      aria-hidden=\"true\"\n                    />\n                    <span class=\"truncate\">{{ opt.label }}</span>\n                  </span>\n                </slot>\n              </button>\n            </div>\n          </div>\n        </div>\n      </transition>\n    </teleport>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/GrSelect/index.js

@@ -1,3 +1,3 @@
-import { t as e } from "./chunks/GrSelect-BMfc1-vs.js";
-import { n as t, t as n } from "../../chunks/config-CLawBqde.js";
-export { e as GrSelect, e as default, n as grSelectConfig, t as grSelectSafelist };
+import { t as GrSelect_default } from "./chunks/GrSelect-9wRWAu2R.js";
+import { n as grSelectSafelist, t as grSelectConfig } from "../../chunks/config-BDlh6iNz.js";
+export { GrSelect_default as GrSelect, GrSelect_default as default, grSelectConfig, grSelectSafelist };

package/dist/components/GrSidebar/chunks/GrSidebar-CSZ3RpFB.js

@@ -0,0 +1,44 @@
+import { createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, openBlock, renderSlot, toDisplayString } from "vue";
+//#region src/components/GrSidebar/GrSidebar.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	"data-ds-sidebar": "",
+	class: "border-r border-[var(--sidebar-brd)] bg-[var(--sidebar)] text-[var(--sidebar-fg)]"
+};
+var _hoisted_2 = {
+	key: 0,
+	"data-ds-sidebar-header": "",
+	class: "border-b border-[var(--sidebar-brd)] px-4 py-4"
+};
+var _hoisted_3 = {
+	key: 0,
+	"data-ds-sidebar-subtitle": "",
+	class: "text-[14px] text-[var(--muted-fg)]"
+};
+var _hoisted_4 = {
+	key: 1,
+	"data-ds-sidebar-title": "",
+	class: "text-[18px] font-700"
+};
+var _hoisted_5 = { class: "p-3" };
+//#endregion
+//#region src/components/GrSidebar/GrSidebar.vue
+var GrSidebar_default = /* @__PURE__ */ defineComponent({
+	__name: "GrSidebar",
+	props: {
+		title: { default: void 0 },
+		subtitle: { default: void 0 }
+	},
+	setup(__props) {
+		/**
+		* GrSidebar — боковая панель приложения с заголовком и слотом контента.
+		*
+		* Слоты `#title` / `#subtitle` имеют приоритет над одноимёнными пропами
+		* и позволяют передать произвольную разметку (иконки, бейджи, действия).
+		*/
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("aside", _hoisted_1, [_ctx.$slots.title || __props.title || _ctx.$slots.subtitle || __props.subtitle ? (openBlock(), createElementBlock("div", _hoisted_2, [_ctx.$slots.subtitle || __props.subtitle ? (openBlock(), createElementBlock("div", _hoisted_3, [renderSlot(_ctx.$slots, "subtitle", {}, () => [createTextVNode(toDisplayString(__props.subtitle), 1)])])) : createCommentVNode("", true), _ctx.$slots.title || __props.title ? (openBlock(), createElementBlock("div", _hoisted_4, [renderSlot(_ctx.$slots, "title", {}, () => [createTextVNode(toDisplayString(__props.title), 1)])])) : createCommentVNode("", true)])) : createCommentVNode("", true), createElementVNode("div", _hoisted_5, [renderSlot(_ctx.$slots, "default")])]);
+		};
+	}
+});
+//#endregion
+export { GrSidebar_default as t };

package/dist/components/GrSidebar/chunks/GrSidebar-CSZ3RpFB.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrSidebar-CSZ3RpFB.js","names":["$slots"],"sources":["../../../../src/components/GrSidebar/GrSidebar.vue","../../../../src/components/GrSidebar/GrSidebar.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * GrSidebar — боковая панель приложения с заголовком и слотом контента.\n *\n * Слоты `#title` / `#subtitle` имеют приоритет над одноимёнными пропами\n * и позволяют передать произвольную разметку (иконки, бейджи, действия).\n */\nexport interface GrSidebarProps {\n  title?: string\n  subtitle?: string\n}\n\nwithDefaults(defineProps<GrSidebarProps>(), {\n  title: undefined,\n  subtitle: undefined,\n})\n</script>\n\n<template>\n  <aside\n    data-ds-sidebar\n    class=\"border-r border-[var(--sidebar-brd)] bg-[var(--sidebar)] text-[var(--sidebar-fg)]\"\n  >\n    <div\n      v-if=\"$slots.title || title || $slots.subtitle || subtitle\"\n      data-ds-sidebar-header\n      class=\"border-b border-[var(--sidebar-brd)] px-4 py-4\"\n    >\n      <div\n        v-if=\"$slots.subtitle || subtitle\"\n        data-ds-sidebar-subtitle\n        class=\"text-[14px] text-[var(--muted-fg)]\"\n      >\n        <slot name=\"subtitle\">\n          {{ subtitle }}\n        </slot>\n      </div>\n      <div\n        v-if=\"$slots.title || title\"\n        data-ds-sidebar-title\n        class=\"text-[18px] font-700\"\n      >\n        <slot name=\"title\">\n          {{ title }}\n        </slot>\n      </div>\n    </div>\n    <div class=\"p-3\">\n      <slot />\n    </div>\n  </aside>\n</template>\n","<script setup lang=\"ts\">\n/**\n * GrSidebar — боковая панель приложения с заголовком и слотом контента.\n *\n * Слоты `#title` / `#subtitle` имеют приоритет над одноимёнными пропами\n * и позволяют передать произвольную разметку (иконки, бейджи, действия).\n */\nexport interface GrSidebarProps {\n  title?: string\n  subtitle?: string\n}\n\nwithDefaults(defineProps<GrSidebarProps>(), {\n  title: undefined,\n  subtitle: undefined,\n})\n</script>\n\n<template>\n  <aside\n    data-ds-sidebar\n    class=\"border-r border-[var(--sidebar-brd)] bg-[var(--sidebar)] text-[var(--sidebar-fg)]\"\n  >\n    <div\n      v-if=\"$slots.title || title || $slots.subtitle || subtitle\"\n      data-ds-sidebar-header\n      class=\"border-b border-[var(--sidebar-brd)] px-4 py-4\"\n    >\n      <div\n        v-if=\"$slots.subtitle || subtitle\"\n        data-ds-sidebar-subtitle\n        class=\"text-[14px] text-[var(--muted-fg)]\"\n      >\n        <slot name=\"subtitle\">\n          {{ subtitle }}\n        </slot>\n      </div>\n      <div\n        v-if=\"$slots.title || title\"\n        data-ds-sidebar-title\n        class=\"text-[18px] font-700\"\n      >\n        <slot name=\"title\">\n          {{ title }}\n        </slot>\n      </div>\n    </div>\n    <div class=\"p-3\">\n      <slot />\n    </div>\n  </aside>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAmBE,mBA+BQ,SA/BR,YA+BQ,CA1BEA,KAAAA,OAAO,SAAS,QAAA,SAASA,KAAAA,OAAO,YAAY,QAAA,YAAA,WAAA,EADpD,mBAuBM,OAvBN,YAuBM,CAjBIA,KAAAA,OAAO,YAAY,QAAA,YAAA,WAAA,EAD3B,mBAQM,OARN,YAQM,CAHJ,WAEO,KAAA,QAAA,YAAA,EAAA,QAAA,CAAA,gBAAA,gBADF,QAAA,SAAQ,EAAA,EAAA,CAAA,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,EAIPA,KAAAA,OAAO,SAAS,QAAA,SAAA,WAAA,EADxB,mBAQM,OARN,YAQM,CAHJ,WAEO,KAAA,QAAA,SAAA,EAAA,QAAA,CAAA,gBAAA,gBADF,QAAA,MAAK,EAAA,EAAA,CAAA,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,EAId,mBAEM,OAFN,YAEM,CADJ,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA,CAAA,CAAA"}

package/dist/components/GrSidebar/index.js

@@ -1,3 +1,3 @@
-import { t as e } from "./chunks/GrSidebar-C4SXXhfO.js";
-import { t } from "../../chunks/config-DlidGf7P.js";
-export { e as GrSidebar, e as default, t as grSidebarConfig };
+import { t as GrSidebar_default } from "./chunks/GrSidebar-CSZ3RpFB.js";
+import { t as grSidebarConfig } from "../../chunks/config-qJXIIY1E.js";
+export { GrSidebar_default as GrSidebar, GrSidebar_default as default, grSidebarConfig };

package/dist/components/GrSkeleton/chunks/GrSkeleton-DKXkqWDa.js

@@ -0,0 +1,33 @@
+import { createElementBlock, defineComponent, normalizeStyle, openBlock } from "vue";
+import '../../../GrSkeleton.css';//#endregion
+//#region src/components/GrSkeleton/GrSkeleton.vue
+var GrSkeleton_default = /* @__PURE__ */ defineComponent({
+	__name: "GrSkeleton",
+	props: {
+		height: { default: "12px" },
+		width: { default: "100%" },
+		rounded: { default: "9999px" }
+	},
+	setup(__props) {
+		/**
+		* GrSkeleton — заглушка-плейсхолдер для загружающегося контента.
+		*
+		* Помечен `aria-hidden="true"`, чтобы скринридер не озвучивал «пустой» узел;
+		* внешний контейнер обычно имеет `aria-busy="true"` + `aria-live`.
+		*/
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-ds-skeleton": "",
+				"aria-hidden": "true",
+				class: "bg-[var(--muted)] border border-[var(--brd)]",
+				style: normalizeStyle({
+					height: __props.height,
+					width: __props.width,
+					borderRadius: __props.rounded
+				})
+			}, null, 4);
+		};
+	}
+});
+//#endregion
+export { GrSkeleton_default as t };