@feugene/granularity 0.19.0 → 0.21.0

package/dist/components/GrDropdownMenu/chunks/GrDropdownMenu-LOaFSCyd.js

@@ -0,0 +1,421 @@
+import { t as check_default } from "../../../chunks/check-BZI24Qs4.js";
+import { t as GrDropdown_default } from "../../GrDropdown/chunks/GrDropdown-BSfFOcDx.js";
+import { a as columnBaseClass, c as dividerInsetClass, d as grDropdownMenuListClass, f as headerClass, g as textAlignClass, h as listBaseClass, i as colsClass, l as dividersClass, m as itemShortcutClass, o as columnsBaseClass, p as itemIndicatorClass, r as alignClass, s as dividerClass, u as grDropdownMenuItemClass } from "../../../chunks/config-BKvX0q10.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, guardReactiveProps, mergeProps, normalizeClass, normalizeProps, openBlock, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useAttrs, useId, useSlots, withCtx } from "vue";
+//#endregion
+//#region src/components/GrDropdownMenu/GrDropdownMenuDivider.vue
+var GrDropdownMenuDivider_default = /* @__PURE__ */ defineComponent({
+	__name: "GrDropdownMenuDivider",
+	props: { inset: {
+		type: Boolean,
+		default: false
+	} },
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-gr-dropdown-menu-divider": "",
+				role: "separator",
+				class: normalizeClass([unref(dividerClass), __props.inset ? unref(dividerInsetClass) : ""])
+			}, null, 2);
+		};
+	}
+});
+//#endregion
+//#region src/components/GrDropdownMenu/GrDropdownMenuHeader.vue
+var GrDropdownMenuHeader_default = /* @__PURE__ */ defineComponent({
+	__name: "GrDropdownMenuHeader",
+	props: {
+		title: { default: void 0 },
+		align: { default: "left" },
+		uppercase: {
+			type: Boolean,
+			default: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		/**
+		* Заголовок — подпись, а не пункт меню: `role="presentation"` убирает его из
+		* числа потомков `role="menu"`. Имя группе он даёт через `aria-labelledby`
+		* у `GrDropdownMenuGroup`.
+		*/
+		const slots = useSlots();
+		const isVisible = computed(() => Boolean(props.title) || Boolean(slots.default));
+		return (_ctx, _cache) => {
+			return isVisible.value ? (openBlock(), createElementBlock("div", {
+				key: 0,
+				"data-gr-dropdown-menu-header": "",
+				role: "presentation",
+				class: normalizeClass([
+					unref(headerClass),
+					unref(textAlignClass)[__props.align],
+					{ uppercase: __props.uppercase }
+				])
+			}, [renderSlot(_ctx.$slots, "default", {}, () => [createTextVNode(toDisplayString(__props.title), 1)])], 2)) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+//#region src/components/GrDropdownMenu/GrDropdownMenuGroup.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-labelledby"];
+//#endregion
+//#region src/components/GrDropdownMenu/GrDropdownMenuGroup.vue
+var GrDropdownMenuGroup_default = /* @__PURE__ */ defineComponent({
+	__name: "GrDropdownMenuGroup",
+	props: {
+		title: { default: void 0 },
+		titleAlign: { default: "left" },
+		dividers: {
+			type: Boolean,
+			default: false
+		},
+		uppercase: {
+			type: Boolean,
+			default: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const titleId = useId();
+		const labelledBy = computed(() => props.title ? titleId : void 0);
+		const itemsClass = computed(() => [listBaseClass, props.dividers ? dividersClass : ""].filter(Boolean).join(" "));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-gr-dropdown-menu-group": "",
+				role: "group",
+				"aria-labelledby": labelledBy.value,
+				class: "w-full"
+			}, [__props.title ? (openBlock(), createBlock(GrDropdownMenuHeader_default, {
+				key: 0,
+				id: unref(titleId),
+				title: __props.title,
+				align: __props.titleAlign,
+				uppercase: __props.uppercase
+			}, null, 8, [
+				"id",
+				"title",
+				"align",
+				"uppercase"
+			])) : createCommentVNode("", true), createElementVNode("div", {
+				role: "none",
+				class: normalizeClass(itemsClass.value)
+			}, [renderSlot(_ctx.$slots, "default")], 2)], 8, _hoisted_1);
+		};
+	}
+});
+//#endregion
+//#region src/components/GrDropdownMenu/GrDropdownMenuItem.vue
+var GrDropdownMenuItem_default = /* @__PURE__ */ defineComponent({
+	inheritAttrs: false,
+	__name: "GrDropdownMenuItem",
+	props: {
+		as: { default: "button" },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		href: { default: void 0 },
+		target: { default: void 0 },
+		rel: { default: void 0 },
+		external: {
+			type: Boolean,
+			default: false
+		},
+		align: { default: "left" },
+		variant: { default: "default" },
+		role: { default: "menuitem" },
+		checked: {
+			type: Boolean,
+			default: void 0
+		},
+		icon: { default: void 0 },
+		shortcut: { default: void 0 }
+	},
+	setup(__props) {
+		const props = __props;
+		const attrs = useAttrs();
+		const renderAs = computed(() => {
+			if (props.as && props.as !== "button") return props.as;
+			return props.href ? "a" : "button";
+		});
+		const isNativeButton = computed(() => renderAs.value === "button");
+		const resolvedHref = computed(() => props.disabled ? void 0 : props.href);
+		const resolvedTarget = computed(() => props.target ?? (props.external ? "_blank" : void 0));
+		const resolvedRel = computed(() => props.rel ?? (resolvedTarget.value === "_blank" ? "noopener noreferrer" : void 0));
+		const isCheckable = computed(() => props.role !== "menuitem");
+		const className = computed(() => grDropdownMenuItemClass({
+			align: props.align,
+			variant: props.variant,
+			disabled: props.disabled
+		}));
+		/**
+		* Roving tabindex паттерна menu: табируемым остаётся триггер, а внутри панели
+		* фокусом распоряжаются стрелки (`GrDropdown` наводит его программно). Без
+		* этого `Tab` ходил бы по пунктам, и меню было бы списком кнопок, а не меню.
+		*
+		* Выключённый пункт из обхода **не** выпадает: `aria-disabled` вместо нативного
+		* `disabled` оставляет его фокусируемым, и пользователь узнаёт, что действие
+		* существует, но сейчас недоступно (рекомендация WAI-ARIA APG).
+		*/
+		const resolvedTabindex = computed(() => attrs.tabindex ?? -1);
+		function onClickCapture(e) {
+			if (!props.disabled) return;
+			e.preventDefault();
+			e.stopImmediatePropagation();
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(renderAs.value), mergeProps(unref(attrs), {
+				"data-gr-dropdown-menu-item": "",
+				role: __props.role,
+				class: className.value,
+				type: isNativeButton.value ? unref(attrs).type ?? "button" : void 0,
+				href: resolvedHref.value,
+				target: resolvedHref.value ? resolvedTarget.value : void 0,
+				rel: resolvedHref.value ? resolvedRel.value : void 0,
+				"aria-disabled": __props.disabled ? "true" : void 0,
+				"aria-checked": isCheckable.value ? __props.checked ? "true" : "false" : void 0,
+				tabindex: resolvedTabindex.value,
+				onClickCapture
+			}), {
+				default: withCtx(() => [
+					isCheckable.value ? (openBlock(), createElementBlock("span", {
+						key: 0,
+						"data-gr-dropdown-menu-item-indicator": "",
+						class: normalizeClass(unref(itemIndicatorClass)),
+						"aria-hidden": "true"
+					}, [__props.checked ? (openBlock(), createBlock(unref(check_default), {
+						key: 0,
+						class: normalizeClass(unref(itemIndicatorClass))
+					}, null, 8, ["class"])) : createCommentVNode("", true)], 2)) : createCommentVNode("", true),
+					renderSlot(_ctx.$slots, "icon", {}, () => [__props.icon ? (openBlock(), createBlock(resolveDynamicComponent(__props.icon), {
+						key: 0,
+						class: normalizeClass(unref(itemIndicatorClass)),
+						"aria-hidden": "true"
+					}, null, 8, ["class"])) : createCommentVNode("", true)]),
+					renderSlot(_ctx.$slots, "default"),
+					renderSlot(_ctx.$slots, "shortcut", {}, () => [__props.shortcut ? (openBlock(), createElementBlock("span", {
+						key: 0,
+						"data-gr-dropdown-menu-item-shortcut": "",
+						class: normalizeClass(unref(itemShortcutClass))
+					}, toDisplayString(__props.shortcut), 3)) : createCommentVNode("", true)])
+				]),
+				_: 3
+			}, 16, [
+				"role",
+				"class",
+				"type",
+				"href",
+				"target",
+				"rel",
+				"aria-disabled",
+				"aria-checked",
+				"tabindex"
+			]);
+		};
+	}
+});
+//#endregion
+//#region src/components/GrDropdownMenu/GrDropdownMenuList.vue
+var GrDropdownMenuList_default = /* @__PURE__ */ defineComponent({
+	__name: "GrDropdownMenuList",
+	props: {
+		dividers: {
+			type: Boolean,
+			default: false
+		},
+		borderTop: {
+			type: Boolean,
+			default: false
+		},
+		borderBottom: {
+			type: Boolean,
+			default: false
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		const className = computed(() => grDropdownMenuListClass({
+			dividers: props.dividers,
+			borderTop: props.borderTop,
+			borderBottom: props.borderBottom
+		}));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-gr-dropdown-menu-list": "",
+				role: "none",
+				class: normalizeClass(className.value)
+			}, [renderSlot(_ctx.$slots, "default")], 2);
+		};
+	}
+});
+//#endregion
+//#region src/components/GrDropdownMenu/menuModel.ts
+function isMenuSeparator(entry) {
+	return "type" in entry && entry.type === "divider";
+}
+function isMenuSection(entry) {
+	return "type" in entry && entry.type === "group";
+}
+function isMenuAction(entry) {
+	return !isMenuSeparator(entry) && !isMenuSection(entry);
+}
+//#endregion
+//#region src/components/GrDropdownMenu/GrDropdownMenu.vue
+var GrDropdownMenu_default = /* @__PURE__ */ defineComponent({
+	__name: "GrDropdownMenu",
+	props: {
+		placement: { default: "bottom-end" },
+		offset: { default: 8 },
+		width: { default: "12rem" },
+		trigger: { default: "click" },
+		openDelay: { default: 120 },
+		closeDelay: { default: 160 },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		teleportTo: { default: void 0 },
+		closeOnContentClick: {
+			type: Boolean,
+			default: true
+		},
+		contentClass: { default: "p-0" },
+		items: { default: void 0 },
+		dividers: {
+			type: Boolean,
+			default: false
+		},
+		borderTop: {
+			type: Boolean,
+			default: false
+		},
+		borderBottom: {
+			type: Boolean,
+			default: false
+		},
+		listClass: { default: "" },
+		open: {
+			type: Boolean,
+			default: void 0
+		}
+	},
+	emits: ["select", "update:open"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		function itemProps(item) {
+			return {
+				href: item.href,
+				target: item.target,
+				rel: item.rel,
+				external: item.external,
+				disabled: item.disabled,
+				variant: item.variant,
+				role: item.role,
+				checked: item.checked,
+				icon: item.icon,
+				shortcut: item.shortcut
+			};
+		}
+		function onSelect(item) {
+			if (item.disabled) return;
+			emit("select", item);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(GrDropdown_default, {
+				"data-gr-dropdown-menu": "",
+				placement: __props.placement,
+				offset: __props.offset,
+				width: __props.width,
+				trigger: __props.trigger,
+				"open-delay": __props.openDelay,
+				"close-delay": __props.closeDelay,
+				disabled: __props.disabled,
+				"teleport-to": __props.teleportTo,
+				"close-on-content-click": __props.closeOnContentClick,
+				"content-class": __props.contentClass,
+				open: __props.open,
+				"onUpdate:open": _cache[0] || (_cache[0] = ($event) => emit("update:open", $event))
+			}, {
+				trigger: withCtx((slotProps) => [renderSlot(_ctx.$slots, "trigger", normalizeProps(guardReactiveProps(slotProps)))]),
+				content: withCtx((slotProps) => [createVNode(GrDropdownMenuList_default, {
+					dividers: __props.dividers,
+					"border-top": __props.borderTop,
+					"border-bottom": __props.borderBottom,
+					class: normalizeClass(__props.listClass)
+				}, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotProps)), () => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.items ?? [], (entry, index) => {
+						return openBlock(), createElementBlock(Fragment, null, [unref(isMenuSeparator)(entry) ? (openBlock(), createBlock(GrDropdownMenuDivider_default, {
+							key: `divider-${index}`,
+							inset: entry.inset
+						}, null, 8, ["inset"])) : unref(isMenuSection)(entry) ? (openBlock(), createBlock(GrDropdownMenuGroup_default, {
+							key: `group-${entry.title ?? index}`,
+							title: entry.title
+						}, {
+							default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(entry.items, (item) => {
+								return openBlock(), createBlock(GrDropdownMenuItem_default, mergeProps({ key: item.key }, { ref_for: true }, itemProps(item), { onClick: ($event) => onSelect(item) }), {
+									default: withCtx(() => [createTextVNode(toDisplayString(item.label), 1)]),
+									_: 2
+								}, 1040, ["onClick"]);
+							}), 128))]),
+							_: 2
+						}, 1032, ["title"])) : unref(isMenuAction)(entry) ? (openBlock(), createBlock(GrDropdownMenuItem_default, mergeProps({ key: entry.key }, { ref_for: true }, itemProps(entry), { onClick: ($event) => onSelect(entry) }), {
+							default: withCtx(() => [createTextVNode(toDisplayString(entry.label), 1)]),
+							_: 2
+						}, 1040, ["onClick"])) : createCommentVNode("", true)], 64);
+					}), 256))])]),
+					_: 2
+				}, 1032, [
+					"dividers",
+					"border-top",
+					"border-bottom",
+					"class"
+				])]),
+				_: 3
+			}, 8, [
+				"placement",
+				"offset",
+				"width",
+				"trigger",
+				"open-delay",
+				"close-delay",
+				"disabled",
+				"teleport-to",
+				"close-on-content-click",
+				"content-class",
+				"open"
+			]);
+		};
+	}
+});
+//#endregion
+//#region src/components/GrDropdownMenu/GrDropdownMenuColumn.vue
+var GrDropdownMenuColumn_default = /* @__PURE__ */ defineComponent({
+	__name: "GrDropdownMenuColumn",
+	props: { align: { default: "center" } },
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-gr-dropdown-menu-column": "",
+				role: "none",
+				class: normalizeClass([unref(columnBaseClass), unref(alignClass)[__props.align]])
+			}, [renderSlot(_ctx.$slots, "default")], 2);
+		};
+	}
+});
+//#endregion
+//#region src/components/GrDropdownMenu/GrDropdownMenuColumns.vue
+var GrDropdownMenuColumns_default = /* @__PURE__ */ defineComponent({
+	__name: "GrDropdownMenuColumns",
+	props: { cols: { default: 2 } },
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-gr-dropdown-menu-columns": "",
+				role: "none",
+				class: normalizeClass([unref(columnsBaseClass), unref(colsClass)[__props.cols]])
+			}, [renderSlot(_ctx.$slots, "default")], 2);
+		};
+	}
+});
+//#endregion
+export { GrDropdownMenuItem_default as a, GrDropdownMenuDivider_default as c, GrDropdownMenuList_default as i, GrDropdownMenuColumn_default as n, GrDropdownMenuGroup_default as o, GrDropdownMenu_default as r, GrDropdownMenuHeader_default as s, GrDropdownMenuColumns_default as t };

package/dist/components/GrDropdownMenu/chunks/GrDropdownMenu-LOaFSCyd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrDropdownMenu-LOaFSCyd.js","names":[],"sources":["../../../../src/components/GrDropdownMenu/GrDropdownMenuDivider.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuDivider.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuHeader.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuHeader.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuGroup.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuGroup.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuItem.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuItem.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuList.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuList.vue","../../../../src/components/GrDropdownMenu/menuModel.ts","../../../../src/components/GrDropdownMenu/GrDropdownMenu.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenu.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuColumn.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuColumn.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuColumns.vue","../../../../src/components/GrDropdownMenu/GrDropdownMenuColumns.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { dividerClass, dividerInsetClass } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuDividerProps {\n  inset?: boolean\n}\n\nwithDefaults(defineProps<GrDropdownMenuDividerProps>(), {\n  inset: false,\n})\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-divider\n    role=\"separator\"\n    :class=\"[dividerClass, inset ? dividerInsetClass : '']\"\n  />\n</template>\n","<script setup lang=\"ts\">\nimport { dividerClass, dividerInsetClass } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuDividerProps {\n  inset?: boolean\n}\n\nwithDefaults(defineProps<GrDropdownMenuDividerProps>(), {\n  inset: false,\n})\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-divider\n    role=\"separator\"\n    :class=\"[dividerClass, inset ? dividerInsetClass : '']\"\n  />\n</template>\n","<script setup lang=\"ts\">\nimport { computed, useSlots } from 'vue'\n\nimport { headerClass, textAlignClass, type GrDropdownMenuHeaderAlign } from './grDropdownMenuStyles'\n\nexport type { GrDropdownMenuHeaderAlign } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuHeaderProps {\n  title?: string\n  align?: GrDropdownMenuHeaderAlign\n  uppercase?: boolean\n}\n\nconst props = withDefaults(defineProps<GrDropdownMenuHeaderProps>(), {\n  title: undefined,\n  align: 'left',\n  uppercase: true,\n})\n\n/**\n * Заголовок — подпись, а не пункт меню: `role=\"presentation\"` убирает его из\n * числа потомков `role=\"menu\"`. Имя группе он даёт через `aria-labelledby`\n * у `GrDropdownMenuGroup`.\n */\nconst slots = useSlots()\nconst isVisible = computed(() => Boolean(props.title) || Boolean(slots.default))\n</script>\n\n<template>\n  <div\n    v-if=\"isVisible\"\n    data-gr-dropdown-menu-header\n    role=\"presentation\"\n    :class=\"[headerClass, textAlignClass[align], { uppercase }]\"\n  >\n    <slot>{{ title }}</slot>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, useSlots } from 'vue'\n\nimport { headerClass, textAlignClass, type GrDropdownMenuHeaderAlign } from './grDropdownMenuStyles'\n\nexport type { GrDropdownMenuHeaderAlign } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuHeaderProps {\n  title?: string\n  align?: GrDropdownMenuHeaderAlign\n  uppercase?: boolean\n}\n\nconst props = withDefaults(defineProps<GrDropdownMenuHeaderProps>(), {\n  title: undefined,\n  align: 'left',\n  uppercase: true,\n})\n\n/**\n * Заголовок — подпись, а не пункт меню: `role=\"presentation\"` убирает его из\n * числа потомков `role=\"menu\"`. Имя группе он даёт через `aria-labelledby`\n * у `GrDropdownMenuGroup`.\n */\nconst slots = useSlots()\nconst isVisible = computed(() => Boolean(props.title) || Boolean(slots.default))\n</script>\n\n<template>\n  <div\n    v-if=\"isVisible\"\n    data-gr-dropdown-menu-header\n    role=\"presentation\"\n    :class=\"[headerClass, textAlignClass[align], { uppercase }]\"\n  >\n    <slot>{{ title }}</slot>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, useId } from 'vue'\n\nimport GrDropdownMenuHeader from './GrDropdownMenuHeader.vue'\nimport { dividersClass, listBaseClass, type GrDropdownMenuHeaderAlign } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuGroupProps {\n  title?: string\n  titleAlign?: GrDropdownMenuHeaderAlign\n  dividers?: boolean\n  uppercase?: boolean\n}\n\nconst props = withDefaults(defineProps<GrDropdownMenuGroupProps>(), {\n  title: undefined,\n  titleAlign: 'left',\n  dividers: false,\n  uppercase: true,\n})\n\nconst titleId = useId()\n// Имя группы читается диктором при входе в неё; без заголовка называть нечем.\nconst labelledBy = computed(() => (props.title ? titleId : undefined))\n\nconst itemsClass = computed(() => [\n  listBaseClass,\n  props.dividers ? dividersClass : '',\n].filter(Boolean).join(' '))\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-group\n    role=\"group\"\n    :aria-labelledby=\"labelledBy\"\n    class=\"w-full\"\n  >\n    <GrDropdownMenuHeader\n      v-if=\"title\"\n      :id=\"titleId\"\n      :title=\"title\"\n      :align=\"titleAlign\"\n      :uppercase=\"uppercase\"\n    />\n    <div role=\"none\" :class=\"itemsClass\">\n      <slot />\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, useId } from 'vue'\n\nimport GrDropdownMenuHeader from './GrDropdownMenuHeader.vue'\nimport { dividersClass, listBaseClass, type GrDropdownMenuHeaderAlign } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuGroupProps {\n  title?: string\n  titleAlign?: GrDropdownMenuHeaderAlign\n  dividers?: boolean\n  uppercase?: boolean\n}\n\nconst props = withDefaults(defineProps<GrDropdownMenuGroupProps>(), {\n  title: undefined,\n  titleAlign: 'left',\n  dividers: false,\n  uppercase: true,\n})\n\nconst titleId = useId()\n// Имя группы читается диктором при входе в неё; без заголовка называть нечем.\nconst labelledBy = computed(() => (props.title ? titleId : undefined))\n\nconst itemsClass = computed(() => [\n  listBaseClass,\n  props.dividers ? dividersClass : '',\n].filter(Boolean).join(' '))\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-group\n    role=\"group\"\n    :aria-labelledby=\"labelledBy\"\n    class=\"w-full\"\n  >\n    <GrDropdownMenuHeader\n      v-if=\"title\"\n      :id=\"titleId\"\n      :title=\"title\"\n      :align=\"titleAlign\"\n      :uppercase=\"uppercase\"\n    />\n    <div role=\"none\" :class=\"itemsClass\">\n      <slot />\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, useAttrs } from 'vue'\nimport type { Component } from 'vue'\n\nimport IconCheck from '~icons/lucide/check'\n\nimport {\n  grDropdownMenuItemClass,\n  itemIndicatorClass,\n  itemShortcutClass,\n  type GrDropdownMenuItemAlign,\n  type GrDropdownMenuItemVariant,\n} from './grDropdownMenuStyles'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nexport type { GrDropdownMenuItemAlign, GrDropdownMenuItemVariant } from './grDropdownMenuStyles'\n\n/**\n * Роль пункта. `menuitemcheckbox`/`menuitemradio` — пункты-переключатели: они\n * обязаны нести `aria-checked`, иначе AT прочитает их как обычные команды.\n */\nexport type GrDropdownMenuItemRole = 'menuitem' | 'menuitemcheckbox' | 'menuitemradio'\n\nexport interface GrDropdownMenuItemProps {\n  as?: string | Component\n  disabled?: boolean\n  /** Пункт-ссылка. У выключенного пункта не рендерится: ссылка осталась бы рабочей. */\n  href?: string\n  target?: string\n  rel?: string\n  /** Шорткат для `target=\"_blank\"` + `rel=\"noopener noreferrer\"`. */\n  external?: boolean\n  align?: GrDropdownMenuItemAlign\n  variant?: GrDropdownMenuItemVariant\n  role?: GrDropdownMenuItemRole\n  /** Состояние переключателя. Осмысленно с `role=\"menuitemcheckbox|radio\"`. */\n  checked?: boolean\n  /** Иконка слева. Слот `#icon` сильнее. */\n  icon?: Component\n  /** Подпись сочетания клавиш справа. Слот `#shortcut` сильнее. */\n  shortcut?: string\n}\n\nconst props = withDefaults(defineProps<GrDropdownMenuItemProps>(), {\n  as: 'button',\n  disabled: false,\n  href: undefined,\n  target: undefined,\n  rel: undefined,\n  external: false,\n  align: 'left',\n  variant: 'default',\n  role: 'menuitem',\n  checked: undefined,\n  icon: undefined,\n  shortcut: undefined,\n})\n\nconst attrs = useAttrs()\n\n// Полиморфный корень: явный `as` сильнее всего, иначе `href` сам делает пункт\n// ссылкой — как у `GrButton`, чтобы не приходилось задавать `as=\"a\"` вручную.\nconst renderAs = computed<string | Component>(() => {\n  if (props.as && props.as !== 'button')\n    return props.as\n  return props.href ? 'a' : 'button'\n})\n\nconst isNativeButton = computed(() => renderAs.value === 'button')\n\n// Выключенный пункт остаётся ссылкой, если оставить ему `href`: средняя кнопка и\n// контекстное меню браузера обойдут любой перехват клика (тот же приём в `GrButton`).\nconst resolvedHref = computed(() => (props.disabled ? undefined : props.href))\nconst resolvedTarget = computed(() => props.target ?? (props.external ? '_blank' : undefined))\nconst resolvedRel = computed(() =>\n  props.rel ?? (resolvedTarget.value === '_blank' ? 'noopener noreferrer' : undefined),\n)\n// Отметка занимает место всегда, когда пункт переключаемый: иначе строки\n// «включено» и «выключено» разъезжаются по горизонтали.\nconst isCheckable = computed(() => props.role !== 'menuitem')\n\nconst className = computed(() => grDropdownMenuItemClass({\n  align: props.align,\n  variant: props.variant,\n  disabled: props.disabled,\n}))\n\n/**\n * Roving tabindex паттерна menu: табируемым остаётся триггер, а внутри панели\n * фокусом распоряжаются стрелки (`GrDropdown` наводит его программно). Без\n * этого `Tab` ходил бы по пунктам, и меню было бы списком кнопок, а не меню.\n *\n * Выключённый пункт из обхода **не** выпадает: `aria-disabled` вместо нативного\n * `disabled` оставляет его фокусируемым, и пользователь узнаёт, что действие\n * существует, но сейчас недоступно (рекомендация WAI-ARIA APG).\n */\nconst resolvedTabindex = computed(() => (attrs.tabindex as number | string | undefined) ?? -1)\n\nfunction onClickCapture(e: MouseEvent): void {\n  if (!props.disabled)\n    return\n\n  e.preventDefault()\n  // `stopImmediatePropagation`, а не `stopPropagation`: обработчик, навешенный\n  // на сам пункт через `v-bind=\"attrs\"`, живёт на этом же элементе, и обычная\n  // остановка всплытия его не отменяет.\n  e.stopImmediatePropagation()\n}\n</script>\n\n<template>\n  <component\n    :is=\"renderAs\"\n    v-bind=\"attrs\"\n    data-gr-dropdown-menu-item\n    :role=\"role\"\n    :class=\"className\"\n    :type=\"isNativeButton ? (attrs.type as any) ?? 'button' : undefined\"\n    :href=\"resolvedHref\"\n    :target=\"resolvedHref ? resolvedTarget : undefined\"\n    :rel=\"resolvedHref ? resolvedRel : undefined\"\n    :aria-disabled=\"disabled ? 'true' : undefined\"\n    :aria-checked=\"isCheckable ? (checked ? 'true' : 'false') : undefined\"\n    :tabindex=\"resolvedTabindex\"\n    @click.capture=\"onClickCapture\"\n  >\n    <span\n      v-if=\"isCheckable\"\n      data-gr-dropdown-menu-item-indicator\n      :class=\"itemIndicatorClass\"\n      aria-hidden=\"true\"\n    >\n      <IconCheck v-if=\"checked\" :class=\"itemIndicatorClass\" />\n    </span>\n\n    <slot name=\"icon\">\n      <component\n        :is=\"icon\"\n        v-if=\"icon\"\n        :class=\"itemIndicatorClass\"\n        aria-hidden=\"true\"\n      />\n    </slot>\n\n    <slot />\n\n    <slot name=\"shortcut\">\n      <span v-if=\"shortcut\" data-gr-dropdown-menu-item-shortcut :class=\"itemShortcutClass\">{{ shortcut }}</span>\n    </slot>\n  </component>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, useAttrs } from 'vue'\nimport type { Component } from 'vue'\n\nimport IconCheck from '~icons/lucide/check'\n\nimport {\n  grDropdownMenuItemClass,\n  itemIndicatorClass,\n  itemShortcutClass,\n  type GrDropdownMenuItemAlign,\n  type GrDropdownMenuItemVariant,\n} from './grDropdownMenuStyles'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nexport type { GrDropdownMenuItemAlign, GrDropdownMenuItemVariant } from './grDropdownMenuStyles'\n\n/**\n * Роль пункта. `menuitemcheckbox`/`menuitemradio` — пункты-переключатели: они\n * обязаны нести `aria-checked`, иначе AT прочитает их как обычные команды.\n */\nexport type GrDropdownMenuItemRole = 'menuitem' | 'menuitemcheckbox' | 'menuitemradio'\n\nexport interface GrDropdownMenuItemProps {\n  as?: string | Component\n  disabled?: boolean\n  /** Пункт-ссылка. У выключенного пункта не рендерится: ссылка осталась бы рабочей. */\n  href?: string\n  target?: string\n  rel?: string\n  /** Шорткат для `target=\"_blank\"` + `rel=\"noopener noreferrer\"`. */\n  external?: boolean\n  align?: GrDropdownMenuItemAlign\n  variant?: GrDropdownMenuItemVariant\n  role?: GrDropdownMenuItemRole\n  /** Состояние переключателя. Осмысленно с `role=\"menuitemcheckbox|radio\"`. */\n  checked?: boolean\n  /** Иконка слева. Слот `#icon` сильнее. */\n  icon?: Component\n  /** Подпись сочетания клавиш справа. Слот `#shortcut` сильнее. */\n  shortcut?: string\n}\n\nconst props = withDefaults(defineProps<GrDropdownMenuItemProps>(), {\n  as: 'button',\n  disabled: false,\n  href: undefined,\n  target: undefined,\n  rel: undefined,\n  external: false,\n  align: 'left',\n  variant: 'default',\n  role: 'menuitem',\n  checked: undefined,\n  icon: undefined,\n  shortcut: undefined,\n})\n\nconst attrs = useAttrs()\n\n// Полиморфный корень: явный `as` сильнее всего, иначе `href` сам делает пункт\n// ссылкой — как у `GrButton`, чтобы не приходилось задавать `as=\"a\"` вручную.\nconst renderAs = computed<string | Component>(() => {\n  if (props.as && props.as !== 'button')\n    return props.as\n  return props.href ? 'a' : 'button'\n})\n\nconst isNativeButton = computed(() => renderAs.value === 'button')\n\n// Выключенный пункт остаётся ссылкой, если оставить ему `href`: средняя кнопка и\n// контекстное меню браузера обойдут любой перехват клика (тот же приём в `GrButton`).\nconst resolvedHref = computed(() => (props.disabled ? undefined : props.href))\nconst resolvedTarget = computed(() => props.target ?? (props.external ? '_blank' : undefined))\nconst resolvedRel = computed(() =>\n  props.rel ?? (resolvedTarget.value === '_blank' ? 'noopener noreferrer' : undefined),\n)\n// Отметка занимает место всегда, когда пункт переключаемый: иначе строки\n// «включено» и «выключено» разъезжаются по горизонтали.\nconst isCheckable = computed(() => props.role !== 'menuitem')\n\nconst className = computed(() => grDropdownMenuItemClass({\n  align: props.align,\n  variant: props.variant,\n  disabled: props.disabled,\n}))\n\n/**\n * Roving tabindex паттерна menu: табируемым остаётся триггер, а внутри панели\n * фокусом распоряжаются стрелки (`GrDropdown` наводит его программно). Без\n * этого `Tab` ходил бы по пунктам, и меню было бы списком кнопок, а не меню.\n *\n * Выключённый пункт из обхода **не** выпадает: `aria-disabled` вместо нативного\n * `disabled` оставляет его фокусируемым, и пользователь узнаёт, что действие\n * существует, но сейчас недоступно (рекомендация WAI-ARIA APG).\n */\nconst resolvedTabindex = computed(() => (attrs.tabindex as number | string | undefined) ?? -1)\n\nfunction onClickCapture(e: MouseEvent): void {\n  if (!props.disabled)\n    return\n\n  e.preventDefault()\n  // `stopImmediatePropagation`, а не `stopPropagation`: обработчик, навешенный\n  // на сам пункт через `v-bind=\"attrs\"`, живёт на этом же элементе, и обычная\n  // остановка всплытия его не отменяет.\n  e.stopImmediatePropagation()\n}\n</script>\n\n<template>\n  <component\n    :is=\"renderAs\"\n    v-bind=\"attrs\"\n    data-gr-dropdown-menu-item\n    :role=\"role\"\n    :class=\"className\"\n    :type=\"isNativeButton ? (attrs.type as any) ?? 'button' : undefined\"\n    :href=\"resolvedHref\"\n    :target=\"resolvedHref ? resolvedTarget : undefined\"\n    :rel=\"resolvedHref ? resolvedRel : undefined\"\n    :aria-disabled=\"disabled ? 'true' : undefined\"\n    :aria-checked=\"isCheckable ? (checked ? 'true' : 'false') : undefined\"\n    :tabindex=\"resolvedTabindex\"\n    @click.capture=\"onClickCapture\"\n  >\n    <span\n      v-if=\"isCheckable\"\n      data-gr-dropdown-menu-item-indicator\n      :class=\"itemIndicatorClass\"\n      aria-hidden=\"true\"\n    >\n      <IconCheck v-if=\"checked\" :class=\"itemIndicatorClass\" />\n    </span>\n\n    <slot name=\"icon\">\n      <component\n        :is=\"icon\"\n        v-if=\"icon\"\n        :class=\"itemIndicatorClass\"\n        aria-hidden=\"true\"\n      />\n    </slot>\n\n    <slot />\n\n    <slot name=\"shortcut\">\n      <span v-if=\"shortcut\" data-gr-dropdown-menu-item-shortcut :class=\"itemShortcutClass\">{{ shortcut }}</span>\n    </slot>\n  </component>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport { grDropdownMenuListClass } from './grDropdownMenuStyles'\n\n/**\n * `role=\"none\"` на обёртке обязателен: `role=\"menu\"` у панели объявляет своих\n * потомков презентационными, и любой div между панелью и пунктом ломает\n * `aria-required-children`, а пункты теряют принадлежность к меню.\n */\n\nexport interface GrDropdownMenuListProps {\n  dividers?: boolean\n  borderTop?: boolean\n  borderBottom?: boolean\n}\n\nconst props = withDefaults(defineProps<GrDropdownMenuListProps>(), {\n  dividers: false,\n  borderTop: false,\n  borderBottom: false,\n})\n\nconst className = computed(() => grDropdownMenuListClass({\n  dividers: props.dividers,\n  borderTop: props.borderTop,\n  borderBottom: props.borderBottom,\n}))\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-list\n    role=\"none\"\n    :class=\"className\"\n  >\n    <slot />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport { grDropdownMenuListClass } from './grDropdownMenuStyles'\n\n/**\n * `role=\"none\"` на обёртке обязателен: `role=\"menu\"` у панели объявляет своих\n * потомков презентационными, и любой div между панелью и пунктом ломает\n * `aria-required-children`, а пункты теряют принадлежность к меню.\n */\n\nexport interface GrDropdownMenuListProps {\n  dividers?: boolean\n  borderTop?: boolean\n  borderBottom?: boolean\n}\n\nconst props = withDefaults(defineProps<GrDropdownMenuListProps>(), {\n  dividers: false,\n  borderTop: false,\n  borderBottom: false,\n})\n\nconst className = computed(() => grDropdownMenuListClass({\n  dividers: props.dividers,\n  borderTop: props.borderTop,\n  borderBottom: props.borderBottom,\n}))\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-list\n    role=\"none\"\n    :class=\"className\"\n  >\n    <slot />\n  </div>\n</template>\n","import type { Component } from 'vue'\n\nimport type { GrDropdownMenuItemRole } from './GrDropdownMenuItem.vue'\nimport type { GrDropdownMenuItemVariant } from './grDropdownMenuStyles'\n\n/**\n * Декларативная модель меню.\n *\n * Композиция из подкомпонентов остаётся основным способом — она нужна там, где\n * пункт нестандартный. Но девять меню из десяти однотипны («иконка, подпись,\n * шорткат, иногда разделитель»), и собирать их из пяти компонентов вручную\n * значит каждый раз заново решать, где `role`, где `disabled`, где ключ.\n */\nexport interface GrDropdownMenuAction {\n  /** Ключ пункта — он же приходит в `select`. */\n  key: string\n  label: string\n  icon?: Component\n  shortcut?: string\n  disabled?: boolean\n  variant?: GrDropdownMenuItemVariant\n  role?: GrDropdownMenuItemRole\n  /** Состояние переключателя для `menuitemcheckbox`/`menuitemradio`. */\n  checked?: boolean\n  /** Пункт-ссылка: рендерится как `<a>` с этим `href`. */\n  href?: string\n  target?: string\n  rel?: string\n  /** Шорткат для `target=\"_blank\"` + `rel=\"noopener noreferrer\"`. */\n  external?: boolean\n}\n\nexport interface GrDropdownMenuSeparator {\n  type: 'divider'\n  inset?: boolean\n}\n\nexport interface GrDropdownMenuSection {\n  type: 'group'\n  title?: string\n  items: GrDropdownMenuAction[]\n}\n\nexport type GrDropdownMenuEntry = GrDropdownMenuAction | GrDropdownMenuSeparator | GrDropdownMenuSection\n\nexport function isMenuSeparator(entry: GrDropdownMenuEntry): entry is GrDropdownMenuSeparator {\n  return 'type' in entry && entry.type === 'divider'\n}\n\nexport function isMenuSection(entry: GrDropdownMenuEntry): entry is GrDropdownMenuSection {\n  return 'type' in entry && entry.type === 'group'\n}\n\nexport function isMenuAction(entry: GrDropdownMenuEntry): entry is GrDropdownMenuAction {\n  return !isMenuSeparator(entry) && !isMenuSection(entry)\n}\n","<script setup lang=\"ts\">\nimport GrDropdown from '../GrDropdown/GrDropdown.vue'\n// Типы размещения и ширины — из владельца API, а не переобъявлением: расхождение\n// обнаружилось бы только рантаймом.\nimport type { GrDropdownTrigger } from '../GrDropdown/GrDropdown.vue'\nimport type { GrDropdownWidth } from '../GrDropdown/grDropdownStyles'\nimport type { UseFloatingPlacement } from '../../composables/useFloating'\n\nimport GrDropdownMenuDivider from './GrDropdownMenuDivider.vue'\nimport GrDropdownMenuGroup from './GrDropdownMenuGroup.vue'\nimport GrDropdownMenuItem from './GrDropdownMenuItem.vue'\nimport GrDropdownMenuList from './GrDropdownMenuList.vue'\nimport {\n  isMenuAction,\n  isMenuSection,\n  isMenuSeparator,\n  type GrDropdownMenuAction,\n  type GrDropdownMenuEntry,\n} from './menuModel'\n\nexport interface GrDropdownMenuProps {\n  /** Размещение панели относительно триггера; переворот при нехватке места остаётся. */\n  placement?: UseFloatingPlacement\n  /** Зазор между триггером и панелью, px. */\n  offset?: number\n  /** Ширина панели: число — пиксели, строка — CSS-длина, `auto` — по контенту. */\n  width?: GrDropdownWidth\n  /** Чем открывается панель. В любом режиме работают клик и клавиатура. */\n  trigger?: GrDropdownTrigger\n  /** Задержка открытия по наведению, мс. */\n  openDelay?: number\n  /** Задержка закрытия после ухода курсора, мс. */\n  closeDelay?: number\n  /** Меню не открывается ничем; триггер остаётся фокусируемым. */\n  disabled?: boolean\n  /** Куда телепортировать панель (`body` по умолчанию). */\n  /** Точечное переопределение точки монтирования; по умолчанию — общий портал. */\n  teleportTo?: string | HTMLElement\n  /** Закрывать по клику внутри content. */\n  closeOnContentClick?: boolean\n  /** Дополнительные классы content-контейнера; по умолчанию `p-0`. */\n  contentClass?: string\n  /**\n   * Декларативное меню: пункты, группы и разделители массивом. Слот по\n   * умолчанию сильнее — он для меню, которое из модели не собирается.\n   */\n  items?: GrDropdownMenuEntry[]\n\n  // list wrapper\n  /** Разделители между пунктами. */\n  dividers?: boolean\n  /** Верхний бордер контейнера списка. */\n  borderTop?: boolean\n  /** Нижний бордер контейнера списка. */\n  borderBottom?: boolean\n  /** Дополнительные классы для wrapper'а списка. */\n  listClass?: string\n  /**\n   * Контролируемое состояние панели (`v-model:open`) — прокидывается в\n   * `GrDropdown`. Без пропа меню ведёт себя само (uncontrolled).\n   */\n  open?: boolean\n}\n\nexport interface GrDropdownMenuEmits {\n  /** Выбран пункт декларативного меню. */\n  (e: 'select', item: GrDropdownMenuAction): void\n  /** Панель открылась/закрылась (`v-model:open`). */\n  (e: 'update:open', value: boolean): void\n}\n\nwithDefaults(defineProps<GrDropdownMenuProps>(), {\n  placement: 'bottom-end',\n  offset: 8,\n  width: '12rem',\n  trigger: 'click',\n  openDelay: 120,\n  closeDelay: 160,\n  disabled: false,\n  teleportTo: undefined,\n  closeOnContentClick: true,\n  // В `GrDropdown` есть `p-1`, поэтому здесь по умолчанию обнуляем padding,\n  // чтобы пункты меню могли растягиваться до границ.\n  contentClass: 'p-0',\n  items: undefined,\n  dividers: false,\n  borderTop: false,\n  borderBottom: false,\n  listClass: '',\n  open: undefined,\n})\n\nconst emit = defineEmits<GrDropdownMenuEmits>()\n\nfunction itemProps(item: GrDropdownMenuAction): Record<string, unknown> {\n  return {\n    href: item.href,\n    target: item.target,\n    rel: item.rel,\n    external: item.external,\n    disabled: item.disabled,\n    variant: item.variant,\n    role: item.role,\n    checked: item.checked,\n    icon: item.icon,\n    shortcut: item.shortcut,\n  }\n}\n\nfunction onSelect(item: GrDropdownMenuAction): void {\n  if (item.disabled)\n    return\n\n  emit('select', item)\n}\n</script>\n\n<template>\n  <GrDropdown\n    data-gr-dropdown-menu\n    :placement=\"placement\"\n    :offset=\"offset\"\n    :width=\"width\"\n    :trigger=\"trigger\"\n    :open-delay=\"openDelay\"\n    :close-delay=\"closeDelay\"\n    :disabled=\"disabled\"\n    :teleport-to=\"teleportTo\"\n    :close-on-content-click=\"closeOnContentClick\"\n    :content-class=\"contentClass\"\n    :open=\"open\"\n    @update:open=\"emit('update:open', $event)\"\n  >\n    <template #trigger=\"slotProps\">\n      <slot name=\"trigger\" v-bind=\"slotProps\" />\n    </template>\n\n    <template #content=\"slotProps\">\n      <GrDropdownMenuList\n        :dividers=\"dividers\"\n        :border-top=\"borderTop\"\n        :border-bottom=\"borderBottom\"\n        :class=\"listClass\"\n      >\n        <slot v-bind=\"slotProps\">\n          <template v-for=\"(entry, index) in items ?? []\">\n            <GrDropdownMenuDivider\n              v-if=\"isMenuSeparator(entry)\"\n              :key=\"`divider-${index}`\"\n              :inset=\"entry.inset\"\n            />\n\n            <GrDropdownMenuGroup\n              v-else-if=\"isMenuSection(entry)\"\n              :key=\"`group-${entry.title ?? index}`\"\n              :title=\"entry.title\"\n            >\n              <GrDropdownMenuItem\n                v-for=\"item in entry.items\"\n                :key=\"item.key\"\n                v-bind=\"itemProps(item)\"\n                @click=\"onSelect(item)\"\n              >\n                {{ item.label }}\n              </GrDropdownMenuItem>\n            </GrDropdownMenuGroup>\n\n            <GrDropdownMenuItem\n              v-else-if=\"isMenuAction(entry)\"\n              :key=\"entry.key\"\n              v-bind=\"itemProps(entry)\"\n              @click=\"onSelect(entry)\"\n            >\n              {{ entry.label }}\n            </GrDropdownMenuItem>\n          </template>\n        </slot>\n      </GrDropdownMenuList>\n    </template>\n  </GrDropdown>\n</template>\n","<script setup lang=\"ts\">\nimport GrDropdown from '../GrDropdown/GrDropdown.vue'\n// Типы размещения и ширины — из владельца API, а не переобъявлением: расхождение\n// обнаружилось бы только рантаймом.\nimport type { GrDropdownTrigger } from '../GrDropdown/GrDropdown.vue'\nimport type { GrDropdownWidth } from '../GrDropdown/grDropdownStyles'\nimport type { UseFloatingPlacement } from '../../composables/useFloating'\n\nimport GrDropdownMenuDivider from './GrDropdownMenuDivider.vue'\nimport GrDropdownMenuGroup from './GrDropdownMenuGroup.vue'\nimport GrDropdownMenuItem from './GrDropdownMenuItem.vue'\nimport GrDropdownMenuList from './GrDropdownMenuList.vue'\nimport {\n  isMenuAction,\n  isMenuSection,\n  isMenuSeparator,\n  type GrDropdownMenuAction,\n  type GrDropdownMenuEntry,\n} from './menuModel'\n\nexport interface GrDropdownMenuProps {\n  /** Размещение панели относительно триггера; переворот при нехватке места остаётся. */\n  placement?: UseFloatingPlacement\n  /** Зазор между триггером и панелью, px. */\n  offset?: number\n  /** Ширина панели: число — пиксели, строка — CSS-длина, `auto` — по контенту. */\n  width?: GrDropdownWidth\n  /** Чем открывается панель. В любом режиме работают клик и клавиатура. */\n  trigger?: GrDropdownTrigger\n  /** Задержка открытия по наведению, мс. */\n  openDelay?: number\n  /** Задержка закрытия после ухода курсора, мс. */\n  closeDelay?: number\n  /** Меню не открывается ничем; триггер остаётся фокусируемым. */\n  disabled?: boolean\n  /** Куда телепортировать панель (`body` по умолчанию). */\n  /** Точечное переопределение точки монтирования; по умолчанию — общий портал. */\n  teleportTo?: string | HTMLElement\n  /** Закрывать по клику внутри content. */\n  closeOnContentClick?: boolean\n  /** Дополнительные классы content-контейнера; по умолчанию `p-0`. */\n  contentClass?: string\n  /**\n   * Декларативное меню: пункты, группы и разделители массивом. Слот по\n   * умолчанию сильнее — он для меню, которое из модели не собирается.\n   */\n  items?: GrDropdownMenuEntry[]\n\n  // list wrapper\n  /** Разделители между пунктами. */\n  dividers?: boolean\n  /** Верхний бордер контейнера списка. */\n  borderTop?: boolean\n  /** Нижний бордер контейнера списка. */\n  borderBottom?: boolean\n  /** Дополнительные классы для wrapper'а списка. */\n  listClass?: string\n  /**\n   * Контролируемое состояние панели (`v-model:open`) — прокидывается в\n   * `GrDropdown`. Без пропа меню ведёт себя само (uncontrolled).\n   */\n  open?: boolean\n}\n\nexport interface GrDropdownMenuEmits {\n  /** Выбран пункт декларативного меню. */\n  (e: 'select', item: GrDropdownMenuAction): void\n  /** Панель открылась/закрылась (`v-model:open`). */\n  (e: 'update:open', value: boolean): void\n}\n\nwithDefaults(defineProps<GrDropdownMenuProps>(), {\n  placement: 'bottom-end',\n  offset: 8,\n  width: '12rem',\n  trigger: 'click',\n  openDelay: 120,\n  closeDelay: 160,\n  disabled: false,\n  teleportTo: undefined,\n  closeOnContentClick: true,\n  // В `GrDropdown` есть `p-1`, поэтому здесь по умолчанию обнуляем padding,\n  // чтобы пункты меню могли растягиваться до границ.\n  contentClass: 'p-0',\n  items: undefined,\n  dividers: false,\n  borderTop: false,\n  borderBottom: false,\n  listClass: '',\n  open: undefined,\n})\n\nconst emit = defineEmits<GrDropdownMenuEmits>()\n\nfunction itemProps(item: GrDropdownMenuAction): Record<string, unknown> {\n  return {\n    href: item.href,\n    target: item.target,\n    rel: item.rel,\n    external: item.external,\n    disabled: item.disabled,\n    variant: item.variant,\n    role: item.role,\n    checked: item.checked,\n    icon: item.icon,\n    shortcut: item.shortcut,\n  }\n}\n\nfunction onSelect(item: GrDropdownMenuAction): void {\n  if (item.disabled)\n    return\n\n  emit('select', item)\n}\n</script>\n\n<template>\n  <GrDropdown\n    data-gr-dropdown-menu\n    :placement=\"placement\"\n    :offset=\"offset\"\n    :width=\"width\"\n    :trigger=\"trigger\"\n    :open-delay=\"openDelay\"\n    :close-delay=\"closeDelay\"\n    :disabled=\"disabled\"\n    :teleport-to=\"teleportTo\"\n    :close-on-content-click=\"closeOnContentClick\"\n    :content-class=\"contentClass\"\n    :open=\"open\"\n    @update:open=\"emit('update:open', $event)\"\n  >\n    <template #trigger=\"slotProps\">\n      <slot name=\"trigger\" v-bind=\"slotProps\" />\n    </template>\n\n    <template #content=\"slotProps\">\n      <GrDropdownMenuList\n        :dividers=\"dividers\"\n        :border-top=\"borderTop\"\n        :border-bottom=\"borderBottom\"\n        :class=\"listClass\"\n      >\n        <slot v-bind=\"slotProps\">\n          <template v-for=\"(entry, index) in items ?? []\">\n            <GrDropdownMenuDivider\n              v-if=\"isMenuSeparator(entry)\"\n              :key=\"`divider-${index}`\"\n              :inset=\"entry.inset\"\n            />\n\n            <GrDropdownMenuGroup\n              v-else-if=\"isMenuSection(entry)\"\n              :key=\"`group-${entry.title ?? index}`\"\n              :title=\"entry.title\"\n            >\n              <GrDropdownMenuItem\n                v-for=\"item in entry.items\"\n                :key=\"item.key\"\n                v-bind=\"itemProps(item)\"\n                @click=\"onSelect(item)\"\n              >\n                {{ item.label }}\n              </GrDropdownMenuItem>\n            </GrDropdownMenuGroup>\n\n            <GrDropdownMenuItem\n              v-else-if=\"isMenuAction(entry)\"\n              :key=\"entry.key\"\n              v-bind=\"itemProps(entry)\"\n              @click=\"onSelect(entry)\"\n            >\n              {{ entry.label }}\n            </GrDropdownMenuItem>\n          </template>\n        </slot>\n      </GrDropdownMenuList>\n    </template>\n  </GrDropdown>\n</template>\n","<script setup lang=\"ts\">\nimport { alignClass, columnBaseClass, type GrDropdownMenuColumnAlign } from './grDropdownMenuStyles'\n\nexport type { GrDropdownMenuColumnAlign } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuColumnProps {\n  align?: GrDropdownMenuColumnAlign\n}\n\nwithDefaults(defineProps<GrDropdownMenuColumnProps>(), {\n  align: 'center',\n})\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-column\n    role=\"none\"\n    :class=\"[columnBaseClass, alignClass[align]]\"\n  >\n    <slot />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { alignClass, columnBaseClass, type GrDropdownMenuColumnAlign } from './grDropdownMenuStyles'\n\nexport type { GrDropdownMenuColumnAlign } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuColumnProps {\n  align?: GrDropdownMenuColumnAlign\n}\n\nwithDefaults(defineProps<GrDropdownMenuColumnProps>(), {\n  align: 'center',\n})\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-column\n    role=\"none\"\n    :class=\"[columnBaseClass, alignClass[align]]\"\n  >\n    <slot />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { colsClass, columnsBaseClass, type GrDropdownMenuColumnsCount } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuColumnsProps {\n  cols?: GrDropdownMenuColumnsCount\n}\n\nwithDefaults(defineProps<GrDropdownMenuColumnsProps>(), {\n  cols: 2,\n})\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-columns\n    role=\"none\"\n    :class=\"[columnsBaseClass, colsClass[cols]]\"\n  >\n    <slot />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { colsClass, columnsBaseClass, type GrDropdownMenuColumnsCount } from './grDropdownMenuStyles'\n\nexport interface GrDropdownMenuColumnsProps {\n  cols?: GrDropdownMenuColumnsCount\n}\n\nwithDefaults(defineProps<GrDropdownMenuColumnsProps>(), {\n  cols: 2,\n})\n</script>\n\n<template>\n  <div\n    data-gr-dropdown-menu-columns\n    role=\"none\"\n    :class=\"[columnsBaseClass, colsClass[cols]]\"\n  >\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;uBAaE,mBAIE,OAAA;IAHA,iCAAA;IACA,MAAK;IACJ,OAAK,eAAA,CAAG,MAAA,YAAA,GAAc,QAAA,QAAQ,MAAA,iBAAA,IAAiB,EAAA,CAAA;;;;;;;;;;;;;;;;;;EEHpD,MAAM,QAAQ;;;;;;EAWd,MAAM,QAAQ,SAAS;EACvB,MAAM,YAAY,eAAe,QAAQ,MAAM,KAAK,KAAK,QAAQ,MAAM,OAAO,CAAC;;UAKrE,UAAA,SAAA,UAAA,GADR,mBAOM,OAAA;;IALJ,gCAAA;IACA,MAAK;IACJ,OAAK,eAAA;KAAG,MAAA,WAAA;KAAa,MAAA,cAAA,CAAc,CAAC,QAAA;KAAK,EAAA,WAAK,QAAA,UAAS;IAAA,CAAA;OAExD,WAAwB,KAAA,QAAA,WAAA,CAAA,SAAA,CAAA,gBAAA,gBAAf,QAAA,KAAK,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;EEtBlB,MAAM,QAAQ;EAOd,MAAM,UAAU,MAAM;EAEtB,MAAM,aAAa,eAAgB,MAAM,QAAQ,UAAU,KAAA,CAAU;EAErE,MAAM,aAAa,eAAe,CAChC,eACA,MAAM,WAAW,gBAAgB,EACnC,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG,CAAC;;uBAIzB,mBAgBM,OAAA;IAfJ,+BAAA;IACA,MAAK;IACJ,mBAAiB,WAAA;IAClB,OAAM;OAGE,QAAA,SAAA,UAAA,GADR,YAME,8BAAA;;IAJC,IAAI,MAAA,OAAA;IACJ,OAAO,QAAA;IACP,OAAO,QAAA;IACP,WAAW,QAAA;;;;;;uCAEd,mBAEM,OAAA;IAFD,MAAK;IAAQ,OAAK,eAAE,WAAA,KAAU;OACjC,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,GAAA,UAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EECd,MAAM,QAAQ;EAed,MAAM,QAAQ,SAAS;EAIvB,MAAM,WAAW,eAAmC;GAClD,IAAI,MAAM,MAAM,MAAM,OAAO,UAC3B,OAAO,MAAM;GACf,OAAO,MAAM,OAAO,MAAM;EAC5B,CAAC;EAED,MAAM,iBAAiB,eAAe,SAAS,UAAU,QAAQ;EAIjE,MAAM,eAAe,eAAgB,MAAM,WAAW,KAAA,IAAY,MAAM,IAAK;EAC7E,MAAM,iBAAiB,eAAe,MAAM,WAAW,MAAM,WAAW,WAAW,KAAA,EAAU;EAC7F,MAAM,cAAc,eAClB,MAAM,QAAQ,eAAe,UAAU,WAAW,wBAAwB,KAAA,EAC5E;EAGA,MAAM,cAAc,eAAe,MAAM,SAAS,UAAU;EAE5D,MAAM,YAAY,eAAe,wBAAwB;GACvD,OAAO,MAAM;GACb,SAAS,MAAM;GACf,UAAU,MAAM;EAClB,CAAC,CAAC;;;;;;;;;;EAWF,MAAM,mBAAmB,eAAgB,MAAM,YAA4C,EAAE;EAE7F,SAAS,eAAe,GAAqB;GAC3C,IAAI,CAAC,MAAM,UACT;GAEF,EAAE,eAAe;GAIjB,EAAE,yBAAyB;EAC7B;;uBAIE,YAsCY,wBArCL,SAAA,KAAQ,GADf,WAEU,MAoCE,KAAA,GApCG;IACb,8BAAA;IACC,MAAM,QAAA;IACN,OAAO,UAAA;IACP,MAAM,eAAA,QAAkB,MAAA,KAAA,CAAK,CAAC,QAAI,WAAuB,KAAA;IACzD,MAAM,aAAA;IACN,QAAQ,aAAA,QAAe,eAAA,QAAiB,KAAA;IACxC,KAAK,aAAA,QAAe,YAAA,QAAc,KAAA;IAClC,iBAAe,QAAA,WAAQ,SAAY,KAAA;IACnC,gBAAc,YAAA,QAAe,QAAA,UAAO,SAAA,UAAuB,KAAA;IAC3D,UAAU,iBAAA;IACK;;2BAST;KANC,YAAA,SAAA,UAAA,GADR,mBAOO,QAAA;;MALL,wCAAA;MACC,OAAK,eAAE,MAAA,kBAAA,CAAkB;MAC1B,eAAY;SAEK,QAAA,WAAA,UAAA,GAAjB,YAAwD,MAAA,aAAA,GAAA;;MAA7B,OAAK,eAAE,MAAA,kBAAA,CAAkB;;KAGtD,WAOO,KAAA,QAAA,QAAA,CAAA,SAAA,CAJG,QAAA,QAAA,UAAA,GAFR,YAKE,wBAJK,QAAA,IAAI,GAAA;;MAER,OAAK,eAAE,MAAA,kBAAA,CAAkB;MAC1B,eAAY;;KAIhB,WAAQ,KAAA,QAAA,SAAA;KAER,WAEO,KAAA,QAAA,YAAA,CAAA,SAAA,CADO,QAAA,YAAA,UAAA,GAAZ,mBAA0G,QAAA;;MAApF,uCAAA;MAAqC,OAAK,eAAE,MAAA,iBAAA,CAAiB;wBAAK,QAAA,QAAQ,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EErItG,MAAM,QAAQ;EAMd,MAAM,YAAY,eAAe,wBAAwB;GACvD,UAAU,MAAM;GAChB,WAAW,MAAM;GACjB,cAAc,MAAM;EACtB,CAAC,CAAC;;uBAIA,mBAMM,OAAA;IALJ,8BAAA;IACA,MAAK;IACJ,OAAK,eAAE,UAAA,KAAS;OAEjB,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA;;;;;;AESZ,SAAgB,gBAAgB,OAA8D;CAC5F,OAAO,UAAU,SAAS,MAAM,SAAS;AAC3C;AAEA,SAAgB,cAAc,OAA4D;CACxF,OAAO,UAAU,SAAS,MAAM,SAAS;AAC3C;AAEA,SAAgB,aAAa,OAA2D;CACtF,OAAO,CAAC,gBAAgB,KAAK,KAAK,CAAC,cAAc,KAAK;AACxD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECqCA,MAAM,OAAO;EAEb,SAAS,UAAU,MAAqD;GACtE,OAAO;IACL,MAAM,KAAK;IACX,QAAQ,KAAK;IACb,KAAK,KAAK;IACV,UAAU,KAAK;IACf,UAAU,KAAK;IACf,SAAS,KAAK;IACd,MAAM,KAAK;IACX,SAAS,KAAK;IACd,MAAM,KAAK;IACX,UAAU,KAAK;GACjB;EACF;EAEA,SAAS,SAAS,MAAkC;GAClD,IAAI,KAAK,UACP;GAEF,KAAK,UAAU,IAAI;EACrB;;uBAIE,YA6Da,oBAAA;IA5DX,yBAAA;IACC,WAAW,QAAA;IACX,QAAQ,QAAA;IACR,OAAO,QAAA;IACP,SAAS,QAAA;IACT,cAAY,QAAA;IACZ,eAAa,QAAA;IACb,UAAU,QAAA;IACV,eAAa,QAAA;IACb,0BAAwB,QAAA;IACxB,iBAAe,QAAA;IACf,MAAM,QAAA;IACN,iBAAW,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,eAAgB,MAAM;;IAE7B,SAAO,SAAE,cAAS,CAC3B,WAA0C,KAAA,QAAA,WAAA,eAAA,mBAAb,SAAS,CAAA,CAAA,CAAA,CAAA;IAG7B,SAAO,SAAE,cAAS,CAC3B,YAuCqB,4BAAA;KAtClB,UAAU,QAAA;KACV,cAAY,QAAA;KACZ,iBAAe,QAAA;KACf,OAAK,eAAE,QAAA,SAAS;;4BAkCV,CAhCP,WAgCO,KAAA,QAAA,WAAA,eAAA,mBAhCO,SAAS,CAAA,SAgChB,EAAA,UAAA,IAAA,GA/BL,mBA8BW,UAAA,MAAA,WA9BwB,QAAA,SAAK,CAAA,IAAtB,OAAO,UAAK;8DAEpB,MAAA,eAAA,CAAe,CAAC,KAAK,KAAA,UAAA,GAD7B,YAIE,+BAAA;OAFC,KAAG,WAAa;OAChB,OAAO,MAAM;gCAIH,MAAA,aAAA,CAAa,CAAC,KAAK,KAAA,UAAA,GADhC,YAasB,6BAAA;OAXnB,KAAG,SAAW,MAAM,SAAS;OAC7B,OAAO,MAAM;;8BAGe,EAAA,UAAA,IAAA,GAD7B,mBAOqB,UAAA,MAAA,WANJ,MAAM,QAAd,SAAI;4BADb,YAOqB,4BAPrB,WAOqB,EALlB,KAAK,KAAK,IAAA,GAAA,EAAA,SAAA,KAAA,GACH,UAAU,IAAI,GAAA,EACrB,UAAK,WAAE,SAAS,IAAI,EAAA,CAAA,GAAA;gCAEL,CAAA,gBAAA,gBAAb,KAAK,KAAK,GAAA,CAAA,CAAA,CAAA;;;;;6BAKJ,MAAA,YAAA,CAAY,CAAC,KAAK,KAAA,UAAA,GAD/B,YAOqB,4BAPrB,WAOqB,EALlB,KAAK,MAAM,IAAA,GAAA,EAAA,SAAA,KAAA,GACJ,UAAU,KAAK,GAAA,EACtB,UAAK,WAAE,SAAS,KAAK,EAAA,CAAA,GAAA;8BAEL,CAAA,gBAAA,gBAAd,MAAM,KAAK,GAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBE9J1B,mBAMM,OAAA;IALJ,gCAAA;IACA,MAAK;IACJ,OAAK,eAAA,CAAG,MAAA,eAAA,GAAiB,MAAA,UAAA,CAAU,CAAC,QAAA,MAAK,CAAA;OAE1C,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA;;;;;;;;;;;uBEPV,mBAMM,OAAA;IALJ,iCAAA;IACA,MAAK;IACJ,OAAK,eAAA,CAAG,MAAA,gBAAA,GAAkB,MAAA,SAAA,CAAS,CAAC,QAAA,KAAI,CAAA;OAEzC,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA"}

package/dist/components/GrDropdownMenu/index.js

@@ -1,3 +1,3 @@
-import { n as grDropdownMenuSafelist, t as grDropdownMenuConfig } from "../../chunks/config-BKvX0q102.js";
-import { a as isMenuSection, c as GrDropdownMenuItem_default, d as GrDropdownMenuDivider_default, i as isMenuAction, l as GrDropdownMenuGroup_default, n as GrDropdownMenuColumn_default, o as isMenuSeparator, r as GrDropdownMenu_default, s as GrDropdownMenuList_default, t as GrDropdownMenuColumns_default, u as GrDropdownMenuHeader_default } from "./chunks/GrDropdownMenu-LyfEFUbg.js";
-export { GrDropdownMenu_default as GrDropdownMenu, GrDropdownMenu_default as default, GrDropdownMenuColumn_default as GrDropdownMenuColumn, GrDropdownMenuColumns_default as GrDropdownMenuColumns, GrDropdownMenuDivider_default as GrDropdownMenuDivider, GrDropdownMenuGroup_default as GrDropdownMenuGroup, GrDropdownMenuHeader_default as GrDropdownMenuHeader, GrDropdownMenuItem_default as GrDropdownMenuItem, GrDropdownMenuList_default as GrDropdownMenuList, grDropdownMenuConfig, grDropdownMenuSafelist, isMenuAction, isMenuSection, isMenuSeparator };
+import { n as grDropdownMenuSafelist, t as grDropdownMenuConfig } from "../../chunks/config-BKvX0q10.js";
+import { a as GrDropdownMenuItem_default, c as GrDropdownMenuDivider_default, i as GrDropdownMenuList_default, n as GrDropdownMenuColumn_default, o as GrDropdownMenuGroup_default, r as GrDropdownMenu_default, s as GrDropdownMenuHeader_default, t as GrDropdownMenuColumns_default } from "./chunks/GrDropdownMenu-LOaFSCyd.js";
+export { GrDropdownMenu_default as GrDropdownMenu, GrDropdownMenu_default as default, GrDropdownMenuColumn_default as GrDropdownMenuColumn, GrDropdownMenuColumns_default as GrDropdownMenuColumns, GrDropdownMenuDivider_default as GrDropdownMenuDivider, GrDropdownMenuGroup_default as GrDropdownMenuGroup, GrDropdownMenuHeader_default as GrDropdownMenuHeader, GrDropdownMenuItem_default as GrDropdownMenuItem, GrDropdownMenuList_default as GrDropdownMenuList, grDropdownMenuConfig, grDropdownMenuSafelist };

package/dist/components/GrEmptyState/chunks/GrEmptyState-CS9do8eM.js

@@ -0,0 +1,86 @@
+import { a as useGrComponentSize, i as useGrComponentProp } from "../../../chunks/context-CTbuwcYs.js";
+import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
+import { t as GrIcon_default } from "../../GrIcon/chunks/GrIcon-bQwtZtYT.js";
+import { a as descriptionBaseClass, c as iconBoxBaseClass, d as titleBaseClass, f as titleBySize, i as actionsBySize, l as iconBoxBySize, o as descriptionBySize, r as actionsBaseClass, s as grEmptyStateRootClass, u as iconSizeBySize } from "../../../chunks/config-vSji8w90.js";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, markRaw, normalizeClass, openBlock, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, withCtx } from "vue";
+//#region ~icons/lucide/inbox
+var _hoisted_1$1 = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function render$1(_ctx, _cache) {
+	return openBlock(), createElementBlock("svg", _hoisted_1$1, [..._cache[0] || (_cache[0] = [createElementVNode("g", {
+		fill: "none",
+		stroke: "currentColor",
+		"stroke-linecap": "round",
+		"stroke-linejoin": "round",
+		"stroke-width": "2"
+	}, [createElementVNode("path", { d: "M22 12h-6l-2 3h-4l-2-3H2" }), createElementVNode("path", { d: "M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11" })], -1)])]);
+}
+var inbox_default = markRaw({
+	name: "lucide-inbox",
+	render: render$1
+});
+//#endregion
+//#region src/components/GrEmptyState/GrEmptyState.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex justify-center" };
+//#endregion
+//#region src/components/GrEmptyState/GrEmptyState.vue
+var GrEmptyState_default = /* @__PURE__ */ defineComponent({
+	__name: "GrEmptyState",
+	props: {
+		title: { default: void 0 },
+		description: { default: void 0 },
+		size: { default: void 0 },
+		variant: { default: void 0 },
+		headingLevel: { default: void 0 }
+	},
+	setup(__props) {
+		const props = __props;
+		const slots = useSlots();
+		const { t } = useGranularityTranslations();
+		const resolvedSize = useGrComponentSize(() => props.size, { component: "GrEmptyState" });
+		const resolvedVariant = useGrComponentProp("GrEmptyState", "variant", () => props.variant, "outlined");
+		const headingLevel = useGrComponentProp("GrEmptyState", "headingLevel", () => props.headingLevel, 3);
+		const headingTag = computed(() => `h${headingLevel.value}`);
+		const resolvedTitle = computed(() => props.title ?? t("gr.emptyState.title", "Nothing here yet"));
+		const hasDescription = computed(() => Boolean(props.description) || Boolean(slots.description));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"data-gr-empty-state": "",
+				class: normalizeClass(unref(grEmptyStateRootClass)({
+					variant: unref(resolvedVariant),
+					size: unref(resolvedSize)
+				}))
+			}, [
+				createElementVNode("div", _hoisted_1, [createElementVNode("div", {
+					"data-gr-empty-state-icon": "",
+					class: normalizeClass([unref(iconBoxBaseClass), unref(iconBoxBySize)[unref(resolvedSize)]])
+				}, [renderSlot(_ctx.$slots, "icon", {}, () => [createVNode(GrIcon_default, { size: unref(iconSizeBySize)[unref(resolvedSize)] }, {
+					default: withCtx(() => [createVNode(unref(inbox_default), { "aria-hidden": "true" })]),
+					_: 1
+				}, 8, ["size"])])], 2)]),
+				(openBlock(), createBlock(resolveDynamicComponent(headingTag.value), {
+					"data-gr-empty-state-title": "",
+					class: normalizeClass([unref(titleBaseClass), unref(titleBySize)[unref(resolvedSize)]])
+				}, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "title", {}, () => [createTextVNode(toDisplayString(resolvedTitle.value), 1)])]),
+					_: 3
+				}, 8, ["class"])),
+				hasDescription.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					"data-gr-empty-state-description": "",
+					class: normalizeClass([unref(descriptionBaseClass), unref(descriptionBySize)[unref(resolvedSize)]])
+				}, [renderSlot(_ctx.$slots, "description", {}, () => [createTextVNode(toDisplayString(__props.description), 1)])], 2)) : createCommentVNode("", true),
+				_ctx.$slots.default ? (openBlock(), createElementBlock("div", {
+					key: 1,
+					"data-gr-empty-state-actions": "",
+					class: normalizeClass([unref(actionsBaseClass), unref(actionsBySize)[unref(resolvedSize)]])
+				}, [renderSlot(_ctx.$slots, "default")], 2)) : createCommentVNode("", true)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { GrEmptyState_default as t };

package/dist/components/GrEmptyState/chunks/GrEmptyState-CS9do8eM.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GrEmptyState-CS9do8eM.js","names":["$slots"],"sources":["../../../../src/components/GrEmptyState/GrEmptyState.vue","../../../../src/components/GrEmptyState/GrEmptyState.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport IconInbox from '~icons/lucide/inbox'\n\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  actionsBaseClass,\n  actionsBySize,\n  descriptionBaseClass,\n  descriptionBySize,\n  grEmptyStateRootClass,\n  iconBoxBaseClass,\n  iconBoxBySize,\n  iconSizeBySize,\n  titleBaseClass,\n  titleBySize,\n  type GrEmptyStateHeadingLevel,\n  type GrEmptyStateSize,\n  type GrEmptyStateVariant,\n} from './grEmptyStateStyles'\n\nexport type {\n  GrEmptyStateHeadingLevel,\n  GrEmptyStateSize,\n  GrEmptyStateVariant,\n} from './grEmptyStateStyles'\n\n/**\n * GrEmptyState — карточка пустого состояния: иконка, заголовок, описание и\n * слот действий.\n *\n * Заголовок — настоящий heading: без него пустое состояние не находится\n * навигацией по заголовкам, а именно оно и объясняет, почему на экране ничего\n * нет.\n */\nexport interface GrEmptyStateProps {\n  /** Заголовок. Не задан — берётся из локали; слот `#title` сильнее обоих. */\n  title?: string\n  description?: string\n  size?: GrEmptyStateSize\n  /** `ghost` снимает рамку и фон: карточка внутри карточки рисует вторую рамку. */\n  variant?: GrEmptyStateVariant\n  headingLevel?: GrEmptyStateHeadingLevel\n}\n\nconst props = withDefaults(defineProps<GrEmptyStateProps>(), {\n  title: undefined,\n  description: undefined,\n  size: undefined,\n  variant: undefined,\n  headingLevel: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Иконка вместо встроенной. */\n  icon?: () => unknown\n  /** Заголовок разметкой: ссылка, выделение, счётчик. */\n  title?: () => unknown\n  description?: () => unknown\n  /** Действия под текстом: центрируются. */\n  default?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrEmptyState' })\nconst resolvedVariant = useGrComponentProp('GrEmptyState', 'variant', () => props.variant, 'outlined')\nconst headingLevel = useGrComponentProp('GrEmptyState', 'headingLevel', () => props.headingLevel, 3)\n\nconst headingTag = computed(() => `h${headingLevel.value}`)\nconst resolvedTitle = computed(() => props.title ?? t('gr.emptyState.title', 'Nothing here yet'))\nconst hasDescription = computed(() => Boolean(props.description) || Boolean(slots.description))\n</script>\n\n<template>\n  <div\n    data-gr-empty-state\n    :class=\"grEmptyStateRootClass({ variant: resolvedVariant, size: resolvedSize })\"\n  >\n    <div class=\"flex justify-center\">\n      <div data-gr-empty-state-icon :class=\"[iconBoxBaseClass, iconBoxBySize[resolvedSize]]\">\n        <slot name=\"icon\">\n          <GrIcon :size=\"iconSizeBySize[resolvedSize]\">\n            <IconInbox aria-hidden=\"true\" />\n          </GrIcon>\n        </slot>\n      </div>\n    </div>\n\n    <component\n      :is=\"headingTag\"\n      data-gr-empty-state-title\n      :class=\"[titleBaseClass, titleBySize[resolvedSize]]\"\n    >\n      <slot name=\"title\">\n        {{ resolvedTitle }}\n      </slot>\n    </component>\n\n    <div\n      v-if=\"hasDescription\"\n      data-gr-empty-state-description\n      :class=\"[descriptionBaseClass, descriptionBySize[resolvedSize]]\"\n    >\n      <slot name=\"description\">\n        {{ description }}\n      </slot>\n    </div>\n\n    <div\n      v-if=\"$slots.default\"\n      data-gr-empty-state-actions\n      :class=\"[actionsBaseClass, actionsBySize[resolvedSize]]\"\n    >\n      <slot />\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport IconInbox from '~icons/lucide/inbox'\n\nimport GrIcon from '../GrIcon/GrIcon.vue'\nimport { useGrComponentProp, useGrComponentSize } from '../GrConfigProvider/context'\nimport { useGranularityTranslations } from '../../internal/granularityI18n'\n\nimport {\n  actionsBaseClass,\n  actionsBySize,\n  descriptionBaseClass,\n  descriptionBySize,\n  grEmptyStateRootClass,\n  iconBoxBaseClass,\n  iconBoxBySize,\n  iconSizeBySize,\n  titleBaseClass,\n  titleBySize,\n  type GrEmptyStateHeadingLevel,\n  type GrEmptyStateSize,\n  type GrEmptyStateVariant,\n} from './grEmptyStateStyles'\n\nexport type {\n  GrEmptyStateHeadingLevel,\n  GrEmptyStateSize,\n  GrEmptyStateVariant,\n} from './grEmptyStateStyles'\n\n/**\n * GrEmptyState — карточка пустого состояния: иконка, заголовок, описание и\n * слот действий.\n *\n * Заголовок — настоящий heading: без него пустое состояние не находится\n * навигацией по заголовкам, а именно оно и объясняет, почему на экране ничего\n * нет.\n */\nexport interface GrEmptyStateProps {\n  /** Заголовок. Не задан — берётся из локали; слот `#title` сильнее обоих. */\n  title?: string\n  description?: string\n  size?: GrEmptyStateSize\n  /** `ghost` снимает рамку и фон: карточка внутри карточки рисует вторую рамку. */\n  variant?: GrEmptyStateVariant\n  headingLevel?: GrEmptyStateHeadingLevel\n}\n\nconst props = withDefaults(defineProps<GrEmptyStateProps>(), {\n  title: undefined,\n  description: undefined,\n  size: undefined,\n  variant: undefined,\n  headingLevel: undefined,\n})\n\nconst slots = defineSlots<{\n  /** Иконка вместо встроенной. */\n  icon?: () => unknown\n  /** Заголовок разметкой: ссылка, выделение, счётчик. */\n  title?: () => unknown\n  description?: () => unknown\n  /** Действия под текстом: центрируются. */\n  default?: () => unknown\n}>()\n\nconst { t } = useGranularityTranslations()\n\nconst resolvedSize = useGrComponentSize(() => props.size, { component: 'GrEmptyState' })\nconst resolvedVariant = useGrComponentProp('GrEmptyState', 'variant', () => props.variant, 'outlined')\nconst headingLevel = useGrComponentProp('GrEmptyState', 'headingLevel', () => props.headingLevel, 3)\n\nconst headingTag = computed(() => `h${headingLevel.value}`)\nconst resolvedTitle = computed(() => props.title ?? t('gr.emptyState.title', 'Nothing here yet'))\nconst hasDescription = computed(() => Boolean(props.description) || Boolean(slots.description))\n</script>\n\n<template>\n  <div\n    data-gr-empty-state\n    :class=\"grEmptyStateRootClass({ variant: resolvedVariant, size: resolvedSize })\"\n  >\n    <div class=\"flex justify-center\">\n      <div data-gr-empty-state-icon :class=\"[iconBoxBaseClass, iconBoxBySize[resolvedSize]]\">\n        <slot name=\"icon\">\n          <GrIcon :size=\"iconSizeBySize[resolvedSize]\">\n            <IconInbox aria-hidden=\"true\" />\n          </GrIcon>\n        </slot>\n      </div>\n    </div>\n\n    <component\n      :is=\"headingTag\"\n      data-gr-empty-state-title\n      :class=\"[titleBaseClass, titleBySize[resolvedSize]]\"\n    >\n      <slot name=\"title\">\n        {{ resolvedTitle }}\n      </slot>\n    </component>\n\n    <div\n      v-if=\"hasDescription\"\n      data-gr-empty-state-description\n      :class=\"[descriptionBaseClass, descriptionBySize[resolvedSize]]\"\n    >\n      <slot name=\"description\">\n        {{ description }}\n      </slot>\n    </div>\n\n    <div\n      v-if=\"$slots.default\"\n      data-gr-empty-state-actions\n      :class=\"[actionsBaseClass, actionsBySize[resolvedSize]]\"\n    >\n      <slot />\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiDA,MAAM,QAAQ;EAQd,MAAM,QAAQ,SAAA;EAUd,MAAM,EAAE,MAAM,2BAA2B;EAEzC,MAAM,eAAe,yBAAyB,MAAM,MAAM,EAAE,WAAW,eAAe,CAAC;EACvF,MAAM,kBAAkB,mBAAmB,gBAAgB,iBAAiB,MAAM,SAAS,UAAU;EACrG,MAAM,eAAe,mBAAmB,gBAAgB,sBAAsB,MAAM,cAAc,CAAC;EAEnG,MAAM,aAAa,eAAe,IAAI,aAAa,OAAO;EAC1D,MAAM,gBAAgB,eAAe,MAAM,SAAS,EAAE,uBAAuB,kBAAkB,CAAC;EAChG,MAAM,iBAAiB,eAAe,QAAQ,MAAM,WAAW,KAAK,QAAQ,MAAM,WAAW,CAAC;;uBAI5F,mBAyCM,OAAA;IAxCJ,uBAAA;IACC,OAAK,eAAE,MAAA,qBAAA,CAAqB,CAAA;KAAA,SAAY,MAAA,eAAA;KAAe,MAAQ,MAAA,YAAA;IAAY,CAAA,CAAA;;IAE5E,mBAQM,OARN,YAQM,CAPJ,mBAMM,OAAA;KAND,4BAAA;KAA0B,OAAK,eAAA,CAAG,MAAA,gBAAA,GAAkB,MAAA,aAAA,CAAa,CAAC,MAAA,YAAA,EAAY,CAAA;QACjF,WAIO,KAAA,QAAA,QAAA,CAAA,SAAA,CAHL,YAES,gBAAA,EAFA,MAAM,MAAA,cAAA,CAAc,CAAC,MAAA,YAAA,GAAA,GAAA;4BACI,CAAhC,YAAgC,MAAA,aAAA,GAAA,EAArB,eAAY,OAAM,CAAA,CAAA,CAAA;;;kBAMrC,YAQY,wBAPL,WAAA,KAAU,GAAA;KACf,6BAAA;KACC,OAAK,eAAA,CAAG,MAAA,cAAA,GAAgB,MAAA,WAAA,CAAW,CAAC,MAAA,YAAA,EAAY,CAAA;;4BAI1C,CAFP,WAEO,KAAA,QAAA,SAAA,CAAA,SAAA,CAAA,gBAAA,gBADF,cAAA,KAAa,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA;;;IAKZ,eAAA,SAAA,UAAA,GADR,mBAQM,OAAA;;KANJ,mCAAA;KACC,OAAK,eAAA,CAAG,MAAA,oBAAA,GAAsB,MAAA,iBAAA,CAAiB,CAAC,MAAA,YAAA,EAAY,CAAA;QAE7D,WAEO,KAAA,QAAA,eAAA,CAAA,SAAA,CAAA,gBAAA,gBADF,QAAA,WAAW,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;IAKVA,KAAAA,OAAO,WAAA,UAAA,GADf,mBAMM,OAAA;;KAJJ,+BAAA;KACC,OAAK,eAAA,CAAG,MAAA,gBAAA,GAAkB,MAAA,aAAA,CAAa,CAAC,MAAA,YAAA,EAAY,CAAA;QAErD,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA"}