@shtabapp/ui-kit 1.84.0 → 1.85.1

package/dist/components/SDropdown/parts/SDropdownSheet.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1,135 @@
+const require_useEscapeDismiss = require("../../../composables/useEscapeDismiss.cjs");
+const require_useSheetDrag = require("../utils/useSheetDrag.cjs");
+let vue = require("vue");
+let _shtabapp_ui_kit_primitives = require("@shtabapp/ui-kit-primitives");
+let _vueuse_core = require("@vueuse/core");
+//#region src/components/SDropdown/parts/SDropdownSheet.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-label"];
+var _hoisted_2 = { class: "s-ui-dropdown-sheet__side" };
+var _hoisted_3 = { class: "s-ui-dropdown-sheet__title" };
+var _hoisted_4 = { class: "s-ui-dropdown-sheet__side s-ui-dropdown-sheet__side--end" };
+var _hoisted_5 = ["id"];
+var SDropdownSheet_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "SDropdownSheet",
+	props: {
+		open: { type: Boolean },
+		title: { default: "" },
+		dismissOnOverlayClick: {
+			type: Boolean,
+			default: true
+		},
+		dismissOnEscape: {
+			type: Boolean,
+			default: true
+		},
+		hasOpenDescendant: {
+			type: Boolean,
+			default: false
+		},
+		contentId: {}
+	},
+	emits: ["close"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		const { t } = (0, _shtabapp_ui_kit_primitives.useUiKitI18n)();
+		const overlayRef = (0, vue.useTemplateRef)("overlayRef");
+		const popupRef = (0, vue.useTemplateRef)("popupRef");
+		const headerRef = (0, vue.useTemplateRef)("headerRef");
+		const close = () => emit("close");
+		const { isActive: isDragActive, popupStyles, reset: resetDrag } = require_useSheetDrag.useSheetDrag({
+			handle: headerRef,
+			popup: popupRef,
+			onClose: close
+		});
+		const isPageScrollLocked = (0, _vueuse_core.useScrollLock)(() => typeof document === "undefined" ? null : document.body);
+		const handleOverlayClick = () => {
+			if (!__props.dismissOnOverlayClick) return;
+			close();
+		};
+		const handlePopupCaptureClick = (event) => {
+			if (!isDragActive.value) return;
+			event.stopPropagation();
+		};
+		const handleAfterLeave = () => resetDrag();
+		let elementToRestoreFocus = null;
+		const captureFocusOrigin = () => {
+			const activeElement = document.activeElement;
+			elementToRestoreFocus = activeElement instanceof HTMLElement ? activeElement : null;
+		};
+		const focusPopup = async () => {
+			await (0, vue.nextTick)();
+			const popupElement = popupRef.value;
+			if (!popupElement || popupElement.contains(document.activeElement)) return;
+			popupElement.focus({ preventScroll: true });
+		};
+		const restoreFocusOrigin = () => {
+			const restoreTarget = elementToRestoreFocus;
+			const isFocusInsideSheet = Boolean(popupRef.value?.contains(document.activeElement));
+			elementToRestoreFocus = null;
+			if (!isFocusInsideSheet || !restoreTarget?.isConnected) return;
+			restoreTarget.focus({ preventScroll: true });
+		};
+		(0, vue.watch)(() => __props.open, (isOpen) => {
+			isPageScrollLocked.value = isOpen;
+			if (isOpen) {
+				captureFocusOrigin();
+				focusPopup();
+				return;
+			}
+			restoreFocusOrigin();
+		}, { immediate: true });
+		require_useEscapeDismiss.useEscapeDismiss({
+			open: () => __props.open,
+			enabled: () => __props.dismissOnEscape,
+			hasOpenDescendant: () => __props.hasOpenDescendant,
+			onDismiss: close
+		});
+		(0, vue.onBeforeUnmount)(() => {
+			isPageScrollLocked.value = false;
+		});
+		__expose({ overlayElement: overlayRef });
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createBlock)(vue.Transition, {
+				name: "s-ui-dropdown-sheet",
+				onAfterLeave: handleAfterLeave
+			}, {
+				default: (0, vue.withCtx)(() => [__props.open ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+					key: 0,
+					ref_key: "overlayRef",
+					ref: overlayRef,
+					class: "s-ui-dropdown-sheet",
+					onClick: handleOverlayClick
+				}, [(0, vue.createElementVNode)("div", {
+					ref_key: "popupRef",
+					ref: popupRef,
+					class: "s-ui-dropdown-sheet__popup",
+					style: (0, vue.normalizeStyle)((0, vue.unref)(popupStyles)),
+					role: "dialog",
+					"aria-modal": "true",
+					"aria-label": __props.title || (0, vue.unref)(t)("dropdown.sheet"),
+					tabindex: "-1",
+					onClickCapture: handlePopupCaptureClick,
+					onClick: _cache[0] || (_cache[0] = (0, vue.withModifiers)(() => {}, ["stop"]))
+				}, [(0, vue.createElementVNode)("header", {
+					ref_key: "headerRef",
+					ref: headerRef,
+					class: "s-ui-dropdown-sheet__header"
+				}, [
+					_cache[1] || (_cache[1] = (0, vue.createElementVNode)("span", {
+						class: "s-ui-dropdown-sheet__handle",
+						"aria-hidden": "true"
+					}, null, -1)),
+					(0, vue.createElementVNode)("div", _hoisted_2, [(0, vue.renderSlot)(_ctx.$slots, "header-left")]),
+					(0, vue.createElementVNode)("div", _hoisted_3, (0, vue.toDisplayString)(__props.title), 1),
+					(0, vue.createElementVNode)("div", _hoisted_4, [(0, vue.renderSlot)(_ctx.$slots, "header-right")])
+				], 512), (0, vue.createElementVNode)("div", {
+					id: __props.contentId,
+					class: "s-ui-dropdown-sheet__content"
+				}, [(0, vue.renderSlot)(_ctx.$slots, "default")], 8, _hoisted_5)], 44, _hoisted_1)], 512)) : (0, vue.createCommentVNode)("", true)]),
+				_: 3
+			});
+		};
+	}
+});
+//#endregion
+exports.default = SDropdownSheet_vue_vue_type_script_setup_true_lang_default;

package/dist/components/SDropdown/parts/SDropdownSheet.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,135 @@
+import { useEscapeDismiss } from "../../../composables/useEscapeDismiss.js";
+import { useSheetDrag } from "../utils/useSheetDrag.js";
+import { Transition, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, nextTick, normalizeStyle, onBeforeUnmount, openBlock, renderSlot, toDisplayString, unref, useTemplateRef, watch, withCtx, withModifiers } from "vue";
+import { useUiKitI18n } from "@shtabapp/ui-kit-primitives";
+import { useScrollLock } from "@vueuse/core";
+//#region src/components/SDropdown/parts/SDropdownSheet.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-label"];
+var _hoisted_2 = { class: "s-ui-dropdown-sheet__side" };
+var _hoisted_3 = { class: "s-ui-dropdown-sheet__title" };
+var _hoisted_4 = { class: "s-ui-dropdown-sheet__side s-ui-dropdown-sheet__side--end" };
+var _hoisted_5 = ["id"];
+var SDropdownSheet_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "SDropdownSheet",
+	props: {
+		open: { type: Boolean },
+		title: { default: "" },
+		dismissOnOverlayClick: {
+			type: Boolean,
+			default: true
+		},
+		dismissOnEscape: {
+			type: Boolean,
+			default: true
+		},
+		hasOpenDescendant: {
+			type: Boolean,
+			default: false
+		},
+		contentId: {}
+	},
+	emits: ["close"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		const { t } = useUiKitI18n();
+		const overlayRef = useTemplateRef("overlayRef");
+		const popupRef = useTemplateRef("popupRef");
+		const headerRef = useTemplateRef("headerRef");
+		const close = () => emit("close");
+		const { isActive: isDragActive, popupStyles, reset: resetDrag } = useSheetDrag({
+			handle: headerRef,
+			popup: popupRef,
+			onClose: close
+		});
+		const isPageScrollLocked = useScrollLock(() => typeof document === "undefined" ? null : document.body);
+		const handleOverlayClick = () => {
+			if (!__props.dismissOnOverlayClick) return;
+			close();
+		};
+		const handlePopupCaptureClick = (event) => {
+			if (!isDragActive.value) return;
+			event.stopPropagation();
+		};
+		const handleAfterLeave = () => resetDrag();
+		let elementToRestoreFocus = null;
+		const captureFocusOrigin = () => {
+			const activeElement = document.activeElement;
+			elementToRestoreFocus = activeElement instanceof HTMLElement ? activeElement : null;
+		};
+		const focusPopup = async () => {
+			await nextTick();
+			const popupElement = popupRef.value;
+			if (!popupElement || popupElement.contains(document.activeElement)) return;
+			popupElement.focus({ preventScroll: true });
+		};
+		const restoreFocusOrigin = () => {
+			const restoreTarget = elementToRestoreFocus;
+			const isFocusInsideSheet = Boolean(popupRef.value?.contains(document.activeElement));
+			elementToRestoreFocus = null;
+			if (!isFocusInsideSheet || !restoreTarget?.isConnected) return;
+			restoreTarget.focus({ preventScroll: true });
+		};
+		watch(() => __props.open, (isOpen) => {
+			isPageScrollLocked.value = isOpen;
+			if (isOpen) {
+				captureFocusOrigin();
+				focusPopup();
+				return;
+			}
+			restoreFocusOrigin();
+		}, { immediate: true });
+		useEscapeDismiss({
+			open: () => __props.open,
+			enabled: () => __props.dismissOnEscape,
+			hasOpenDescendant: () => __props.hasOpenDescendant,
+			onDismiss: close
+		});
+		onBeforeUnmount(() => {
+			isPageScrollLocked.value = false;
+		});
+		__expose({ overlayElement: overlayRef });
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(Transition, {
+				name: "s-ui-dropdown-sheet",
+				onAfterLeave: handleAfterLeave
+			}, {
+				default: withCtx(() => [__props.open ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					ref_key: "overlayRef",
+					ref: overlayRef,
+					class: "s-ui-dropdown-sheet",
+					onClick: handleOverlayClick
+				}, [createElementVNode("div", {
+					ref_key: "popupRef",
+					ref: popupRef,
+					class: "s-ui-dropdown-sheet__popup",
+					style: normalizeStyle(unref(popupStyles)),
+					role: "dialog",
+					"aria-modal": "true",
+					"aria-label": __props.title || unref(t)("dropdown.sheet"),
+					tabindex: "-1",
+					onClickCapture: handlePopupCaptureClick,
+					onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"]))
+				}, [createElementVNode("header", {
+					ref_key: "headerRef",
+					ref: headerRef,
+					class: "s-ui-dropdown-sheet__header"
+				}, [
+					_cache[1] || (_cache[1] = createElementVNode("span", {
+						class: "s-ui-dropdown-sheet__handle",
+						"aria-hidden": "true"
+					}, null, -1)),
+					createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "header-left")]),
+					createElementVNode("div", _hoisted_3, toDisplayString(__props.title), 1),
+					createElementVNode("div", _hoisted_4, [renderSlot(_ctx.$slots, "header-right")])
+				], 512), createElementVNode("div", {
+					id: __props.contentId,
+					class: "s-ui-dropdown-sheet__content"
+				}, [renderSlot(_ctx.$slots, "default")], 8, _hoisted_5)], 44, _hoisted_1)], 512)) : createCommentVNode("", true)]),
+				_: 3
+			});
+		};
+	}
+});
+//#endregion
+export { SDropdownSheet_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/SDropdown/utils/context.cjs

@@ -0,0 +1,4 @@
+//#region src/components/SDropdown/utils/context.ts
+var sDropdownInjectionKey = Symbol("SDropdown");
+//#endregion
+exports.sDropdownInjectionKey = sDropdownInjectionKey;

package/dist/components/SDropdown/utils/context.js

@@ -0,0 +1,4 @@
+//#region src/components/SDropdown/utils/context.ts
+var sDropdownInjectionKey = Symbol("SDropdown");
+//#endregion
+export { sDropdownInjectionKey };

package/dist/components/SDropdown/utils/dropdownFocusables.cjs

@@ -0,0 +1,58 @@
+//#region src/components/SDropdown/utils/dropdownFocusables.ts
+var FOCUSABLE_SELECTOR = [
+	"a[href]",
+	"button:not([disabled])",
+	"input:not([disabled]):not([type=\"hidden\"])",
+	"select:not([disabled])",
+	"textarea:not([disabled])",
+	"[tabindex]",
+	"[contenteditable=\"true\"]"
+].join(", ");
+/** Пункты меню: роли `menuitem*` и строки `SListItem` вне `SList` (у тех своя навигация). */
+var MENU_ITEM_SELECTOR = [
+	"[role=\"menuitem\"]",
+	"[role=\"menuitemcheckbox\"]",
+	"[role=\"menuitemradio\"]",
+	".s-ui-list-item[role=\"button\"]",
+	".s-ui-list-item[role=\"link\"]"
+].join(", ");
+/** Поля, где фокус держит ввод: триггер-combobox панель не уводит в себя. */
+var TEXT_ENTRY_SELECTOR = [
+	"input:not([type=\"button\"], [type=\"checkbox\"], [type=\"radio\"], [type=\"submit\"], [type=\"reset\"])",
+	"textarea",
+	"select",
+	"[contenteditable=\"true\"]",
+	"[role=\"combobox\"]",
+	"[role=\"textbox\"]",
+	"[role=\"searchbox\"]"
+].join(", ");
+var isRendered = (element) => {
+	return element.getClientRects().length > 0 && getComputedStyle(element).visibility !== "hidden";
+};
+/** Элемент принимает фокус программно (`tabindex="-1"` тоже). */
+var canTakeFocus = (element) => {
+	return element instanceof HTMLElement && element.isConnected && element.matches(FOCUSABLE_SELECTOR) && !element.closest("[inert]") && isRendered(element);
+};
+/** Элемент — остановка Tab. */
+var isTabbable = (element) => {
+	return canTakeFocus(element) && element.tabIndex >= 0;
+};
+/** Сам элемент, если он фокусируемый, иначе первый фокусируемый внутри. */
+var findFocusTarget = (root) => {
+	if (!root) return null;
+	return [root, ...root.querySelectorAll(FOCUSABLE_SELECTOR)].find(canTakeFocus) ?? null;
+};
+/** Остановки Tab панели, без содержимого вложенной панели, отрисованной внутри неё. */
+var queryPanelTabbables = (panel, panelSelector) => {
+	return [...panel.querySelectorAll(FOCUSABLE_SELECTOR)].filter((element) => isTabbable(element) && element.closest(panelSelector) === panel);
+};
+var queryPanelMenuItems = (panel, panelSelector) => {
+	return [...panel.querySelectorAll(MENU_ITEM_SELECTOR)].filter((element) => canTakeFocus(element) && element.getAttribute("aria-disabled") !== "true" && element.closest(panelSelector) === panel);
+};
+var isTextEntry = (element) => element.matches(TEXT_ENTRY_SELECTOR);
+//#endregion
+exports.canTakeFocus = canTakeFocus;
+exports.findFocusTarget = findFocusTarget;
+exports.isTextEntry = isTextEntry;
+exports.queryPanelMenuItems = queryPanelMenuItems;
+exports.queryPanelTabbables = queryPanelTabbables;

package/dist/components/SDropdown/utils/dropdownFocusables.js

@@ -0,0 +1,54 @@
+//#region src/components/SDropdown/utils/dropdownFocusables.ts
+var FOCUSABLE_SELECTOR = [
+	"a[href]",
+	"button:not([disabled])",
+	"input:not([disabled]):not([type=\"hidden\"])",
+	"select:not([disabled])",
+	"textarea:not([disabled])",
+	"[tabindex]",
+	"[contenteditable=\"true\"]"
+].join(", ");
+/** Пункты меню: роли `menuitem*` и строки `SListItem` вне `SList` (у тех своя навигация). */
+var MENU_ITEM_SELECTOR = [
+	"[role=\"menuitem\"]",
+	"[role=\"menuitemcheckbox\"]",
+	"[role=\"menuitemradio\"]",
+	".s-ui-list-item[role=\"button\"]",
+	".s-ui-list-item[role=\"link\"]"
+].join(", ");
+/** Поля, где фокус держит ввод: триггер-combobox панель не уводит в себя. */
+var TEXT_ENTRY_SELECTOR = [
+	"input:not([type=\"button\"], [type=\"checkbox\"], [type=\"radio\"], [type=\"submit\"], [type=\"reset\"])",
+	"textarea",
+	"select",
+	"[contenteditable=\"true\"]",
+	"[role=\"combobox\"]",
+	"[role=\"textbox\"]",
+	"[role=\"searchbox\"]"
+].join(", ");
+var isRendered = (element) => {
+	return element.getClientRects().length > 0 && getComputedStyle(element).visibility !== "hidden";
+};
+/** Элемент принимает фокус программно (`tabindex="-1"` тоже). */
+var canTakeFocus = (element) => {
+	return element instanceof HTMLElement && element.isConnected && element.matches(FOCUSABLE_SELECTOR) && !element.closest("[inert]") && isRendered(element);
+};
+/** Элемент — остановка Tab. */
+var isTabbable = (element) => {
+	return canTakeFocus(element) && element.tabIndex >= 0;
+};
+/** Сам элемент, если он фокусируемый, иначе первый фокусируемый внутри. */
+var findFocusTarget = (root) => {
+	if (!root) return null;
+	return [root, ...root.querySelectorAll(FOCUSABLE_SELECTOR)].find(canTakeFocus) ?? null;
+};
+/** Остановки Tab панели, без содержимого вложенной панели, отрисованной внутри неё. */
+var queryPanelTabbables = (panel, panelSelector) => {
+	return [...panel.querySelectorAll(FOCUSABLE_SELECTOR)].filter((element) => isTabbable(element) && element.closest(panelSelector) === panel);
+};
+var queryPanelMenuItems = (panel, panelSelector) => {
+	return [...panel.querySelectorAll(MENU_ITEM_SELECTOR)].filter((element) => canTakeFocus(element) && element.getAttribute("aria-disabled") !== "true" && element.closest(panelSelector) === panel);
+};
+var isTextEntry = (element) => element.matches(TEXT_ENTRY_SELECTOR);
+//#endregion
+export { canTakeFocus, findFocusTarget, isTextEntry, queryPanelMenuItems, queryPanelTabbables };

package/dist/components/SDropdown/utils/resolveTriggerReference.cjs

@@ -0,0 +1,11 @@
+//#region src/components/SDropdown/utils/resolveTriggerReference.ts
+var resolveTriggerReference = (triggerWrapper) => {
+	if (!triggerWrapper) return null;
+	const wrapperRect = triggerWrapper.getBoundingClientRect();
+	if (wrapperRect.width > 0 || wrapperRect.height > 0) return triggerWrapper;
+	const firstChild = triggerWrapper.firstElementChild;
+	if (firstChild instanceof HTMLElement) return firstChild;
+	return triggerWrapper;
+};
+//#endregion
+exports.resolveTriggerReference = resolveTriggerReference;

package/dist/components/SDropdown/utils/resolveTriggerReference.js

@@ -0,0 +1,11 @@
+//#region src/components/SDropdown/utils/resolveTriggerReference.ts
+var resolveTriggerReference = (triggerWrapper) => {
+	if (!triggerWrapper) return null;
+	const wrapperRect = triggerWrapper.getBoundingClientRect();
+	if (wrapperRect.width > 0 || wrapperRect.height > 0) return triggerWrapper;
+	const firstChild = triggerWrapper.firstElementChild;
+	if (firstChild instanceof HTMLElement) return firstChild;
+	return triggerWrapper;
+};
+//#endregion
+export { resolveTriggerReference };

package/dist/components/SDropdown/utils/useDropdownFocus.cjs

@@ -0,0 +1,145 @@
+const require_dropdownFocusables = require("./dropdownFocusables.cjs");
+let vue = require("vue");
+//#region src/components/SDropdown/utils/useDropdownFocus.ts
+var PANEL_SELECTOR = ".s-ui-dropdown__panel";
+var MENU_NAVIGATION_KEYS = [
+	"ArrowDown",
+	"ArrowUp",
+	"Home",
+	"End"
+];
+/**
+* Фокус панели по модели WAI-ARIA menu button / non-modal dialog. Панель телепортирована в
+* конец `body`, поэтому браузерный Tab до неё не доходит: открытие с якоря переносит фокус в
+* панель, закрытие возвращает его на якорь, Tab с края панели закрывает её и идёт дальше
+* от якоря — как если бы панель стояла в DOM сразу за ним.
+*/
+var useDropdownFocus = (options) => {
+	/** Элемент с фокусом в момент открытия — на него фокус и вернётся. */
+	let opener = null;
+	let pendingFocusEdge = null;
+	/** Якорь в фокусе с клавиатуры: фокус встаёт на пункт, а не на саму панель. */
+	let isOpenedFromKeyboard = false;
+	let requestedFocusEdge = null;
+	let hadFocusInside = false;
+	const getPanelTree = () => [(0, vue.toValue)(options.panel), ...(0, vue.toValue)(options.descendantElements)];
+	const isInsidePanelTree = (node) => {
+		return node !== null && getPanelTree().some((element) => element?.contains(node));
+	};
+	const resolveRestoreTarget = () => {
+		if (opener && require_dropdownFocusables.canTakeFocus(opener) && !isInsidePanelTree(opener)) return opener;
+		return require_dropdownFocusables.findFocusTarget((0, vue.toValue)(options.trigger));
+	};
+	const captureOpener = () => {
+		const activeElement = document.activeElement;
+		opener = activeElement instanceof HTMLElement && activeElement !== document.body && !isInsidePanelTree(activeElement) ? activeElement : null;
+	};
+	const shouldMoveFocusIn = () => {
+		return (0, vue.toValue)(options.focusOnOpen) && opener !== null && !require_dropdownFocusables.isTextEntry(opener) && !options.isOpenedByHover();
+	};
+	/** Фокус внутри панели (или потерян из неё) — возвращается на якорь. */
+	const restoreFocus = () => {
+		const activeElement = document.activeElement;
+		const isFocusLost = activeElement === null || activeElement === document.body;
+		if (!isInsidePanelTree(activeElement) && !(isFocusLost && hadFocusInside)) return;
+		resolveRestoreTarget()?.focus({ preventScroll: true });
+	};
+	(0, vue.watch)(options.open, (isOpen) => {
+		if (!(0, vue.toValue)(options.enabled)) return;
+		if (isOpen) {
+			captureOpener();
+			isOpenedFromKeyboard = requestedFocusEdge !== null || Boolean(opener?.matches(":focus-visible"));
+			hadFocusInside = false;
+			pendingFocusEdge = shouldMoveFocusIn() ? requestedFocusEdge ?? "first" : null;
+			requestedFocusEdge = null;
+			return;
+		}
+		pendingFocusEdge = null;
+		requestedFocusEdge = null;
+		restoreFocus();
+	}, { flush: "sync" });
+	const focusEdgeItem = (panel, edge) => {
+		const items = require_dropdownFocusables.queryPanelMenuItems(panel, PANEL_SELECTOR);
+		const edgeItem = edge === "first" ? items[0] : items.at(-1);
+		if (edgeItem) {
+			edgeItem.focus({ preventScroll: true });
+			return;
+		}
+		(((0, vue.toValue)(options.menu) ? void 0 : require_dropdownFocusables.queryPanelTabbables(panel, PANEL_SELECTOR)[0]) ?? panel).focus({ preventScroll: true });
+	};
+	(0, vue.watch)([() => (0, vue.toValue)(options.panelReady), () => (0, vue.toValue)(options.panel)], ([isReady, panel]) => {
+		if (!pendingFocusEdge || !isReady || !panel || !options.open.value) return;
+		const edge = pendingFocusEdge;
+		pendingFocusEdge = null;
+		if (panel.contains(document.activeElement)) return;
+		if (isOpenedFromKeyboard) focusEdgeItem(panel, edge);
+		else panel.focus({ preventScroll: true });
+	}, { flush: "post" });
+	const handlePanelFocusIn = () => {
+		hadFocusInside = true;
+	};
+	/** Tab с края панели: закрыть и продолжить обход от якоря. */
+	const leavePanel = (event) => {
+		options.close();
+		if (event.shiftKey) event.preventDefault();
+	};
+	const handlePanelTab = (event, panel) => {
+		if ((0, vue.toValue)(options.menu)) {
+			leavePanel(event);
+			return;
+		}
+		const tabbables = require_dropdownFocusables.queryPanelTabbables(panel, PANEL_SELECTOR);
+		const edgeTabbable = event.shiftKey ? tabbables[0] : tabbables.at(-1);
+		if (event.target === edgeTabbable || tabbables.length === 0 || event.target === panel && event.shiftKey) {
+			leavePanel(event);
+			return;
+		}
+		event.stopPropagation();
+	};
+	const moveMenuFocus = (event, panel) => {
+		const items = require_dropdownFocusables.queryPanelMenuItems(panel, PANEL_SELECTOR);
+		const eventTarget = event.target;
+		if (!(eventTarget instanceof HTMLElement) || items.length === 0) return;
+		const currentIndex = items.indexOf(eventTarget);
+		if (currentIndex === -1 && eventTarget !== panel) return;
+		event.preventDefault();
+		event.stopPropagation();
+		const lastIndex = items.length - 1;
+		items[{
+			Home: 0,
+			End: lastIndex,
+			ArrowDown: currentIndex === -1 || currentIndex === lastIndex ? 0 : currentIndex + 1,
+			ArrowUp: currentIndex <= 0 ? lastIndex : currentIndex - 1
+		}[event.key] ?? 0]?.focus({ preventScroll: true });
+	};
+	const handlePanelKeydown = (event) => {
+		const panel = (0, vue.toValue)(options.panel);
+		if (!panel || event.defaultPrevented) return;
+		if (event.key === "Tab") {
+			handlePanelTab(event, panel);
+			return;
+		}
+		if (MENU_NAVIGATION_KEYS.includes(event.key)) moveMenuFocus(event, panel);
+	};
+	/** ↓/↑ на якоре меню: открыть и встать на первый/последний пункт. */
+	const handleTriggerKeydown = (event) => {
+		if (!(0, vue.toValue)(options.menu) || event.key !== "ArrowDown" && event.key !== "ArrowUp") return;
+		if (!(event.target instanceof HTMLElement) || require_dropdownFocusables.isTextEntry(event.target)) return;
+		event.preventDefault();
+		const edge = event.key === "ArrowDown" ? "first" : "last";
+		const panel = (0, vue.toValue)(options.panel);
+		if (options.open.value && panel) {
+			focusEdgeItem(panel, edge);
+			return;
+		}
+		requestedFocusEdge = edge;
+		options.show();
+	};
+	return {
+		handlePanelFocusIn,
+		handlePanelKeydown,
+		handleTriggerKeydown
+	};
+};
+//#endregion
+exports.useDropdownFocus = useDropdownFocus;