@shopware-ag/meteor-component-library
Version:
The meteor component library is a Vue component library developed by Shopware. It is based on the [Meteor Design System](https://shopware.design/).
1 lines • 129 kB
Source Map (JSON)
{"version":3,"file":"MenuSub-7ab99f3b.mjs","sources":["../../../node_modules/reka-ui/dist/shared/createContext.js","../../../node_modules/reka-ui/dist/shared/getActiveElement.js","../../../node_modules/reka-ui/dist/shared/handleAndDispatchCustomEvent.js","../../../node_modules/reka-ui/dist/shared/useArrowNavigation.js","../../../node_modules/reka-ui/dist/ConfigProvider/ConfigProvider.js","../../../node_modules/defu/dist/defu.mjs","../../../node_modules/reka-ui/dist/shared/useBodyScrollLock.js","../../../node_modules/reka-ui/dist/shared/useDirection.js","../../../node_modules/reka-ui/dist/shared/useEmitAsProps.js","../../../node_modules/reka-ui/dist/shared/useFocusGuards.js","../../../node_modules/reka-ui/dist/shared/useId.js","../../../node_modules/reka-ui/dist/shared/useSize.js","../../../node_modules/reka-ui/dist/shared/useTypeahead.js","../../../node_modules/reka-ui/dist/Primitive/usePrimitiveElement.js","../../../node_modules/reka-ui/dist/DismissableLayer/utils.js","../../../node_modules/reka-ui/dist/DismissableLayer/DismissableLayer.js","../../../node_modules/reka-ui/dist/FocusScope/stack.js","../../../node_modules/reka-ui/dist/FocusScope/utils.js","../../../node_modules/reka-ui/dist/FocusScope/FocusScope.js","../../../node_modules/reka-ui/dist/Menu/utils.js","../../../node_modules/reka-ui/dist/Collection/Collection.js","../../../node_modules/reka-ui/dist/RovingFocus/utils.js","../../../node_modules/reka-ui/dist/RovingFocus/RovingFocusGroup.js","../../../node_modules/reka-ui/dist/Popper/PopperRoot.js","../../../node_modules/reka-ui/dist/Popper/utils.js","../../../node_modules/reka-ui/dist/Popper/PopperContent.js","../../../node_modules/reka-ui/dist/shared/useIsUsingKeyboard.js","../../../node_modules/reka-ui/dist/Menu/MenuRoot.js","../../../node_modules/reka-ui/dist/Menu/MenuContentImpl.js","../../../node_modules/reka-ui/dist/Menu/MenuSub.js"],"sourcesContent":["import { inject, provide } from \"vue\";\n\n//#region src/shared/createContext.ts\n/**\n* @param providerComponentName - The name(s) of the component(s) providing the context.\n*\n* There are situations where context can come from multiple components. In such cases, you might need to give an array of component names to provide your context, instead of just a single string.\n*\n* @param contextName The description for injection key symbol.\n*/\nfunction createContext(providerComponentName, contextName) {\n\tconst symbolDescription = typeof providerComponentName === \"string\" && !contextName ? `${providerComponentName}Context` : contextName;\n\tconst injectionKey = Symbol(symbolDescription);\n\t/**\n\t* @param fallback The context value to return if the injection fails.\n\t*\n\t* @throws When context injection failed and no fallback is specified.\n\t* This happens when the component injecting the context is not a child of the root component providing the context.\n\t*/\n\tconst injectContext = (fallback) => {\n\t\tconst context = inject(injectionKey, fallback);\n\t\tif (context) return context;\n\t\tif (context === null) return context;\n\t\tthrow new Error(`Injection \\`${injectionKey.toString()}\\` not found. Component must be used within ${Array.isArray(providerComponentName) ? `one of the following components: ${providerComponentName.join(\", \")}` : `\\`${providerComponentName}\\``}`);\n\t};\n\tconst provideContext = (contextValue) => {\n\t\tprovide(injectionKey, contextValue);\n\t\treturn contextValue;\n\t};\n\treturn [injectContext, provideContext];\n}\n\n//#endregion\nexport { createContext };\n//# sourceMappingURL=createContext.js.map","//#region src/shared/getActiveElement.ts\nfunction getActiveElement() {\n\tlet activeElement = document.activeElement;\n\tif (activeElement == null) return null;\n\twhile (activeElement != null && activeElement.shadowRoot != null && activeElement.shadowRoot.activeElement != null) activeElement = activeElement.shadowRoot.activeElement;\n\treturn activeElement;\n}\n\n//#endregion\nexport { getActiveElement };\n//# sourceMappingURL=getActiveElement.js.map","//#region src/shared/handleAndDispatchCustomEvent.ts\nfunction handleAndDispatchCustomEvent(name, handler, detail) {\n\tconst target = detail.originalEvent.target;\n\tconst event = new CustomEvent(name, {\n\t\tbubbles: false,\n\t\tcancelable: true,\n\t\tdetail\n\t});\n\tif (handler) target.addEventListener(name, handler, { once: true });\n\ttarget.dispatchEvent(event);\n}\n\n//#endregion\nexport { handleAndDispatchCustomEvent };\n//# sourceMappingURL=handleAndDispatchCustomEvent.js.map","//#region src/shared/useArrowNavigation.ts\nconst ignoredElement = [\"INPUT\", \"TEXTAREA\"];\n/**\n* Allow arrow navigation for every html element with data-reka-collection-item tag\n*\n* @param e Keyboard event\n* @param currentElement Event initiator element or any element that wants to handle the navigation\n* @param parentElement Parent element where contains all the collection items, this will collect every item to be used when nav\n* @param options further options\n* @returns the navigated html element or null if none\n*/\nfunction useArrowNavigation(e, currentElement, parentElement, options = {}) {\n\tif (!currentElement || options.enableIgnoredElement && ignoredElement.includes(currentElement.nodeName)) return null;\n\tconst { arrowKeyOptions = \"both\", attributeName = \"[data-reka-collection-item]\", itemsArray = [], loop = true, dir = \"ltr\", preventScroll = true, focus = false } = options;\n\tconst [right, left, up, down, home, end] = [\n\t\te.key === \"ArrowRight\",\n\t\te.key === \"ArrowLeft\",\n\t\te.key === \"ArrowUp\",\n\t\te.key === \"ArrowDown\",\n\t\te.key === \"Home\",\n\t\te.key === \"End\"\n\t];\n\tconst goingVertical = up || down;\n\tconst goingHorizontal = right || left;\n\tif (!home && !end && (!goingVertical && !goingHorizontal || arrowKeyOptions === \"vertical\" && goingHorizontal || arrowKeyOptions === \"horizontal\" && goingVertical)) return null;\n\tconst allCollectionItems = parentElement ? Array.from(parentElement.querySelectorAll(attributeName)) : itemsArray;\n\tif (!allCollectionItems.length) return null;\n\tif (preventScroll) e.preventDefault();\n\tlet item = null;\n\tif (goingHorizontal || goingVertical) {\n\t\tconst goForward = goingVertical ? down : dir === \"ltr\" ? right : left;\n\t\titem = findNextFocusableElement(allCollectionItems, currentElement, {\n\t\t\tgoForward,\n\t\t\tloop\n\t\t});\n\t} else if (home) item = allCollectionItems.at(0) || null;\n\telse if (end) item = allCollectionItems.at(-1) || null;\n\tif (focus) item?.focus();\n\treturn item;\n}\n/**\n* Recursive function to find the next focusable element to avoid disabled elements\n*\n* @param elements Elements to navigate\n* @param currentElement Current active element\n* @param options\n* @returns next focusable element\n*/\nfunction findNextFocusableElement(elements, currentElement, options, iterations = elements.length) {\n\tif (--iterations === 0) return null;\n\tconst index = elements.indexOf(currentElement);\n\tconst newIndex = options.goForward ? index + 1 : index - 1;\n\tif (!options.loop && (newIndex < 0 || newIndex >= elements.length)) return null;\n\tconst adjustedNewIndex = (newIndex + elements.length) % elements.length;\n\tconst candidate = elements[adjustedNewIndex];\n\tif (!candidate) return null;\n\tconst isDisabled = candidate.hasAttribute(\"disabled\") && candidate.getAttribute(\"disabled\") !== \"false\";\n\tif (isDisabled) return findNextFocusableElement(elements, candidate, options, iterations);\n\treturn candidate;\n}\n\n//#endregion\nexport { useArrowNavigation };\n//# sourceMappingURL=useArrowNavigation.js.map","import { createContext } from \"../shared/createContext.js\";\nimport { defineComponent, renderSlot, toRefs } from \"vue\";\n\n//#region src/ConfigProvider/ConfigProvider.vue?vue&type=script&setup=true&lang.ts\nconst [injectConfigProviderContext, provideConfigProviderContext] = createContext(\"ConfigProvider\");\nvar ConfigProvider_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({\n\tinheritAttrs: false,\n\t__name: \"ConfigProvider\",\n\tprops: {\n\t\tdir: {\n\t\t\ttype: String,\n\t\t\trequired: false,\n\t\t\tdefault: \"ltr\"\n\t\t},\n\t\tlocale: {\n\t\t\ttype: String,\n\t\t\trequired: false,\n\t\t\tdefault: \"en\"\n\t\t},\n\t\tscrollBody: {\n\t\t\ttype: [Boolean, Object],\n\t\t\trequired: false,\n\t\t\tdefault: true\n\t\t},\n\t\tnonce: {\n\t\t\ttype: String,\n\t\t\trequired: false,\n\t\t\tdefault: void 0\n\t\t},\n\t\tuseId: {\n\t\t\ttype: Function,\n\t\t\trequired: false,\n\t\t\tdefault: void 0\n\t\t}\n\t},\n\tsetup(__props) {\n\t\tconst props = __props;\n\t\tconst { dir, locale, scrollBody, nonce } = toRefs(props);\n\t\tprovideConfigProviderContext({\n\t\t\tdir,\n\t\t\tlocale,\n\t\t\tscrollBody,\n\t\t\tnonce,\n\t\t\tuseId: props.useId\n\t\t});\n\t\treturn (_ctx, _cache) => {\n\t\t\treturn renderSlot(_ctx.$slots, \"default\");\n\t\t};\n\t}\n});\n\n//#endregion\n//#region src/ConfigProvider/ConfigProvider.vue\nvar ConfigProvider_default = ConfigProvider_vue_vue_type_script_setup_true_lang_default;\n\n//#endregion\nexport { ConfigProvider_default, injectConfigProviderContext };\n//# sourceMappingURL=ConfigProvider.js.map","function isPlainObject(value) {\n if (value === null || typeof value !== \"object\") {\n return false;\n }\n const prototype = Object.getPrototypeOf(value);\n if (prototype !== null && prototype !== Object.prototype && Object.getPrototypeOf(prototype) !== null) {\n return false;\n }\n if (Symbol.iterator in value) {\n return false;\n }\n if (Symbol.toStringTag in value) {\n return Object.prototype.toString.call(value) === \"[object Module]\";\n }\n return true;\n}\n\nfunction _defu(baseObject, defaults, namespace = \".\", merger) {\n if (!isPlainObject(defaults)) {\n return _defu(baseObject, {}, namespace, merger);\n }\n const object = Object.assign({}, defaults);\n for (const key in baseObject) {\n if (key === \"__proto__\" || key === \"constructor\") {\n continue;\n }\n const value = baseObject[key];\n if (value === null || value === void 0) {\n continue;\n }\n if (merger && merger(object, key, value, namespace)) {\n continue;\n }\n if (Array.isArray(value) && Array.isArray(object[key])) {\n object[key] = [...value, ...object[key]];\n } else if (isPlainObject(value) && isPlainObject(object[key])) {\n object[key] = _defu(\n value,\n object[key],\n (namespace ? `${namespace}.` : \"\") + key.toString(),\n merger\n );\n } else {\n object[key] = value;\n }\n }\n return object;\n}\nfunction createDefu(merger) {\n return (...arguments_) => (\n // eslint-disable-next-line unicorn/no-array-reduce\n arguments_.reduce((p, c) => _defu(p, c, \"\", merger), {})\n );\n}\nconst defu = createDefu();\nconst defuFn = createDefu((object, key, currentValue) => {\n if (object[key] !== void 0 && typeof currentValue === \"function\") {\n object[key] = currentValue(object[key]);\n return true;\n }\n});\nconst defuArrayFn = createDefu((object, key, currentValue) => {\n if (Array.isArray(object[key]) && typeof currentValue === \"function\") {\n object[key] = currentValue(object[key]);\n return true;\n }\n});\n\nexport { createDefu, defu as default, defu, defuArrayFn, defuFn };\n","import { injectConfigProviderContext } from \"../ConfigProvider/ConfigProvider.js\";\nimport { computed, nextTick, ref, watch } from \"vue\";\nimport { createSharedComposable, useEventListener } from \"@vueuse/core\";\nimport { isClient, isIOS, tryOnBeforeUnmount } from \"@vueuse/shared\";\nimport { defu } from \"defu\";\n\n//#region src/shared/useBodyScrollLock.ts\nconst useBodyLockStackCount = createSharedComposable(() => {\n\tconst map = ref(/* @__PURE__ */ new Map());\n\tconst initialOverflow = ref();\n\tconst locked = computed(() => {\n\t\tfor (const value of map.value.values()) if (value) return true;\n\t\treturn false;\n\t});\n\tconst context = injectConfigProviderContext({ scrollBody: ref(true) });\n\tlet stopTouchMoveListener = null;\n\tconst resetBodyStyle = () => {\n\t\tdocument.body.style.paddingRight = \"\";\n\t\tdocument.body.style.marginRight = \"\";\n\t\tdocument.body.style.pointerEvents = \"\";\n\t\tdocument.documentElement.style.removeProperty(\"--scrollbar-width\");\n\t\tdocument.body.style.overflow = initialOverflow.value ?? \"\";\n\t\tisIOS && stopTouchMoveListener?.();\n\t\tinitialOverflow.value = void 0;\n\t};\n\twatch(locked, (val, oldVal) => {\n\t\tif (!isClient) return;\n\t\tif (!val) {\n\t\t\tif (oldVal) resetBodyStyle();\n\t\t\treturn;\n\t\t}\n\t\tif (initialOverflow.value === void 0) initialOverflow.value = document.body.style.overflow;\n\t\tconst verticalScrollbarWidth = window.innerWidth - document.documentElement.clientWidth;\n\t\tconst defaultConfig = {\n\t\t\tpadding: verticalScrollbarWidth,\n\t\t\tmargin: 0\n\t\t};\n\t\tconst config = context.scrollBody?.value ? typeof context.scrollBody.value === \"object\" ? defu({\n\t\t\tpadding: context.scrollBody.value.padding === true ? verticalScrollbarWidth : context.scrollBody.value.padding,\n\t\t\tmargin: context.scrollBody.value.margin === true ? verticalScrollbarWidth : context.scrollBody.value.margin\n\t\t}, defaultConfig) : defaultConfig : {\n\t\t\tpadding: 0,\n\t\t\tmargin: 0\n\t\t};\n\t\tif (verticalScrollbarWidth > 0) {\n\t\t\tdocument.body.style.paddingRight = typeof config.padding === \"number\" ? `${config.padding}px` : String(config.padding);\n\t\t\tdocument.body.style.marginRight = typeof config.margin === \"number\" ? `${config.margin}px` : String(config.margin);\n\t\t\tdocument.documentElement.style.setProperty(\"--scrollbar-width\", `${verticalScrollbarWidth}px`);\n\t\t\tdocument.body.style.overflow = \"hidden\";\n\t\t}\n\t\tif (isIOS) stopTouchMoveListener = useEventListener(document, \"touchmove\", (e) => preventDefault(e), { passive: false });\n\t\tnextTick(() => {\n\t\t\tdocument.body.style.pointerEvents = \"none\";\n\t\t\tdocument.body.style.overflow = \"hidden\";\n\t\t});\n\t}, {\n\t\timmediate: true,\n\t\tflush: \"sync\"\n\t});\n\treturn map;\n});\nfunction useBodyScrollLock(initialState) {\n\tconst id = Math.random().toString(36).substring(2, 7);\n\tconst map = useBodyLockStackCount();\n\tmap.value.set(id, initialState ?? false);\n\tconst locked = computed({\n\t\tget: () => map.value.get(id) ?? false,\n\t\tset: (value) => map.value.set(id, value)\n\t});\n\ttryOnBeforeUnmount(() => {\n\t\tmap.value.delete(id);\n\t});\n\treturn locked;\n}\nfunction checkOverflowScroll(ele) {\n\tconst style = window.getComputedStyle(ele);\n\tif (style.overflowX === \"scroll\" || style.overflowY === \"scroll\" || style.overflowX === \"auto\" && ele.clientWidth < ele.scrollWidth || style.overflowY === \"auto\" && ele.clientHeight < ele.scrollHeight) return true;\n\telse {\n\t\tconst parent = ele.parentNode;\n\t\tif (!(parent instanceof Element) || parent.tagName === \"BODY\") return false;\n\t\treturn checkOverflowScroll(parent);\n\t}\n}\nfunction preventDefault(rawEvent) {\n\tconst e = rawEvent || window.event;\n\tconst _target = e.target;\n\tif (_target instanceof Element && checkOverflowScroll(_target)) return false;\n\tif (e.touches.length > 1) return true;\n\tif (e.preventDefault && e.cancelable) e.preventDefault();\n\treturn false;\n}\n\n//#endregion\nexport { useBodyScrollLock };\n//# sourceMappingURL=useBodyScrollLock.js.map","import { injectConfigProviderContext } from \"../ConfigProvider/ConfigProvider.js\";\nimport { computed, ref } from \"vue\";\n\n//#region src/shared/useDirection.ts\n/**\n* The `useDirection` function provides a way to access the current direction in your application.\n* @param {Ref<Direction | undefined>} [dir] - An optional ref containing the direction (ltr or rtl).\n* @returns computed value that combines with the resolved direction.\n*/\nfunction useDirection(dir) {\n\tconst context = injectConfigProviderContext({ dir: ref(\"ltr\") });\n\treturn computed(() => dir?.value || context.dir?.value || \"ltr\");\n}\n\n//#endregion\nexport { useDirection };\n//# sourceMappingURL=useDirection.js.map","import { camelize, getCurrentInstance, toHandlerKey } from \"vue\";\n\n//#region src/shared/useEmitAsProps.ts\n/**\n* The `useEmitAsProps` function is a TypeScript utility that converts emitted events into props for a\n* Vue component.\n* @param emit - The `emit` parameter is a function that is used to emit events from a component. It\n* takes two parameters: `name` which is the name of the event to be emitted, and `...args` which are\n* the arguments to be passed along with the event.\n* @returns The function `useEmitAsProps` returns an object that maps event names to functions that\n* call the `emit` function with the corresponding event name and arguments.\n*/\nfunction useEmitAsProps(emit) {\n\tconst vm = getCurrentInstance();\n\tconst events = vm?.type.emits;\n\tconst result = {};\n\tif (!events?.length) console.warn(`No emitted event found. Please check component: ${vm?.type.__name}`);\n\tevents?.forEach((ev) => {\n\t\tresult[toHandlerKey(camelize(ev))] = (...arg) => emit(ev, ...arg);\n\t});\n\treturn result;\n}\n\n//#endregion\nexport { useEmitAsProps };\n//# sourceMappingURL=useEmitAsProps.js.map","import { watchEffect } from \"vue\";\nimport { isClient } from \"@vueuse/shared\";\n\n//#region src/shared/useFocusGuards.ts\n/** Number of components which have requested interest to have focus guards */\nlet count = 0;\n/**\n* Injects a pair of focus guards at the edges of the whole DOM tree\n* to ensure `focusin` & `focusout` events can be caught consistently.\n*/\nfunction useFocusGuards() {\n\twatchEffect((cleanupFn) => {\n\t\tif (!isClient) return;\n\t\tconst edgeGuards = document.querySelectorAll(\"[data-reka-focus-guard]\");\n\t\tdocument.body.insertAdjacentElement(\"afterbegin\", edgeGuards[0] ?? createFocusGuard());\n\t\tdocument.body.insertAdjacentElement(\"beforeend\", edgeGuards[1] ?? createFocusGuard());\n\t\tcount++;\n\t\tcleanupFn(() => {\n\t\t\tif (count === 1) document.querySelectorAll(\"[data-reka-focus-guard]\").forEach((node) => node.remove());\n\t\t\tcount--;\n\t\t});\n\t});\n}\nfunction createFocusGuard() {\n\tconst element = document.createElement(\"span\");\n\telement.setAttribute(\"data-reka-focus-guard\", \"\");\n\telement.tabIndex = 0;\n\telement.style.outline = \"none\";\n\telement.style.opacity = \"0\";\n\telement.style.position = \"fixed\";\n\telement.style.pointerEvents = \"none\";\n\treturn element;\n}\n\n//#endregion\nexport { useFocusGuards };\n//# sourceMappingURL=useFocusGuards.js.map","import { injectConfigProviderContext } from \"../ConfigProvider/ConfigProvider.js\";\nimport * as vue from \"vue\";\n\n//#region src/shared/useId.ts\nlet count = 0;\n/**\n* The `useId` function generates a unique identifier using a provided deterministic ID or a default\n* one prefixed with \"reka-\", or the provided one via `useId` props from `<ConfigProvider>`.\n* @param {string | null | undefined} [deterministicId] - The `useId` function you provided takes an\n* optional parameter `deterministicId`, which can be a string, null, or undefined. If\n* `deterministicId` is provided, the function will return it. Otherwise, it will generate an id using\n* the `useId` function obtained\n*/\nfunction useId(deterministicId, prefix = \"reka\") {\n\tif (deterministicId) return deterministicId;\n\tif (\"useId\" in vue) return `${prefix}-${vue.useId?.()}`;\n\tconst configProviderContext = injectConfigProviderContext({ useId: void 0 });\n\tif (configProviderContext.useId) return `${prefix}-${configProviderContext.useId()}`;\n\treturn `${prefix}-${++count}`;\n}\n\n//#endregion\nexport { useId };\n//# sourceMappingURL=useId.js.map","import { computed, onMounted, ref } from \"vue\";\nimport { unrefElement } from \"@vueuse/core\";\n\n//#region src/shared/useSize.ts\nfunction useSize(element) {\n\tconst size = ref();\n\tconst width = computed(() => size.value?.width ?? 0);\n\tconst height = computed(() => size.value?.height ?? 0);\n\tonMounted(() => {\n\t\tconst el = unrefElement(element);\n\t\tif (el) {\n\t\t\tsize.value = {\n\t\t\t\twidth: el.offsetWidth,\n\t\t\t\theight: el.offsetHeight\n\t\t\t};\n\t\t\tconst resizeObserver = new ResizeObserver((entries) => {\n\t\t\t\tif (!Array.isArray(entries)) return;\n\t\t\t\tif (!entries.length) return;\n\t\t\t\tconst entry = entries[0];\n\t\t\t\tlet width$1;\n\t\t\t\tlet height$1;\n\t\t\t\tif (\"borderBoxSize\" in entry) {\n\t\t\t\t\tconst borderSizeEntry = entry.borderBoxSize;\n\t\t\t\t\tconst borderSize = Array.isArray(borderSizeEntry) ? borderSizeEntry[0] : borderSizeEntry;\n\t\t\t\t\twidth$1 = borderSize.inlineSize;\n\t\t\t\t\theight$1 = borderSize.blockSize;\n\t\t\t\t} else {\n\t\t\t\t\twidth$1 = el.offsetWidth;\n\t\t\t\t\theight$1 = el.offsetHeight;\n\t\t\t\t}\n\t\t\t\tsize.value = {\n\t\t\t\t\twidth: width$1,\n\t\t\t\t\theight: height$1\n\t\t\t\t};\n\t\t\t});\n\t\t\tresizeObserver.observe(el, { box: \"border-box\" });\n\t\t\treturn () => resizeObserver.unobserve(el);\n\t\t} else size.value = void 0;\n\t});\n\treturn {\n\t\twidth,\n\t\theight\n\t};\n}\n\n//#endregion\nexport { useSize };\n//# sourceMappingURL=useSize.js.map","import { getActiveElement } from \"./getActiveElement.js\";\nimport { refAutoReset } from \"@vueuse/shared\";\n\n//#region src/shared/useTypeahead.ts\nfunction useTypeahead(callback) {\n\tconst search = refAutoReset(\"\", 1e3);\n\tconst handleTypeaheadSearch = (key, items) => {\n\t\tsearch.value = search.value + key;\n\t\tif (callback) callback(key);\n\t\telse {\n\t\t\tconst currentItem = getActiveElement();\n\t\t\tconst itemsWithTextValue = items.map((item) => ({\n\t\t\t\t...item,\n\t\t\t\ttextValue: item.value?.textValue ?? item.ref.textContent?.trim() ?? \"\"\n\t\t\t}));\n\t\t\tconst currentMatch = itemsWithTextValue.find((item) => item.ref === currentItem);\n\t\t\tconst values = itemsWithTextValue.map((item) => item.textValue);\n\t\t\tconst nextMatch = getNextMatch(values, search.value, currentMatch?.textValue);\n\t\t\tconst newItem = itemsWithTextValue.find((item) => item.textValue === nextMatch);\n\t\t\tif (newItem) newItem.ref.focus();\n\t\t\treturn newItem?.ref;\n\t\t}\n\t};\n\tconst resetTypeahead = () => {\n\t\tsearch.value = \"\";\n\t};\n\treturn {\n\t\tsearch,\n\t\thandleTypeaheadSearch,\n\t\tresetTypeahead\n\t};\n}\n/**\n* Wraps an array around itself at a given start index\n* Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`\n*/\nfunction wrapArray(array, startIndex) {\n\treturn array.map((_, index) => array[(startIndex + index) % array.length]);\n}\n/**\n* This is the \"meat\" of the typeahead matching logic. It takes in all the values,\n* the search and the current match, and returns the next match (or `undefined`).\n*\n* We normalize the search because if a user has repeatedly pressed a character,\n* we want the exact same behavior as if we only had that one character\n* (ie. cycle through options starting with that character)\n*\n* We also reorder the values by wrapping the array around the current match.\n* This is so we always look forward from the current match, and picking the first\n* match will always be the correct one.\n*\n* Finally, if the normalized search is exactly one character, we exclude the\n* current match from the values because otherwise it would be the first to match always\n* and focus would never move. This is as opposed to the regular case, where we\n* don't want focus to move if the current match still matches.\n*/\nfunction getNextMatch(values, search, currentMatch) {\n\tconst isRepeated = search.length > 1 && Array.from(search).every((char) => char === search[0]);\n\tconst normalizedSearch = isRepeated ? search[0] : search;\n\tconst currentMatchIndex = currentMatch ? values.indexOf(currentMatch) : -1;\n\tlet wrappedValues = wrapArray(values, Math.max(currentMatchIndex, 0));\n\tconst excludeCurrentMatch = normalizedSearch.length === 1;\n\tif (excludeCurrentMatch) wrappedValues = wrappedValues.filter((v) => v !== currentMatch);\n\tconst nextMatch = wrappedValues.find((value) => value.toLowerCase().startsWith(normalizedSearch.toLowerCase()));\n\treturn nextMatch !== currentMatch ? nextMatch : void 0;\n}\n\n//#endregion\nexport { getNextMatch, useTypeahead, wrapArray };\n//# sourceMappingURL=useTypeahead.js.map","import { computed, ref } from \"vue\";\nimport { unrefElement } from \"@vueuse/core\";\n\n//#region src/Primitive/usePrimitiveElement.ts\nfunction usePrimitiveElement() {\n\tconst primitiveElement = ref();\n\tconst currentElement = computed(() => [\"#text\", \"#comment\"].includes(primitiveElement.value?.$el.nodeName) ? primitiveElement.value?.$el.nextElementSibling : unrefElement(primitiveElement));\n\treturn {\n\t\tprimitiveElement,\n\t\tcurrentElement\n\t};\n}\n\n//#endregion\nexport { usePrimitiveElement };\n//# sourceMappingURL=usePrimitiveElement.js.map","import { handleAndDispatchCustomEvent } from \"../shared/handleAndDispatchCustomEvent.js\";\nimport { nextTick, ref, toValue, watchEffect } from \"vue\";\nimport { isClient } from \"@vueuse/shared\";\n\n//#region src/DismissableLayer/utils.ts\nconst POINTER_DOWN_OUTSIDE = \"dismissableLayer.pointerDownOutside\";\nconst FOCUS_OUTSIDE = \"dismissableLayer.focusOutside\";\nfunction isLayerExist(layerElement, targetElement) {\n\tconst targetLayer = targetElement.closest(\"[data-dismissable-layer]\");\n\tconst mainLayer = layerElement.dataset.dismissableLayer === \"\" ? layerElement : layerElement.querySelector(\"[data-dismissable-layer]\");\n\tconst nodeList = Array.from(layerElement.ownerDocument.querySelectorAll(\"[data-dismissable-layer]\"));\n\tif (targetLayer && (mainLayer === targetLayer || nodeList.indexOf(mainLayer) < nodeList.indexOf(targetLayer))) return true;\n\telse return false;\n}\n/**\n* Listens for `pointerdown` outside a DOM subtree. We use `pointerdown` rather than `pointerup`\n* to mimic layer dismissing behaviour present in OS.\n* Returns props to pass to the node we want to check for outside events.\n*/\nfunction usePointerDownOutside(onPointerDownOutside, element, enabled = true) {\n\tconst ownerDocument = element?.value?.ownerDocument ?? globalThis?.document;\n\tconst isPointerInsideDOMTree = ref(false);\n\tconst handleClickRef = ref(() => {});\n\twatchEffect((cleanupFn) => {\n\t\tif (!isClient || !toValue(enabled)) return;\n\t\tconst handlePointerDown = async (event) => {\n\t\t\tconst target = event.target;\n\t\t\tif (!element?.value || !target) return;\n\t\t\tif (isLayerExist(element.value, target)) {\n\t\t\t\tisPointerInsideDOMTree.value = false;\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (event.target && !isPointerInsideDOMTree.value) {\n\t\t\t\tconst eventDetail = { originalEvent: event };\n\t\t\t\tfunction handleAndDispatchPointerDownOutsideEvent() {\n\t\t\t\t\thandleAndDispatchCustomEvent(POINTER_DOWN_OUTSIDE, onPointerDownOutside, eventDetail);\n\t\t\t\t}\n\t\t\t\t/**\n\t\t\t\t* On touch devices, we need to wait for a click event because browsers implement\n\t\t\t\t* a ~350ms delay between the time the user stops touching the display and when the\n\t\t\t\t* browser executes events. We need to ensure we don't reactivate pointer-events within\n\t\t\t\t* this timeframe otherwise the browser may execute events that should have been prevented.\n\t\t\t\t*\n\t\t\t\t* Additionally, this also lets us deal automatically with cancellations when a click event\n\t\t\t\t* isn't raised because the page was considered scrolled/drag-scrolled, long-pressed, etc.\n\t\t\t\t*\n\t\t\t\t* This is why we also continuously remove the previous listener, because we cannot be\n\t\t\t\t* certain that it was raised, and therefore cleaned-up.\n\t\t\t\t*/\n\t\t\t\tif (event.pointerType === \"touch\") {\n\t\t\t\t\townerDocument.removeEventListener(\"click\", handleClickRef.value);\n\t\t\t\t\thandleClickRef.value = handleAndDispatchPointerDownOutsideEvent;\n\t\t\t\t\townerDocument.addEventListener(\"click\", handleClickRef.value, { once: true });\n\t\t\t\t} else handleAndDispatchPointerDownOutsideEvent();\n\t\t\t} else ownerDocument.removeEventListener(\"click\", handleClickRef.value);\n\t\t\tisPointerInsideDOMTree.value = false;\n\t\t};\n\t\t/**\n\t\t* if this hook executes in a component that mounts via a `pointerdown` event, the event\n\t\t* would bubble up to the document and trigger a `pointerDownOutside` event. We avoid\n\t\t* this by delaying the event listener registration on the document.\n\t\t* This is how the DOM works, ie:\n\t\t* ```\n\t\t* button.addEventListener('pointerdown', () => {\n\t\t* console.log('I will log');\n\t\t* document.addEventListener('pointerdown', () => {\n\t\t* console.log('I will also log');\n\t\t* })\n\t\t* });\n\t\t*/\n\t\tconst timerId = window.setTimeout(() => {\n\t\t\townerDocument.addEventListener(\"pointerdown\", handlePointerDown);\n\t\t}, 0);\n\t\tcleanupFn(() => {\n\t\t\twindow.clearTimeout(timerId);\n\t\t\townerDocument.removeEventListener(\"pointerdown\", handlePointerDown);\n\t\t\townerDocument.removeEventListener(\"click\", handleClickRef.value);\n\t\t});\n\t});\n\treturn { onPointerDownCapture: () => {\n\t\tif (!toValue(enabled)) return;\n\t\tisPointerInsideDOMTree.value = true;\n\t} };\n}\n/**\n* Listens for when focus happens outside a DOM subtree.\n* Returns props to pass to the root (node) of the subtree we want to check.\n*/\nfunction useFocusOutside(onFocusOutside, element, enabled = true) {\n\tconst ownerDocument = element?.value?.ownerDocument ?? globalThis?.document;\n\tconst isFocusInsideDOMTree = ref(false);\n\twatchEffect((cleanupFn) => {\n\t\tif (!isClient || !toValue(enabled)) return;\n\t\tconst handleFocus = async (event) => {\n\t\t\tif (!element?.value) return;\n\t\t\tawait nextTick();\n\t\t\tawait nextTick();\n\t\t\tconst target = event.target;\n\t\t\tif (!element.value || !target || isLayerExist(element.value, target)) return;\n\t\t\tif (event.target && !isFocusInsideDOMTree.value) {\n\t\t\t\tconst eventDetail = { originalEvent: event };\n\t\t\t\thandleAndDispatchCustomEvent(FOCUS_OUTSIDE, onFocusOutside, eventDetail);\n\t\t\t}\n\t\t};\n\t\townerDocument.addEventListener(\"focusin\", handleFocus);\n\t\tcleanupFn(() => ownerDocument.removeEventListener(\"focusin\", handleFocus));\n\t});\n\treturn {\n\t\tonFocusCapture: () => {\n\t\t\tif (!toValue(enabled)) return;\n\t\t\tisFocusInsideDOMTree.value = true;\n\t\t},\n\t\tonBlurCapture: () => {\n\t\t\tif (!toValue(enabled)) return;\n\t\t\tisFocusInsideDOMTree.value = false;\n\t\t}\n\t};\n}\n\n//#endregion\nexport { useFocusOutside, usePointerDownOutside };\n//# sourceMappingURL=utils.js.map","import { useForwardExpose } from \"../shared/useForwardExpose.js\";\nimport { Primitive } from \"../Primitive/Primitive.js\";\nimport { useFocusOutside, usePointerDownOutside } from \"./utils.js\";\nimport { computed, createBlock, defineComponent, nextTick, normalizeStyle, openBlock, reactive, renderSlot, unref, watchEffect, withCtx } from \"vue\";\nimport { onKeyStroke } from \"@vueuse/core\";\n\n//#region src/DismissableLayer/DismissableLayer.vue?vue&type=script&setup=true&lang.ts\nconst context = reactive({\n\tlayersRoot: /* @__PURE__ */ new Set(),\n\tlayersWithOutsidePointerEventsDisabled: /* @__PURE__ */ new Set(),\n\tbranches: /* @__PURE__ */ new Set()\n});\nvar DismissableLayer_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({\n\t__name: \"DismissableLayer\",\n\tprops: {\n\t\tdisableOutsidePointerEvents: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false,\n\t\t\tdefault: false\n\t\t},\n\t\tasChild: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tas: {\n\t\t\ttype: null,\n\t\t\trequired: false\n\t\t}\n\t},\n\temits: [\n\t\t\"escapeKeyDown\",\n\t\t\"pointerDownOutside\",\n\t\t\"focusOutside\",\n\t\t\"interactOutside\",\n\t\t\"dismiss\"\n\t],\n\tsetup(__props, { emit: __emit }) {\n\t\tconst props = __props;\n\t\tconst emits = __emit;\n\t\tconst { forwardRef, currentElement: layerElement } = useForwardExpose();\n\t\tconst ownerDocument = computed(() => layerElement.value?.ownerDocument ?? globalThis.document);\n\t\tconst layers = computed(() => context.layersRoot);\n\t\tconst index = computed(() => {\n\t\t\treturn layerElement.value ? Array.from(layers.value).indexOf(layerElement.value) : -1;\n\t\t});\n\t\tconst isBodyPointerEventsDisabled = computed(() => {\n\t\t\treturn context.layersWithOutsidePointerEventsDisabled.size > 0;\n\t\t});\n\t\tconst isPointerEventsEnabled = computed(() => {\n\t\t\tconst localLayers = Array.from(layers.value);\n\t\t\tconst [highestLayerWithOutsidePointerEventsDisabled] = [...context.layersWithOutsidePointerEventsDisabled].slice(-1);\n\t\t\tconst highestLayerWithOutsidePointerEventsDisabledIndex = localLayers.indexOf(highestLayerWithOutsidePointerEventsDisabled);\n\t\t\treturn index.value >= highestLayerWithOutsidePointerEventsDisabledIndex;\n\t\t});\n\t\tconst pointerDownOutside = usePointerDownOutside(async (event) => {\n\t\t\tconst isPointerDownOnBranch = [...context.branches].some((branch) => branch?.contains(event.target));\n\t\t\tif (!isPointerEventsEnabled.value || isPointerDownOnBranch) return;\n\t\t\temits(\"pointerDownOutside\", event);\n\t\t\temits(\"interactOutside\", event);\n\t\t\tawait nextTick();\n\t\t\tif (!event.defaultPrevented) emits(\"dismiss\");\n\t\t}, layerElement);\n\t\tconst focusOutside = useFocusOutside((event) => {\n\t\t\tconst isFocusInBranch = [...context.branches].some((branch) => branch?.contains(event.target));\n\t\t\tif (isFocusInBranch) return;\n\t\t\temits(\"focusOutside\", event);\n\t\t\temits(\"interactOutside\", event);\n\t\t\tif (!event.defaultPrevented) emits(\"dismiss\");\n\t\t}, layerElement);\n\t\tonKeyStroke(\"Escape\", (event) => {\n\t\t\tconst isHighestLayer = index.value === layers.value.size - 1;\n\t\t\tif (!isHighestLayer) return;\n\t\t\temits(\"escapeKeyDown\", event);\n\t\t\tif (!event.defaultPrevented) emits(\"dismiss\");\n\t\t});\n\t\tlet originalBodyPointerEvents;\n\t\twatchEffect((cleanupFn) => {\n\t\t\tif (!layerElement.value) return;\n\t\t\tif (props.disableOutsidePointerEvents) {\n\t\t\t\tif (context.layersWithOutsidePointerEventsDisabled.size === 0) {\n\t\t\t\t\toriginalBodyPointerEvents = ownerDocument.value.body.style.pointerEvents;\n\t\t\t\t\townerDocument.value.body.style.pointerEvents = \"none\";\n\t\t\t\t}\n\t\t\t\tcontext.layersWithOutsidePointerEventsDisabled.add(layerElement.value);\n\t\t\t}\n\t\t\tlayers.value.add(layerElement.value);\n\t\t\tcleanupFn(() => {\n\t\t\t\tif (props.disableOutsidePointerEvents && context.layersWithOutsidePointerEventsDisabled.size === 1) ownerDocument.value.body.style.pointerEvents = originalBodyPointerEvents;\n\t\t\t});\n\t\t});\n\t\twatchEffect((cleanupFn) => {\n\t\t\tcleanupFn(() => {\n\t\t\t\tif (!layerElement.value) return;\n\t\t\t\tlayers.value.delete(layerElement.value);\n\t\t\t\tcontext.layersWithOutsidePointerEventsDisabled.delete(layerElement.value);\n\t\t\t});\n\t\t});\n\t\treturn (_ctx, _cache) => {\n\t\t\treturn openBlock(), createBlock(unref(Primitive), {\n\t\t\t\tref: unref(forwardRef),\n\t\t\t\t\"as-child\": _ctx.asChild,\n\t\t\t\tas: _ctx.as,\n\t\t\t\t\"data-dismissable-layer\": \"\",\n\t\t\t\tstyle: normalizeStyle({ pointerEvents: isBodyPointerEventsDisabled.value ? isPointerEventsEnabled.value ? \"auto\" : \"none\" : void 0 }),\n\t\t\t\tonFocusCapture: unref(focusOutside).onFocusCapture,\n\t\t\t\tonBlurCapture: unref(focusOutside).onBlurCapture,\n\t\t\t\tonPointerdownCapture: unref(pointerDownOutside).onPointerDownCapture\n\t\t\t}, {\n\t\t\t\tdefault: withCtx(() => [renderSlot(_ctx.$slots, \"default\")]),\n\t\t\t\t_: 3\n\t\t\t}, 8, [\n\t\t\t\t\"as-child\",\n\t\t\t\t\"as\",\n\t\t\t\t\"style\",\n\t\t\t\t\"onFocusCapture\",\n\t\t\t\t\"onBlurCapture\",\n\t\t\t\t\"onPointerdownCapture\"\n\t\t\t]);\n\t\t};\n\t}\n});\n\n//#endregion\n//#region src/DismissableLayer/DismissableLayer.vue\nvar DismissableLayer_default = DismissableLayer_vue_vue_type_script_setup_true_lang_default;\n\n//#endregion\nexport { DismissableLayer_default, context };\n//# sourceMappingURL=DismissableLayer.js.map","import { ref } from \"vue\";\nimport { createGlobalState } from \"@vueuse/core\";\n\n//#region src/FocusScope/stack.ts\nconst useFocusStackState = createGlobalState(() => {\n\tconst stack = ref([]);\n\treturn stack;\n});\nfunction createFocusScopesStack() {\n\t/** A stack of focus scopes, with the active one at the top */\n\tconst stack = useFocusStackState();\n\treturn {\n\t\tadd(focusScope) {\n\t\t\tconst activeFocusScope = stack.value[0];\n\t\t\tif (focusScope !== activeFocusScope) activeFocusScope?.pause();\n\t\t\tstack.value = arrayRemove(stack.value, focusScope);\n\t\t\tstack.value.unshift(focusScope);\n\t\t},\n\t\tremove(focusScope) {\n\t\t\tstack.value = arrayRemove(stack.value, focusScope);\n\t\t\tstack.value[0]?.resume();\n\t\t}\n\t};\n}\nfunction arrayRemove(array, item) {\n\tconst updatedArray = [...array];\n\tconst index = updatedArray.indexOf(item);\n\tif (index !== -1) updatedArray.splice(index, 1);\n\treturn updatedArray;\n}\nfunction removeLinks(items) {\n\treturn items.filter((item) => item.tagName !== \"A\");\n}\n\n//#endregion\nexport { createFocusScopesStack, removeLinks };\n//# sourceMappingURL=stack.js.map","import { getActiveElement } from \"../shared/getActiveElement.js\";\n\n//#region src/FocusScope/utils.ts\nconst AUTOFOCUS_ON_MOUNT = \"focusScope.autoFocusOnMount\";\nconst AUTOFOCUS_ON_UNMOUNT = \"focusScope.autoFocusOnUnmount\";\nconst EVENT_OPTIONS = {\n\tbubbles: false,\n\tcancelable: true\n};\n/**\n* Attempts focusing the first element in a list of candidates.\n* Stops when focus has actually moved.\n*/\nfunction focusFirst(candidates, { select = false } = {}) {\n\tconst previouslyFocusedElement = getActiveElement();\n\tfor (const candidate of candidates) {\n\t\tfocus(candidate, { select });\n\t\tif (getActiveElement() !== previouslyFocusedElement) return true;\n\t}\n}\n/**\n* Returns the first and last tabbable elements inside a container.\n*/\nfunction getTabbableEdges(container) {\n\tconst candidates = getTabbableCandidates(container);\n\tconst first = findVisible(candidates, container);\n\tconst last = findVisible(candidates.reverse(), container);\n\treturn [first, last];\n}\n/**\n* Returns a list of potential tabbable candidates.\n*\n* NOTE: This is only a close approximation. For example it doesn't take into account cases like when\n* elements are not visible. This cannot be worked out easily by just reading a property, but rather\n* necessitate runtime knowledge (computed styles, etc). We deal with these cases separately.\n*\n* See: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker\n* Credit: https://github.com/discord/focus-layers/blob/master/src/util/wrapFocus.tsx#L1\n*/\nfunction getTabbableCandidates(container) {\n\tconst nodes = [];\n\tconst walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, { acceptNode: (node) => {\n\t\tconst isHiddenInput = node.tagName === \"INPUT\" && node.type === \"hidden\";\n\t\tif (node.disabled || node.hidden || isHiddenInput) return NodeFilter.FILTER_SKIP;\n\t\treturn node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;\n\t} });\n\twhile (walker.nextNode()) nodes.push(walker.currentNode);\n\treturn nodes;\n}\n/**\n* Returns the first visible element in a list.\n* NOTE: Only checks visibility up to the `container`.\n*/\nfunction findVisible(elements, container) {\n\tfor (const element of elements) if (!isHidden(element, { upTo: container })) return element;\n}\nfunction isHidden(node, { upTo }) {\n\tif (getComputedStyle(node).visibility === \"hidden\") return true;\n\twhile (node) {\n\t\tif (upTo !== void 0 && node === upTo) return false;\n\t\tif (getComputedStyle(node).display === \"none\") return true;\n\t\tnode = node.parentElement;\n\t}\n\treturn false;\n}\nfunction isSelectableInput(element) {\n\treturn element instanceof HTMLInputElement && \"select\" in element;\n}\nfunction focus(element, { select = false } = {}) {\n\tif (element && element.focus) {\n\t\tconst previouslyFocusedElement = getActiveElement();\n\t\telement.focus({ preventScroll: true });\n\t\tif (element !== previouslyFocusedElement && isSelectableInput(element) && select) element.select();\n\t}\n}\n\n//#endregion\nexport { AUTOFOCUS_ON_MOUNT, AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS, focus, focusFirst, getTabbableCandidates, getTabbableEdges };\n//# sourceMappingURL=utils.js.map","import { getActiveElement } from \"../shared/getActiveElement.js\";\nimport { useForwardExpose } from \"../shared/useForwardExpose.js\";\nimport { Primitive } from \"../Primitive/Primitive.js\";\nimport { createFocusScopesStack, removeLinks } from \"./stack.js\";\nimport { AUTOFOCUS_ON_MOUNT, AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS, focus, focusFirst, getTabbableCandidates, getTabbableEdges } from \"./utils.js\";\nimport { createBlock, defineComponent, nextTick, openBlock, reactive, ref, renderSlot, unref, watchEffect, withCtx } from \"vue\";\nimport { isClient } from \"@vueuse/shared\";\n\n//#region src/FocusScope/FocusScope.vue?vue&type=script&setup=true&lang.ts\nvar FocusScope_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({\n\t__name: \"FocusScope\",\n\tprops: {\n\t\tloop: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false,\n\t\t\tdefault: false\n\t\t},\n\t\ttrapped: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false,\n\t\t\tdefault: false\n\t\t},\n\t\tasChild: {\n\t\t\ttype: Boolean,\n\t\t\trequired: false\n\t\t},\n\t\tas: {\n\t\t\ttype: null,\n\t\t\trequired: false\n\t\t}\n\t},\n\temits: [\"mountAutoFocus\", \"unmountAutoFocus\"],\n\tsetup(__props, { emit: __emit }) {\n\t\tconst props = __props;\n\t\tconst emits = __emit;\n\t\tconst { currentRef, currentElement } = useForwardExpose();\n\t\tconst lastFocusedElementRef = ref(null);\n\t\tconst focusScopesStack = createFocusScopesStack();\n\t\tconst focusScope = reactive({\n\t\t\tpaused: false,\n\t\t\tpause() {\n\t\t\t\tthis.paused = true;\n\t\t\t},\n\t\t\tresume() {\n\t\t\t\tthis.paused = false;\n\t\t\t}\n\t\t});\n\t\twatchEffect((cleanupFn) => {\n\t\t\tif (!isClient) return;\n\t\t\tconst container = currentElement.value;\n\t\t\tif (!props.trapped) return;\n\t\t\tfunction handleFocusIn(event) {\n\t\t\t\tif (focusScope.paused || !container) return;\n\t\t\t\tconst target = event.target;\n\t\t\t\tif (container.contains(target)) lastFocusedElementRef.value = target;\n\t\t\t\telse focus(lastFocusedElementRef.value, { select: true });\n\t\t\t}\n\t\t\tfunction handleFocusOut(event) {\n\t\t\t\tif (focusScope.paused || !container) return;\n\t\t\t\tconst relatedTarget = event.relatedTarget;\n\t\t\t\tif (relatedTarget === null) return;\n\t\t\t\tif (!container.contains(relatedTarget)) focus(lastFocusedElementRef.value, { select: true });\n\t\t\t}\n\t\t\tfunction handleMutations(mutations) {\n\t\t\t\tconst isLastFocusedElementExist = container.contains(lastFocusedElementRef.value);\n\t\t\t\tif (!isLastFocusedElementExist) focus(container);\n\t\t\t}\n\t\t\tdocument.addEventListener(\"focusin\", handleFocusIn);\n\t\t\tdocument.addEventListener(\"focusout\", handleFocusOut);\n\t\t\tconst mutationObserver = new MutationObserver(handleMutations);\n\t\t\tif (container) mutationObserver.observe(container, {\n\t\t\t\tchildList: true,\n\t\t\t\tsubtree: true\n\t\t\t});\n\t\t\tcleanupFn(() => {\n\t\t\t\tdocument.removeEventListener(\"focusin\", handleFocusIn);\n\t\t\t\tdocument.removeEventListener(\"focusout\", handleFocusOut);\n\t\t\t\tmutationObserver.disconnect();\n\t\t\t});\n\t\t});\n\t\twatchEffect(async (cleanupFn) => {\n\t\t\tconst container = currentElement.value;\n\t\t\tawait nextTick();\n\t\t\tif (!container) return;\n\t\t\tfocusScopesStack.add(focusScope);\n\t\t\tconst previouslyFocusedElement = getActiveElement();\n\t\t\tconst hasFocusedCandidate = container.contains(previouslyFocusedElement);\n\t\t\tif (!hasFocusedCandidate) {\n\t\t\t\tconst mountEvent = new CustomEvent(AUTOFOCUS_ON_MOUNT, EVENT_OPTIONS);\n\t\t\t\tcontainer.addEventListener(AUTOFOCUS_ON_MOUNT, (ev) => emits(\"mountAutoFocus\", ev));\n\t\t\t\tcontainer.dispatchEvent(mountEvent);\n\t\t\t\tif (!mountEvent.defaultPrevented) {\n\t\t\t\t\tfocusFirst(removeLinks(getTabbableCandidates(container)), { select: true });\n\t\t\t\t\tif (getActiveElement() === previouslyFocusedElement) focus(container);\n\t\t\t\t}\n\t\t\t}\n\t\t\tcleanupFn(() => {\n\t\t\t\tcontainer.removeEventListener(AUTOFOCUS_ON_MOUNT, (ev) => emits(\"mountAutoFocus\", ev));\n\t\t\t\tconst unmountEvent = new CustomEvent(AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS);\n\t\t\t\tconst unmountEventHandler = (ev) => {\n\t\t\t\t\temits(\"unmountAutoFocus\", ev);\n\t\t\t\t};\n\t\t\t\tcontainer.addEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler);\n\t\t\t\tcontainer.dispatchEvent(unmountEvent);\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tif (!unmountEvent.defaultPrevented) focus(previouslyFocusedElement ?? document.body, { select: true });\n\t\t\t\t\tcontainer.removeEventListener(AUTOFOCUS_ON_UNMOUNT, unmountEventHandler);\n\t\t\t\t\tfocusScopesStack.remove(focusScope);\n\t\t\t\t}, 0);\n\t\t\t});\n\t\t});\n\t\tfunction handleKeyDown(event) {\n\t\t\tif (!props.loop && !props.trapped) return;\n\t\t\tif (focusScope.paused) return;\n\t\t\tconst isTabKey = event.key === \"Tab\" && !event.altKey && !event.ctrlKey && !event.metaKey;\n\t\t\tconst focusedElement = getActiveElement();\n\t\t\tif (isTabKey && focusedElement) {\n\t\t\t\tconst container = event.currentTarget;\n\t\t\t\tconst [first, last] = getTabbableEdges(container);\n\t\t\t\tconst hasTabbableElementsInside = first && last;\n\t\t\t\tif (!hasTabbableElementsInside) {\n\t\t\t\t\tif (focusedElement === container) event.preventDefault();\n\t\t\t\t} else if (!event.shiftKey && focusedElement === last) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif (props.loop) focus(first, { select: true });\n\t\t\t\t} else if (event.shiftKey && focusedElement === first) {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif (props.loop) focus(last, { select: true });\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn (_ctx, _cache) => {\n\t\t\treturn openBlock(), createBlock(unref(Primitive), {\n\t\t\t\tref_key: \"currentRef\",\n\t\t\t\tref: currentRef,\n\t\t\t\ttabindex: \"-1\",\n\t\t\t\t\"as-child\": _ctx.asChild,\n\t\t\t\tas: _ctx.as,\n\t\t\t\tonKeydown: handleKeyDown\n\t\t\t}, {\n\t\t\t\tdefault: withCtx(() => [renderSlot(_ctx.$slots, \"default\")]),\n\t\t\t\t_: 3\n\t\t\t}, 8, [\"as-child\", \"as\"]);\n\t\t};\n\t}\n});\n\n//#endregion\n//#region src/FocusScope/FocusScope.vue\nvar FocusScope_default = FocusScope_vue_vue_type_script_setup_true_lang_default;\n\n//#endregion\nexport { FocusScope_default };\n//# sourceMappingURL=FocusScope.js.map","import { getActiveElement } from \"../shared/getActiveElement.js\";\n\n//#region src/Menu/utils.ts\nconst ITEM_SELECT = \"menu.itemSelect\";\nconst SELECTION_KEYS = [\"Enter\", \" \"];\nconst FIRST_KEYS = [\n\t\"ArrowDown\",\n\t\"PageUp\",\n\t\"Home\"\n];\nconst LAST_KEYS = [\n\t\"ArrowUp\",\n\t\"PageDown\",\n\t\"End\"\n];\nconst FIRST_LAST_KEYS = [...FIRST_KEYS, ...LAST_KEYS];\nconst SUB_OPEN_KEYS = {\n\tltr: [...SELECTION_KEYS, \"ArrowRight\"],\n\trtl: [...SELECTION_KEYS, \"ArrowLeft\"]\n};\nconst SUB_CLOSE_KEYS = {\n\tltr: [\"ArrowLeft\"],\n\trtl: [\"ArrowRight\"]\n};\nfunction getOpenState(open) {\n\treturn open ? \"open\" : \"closed\";\n}\nfunction isIndeterminate(checked) {\n\treturn checked === \"indeterminate\";\n}\nfunction getCheckedState(checked) {\n\treturn isIndeterminate(checked) ? \"indeterminate\" : checked ? \"checked\" : \"unchecked\";\n}\nfunction focusFirst(candidates) {\n\tconst PREVIOUSLY_FOCUSED_ELEMENT = getActiveElement();\n\tfor (const candidate of candidates) {\n\t\tif (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;\n\t\tcandidate.focus();\n\t\tif (getActiveElement() !== PREVIOUSLY_FOCUSED_ELEMENT) return;\n\t}\n}\nfunction isPointInPolygon(point, polygon) {\n\tconst { x, y } = point;\n\tlet inside = false;\n\tfor (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {\n\t\tconst xi = polygon[i].x;\n\t\tconst yi = polygon[i].y;\n\t\tconst xj = polygon[j].x;\n\t\tconst yj = polygon[j].y;\n\t\tconst intersect = yi > y !== yj > y && x < (xj - xi) * (y - yi) / (yj - yi) + xi;\n\t\tif (intersect) inside = !inside;\n\t}\n\treturn inside;\n}\nfunction isPointerInGraceArea(event, area) {\n\tif (!area) return false;\n\tconst cursorPos = {\n\t\tx: event.clientX,\n\t\ty: event.clientY\n\t};\n\treturn isPointInPolygon(cursorPos, area);\n}\nfunction isMouseEvent(event) {\n\treturn event.pointerType === \"mouse\";\n}\n\n//#endregion\nexport { FIRST_LAST_KEYS, ITEM_SELECT, LAST_KEYS, SELECTION_KEYS, SUB_CLOSE_KEYS, SUB_OPEN_KEYS, focusFirst, getCheckedState, getOpenState, isIndeterminate, isMouseEvent, isPointerInGraceArea };\n//# sourceMappingURL=utils.js.map","import { Slot } from \"../Primitive/Slot.js\";\nimport { usePrimitiveElement } from \"../Primitive/usePrimitiveElement.js\";\nimport { computed, defineComponent, h, inject, markRaw, provide, ref, watch, watchEffect } from \"vue\";\n\n//#region src/Collection/Collection.ts\nconst ITEM_DATA_ATTR = \"data-reka-collection-item\";\nfunction useCollection(options = {}) {\n\tconst { key = \"\", isProvider = false } = options;\n\tconst injectionKey = `${key}CollectionProvider`;\n\tlet context;\n\tif (isProvider) {\n\t\tconst itemMap = ref(/* @__PURE__ */ new Map());\n\t\tconst collectionRef = ref();\n\t\tcontext = {\n\t\t\tcollectionRef,\n\t\t\titemMap\n\t\t};\n\t\tprovide(injectionKey, context);\n\t} else context = inject(injectionKey);\n\tconst getItems = (includeDisabledItem = false) => {\n\t\tconst collectionNode = context.collectionRef.value;\n\t\tif (!collectionNode) return [];\n\t\tconst orderedNodes = Array.from(collectionNode.querySelectorAll(`[${ITEM_DATA_ATTR}]`));\n\t\tconst items = Array.from(context.itemMap.value.values());\n\t\tconst orderedItems = items.sort((a, b) => orderedNodes.indexOf(a.ref) - orderedNodes.indexOf(b.ref));