UNPKG

bootstrap-vue-next

Version:

Seamless integration of Vue 3, Bootstrap 5, and TypeScript for modern, type-safe UI development

1,583 lines 75.9 kB
import { C as useVModel, M as refAutoReset, T as createEventHook, s as unrefElement } from "./dist-B10a-gZ8.mjs"; import { t as useDefaults } from "./useDefaults-BKgBaqOV.mjs"; import { t as useId$1 } from "./useId-BKZFSYm8.mjs"; import { t as BButton_default } from "./BButton-BRvIFnRm.mjs"; import { a as useDirection, c as createContext, i as Slot, n as usePrimitiveElement, o as injectConfigProviderContext, r as Primitive } from "./VisuallyHidden-Bbwok8oL.mjs"; import { n as getActiveElement, t as useForwardExpose } from "./useForwardExpose-4OUimdPL.mjs"; import { a as FocusScope_default, c as useId$2, d as useForwardProps, f as useFocusGuards, i as Teleport_default, l as useHideOthers, m as handleAndDispatchCustomEvent, n as PopperAnchor_default, o as DismissableLayer_default, p as useBodyScrollLock, r as PopperRoot_default, s as Presence_default, t as PopperContent_default, u as useForwardPropsEmits } from "./PopperContent-BTUvv6Tu.mjs"; import { t as useKbd } from "./useKbd-IZRktImL.mjs"; import { t as VisuallyHiddenInput_default } from "./VisuallyHiddenInput-D1SjTCVH.mjs"; import { t as useStateClass } from "./useStateClass-CdmlbrGn.mjs"; import { t as useAriaInvalid } from "./useAriaInvalid-apOwgexm.mjs"; import { t as BInputGroup_default } from "./BInputGroup-DpX10xwR.mjs"; import { t as BFormTag_default } from "./BFormTag-BUWEugEC.mjs"; import { t as useFormSelect } from "./useFormSelect-D3gVO4jJ.mjs"; import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, getCurrentInstance, guardReactiveProps, h, inject, isRef, markRaw, mergeModels, mergeProps, nextTick, normalizeClass, normalizeProps, onMounted, onUnmounted, openBlock, provide, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, toRefs, toValue, unref, useModel, watch, watchEffect, watchSyncEffect, withCtx, withKeys, withMemo, withModifiers } from "vue"; //#region ../../node_modules/.pnpm/ohash@2.0.11/node_modules/ohash/dist/shared/ohash.D__AXeF1.mjs function serialize(o) { return typeof o == "string" ? `'${o}'` : new c().serialize(o); } var c = /* @__PURE__ */ function() { class o { #t = /* @__PURE__ */ new Map(); compare(t, r) { const e = typeof t, n = typeof r; return e === "string" && n === "string" ? t.localeCompare(r) : e === "number" && n === "number" ? t - r : String.prototype.localeCompare.call(this.serialize(t, true), this.serialize(r, true)); } serialize(t, r) { if (t === null) return "null"; switch (typeof t) { case "string": return r ? t : `'${t}'`; case "bigint": return `${t}n`; case "object": return this.$object(t); case "function": return this.$function(t); } return String(t); } serializeObject(t) { const r = Object.prototype.toString.call(t); if (r !== "[object Object]") return this.serializeBuiltInType(r.length < 10 ? `unknown:${r}` : r.slice(8, -1), t); const e = t.constructor, n = e === Object || e === void 0 ? "" : e.name; if (n !== "" && globalThis[n] === e) return this.serializeBuiltInType(n, t); if (typeof t.toJSON == "function") { const i = t.toJSON(); return n + (i !== null && typeof i == "object" ? this.$object(i) : `(${this.serialize(i)})`); } return this.serializeObjectEntries(n, Object.entries(t)); } serializeBuiltInType(t, r) { const e = this["$" + t]; if (e) return e.call(this, r); if (typeof r?.entries == "function") return this.serializeObjectEntries(t, r.entries()); throw new Error(`Cannot serialize ${t}`); } serializeObjectEntries(t, r) { const e = Array.from(r).sort((i, a) => this.compare(i[0], a[0])); let n = `${t}{`; for (let i = 0; i < e.length; i++) { const [a, l] = e[i]; n += `${this.serialize(a, true)}:${this.serialize(l)}`, i < e.length - 1 && (n += ","); } return n + "}"; } $object(t) { let r = this.#t.get(t); return r === void 0 && (this.#t.set(t, `#${this.#t.size}`), r = this.serializeObject(t), this.#t.set(t, r)), r; } $function(t) { const r = Function.prototype.toString.call(t); return r.slice(-15) === "[native code] }" ? `${t.name || ""}()[native]` : `${t.name}(${t.length})${r.replace(/\s*\n\s*/g, "")}`; } $Array(t) { let r = "["; for (let e = 0; e < t.length; e++) r += this.serialize(t[e]), e < t.length - 1 && (r += ","); return r + "]"; } $Date(t) { try { return `Date(${t.toISOString()})`; } catch { return "Date(null)"; } } $ArrayBuffer(t) { return `ArrayBuffer[${new Uint8Array(t).join(",")}]`; } $Set(t) { return `Set${this.$Array(Array.from(t).sort((r, e) => this.compare(r, e)))}`; } $Map(t) { return this.serializeObjectEntries("Map", t.entries()); } } for (const s of [ "Error", "RegExp", "URL" ]) o.prototype["$" + s] = function(t) { return `${s}(${t})`; }; for (const s of [ "Int8Array", "Uint8Array", "Uint8ClampedArray", "Int16Array", "Uint16Array", "Int32Array", "Uint32Array", "Float32Array", "Float64Array" ]) o.prototype["$" + s] = function(t) { return `${s}[${t.join(",")}]`; }; for (const s of ["BigInt64Array", "BigUint64Array"]) o.prototype["$" + s] = function(t) { return `${s}[${t.join("n,")}${t.length > 0 ? "n" : ""}]`; }; return o; }(); function isEqual(object1, object2) { if (object1 === object2) return true; if (serialize(object1) === serialize(object2)) return true; return false; } //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/shared/arrays.js /** * The function `findValuesBetween` takes an array and two values, then returns a subarray containing * elements between the first occurrence of the start value and the first occurrence of the end value * in the array. * @param {T[]} array - The `array` parameter is an array of values of type `T`. * @param {T} start - The `start` parameter is the value that marks the beginning of the range you want * to find in the array. * @param {T} end - The `end` parameter in the `findValuesBetween` function represents the end value * that you want to find in the array. This function will return a subarray of values that are between * the `start` and `end` values in the original array. * @returns The `findValuesBetween` function returns an array of values from the input array that are * between the `start` and `end` values (inclusive). If either the `start` or `end` values are not * found in the input array, an empty array is returned. */ function findValuesBetween(array, start, end) { const startIndex = array.findIndex((i) => isEqual(i, start)); const endIndex = array.findIndex((i) => isEqual(i, end)); if (startIndex === -1 || endIndex === -1) return []; const [minIndex, maxIndex] = [startIndex, endIndex].sort((a, b) => a - b); return array.slice(minIndex, maxIndex + 1); } //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/shared/useFilter.js /** * Provides locale-aware string filtering functions. * Uses `Intl.Collator` for comparison to ensure proper Unicode handling. * * @param options - Optional collator options to customize comparison behavior. * See [Intl.CollatorOptions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Collator/Collator#options) for details. * @returns An object with methods to check if a string starts with, ends with, or contains a substring. * * @example * const { startsWith, endsWith, contains } = useFilter(); * * startsWith('hello', 'he'); // true * endsWith('hello', 'lo'); // true * contains('hello', 'ell'); // true */ function useFilter(options) { const computedOptions = computed(() => unref(options)); const collator = computed(() => new Intl.Collator("en", { usage: "search", ...computedOptions.value })); const startsWith = (string, substring) => { if (substring.length === 0) return true; string = string.normalize("NFC"); substring = substring.normalize("NFC"); return collator.value.compare(string.slice(0, substring.length), substring) === 0; }; const endsWith = (string, substring) => { if (substring.length === 0) return true; string = string.normalize("NFC"); substring = substring.normalize("NFC"); return collator.value.compare(string.slice(-substring.length), substring) === 0; }; const contains = (string, substring) => { if (substring.length === 0) return true; string = string.normalize("NFC"); substring = substring.normalize("NFC"); let scan = 0; const sliceLen = substring.length; for (; scan + sliceLen <= string.length; scan++) { const slice = string.slice(scan, scan + sliceLen); if (collator.value.compare(substring, slice) === 0) return true; } return false; }; return { startsWith, endsWith, contains }; } //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/shared/useFormControl.js function useFormControl(el) { return computed(() => toValue(el) ? Boolean(unrefElement(el)?.closest("form")) : true); } //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/shared/useTypeahead.js function useTypeahead(callback) { const search = refAutoReset("", 1e3); const handleTypeaheadSearch = (key, items) => { search.value = search.value + key; if (callback) callback(key); else { const currentItem = getActiveElement(); const itemsWithTextValue = items.map((item) => ({ ...item, textValue: item.value?.textValue ?? item.ref.textContent?.trim() ?? "" })); const currentMatch = itemsWithTextValue.find((item) => item.ref === currentItem); const nextMatch = getNextMatch(itemsWithTextValue.map((item) => item.textValue), search.value, currentMatch?.textValue); const newItem = itemsWithTextValue.find((item) => item.textValue === nextMatch); if (newItem) newItem.ref.focus(); return newItem?.ref; } }; const resetTypeahead = () => { search.value = ""; }; return { search, handleTypeaheadSearch, resetTypeahead }; } /** * Wraps an array around itself at a given start index * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']` */ function wrapArray(array, startIndex) { return array.map((_, index) => array[(startIndex + index) % array.length]); } /** * This is the "meat" of the typeahead matching logic. It takes in all the values, * the search and the current match, and returns the next match (or `undefined`). * * We normalize the search because if a user has repeatedly pressed a character, * we want the exact same behavior as if we only had that one character * (ie. cycle through options starting with that character) * * We also reorder the values by wrapping the array around the current match. * This is so we always look forward from the current match, and picking the first * match will always be the correct one. * * Finally, if the normalized search is exactly one character, we exclude the * current match from the values because otherwise it would be the first to match always * and focus would never move. This is as opposed to the regular case, where we * don't want focus to move if the current match still matches. */ function getNextMatch(values, search, currentMatch) { const normalizedSearch = search.length > 1 && Array.from(search).every((char) => char === search[0]) ? search[0] : search; const currentMatchIndex = currentMatch ? values.indexOf(currentMatch) : -1; let wrappedValues = wrapArray(values, Math.max(currentMatchIndex, 0)); if (normalizedSearch.length === 1) wrappedValues = wrappedValues.filter((v) => v !== currentMatch); const nextMatch = wrappedValues.find((value) => value.toLowerCase().startsWith(normalizedSearch.toLowerCase())); return nextMatch !== currentMatch ? nextMatch : void 0; } //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Collection/Collection.js var ITEM_DATA_ATTR = "data-reka-collection-item"; function useCollection(options = {}) { const { key = "", isProvider = false } = options; const injectionKey = `${key}CollectionProvider`; let context; if (isProvider) { const itemMap = ref(/* @__PURE__ */ new Map()); context = { collectionRef: ref(), itemMap }; provide(injectionKey, context); } else context = inject(injectionKey); const getItems = (includeDisabledItem = false) => { const collectionNode = context.collectionRef.value; if (!collectionNode) return []; const orderedNodes = Array.from(collectionNode.querySelectorAll(`[${ITEM_DATA_ATTR}]`)); const orderedItems = Array.from(context.itemMap.value.values()).sort((a, b) => orderedNodes.indexOf(a.ref) - orderedNodes.indexOf(b.ref)); if (includeDisabledItem) return orderedItems; else return orderedItems.filter((i) => i.ref.dataset.disabled !== ""); }; const CollectionSlot = defineComponent({ name: "CollectionSlot", inheritAttrs: false, setup(_, { slots, attrs }) { const { primitiveElement, currentElement } = usePrimitiveElement(); watch(currentElement, () => { context.collectionRef.value = currentElement.value; }); return () => h(Slot, { ref: primitiveElement, ...attrs }, slots); } }); const CollectionItem = defineComponent({ name: "CollectionItem", inheritAttrs: false, props: { value: { validator: () => true } }, setup(props, { slots, attrs }) { const { primitiveElement, currentElement } = usePrimitiveElement(); watchEffect((cleanupFn) => { if (currentElement.value) { const key$1 = markRaw(currentElement.value); context.itemMap.value.set(key$1, { ref: currentElement.value, value: props.value }); cleanupFn(() => context.itemMap.value.delete(key$1)); } }); return () => h(Slot, { ...attrs, [ITEM_DATA_ATTR]: "", ref: primitiveElement }, slots); } }); return { getItems, reactiveItems: computed(() => Array.from(context.itemMap.value.values())), itemMapSize: computed(() => context.itemMap.value.size), CollectionSlot, CollectionItem }; } //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Listbox/utils.js function valueComparator(value, currentValue, comparator) { if (value === void 0) return false; else if (Array.isArray(value)) return value.some((val) => compare(val, currentValue, comparator)); else return compare(value, currentValue, comparator); } function compare(value, currentValue, comparator) { if (value === void 0 || currentValue === void 0) return false; if (typeof value === "string") return value === currentValue; if (typeof comparator === "function") return comparator(value, currentValue); if (typeof comparator === "string") return value?.[comparator] === currentValue?.[comparator]; return isEqual(value, currentValue); } //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/RovingFocus/utils.js var MAP_KEY_TO_FOCUS_INTENT = { ArrowLeft: "prev", ArrowUp: "prev", ArrowRight: "next", ArrowDown: "next", PageUp: "first", Home: "first", PageDown: "last", End: "last" }; function getDirectionAwareKey(key, dir) { if (dir !== "rtl") return key; return key === "ArrowLeft" ? "ArrowRight" : key === "ArrowRight" ? "ArrowLeft" : key; } function getFocusIntent(event, orientation, dir) { const key = getDirectionAwareKey(event.key, dir); if (orientation === "vertical" && ["ArrowLeft", "ArrowRight"].includes(key)) return void 0; if (orientation === "horizontal" && ["ArrowUp", "ArrowDown"].includes(key)) return void 0; return MAP_KEY_TO_FOCUS_INTENT[key]; } //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Listbox/ListboxRoot.js var [injectListboxRootContext, provideListboxRootContext] = createContext("ListboxRoot"); var ListboxRoot_default = /* @__PURE__ */ defineComponent({ __name: "ListboxRoot", props: { modelValue: { type: null, required: false }, defaultValue: { type: null, required: false }, multiple: { type: Boolean, required: false }, orientation: { type: String, required: false, default: "vertical" }, dir: { type: String, required: false }, disabled: { type: Boolean, required: false }, selectionBehavior: { type: String, required: false, default: "toggle" }, highlightOnHover: { type: Boolean, required: false }, by: { type: [String, Function], required: false }, asChild: { type: Boolean, required: false }, as: { type: null, required: false }, name: { type: String, required: false }, required: { type: Boolean, required: false } }, emits: [ "update:modelValue", "highlight", "entryFocus", "leave" ], setup(__props, { expose: __expose, emit: __emit }) { const props = __props; const emits = __emit; const { multiple, highlightOnHover, orientation, disabled, selectionBehavior, dir: propDir } = toRefs(props); const { getItems } = useCollection({ isProvider: true }); const { handleTypeaheadSearch } = useTypeahead(); const { primitiveElement, currentElement } = usePrimitiveElement(); const kbd = useKbd(); const dir = useDirection(propDir); const isFormControl = useFormControl(currentElement); const firstValue = ref(); const isUserAction = ref(false); const focusable = ref(true); const modelValue = useVModel(props, "modelValue", emits, { defaultValue: props.defaultValue ?? (multiple.value ? [] : void 0), passive: props.modelValue === void 0, deep: true }); function onValueChange(val) { isUserAction.value = true; if (props.multiple) { const modelArray = Array.isArray(modelValue.value) ? [...modelValue.value] : []; const index = modelArray.findIndex((i) => compare(i, val, props.by)); if (props.selectionBehavior === "toggle") { index === -1 ? modelArray.push(val) : modelArray.splice(index, 1); modelValue.value = modelArray; } else { modelValue.value = [val]; firstValue.value = val; } } else if (props.selectionBehavior === "toggle") if (compare(modelValue.value, val, props.by)) modelValue.value = void 0; else modelValue.value = val; else modelValue.value = val; setTimeout(() => { isUserAction.value = false; }, 1); } const highlightedElement = ref(null); const previousElement = ref(null); const isVirtual = ref(false); const isComposing = ref(false); const virtualFocusHook = createEventHook(); const virtualKeydownHook = createEventHook(); const virtualHighlightHook = createEventHook(); function getCollectionItem() { return getItems().map((i) => i.ref).filter((i) => i.dataset.disabled !== ""); } function changeHighlight(el, scrollIntoView = true) { if (!el) return; highlightedElement.value = el; if (focusable.value) highlightedElement.value.focus(); if (scrollIntoView) highlightedElement.value.scrollIntoView({ block: "nearest" }); emits("highlight", getItems().find((i) => i.ref === el)); } function highlightItem(value) { if (isVirtual.value) virtualHighlightHook.trigger(value); else { const item = getItems().find((i) => compare(i.value, value, props.by)); if (item) { highlightedElement.value = item.ref; changeHighlight(item.ref); } } } function onKeydownEnter(event) { if (highlightedElement.value && highlightedElement.value.isConnected) { event.preventDefault(); event.stopPropagation(); if (!isComposing.value) highlightedElement.value.click(); } } function onKeydownTypeAhead(event) { if (!focusable.value) return; isUserAction.value = true; if (isVirtual.value) virtualKeydownHook.trigger(event); else { const isMetaKey = event.altKey || event.ctrlKey || event.metaKey; if (isMetaKey && event.key === "a" && multiple.value) { const collection = getItems(); modelValue.value = [...collection.map((i) => i.value)]; event.preventDefault(); changeHighlight(collection[collection.length - 1].ref); } else if (!isMetaKey) { const el = handleTypeaheadSearch(event.key, getItems()); if (el) changeHighlight(el); } } setTimeout(() => { isUserAction.value = false; }, 1); } function onCompositionStart() { isComposing.value = true; } function onCompositionEnd() { nextTick(() => { isComposing.value = false; }); } function highlightFirstItem() { nextTick(() => { onKeydownNavigation(new KeyboardEvent("keydown", { key: "PageUp" })); }); } function onLeave(event) { const el = highlightedElement.value; if (el?.isConnected) previousElement.value = el; highlightedElement.value = null; emits("leave", event); } function onEnter(event) { const entryFocusEvent = new CustomEvent("listbox.entryFocus", { bubbles: false, cancelable: true }); event.currentTarget?.dispatchEvent(entryFocusEvent); emits("entryFocus", entryFocusEvent); if (entryFocusEvent.defaultPrevented) return; if (previousElement.value) changeHighlight(previousElement.value); else { const el = getCollectionItem()?.[0]; changeHighlight(el); } } function onKeydownNavigation(event) { const intent = getFocusIntent(event, orientation.value, dir.value); if (!intent) return; let collection = getCollectionItem(); if (highlightedElement.value) { if (intent === "last") collection.reverse(); else if (intent === "prev" || intent === "next") { if (intent === "prev") collection.reverse(); const currentIndex = collection.indexOf(highlightedElement.value); collection = collection.slice(currentIndex + 1); } handleMultipleReplace(event, collection[0]); } if (collection.length) { const index = !highlightedElement.value && intent === "prev" ? collection.length - 1 : 0; changeHighlight(collection[index]); } if (isVirtual.value) return virtualKeydownHook.trigger(event); } function handleMultipleReplace(event, targetEl) { if (isVirtual.value || props.selectionBehavior !== "replace" || !multiple.value || !Array.isArray(modelValue.value)) return; if ((event.altKey || event.ctrlKey || event.metaKey) && !event.shiftKey) return; if (event.shiftKey) { const collection = getItems().filter((i) => i.ref.dataset.disabled !== ""); let lastValue = collection.find((i) => i.ref === targetEl)?.value; if (event.key === kbd.END) lastValue = collection[collection.length - 1].value; else if (event.key === kbd.HOME) lastValue = collection[0].value; if (!lastValue || !firstValue.value) return; modelValue.value = findValuesBetween(collection.map((i) => i.value), firstValue.value, lastValue); } } async function highlightSelected(event) { await nextTick(); if (isVirtual.value) virtualFocusHook.trigger(event); else { const collection = getCollectionItem(); const item = collection.find((i) => i.dataset.state === "checked"); if (item) changeHighlight(item); else if (collection.length) changeHighlight(collection[0]); } } watch(modelValue, () => { if (!isUserAction.value) nextTick(() => { highlightSelected(); }); }, { immediate: true, deep: true }); __expose({ highlightedElement, highlightItem, highlightFirstItem, highlightSelected, getItems }); provideListboxRootContext({ modelValue, onValueChange, multiple, orientation, dir, disabled, highlightOnHover, highlightedElement, isVirtual, virtualFocusHook, virtualKeydownHook, virtualHighlightHook, by: props.by, firstValue, selectionBehavior, focusable, onLeave, onEnter, changeHighlight, onKeydownEnter, onKeydownNavigation, onKeydownTypeAhead, onCompositionStart, onCompositionEnd, highlightFirstItem }); return (_ctx, _cache) => { return openBlock(), createBlock(unref(Primitive), { ref_key: "primitiveElement", ref: primitiveElement, as: _ctx.as, "as-child": _ctx.asChild, dir: unref(dir), "data-disabled": unref(disabled) ? "" : void 0, onPointerleave: onLeave, onFocusout: _cache[0] || (_cache[0] = async (event) => { const target = event.relatedTarget || event.target; await nextTick(); if (highlightedElement.value && unref(currentElement) && !unref(currentElement).contains(target)) onLeave(event); }) }, { default: withCtx(() => [renderSlot(_ctx.$slots, "default", { modelValue: unref(modelValue) }), unref(isFormControl) && _ctx.name ? (openBlock(), createBlock(unref(VisuallyHiddenInput_default), { key: 0, name: _ctx.name, value: unref(modelValue), disabled: unref(disabled), required: _ctx.required }, null, 8, [ "name", "value", "disabled", "required" ])) : createCommentVNode("v-if", true)]), _: 3 }, 8, [ "as", "as-child", "dir", "data-disabled" ]); }; } }); //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Listbox/ListboxContent.js var ListboxContent_default = /* @__PURE__ */ defineComponent({ __name: "ListboxContent", props: { asChild: { type: Boolean, required: false }, as: { type: null, required: false } }, setup(__props) { const { CollectionSlot } = useCollection(); const rootContext = injectListboxRootContext(); const isClickFocus = refAutoReset(false, 10); return (_ctx, _cache) => { return openBlock(), createBlock(unref(CollectionSlot), null, { default: withCtx(() => [createVNode(unref(Primitive), { role: "listbox", as: _ctx.as, "as-child": _ctx.asChild, tabindex: unref(rootContext).focusable.value ? unref(rootContext).highlightedElement.value ? "-1" : "0" : "-1", "aria-orientation": unref(rootContext).orientation.value, "aria-multiselectable": !!unref(rootContext).multiple.value, "data-orientation": unref(rootContext).orientation.value, onMousedown: _cache[0] || (_cache[0] = withModifiers(($event) => isClickFocus.value = true, ["left"])), onFocus: _cache[1] || (_cache[1] = (ev) => { if (unref(isClickFocus)) return; unref(rootContext).onEnter(ev); }), onKeydown: [ _cache[2] || (_cache[2] = withKeys((event) => { if (unref(rootContext).orientation.value === "vertical" && (event.key === "ArrowLeft" || event.key === "ArrowRight") || unref(rootContext).orientation.value === "horizontal" && (event.key === "ArrowUp" || event.key === "ArrowDown")) return; event.preventDefault(); unref(rootContext).focusable.value && unref(rootContext).onKeydownNavigation(event); }, [ "down", "up", "left", "right", "home", "end" ])), withKeys(unref(rootContext).onKeydownEnter, ["enter"]), unref(rootContext).onKeydownTypeAhead ] }, { default: withCtx(() => [renderSlot(_ctx.$slots, "default")]), _: 3 }, 8, [ "as", "as-child", "tabindex", "aria-orientation", "aria-multiselectable", "data-orientation", "onKeydown" ])]), _: 3 }); }; } }); //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Listbox/ListboxFilter.js var ListboxFilter_default = /* @__PURE__ */ defineComponent({ __name: "ListboxFilter", props: { modelValue: { type: String, required: false }, autoFocus: { type: Boolean, required: false }, disabled: { type: Boolean, required: false }, asChild: { type: Boolean, required: false }, as: { type: null, required: false, default: "input" } }, emits: ["update:modelValue"], setup(__props, { emit: __emit }) { const props = __props; const modelValue = useVModel(props, "modelValue", __emit, { defaultValue: "", passive: props.modelValue === void 0 }); const rootContext = injectListboxRootContext(); const { primitiveElement, currentElement } = usePrimitiveElement(); const disabled = computed(() => props.disabled || rootContext.disabled.value || false); const activedescendant = ref(); watchSyncEffect(() => activedescendant.value = rootContext.highlightedElement.value?.id); onMounted(() => { rootContext.focusable.value = false; setTimeout(() => { if (props.autoFocus) currentElement.value?.focus(); }, 1); }); onUnmounted(() => { rootContext.focusable.value = true; }); return (_ctx, _cache) => { return openBlock(), createBlock(unref(Primitive), { ref_key: "primitiveElement", ref: primitiveElement, as: _ctx.as, "as-child": _ctx.asChild, value: unref(modelValue), disabled: disabled.value ? "" : void 0, "data-disabled": disabled.value ? "" : void 0, "aria-disabled": disabled.value ?? void 0, "aria-activedescendant": activedescendant.value, type: "text", onKeydown: [withKeys(withModifiers(unref(rootContext).onKeydownNavigation, ["prevent"]), [ "down", "up", "home", "end" ]), withKeys(unref(rootContext).onKeydownEnter, ["enter"])], onInput: _cache[0] || (_cache[0] = (event) => { modelValue.value = event.target.value; unref(rootContext).highlightFirstItem(); }), onCompositionstart: unref(rootContext).onCompositionStart, onCompositionend: unref(rootContext).onCompositionEnd }, { default: withCtx(() => [renderSlot(_ctx.$slots, "default", { modelValue: unref(modelValue) })]), _: 3 }, 8, [ "as", "as-child", "value", "disabled", "data-disabled", "aria-disabled", "aria-activedescendant", "onKeydown", "onCompositionstart", "onCompositionend" ]); }; } }); //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Listbox/ListboxItem.js var LISTBOX_SELECT = "listbox.select"; var [injectListboxItemContext, provideListboxItemContext] = createContext("ListboxItem"); var ListboxItem_default = /* @__PURE__ */ defineComponent({ __name: "ListboxItem", props: { value: { type: null, required: true }, disabled: { type: Boolean, required: false }, asChild: { type: Boolean, required: false }, as: { type: null, required: false, default: "div" } }, emits: ["select"], setup(__props, { emit: __emit }) { const props = __props; const emits = __emit; const id = useId$2(void 0, "reka-listbox-item"); const { CollectionItem } = useCollection(); const { forwardRef, currentElement } = useForwardExpose(); const rootContext = injectListboxRootContext(); const isHighlighted = computed(() => currentElement.value === rootContext.highlightedElement.value); const isSelected = computed(() => valueComparator(rootContext.modelValue.value, props.value, rootContext.by)); const disabled = computed(() => rootContext.disabled.value || props.disabled); async function handleSelect(ev) { emits("select", ev); if (ev?.defaultPrevented) return; if (!disabled.value && ev) { rootContext.onValueChange(props.value); rootContext.changeHighlight(currentElement.value); } } function handleSelectCustomEvent(ev) { handleAndDispatchCustomEvent(LISTBOX_SELECT, handleSelect, { originalEvent: ev, value: props.value }); } provideListboxItemContext({ isSelected }); return (_ctx, _cache) => { return openBlock(), createBlock(unref(CollectionItem), { value: _ctx.value }, { default: withCtx(() => [withMemo([isHighlighted.value, isSelected.value], () => createVNode(unref(Primitive), mergeProps({ id: unref(id) }, _ctx.$attrs, { ref: unref(forwardRef), role: "option", tabindex: unref(rootContext).focusable.value ? isHighlighted.value ? "0" : "-1" : -1, "aria-selected": isSelected.value, as: _ctx.as, "as-child": _ctx.asChild, disabled: disabled.value ? "" : void 0, "data-disabled": disabled.value ? "" : void 0, "data-highlighted": isHighlighted.value ? "" : void 0, "data-state": isSelected.value ? "checked" : "unchecked", onClick: handleSelectCustomEvent, onKeydown: withKeys(withModifiers(handleSelectCustomEvent, ["prevent"]), ["space"]), onPointermove: _cache[0] || (_cache[0] = () => { if (unref(rootContext).highlightedElement.value === unref(currentElement)) return; if (unref(rootContext).highlightOnHover.value && !unref(rootContext).focusable.value) unref(rootContext).changeHighlight(unref(currentElement), false); }) }), { default: withCtx(() => [renderSlot(_ctx.$slots, "default")]), _: 3 }, 16, [ "id", "tabindex", "aria-selected", "as", "as-child", "disabled", "data-disabled", "data-highlighted", "data-state", "onKeydown" ]), _cache, 1)]), _: 3 }, 8, ["value"]); }; } }); //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Listbox/ListboxItemIndicator.js var ListboxItemIndicator_default = /* @__PURE__ */ defineComponent({ __name: "ListboxItemIndicator", props: { asChild: { type: Boolean, required: false }, as: { type: null, required: false, default: "span" } }, setup(__props) { const props = __props; useForwardExpose(); const itemContext = injectListboxItemContext(); return (_ctx, _cache) => { return unref(itemContext).isSelected.value ? (openBlock(), createBlock(unref(Primitive), mergeProps({ key: 0, "aria-hidden": "true" }, props), { default: withCtx(() => [renderSlot(_ctx.$slots, "default")]), _: 3 }, 16)) : createCommentVNode("v-if", true); }; } }); //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Combobox/ComboboxRoot.js var [injectComboboxRootContext, provideComboboxRootContext] = createContext("ComboboxRoot"); var ComboboxRoot_default = /* @__PURE__ */ defineComponent({ __name: "ComboboxRoot", props: { open: { type: Boolean, required: false, default: void 0 }, defaultOpen: { type: Boolean, required: false }, resetSearchTermOnBlur: { type: Boolean, required: false, default: true }, resetSearchTermOnSelect: { type: Boolean, required: false, default: true }, openOnFocus: { type: Boolean, required: false, default: false }, openOnClick: { type: Boolean, required: false, default: false }, ignoreFilter: { type: Boolean, required: false }, resetModelValueOnClear: { type: Boolean, required: false, default: false }, modelValue: { type: null, required: false }, defaultValue: { type: null, required: false }, multiple: { type: Boolean, required: false }, dir: { type: String, required: false }, disabled: { type: Boolean, required: false }, highlightOnHover: { type: Boolean, required: false, default: true }, by: { type: [String, Function], required: false }, asChild: { type: Boolean, required: false }, as: { type: null, required: false }, name: { type: String, required: false }, required: { type: Boolean, required: false } }, emits: [ "update:modelValue", "highlight", "update:open" ], setup(__props, { expose: __expose, emit: __emit }) { const props = __props; const emits = __emit; const { primitiveElement, currentElement: parentElement } = usePrimitiveElement(); const { multiple, disabled, ignoreFilter, resetSearchTermOnSelect, openOnFocus, openOnClick, dir: propDir, resetModelValueOnClear, highlightOnHover } = toRefs(props); const dir = useDirection(propDir); const modelValue = useVModel(props, "modelValue", emits, { defaultValue: props.defaultValue ?? (multiple.value ? [] : void 0), passive: props.modelValue === void 0, deep: true }); const open = useVModel(props, "open", emits, { defaultValue: props.defaultOpen, passive: props.open === void 0 }); async function onOpenChange(val) { open.value = val; filterSearch.value = ""; if (val) { await nextTick(); primitiveElement.value?.highlightSelected(); isUserInputted.value = true; inputElement.value?.focus(); } else { isUserInputted.value = false; setTimeout(() => { if (!val && props.resetSearchTermOnBlur) resetSearchTerm.trigger(); }, 1); } } const resetSearchTerm = createEventHook(); const isUserInputted = ref(false); const isVirtual = ref(false); const inputElement = ref(); const triggerElement = ref(); const highlightedElement = computed(() => primitiveElement.value?.highlightedElement ?? void 0); const allItems = ref(/* @__PURE__ */ new Map()); const allGroups = ref(/* @__PURE__ */ new Map()); const { contains } = useFilter({ sensitivity: "base" }); const filterSearch = ref(""); const filterState = computed((oldValue) => { if (!filterSearch.value || props.ignoreFilter || isVirtual.value) return { count: allItems.value.size, items: oldValue?.items ?? /* @__PURE__ */ new Map(), groups: oldValue?.groups ?? new Set(allGroups.value.keys()) }; let itemCount = 0; const filteredItems = /* @__PURE__ */ new Map(); const filteredGroups = /* @__PURE__ */ new Set(); for (const [id, value] of allItems.value) { const score = contains(value, filterSearch.value); filteredItems.set(id, score ? 1 : 0); if (score) itemCount++; } for (const [groupId, group] of allGroups.value) for (const itemId of group) if (filteredItems.get(itemId) > 0) { filteredGroups.add(groupId); break; } return { count: itemCount, items: filteredItems, groups: filteredGroups }; }); const inst = getCurrentInstance(); onMounted(() => { if (inst?.exposed) { inst.exposed.highlightItem = primitiveElement.value?.highlightItem; inst.exposed.highlightFirstItem = primitiveElement.value?.highlightFirstItem; inst.exposed.highlightSelected = primitiveElement.value?.highlightSelected; } }); __expose({ filtered: filterState, highlightedElement, highlightItem: primitiveElement.value?.highlightItem, highlightFirstItem: primitiveElement.value?.highlightFirstItem, highlightSelected: primitiveElement.value?.highlightSelected }); provideComboboxRootContext({ modelValue, multiple, disabled, open, onOpenChange, contentId: "", isUserInputted, isVirtual, inputElement, highlightedElement, onInputElementChange: (val) => inputElement.value = val, triggerElement, onTriggerElementChange: (val) => triggerElement.value = val, parentElement, resetSearchTermOnSelect, onResetSearchTerm: resetSearchTerm.on, allItems, allGroups, filterSearch, filterState, ignoreFilter, openOnFocus, openOnClick, resetModelValueOnClear }); return (_ctx, _cache) => { return openBlock(), createBlock(unref(PopperRoot_default), null, { default: withCtx(() => [createVNode(unref(ListboxRoot_default), mergeProps({ ref_key: "primitiveElement", ref: primitiveElement }, _ctx.$attrs, { modelValue: unref(modelValue), "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(modelValue) ? modelValue.value = $event : null), style: { pointerEvents: unref(open) ? "auto" : void 0 }, as: _ctx.as, "as-child": _ctx.asChild, dir: unref(dir), multiple: unref(multiple), name: _ctx.name, required: _ctx.required, disabled: unref(disabled), "highlight-on-hover": unref(highlightOnHover), by: props.by, onHighlight: _cache[1] || (_cache[1] = ($event) => emits("highlight", $event)) }), { default: withCtx(() => [renderSlot(_ctx.$slots, "default", { open: unref(open), modelValue: unref(modelValue) })]), _: 3 }, 16, [ "modelValue", "style", "as", "as-child", "dir", "multiple", "name", "required", "disabled", "highlight-on-hover", "by" ])]), _: 3 }); }; } }); //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Combobox/ComboboxAnchor.js var ComboboxAnchor_default = /* @__PURE__ */ defineComponent({ __name: "ComboboxAnchor", props: { reference: { type: null, required: false }, asChild: { type: Boolean, required: false }, as: { type: null, required: false } }, setup(__props) { const { forwardRef } = useForwardExpose(); return (_ctx, _cache) => { return openBlock(), createBlock(unref(PopperAnchor_default), { "as-child": "", reference: _ctx.reference }, { default: withCtx(() => [createVNode(unref(Primitive), mergeProps({ ref: unref(forwardRef), "as-child": _ctx.asChild, as: _ctx.as }, _ctx.$attrs), { default: withCtx(() => [renderSlot(_ctx.$slots, "default")]), _: 3 }, 16, ["as-child", "as"])]), _: 3 }, 8, ["reference"]); }; } }); //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Combobox/ComboboxContentImpl.js var [injectComboboxContentContext, provideComboboxContentContext] = createContext("ComboboxContent"); var ComboboxContentImpl_default = /* @__PURE__ */ defineComponent({ __name: "ComboboxContentImpl", props: { position: { type: String, required: false, default: "inline" }, bodyLock: { type: Boolean, required: false }, hideWhenEmpty: { type: Boolean, required: false }, side: { type: null, required: false }, sideOffset: { type: Number, required: false }, sideFlip: { type: Boolean, required: false }, align: { type: null, required: false }, alignOffset: { type: Number, required: false }, alignFlip: { type: Boolean, required: false }, avoidCollisions: { type: Boolean, required: false }, collisionBoundary: { type: null, required: false }, collisionPadding: { type: [Number, Object], required: false }, arrowPadding: { type: Number, required: false }, hideShiftedArrow: { type: Boolean, required: false }, sticky: { type: String, required: false }, hideWhenDetached: { type: Boolean, required: false }, positionStrategy: { type: String, required: false }, updatePositionStrategy: { type: String, required: false }, disableUpdateOnLayoutShift: { type: Boolean, required: false }, prioritizePosition: { type: Boolean, required: false }, reference: { type: null, required: false }, asChild: { type: Boolean, required: false }, as: { type: null, required: false }, disableOutsidePointerEvents: { type: Boolean, required: false } }, emits: [ "escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside" ], setup(__props, { emit: __emit }) { const props = __props; const emits = __emit; const { position } = toRefs(props); const rootContext = injectComboboxRootContext(); const isEmpty = computed(() => rootContext.ignoreFilter.value ? rootContext.allItems.value.size === 0 : rootContext.filterState.value.count === 0); const { forwardRef, currentElement } = useForwardExpose(); useBodyScrollLock(props.bodyLock); useFocusGuards(); useHideOthers(rootContext.parentElement); const forwardedProps = useForwardProps(computed(() => { if (props.position === "popper") return props; else return {}; }).value); const popperStyle = { "boxSizing": "border-box", "--reka-combobox-content-transform-origin": "var(--reka-popper-transform-origin)", "--reka-combobox-content-available-width": "var(--reka-popper-available-width)", "--reka-combobox-content-available-height": "var(--reka-popper-available-height)", "--reka-combobox-trigger-width": "var(--reka-popper-anchor-width)", "--reka-combobox-trigger-height": "var(--reka-popper-anchor-height)" }; provideComboboxContentContext({ position }); const isInputWithinContent = ref(false); onMounted(() => { if (rootContext.inputElement.value) { isInputWithinContent.value = currentElement.value.contains(rootContext.inputElement.value); if (isInputWithinContent.value) rootContext.inputElement.value.focus(); } }); onUnmounted(() => { const activeElement = getActiveElement(); if (isInputWithinContent.value && (!activeElement || activeElement === document.body)) rootContext.triggerElement.value?.focus(); }); return (_ctx, _cache) => { return openBlock(), createBlock(unref(ListboxContent_default), { "as-child": "" }, { default: withCtx(() => [createVNode(unref(FocusScope_default), { "as-child": "", onMountAutoFocus: _cache[5] || (_cache[5] = withModifiers(() => {}, ["prevent"])), onUnmountAutoFocus: _cache[6] || (_cache[6] = withModifiers(() => {}, ["prevent"])) }, { default: withCtx(() => [createVNode(unref(DismissableLayer_default), { "as-child": "", "disable-outside-pointer-events": _ctx.disableOutsidePointerEvents, onDismiss: _cache[0] || (_cache[0] = ($event) => unref(rootContext).onOpenChange(false)), onFocusOutside: _cache[1] || (_cache[1] = (ev) => { if (unref(rootContext).parentElement.value?.contains(ev.target)) ev.preventDefault(); emits("focusOutside", ev); }), onInteractOutside: _cache[2] || (_cache[2] = ($event) => emits("interactOutside", $event)), onEscapeKeyDown: _cache[3] || (_cache[3] = ($event) => emits("escapeKeyDown", $event)), onPointerDownOutside: _cache[4] || (_cache[4] = (ev) => { if (unref(rootContext).parentElement.value?.contains(ev.target)) ev.preventDefault(); emits("pointerDownOutside", ev); }) }, { default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(unref(position) === "popper" ? unref(PopperContent_default) : unref(Primitive)), mergeProps({ ..._ctx.$attrs, ...unref(forwardedProps) }, { id: unref(rootContext).contentId, ref: unref(forwardRef), "data-state": unref(rootContext).open.value ? "open" : "closed", "data-empty": isEmpty.value ? "" : void 0, style: { display: props.hideWhenEmpty && isEmpty.value ? "none" : "flex", flexDirection: "column", outline: "none", ...unref(position) === "popper" ? popperStyle : {} } }), { default: withCtx(() => [renderSlot(_ctx.$slots, "default")]), _: 3 }, 16, [ "id", "data-state", "data-empty", "style" ]))]), _: 3 }, 8, ["disable-outside-pointer-events"])]), _: 3 })]), _: 3 }); }; } }); //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Combobox/ComboboxContent.js var ComboboxContent_default = /* @__PURE__ */ defineComponent({ __name: "ComboboxContent", props: { forceMount: { type: Boolean, required: false }, position: { type: String, required: false }, bodyLock: { type: Boolean, required: false }, hideWhenEmpty: { type: Boolean, required: false }, side: { type: null, required: false }, sideOffset: { type: Number, required: false }, sideFlip: { type: Boolean, required: false }, align: { type: null, required: false }, alignOffset: { type: Number, required: false }, alignFlip: { type: Boolean, required: false }, avoidCollisions: { type: Boolean, required: false }, collisionBoundary: { type: null, required: false }, collisionPadding: { type: [Number, Object], required: false }, arrowPadding: { type: Number, required: false }, hideShiftedArrow: { type: Boolean, required: false }, sticky: { type: String, required: false }, hideWhenDetached: { type: Boolean, required: false }, positionStrategy: { type: String, required: false }, updatePositionStrategy: { type: String, required: false }, disableUpdateOnLayoutShift: { type: Boolean, required: false }, prioritizePosition: { type: Boolean, required: false }, reference: { type: null, required: false }, asChild: { type: Boolean, required: false }, as: { type: null, required: false }, disableOutsidePointerEvents: { type: Boolean, required: false } }, emits: [ "escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside" ], setup(__props, { emit: __emit }) { const forwarded = useForwardPropsEmits(__props, __emit); const { forwardRef } = useForwardExpose(); const rootContext = injectComboboxRootContext(); rootContext.contentId ||= useId$2(void 0, "reka-combobox-content"); return (_ctx, _cache) => { return openBlock(), createBlock(unref(Presence_default), { present: _ctx.forceMount || unref(rootContext).open.value }, { default: withCtx(() => [createVNode(ComboboxContentImpl_default, mergeProps({ ...unref(forwarded), ..._ctx.$attrs }, { ref: unref(forwardRef) }), { default: withCtx(() => [renderSlot(_ctx.$slots, "default")]), _: 3 }, 16)]), _: 3 }, 8, ["present"]); }; } }); //#endregion //#region ../../node_modules/.pnpm/reka-ui@2.9.2_vue@3.5.31_typescript@5.9.3_/node_modules/reka-ui/dist/Combobox/ComboboxEmpty.js var ComboboxEmpty_default = /* @__PURE__ */ defineComponent({ __name: "ComboboxEmpty", props: { asChild: { type: Boolean, required: false }, as: { type: null, required: false } }, setup(__props) { const props = __props; const rootContext = injectComboboxRootContext(); const is