@drfed/web 0.0.0-stage → 0.1.0-dev.0

package/.output/server/_ssr/objects-D5MVukzB.mjs

@@ -0,0 +1,4316 @@
+import { r as __toESM } from "../_runtime.mjs";
+import { n as require_relay_runtime } from "../_libs/relay-runtime.mjs";
+import { $ as splitProps, D as Show, E as Match, F as createContext, H as createUniqueId, I as createEffect, J as onCleanup, K as mergeProps, L as createMemo, M as children, N as createComponent, P as createComputed, V as createSignal, Y as onMount, _ as ssrElement, b as ssrStyleProperty, g as ssrAttribute, h as ssr, k as Switch, l as Portal, nt as useContext, q as on, u as escape, v as ssrHydrationKey, w as For, y as ssrStyle } from "../_libs/solid-js.mjs";
+import { n as Title } from "./dist-D6rgyh-L.mjs";
+import { a as index_default$1, c as node$1, i as combineStyle, o as layerStack, r as access, t as DATA_TOP_LAYER_ATTR } from "./Toast-Bb1gcxED.mjs";
+import { A as scrollIntoView, C as isMac, D as mergeDefaultProps, E as isWebKit$1, M as visuallyHiddenStyles, S as isFunction, T as isString, a as __export, f as focusWithoutScrolling, g as getFocusableTreeWalker, h as getDocument, i as Polymorphic, l as createGenerateId, n as ButtonRoot, o as callHandler, s as composeEventHandlers, u as createRegisterId, v as getWindow$1, w as isNumber, y as isAppleDevice } from "./JNCCF6MP-BAZlBnvx.mjs";
+import { S as url, b as string, d as object, f as optional, h as pipe, l as nonEmpty, m as picklist, n as check, t as array, y as strictObject } from "../_libs/valibot.mjs";
+import { i as createMutation, o as createPreloadedQuery } from "../_libs/solid-relay+tiny-invariant.mjs";
+import { t as actorLabel } from "./label-DAXzanI9.mjs";
+import { a as FormControlErrorMessage, d as createFormControl, f as createFormControlField, g as useFormControlContext, i as FormControlDescription, l as createControllableBooleanSignal, m as form_module_default, n as FORM_CONTROL_PROP_NAMES, o as FormControlLabel, p as createFormResetListener, r as FormControlContext, s as access$1, t as FORM_CONTROL_FIELD_PROP_NAMES, u as createControllableSignal } from "./form.module-CTvIl1lm.mjs";
+import { a as useLocale, i as createCollator, t as DATA_LIVE_ANNOUNCER_ATTR } from "./LP6E37CW-D2Ih_b_K.mjs";
+import { t as TextField } from "./TSB6MOZK-D06WZb6o.mjs";
+//#region node_modules/.nitro/vite/services/ssr/_build/assets/objects-D5MVukzB.js
+var import_relay_runtime = /* @__PURE__ */ __toESM(require_relay_runtime());
+/**
+* Reactively maps an array by specified key with a callback function - underlying helper for the `<Key>` control flow.
+* @param list input list of values to map
+* @param keyFn key getter, items will be identified by it's value. changing the value is changing the item.
+* @param mapFn reactive function used to create mapped output item. Similar to `Array.prototype.map` but both item and index are signals, that could change over time.
+* @param options a fallback for when the input list is empty or missing
+* @returns mapped input array signal
+* @see https://github.com/solidjs-community/solid-primitives/tree/main/packages/keyed#keyArray
+*/
+function keyArray(items, keyFn, mapFn, options = {}) {
+	{
+		const itemsRef = items();
+		let s = [];
+		if (itemsRef && itemsRef.length) for (let i = 0, len = itemsRef.length; i < len; i++) s.push(mapFn(() => itemsRef[i], () => i));
+		else if (options.fallback) s = [options.fallback()];
+		return () => s;
+	}
+}
+/**
+* creates a list of elements from the input `each` list
+*
+* it receives a map function as its child that receives a **list item signal** and **index signal** and returns a JSX-Element; if the list is empty, an optional fallback is returned:
+* ```tsx
+* <Key each={items()} by={item => item.id} fallback={<div>No items</div>}>
+*   {(item, index) => <div data-index={index()}>{item()}</div>}
+* </Key>
+* ```
+*
+* prop `by` can also be an object key:
+* ```tsx
+* <Key each={items()} by="id">
+* ```
+*
+* @see https://github.com/solidjs-community/solid-primitives/tree/main/packages/keyed#Key
+*/
+function Key(props) {
+	const { by } = props;
+	return createMemo(keyArray(() => props.each, typeof by === "function" ? by : (v) => v[by], props.children, "fallback" in props ? { fallback: () => props.fallback } : void 0));
+}
+/**
+* @generated SignedSource<<e05ec657e33e63011ef458f6e7b387d2>>
+* @lightSyntaxTransform
+*/
+var { ConcreteRequest } = import_relay_runtime?.default?.default?.__esModule ? import_relay_runtime.default.default : import_relay_runtime?.default?.__esModule ? import_relay_runtime.default : import_relay_runtime;
+var node = function() {
+	var v0 = {
+		"defaultValue": null,
+		"kind": "LocalArgument",
+		"name": "actor"
+	}, v1 = {
+		"defaultValue": null,
+		"kind": "LocalArgument",
+		"name": "addressing"
+	}, v2 = {
+		"defaultValue": null,
+		"kind": "LocalArgument",
+		"name": "contentHtml"
+	}, v3 = {
+		"defaultValue": null,
+		"kind": "LocalArgument",
+		"name": "name"
+	}, v4 = {
+		"defaultValue": null,
+		"kind": "LocalArgument",
+		"name": "type"
+	}, v5 = [
+		{
+			"kind": "Variable",
+			"name": "actor",
+			"variableName": "actor"
+		},
+		{
+			"kind": "Variable",
+			"name": "addressing",
+			"variableName": "addressing"
+		},
+		{
+			"kind": "Variable",
+			"name": "contentHtml",
+			"variableName": "contentHtml"
+		},
+		{
+			"kind": "Variable",
+			"name": "name",
+			"variableName": "name"
+		},
+		{
+			"kind": "Variable",
+			"name": "type",
+			"variableName": "type"
+		}
+	], v6 = {
+		"alias": "resultType",
+		"args": null,
+		"kind": "ScalarField",
+		"name": "__typename",
+		"storageKey": null
+	}, v7 = [{
+		"alias": null,
+		"args": null,
+		"kind": "ScalarField",
+		"name": "id",
+		"storageKey": null
+	}], v8 = {
+		"kind": "InlineFragment",
+		"selections": v7,
+		"type": "Object",
+		"abstractKey": null
+	}, v9 = {
+		"kind": "InlineFragment",
+		"selections": [{
+			"alias": null,
+			"args": null,
+			"kind": "ScalarField",
+			"name": "message",
+			"storageKey": null
+		}],
+		"type": "CreateObjectError",
+		"abstractKey": null
+	};
+	return {
+		"fragment": {
+			"argumentDefinitions": [
+				v0,
+				v1,
+				v2,
+				v3,
+				v4
+			],
+			"kind": "Fragment",
+			"metadata": null,
+			"name": "CreateObjectMutation",
+			"selections": [{
+				"alias": null,
+				"args": v5,
+				"concreteType": null,
+				"kind": "LinkedField",
+				"name": "createObject",
+				"plural": false,
+				"selections": [
+					v6,
+					v8,
+					v9
+				],
+				"storageKey": null
+			}],
+			"type": "Mutation",
+			"abstractKey": null
+		},
+		"kind": "Request",
+		"operation": {
+			"argumentDefinitions": [
+				v0,
+				v2,
+				v4,
+				v1,
+				v3
+			],
+			"kind": "Operation",
+			"name": "CreateObjectMutation",
+			"selections": [{
+				"alias": null,
+				"args": v5,
+				"concreteType": null,
+				"kind": "LinkedField",
+				"name": "createObject",
+				"plural": false,
+				"selections": [
+					{
+						"alias": null,
+						"args": null,
+						"kind": "ScalarField",
+						"name": "__typename",
+						"storageKey": null
+					},
+					v6,
+					v8,
+					v9,
+					{
+						"kind": "InlineFragment",
+						"selections": v7,
+						"type": "Node",
+						"abstractKey": "__isNode"
+					}
+				],
+				"storageKey": null
+			}]
+		},
+		"params": {
+			"cacheID": "ea6485713aef56c573e1b58d3c22a203",
+			"id": null,
+			"metadata": {},
+			"name": "CreateObjectMutation",
+			"operationKind": "mutation",
+			"text": "mutation CreateObjectMutation(\n  $actor: ID!\n  $contentHtml: String!\n  $type: ObjectType!\n  $addressing: AddressingInput!\n  $name: String\n) {\n  createObject(actor: $actor, contentHtml: $contentHtml, type: $type, addressing: $addressing, name: $name) {\n    __typename\n    resultType: __typename\n    ... on Object {\n      id\n    }\n    ... on CreateObjectError {\n      message\n    }\n    ... on Node {\n      __isNode: __typename\n      id\n    }\n  }\n}\n"
+		}
+	};
+}();
+node.hash = "4011e826ce87d1ac9818445a6ad503d4";
+function buildNodes(params) {
+	let index = params.startIndex ?? 0;
+	const level = params.startLevel ?? 0;
+	const nodes = [];
+	const getKey = (data) => {
+		if (data == null) return "";
+		const _getKey = params.getKey ?? "key";
+		const dataKey = isString(_getKey) ? data[_getKey] : _getKey(data);
+		return dataKey != null ? String(dataKey) : "";
+	};
+	const getTextValue = (data) => {
+		if (data == null) return "";
+		const _getTextValue = params.getTextValue ?? "textValue";
+		const dataTextValue = isString(_getTextValue) ? data[_getTextValue] : _getTextValue(data);
+		return dataTextValue != null ? String(dataTextValue) : "";
+	};
+	const getDisabled = (data) => {
+		if (data == null) return false;
+		const _getDisabled = params.getDisabled ?? "disabled";
+		return (isString(_getDisabled) ? data[_getDisabled] : _getDisabled(data)) ?? false;
+	};
+	const getSectionChildren = (data) => {
+		if (data == null) return;
+		if (isString(params.getSectionChildren)) return data[params.getSectionChildren];
+		return params.getSectionChildren?.(data);
+	};
+	for (const data of params.dataSource) {
+		if (isString(data) || isNumber(data)) {
+			nodes.push({
+				type: "item",
+				rawValue: data,
+				key: String(data),
+				textValue: String(data),
+				disabled: getDisabled(data),
+				level,
+				index
+			});
+			index++;
+			continue;
+		}
+		if (getSectionChildren(data) != null) {
+			nodes.push({
+				type: "section",
+				rawValue: data,
+				key: "",
+				textValue: "",
+				disabled: false,
+				level,
+				index
+			});
+			index++;
+			const sectionChildren = getSectionChildren(data) ?? [];
+			if (sectionChildren.length > 0) {
+				const childNodes = buildNodes({
+					dataSource: sectionChildren,
+					getKey: params.getKey,
+					getTextValue: params.getTextValue,
+					getDisabled: params.getDisabled,
+					getSectionChildren: params.getSectionChildren,
+					startIndex: index,
+					startLevel: level + 1
+				});
+				nodes.push(...childNodes);
+				index += childNodes.length;
+			}
+		} else {
+			nodes.push({
+				type: "item",
+				rawValue: data,
+				key: getKey(data),
+				textValue: getTextValue(data),
+				disabled: getDisabled(data),
+				level,
+				index
+			});
+			index++;
+		}
+	}
+	return nodes;
+}
+function createCollection(props, deps = []) {
+	return createMemo(() => {
+		const nodes = buildNodes({
+			dataSource: access$1(props.dataSource),
+			getKey: access$1(props.getKey),
+			getTextValue: access$1(props.getTextValue),
+			getDisabled: access$1(props.getDisabled),
+			getSectionChildren: access$1(props.getSectionChildren)
+		});
+		for (let i = 0; i < deps.length; i++) deps[i]();
+		return props.factory(nodes);
+	});
+}
+var Selection = class _Selection extends Set {
+	anchorKey;
+	currentKey;
+	constructor(keys, anchorKey, currentKey) {
+		super(keys);
+		if (keys instanceof _Selection) {
+			this.anchorKey = anchorKey || keys.anchorKey;
+			this.currentKey = currentKey || keys.currentKey;
+		} else {
+			this.anchorKey = anchorKey;
+			this.currentKey = currentKey;
+		}
+	}
+};
+function createControllableSelectionSignal(props) {
+	const [_value, setValue] = createControllableSignal(props);
+	const value = () => _value() ?? new Selection();
+	return [value, setValue];
+}
+function isNonContiguousSelectionModifier(e) {
+	return isAppleDevice() ? e.altKey : e.ctrlKey;
+}
+function isCtrlKeyPressed(e) {
+	if (isMac()) return e.metaKey;
+	return e.ctrlKey;
+}
+function convertSelection(selection) {
+	return new Selection(selection);
+}
+function isSameSelection(setA, setB) {
+	if (setA.size !== setB.size) return false;
+	for (const item of setA) if (!setB.has(item)) return false;
+	return true;
+}
+function createMultipleSelectionState(props) {
+	const mergedProps = mergeDefaultProps({
+		selectionMode: "none",
+		selectionBehavior: "toggle"
+	}, props);
+	const [isFocused, setFocused] = createSignal(false);
+	const [focusedKey, setFocusedKey] = createSignal();
+	const [selectedKeys, _setSelectedKeys] = createControllableSelectionSignal({
+		value: createMemo(() => {
+			const selection = access$1(mergedProps.selectedKeys);
+			if (selection != null) return convertSelection(selection);
+			return selection;
+		}),
+		defaultValue: createMemo(() => {
+			const defaultSelection = access$1(mergedProps.defaultSelectedKeys);
+			if (defaultSelection != null) return convertSelection(defaultSelection);
+			return new Selection();
+		}),
+		onChange: (value) => mergedProps.onSelectionChange?.(value)
+	});
+	const [selectionBehavior, setSelectionBehavior] = createSignal(access$1(mergedProps.selectionBehavior));
+	const selectionMode = () => access$1(mergedProps.selectionMode);
+	const disallowEmptySelection = () => access$1(mergedProps.disallowEmptySelection) ?? false;
+	const setSelectedKeys = (keys) => {
+		if (access$1(mergedProps.allowDuplicateSelectionEvents) || !isSameSelection(keys, selectedKeys())) _setSelectedKeys(keys);
+	};
+	createEffect(() => {
+		const selection = selectedKeys();
+		if (access$1(mergedProps.selectionBehavior) === "replace" && selectionBehavior() === "toggle" && typeof selection === "object" && selection.size === 0) setSelectionBehavior("replace");
+	});
+	createEffect(() => {
+		setSelectionBehavior(access$1(mergedProps.selectionBehavior) ?? "toggle");
+	});
+	return {
+		selectionMode,
+		disallowEmptySelection,
+		selectionBehavior,
+		setSelectionBehavior,
+		isFocused,
+		setFocused,
+		focusedKey,
+		setFocusedKey,
+		selectedKeys,
+		setSelectedKeys
+	};
+}
+function createTypeSelect(props) {
+	const [search, setSearch] = createSignal("");
+	const [timeoutId, setTimeoutId] = createSignal(-1);
+	const onKeyDown = (e) => {
+		if (access$1(props.isDisabled)) return;
+		const delegate = access$1(props.keyboardDelegate);
+		const manager = access$1(props.selectionManager);
+		if (!delegate.getKeyForSearch) return;
+		const character = getStringForKey(e.key);
+		if (!character || e.ctrlKey || e.metaKey) return;
+		if (character === " " && search().trim().length > 0) {
+			e.preventDefault();
+			e.stopPropagation();
+		}
+		let newSearch = setSearch((prev) => prev + character);
+		let key = delegate.getKeyForSearch(newSearch, manager.focusedKey()) ?? delegate.getKeyForSearch(newSearch);
+		if (key == null && isAllSameLetter(newSearch)) {
+			newSearch = newSearch[0];
+			key = delegate.getKeyForSearch(newSearch, manager.focusedKey()) ?? delegate.getKeyForSearch(newSearch);
+		}
+		if (key != null) {
+			manager.setFocusedKey(key);
+			props.onTypeSelect?.(key);
+		}
+		clearTimeout(timeoutId());
+		setTimeoutId(window.setTimeout(() => setSearch(""), 500));
+	};
+	return { typeSelectHandlers: { onKeyDown } };
+}
+function getStringForKey(key) {
+	if (key.length === 1 || !/^[A-Z]/i.test(key)) return key;
+	return "";
+}
+function isAllSameLetter(search) {
+	return search.split("").every((letter) => letter === search[0]);
+}
+function createSelectableCollection(props, ref, scrollRef) {
+	const mergedProps = mergeProps({ selectOnFocus: () => access$1(props.selectionManager).selectionBehavior() === "replace" }, props);
+	const finalScrollRef = () => scrollRef?.() ?? ref();
+	const { direction } = useLocale();
+	let scrollPos = {
+		top: 0,
+		left: 0
+	};
+	const { typeSelectHandlers } = createTypeSelect({
+		isDisabled: () => access$1(mergedProps.disallowTypeAhead),
+		keyboardDelegate: () => access$1(mergedProps.keyboardDelegate),
+		selectionManager: () => access$1(mergedProps.selectionManager)
+	});
+	const orientation = () => access$1(mergedProps.orientation) ?? "vertical";
+	const onKeyDown = (e) => {
+		callHandler(e, typeSelectHandlers.onKeyDown);
+		if (e.altKey && e.key === "Tab") e.preventDefault();
+		const refEl = ref();
+		if (!refEl?.contains(e.target)) return;
+		const manager = access$1(mergedProps.selectionManager);
+		const selectOnFocus = access$1(mergedProps.selectOnFocus);
+		const navigateToKey = (key) => {
+			if (key != null) {
+				manager.setFocusedKey(key);
+				if (e.shiftKey && manager.selectionMode() === "multiple") manager.extendSelection(key);
+				else if (selectOnFocus && !isNonContiguousSelectionModifier(e)) manager.replaceSelection(key);
+			}
+		};
+		const delegate = access$1(mergedProps.keyboardDelegate);
+		const shouldFocusWrap = access$1(mergedProps.shouldFocusWrap);
+		const focusedKey = manager.focusedKey();
+		switch (e.key) {
+			case orientation() === "vertical" ? "ArrowDown" : "ArrowRight":
+				if (delegate.getKeyBelow) {
+					e.preventDefault();
+					let nextKey;
+					if (focusedKey != null) nextKey = delegate.getKeyBelow(focusedKey);
+					else nextKey = delegate.getFirstKey?.();
+					if (nextKey == null && shouldFocusWrap) nextKey = delegate.getFirstKey?.(focusedKey);
+					navigateToKey(nextKey);
+				}
+				break;
+			case orientation() === "vertical" ? "ArrowUp" : "ArrowLeft":
+				if (delegate.getKeyAbove) {
+					e.preventDefault();
+					let nextKey;
+					if (focusedKey != null) nextKey = delegate.getKeyAbove(focusedKey);
+					else nextKey = delegate.getLastKey?.();
+					if (nextKey == null && shouldFocusWrap) nextKey = delegate.getLastKey?.(focusedKey);
+					navigateToKey(nextKey);
+				}
+				break;
+			case orientation() === "vertical" ? "ArrowLeft" : "ArrowUp":
+				if (delegate.getKeyLeftOf) {
+					e.preventDefault();
+					const isRTL = direction() === "rtl";
+					let nextKey;
+					if (focusedKey != null) nextKey = delegate.getKeyLeftOf(focusedKey);
+					else nextKey = isRTL ? delegate.getFirstKey?.() : delegate.getLastKey?.();
+					navigateToKey(nextKey);
+				}
+				break;
+			case orientation() === "vertical" ? "ArrowRight" : "ArrowDown":
+				if (delegate.getKeyRightOf) {
+					e.preventDefault();
+					const isRTL = direction() === "rtl";
+					let nextKey;
+					if (focusedKey != null) nextKey = delegate.getKeyRightOf(focusedKey);
+					else nextKey = isRTL ? delegate.getLastKey?.() : delegate.getFirstKey?.();
+					navigateToKey(nextKey);
+				}
+				break;
+			case "Home":
+				if (delegate.getFirstKey) {
+					e.preventDefault();
+					const firstKey = delegate.getFirstKey(focusedKey, isCtrlKeyPressed(e));
+					if (firstKey != null) {
+						manager.setFocusedKey(firstKey);
+						if (isCtrlKeyPressed(e) && e.shiftKey && manager.selectionMode() === "multiple") manager.extendSelection(firstKey);
+						else if (selectOnFocus) manager.replaceSelection(firstKey);
+					}
+				}
+				break;
+			case "End":
+				if (delegate.getLastKey) {
+					e.preventDefault();
+					const lastKey = delegate.getLastKey(focusedKey, isCtrlKeyPressed(e));
+					if (lastKey != null) {
+						manager.setFocusedKey(lastKey);
+						if (isCtrlKeyPressed(e) && e.shiftKey && manager.selectionMode() === "multiple") manager.extendSelection(lastKey);
+						else if (selectOnFocus) manager.replaceSelection(lastKey);
+					}
+				}
+				break;
+			case "PageDown":
+				if (delegate.getKeyPageBelow && focusedKey != null) {
+					e.preventDefault();
+					navigateToKey(delegate.getKeyPageBelow(focusedKey));
+				}
+				break;
+			case "PageUp":
+				if (delegate.getKeyPageAbove && focusedKey != null) {
+					e.preventDefault();
+					navigateToKey(delegate.getKeyPageAbove(focusedKey));
+				}
+				break;
+			case "a":
+				if (isCtrlKeyPressed(e) && manager.selectionMode() === "multiple" && access$1(mergedProps.disallowSelectAll) !== true) {
+					e.preventDefault();
+					manager.selectAll();
+				}
+				break;
+			case "Escape":
+				if (!e.defaultPrevented && !access$1(mergedProps.disallowEmptySelection)) {
+					e.preventDefault();
+					manager.clearSelection();
+				}
+				break;
+			case "Tab": if (!access$1(mergedProps.allowsTabNavigation)) {
+				if (e.shiftKey) refEl.focus();
+				else {
+					const walker = getFocusableTreeWalker(refEl, { tabbable: true });
+					let next;
+					let last;
+					do {
+						last = walker.lastChild();
+						if (last) next = last;
+					} while (last);
+					if (next && !next.contains(document.activeElement)) focusWithoutScrolling(next);
+				}
+				break;
+			}
+		}
+	};
+	const onFocusIn = (e) => {
+		const manager = access$1(mergedProps.selectionManager);
+		const delegate = access$1(mergedProps.keyboardDelegate);
+		const selectOnFocus = access$1(mergedProps.selectOnFocus);
+		if (manager.isFocused()) {
+			if (!e.currentTarget.contains(e.target)) manager.setFocused(false);
+			return;
+		}
+		if (!e.currentTarget.contains(e.target)) return;
+		manager.setFocused(true);
+		if (manager.focusedKey() == null) {
+			const navigateToFirstKey = (key) => {
+				if (key == null) return;
+				manager.setFocusedKey(key);
+				if (selectOnFocus) manager.replaceSelection(key);
+			};
+			const relatedTarget = e.relatedTarget;
+			if (relatedTarget && e.currentTarget.compareDocumentPosition(relatedTarget) & Node.DOCUMENT_POSITION_FOLLOWING) navigateToFirstKey(manager.lastSelectedKey() ?? delegate.getLastKey?.());
+			else navigateToFirstKey(manager.firstSelectedKey() ?? delegate.getFirstKey?.());
+		} else if (!access$1(mergedProps.isVirtualized)) {
+			const scrollEl = finalScrollRef();
+			if (scrollEl) {
+				scrollEl.scrollTop = scrollPos.top;
+				scrollEl.scrollLeft = scrollPos.left;
+				const element = scrollEl.querySelector(`[data-key="${manager.focusedKey()}"]`);
+				if (element) {
+					focusWithoutScrolling(element);
+					scrollIntoView(scrollEl, element);
+				}
+			}
+		}
+	};
+	const onFocusOut = (e) => {
+		const manager = access$1(mergedProps.selectionManager);
+		if (!e.currentTarget.contains(e.relatedTarget)) manager.setFocused(false);
+	};
+	const onMouseDown = (e) => {
+		if (finalScrollRef() === e.target) e.preventDefault();
+	};
+	const tryAutoFocus = () => {
+		const autoFocus = access$1(mergedProps.autoFocus);
+		if (!autoFocus) return;
+		const manager = access$1(mergedProps.selectionManager);
+		const delegate = access$1(mergedProps.keyboardDelegate);
+		let focusedKey;
+		if (autoFocus === "first") focusedKey = delegate.getFirstKey?.();
+		if (autoFocus === "last") focusedKey = delegate.getLastKey?.();
+		const selectedKeys = manager.selectedKeys();
+		if (selectedKeys.size) focusedKey = selectedKeys.values().next().value;
+		manager.setFocused(true);
+		manager.setFocusedKey(focusedKey);
+		const refEl = ref();
+		if (refEl && focusedKey == null && !access$1(mergedProps.shouldUseVirtualFocus)) focusWithoutScrolling(refEl);
+	};
+	onMount(() => {
+		if (mergedProps.deferAutoFocus) setTimeout(tryAutoFocus, 0);
+		else tryAutoFocus();
+	});
+	createEffect(on([
+		finalScrollRef,
+		() => access$1(mergedProps.isVirtualized),
+		() => access$1(mergedProps.selectionManager).focusedKey()
+	], (newValue) => {
+		const [scrollEl, isVirtualized, focusedKey] = newValue;
+		if (isVirtualized) focusedKey && mergedProps.scrollToKey?.(focusedKey);
+		else if (focusedKey && scrollEl) {
+			const element = scrollEl.querySelector(`[data-key="${focusedKey}"]`);
+			if (element) scrollIntoView(scrollEl, element);
+		}
+	}));
+	return {
+		tabIndex: createMemo(() => {
+			if (access$1(mergedProps.shouldUseVirtualFocus)) return;
+			return access$1(mergedProps.selectionManager).focusedKey() == null ? 0 : -1;
+		}),
+		onKeyDown,
+		onMouseDown,
+		onFocusIn,
+		onFocusOut
+	};
+}
+function createSelectableItem(props, ref) {
+	const manager = () => access$1(props.selectionManager);
+	const key = () => access$1(props.key);
+	const shouldUseVirtualFocus = () => access$1(props.shouldUseVirtualFocus);
+	const onSelect = (e) => {
+		if (manager().selectionMode() === "none") return;
+		if (manager().selectionMode() === "single") if (manager().isSelected(key()) && !manager().disallowEmptySelection()) manager().toggleSelection(key());
+		else manager().replaceSelection(key());
+		else if (e?.shiftKey) manager().extendSelection(key());
+		else if (manager().selectionBehavior() === "toggle" || isCtrlKeyPressed(e) || "pointerType" in e && e.pointerType === "touch") manager().toggleSelection(key());
+		else manager().replaceSelection(key());
+	};
+	const isSelected = () => manager().isSelected(key());
+	const isDisabled = () => access$1(props.disabled) || manager().isDisabled(key());
+	const allowsSelection = () => !isDisabled() && manager().canSelectItem(key());
+	let pointerDownType = null;
+	const onPointerDown = (e) => {
+		if (!allowsSelection()) return;
+		pointerDownType = e.pointerType;
+		if (e.pointerType === "mouse" && e.button === 0 && !access$1(props.shouldSelectOnPressUp)) onSelect(e);
+	};
+	const onPointerUp = (e) => {
+		if (!allowsSelection()) return;
+		if (e.pointerType === "mouse" && e.button === 0 && access$1(props.shouldSelectOnPressUp) && access$1(props.allowsDifferentPressOrigin)) onSelect(e);
+	};
+	const onClick = (e) => {
+		if (!allowsSelection()) return;
+		if (access$1(props.shouldSelectOnPressUp) && !access$1(props.allowsDifferentPressOrigin) || pointerDownType !== "mouse") onSelect(e);
+	};
+	const onKeyDown = (e) => {
+		if (!allowsSelection() || !["Enter", " "].includes(e.key)) return;
+		if (isNonContiguousSelectionModifier(e)) manager().toggleSelection(key());
+		else onSelect(e);
+	};
+	const onMouseDown = (e) => {
+		if (isDisabled()) e.preventDefault();
+	};
+	const onFocus = (e) => {
+		const refEl = ref();
+		if (shouldUseVirtualFocus() || isDisabled() || !refEl) return;
+		if (e.target === refEl) manager().setFocusedKey(key());
+	};
+	const tabIndex = createMemo(() => {
+		if (shouldUseVirtualFocus() || isDisabled()) return;
+		return key() === manager().focusedKey() ? 0 : -1;
+	});
+	const dataKey = createMemo(() => {
+		return access$1(props.virtualized) ? void 0 : key();
+	});
+	createEffect(on([
+		ref,
+		key,
+		shouldUseVirtualFocus,
+		() => manager().focusedKey(),
+		() => manager().isFocused()
+	], ([refEl, key2, shouldUseVirtualFocus2, focusedKey, isFocused]) => {
+		if (refEl && key2 === focusedKey && isFocused && !shouldUseVirtualFocus2 && document.activeElement !== refEl) if (props.focus) props.focus();
+		else focusWithoutScrolling(refEl);
+	}));
+	return {
+		isSelected,
+		isDisabled,
+		allowsSelection,
+		tabIndex,
+		dataKey,
+		onPointerDown,
+		onPointerUp,
+		onClick,
+		onKeyDown,
+		onMouseDown,
+		onFocus
+	};
+}
+var SelectionManager = class {
+	collection;
+	state;
+	constructor(collection, state) {
+		this.collection = collection;
+		this.state = state;
+	}
+	/** The type of selection that is allowed in the collection. */
+	selectionMode() {
+		return this.state.selectionMode();
+	}
+	/** Whether the collection allows empty selection. */
+	disallowEmptySelection() {
+		return this.state.disallowEmptySelection();
+	}
+	/** The selection behavior for the collection. */
+	selectionBehavior() {
+		return this.state.selectionBehavior();
+	}
+	/** Sets the selection behavior for the collection. */
+	setSelectionBehavior(selectionBehavior) {
+		this.state.setSelectionBehavior(selectionBehavior);
+	}
+	/** Whether the collection is currently focused. */
+	isFocused() {
+		return this.state.isFocused();
+	}
+	/** Sets whether the collection is focused. */
+	setFocused(isFocused) {
+		this.state.setFocused(isFocused);
+	}
+	/** The current focused key in the collection. */
+	focusedKey() {
+		return this.state.focusedKey();
+	}
+	/** Sets the focused key. */
+	setFocusedKey(key) {
+		if (key == null || this.collection().getItem(key)) this.state.setFocusedKey(key);
+	}
+	/** The currently selected keys in the collection. */
+	selectedKeys() {
+		return this.state.selectedKeys();
+	}
+	/** Returns whether a key is selected. */
+	isSelected(key) {
+		if (this.state.selectionMode() === "none") return false;
+		const retrievedKey = this.getKey(key);
+		if (retrievedKey == null) return false;
+		return this.state.selectedKeys().has(retrievedKey);
+	}
+	/** Whether the selection is empty. */
+	isEmpty() {
+		return this.state.selectedKeys().size === 0;
+	}
+	/** Whether all items in the collection are selected. */
+	isSelectAll() {
+		if (this.isEmpty()) return false;
+		const selectedKeys = this.state.selectedKeys();
+		return this.getAllSelectableKeys().every((k) => selectedKeys.has(k));
+	}
+	firstSelectedKey() {
+		let first;
+		for (const key of this.state.selectedKeys()) {
+			const item = this.collection().getItem(key);
+			const isItemBeforeFirst = item?.index != null && first?.index != null && item.index < first.index;
+			if (!first || isItemBeforeFirst) first = item;
+		}
+		return first?.key;
+	}
+	lastSelectedKey() {
+		let last;
+		for (const key of this.state.selectedKeys()) {
+			const item = this.collection().getItem(key);
+			const isItemAfterLast = item?.index != null && last?.index != null && item.index > last.index;
+			if (!last || isItemAfterLast) last = item;
+		}
+		return last?.key;
+	}
+	/** Extends the selection to the given key. */
+	extendSelection(toKey) {
+		if (this.selectionMode() === "none") return;
+		if (this.selectionMode() === "single") {
+			this.replaceSelection(toKey);
+			return;
+		}
+		const retrievedToKey = this.getKey(toKey);
+		if (retrievedToKey == null) return;
+		const selectedKeys = this.state.selectedKeys();
+		const anchorKey = selectedKeys.anchorKey || retrievedToKey;
+		const selection = new Selection(selectedKeys, anchorKey, retrievedToKey);
+		for (const key of this.getKeyRange(anchorKey, selectedKeys.currentKey || retrievedToKey)) selection.delete(key);
+		for (const key of this.getKeyRange(retrievedToKey, anchorKey)) if (this.canSelectItem(key)) selection.add(key);
+		this.state.setSelectedKeys(selection);
+	}
+	getKeyRange(from, to) {
+		const fromItem = this.collection().getItem(from);
+		const toItem = this.collection().getItem(to);
+		if (fromItem && toItem) {
+			if (fromItem.index != null && toItem.index != null && fromItem.index <= toItem.index) return this.getKeyRangeInternal(from, to);
+			return this.getKeyRangeInternal(to, from);
+		}
+		return [];
+	}
+	getKeyRangeInternal(from, to) {
+		const keys = [];
+		let key = from;
+		while (key != null) {
+			const item = this.collection().getItem(key);
+			if (item && item.type === "item") keys.push(key);
+			if (key === to) return keys;
+			key = this.collection().getKeyAfter(key);
+		}
+		return [];
+	}
+	getKey(key) {
+		const item = this.collection().getItem(key);
+		if (!item) return key;
+		if (!item || item.type !== "item") return null;
+		return item.key;
+	}
+	/** Toggles whether the given key is selected. */
+	toggleSelection(key) {
+		if (this.selectionMode() === "none") return;
+		if (this.selectionMode() === "single" && !this.isSelected(key)) {
+			this.replaceSelection(key);
+			return;
+		}
+		const retrievedKey = this.getKey(key);
+		if (retrievedKey == null) return;
+		const keys = new Selection(this.state.selectedKeys());
+		if (keys.has(retrievedKey)) keys.delete(retrievedKey);
+		else if (this.canSelectItem(retrievedKey)) {
+			keys.add(retrievedKey);
+			keys.anchorKey = retrievedKey;
+			keys.currentKey = retrievedKey;
+		}
+		if (this.disallowEmptySelection() && keys.size === 0) return;
+		this.state.setSelectedKeys(keys);
+	}
+	/** Replaces the selection with only the given key. */
+	replaceSelection(key) {
+		if (this.selectionMode() === "none") return;
+		const retrievedKey = this.getKey(key);
+		if (retrievedKey == null) return;
+		const selection = this.canSelectItem(retrievedKey) ? new Selection([retrievedKey], retrievedKey, retrievedKey) : new Selection();
+		this.state.setSelectedKeys(selection);
+	}
+	/** Replaces the selection with the given keys. */
+	setSelectedKeys(keys) {
+		if (this.selectionMode() === "none") return;
+		const selection = new Selection();
+		for (const key of keys) {
+			const retrievedKey = this.getKey(key);
+			if (retrievedKey != null) {
+				selection.add(retrievedKey);
+				if (this.selectionMode() === "single") break;
+			}
+		}
+		this.state.setSelectedKeys(selection);
+	}
+	/** Selects all items in the collection. */
+	selectAll() {
+		if (this.selectionMode() === "multiple") this.state.setSelectedKeys(new Set(this.getAllSelectableKeys()));
+	}
+	/**
+	* Removes all keys from the selection.
+	*/
+	clearSelection() {
+		const selectedKeys = this.state.selectedKeys();
+		if (!this.disallowEmptySelection() && selectedKeys.size > 0) this.state.setSelectedKeys(new Selection());
+	}
+	/**
+	* Toggles between select all and an empty selection.
+	*/
+	toggleSelectAll() {
+		if (this.isSelectAll()) this.clearSelection();
+		else this.selectAll();
+	}
+	select(key, e) {
+		if (this.selectionMode() === "none") return;
+		if (this.selectionMode() === "single") if (this.isSelected(key) && !this.disallowEmptySelection()) this.toggleSelection(key);
+		else this.replaceSelection(key);
+		else if (this.selectionBehavior() === "toggle" || e && e.pointerType === "touch") this.toggleSelection(key);
+		else this.replaceSelection(key);
+	}
+	/** Returns whether the current selection is equal to the given selection. */
+	isSelectionEqual(selection) {
+		if (selection === this.state.selectedKeys()) return true;
+		const selectedKeys = this.selectedKeys();
+		if (selection.size !== selectedKeys.size) return false;
+		for (const key of selection) if (!selectedKeys.has(key)) return false;
+		for (const key of selectedKeys) if (!selection.has(key)) return false;
+		return true;
+	}
+	canSelectItem(key) {
+		if (this.state.selectionMode() === "none") return false;
+		const item = this.collection().getItem(key);
+		return item != null && !item.disabled;
+	}
+	isDisabled(key) {
+		const item = this.collection().getItem(key);
+		return !item || item.disabled;
+	}
+	getAllSelectableKeys() {
+		const keys = [];
+		const addKeys = (key) => {
+			while (key != null) {
+				if (this.canSelectItem(key)) {
+					const item = this.collection().getItem(key);
+					if (!item) continue;
+					if (item.type === "item") keys.push(key);
+				}
+				key = this.collection().getKeyAfter(key);
+			}
+		};
+		addKeys(this.collection().getFirstKey());
+		return keys;
+	}
+};
+var ListCollection = class {
+	keyMap = /* @__PURE__ */ new Map();
+	iterable;
+	firstKey;
+	lastKey;
+	constructor(nodes) {
+		this.iterable = nodes;
+		for (const node of nodes) this.keyMap.set(node.key, node);
+		if (this.keyMap.size === 0) return;
+		let last;
+		let index = 0;
+		for (const [key, node] of this.keyMap) {
+			if (last) {
+				last.nextKey = key;
+				node.prevKey = last.key;
+			} else {
+				this.firstKey = key;
+				node.prevKey = void 0;
+			}
+			if (node.type === "item") node.index = index++;
+			last = node;
+			last.nextKey = void 0;
+		}
+		this.lastKey = last.key;
+	}
+	*[Symbol.iterator]() {
+		yield* this.iterable;
+	}
+	getSize() {
+		return this.keyMap.size;
+	}
+	getKeys() {
+		return this.keyMap.keys();
+	}
+	getKeyBefore(key) {
+		return this.keyMap.get(key)?.prevKey;
+	}
+	getKeyAfter(key) {
+		return this.keyMap.get(key)?.nextKey;
+	}
+	getFirstKey() {
+		return this.firstKey;
+	}
+	getLastKey() {
+		return this.lastKey;
+	}
+	getItem(key) {
+		return this.keyMap.get(key);
+	}
+	at(idx) {
+		const keys = [...this.getKeys()];
+		return this.getItem(keys[idx]);
+	}
+};
+function createListState(props) {
+	const selectionState = createMultipleSelectionState(props);
+	const factory = (nodes) => {
+		return props.filter ? new ListCollection(props.filter(nodes)) : new ListCollection(nodes);
+	};
+	const collection = createCollection({
+		dataSource: () => access$1(props.dataSource),
+		getKey: () => access$1(props.getKey),
+		getTextValue: () => access$1(props.getTextValue),
+		getDisabled: () => access$1(props.getDisabled),
+		getSectionChildren: () => access$1(props.getSectionChildren),
+		factory
+	}, [() => props.filter]);
+	const selectionManager = new SelectionManager(collection, selectionState);
+	createComputed(() => {
+		const focusedKey = selectionState.focusedKey();
+		if (focusedKey != null && !collection().getItem(focusedKey)) selectionState.setFocusedKey(void 0);
+	});
+	return {
+		collection,
+		selectionManager: () => selectionManager
+	};
+}
+var _tmpl$$2 = [
+	"<option",
+	"",
+	">",
+	"</option>"
+];
+var _tmpl$2$1 = "<option></option>";
+var _tmpl$3$1 = [
+	"<div",
+	" style=\"",
+	"\" aria-hidden=\"true\"><input type=\"text\"",
+	" style=\"",
+	"\"",
+	"",
+	">",
+	"</div>"
+];
+function HiddenSelectBase(props) {
+	const [local, others] = splitProps(props, [
+		"ref",
+		"onChange",
+		"collection",
+		"selectionManager",
+		"isOpen",
+		"isMultiple",
+		"isVirtualized",
+		"focusTrigger"
+	]);
+	const formControlContext = useFormControlContext();
+	const [isInternalChangeEvent, setIsInternalChangeEvent] = createSignal(false);
+	const renderOption = (key) => {
+		const item = local.collection.getItem(key);
+		return createComponent(Show, {
+			get when() {
+				return item?.type === "item";
+			},
+			get children() {
+				return ssr(_tmpl$$2, ssrHydrationKey() + ssrAttribute("value", escape(key, true), false), ssrAttribute("selected", local.selectionManager.isSelected(key), true), escape(item?.textValue));
+			}
+		});
+	};
+	createEffect(on(() => local.selectionManager.selectedKeys(), (keys, prevKeys) => {
+		if (prevKeys && isSameSelection(keys, prevKeys)) return;
+		setIsInternalChangeEvent(true);
+	}, { defer: true }));
+	return ssr(_tmpl$3$1, ssrHydrationKey(), ssrStyle(visuallyHiddenStyles), ssrAttribute("tabindex", local.selectionManager.isFocused() || local.isOpen ? -1 : 0, false), ssrStyleProperty("font-size:", "16px"), ssrAttribute("required", formControlContext.isRequired(), true), ssrAttribute("disabled", formControlContext.isDisabled(), true) + ssrAttribute("readonly", escape(formControlContext.isReadOnly(), true), false), ssrElement("select", mergeProps({
+		tabIndex: -1,
+		get multiple() {
+			return local.isMultiple;
+		},
+		get name() {
+			return formControlContext.name();
+		},
+		get required() {
+			return formControlContext.isRequired();
+		},
+		get disabled() {
+			return formControlContext.isDisabled();
+		},
+		get size() {
+			return local.collection.getSize();
+		},
+		get value() {
+			return local.selectionManager.firstSelectedKey() ?? "";
+		}
+	}, others), () => [
+		ssr(_tmpl$2$1),
+		"<!--$-->",
+		escape(createComponent(Show, {
+			get when() {
+				return local.isVirtualized;
+			},
+			get fallback() {
+				return createComponent(For, {
+					get each() {
+						return [...local.collection.getKeys()];
+					},
+					children: renderOption
+				});
+			},
+			get children() {
+				return createComponent(For, {
+					get each() {
+						return [...local.selectionManager.selectedKeys()];
+					},
+					children: renderOption
+				});
+			}
+		})),
+		"<!--/-->"
+	], false));
+}
+var cache = /* @__PURE__ */ new WeakMap();
+function getItemCount(collection) {
+	let count = cache.get(collection);
+	if (count != null) return count;
+	count = 0;
+	for (const item of collection) if (item.type === "item") count++;
+	cache.set(collection, count);
+	return count;
+}
+var ListKeyboardDelegate = class {
+	collection;
+	ref;
+	collator;
+	constructor(collection, ref, collator) {
+		this.collection = collection;
+		this.ref = ref;
+		this.collator = collator;
+	}
+	getKeyBelow(key) {
+		let keyAfter = this.collection().getKeyAfter(key);
+		while (keyAfter != null) {
+			const item = this.collection().getItem(keyAfter);
+			if (item && item.type === "item" && !item.disabled) return keyAfter;
+			keyAfter = this.collection().getKeyAfter(keyAfter);
+		}
+	}
+	getKeyAbove(key) {
+		let keyBefore = this.collection().getKeyBefore(key);
+		while (keyBefore != null) {
+			const item = this.collection().getItem(keyBefore);
+			if (item && item.type === "item" && !item.disabled) return keyBefore;
+			keyBefore = this.collection().getKeyBefore(keyBefore);
+		}
+	}
+	getFirstKey() {
+		let key = this.collection().getFirstKey();
+		while (key != null) {
+			const item = this.collection().getItem(key);
+			if (item && item.type === "item" && !item.disabled) return key;
+			key = this.collection().getKeyAfter(key);
+		}
+	}
+	getLastKey() {
+		let key = this.collection().getLastKey();
+		while (key != null) {
+			const item = this.collection().getItem(key);
+			if (item && item.type === "item" && !item.disabled) return key;
+			key = this.collection().getKeyBefore(key);
+		}
+	}
+	getItem(key) {
+		return this.ref?.()?.querySelector(`[data-key="${key}"]`) ?? null;
+	}
+	getKeyPageAbove(key) {
+		const menu = this.ref?.();
+		let item = this.getItem(key);
+		if (!menu || !item) return;
+		const pageY = Math.max(0, item.offsetTop + item.offsetHeight - menu.offsetHeight);
+		let keyAbove = key;
+		while (keyAbove && item && item.offsetTop > pageY) {
+			keyAbove = this.getKeyAbove(keyAbove);
+			item = keyAbove != null ? this.getItem(keyAbove) : null;
+		}
+		return keyAbove;
+	}
+	getKeyPageBelow(key) {
+		const menu = this.ref?.();
+		let item = this.getItem(key);
+		if (!menu || !item) return;
+		const pageY = Math.min(menu.scrollHeight, item.offsetTop - item.offsetHeight + menu.offsetHeight);
+		let keyBelow = key;
+		while (keyBelow && item && item.offsetTop < pageY) {
+			keyBelow = this.getKeyBelow(keyBelow);
+			item = keyBelow != null ? this.getItem(keyBelow) : null;
+		}
+		return keyBelow;
+	}
+	getKeyForSearch(search, fromKey) {
+		const collator = this.collator?.();
+		if (!collator) return;
+		let key = fromKey != null ? this.getKeyBelow(fromKey) : this.getFirstKey();
+		while (key != null) {
+			const item = this.collection().getItem(key);
+			if (item) {
+				const substring = item.textValue.slice(0, search.length);
+				if (item.textValue && collator.compare(substring, search) === 0) return key;
+			}
+			key = this.getKeyBelow(key);
+		}
+	}
+};
+function createSelectableList(props, ref, scrollRef) {
+	const collator = createCollator({
+		usage: "search",
+		sensitivity: "base"
+	});
+	return createSelectableCollection({
+		selectionManager: () => access$1(props.selectionManager),
+		keyboardDelegate: createMemo(() => {
+			const keyboardDelegate = access$1(props.keyboardDelegate);
+			if (keyboardDelegate) return keyboardDelegate;
+			return new ListKeyboardDelegate(props.collection, ref, collator);
+		}),
+		autoFocus: () => access$1(props.autoFocus),
+		deferAutoFocus: () => access$1(props.deferAutoFocus),
+		shouldFocusWrap: () => access$1(props.shouldFocusWrap),
+		disallowEmptySelection: () => access$1(props.disallowEmptySelection),
+		selectOnFocus: () => access$1(props.selectOnFocus),
+		disallowTypeAhead: () => access$1(props.disallowTypeAhead),
+		shouldUseVirtualFocus: () => access$1(props.shouldUseVirtualFocus),
+		allowsTabNavigation: () => access$1(props.allowsTabNavigation),
+		isVirtualized: () => access$1(props.isVirtualized),
+		scrollToKey: (key) => access$1(props.scrollToKey)?.(key),
+		orientation: () => access$1(props.orientation)
+	}, ref, scrollRef);
+}
+__export({}, {
+	Item: () => ListboxItem,
+	ItemDescription: () => ListboxItemDescription,
+	ItemIndicator: () => ListboxItemIndicator,
+	ItemLabel: () => ListboxItemLabel,
+	Listbox: () => Listbox,
+	Root: () => ListboxRoot,
+	Section: () => ListboxSection,
+	useListboxContext: () => useListboxContext
+});
+var ListboxContext = createContext();
+function useListboxContext() {
+	const context = useContext(ListboxContext);
+	if (context === void 0) throw new Error("[kobalte]: `useListboxContext` must be used within a `Listbox` component");
+	return context;
+}
+var ListboxItemContext = createContext();
+function useListboxItemContext() {
+	const context = useContext(ListboxItemContext);
+	if (context === void 0) throw new Error("[kobalte]: `useListboxItemContext` must be used within a `Listbox.Item` component");
+	return context;
+}
+function ListboxItem(props) {
+	let ref;
+	const listBoxContext = useListboxContext();
+	const [local, others] = splitProps(mergeDefaultProps({ id: `${listBoxContext.generateId("item")}-${createUniqueId()}` }, props), [
+		"ref",
+		"item",
+		"aria-label",
+		"aria-labelledby",
+		"aria-describedby",
+		"onPointerMove",
+		"onPointerDown",
+		"onPointerUp",
+		"onClick",
+		"onKeyDown",
+		"onMouseDown",
+		"onFocus"
+	]);
+	const [labelId, setLabelId] = createSignal();
+	const [descriptionId, setDescriptionId] = createSignal();
+	const selectionManager = () => listBoxContext.listState().selectionManager();
+	const isHighlighted = () => selectionManager().focusedKey() === local.item.key;
+	const selectableItem = createSelectableItem({
+		key: () => local.item.key,
+		selectionManager,
+		shouldSelectOnPressUp: listBoxContext.shouldSelectOnPressUp,
+		allowsDifferentPressOrigin: () => {
+			return listBoxContext.shouldSelectOnPressUp() && listBoxContext.shouldFocusOnHover();
+		},
+		shouldUseVirtualFocus: listBoxContext.shouldUseVirtualFocus,
+		disabled: () => local.item.disabled
+	}, () => ref);
+	const ariaSelected = () => {
+		if (selectionManager().selectionMode() === "none") return;
+		return selectableItem.isSelected();
+	};
+	const isNotSafariMacOS = createMemo(() => !(isMac() && isWebKit$1()));
+	const ariaLabel = () => isNotSafariMacOS() ? local["aria-label"] : void 0;
+	const ariaLabelledBy = () => isNotSafariMacOS() ? labelId() : void 0;
+	const ariaDescribedBy = () => isNotSafariMacOS() ? descriptionId() : void 0;
+	const ariaPosInSet = () => {
+		if (!listBoxContext.isVirtualized()) return;
+		const index = listBoxContext.listState().collection().getItem(local.item.key)?.index;
+		return index != null ? index + 1 : void 0;
+	};
+	const ariaSetSize = () => {
+		if (!listBoxContext.isVirtualized()) return;
+		return getItemCount(listBoxContext.listState().collection());
+	};
+	const onPointerMove = (e) => {
+		callHandler(e, local.onPointerMove);
+		if (e.pointerType !== "mouse") return;
+		if (!selectableItem.isDisabled() && listBoxContext.shouldFocusOnHover()) {
+			focusWithoutScrolling(e.currentTarget);
+			selectionManager().setFocused(true);
+			selectionManager().setFocusedKey(local.item.key);
+		}
+	};
+	const dataset = createMemo(() => ({
+		"data-disabled": selectableItem.isDisabled() ? "" : void 0,
+		"data-selected": selectableItem.isSelected() ? "" : void 0,
+		"data-highlighted": isHighlighted() ? "" : void 0
+	}));
+	const context = {
+		isSelected: selectableItem.isSelected,
+		dataset,
+		generateId: createGenerateId(() => others.id),
+		registerLabelId: createRegisterId(setLabelId),
+		registerDescriptionId: createRegisterId(setDescriptionId)
+	};
+	return createComponent(ListboxItemContext.Provider, {
+		value: context,
+		get children() {
+			return createComponent(Polymorphic, mergeProps({
+				as: "li",
+				role: "option",
+				get tabIndex() {
+					return selectableItem.tabIndex();
+				},
+				get ["aria-disabled"]() {
+					return selectableItem.isDisabled();
+				},
+				get ["aria-selected"]() {
+					return ariaSelected();
+				},
+				get ["aria-label"]() {
+					return ariaLabel();
+				},
+				get ["aria-labelledby"]() {
+					return ariaLabelledBy();
+				},
+				get ["aria-describedby"]() {
+					return ariaDescribedBy();
+				},
+				get ["aria-posinset"]() {
+					return ariaPosInSet();
+				},
+				get ["aria-setsize"]() {
+					return ariaSetSize();
+				},
+				get ["data-key"]() {
+					return selectableItem.dataKey();
+				},
+				get onPointerDown() {
+					return composeEventHandlers([local.onPointerDown, selectableItem.onPointerDown]);
+				},
+				get onPointerUp() {
+					return composeEventHandlers([local.onPointerUp, selectableItem.onPointerUp]);
+				},
+				get onClick() {
+					return composeEventHandlers([local.onClick, selectableItem.onClick]);
+				},
+				get onKeyDown() {
+					return composeEventHandlers([local.onKeyDown, selectableItem.onKeyDown]);
+				},
+				get onMouseDown() {
+					return composeEventHandlers([local.onMouseDown, selectableItem.onMouseDown]);
+				},
+				get onFocus() {
+					return composeEventHandlers([local.onFocus, selectableItem.onFocus]);
+				},
+				onPointerMove
+			}, dataset, others));
+		}
+	});
+}
+function ListboxItemDescription(props) {
+	const context = useListboxItemContext();
+	const mergedProps = mergeDefaultProps({ id: context.generateId("description") }, props);
+	createEffect(() => onCleanup(context.registerDescriptionId(mergedProps.id)));
+	return createComponent(Polymorphic, mergeProps({ as: "div" }, () => context.dataset(), mergedProps));
+}
+function ListboxItemIndicator(props) {
+	const context = useListboxItemContext();
+	const [local, others] = splitProps(mergeDefaultProps({ id: context.generateId("indicator") }, props), ["forceMount"]);
+	return createComponent(Show, {
+		get when() {
+			return local.forceMount || context.isSelected();
+		},
+		get children() {
+			return createComponent(Polymorphic, mergeProps({
+				as: "div",
+				"aria-hidden": "true"
+			}, () => context.dataset(), others));
+		}
+	});
+}
+function ListboxItemLabel(props) {
+	const context = useListboxItemContext();
+	const mergedProps = mergeDefaultProps({ id: context.generateId("label") }, props);
+	createEffect(() => onCleanup(context.registerLabelId(mergedProps.id)));
+	return createComponent(Polymorphic, mergeProps({ as: "div" }, () => context.dataset(), mergedProps));
+}
+function ListboxRoot(props) {
+	let ref;
+	const mergedProps = mergeDefaultProps({
+		id: `listbox-${createUniqueId()}`,
+		selectionMode: "single",
+		virtualized: false
+	}, props);
+	const [local, others] = splitProps(mergedProps, [
+		"ref",
+		"children",
+		"renderItem",
+		"renderSection",
+		"value",
+		"defaultValue",
+		"onChange",
+		"options",
+		"optionValue",
+		"optionTextValue",
+		"optionDisabled",
+		"optionGroupChildren",
+		"state",
+		"keyboardDelegate",
+		"autoFocus",
+		"selectionMode",
+		"shouldFocusWrap",
+		"shouldUseVirtualFocus",
+		"shouldSelectOnPressUp",
+		"shouldFocusOnHover",
+		"allowDuplicateSelectionEvents",
+		"disallowEmptySelection",
+		"selectionBehavior",
+		"selectOnFocus",
+		"disallowTypeAhead",
+		"allowsTabNavigation",
+		"virtualized",
+		"scrollToItem",
+		"scrollRef",
+		"onKeyDown",
+		"onMouseDown",
+		"onFocusIn",
+		"onFocusOut"
+	]);
+	const listState = createMemo(() => {
+		if (local.state) return local.state;
+		return createListState({
+			selectedKeys: () => local.value,
+			defaultSelectedKeys: () => local.defaultValue,
+			onSelectionChange: local.onChange,
+			allowDuplicateSelectionEvents: () => access$1(local.allowDuplicateSelectionEvents),
+			disallowEmptySelection: () => access$1(local.disallowEmptySelection),
+			selectionBehavior: () => access$1(local.selectionBehavior),
+			selectionMode: () => access$1(local.selectionMode),
+			dataSource: () => local.options ?? [],
+			getKey: () => local.optionValue,
+			getTextValue: () => local.optionTextValue,
+			getDisabled: () => local.optionDisabled,
+			getSectionChildren: () => local.optionGroupChildren
+		});
+	});
+	const selectableList = createSelectableList({
+		selectionManager: () => listState().selectionManager(),
+		collection: () => listState().collection(),
+		autoFocus: () => access$1(local.autoFocus),
+		shouldFocusWrap: () => access$1(local.shouldFocusWrap),
+		keyboardDelegate: () => local.keyboardDelegate,
+		disallowEmptySelection: () => access$1(local.disallowEmptySelection),
+		selectOnFocus: () => access$1(local.selectOnFocus),
+		disallowTypeAhead: () => access$1(local.disallowTypeAhead),
+		shouldUseVirtualFocus: () => access$1(local.shouldUseVirtualFocus),
+		allowsTabNavigation: () => access$1(local.allowsTabNavigation),
+		isVirtualized: () => local.virtualized,
+		scrollToKey: () => local.scrollToItem
+	}, () => ref, () => local.scrollRef?.());
+	const context = {
+		listState,
+		generateId: createGenerateId(() => others.id),
+		shouldUseVirtualFocus: () => mergedProps.shouldUseVirtualFocus,
+		shouldSelectOnPressUp: () => mergedProps.shouldSelectOnPressUp,
+		shouldFocusOnHover: () => mergedProps.shouldFocusOnHover,
+		isVirtualized: () => local.virtualized
+	};
+	return createComponent(ListboxContext.Provider, {
+		value: context,
+		get children() {
+			return createComponent(Polymorphic, mergeProps({
+				as: "ul",
+				role: "listbox",
+				get tabIndex() {
+					return selectableList.tabIndex();
+				},
+				get ["aria-multiselectable"]() {
+					return listState().selectionManager().selectionMode() === "multiple" ? true : void 0;
+				},
+				get onKeyDown() {
+					return composeEventHandlers([local.onKeyDown, selectableList.onKeyDown]);
+				},
+				get onMouseDown() {
+					return composeEventHandlers([local.onMouseDown, selectableList.onMouseDown]);
+				},
+				get onFocusIn() {
+					return composeEventHandlers([local.onFocusIn, selectableList.onFocusIn]);
+				},
+				get onFocusOut() {
+					return composeEventHandlers([local.onFocusOut, selectableList.onFocusOut]);
+				}
+			}, others, { get children() {
+				return createComponent(Show, {
+					get when() {
+						return !local.virtualized;
+					},
+					get fallback() {
+						return local.children?.(listState().collection);
+					},
+					get children() {
+						return createComponent(Key, {
+							get each() {
+								return [...listState().collection()];
+							},
+							by: "key",
+							children: (item) => createComponent(Switch, { get children() {
+								return [createComponent(Match, {
+									get when() {
+										return item().type === "section";
+									},
+									get children() {
+										return local.renderSection?.(item());
+									}
+								}), createComponent(Match, {
+									get when() {
+										return item().type === "item";
+									},
+									get children() {
+										return local.renderItem?.(item());
+									}
+								})];
+							} })
+						});
+					}
+				});
+			} }));
+		}
+	});
+}
+function ListboxSection(props) {
+	return createComponent(Polymorphic, mergeProps({
+		as: "li",
+		role: "presentation"
+	}, props));
+}
+var Listbox = Object.assign(ListboxRoot, {
+	Item: ListboxItem,
+	ItemDescription: ListboxItemDescription,
+	ItemIndicator: ListboxItemIndicator,
+	ItemLabel: ListboxItemLabel,
+	Section: ListboxSection
+});
+/**
+* Custom positioning reference element.
+* @see https://floating-ui.com/docs/virtual-elements
+*/
+var sides = [
+	"top",
+	"right",
+	"bottom",
+	"left"
+];
+var min = Math.min;
+var max = Math.max;
+var round = Math.round;
+var floor = Math.floor;
+var createCoords = (v) => ({
+	x: v,
+	y: v
+});
+var oppositeSideMap = {
+	left: "right",
+	right: "left",
+	bottom: "top",
+	top: "bottom"
+};
+function clamp(start, value, end) {
+	return max(start, min(value, end));
+}
+function evaluate(value, param) {
+	return typeof value === "function" ? value(param) : value;
+}
+function getSide(placement) {
+	return placement.split("-")[0];
+}
+function getAlignment(placement) {
+	return placement.split("-")[1];
+}
+function getOppositeAxis(axis) {
+	return axis === "x" ? "y" : "x";
+}
+function getAxisLength(axis) {
+	return axis === "y" ? "height" : "width";
+}
+function getSideAxis(placement) {
+	const firstChar = placement[0];
+	return firstChar === "t" || firstChar === "b" ? "y" : "x";
+}
+function getAlignmentAxis(placement) {
+	return getOppositeAxis(getSideAxis(placement));
+}
+function getAlignmentSides(placement, rects, rtl) {
+	if (rtl === void 0) rtl = false;
+	const alignment = getAlignment(placement);
+	const alignmentAxis = getAlignmentAxis(placement);
+	const length = getAxisLength(alignmentAxis);
+	let mainAlignmentSide = alignmentAxis === "x" ? alignment === (rtl ? "end" : "start") ? "right" : "left" : alignment === "start" ? "bottom" : "top";
+	if (rects.reference[length] > rects.floating[length]) mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
+	return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
+}
+function getExpandedPlacements(placement) {
+	const oppositePlacement = getOppositePlacement(placement);
+	return [
+		getOppositeAlignmentPlacement(placement),
+		oppositePlacement,
+		getOppositeAlignmentPlacement(oppositePlacement)
+	];
+}
+function getOppositeAlignmentPlacement(placement) {
+	return placement.includes("start") ? placement.replace("start", "end") : placement.replace("end", "start");
+}
+var lrPlacement = ["left", "right"];
+var rlPlacement = ["right", "left"];
+var tbPlacement = ["top", "bottom"];
+var btPlacement = ["bottom", "top"];
+function getSideList(side, isStart, rtl) {
+	switch (side) {
+		case "top":
+		case "bottom":
+			if (rtl) return isStart ? rlPlacement : lrPlacement;
+			return isStart ? lrPlacement : rlPlacement;
+		case "left":
+		case "right": return isStart ? tbPlacement : btPlacement;
+		default: return [];
+	}
+}
+function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
+	const alignment = getAlignment(placement);
+	let list = getSideList(getSide(placement), direction === "start", rtl);
+	if (alignment) {
+		list = list.map((side) => side + "-" + alignment);
+		if (flipAlignment) list = list.concat(list.map(getOppositeAlignmentPlacement));
+	}
+	return list;
+}
+function getOppositePlacement(placement) {
+	const side = getSide(placement);
+	return oppositeSideMap[side] + placement.slice(side.length);
+}
+function expandPaddingObject(padding) {
+	var _padding$top, _padding$right, _padding$bottom, _padding$left;
+	return {
+		top: (_padding$top = padding.top) != null ? _padding$top : 0,
+		right: (_padding$right = padding.right) != null ? _padding$right : 0,
+		bottom: (_padding$bottom = padding.bottom) != null ? _padding$bottom : 0,
+		left: (_padding$left = padding.left) != null ? _padding$left : 0
+	};
+}
+function getPaddingObject(padding) {
+	return typeof padding !== "number" ? expandPaddingObject(padding) : {
+		top: padding,
+		right: padding,
+		bottom: padding,
+		left: padding
+	};
+}
+function rectToClientRect(rect) {
+	const { x, y, width, height } = rect;
+	return {
+		width,
+		height,
+		top: y,
+		left: x,
+		right: x + width,
+		bottom: y + height,
+		x,
+		y
+	};
+}
+function computeCoordsFromPlacement(_ref, placement, rtl) {
+	let { reference, floating } = _ref;
+	const sideAxis = getSideAxis(placement);
+	const alignmentAxis = getAlignmentAxis(placement);
+	const alignLength = getAxisLength(alignmentAxis);
+	const side = getSide(placement);
+	const isVertical = sideAxis === "y";
+	const commonX = reference.x + reference.width / 2 - floating.width / 2;
+	const commonY = reference.y + reference.height / 2 - floating.height / 2;
+	const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
+	let coords;
+	switch (side) {
+		case "top":
+			coords = {
+				x: commonX,
+				y: reference.y - floating.height
+			};
+			break;
+		case "bottom":
+			coords = {
+				x: commonX,
+				y: reference.y + reference.height
+			};
+			break;
+		case "right":
+			coords = {
+				x: reference.x + reference.width,
+				y: commonY
+			};
+			break;
+		case "left":
+			coords = {
+				x: reference.x - floating.width,
+				y: commonY
+			};
+			break;
+		default: coords = {
+			x: reference.x,
+			y: reference.y
+		};
+	}
+	const alignment = getAlignment(placement);
+	if (alignment) coords[alignmentAxis] += commonAlign * (alignment === "end" ? 1 : -1) * (rtl && isVertical ? -1 : 1);
+	return coords;
+}
+/**
+* Resolves with an object of overflow side offsets that determine how much the
+* element is overflowing a given clipping boundary on each side.
+* - positive = overflowing the boundary by that number of pixels
+* - negative = how many pixels left before it will overflow
+* - 0 = lies flush with the boundary
+* @see https://floating-ui.com/docs/detectOverflow
+*/
+async function detectOverflow(state, options) {
+	var _await$platform$isEle;
+	if (options === void 0) options = {};
+	const { x, y, platform, rects, elements, strategy } = state;
+	const { boundary = "clippingAncestors", rootBoundary = "viewport", elementContext = "floating", altBoundary = false, padding = 0 } = evaluate(options, state);
+	const paddingObject = getPaddingObject(padding);
+	const element = elements[altBoundary ? elementContext === "floating" ? "reference" : "floating" : elementContext];
+	const clippingClientRect = rectToClientRect(await platform.getClippingRect({
+		element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating)),
+		boundary,
+		rootBoundary,
+		strategy
+	}));
+	const rect = elementContext === "floating" ? {
+		x,
+		y,
+		width: rects.floating.width,
+		height: rects.floating.height
+	} : rects.reference;
+	const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
+	const offsetScale = await (platform.isElement == null ? void 0 : platform.isElement(offsetParent)) && await (platform.getScale == null ? void 0 : platform.getScale(offsetParent)) || {
+		x: 1,
+		y: 1
+	};
+	const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
+		elements,
+		rect,
+		offsetParent,
+		strategy
+	}) : rect);
+	return {
+		top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
+		bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
+		left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
+		right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
+	};
+}
+var MAX_RESET_COUNT = 50;
+/**
+* Computes the `x` and `y` coordinates that will place the floating element
+* next to a given reference element.
+*
+* This export does not have any `platform` interface logic. You will need to
+* write one for the platform you are using Floating UI with.
+*/
+var computePosition$1 = async (reference, floating, config) => {
+	const { placement = "bottom", strategy = "absolute", middleware = [], platform } = config;
+	const platformWithDetectOverflow = platform.detectOverflow ? platform : {
+		...platform,
+		detectOverflow
+	};
+	const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
+	let rects = await platform.getElementRects({
+		reference,
+		floating,
+		strategy
+	});
+	let { x, y } = computeCoordsFromPlacement(rects, placement, rtl);
+	let statefulPlacement = placement;
+	let resetCount = 0;
+	const middlewareData = {};
+	for (let i = 0; i < middleware.length; i++) {
+		const currentMiddleware = middleware[i];
+		if (!currentMiddleware) continue;
+		const { name, fn } = currentMiddleware;
+		const { x: nextX, y: nextY, data, reset } = await fn({
+			x,
+			y,
+			initialPlacement: placement,
+			placement: statefulPlacement,
+			strategy,
+			middlewareData,
+			rects,
+			platform: platformWithDetectOverflow,
+			elements: {
+				reference,
+				floating
+			}
+		});
+		x = nextX != null ? nextX : x;
+		y = nextY != null ? nextY : y;
+		middlewareData[name] = {
+			...middlewareData[name],
+			...data
+		};
+		if (reset && resetCount < MAX_RESET_COUNT) {
+			resetCount++;
+			if (typeof reset === "object") {
+				if (reset.placement) statefulPlacement = reset.placement;
+				if (reset.rects) rects = reset.rects === true ? await platform.getElementRects({
+					reference,
+					floating,
+					strategy
+				}) : reset.rects;
+				({x, y} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
+			}
+			i = -1;
+		}
+	}
+	return {
+		x,
+		y,
+		placement: statefulPlacement,
+		strategy,
+		middlewareData
+	};
+};
+/**
+* Provides data to position an inner element of the floating element so that it
+* appears centered to the reference element.
+* @see https://floating-ui.com/docs/arrow
+*/
+var arrow$1 = (options) => ({
+	name: "arrow",
+	options,
+	async fn(state) {
+		const { x, y, placement, rects, platform, elements, middlewareData } = state;
+		const { element, padding = 0 } = evaluate(options, state) || {};
+		if (element == null) return {};
+		const paddingObject = getPaddingObject(padding);
+		const coords = {
+			x,
+			y
+		};
+		const axis = getAlignmentAxis(placement);
+		const length = getAxisLength(axis);
+		const arrowDimensions = await platform.getDimensions(element);
+		const isYAxis = axis === "y";
+		const minProp = isYAxis ? "top" : "left";
+		const maxProp = isYAxis ? "bottom" : "right";
+		const clientProp = isYAxis ? "clientHeight" : "clientWidth";
+		const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
+		const startDiff = coords[axis] - rects.reference[axis];
+		const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
+		let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
+		if (!clientSize || !await (platform.isElement == null ? void 0 : platform.isElement(arrowOffsetParent))) clientSize = elements.floating[clientProp] || rects.floating[length];
+		const centerToReference = endDiff / 2 - startDiff / 2;
+		const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
+		const minPadding = min(paddingObject[minProp], largestPossiblePadding);
+		const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
+		const max = clientSize - arrowDimensions[length] - maxPadding;
+		const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
+		const offset = clamp(minPadding, center, max);
+		const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < minPadding ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
+		const alignmentOffset = shouldAddOffset ? center < minPadding ? center - minPadding : center - max : 0;
+		return {
+			[axis]: coords[axis] + alignmentOffset,
+			data: {
+				[axis]: offset,
+				centerOffset: center - offset - alignmentOffset,
+				...shouldAddOffset && { alignmentOffset }
+			},
+			reset: shouldAddOffset
+		};
+	}
+});
+/**
+* Optimizes the visibility of the floating element by flipping the `placement`
+* in order to keep it in view when the preferred placement(s) will overflow the
+* clipping boundary. Alternative to `autoPlacement`.
+* @see https://floating-ui.com/docs/flip
+*/
+var flip$1 = function(options) {
+	if (options === void 0) options = {};
+	return {
+		name: "flip",
+		options,
+		async fn(state) {
+			var _middlewareData$arrow, _middlewareData$flip;
+			const { placement, middlewareData, rects, initialPlacement, platform, elements } = state;
+			const { mainAxis: checkMainAxis = true, crossAxis: checkCrossAxis = true, fallbackPlacements: specifiedFallbackPlacements, fallbackStrategy = "bestFit", fallbackAxisSideDirection = "none", flipAlignment = true, ...detectOverflowOptions } = evaluate(options, state);
+			if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) return {};
+			const side = getSide(placement);
+			const initialSideAxis = getSideAxis(initialPlacement);
+			const isBasePlacement = getSide(initialPlacement) === initialPlacement;
+			const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
+			const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
+			const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== "none";
+			if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
+			const placements = [initialPlacement, ...fallbackPlacements];
+			const overflow = await platform.detectOverflow(state, detectOverflowOptions);
+			const overflows = [];
+			let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
+			if (checkMainAxis) overflows.push(overflow[side]);
+			if (checkCrossAxis) {
+				const sides = getAlignmentSides(placement, rects, rtl);
+				overflows.push(overflow[sides[0]], overflow[sides[1]]);
+			}
+			overflowsData = [...overflowsData, {
+				placement,
+				overflows
+			}];
+			if (!overflows.every((side) => side <= 0)) {
+				var _middlewareData$flip2, _overflowsData$filter;
+				const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
+				const nextPlacement = placements[nextIndex];
+				if (nextPlacement) {
+					if (!(checkCrossAxis === "alignment" ? initialSideAxis !== getSideAxis(nextPlacement) : false) || overflowsData.every((d) => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) return {
+						data: {
+							index: nextIndex,
+							overflows: overflowsData
+						},
+						reset: { placement: nextPlacement }
+					};
+				}
+				let resetPlacement = (_overflowsData$filter = overflowsData.filter((d) => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
+				if (!resetPlacement) switch (fallbackStrategy) {
+					case "bestFit": {
+						var _overflowsData$filter2;
+						const placement = (_overflowsData$filter2 = overflowsData.filter((d) => {
+							if (hasFallbackAxisSideDirection) {
+								const currentSideAxis = getSideAxis(d.placement);
+								return currentSideAxis === initialSideAxis || currentSideAxis === "y";
+							}
+							return true;
+						}).map((d) => [d.placement, d.overflows.filter((overflow) => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$filter2[0];
+						if (placement) resetPlacement = placement;
+						break;
+					}
+					case "initialPlacement":
+						resetPlacement = initialPlacement;
+						break;
+				}
+				if (placement !== resetPlacement) return { reset: { placement: resetPlacement } };
+			}
+			return {};
+		}
+	};
+};
+function getSideOffsets(overflow, rect) {
+	return {
+		top: overflow.top - rect.height,
+		right: overflow.right - rect.width,
+		bottom: overflow.bottom - rect.height,
+		left: overflow.left - rect.width
+	};
+}
+function isAnySideFullyClipped(overflow) {
+	return sides.some((side) => overflow[side] >= 0);
+}
+/**
+* Provides data to hide the floating element in applicable situations, such as
+* when it is not in the same clipping context as the reference element.
+* @see https://floating-ui.com/docs/hide
+*/
+var hide$1 = function(options) {
+	if (options === void 0) options = {};
+	return {
+		name: "hide",
+		options,
+		async fn(state) {
+			const { rects, platform } = state;
+			const { strategy = "referenceHidden", ...detectOverflowOptions } = evaluate(options, state);
+			switch (strategy) {
+				case "referenceHidden": {
+					const offsets = getSideOffsets(await platform.detectOverflow(state, {
+						...detectOverflowOptions,
+						elementContext: "reference"
+					}), rects.reference);
+					return { data: {
+						referenceHiddenOffsets: offsets,
+						referenceHidden: isAnySideFullyClipped(offsets)
+					} };
+				}
+				case "escaped": {
+					const offsets = getSideOffsets(await platform.detectOverflow(state, {
+						...detectOverflowOptions,
+						altBoundary: true
+					}), rects.floating);
+					return { data: {
+						escapedOffsets: offsets,
+						escaped: isAnySideFullyClipped(offsets)
+					} };
+				}
+				default: return {};
+			}
+		}
+	};
+};
+var originSides = /*#__PURE__*/ new Set(["left", "top"]);
+async function convertValueToCoords(state, options) {
+	const { placement, platform, elements } = state;
+	const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
+	const side = getSide(placement);
+	const alignment = getAlignment(placement);
+	const isVertical = getSideAxis(placement) === "y";
+	const mainAxisMulti = originSides.has(side) ? -1 : 1;
+	const crossAxisMulti = rtl && isVertical ? -1 : 1;
+	const rawValue = evaluate(options, state);
+	let { mainAxis, crossAxis, alignmentAxis } = typeof rawValue === "number" ? {
+		mainAxis: rawValue,
+		crossAxis: 0,
+		alignmentAxis: null
+	} : {
+		mainAxis: rawValue.mainAxis || 0,
+		crossAxis: rawValue.crossAxis || 0,
+		alignmentAxis: rawValue.alignmentAxis
+	};
+	if (alignment && typeof alignmentAxis === "number") crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis;
+	return isVertical ? {
+		x: crossAxis * crossAxisMulti,
+		y: mainAxis * mainAxisMulti
+	} : {
+		x: mainAxis * mainAxisMulti,
+		y: crossAxis * crossAxisMulti
+	};
+}
+/**
+* Modifies the placement by translating the floating element along the
+* specified axes.
+* A number (shorthand for `mainAxis` or distance), or an axes configuration
+* object may be passed.
+* @see https://floating-ui.com/docs/offset
+*/
+var offset$1 = function(options) {
+	if (options === void 0) options = 0;
+	return {
+		name: "offset",
+		options,
+		async fn(state) {
+			var _middlewareData$offse, _middlewareData$arrow;
+			const { x, y, placement, middlewareData } = state;
+			const diffCoords = await convertValueToCoords(state, options);
+			if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) return {};
+			return {
+				x: x + diffCoords.x,
+				y: y + diffCoords.y,
+				data: {
+					...diffCoords,
+					placement
+				}
+			};
+		}
+	};
+};
+/**
+* Optimizes the visibility of the floating element by shifting it in order to
+* keep it in view when it will overflow the clipping boundary.
+* @see https://floating-ui.com/docs/shift
+*/
+var shift$1 = function(options) {
+	if (options === void 0) options = {};
+	return {
+		name: "shift",
+		options,
+		async fn(state) {
+			const { x, y, placement, platform } = state;
+			const { mainAxis: checkMainAxis = true, crossAxis: checkCrossAxis = false, limiter = { fn: (_ref) => {
+				let { x, y } = _ref;
+				return {
+					x,
+					y
+				};
+			} }, ...detectOverflowOptions } = evaluate(options, state);
+			const coords = {
+				x,
+				y
+			};
+			const overflow = await platform.detectOverflow(state, detectOverflowOptions);
+			const crossAxis = getSideAxis(placement);
+			const mainAxis = getOppositeAxis(crossAxis);
+			let mainAxisCoord = coords[mainAxis];
+			let crossAxisCoord = coords[crossAxis];
+			const clampCoord = (axis, coord) => clamp(coord + overflow[axis === "y" ? "top" : "left"], coord, coord - overflow[axis === "y" ? "bottom" : "right"]);
+			if (checkMainAxis) mainAxisCoord = clampCoord(mainAxis, mainAxisCoord);
+			if (checkCrossAxis) crossAxisCoord = clampCoord(crossAxis, crossAxisCoord);
+			const limitedCoords = limiter.fn({
+				...state,
+				[mainAxis]: mainAxisCoord,
+				[crossAxis]: crossAxisCoord
+			});
+			return {
+				...limitedCoords,
+				data: {
+					x: limitedCoords.x - x,
+					y: limitedCoords.y - y,
+					enabled: {
+						[mainAxis]: checkMainAxis,
+						[crossAxis]: checkCrossAxis
+					}
+				}
+			};
+		}
+	};
+};
+/**
+* Provides data that allows you to change the size of the floating element —
+* for instance, prevent it from overflowing the clipping boundary or match the
+* width of the reference element.
+* @see https://floating-ui.com/docs/size
+*/
+var size$1 = function(options) {
+	if (options === void 0) options = {};
+	return {
+		name: "size",
+		options,
+		async fn(state) {
+			const { placement, rects, platform, elements } = state;
+			const { apply = () => {}, ...detectOverflowOptions } = evaluate(options, state);
+			const overflow = await platform.detectOverflow(state, detectOverflowOptions);
+			const side = getSide(placement);
+			const alignment = getAlignment(placement);
+			const isYAxis = getSideAxis(placement) === "y";
+			const { width, height } = rects.floating;
+			let heightSide;
+			let widthSide;
+			if (side === "top" || side === "bottom") {
+				heightSide = side;
+				widthSide = alignment === (await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)) ? "start" : "end") ? "left" : "right";
+			} else {
+				widthSide = side;
+				heightSide = alignment === "end" ? "top" : "bottom";
+			}
+			const maximumClippingHeight = height - overflow.top - overflow.bottom;
+			const maximumClippingWidth = width - overflow.left - overflow.right;
+			const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
+			const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
+			const shiftData = state.middlewareData.shift;
+			const noShift = !shiftData;
+			let availableHeight = overflowAvailableHeight;
+			let availableWidth = overflowAvailableWidth;
+			if (shiftData != null && shiftData.enabled.x) availableWidth = maximumClippingWidth;
+			if (shiftData != null && shiftData.enabled.y) availableHeight = maximumClippingHeight;
+			if (noShift && !alignment) if (isYAxis) availableWidth = width - 2 * max(overflow.left, overflow.right);
+			else availableHeight = height - 2 * max(overflow.top, overflow.bottom);
+			await apply({
+				...state,
+				availableWidth,
+				availableHeight
+			});
+			const nextDimensions = await platform.getDimensions(elements.floating);
+			if (width !== nextDimensions.width || height !== nextDimensions.height) return { reset: { rects: true } };
+			return {};
+		}
+	};
+};
+function hasWindow() {
+	return typeof window !== "undefined";
+}
+function getNodeName(node) {
+	if (isNode(node)) return (node.nodeName || "").toLowerCase();
+	return "#document";
+}
+function getWindow(node) {
+	var _node$ownerDocument;
+	return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
+}
+function getDocumentElement(node) {
+	var _ref;
+	return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
+}
+function isNode(value) {
+	if (!hasWindow()) return false;
+	return value instanceof Node || value instanceof getWindow(value).Node;
+}
+function isElement(value) {
+	if (!hasWindow()) return false;
+	return value instanceof Element || value instanceof getWindow(value).Element;
+}
+function isHTMLElement(value) {
+	if (!hasWindow()) return false;
+	return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
+}
+function isShadowRoot(value) {
+	if (!hasWindow() || typeof ShadowRoot === "undefined") return false;
+	return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
+}
+function isOverflowElement(element) {
+	const { overflow, overflowX, overflowY, display } = getComputedStyle$1(element);
+	return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== "inline" && display !== "contents";
+}
+function isTableElement(element) {
+	return /^(table|td|th)$/.test(getNodeName(element));
+}
+function isTopLayer(element) {
+	try {
+		if (element.matches(":popover-open")) return true;
+	} catch (_e) {}
+	try {
+		return element.matches(":modal");
+	} catch (_e) {
+		return false;
+	}
+}
+var willChangeRe = /transform|translate|scale|rotate|perspective|filter/;
+var containRe = /paint|layout|strict|content/;
+var isNotNone = (value) => !!value && value !== "none";
+var isWebKitValue;
+function isContainingBlock(elementOrCss) {
+	const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
+	return isNotNone(css.transform) || isNotNone(css.translate) || isNotNone(css.scale) || isNotNone(css.rotate) || isNotNone(css.perspective) || !isWebKit() && (isNotNone(css.backdropFilter) || isNotNone(css.filter)) || willChangeRe.test(css.willChange || "") || containRe.test(css.contain || "");
+}
+function getContainingBlock(element) {
+	let currentNode = getParentNode(element);
+	while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
+		if (isContainingBlock(currentNode)) return currentNode;
+		else if (isTopLayer(currentNode)) return null;
+		currentNode = getParentNode(currentNode);
+	}
+	return null;
+}
+function isWebKit() {
+	if (isWebKitValue == null) isWebKitValue = typeof CSS !== "undefined" && CSS.supports && CSS.supports("-webkit-backdrop-filter", "none");
+	return isWebKitValue;
+}
+function isLastTraversableNode(node) {
+	return /^(html|body|#document)$/.test(getNodeName(node));
+}
+function getComputedStyle$1(element) {
+	return getWindow(element).getComputedStyle(element);
+}
+function getNodeScroll(element) {
+	if (isElement(element)) return {
+		scrollLeft: element.scrollLeft,
+		scrollTop: element.scrollTop
+	};
+	return {
+		scrollLeft: element.scrollX,
+		scrollTop: element.scrollY
+	};
+}
+function getParentNode(node) {
+	if (getNodeName(node) === "html") return node;
+	const result = node.assignedSlot || node.parentNode || isShadowRoot(node) && node.host || getDocumentElement(node);
+	return isShadowRoot(result) ? result.host : result;
+}
+function getNearestOverflowAncestor(node) {
+	const parentNode = getParentNode(node);
+	if (isLastTraversableNode(parentNode)) return (node.ownerDocument || node).body;
+	if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) return parentNode;
+	return getNearestOverflowAncestor(parentNode);
+}
+function getOverflowAncestors(node, list, traverseIframes) {
+	var _node$ownerDocument2;
+	if (list === void 0) list = [];
+	if (traverseIframes === void 0) traverseIframes = true;
+	const scrollableAncestor = getNearestOverflowAncestor(node);
+	const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
+	const win = getWindow(scrollableAncestor);
+	if (isBody) {
+		const frameElement = getFrameElement(win);
+		return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
+	} else return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
+}
+function getFrameElement(win) {
+	return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
+}
+function getCssDimensions(element) {
+	const css = getComputedStyle$1(element);
+	let width = parseFloat(css.width) || 0;
+	let height = parseFloat(css.height) || 0;
+	const hasOffset = isHTMLElement(element);
+	const offsetWidth = hasOffset ? element.offsetWidth : width;
+	const offsetHeight = hasOffset ? element.offsetHeight : height;
+	const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
+	if (shouldFallback) {
+		width = offsetWidth;
+		height = offsetHeight;
+	}
+	return {
+		width,
+		height,
+		$: shouldFallback
+	};
+}
+function unwrapElement(element) {
+	return !isElement(element) ? element.contextElement : element;
+}
+function getScale(element) {
+	const domElement = unwrapElement(element);
+	if (!isHTMLElement(domElement)) return createCoords(1);
+	const rect = domElement.getBoundingClientRect();
+	const { width, height, $ } = getCssDimensions(domElement);
+	let x = ($ ? round(rect.width) : rect.width) / width;
+	let y = ($ ? round(rect.height) : rect.height) / height;
+	if (!x || !Number.isFinite(x)) x = 1;
+	if (!y || !Number.isFinite(y)) y = 1;
+	return {
+		x,
+		y
+	};
+}
+var noOffsets = /*#__PURE__*/ createCoords(0);
+function getVisualOffsets(element) {
+	const win = getWindow(element);
+	if (!isWebKit() || !win.visualViewport) return noOffsets;
+	return {
+		x: win.visualViewport.offsetLeft,
+		y: win.visualViewport.offsetTop
+	};
+}
+function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
+	if (isFixed === void 0) isFixed = false;
+	return !!floatingOffsetParent && isFixed && floatingOffsetParent === getWindow(element);
+}
+function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
+	if (includeScale === void 0) includeScale = false;
+	if (isFixedStrategy === void 0) isFixedStrategy = false;
+	const clientRect = element.getBoundingClientRect();
+	const domElement = unwrapElement(element);
+	let scale = createCoords(1);
+	if (includeScale) if (offsetParent) {
+		if (isElement(offsetParent)) scale = getScale(offsetParent);
+	} else scale = getScale(element);
+	const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
+	let x = (clientRect.left + visualOffsets.x) / scale.x;
+	let y = (clientRect.top + visualOffsets.y) / scale.y;
+	let width = clientRect.width / scale.x;
+	let height = clientRect.height / scale.y;
+	if (domElement && offsetParent) {
+		const win = getWindow(domElement);
+		const offsetWin = isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
+		let currentWin = win;
+		let currentIFrame = getFrameElement(currentWin);
+		while (currentIFrame && offsetWin !== currentWin) {
+			const iframeScale = getScale(currentIFrame);
+			const iframeRect = currentIFrame.getBoundingClientRect();
+			const css = getComputedStyle$1(currentIFrame);
+			const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
+			const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
+			x *= iframeScale.x;
+			y *= iframeScale.y;
+			width *= iframeScale.x;
+			height *= iframeScale.y;
+			x += left;
+			y += top;
+			currentWin = getWindow(currentIFrame);
+			currentIFrame = getFrameElement(currentWin);
+		}
+	}
+	return rectToClientRect({
+		width,
+		height,
+		x,
+		y
+	});
+}
+function getWindowScrollBarX(element, rect) {
+	const leftScroll = getNodeScroll(element).scrollLeft;
+	if (!rect) return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
+	return rect.left + leftScroll;
+}
+function getHTMLOffset(documentElement, scroll) {
+	const htmlRect = documentElement.getBoundingClientRect();
+	return {
+		x: htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect),
+		y: htmlRect.top + scroll.scrollTop
+	};
+}
+function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
+	let { elements, rect, offsetParent, strategy } = _ref;
+	const isFixed = strategy === "fixed";
+	const documentElement = getDocumentElement(offsetParent);
+	const topLayer = elements ? isTopLayer(elements.floating) : false;
+	if (offsetParent === documentElement || topLayer && isFixed) return rect;
+	let scroll = {
+		scrollLeft: 0,
+		scrollTop: 0
+	};
+	let scale = createCoords(1);
+	const offsets = createCoords(0);
+	const isOffsetParentAnElement = isHTMLElement(offsetParent);
+	if (isOffsetParentAnElement || !isFixed) {
+		if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) scroll = getNodeScroll(offsetParent);
+		if (isOffsetParentAnElement) {
+			const offsetRect = getBoundingClientRect(offsetParent);
+			scale = getScale(offsetParent);
+			offsets.x = offsetRect.x + offsetParent.clientLeft;
+			offsets.y = offsetRect.y + offsetParent.clientTop;
+		}
+	}
+	const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
+	return {
+		width: rect.width * scale.x,
+		height: rect.height * scale.y,
+		x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
+		y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
+	};
+}
+function getClientRects(element) {
+	return element.getClientRects ? Array.from(element.getClientRects()) : [];
+}
+function getDocumentRect(html) {
+	const scroll = getNodeScroll(html);
+	const body = html.ownerDocument.body;
+	const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
+	const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
+	let x = -scroll.scrollLeft + getWindowScrollBarX(html);
+	const y = -scroll.scrollTop;
+	if (getComputedStyle$1(body).direction === "rtl") x += max(html.clientWidth, body.clientWidth) - width;
+	return {
+		width,
+		height,
+		x,
+		y
+	};
+}
+var SCROLLBAR_MAX = 25;
+function getViewportRect(element, strategy, rootBoundary) {
+	if (rootBoundary === void 0) rootBoundary = "viewport";
+	const isLayoutViewport = rootBoundary === "layoutViewport";
+	const win = getWindow(element);
+	const html = getDocumentElement(element);
+	const visualViewport = win.visualViewport;
+	let width = html.clientWidth;
+	let height = html.clientHeight;
+	let x = 0;
+	let y = 0;
+	if (visualViewport) {
+		const layoutRelativeClientCoords = !isWebKit() || strategy === "fixed";
+		if (isLayoutViewport) {
+			if (!layoutRelativeClientCoords) {
+				x = -visualViewport.offsetLeft;
+				y = -visualViewport.offsetTop;
+			}
+		} else {
+			width = visualViewport.width;
+			height = visualViewport.height;
+			if (layoutRelativeClientCoords) {
+				x = visualViewport.offsetLeft;
+				y = visualViewport.offsetTop;
+			}
+		}
+	}
+	if (getWindowScrollBarX(html) <= 0) {
+		const doc = html.ownerDocument;
+		const body = doc.body;
+		const bodyStyles = getComputedStyle(body);
+		const bodyMarginInline = doc.compatMode === "CSS1Compat" ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
+		const reservedWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
+		const gutter = getComputedStyle(html).scrollbarGutter === "stable both-edges" ? reservedWidth / 2 : reservedWidth;
+		if (gutter <= SCROLLBAR_MAX) width -= gutter;
+	}
+	return {
+		width,
+		height,
+		x,
+		y
+	};
+}
+function getInnerBoundingClientRect(element, strategy) {
+	const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
+	const top = clientRect.top + element.clientTop;
+	const left = clientRect.left + element.clientLeft;
+	const scale = getScale(element);
+	return {
+		width: element.clientWidth * scale.x,
+		height: element.clientHeight * scale.y,
+		x: left * scale.x,
+		y: top * scale.y
+	};
+}
+function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
+	let rect;
+	if (clippingAncestor === "viewport" || clippingAncestor === "layoutViewport") rect = getViewportRect(element, strategy, clippingAncestor);
+	else if (clippingAncestor === "document") rect = getDocumentRect(getDocumentElement(element));
+	else if (isElement(clippingAncestor)) rect = getInnerBoundingClientRect(clippingAncestor, strategy);
+	else {
+		const visualOffsets = getVisualOffsets(element);
+		rect = {
+			x: clippingAncestor.x - visualOffsets.x,
+			y: clippingAncestor.y - visualOffsets.y,
+			width: clippingAncestor.width,
+			height: clippingAncestor.height
+		};
+	}
+	return rectToClientRect(rect);
+}
+function getClippingElementAncestors(element, cache) {
+	const cachedResult = cache.get(element);
+	if (cachedResult) return cachedResult;
+	let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body");
+	let lastKeptComputedStyle = null;
+	const elementIsFixed = getComputedStyle$1(element).position === "fixed";
+	let currentNode = elementIsFixed ? getParentNode(element) : element;
+	while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
+		const computedStyle = getComputedStyle$1(currentNode);
+		const currentNodeIsContaining = isContainingBlock(currentNode);
+		const lastPosition = lastKeptComputedStyle ? lastKeptComputedStyle.position : elementIsFixed ? "fixed" : "";
+		if (!currentNodeIsContaining && (lastPosition === "fixed" || lastPosition === "absolute" && computedStyle.position === "static")) result = result.filter((ancestor) => ancestor !== currentNode);
+		else lastKeptComputedStyle = computedStyle;
+		currentNode = getParentNode(currentNode);
+	}
+	cache.set(element, result);
+	return result;
+}
+function getClippingRect(_ref) {
+	let { element, boundary, rootBoundary, strategy } = _ref;
+	const clippingAncestors = [...boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary), rootBoundary];
+	const firstRect = getClientRectFromClippingAncestor(element, clippingAncestors[0], strategy);
+	let top = firstRect.top;
+	let right = firstRect.right;
+	let bottom = firstRect.bottom;
+	let left = firstRect.left;
+	for (let i = 1; i < clippingAncestors.length; i++) {
+		const rect = getClientRectFromClippingAncestor(element, clippingAncestors[i], strategy);
+		top = max(rect.top, top);
+		right = min(rect.right, right);
+		bottom = min(rect.bottom, bottom);
+		left = max(rect.left, left);
+	}
+	return {
+		width: right - left,
+		height: bottom - top,
+		x: left,
+		y: top
+	};
+}
+function getDimensions(element) {
+	const { width, height } = getCssDimensions(element);
+	return {
+		width,
+		height
+	};
+}
+function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
+	const isOffsetParentAnElement = isHTMLElement(offsetParent);
+	const documentElement = getDocumentElement(offsetParent);
+	const isFixed = strategy === "fixed";
+	const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
+	let scroll = {
+		scrollLeft: 0,
+		scrollTop: 0
+	};
+	const offsets = createCoords(0);
+	if (isOffsetParentAnElement || !isFixed) {
+		if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) scroll = getNodeScroll(offsetParent);
+		if (isOffsetParentAnElement) {
+			const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
+			offsets.x = offsetRect.x + offsetParent.clientLeft;
+			offsets.y = offsetRect.y + offsetParent.clientTop;
+		}
+	}
+	if (!isOffsetParentAnElement && documentElement) offsets.x = getWindowScrollBarX(documentElement);
+	const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
+	return {
+		x: rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x,
+		y: rect.top + scroll.scrollTop - offsets.y - htmlOffset.y,
+		width: rect.width,
+		height: rect.height
+	};
+}
+function isStaticPositioned(element) {
+	return getComputedStyle$1(element).position === "static";
+}
+function getTrueOffsetParent(element, polyfill) {
+	if (!isHTMLElement(element) || getComputedStyle$1(element).position === "fixed") return null;
+	if (polyfill) return polyfill(element);
+	let rawOffsetParent = element.offsetParent;
+	if (getDocumentElement(element) === rawOffsetParent) rawOffsetParent = rawOffsetParent.ownerDocument.body;
+	return rawOffsetParent;
+}
+function getOffsetParent(element, polyfill) {
+	const win = getWindow(element);
+	if (isTopLayer(element)) return win;
+	if (!isHTMLElement(element)) {
+		let svgOffsetParent = getParentNode(element);
+		while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
+			if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) return svgOffsetParent;
+			svgOffsetParent = getParentNode(svgOffsetParent);
+		}
+		return win;
+	}
+	let offsetParent = getTrueOffsetParent(element, polyfill);
+	while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) offsetParent = getTrueOffsetParent(offsetParent, polyfill);
+	if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) return win;
+	return offsetParent || getContainingBlock(element) || win;
+}
+var getElementRects = async function(data) {
+	const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
+	const getDimensionsFn = this.getDimensions;
+	const floatingDimensions = await getDimensionsFn(data.floating);
+	return {
+		reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
+		floating: {
+			x: 0,
+			y: 0,
+			width: floatingDimensions.width,
+			height: floatingDimensions.height
+		}
+	};
+};
+function isRTL(element) {
+	return getComputedStyle$1(element).direction === "rtl";
+}
+var platform = {
+	convertOffsetParentRelativeRectToViewportRelativeRect,
+	getDocumentElement,
+	getClippingRect,
+	getOffsetParent,
+	getElementRects,
+	getClientRects,
+	getDimensions,
+	getScale,
+	isElement,
+	isRTL
+};
+function rectsAreEqual(a, b) {
+	return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
+}
+function observeMove(element, onMove, ancestorResize) {
+	let io = null;
+	let timeoutId;
+	const root = getDocumentElement(element);
+	function cleanup() {
+		var _io;
+		clearTimeout(timeoutId);
+		(_io = io) == null || _io.disconnect();
+		io = null;
+	}
+	function refresh(skip, threshold) {
+		if (skip === void 0) skip = false;
+		if (threshold === void 0) threshold = 1;
+		cleanup();
+		const elementRectForRootMargin = element.getBoundingClientRect();
+		const { left, top, width, height } = elementRectForRootMargin;
+		if (!skip) onMove();
+		if (!width || !height) return;
+		const insetTop = floor(top);
+		const insetRight = floor(root.clientWidth - (left + width));
+		const insetBottom = floor(root.clientHeight - (top + height));
+		const insetLeft = floor(left);
+		const options = {
+			rootMargin: -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px",
+			threshold: max(0, min(1, threshold)) || 1
+		};
+		let isFirstUpdate = true;
+		function handleObserve(entries) {
+			const ratio = entries[0].intersectionRatio;
+			if (!rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) return refresh();
+			if (ratio !== threshold) {
+				if (!isFirstUpdate) return refresh();
+				if (!ratio) timeoutId = setTimeout(() => {
+					refresh(false, 1e-7);
+				}, 1e3);
+				else refresh(false, ratio);
+			}
+			isFirstUpdate = false;
+		}
+		try {
+			io = new IntersectionObserver(handleObserve, {
+				...options,
+				root: root.ownerDocument
+			});
+		} catch (_e) {
+			io = new IntersectionObserver(handleObserve, options);
+		}
+		io.observe(element);
+	}
+	const win = getWindow(element);
+	const handleResize = () => refresh(ancestorResize);
+	win.addEventListener("resize", handleResize);
+	refresh(true);
+	return () => {
+		win.removeEventListener("resize", handleResize);
+		cleanup();
+	};
+}
+/**
+* Automatically updates the position of the floating element when necessary.
+* Should only be called when the floating element is mounted on the DOM or
+* visible on the screen.
+* @returns cleanup function that should be invoked when the floating element is
+* removed from the DOM or hidden from the screen.
+* @see https://floating-ui.com/docs/autoUpdate
+*/
+function autoUpdate(reference, floating, update, options) {
+	if (options === void 0) options = {};
+	const { ancestorScroll = true, ancestorResize = true, elementResize = typeof ResizeObserver === "function", layoutShift = typeof IntersectionObserver === "function", animationFrame = false } = options;
+	const referenceEl = unwrapElement(reference);
+	const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...floating ? getOverflowAncestors(floating) : []] : [];
+	ancestors.forEach((ancestor) => {
+		ancestorScroll && ancestor.addEventListener("scroll", update);
+		ancestorResize && ancestor.addEventListener("resize", update);
+	});
+	const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update, ancestorResize) : null;
+	let reobserveFrame = -1;
+	let resizeObserver = null;
+	if (elementResize) {
+		resizeObserver = new ResizeObserver((_ref) => {
+			let [firstEntry] = _ref;
+			if (firstEntry && firstEntry.target === referenceEl && resizeObserver && floating) {
+				resizeObserver.unobserve(floating);
+				cancelAnimationFrame(reobserveFrame);
+				reobserveFrame = requestAnimationFrame(() => {
+					var _resizeObserver;
+					(_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
+				});
+			}
+			update();
+		});
+		if (referenceEl && !animationFrame) resizeObserver.observe(referenceEl);
+		if (floating) resizeObserver.observe(floating);
+	}
+	let frameId;
+	let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
+	if (animationFrame) frameLoop();
+	function frameLoop() {
+		const nextRefRect = getBoundingClientRect(reference);
+		if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) update();
+		prevRefRect = nextRefRect;
+		frameId = requestAnimationFrame(frameLoop);
+	}
+	update();
+	return () => {
+		var _resizeObserver2;
+		ancestors.forEach((ancestor) => {
+			ancestorScroll && ancestor.removeEventListener("scroll", update);
+			ancestorResize && ancestor.removeEventListener("resize", update);
+		});
+		cleanupIo?.();
+		(_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
+		resizeObserver = null;
+		if (animationFrame) cancelAnimationFrame(frameId);
+	};
+}
+/**
+* Modifies the placement by translating the floating element along the
+* specified axes.
+* A number (shorthand for `mainAxis` or distance), or an axes configuration
+* object may be passed.
+* @see https://floating-ui.com/docs/offset
+*/
+var offset = offset$1;
+/**
+* Optimizes the visibility of the floating element by shifting it in order to
+* keep it in view when it will overflow the clipping boundary.
+* @see https://floating-ui.com/docs/shift
+*/
+var shift = shift$1;
+/**
+* Optimizes the visibility of the floating element by flipping the `placement`
+* in order to keep it in view when the preferred placement(s) will overflow the
+* clipping boundary. Alternative to `autoPlacement`.
+* @see https://floating-ui.com/docs/flip
+*/
+var flip = flip$1;
+/**
+* Provides data that allows you to change the size of the floating element —
+* for instance, prevent it from overflowing the clipping boundary or match the
+* width of the reference element.
+* @see https://floating-ui.com/docs/size
+*/
+var size = size$1;
+/**
+* Provides data to hide the floating element in applicable situations, such as
+* when it is not in the same clipping context as the reference element.
+* @see https://floating-ui.com/docs/hide
+*/
+var hide = hide$1;
+/**
+* Provides data to position an inner element of the floating element so that it
+* appears centered to the reference element.
+* @see https://floating-ui.com/docs/arrow
+*/
+var arrow = arrow$1;
+/**
+* Computes the `x` and `y` coordinates that will place the floating element
+* next to a given reference element.
+*/
+var computePosition = (reference, floating, options) => {
+	const cache = /* @__PURE__ */ new Map();
+	const mergedOptions = options != null ? options : {};
+	const platformWithCache = {
+		...platform,
+		...mergedOptions.platform,
+		_c: cache
+	};
+	return computePosition$1(reference, floating, {
+		...mergedOptions,
+		platform: platformWithCache
+	});
+};
+var _tmpl$$1 = [
+	"<svg",
+	" display=\"block\" viewBox=\"0 0 30 30\" style=\"transform:scale(1.02)\"><g",
+	"><path fill=\"none\" d=\"M23,27.8c1.1,1.2,3.4,2.2,5,2.2h2H0h2c1.7,0,3.9-1,5-2.2l6.6-7.2c0.7-0.8,2-0.8,2.7,0L23,27.8L23,27.8z\"></path><path stroke=\"none\" d=\"M23,27.8c1.1,1.2,3.4,2.2,5,2.2h2H0h2c1.7,0,3.9-1,5-2.2l6.6-7.2c0.7-0.8,2-0.8,2.7,0L23,27.8L23,27.8z\"></path></g></svg>"
+];
+var PopperContext = createContext();
+function usePopperContext() {
+	const context = useContext(PopperContext);
+	if (context === void 0) throw new Error("[kobalte]: `usePopperContext` must be used within a `Popper` component");
+	return context;
+}
+var DEFAULT_SIZE = 30;
+var HALF_DEFAULT_SIZE = DEFAULT_SIZE / 2;
+var ROTATION_DEG = {
+	top: 180,
+	right: -90,
+	bottom: 0,
+	left: 90
+};
+function PopperArrow(props) {
+	const context = usePopperContext();
+	const [local, others] = splitProps(mergeDefaultProps({ size: DEFAULT_SIZE }, props), [
+		"ref",
+		"style",
+		"size"
+	]);
+	const dir = () => context.currentPlacement().split("-")[0];
+	const contentStyle = createComputedStyle(context.contentRef);
+	const fill = () => contentStyle()?.getPropertyValue("background-color") || "none";
+	const stroke = () => contentStyle()?.getPropertyValue(`border-${dir()}-color`) || "none";
+	const borderWidth = () => contentStyle()?.getPropertyValue(`border-${dir()}-width`) || "0px";
+	const strokeWidth = () => {
+		return Number.parseInt(borderWidth()) * 2 * (DEFAULT_SIZE / local.size);
+	};
+	const rotate = () => {
+		return `rotate(${ROTATION_DEG[dir()]} ${HALF_DEFAULT_SIZE} ${HALF_DEFAULT_SIZE}) translate(0 2)`;
+	};
+	return createComponent(Polymorphic, mergeProps({
+		as: "div",
+		"aria-hidden": "true",
+		get style() {
+			return combineStyle({
+				position: "absolute",
+				"font-size": `${local.size}px`,
+				width: "1em",
+				height: "1em",
+				"pointer-events": "none",
+				fill: fill(),
+				stroke: stroke(),
+				"stroke-width": strokeWidth()
+			}, local.style);
+		}
+	}, others, { get children() {
+		return ssr(_tmpl$$1, ssrHydrationKey(), ssrAttribute("transform", escape(rotate(), true), false));
+	} }));
+}
+function createComputedStyle(element) {
+	const [style, setStyle] = createSignal();
+	createEffect(() => {
+		const el = element();
+		el && setStyle(getWindow$1(el).getComputedStyle(el));
+	});
+	return style;
+}
+function PopperPositioner(props) {
+	usePopperContext();
+	const [local, others] = splitProps(props, ["ref", "style"]);
+	return createComponent(Polymorphic, mergeProps({
+		as: "div",
+		"data-popper-positioner": "",
+		get style() {
+			return combineStyle({
+				position: "absolute",
+				top: 0,
+				left: 0,
+				"min-width": "max-content"
+			}, local.style);
+		}
+	}, others));
+}
+function createDOMRect(anchorRect) {
+	const { x = 0, y = 0, width = 0, height = 0 } = anchorRect ?? {};
+	if (typeof DOMRect === "function") return new DOMRect(x, y, width, height);
+	const rect = {
+		x,
+		y,
+		width,
+		height,
+		top: y,
+		right: x + width,
+		bottom: y + height,
+		left: x
+	};
+	return {
+		...rect,
+		toJSON: () => rect
+	};
+}
+function getAnchorElement(anchor, getAnchorRect) {
+	return {
+		contextElement: anchor,
+		getBoundingClientRect: () => {
+			const anchorRect = getAnchorRect(anchor);
+			if (anchorRect) return createDOMRect(anchorRect);
+			if (anchor) return anchor.getBoundingClientRect();
+			return createDOMRect();
+		}
+	};
+}
+function isValidPlacement(flip2) {
+	return /^(?:top|bottom|left|right)(?:-(?:start|end))?$/.test(flip2);
+}
+var REVERSE_BASE_PLACEMENT = {
+	top: "bottom",
+	right: "left",
+	bottom: "top",
+	left: "right"
+};
+function getTransformOrigin(placement, readingDirection) {
+	const [basePlacement, alignment] = placement.split("-");
+	const reversePlacement = REVERSE_BASE_PLACEMENT[basePlacement];
+	if (!alignment) return `${reversePlacement} center`;
+	if (basePlacement === "left" || basePlacement === "right") return `${reversePlacement} ${alignment === "start" ? "top" : "bottom"}`;
+	if (alignment === "start") return `${reversePlacement} ${readingDirection === "rtl" ? "right" : "left"}`;
+	return `${reversePlacement} ${readingDirection === "rtl" ? "left" : "right"}`;
+}
+function PopperRoot(props) {
+	const mergedProps = mergeDefaultProps({
+		getAnchorRect: (anchor) => anchor?.getBoundingClientRect(),
+		placement: "bottom",
+		gutter: 0,
+		shift: 0,
+		flip: true,
+		slide: true,
+		overlap: false,
+		sameWidth: false,
+		fitViewport: false,
+		hideWhenDetached: false,
+		detachedPadding: 0,
+		arrowPadding: 4,
+		overflowPadding: 8
+	}, props);
+	const [positionerRef, setPositionerRef] = createSignal();
+	const [arrowRef, setArrowRef] = createSignal();
+	const [currentPlacement, setCurrentPlacement] = createSignal(mergedProps.placement);
+	const anchorRef = () => getAnchorElement(mergedProps.anchorRef?.(), mergedProps.getAnchorRect);
+	const { direction } = useLocale();
+	async function updatePosition() {
+		const referenceEl = anchorRef();
+		const floatingEl = positionerRef();
+		const arrowEl = arrowRef();
+		if (!referenceEl || !floatingEl) return;
+		const arrowOffset = (arrowEl?.clientHeight || 0) / 2;
+		const finalGutter = typeof mergedProps.gutter === "number" ? mergedProps.gutter + arrowOffset : mergedProps.gutter ?? arrowOffset;
+		floatingEl.style.setProperty("--kb-popper-content-overflow-padding", `${mergedProps.overflowPadding}px`);
+		referenceEl.getBoundingClientRect();
+		const middleware = [offset(({ placement }) => {
+			const hasAlignment = !!placement.split("-")[1];
+			return {
+				mainAxis: finalGutter,
+				crossAxis: !hasAlignment ? mergedProps.shift : void 0,
+				alignmentAxis: mergedProps.shift
+			};
+		})];
+		if (mergedProps.flip !== false) {
+			const fallbackPlacements = typeof mergedProps.flip === "string" ? mergedProps.flip.split(" ") : void 0;
+			if (fallbackPlacements !== void 0 && !fallbackPlacements.every(isValidPlacement)) throw new Error("`flip` expects a spaced-delimited list of placements");
+			middleware.push(flip({
+				padding: mergedProps.overflowPadding,
+				fallbackPlacements
+			}));
+		}
+		if (mergedProps.slide || mergedProps.overlap) middleware.push(shift({
+			mainAxis: mergedProps.slide,
+			crossAxis: mergedProps.overlap,
+			padding: mergedProps.overflowPadding
+		}));
+		middleware.push(size({
+			padding: mergedProps.overflowPadding,
+			apply({ availableWidth, availableHeight, rects }) {
+				const referenceWidth = Math.round(rects.reference.width);
+				availableWidth = Math.floor(availableWidth);
+				availableHeight = Math.floor(availableHeight);
+				floatingEl.style.setProperty("--kb-popper-anchor-width", `${referenceWidth}px`);
+				floatingEl.style.setProperty("--kb-popper-content-available-width", `${availableWidth}px`);
+				floatingEl.style.setProperty("--kb-popper-content-available-height", `${availableHeight}px`);
+				if (mergedProps.sameWidth) floatingEl.style.width = `${referenceWidth}px`;
+				if (mergedProps.fitViewport) {
+					floatingEl.style.maxWidth = `${availableWidth}px`;
+					floatingEl.style.maxHeight = `${availableHeight}px`;
+				}
+			}
+		}));
+		if (mergedProps.hideWhenDetached) middleware.push(hide({ padding: mergedProps.detachedPadding }));
+		if (arrowEl) middleware.push(arrow({
+			element: arrowEl,
+			padding: mergedProps.arrowPadding
+		}));
+		const pos = await computePosition(referenceEl, floatingEl, {
+			placement: mergedProps.placement,
+			strategy: "absolute",
+			middleware,
+			platform: {
+				...platform,
+				isRTL: () => direction() === "rtl"
+			}
+		});
+		setCurrentPlacement(pos.placement);
+		mergedProps.onCurrentPlacementChange?.(pos.placement);
+		if (!floatingEl) return;
+		floatingEl.style.setProperty("--kb-popper-content-transform-origin", getTransformOrigin(pos.placement, direction()));
+		const x = Math.round(pos.x);
+		const y = Math.round(pos.y);
+		let visibility;
+		if (mergedProps.hideWhenDetached) visibility = pos.middlewareData.hide?.referenceHidden ? "hidden" : "visible";
+		Object.assign(floatingEl.style, {
+			top: "0",
+			left: "0",
+			transform: `translate3d(${x}px, ${y}px, 0)`,
+			visibility
+		});
+		if (arrowEl && pos.middlewareData.arrow) {
+			const { x: arrowX, y: arrowY } = pos.middlewareData.arrow;
+			const dir = pos.placement.split("-")[0];
+			Object.assign(arrowEl.style, {
+				left: arrowX != null ? `${arrowX}px` : "",
+				top: arrowY != null ? `${arrowY}px` : "",
+				[dir]: "100%"
+			});
+		}
+	}
+	createEffect(() => {
+		const referenceEl = anchorRef();
+		const floatingEl = positionerRef();
+		if (!referenceEl || !floatingEl) return;
+		onCleanup(autoUpdate(referenceEl, floatingEl, updatePosition, { elementResize: typeof ResizeObserver === "function" }));
+	});
+	createEffect(() => {
+		const positioner = positionerRef();
+		const content = mergedProps.contentRef?.();
+		if (!positioner || !content) return;
+		queueMicrotask(() => {
+			positioner.style.zIndex = getComputedStyle(content).zIndex;
+		});
+	});
+	const context = {
+		currentPlacement,
+		contentRef: () => mergedProps.contentRef?.(),
+		setPositionerRef,
+		setArrowRef
+	};
+	return createComponent(PopperContext.Provider, {
+		value: context,
+		get children() {
+			return mergedProps.children;
+		}
+	});
+}
+var Popper = Object.assign(PopperRoot, {
+	Arrow: PopperArrow,
+	Context: PopperContext,
+	usePopperContext,
+	Positioner: PopperPositioner
+});
+function createFocusScope(props, ref) {
+	const [isPaused, setIsPaused] = createSignal(false);
+	createEffect(() => {});
+	createEffect(() => {});
+	createEffect(() => {});
+}
+function createHideOutside(props) {
+	createEffect(() => {
+		if (access$1(props.isDisabled)) return;
+		onCleanup(ariaHideOutside(access$1(props.targets), access$1(props.root)));
+	});
+}
+var refCountMap = /* @__PURE__ */ new WeakMap();
+var observerStack = [];
+function ariaHideOutside(targets, root = document.body) {
+	const visibleNodes = new Set(targets);
+	const hiddenNodes = /* @__PURE__ */ new Set();
+	const walk = (root2) => {
+		for (const element of root2.querySelectorAll(`[${DATA_LIVE_ANNOUNCER_ATTR}], [${DATA_TOP_LAYER_ATTR}]`)) visibleNodes.add(element);
+		const acceptNode = (node) => {
+			if (visibleNodes.has(node) || node.parentElement && hiddenNodes.has(node.parentElement) && node.parentElement.getAttribute("role") !== "row") return NodeFilter.FILTER_REJECT;
+			for (const target of visibleNodes) if (node.contains(target)) return NodeFilter.FILTER_SKIP;
+			return NodeFilter.FILTER_ACCEPT;
+		};
+		const walker = document.createTreeWalker(root2, NodeFilter.SHOW_ELEMENT, { acceptNode });
+		const acceptRoot = acceptNode(root2);
+		if (acceptRoot === NodeFilter.FILTER_ACCEPT) hide(root2);
+		if (acceptRoot !== NodeFilter.FILTER_REJECT) {
+			let node = walker.nextNode();
+			while (node != null) {
+				hide(node);
+				node = walker.nextNode();
+			}
+		}
+	};
+	const hide = (node) => {
+		const refCount = refCountMap.get(node) ?? 0;
+		if (node.getAttribute("aria-hidden") === "true" && refCount === 0) return;
+		if (refCount === 0) setTimeout(() => requestAnimationFrame(() => node.setAttribute("aria-hidden", "true")));
+		hiddenNodes.add(node);
+		refCountMap.set(node, refCount + 1);
+	};
+	if (observerStack.length) observerStack[observerStack.length - 1].disconnect();
+	walk(root);
+	const observer = new MutationObserver((changes) => {
+		for (const change of changes) {
+			if (change.type !== "childList" || change.addedNodes.length === 0) continue;
+			if (![...visibleNodes, ...hiddenNodes].some((node) => node.contains(change.target))) {
+				for (const node of change.removedNodes) if (node instanceof Element) {
+					visibleNodes.delete(node);
+					hiddenNodes.delete(node);
+				}
+				for (const node of change.addedNodes) if ((node instanceof HTMLElement || node instanceof SVGElement) && (node.dataset.liveAnnouncer === "true" || node.dataset.reactAriaTopLayer === "true")) visibleNodes.add(node);
+				else if (node instanceof Element) walk(node);
+			}
+		}
+	});
+	observer.observe(root, {
+		childList: true,
+		subtree: true
+	});
+	const observerWrapper = {
+		observe() {
+			observer.observe(root, {
+				childList: true,
+				subtree: true
+			});
+		},
+		disconnect() {
+			observer.disconnect();
+		}
+	};
+	observerStack.push(observerWrapper);
+	return () => {
+		observer.disconnect();
+		for (const node of hiddenNodes) {
+			const count = refCountMap.get(node);
+			if (count == null) return;
+			if (count === 1) {
+				setTimeout(() => requestAnimationFrame(() => node.removeAttribute("aria-hidden")));
+				refCountMap.delete(node);
+			} else refCountMap.set(node, count - 1);
+		}
+		if (observerWrapper === observerStack[observerStack.length - 1]) {
+			observerStack.pop();
+			if (observerStack.length) observerStack[observerStack.length - 1].observe();
+		} else observerStack.splice(observerStack.indexOf(observerWrapper), 1);
+	};
+}
+function createEscapeKeyDown(props) {
+	createEffect(() => {});
+}
+function createInteractOutside(props, ref) {
+	createEffect(() => {});
+}
+var DismissableLayerContext = createContext();
+function useOptionalDismissableLayerContext() {
+	return useContext(DismissableLayerContext);
+}
+function DismissableLayer(props) {
+	let ref;
+	const parentContext = useOptionalDismissableLayerContext();
+	const [local, others] = splitProps(props, [
+		"ref",
+		"disableOutsidePointerEvents",
+		"excludedElements",
+		"onEscapeKeyDown",
+		"onPointerDownOutside",
+		"onFocusOutside",
+		"onInteractOutside",
+		"onDismiss",
+		"bypassTopMostLayerCheck"
+	]);
+	const nestedLayers = /* @__PURE__ */ new Set([]);
+	const registerNestedLayer = (element) => {
+		nestedLayers.add(element);
+		const parentUnregister = parentContext?.registerNestedLayer(element);
+		return () => {
+			nestedLayers.delete(element);
+			parentUnregister?.();
+		};
+	};
+	const shouldExcludeElement = (element) => {
+		return false;
+	};
+	const onPointerDownOutside = (e) => {};
+	const onFocusOutside = (e) => {
+		local.onFocusOutside?.(e);
+		local.onInteractOutside?.(e);
+		if (!e.defaultPrevented) local.onDismiss?.();
+	};
+	createInteractOutside({
+		shouldExcludeElement,
+		onPointerDownOutside,
+		onFocusOutside
+	}, () => ref);
+	createEscapeKeyDown({
+		ownerDocument: () => getDocument(ref),
+		onEscapeKeyDown: (e) => {}
+	});
+	onMount(() => {});
+	createEffect(on([() => ref, () => local.disableOutsidePointerEvents], ([ref2, disableOutsidePointerEvents]) => {
+		if (!ref2) return;
+		const layer = layerStack.find(ref2);
+		if (layer && layer.isPointerBlocking !== disableOutsidePointerEvents) {
+			layer.isPointerBlocking = disableOutsidePointerEvents;
+			layerStack.assignPointerEventToLayers();
+		}
+		if (disableOutsidePointerEvents) layerStack.disableBodyPointerEvents(ref2);
+		onCleanup(() => {
+			layerStack.restoreBodyPointerEvents(ref2);
+		});
+	}, { defer: true }));
+	const context = { registerNestedLayer };
+	return createComponent(DismissableLayerContext.Provider, {
+		value: context,
+		get children() {
+			return createComponent(Polymorphic, mergeProps({ as: "div" }, others));
+		}
+	});
+}
+function createDisclosureState(props = {}) {
+	const [isOpen, setIsOpen] = createControllableBooleanSignal({
+		value: () => access$1(props.open),
+		defaultValue: () => !!access$1(props.defaultOpen),
+		onChange: (value) => props.onOpenChange?.(value)
+	});
+	const open = () => {
+		setIsOpen(true);
+	};
+	const close = () => {
+		setIsOpen(false);
+	};
+	const toggle = () => {
+		isOpen() ? close() : open();
+	};
+	return {
+		isOpen,
+		setIsOpen,
+		open,
+		close,
+		toggle
+	};
+}
+var contains = (wrapper, target) => {
+	if (wrapper.contains(target)) return true;
+	let currentElement = target;
+	while (currentElement) {
+		if (currentElement === wrapper) return true;
+		currentElement = currentElement._$host ?? currentElement.parentElement;
+	}
+	return false;
+};
+var activeStyles = /* @__PURE__ */ new Map();
+var createStyle = (props) => {
+	createEffect(() => {
+		const style = access(props.style) ?? {};
+		const properties = access(props.properties) ?? [];
+		const originalStyles = {};
+		for (const key in style) originalStyles[key] = props.element.style[key];
+		const activeStyle = activeStyles.get(props.key);
+		if (activeStyle) activeStyle.activeCount++;
+		else activeStyles.set(props.key, {
+			activeCount: 1,
+			originalStyles,
+			properties: properties.map((property) => property.key)
+		});
+		Object.assign(props.element.style, props.style);
+		for (const property of properties) props.element.style.setProperty(property.key, property.value);
+		onCleanup(() => {
+			const activeStyle2 = activeStyles.get(props.key);
+			if (!activeStyle2) return;
+			if (activeStyle2.activeCount !== 1) {
+				activeStyle2.activeCount--;
+				return;
+			}
+			activeStyles.delete(props.key);
+			for (const [key, value] of Object.entries(activeStyle2.originalStyles)) props.element.style[key] = value;
+			for (const property of activeStyle2.properties) props.element.style.removeProperty(property);
+			if (props.element.style.length === 0) props.element.removeAttribute("style");
+			props.cleanup?.();
+		});
+	});
+};
+var style_default = createStyle;
+var getScrollDimensions = (element, axis) => {
+	switch (axis) {
+		case "x": return [
+			element.clientWidth,
+			element.scrollLeft,
+			element.scrollWidth
+		];
+		case "y": return [
+			element.clientHeight,
+			element.scrollTop,
+			element.scrollHeight
+		];
+	}
+};
+var isScrollContainer = (element, axis) => {
+	const styles = getComputedStyle(element);
+	const overflow = axis === "x" ? styles.overflowX : styles.overflowY;
+	return overflow === "auto" || overflow === "scroll" || element.tagName === "HTML" && overflow === "visible";
+};
+var getScrollAtLocation = (location, axis, stopAt) => {
+	const directionFactor = axis === "x" && window.getComputedStyle(location).direction === "rtl" ? -1 : 1;
+	let currentElement = location;
+	let availableScroll = 0;
+	let availableScrollTop = 0;
+	let wrapperReached = false;
+	do {
+		const [clientSize, scrollOffset, scrollSize] = getScrollDimensions(currentElement, axis);
+		const scrolled = scrollSize - clientSize - directionFactor * scrollOffset;
+		if ((scrollOffset !== 0 || scrolled !== 0) && isScrollContainer(currentElement, axis)) {
+			availableScroll += scrolled;
+			availableScrollTop += scrollOffset;
+		}
+		if (currentElement === (stopAt ?? document.documentElement)) wrapperReached = true;
+		else currentElement = currentElement._$host ?? currentElement.parentElement;
+	} while (currentElement && !wrapperReached);
+	return [availableScroll, availableScrollTop];
+};
+var [preventScrollStack, setPreventScrollStack] = createSignal([]);
+var isActive = (id) => preventScrollStack().indexOf(id) === preventScrollStack().length - 1;
+var createPreventScroll = (props) => {
+	const defaultedProps = mergeProps({
+		element: null,
+		enabled: true,
+		hideScrollbar: true,
+		preventScrollbarShift: true,
+		preventScrollbarShiftMode: "padding",
+		restoreScrollPosition: true,
+		allowPinchZoom: false
+	}, props);
+	const preventScrollId = createUniqueId();
+	let currentTouchStart = [0, 0];
+	let currentTouchStartAxis = null;
+	let currentTouchStartDelta = null;
+	createEffect(() => {
+		if (!access(defaultedProps.enabled)) return;
+		setPreventScrollStack((stack) => [...stack, preventScrollId]);
+		onCleanup(() => {
+			setPreventScrollStack((stack) => stack.filter((id) => id !== preventScrollId));
+		});
+	});
+	createEffect(() => {
+		if (!access(defaultedProps.enabled) || !access(defaultedProps.hideScrollbar)) return;
+		const { documentElement } = document;
+		const scrollbarWidth = window.innerWidth - documentElement.clientWidth;
+		if (access(defaultedProps.preventScrollbarShift)) {
+			const style = { overflow: "hidden" };
+			const properties = [];
+			if (scrollbarWidth > 0) {
+				if (access(defaultedProps.preventScrollbarShiftMode) === "padding") style.paddingRight = `calc(${window.getComputedStyle(documentElement).paddingRight} + ${scrollbarWidth}px)`;
+				else style.marginRight = `calc(${window.getComputedStyle(documentElement).marginRight} + ${scrollbarWidth}px)`;
+				properties.push({
+					key: "--scrollbar-width",
+					value: `${scrollbarWidth}px`
+				});
+			}
+			const offsetTop = window.scrollY;
+			const offsetLeft = window.scrollX;
+			style_default({
+				key: "prevent-scroll",
+				element: documentElement,
+				style,
+				properties,
+				cleanup: () => {
+					if (access(defaultedProps.restoreScrollPosition) && scrollbarWidth > 0) window.scrollTo(offsetLeft, offsetTop);
+				}
+			});
+		} else style_default({
+			key: "prevent-scroll",
+			element: documentElement,
+			style: { overflow: "hidden" }
+		});
+	});
+	createEffect(() => {
+		if (!isActive(preventScrollId) || !access(defaultedProps.enabled)) return;
+		document.addEventListener("wheel", maybePreventWheel, { passive: false });
+		document.addEventListener("touchstart", logTouchStart, { passive: false });
+		document.addEventListener("touchmove", maybePreventTouch, { passive: false });
+		onCleanup(() => {
+			document.removeEventListener("wheel", maybePreventWheel);
+			document.removeEventListener("touchstart", logTouchStart);
+			document.removeEventListener("touchmove", maybePreventTouch);
+		});
+	});
+	const logTouchStart = (event) => {
+		currentTouchStart = getTouchXY(event);
+		currentTouchStartAxis = null;
+		currentTouchStartDelta = null;
+	};
+	const maybePreventWheel = (event) => {
+		const target = event.target;
+		const wrapper = access(defaultedProps.element);
+		const delta = getDeltaXY(event);
+		const axis = Math.abs(delta[0]) > Math.abs(delta[1]) ? "x" : "y";
+		const resultsInScroll = wouldScroll(target, axis, axis === "x" ? delta[0] : delta[1], wrapper);
+		let shouldCancel;
+		if (wrapper && contains(wrapper, target)) shouldCancel = !resultsInScroll;
+		else shouldCancel = true;
+		if (shouldCancel && event.cancelable) event.preventDefault();
+	};
+	const maybePreventTouch = (event) => {
+		const wrapper = access(defaultedProps.element);
+		const target = event.target;
+		let shouldCancel;
+		if (event.touches.length === 2) shouldCancel = !access(defaultedProps.allowPinchZoom);
+		else {
+			if (currentTouchStartAxis == null || currentTouchStartDelta === null) {
+				const delta = getTouchXY(event).map((touch, i) => currentTouchStart[i] - touch);
+				const axis = Math.abs(delta[0]) > Math.abs(delta[1]) ? "x" : "y";
+				currentTouchStartAxis = axis;
+				currentTouchStartDelta = axis === "x" ? delta[0] : delta[1];
+			}
+			if (target.type === "range") shouldCancel = false;
+			else {
+				const wouldResultInScroll = wouldScroll(target, currentTouchStartAxis, currentTouchStartDelta, wrapper);
+				if (wrapper && contains(wrapper, target)) shouldCancel = !wouldResultInScroll;
+				else shouldCancel = true;
+			}
+		}
+		if (shouldCancel && event.cancelable) event.preventDefault();
+	};
+};
+var getDeltaXY = (event) => [event.deltaX, event.deltaY];
+var getTouchXY = (event) => event.changedTouches[0] ? [event.changedTouches[0].clientX, event.changedTouches[0].clientY] : [0, 0];
+var wouldScroll = (target, axis, delta, wrapper) => {
+	const [availableScroll, availableScrollTop] = getScrollAtLocation(target, axis, wrapper !== null && contains(wrapper, target) ? wrapper : void 0);
+	if (delta > 0 && Math.abs(availableScroll) <= 1) return false;
+	if (delta < 0 && Math.abs(availableScrollTop) < 1) return false;
+	return true;
+};
+var index_default = createPreventScroll;
+__export({}, {
+	Arrow: () => PopperArrow,
+	Content: () => SelectContent,
+	Description: () => FormControlDescription,
+	ErrorMessage: () => FormControlErrorMessage,
+	HiddenSelect: () => SelectHiddenSelect,
+	Icon: () => SelectIcon,
+	Item: () => ListboxItem,
+	ItemDescription: () => ListboxItemDescription,
+	ItemIndicator: () => ListboxItemIndicator,
+	ItemLabel: () => ListboxItemLabel,
+	Label: () => SelectLabel,
+	Listbox: () => SelectListbox,
+	Portal: () => SelectPortal,
+	Root: () => SelectRoot,
+	Section: () => ListboxSection,
+	Select: () => Select,
+	Trigger: () => SelectTrigger,
+	Value: () => SelectValue,
+	useSelectContext: () => useSelectContext
+});
+var SelectContext = createContext();
+function useSelectContext() {
+	const context = useContext(SelectContext);
+	if (context === void 0) throw new Error("[kobalte]: `useSelectContext` must be used within a `Select` component");
+	return context;
+}
+function SelectContent(props) {
+	let ref;
+	const context = useSelectContext();
+	const [local, others] = splitProps(props, [
+		"ref",
+		"style",
+		"onCloseAutoFocus",
+		"onFocusOutside"
+	]);
+	const onEscapeKeyDown = (e) => {
+		context.close();
+	};
+	const onFocusOutside = (e) => {
+		local.onFocusOutside?.(e);
+		if (context.isOpen() && context.isModal()) e.preventDefault();
+	};
+	createHideOutside({
+		isDisabled: () => !(context.isOpen() && context.isModal()),
+		targets: () => []
+	});
+	index_default({
+		element: () => null,
+		enabled: () => context.contentPresent() && context.preventScroll()
+	});
+	createFocusScope({
+		trapFocus: () => context.isOpen() && context.isModal(),
+		onMountAutoFocus: (e) => {
+			e.preventDefault();
+		},
+		onUnmountAutoFocus: (e) => {
+			local.onCloseAutoFocus?.(e);
+			if (!e.defaultPrevented) {
+				focusWithoutScrolling(context.triggerRef());
+				e.preventDefault();
+			}
+		}
+	}, () => ref);
+	return createComponent(Show, {
+		get when() {
+			return context.contentPresent();
+		},
+		get children() {
+			return createComponent(Popper.Positioner, { get children() {
+				return createComponent(DismissableLayer, mergeProps({
+					get disableOutsidePointerEvents() {
+						return context.isModal() && context.isOpen();
+					},
+					get excludedElements() {
+						return [context.triggerRef];
+					},
+					get style() {
+						return combineStyle({
+							"--kb-select-content-transform-origin": "var(--kb-popper-content-transform-origin)",
+							position: "relative"
+						}, local.style);
+					},
+					onEscapeKeyDown,
+					onFocusOutside,
+					get onDismiss() {
+						return context.close;
+					}
+				}, () => context.dataset(), others));
+			} });
+		}
+	});
+}
+function SelectHiddenSelect(props) {
+	const context = useSelectContext();
+	return createComponent(HiddenSelectBase, mergeProps({
+		get collection() {
+			return context.listState().collection();
+		},
+		get selectionManager() {
+			return context.listState().selectionManager();
+		},
+		get isOpen() {
+			return context.isOpen();
+		},
+		get isMultiple() {
+			return context.isMultiple();
+		},
+		get isVirtualized() {
+			return context.isVirtualized();
+		},
+		focusTrigger: () => context.triggerRef()?.focus()
+	}, props));
+}
+function SelectIcon(props) {
+	const context = useSelectContext();
+	return createComponent(Polymorphic, mergeProps({
+		as: "span",
+		"aria-hidden": "true"
+	}, () => context.dataset(), mergeDefaultProps({ children: "▼" }, props)));
+}
+function SelectLabel(props) {
+	const context = useSelectContext();
+	const [local, others] = splitProps(props, ["onClick"]);
+	const onClick = (e) => {
+		callHandler(e, local.onClick);
+		if (!context.isDisabled()) context.triggerRef()?.focus();
+	};
+	return createComponent(FormControlLabel, mergeProps({
+		as: "span",
+		onClick
+	}, others));
+}
+function SelectListbox(props) {
+	const context = useSelectContext();
+	const [local, others] = splitProps(mergeDefaultProps({ id: context.generateId("listbox") }, props), [
+		"ref",
+		"id",
+		"onKeyDown"
+	]);
+	createEffect(() => onCleanup(context.registerListboxId(local.id)));
+	const onKeyDown = (e) => {
+		callHandler(e, local.onKeyDown);
+		if (e.key === "Escape") e.preventDefault();
+	};
+	return createComponent(ListboxRoot, mergeProps({
+		get id() {
+			return local.id;
+		},
+		get state() {
+			return context.listState();
+		},
+		get virtualized() {
+			return context.isVirtualized();
+		},
+		get autoFocus() {
+			return context.autoFocus();
+		},
+		shouldSelectOnPressUp: true,
+		shouldFocusOnHover: true,
+		get shouldFocusWrap() {
+			return context.shouldFocusWrap();
+		},
+		get disallowTypeAhead() {
+			return context.disallowTypeAhead();
+		},
+		get ["aria-labelledby"]() {
+			return context.listboxAriaLabelledBy();
+		},
+		get renderItem() {
+			return context.renderItem;
+		},
+		get renderSection() {
+			return context.renderSection;
+		},
+		onKeyDown
+	}, others));
+}
+function SelectPortal(props) {
+	const context = useSelectContext();
+	return createComponent(Show, {
+		get when() {
+			return context.contentPresent();
+		},
+		get children() {
+			return createComponent(Portal, props);
+		}
+	});
+}
+function SelectBase(props) {
+	const [local, popperProps, formControlProps, others] = splitProps(mergeDefaultProps({
+		id: `select-${createUniqueId()}`,
+		selectionMode: "single",
+		disallowEmptySelection: false,
+		closeOnSelection: props.selectionMode === "single",
+		allowDuplicateSelectionEvents: true,
+		gutter: 8,
+		sameWidth: true,
+		modal: false
+	}, props), [
+		"itemComponent",
+		"sectionComponent",
+		"open",
+		"defaultOpen",
+		"onOpenChange",
+		"value",
+		"defaultValue",
+		"onChange",
+		"placeholder",
+		"options",
+		"optionValue",
+		"optionTextValue",
+		"optionDisabled",
+		"optionGroupChildren",
+		"keyboardDelegate",
+		"allowDuplicateSelectionEvents",
+		"disallowEmptySelection",
+		"closeOnSelection",
+		"disallowTypeAhead",
+		"shouldFocusWrap",
+		"selectionBehavior",
+		"selectionMode",
+		"virtualized",
+		"modal",
+		"preventScroll",
+		"forceMount"
+	], [
+		"getAnchorRect",
+		"placement",
+		"gutter",
+		"shift",
+		"flip",
+		"slide",
+		"overlap",
+		"sameWidth",
+		"fitViewport",
+		"hideWhenDetached",
+		"detachedPadding",
+		"arrowPadding",
+		"overflowPadding"
+	], FORM_CONTROL_PROP_NAMES);
+	const [triggerId, setTriggerId] = createSignal();
+	const [valueId, setValueId] = createSignal();
+	const [listboxId, setListboxId] = createSignal();
+	const [triggerRef, setTriggerRef] = createSignal();
+	const [contentRef, setContentRef] = createSignal();
+	const [listboxRef, setListboxRef] = createSignal();
+	const [listboxAriaLabelledBy, setListboxAriaLabelledBy] = createSignal();
+	const [focusStrategy, setFocusStrategy] = createSignal(true);
+	const getOptionValue = (option) => {
+		const optionValue = local.optionValue;
+		if (optionValue == null) return String(option);
+		return String(isFunction(optionValue) ? optionValue(option) : option[optionValue]);
+	};
+	const flattenOptions = createMemo(() => {
+		const optionGroupChildren = local.optionGroupChildren;
+		if (optionGroupChildren == null) return local.options;
+		return local.options.flatMap((item) => item[optionGroupChildren] ?? item);
+	});
+	const flattenOptionKeys = createMemo(() => {
+		return flattenOptions().map((option) => getOptionValue(option));
+	});
+	const getOptionsFromValues = (values) => {
+		return [...values].map((value) => flattenOptions().find((option) => getOptionValue(option) === value)).filter((option) => option != null);
+	};
+	const disclosureState = createDisclosureState({
+		open: () => local.open,
+		defaultOpen: () => local.defaultOpen,
+		onOpenChange: (isOpen) => local.onOpenChange?.(isOpen)
+	});
+	const listState = createListState({
+		selectedKeys: () => {
+			if (local.value != null) return local.value.map(getOptionValue);
+			return local.value;
+		},
+		defaultSelectedKeys: () => {
+			if (local.defaultValue != null) return local.defaultValue.map(getOptionValue);
+			return local.defaultValue;
+		},
+		onSelectionChange: (selectedKeys) => {
+			local.onChange?.(getOptionsFromValues(selectedKeys));
+			if (local.closeOnSelection) close();
+		},
+		allowDuplicateSelectionEvents: () => access$1(local.allowDuplicateSelectionEvents),
+		disallowEmptySelection: () => access$1(local.disallowEmptySelection),
+		selectionBehavior: () => access$1(local.selectionBehavior),
+		selectionMode: () => local.selectionMode,
+		dataSource: () => local.options ?? [],
+		getKey: () => local.optionValue,
+		getTextValue: () => local.optionTextValue,
+		getDisabled: () => local.optionDisabled,
+		getSectionChildren: () => local.optionGroupChildren
+	});
+	const selectedOptions = createMemo(() => {
+		return getOptionsFromValues(listState.selectionManager().selectedKeys());
+	});
+	const removeOptionFromSelection = (option) => {
+		listState.selectionManager().toggleSelection(getOptionValue(option));
+	};
+	const { present: contentPresent } = index_default$1({
+		show: () => local.forceMount || disclosureState.isOpen(),
+		element: () => contentRef() ?? null
+	});
+	const focusListbox = () => {
+		const listboxEl = listboxRef();
+		if (listboxEl) focusWithoutScrolling(listboxEl);
+	};
+	const open = (focusStrategy2) => {
+		if (local.options.length <= 0) return;
+		setFocusStrategy(focusStrategy2);
+		disclosureState.open();
+		let focusedKey = listState.selectionManager().firstSelectedKey();
+		if (focusedKey == null) {
+			if (focusStrategy2 === "first") focusedKey = listState.collection().getFirstKey();
+			else if (focusStrategy2 === "last") focusedKey = listState.collection().getLastKey();
+		}
+		focusListbox();
+		listState.selectionManager().setFocused(true);
+		listState.selectionManager().setFocusedKey(focusedKey);
+	};
+	const close = () => {
+		disclosureState.close();
+		listState.selectionManager().setFocused(false);
+		listState.selectionManager().setFocusedKey(void 0);
+	};
+	const toggle = (focusStrategy2) => {
+		if (disclosureState.isOpen()) close();
+		else open(focusStrategy2);
+	};
+	const { formControlContext } = createFormControl(formControlProps);
+	createFormResetListener(triggerRef, () => {
+		const defaultSelectedKeys = local.defaultValue ? [...local.defaultValue].map(getOptionValue) : new Selection();
+		listState.selectionManager().setSelectedKeys(defaultSelectedKeys);
+	});
+	const collator = createCollator({
+		usage: "search",
+		sensitivity: "base"
+	});
+	const delegate = createMemo(() => {
+		const keyboardDelegate = access$1(local.keyboardDelegate);
+		if (keyboardDelegate) return keyboardDelegate;
+		return new ListKeyboardDelegate(listState.collection, void 0, collator);
+	});
+	const renderItem = (item) => {
+		return local.itemComponent?.({ item });
+	};
+	const renderSection = (section) => {
+		return local.sectionComponent?.({ section });
+	};
+	createEffect(on([flattenOptionKeys], ([flattenOptionKeys2]) => {
+		const keysToKeep = [...listState.selectionManager().selectedKeys()].filter((key) => flattenOptionKeys2.includes(key));
+		listState.selectionManager().setSelectedKeys(keysToKeep);
+	}, { defer: true }));
+	const dataset = createMemo(() => ({
+		"data-expanded": disclosureState.isOpen() ? "" : void 0,
+		"data-closed": !disclosureState.isOpen() ? "" : void 0
+	}));
+	const context = {
+		dataset,
+		isOpen: disclosureState.isOpen,
+		isDisabled: () => formControlContext.isDisabled() ?? false,
+		isMultiple: () => access$1(local.selectionMode) === "multiple",
+		isVirtualized: () => local.virtualized ?? false,
+		isModal: () => local.modal ?? false,
+		preventScroll: () => local.preventScroll ?? context.isModal(),
+		disallowTypeAhead: () => local.disallowTypeAhead ?? false,
+		shouldFocusWrap: () => local.shouldFocusWrap ?? false,
+		selectedOptions,
+		contentPresent,
+		autoFocus: focusStrategy,
+		triggerRef,
+		listState: () => listState,
+		keyboardDelegate: delegate,
+		triggerId,
+		valueId,
+		listboxId,
+		listboxAriaLabelledBy,
+		setListboxAriaLabelledBy,
+		setTriggerRef,
+		setContentRef,
+		setListboxRef,
+		open,
+		close,
+		toggle,
+		placeholder: () => local.placeholder,
+		renderItem,
+		renderSection,
+		removeOptionFromSelection,
+		generateId: createGenerateId(() => access$1(formControlProps.id)),
+		registerTriggerId: createRegisterId(setTriggerId),
+		registerValueId: createRegisterId(setValueId),
+		registerListboxId: createRegisterId(setListboxId)
+	};
+	return createComponent(FormControlContext.Provider, {
+		value: formControlContext,
+		get children() {
+			return createComponent(SelectContext.Provider, {
+				value: context,
+				get children() {
+					return createComponent(Popper, mergeProps({
+						anchorRef: triggerRef,
+						contentRef
+					}, popperProps, { get children() {
+						return createComponent(Polymorphic, mergeProps({
+							as: "div",
+							role: "group",
+							get id() {
+								return access$1(formControlProps.id);
+							}
+						}, () => formControlContext.dataset(), dataset, others));
+					} }));
+				}
+			});
+		}
+	});
+}
+function SelectRoot(props) {
+	const [local, others] = splitProps(props, [
+		"value",
+		"defaultValue",
+		"onChange",
+		"multiple"
+	]);
+	const value = createMemo(() => {
+		if (local.value != null) return local.multiple ? local.value : [local.value];
+		return local.value;
+	});
+	const defaultValue = createMemo(() => {
+		if (local.defaultValue != null) return local.multiple ? local.defaultValue : [local.defaultValue];
+		return local.defaultValue;
+	});
+	const onChange = (val) => {
+		if (val === value()) return;
+		if (local.multiple) local.onChange?.(val ?? []);
+		else local.onChange?.(val[0] ?? null);
+	};
+	return createComponent(SelectBase, mergeProps({
+		get value() {
+			return value();
+		},
+		get defaultValue() {
+			return defaultValue();
+		},
+		onChange,
+		get selectionMode() {
+			return local.multiple ? "multiple" : "single";
+		}
+	}, others));
+}
+function SelectTrigger(props) {
+	const formControlContext = useFormControlContext();
+	const context = useSelectContext();
+	const [local, formControlFieldProps, others] = splitProps(mergeDefaultProps({ id: context.generateId("trigger") }, props), [
+		"ref",
+		"disabled",
+		"onPointerDown",
+		"onClick",
+		"onKeyDown",
+		"onFocus",
+		"onBlur"
+	], FORM_CONTROL_FIELD_PROP_NAMES);
+	const selectionManager = () => context.listState().selectionManager();
+	const keyboardDelegate = () => context.keyboardDelegate();
+	const isDisabled = () => local.disabled || context.isDisabled();
+	const { fieldProps } = createFormControlField(formControlFieldProps);
+	const { typeSelectHandlers } = createTypeSelect({
+		keyboardDelegate,
+		selectionManager,
+		onTypeSelect: (key) => selectionManager().select(key)
+	});
+	const ariaLabelledBy = () => {
+		return [context.listboxAriaLabelledBy(), context.valueId()].filter(Boolean).join(" ") || void 0;
+	};
+	const onPointerDown = (e) => {
+		callHandler(e, local.onPointerDown);
+		e.currentTarget.dataset.pointerType = e.pointerType;
+		if (!isDisabled() && e.pointerType !== "touch" && e.button === 0) {
+			e.preventDefault();
+			context.toggle(true);
+		}
+	};
+	const onClick = (e) => {
+		callHandler(e, local.onClick);
+		if (!isDisabled() && e.currentTarget.dataset.pointerType === "touch") context.toggle(true);
+	};
+	const onKeyDown = (e) => {
+		callHandler(e, local.onKeyDown);
+		if (isDisabled()) return;
+		callHandler(e, typeSelectHandlers.onKeyDown);
+		switch (e.key) {
+			case "Enter":
+			case " ":
+			case "ArrowDown":
+				e.stopPropagation();
+				e.preventDefault();
+				context.toggle("first");
+				break;
+			case "ArrowUp":
+				e.stopPropagation();
+				e.preventDefault();
+				context.toggle("last");
+				break;
+			case "ArrowLeft": {
+				e.preventDefault();
+				if (context.isMultiple()) return;
+				const firstSelectedKey = selectionManager().firstSelectedKey();
+				const key = firstSelectedKey != null ? keyboardDelegate().getKeyAbove?.(firstSelectedKey) : keyboardDelegate().getFirstKey?.();
+				if (key != null) selectionManager().select(key);
+				break;
+			}
+			case "ArrowRight": {
+				e.preventDefault();
+				if (context.isMultiple()) return;
+				const firstSelectedKey = selectionManager().firstSelectedKey();
+				const key = firstSelectedKey != null ? keyboardDelegate().getKeyBelow?.(firstSelectedKey) : keyboardDelegate().getFirstKey?.();
+				if (key != null) selectionManager().select(key);
+				break;
+			}
+		}
+	};
+	const onFocus = (e) => {
+		callHandler(e, local.onFocus);
+		if (selectionManager().isFocused()) return;
+		selectionManager().setFocused(true);
+	};
+	const onBlur = (e) => {
+		callHandler(e, local.onBlur);
+		if (context.isOpen()) return;
+		selectionManager().setFocused(false);
+	};
+	createEffect(() => onCleanup(context.registerTriggerId(fieldProps.id())));
+	createEffect(() => {
+		context.setListboxAriaLabelledBy([fieldProps.ariaLabelledBy(), fieldProps.ariaLabel() && !fieldProps.ariaLabelledBy() ? fieldProps.id() : null].filter(Boolean).join(" ") || void 0);
+	});
+	return createComponent(ButtonRoot, mergeProps({
+		get id() {
+			return fieldProps.id();
+		},
+		get disabled() {
+			return isDisabled();
+		},
+		"aria-haspopup": "listbox",
+		get ["aria-expanded"]() {
+			return context.isOpen();
+		},
+		get ["aria-controls"]() {
+			return context.isOpen() ? context.listboxId() : void 0;
+		},
+		get ["aria-label"]() {
+			return fieldProps.ariaLabel();
+		},
+		get ["aria-labelledby"]() {
+			return ariaLabelledBy();
+		},
+		get ["aria-describedby"]() {
+			return fieldProps.ariaDescribedBy();
+		},
+		onPointerDown,
+		onClick,
+		onKeyDown,
+		onFocus,
+		onBlur
+	}, () => context.dataset(), () => formControlContext.dataset(), others));
+}
+function SelectValue(props) {
+	const formControlContext = useFormControlContext();
+	const context = useSelectContext();
+	const [local, others] = splitProps(mergeDefaultProps({ id: context.generateId("value") }, props), ["id", "children"]);
+	const selectionManager = () => context.listState().selectionManager();
+	const isSelectionEmpty = () => {
+		const selectedKeys = selectionManager().selectedKeys();
+		if (selectedKeys.size === 1 && selectedKeys.has("")) return true;
+		return selectionManager().isEmpty();
+	};
+	createEffect(() => onCleanup(context.registerValueId(local.id)));
+	return createComponent(Polymorphic, mergeProps({
+		as: "span",
+		get id() {
+			return local.id;
+		},
+		get ["data-placeholder-shown"]() {
+			return isSelectionEmpty() ? "" : void 0;
+		}
+	}, () => formControlContext.dataset(), others, { get children() {
+		return createComponent(Show, {
+			get when() {
+				return !isSelectionEmpty();
+			},
+			get fallback() {
+				return context.placeholder();
+			},
+			get children() {
+				return createComponent(SelectValueChild, {
+					state: {
+						selectedOption: () => context.selectedOptions()[0],
+						selectedOptions: () => context.selectedOptions(),
+						remove: (option) => context.removeOptionFromSelection(option),
+						clear: () => selectionManager().clearSelection()
+					},
+					get children() {
+						return local.children;
+					}
+				});
+			}
+		});
+	} }));
+}
+function SelectValueChild(props) {
+	return children(() => {
+		const body = props.children;
+		return isFunction(body) ? body(props.state) : body;
+	})();
+}
+var Select = Object.assign(SelectRoot, {
+	Arrow: PopperArrow,
+	Content: SelectContent,
+	Description: FormControlDescription,
+	ErrorMessage: FormControlErrorMessage,
+	HiddenSelect: SelectHiddenSelect,
+	Icon: SelectIcon,
+	Item: ListboxItem,
+	ItemDescription: ListboxItemDescription,
+	ItemIndicator: ListboxItemIndicator,
+	ItemLabel: ListboxItemLabel,
+	Label: SelectLabel,
+	Listbox: SelectListbox,
+	Portal: SelectPortal,
+	Section: ListboxSection,
+	Trigger: SelectTrigger,
+	Value: SelectValue
+});
+var object_module_default = {
+	panel: "_panel_t1ok6_19",
+	fields: "_fields_t1ok6_23",
+	identity: "_identity_t1ok6_32",
+	label: "_label_t1ok6_38",
+	control: "_control_t1ok6_43",
+	trigger: "_trigger_t1ok6_50",
+	selectContent: "_selectContent_t1ok6_65",
+	listbox: "_listbox_t1ok6_75",
+	option: "_option_t1ok6_83",
+	content: "_content_t1ok6_101",
+	addressing: "_addressing_t1ok6_102",
+	actions: "_actions_t1ok6_118",
+	reset: "_reset_t1ok6_126",
+	message: "_message_t1ok6_151"
+};
+var { graphql } = import_relay_runtime?.default?.default?.__esModule ? import_relay_runtime.default.default : import_relay_runtime?.default?.__esModule ? import_relay_runtime.default : import_relay_runtime;
+var _tmpl$ = ["<main", "><p role=\"alert\">Instance not found.</p></main>"];
+var _tmpl$2 = ["<span", ">Optional</span>"];
+var _tmpl$3 = ["<span", ">Required</span>"];
+var _tmpl$4 = ["<span", ">JSON</span>"];
+var _tmpl$5 = ["<p", ">Create an actor in this instance before creating an object.</p>"];
+var _tmpl$6 = [
+	"<main",
+	"><!--$-->",
+	"<!--/--><section class=\"",
+	"\" aria-labelledby=\"create-object-title\"><header",
+	"><h1 id=\"create-object-title\">Create Object</h1><p>Selected Instance: <!--$-->",
+	"<!--/--></p></header><form",
+	"><fieldset",
+	"",
+	"><div",
+	"><!--$-->",
+	"<!--/--><label",
+	"><span",
+	">Type</span><select class=\"",
+	"\" name=\"type\"><option value=\"Note\" selected>Note</option><option value=\"Article\">Article</option></select></label></div><!--$-->",
+	"<!--/--><!--$-->",
+	"<!--/--><!--$-->",
+	"<!--/--><!--$-->",
+	"<!--/--><div",
+	"><button",
+	" type=\"reset\">Reset</button><button",
+	" type=\"submit\"",
+	">",
+	"</button></div></fieldset></form></section></main>"
+];
+var id$$ = "src/routes/workspace/create/[instance_id]/objects.tsx?pick=default&pick=$css&lang.tsx";
+var instanceActorListQuery = node$1;
+var createObjectMutation = node;
+var recipientsSchema = optional(array(pipe(string(), url())), []);
+object({
+	actor: pipe(string("Select an actor."), nonEmpty("Select an actor.")),
+	name: string(),
+	contentHtml: pipe(string(), check((content) => content.trim() !== "", "Enter content.")),
+	type: picklist(["Note", "Article"]),
+	addressing: strictObject({
+		to: recipientsSchema,
+		cc: recipientsSchema,
+		bto: recipientsSchema,
+		bcc: recipientsSchema,
+		audience: recipientsSchema
+	})
+});
+var actorOptions = (edges) => edges.map(({ node }) => ({
+	id: node.id,
+	label: actorLabel(node)
+}));
+function CreateObjectsPage(props) {
+	const data = createPreloadedQuery(instanceActorListQuery, () => props.data);
+	const actors = () => data()?.instance?.actors?.edges;
+	const [currentActor, setCurrentActor] = createSignal(null);
+	const [commitCreateObject, isCreating] = createMutation(createObjectMutation);
+	const [message, setMessage] = createSignal("");
+	return createComponent(Show, {
+		get when() {
+			return actors();
+		},
+		get fallback() {
+			return ssr(_tmpl$, ssrHydrationKey() + ssrAttribute("class", escape(form_module_default.page, true), false));
+		},
+		children: (actorList) => ssr(_tmpl$6, ssrHydrationKey() + ssrAttribute("class", escape(form_module_default.page, true), false), escape(createComponent(Title, { children: "Create Object" })), `${escape(form_module_default.panel, true)} ${escape(object_module_default.panel, true)}`, ssrAttribute("class", escape(form_module_default.header, true), false), escape(data()?.instance?.host), ssrAttribute("class", escape(form_module_default.form, true), false) + ssrAttribute("aria-busy", escape(isCreating(), true), false), ssrAttribute("class", escape(object_module_default.fields, true), false), ssrAttribute("disabled", isCreating(), true), ssrAttribute("class", escape(object_module_default.identity, true), false), escape(createComponent(Select, {
+			get ["class"]() {
+				return form_module_default.field;
+			},
+			get disabled() {
+				return isCreating();
+			},
+			get value() {
+				return currentActor() ?? actorOptions(actorList())[0] ?? null;
+			},
+			onChange: setCurrentActor,
+			optionValue: "id",
+			optionTextValue: "label",
+			placeholder: "Select Handle",
+			get options() {
+				return actorOptions(actorList());
+			},
+			itemComponent: (itemProps) => createComponent(Select.Item, {
+				get ["class"]() {
+					return object_module_default.option;
+				},
+				get item() {
+					return itemProps.item;
+				},
+				get children() {
+					return [createComponent(Select.ItemLabel, { get children() {
+						return itemProps.item.rawValue.label;
+					} }), createComponent(Select.ItemIndicator, {
+						"aria-hidden": "true",
+						children: "✓"
+					})];
+				}
+			}),
+			get children() {
+				return [
+					createComponent(Select.Label, {
+						get ["class"]() {
+							return object_module_default.label;
+						},
+						children: "Actor"
+					}),
+					createComponent(Select.Trigger, {
+						get ["class"]() {
+							return `${form_module_default.input} ${object_module_default.control} ${object_module_default.trigger}`;
+						},
+						type: "button",
+						get children() {
+							return [createComponent(Select.Value, { children: (state) => state.selectedOption().label }), createComponent(Select.Icon, {
+								"aria-hidden": "true",
+								children: "▾"
+							})];
+						}
+					}),
+					createComponent(Select.Portal, { get children() {
+						return createComponent(Select.Content, {
+							get ["class"]() {
+								return object_module_default.selectContent;
+							},
+							get children() {
+								return createComponent(Select.Listbox, { get ["class"]() {
+									return object_module_default.listbox;
+								} });
+							}
+						});
+					} })
+				];
+			}
+		})), ssrAttribute("class", escape(form_module_default.field, true), false), ssrAttribute("class", escape(object_module_default.label, true), false), `${escape(form_module_default.input, true)} ${escape(object_module_default.control, true)}`, escape(createComponent(TextField, {
+			get ["class"]() {
+				return form_module_default.field;
+			},
+			name: "name",
+			defaultValue: "",
+			get children() {
+				return [createComponent(TextField.Label, {
+					get ["class"]() {
+						return form_module_default.fieldHeading;
+					},
+					get children() {
+						return ["Name ", ssr(_tmpl$2, ssrHydrationKey() + ssrAttribute("class", escape(form_module_default.fieldStatus, true), false))];
+					}
+				}), createComponent(TextField.Input, {
+					get ["class"]() {
+						return form_module_default.input;
+					},
+					placeholder: "Object title"
+				})];
+			}
+		})), escape(createComponent(TextField, {
+			get ["class"]() {
+				return form_module_default.field;
+			},
+			name: "content",
+			required: true,
+			get children() {
+				return [
+					createComponent(TextField.Label, {
+						get ["class"]() {
+							return form_module_default.fieldHeading;
+						},
+						get children() {
+							return ["Content ", ssr(_tmpl$3, ssrHydrationKey() + ssrAttribute("class", escape(form_module_default.required, true), false))];
+						}
+					}),
+					createComponent(TextField.TextArea, {
+						get ["class"]() {
+							return `${form_module_default.input} ${object_module_default.content}`;
+						},
+						rows: 8,
+						placeholder: "<p>Write your content here.</p>"
+					}),
+					createComponent(TextField.Description, {
+						get ["class"]() {
+							return form_module_default.hint;
+						},
+						children: "HTML content is stored as entered. This object will not be delivered to remote servers."
+					})
+				];
+			}
+		})), escape(createComponent(TextField, {
+			get ["class"]() {
+				return form_module_default.field;
+			},
+			name: "addressing",
+			defaultValue: "{}",
+			get children() {
+				return [
+					createComponent(TextField.Label, {
+						get ["class"]() {
+							return form_module_default.fieldHeading;
+						},
+						get children() {
+							return ["Addressing ", ssr(_tmpl$4, ssrHydrationKey() + ssrAttribute("class", escape(form_module_default.fieldStatus, true), false))];
+						}
+					}),
+					createComponent(TextField.TextArea, {
+						get ["class"]() {
+							return `${form_module_default.input} ${object_module_default.addressing}`;
+						},
+						rows: 4,
+						spellcheck: false
+					}),
+					createComponent(TextField.Description, {
+						get ["class"]() {
+							return form_module_default.hint;
+						},
+						get children() {
+							return [
+								"Use to, cc, bto, bcc, or audience with arrays of recipient URLs. Leave ",
+								"{}",
+								" for no recipients."
+							];
+						}
+					})
+				];
+			}
+		})), escape(createComponent(Show, {
+			get when() {
+				return actorList().length === 0;
+			},
+			get children() {
+				return ssr(_tmpl$5, ssrHydrationKey() + ssrAttribute("class", escape(form_module_default.hint, true), false));
+			}
+		})), ssrAttribute("class", escape(object_module_default.actions, true), false), ssrAttribute("class", escape(object_module_default.reset, true), false), ssrAttribute("class", escape(form_module_default.button, true), false), ssrAttribute("disabled", isCreating() || (actors()?.length ?? 0) === 0, true), isCreating() ? "Creating…" : "Create Object")
+	});
+}
+//#endregion
+export { CreateObjectsPage as default, id$$ };