@solid2-aria/components 0.0.0-stage → 0.0.1

package/dist/server/combo-box.js

@@ -0,0 +1,914 @@
+/*
+ * Copyright 2022 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+/*
+ * Derived from Adobe React Spectrum: packages/react-aria-components/src/ComboBox.tsx.
+ * Modified for Solid Aria: adapted collection ownership, contexts, accessibility primitives, and reactive properties for Solid 2; uses Solid class props.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { createContextProps, createRenderProps, createSlot, createSlottedContext, dom } from "./utils.js";
+import { FieldInputContext } from "./autocomplete.js";
+import { LabelContext } from "./label.js";
+import { ButtonContext } from "./button.js";
+import { TextContext } from "./text.js";
+import { FieldErrorContext } from "./field-error.js";
+import { FormContext } from "./form.js";
+import { GroupContext } from "./group.js";
+import { InputContext } from "./input.js";
+import { ListBoxContext, ListStateContext } from "./list-box.js";
+import { OverlayTriggerStateContext } from "./overlay-contexts.js";
+import { PopoverContext } from "./popover.js";
+import { mergeProps } from "@solid2-aria/core/utils/merge-props";
+import { For, createContext, createMemo, createSignal, merge, omit, untrack, useContext } from "solid-js";
+import { applyRef, escape, memo, mergeProps as mergeProps$1, ssr, ssrAttribute, ssrGroup, ssrHydrationKey } from "@solidjs/web";
+import { BaseCollection } from "@solid2-aria/core/collections/base-collection";
+import { CollectionBuilder } from "@solid2-aria/core/collections/collection-builder";
+import { filterDOMProps } from "@solid2-aria/core/utils/filter-dom-props";
+import { isTruthy } from "@solid2-aria/core/utils/truthy";
+import { createIsHidden } from "@solid2-aria/core/collections/hidden";
+import { createComboBox } from "@solid2-aria/core/combobox/create-combo-box";
+import { createFilter } from "@solid2-aria/core/i18n/create-filter";
+import { createListFormatter } from "@solid2-aria/core/i18n/create-list-formatter";
+import { createComboBoxState } from "@solid2-aria/stately/combobox/create-combo-box-state";
+// src/combo-box.tsx
+var _tmpl$ = [
+	"<input",
+	" type=\"hidden\"",
+	"",
+	"",
+	">"
+];
+var _m$ = Symbol();
+var _m$2 = Symbol();
+var _m$3 = Symbol();
+var _m$4 = Symbol();
+var _m$5 = Symbol();
+var _m$6 = Symbol();
+var _m$7 = Symbol();
+var _m$8 = Symbol();
+var _m$9 = Symbol();
+var _m$10 = Symbol();
+var _m$11 = Symbol();
+var _m$12 = Symbol();
+var _m$13 = Symbol();
+var _m$14 = Symbol();
+var _m$15 = Symbol();
+var _d$ = {
+	get() {
+		const content = this[_m$];
+		return content();
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$(_p, _p2) {
+	this[_m$] = _p;
+	this.value = _p2;
+	Object.defineProperty(this, "children", _d$);
+}
+_P$.prototype = Object.prototype;
+var _d$2 = {
+	get() {
+		const content = this[_m$];
+		const props = this[_m$2];
+		return ListBoxContext(new _P$(content, { get items() {
+			return props.items ?? props.defaultItems;
+		} }));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$2(_p3, _p4, _p5, _p6) {
+	this[_m$] = _p3;
+	this[_m$2] = _p4;
+	this.createCollection = _p5;
+	Object.defineProperty(this, "content", _d$2);
+	this.children = _p6;
+}
+_P$2.prototype = Object.prototype;
+var _d$3 = {
+	get() {
+		const content = this[_m$];
+		const props = this[_m$2];
+		const setRef = this[_m$3];
+		return CollectionBuilder(new _P$2(content, props, () => new BaseCollection(), (collection) => ComboBoxInner({
+			props,
+			collection,
+			comboRef: setRef
+		})));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$3(_p7, _p8, _p9, _p0) {
+	this[_m$] = _p7;
+	this[_m$2] = _p8;
+	this[_m$3] = _p9;
+	this.value = _p0;
+	Object.defineProperty(this, "children", _d$3);
+}
+_P$3.prototype = Object.prototype;
+var _d$4 = {
+	get() {
+		const hiddenValues = this[_m$];
+		return hiddenValues();
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$4(_p1, _p10) {
+	this[_m$] = _p1;
+	Object.defineProperty(this, "each", _d$4);
+	this.children = _p10;
+}
+_P$4.prototype = Object.prototype;
+var _d$5 = {
+	get() {
+		return this[_m$2].slot ?? void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$6 = {
+	get() {
+		return this[_m$3].isFocused || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$7 = {
+	get() {
+		return this[_m$3].isOpen || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$8 = {
+	get() {
+		return this[_m$2].isDisabled ?? void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$9 = {
+	get() {
+		return this[_m$4].isInvalid || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$10 = {
+	get() {
+		return this[_m$2].isRequired ?? void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$11 = {
+	get() {
+		return this[_m$2].isReadOnly ?? void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$12 = {
+	get() {
+		const render = this[_m$5];
+		const props = this[_m$2];
+		const textFormValue = this[_m$6];
+		const hiddenValues = this[_m$7];
+		return [memo(() => {
+			return render.children;
+		}), memo(() => {
+			return memo(() => {
+				return !!(Boolean(props.name) && !textFormValue());
+			})() ? For(new _P$4(hiddenValues, (value) => {
+				var _v$ = ssrHydrationKey(), _g$ = ssrGroup(() => {
+					return [ssrAttribute("name", escape(props.name, true)), ssrAttribute("form", escape(props.form, true))];
+				}, 2);
+				return ssr(_tmpl$, _v$, _g$, _g$, ssrAttribute("value", escape(value ?? "", true)));
+			})) : null;
+		})];
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$5(_p11, _p12, _p13, _p14, _p15, _p16, _p17) {
+	this[_m$] = _p11;
+	this[_m$2] = _p12;
+	this[_m$3] = _p13;
+	this[_m$4] = _p14;
+	this[_m$5] = _p15;
+	this[_m$6] = _p16;
+	this[_m$7] = _p17;
+	this.ref = (r$) => {
+		const input = this[_m$];
+		var _ref$ = input.comboRef;
+		typeof _ref$ === "function" || Array.isArray(_ref$) ? applyRef(_ref$, r$) : input.comboRef = r$;
+	};
+	Object.defineProperty(this, "slot", _d$5);
+	Object.defineProperty(this, "data-focused", _d$6);
+	Object.defineProperty(this, "data-open", _d$7);
+	Object.defineProperty(this, "data-disabled", _d$8);
+	Object.defineProperty(this, "data-invalid", _d$9);
+	Object.defineProperty(this, "data-required", _d$10);
+	Object.defineProperty(this, "data-readonly", _d$11);
+	Object.defineProperty(this, "children", _d$12);
+}
+_P$5.prototype = Object.prototype;
+var _d$13 = {
+	get() {
+		return this[_m$].valueProps;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$14 = {
+	get() {
+		const props = this[_m$2];
+		const render = this[_m$3];
+		const input = this[_m$4];
+		const state = this[_m$5];
+		const aria = this[_m$];
+		const textFormValue = this[_m$6];
+		const hiddenValues = this[_m$7];
+		return dom.div(mergeProps$1(() => {
+			return omit(filterDOMProps(props, { global: true }), "id");
+		}, render, new _P$5(input, props, state, aria, render, textFormValue, hiddenValues)));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$6(_p18, _p19, _p20, _p21, _p22, _p23, _p24) {
+	this[_m$] = _p18;
+	this[_m$2] = _p19;
+	this[_m$3] = _p20;
+	this[_m$4] = _p21;
+	this[_m$5] = _p22;
+	this[_m$6] = _p23;
+	this[_m$7] = _p24;
+	Object.defineProperty(this, "value", _d$13);
+	Object.defineProperty(this, "children", _d$14);
+}
+_P$6.prototype = Object.prototype;
+var _d$15 = {
+	get() {
+		const aria = this[_m$];
+		const props = this[_m$2];
+		const render = this[_m$3];
+		const input = this[_m$4];
+		const state = this[_m$5];
+		const textFormValue = this[_m$6];
+		const hiddenValues = this[_m$7];
+		return ComboBoxValueContext(new _P$6(aria, props, render, input, state, textFormValue, hiddenValues));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$7(_p25, _p26, _p27, _p28, _p29, _p30, _p31, _p32) {
+	this[_m$] = _p25;
+	this[_m$2] = _p26;
+	this[_m$3] = _p27;
+	this[_m$4] = _p28;
+	this[_m$5] = _p29;
+	this[_m$6] = _p30;
+	this[_m$7] = _p31;
+	this.value = _p32;
+	Object.defineProperty(this, "children", _d$15);
+}
+_P$7.prototype = Object.prototype;
+var _d$16 = {
+	get() {
+		const aria = this[_m$];
+		const props = this[_m$2];
+		const render = this[_m$3];
+		const input = this[_m$4];
+		const state = this[_m$5];
+		const textFormValue = this[_m$6];
+		const hiddenValues = this[_m$7];
+		return FieldErrorContext(new _P$7(aria, props, render, input, state, textFormValue, hiddenValues, aria));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$8(_p33, _p34, _p35, _p36, _p37, _p38, _p39, _p40) {
+	this[_m$] = _p33;
+	this[_m$2] = _p34;
+	this[_m$3] = _p35;
+	this[_m$4] = _p36;
+	this[_m$5] = _p37;
+	this[_m$6] = _p38;
+	this[_m$7] = _p39;
+	this.value = _p40;
+	Object.defineProperty(this, "children", _d$16);
+}
+_P$8.prototype = Object.prototype;
+var _d$17 = {
+	get() {
+		const aria = this[_m$];
+		const props = this[_m$2];
+		const render = this[_m$3];
+		const input = this[_m$4];
+		const state = this[_m$5];
+		const textFormValue = this[_m$6];
+		const hiddenValues = this[_m$7];
+		const setGroupRef = this[_m$8];
+		return GroupContext(new _P$8(aria, props, render, input, state, textFormValue, hiddenValues, {
+			get isDisabled() {
+				return props.isDisabled === true;
+			},
+			get isInvalid() {
+				return aria.isInvalid;
+			},
+			ref: (element) => {
+				setGroupRef(element);
+			}
+		}));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$9(_p41, _p42, _p43, _p44, _p45, _p46, _p47, _p48, _p49) {
+	this[_m$] = _p41;
+	this[_m$2] = _p42;
+	this[_m$3] = _p43;
+	this[_m$4] = _p44;
+	this[_m$5] = _p45;
+	this[_m$6] = _p46;
+	this[_m$7] = _p47;
+	this[_m$8] = _p48;
+	this.value = _p49;
+	Object.defineProperty(this, "children", _d$17);
+}
+_P$9.prototype = Object.prototype;
+var _d$18 = {
+	get() {
+		const aria = this[_m$];
+		const props = this[_m$2];
+		const render = this[_m$3];
+		const input = this[_m$4];
+		const state = this[_m$5];
+		const textFormValue = this[_m$6];
+		const hiddenValues = this[_m$7];
+		const setGroupRef = this[_m$8];
+		return TextContext(new _P$9(aria, props, render, input, state, textFormValue, hiddenValues, setGroupRef, { slots: {
+			get description() {
+				return aria.descriptionProps;
+			},
+			get errorMessage() {
+				return aria.errorMessageProps;
+			}
+		} }));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$10(_p50, _p51, _p52, _p53, _p54, _p55, _p56, _p57, _p58) {
+	this[_m$] = _p50;
+	this[_m$2] = _p51;
+	this[_m$3] = _p52;
+	this[_m$4] = _p53;
+	this[_m$5] = _p54;
+	this[_m$6] = _p55;
+	this[_m$7] = _p56;
+	this[_m$8] = _p57;
+	this.value = _p58;
+	Object.defineProperty(this, "children", _d$18);
+}
+_P$10.prototype = Object.prototype;
+var _d$19 = {
+	get() {
+		const aria = this[_m$];
+		const setListBoxRef = this[_m$2];
+		return mergeProps(merge(() => aria.listBoxProps ?? {}), { ref: (element) => {
+			setListBoxRef(element);
+		} });
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$20 = {
+	get() {
+		const aria = this[_m$];
+		const props = this[_m$3];
+		const render = this[_m$4];
+		const input = this[_m$5];
+		const state = this[_m$6];
+		const textFormValue = this[_m$7];
+		const hiddenValues = this[_m$8];
+		const setGroupRef = this[_m$9];
+		return ListStateContext(new _P$10(aria, props, render, input, state, textFormValue, hiddenValues, setGroupRef, state));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$11(_p59, _p60, _p61, _p62, _p63, _p64, _p65, _p66, _p67) {
+	this[_m$] = _p59;
+	this[_m$2] = _p60;
+	this[_m$3] = _p61;
+	this[_m$4] = _p62;
+	this[_m$5] = _p63;
+	this[_m$6] = _p64;
+	this[_m$7] = _p65;
+	this[_m$8] = _p66;
+	this[_m$9] = _p67;
+	Object.defineProperty(this, "value", _d$19);
+	Object.defineProperty(this, "children", _d$20);
+}
+_P$11.prototype = Object.prototype;
+var _d$21 = {
+	get() {
+		const aria = this[_m$];
+		const setListBoxRef = this[_m$2];
+		const props = this[_m$3];
+		const render = this[_m$4];
+		const input = this[_m$5];
+		const state = this[_m$6];
+		const textFormValue = this[_m$7];
+		const hiddenValues = this[_m$8];
+		const setGroupRef = this[_m$9];
+		return ListBoxContext(new _P$11(aria, setListBoxRef, props, render, input, state, textFormValue, hiddenValues, setGroupRef));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$12(_p68, _p69, _p70, _p71, _p72, _p73, _p74, _p75, _p76, _p77) {
+	this[_m$] = _p68;
+	this[_m$2] = _p69;
+	this[_m$3] = _p70;
+	this[_m$4] = _p71;
+	this[_m$5] = _p72;
+	this[_m$6] = _p73;
+	this[_m$7] = _p74;
+	this[_m$8] = _p75;
+	this[_m$9] = _p76;
+	this.value = _p77;
+	Object.defineProperty(this, "children", _d$21);
+}
+_P$12.prototype = Object.prototype;
+var _d$22 = {
+	get() {
+		const aria = this[_m$];
+		const setListBoxRef = this[_m$2];
+		const props = this[_m$3];
+		const render = this[_m$4];
+		const input = this[_m$5];
+		const state = this[_m$6];
+		const textFormValue = this[_m$7];
+		const hiddenValues = this[_m$8];
+		const setGroupRef = this[_m$9];
+		const setPopoverRef = this[_m$10];
+		const listBoxRef = this[_m$11];
+		const triggerRef = this[_m$12];
+		return PopoverContext(new _P$12(aria, setListBoxRef, props, render, input, state, textFormValue, hiddenValues, setGroupRef, {
+			clearContexts: [
+				LabelContext,
+				ButtonContext,
+				InputContext,
+				FieldInputContext,
+				GroupContext,
+				TextContext
+			],
+			isNonModal: true,
+			get placement() {
+				return "bottom start";
+			},
+			ref: (element) => {
+				setPopoverRef(element);
+			},
+			scrollRef: listBoxRef,
+			trigger: "ComboBox",
+			triggerRef
+		}));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$13(_p78, _p79, _p80, _p81, _p82, _p83, _p84, _p85, _p86, _p87, _p88, _p89, _p90) {
+	this[_m$] = _p78;
+	this[_m$2] = _p79;
+	this[_m$3] = _p80;
+	this[_m$4] = _p81;
+	this[_m$5] = _p82;
+	this[_m$6] = _p83;
+	this[_m$7] = _p84;
+	this[_m$8] = _p85;
+	this[_m$9] = _p86;
+	this[_m$10] = _p87;
+	this[_m$11] = _p88;
+	this[_m$12] = _p89;
+	this.value = _p90;
+	Object.defineProperty(this, "children", _d$22);
+}
+_P$13.prototype = Object.prototype;
+var _d$23 = {
+	get() {
+		const aria = this[_m$];
+		const state = this[_m$2];
+		const setInputRef = this[_m$3];
+		return mergeProps(omit(merge(() => aria.inputProps), "value", "onChange", "id", "onFocus", "onBlur"), {
+			onChange: (value) => {
+				state.setInputValue(value);
+			},
+			ref: (element) => {
+				setInputRef(element);
+			},
+			get value() {
+				return state.inputValue;
+			}
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$24 = {
+	get() {
+		const aria = this[_m$];
+		const setListBoxRef = this[_m$4];
+		const props = this[_m$5];
+		const render = this[_m$6];
+		const input = this[_m$7];
+		const state = this[_m$2];
+		const textFormValue = this[_m$8];
+		const hiddenValues = this[_m$9];
+		const setGroupRef = this[_m$10];
+		const setPopoverRef = this[_m$11];
+		const listBoxRef = this[_m$12];
+		const triggerRef = this[_m$13];
+		return OverlayTriggerStateContext(new _P$13(aria, setListBoxRef, props, render, input, state, textFormValue, hiddenValues, setGroupRef, setPopoverRef, listBoxRef, triggerRef, state));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$14(_p91, _p92, _p93, _p94, _p95, _p96, _p97, _p98, _p99, _p100, _p101, _p102, _p103) {
+	this[_m$] = _p91;
+	this[_m$2] = _p92;
+	this[_m$3] = _p93;
+	this[_m$4] = _p94;
+	this[_m$5] = _p95;
+	this[_m$6] = _p96;
+	this[_m$7] = _p97;
+	this[_m$8] = _p98;
+	this[_m$9] = _p99;
+	this[_m$10] = _p100;
+	this[_m$11] = _p101;
+	this[_m$12] = _p102;
+	this[_m$13] = _p103;
+	Object.defineProperty(this, "value", _d$23);
+	Object.defineProperty(this, "children", _d$24);
+}
+_P$14.prototype = Object.prototype;
+var _d$25 = {
+	get() {
+		const aria = this[_m$];
+		const setInputRef = this[_m$2];
+		return mergeProps(merge(() => aria.inputProps ?? {}), { ref: (element) => {
+			setInputRef(element);
+		} });
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$26 = {
+	get() {
+		const aria = this[_m$];
+		const state = this[_m$3];
+		const setInputRef = this[_m$2];
+		const setListBoxRef = this[_m$4];
+		const props = this[_m$5];
+		const render = this[_m$6];
+		const input = this[_m$7];
+		const textFormValue = this[_m$8];
+		const hiddenValues = this[_m$9];
+		const setGroupRef = this[_m$10];
+		const setPopoverRef = this[_m$11];
+		const listBoxRef = this[_m$12];
+		const triggerRef = this[_m$13];
+		return FieldInputContext(new _P$14(aria, state, setInputRef, setListBoxRef, props, render, input, textFormValue, hiddenValues, setGroupRef, setPopoverRef, listBoxRef, triggerRef));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$15(_p104, _p105, _p106, _p107, _p108, _p109, _p110, _p111, _p112, _p113, _p114, _p115, _p116) {
+	this[_m$] = _p104;
+	this[_m$2] = _p105;
+	this[_m$3] = _p106;
+	this[_m$4] = _p107;
+	this[_m$5] = _p108;
+	this[_m$6] = _p109;
+	this[_m$7] = _p110;
+	this[_m$8] = _p111;
+	this[_m$9] = _p112;
+	this[_m$10] = _p113;
+	this[_m$11] = _p114;
+	this[_m$12] = _p115;
+	this[_m$13] = _p116;
+	Object.defineProperty(this, "value", _d$25);
+	Object.defineProperty(this, "children", _d$26);
+}
+_P$15.prototype = Object.prototype;
+var _d$27 = {
+	get() {
+		const aria = this[_m$];
+		const state = this[_m$2];
+		const setButtonRef = this[_m$3];
+		return mergeProps(merge(() => aria.buttonProps ?? {}), {
+			get isPressed() {
+				return state.isOpen;
+			},
+			ref: (element) => {
+				setButtonRef(element);
+			}
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$28 = {
+	get() {
+		const aria = this[_m$];
+		const setInputRef = this[_m$4];
+		const state = this[_m$2];
+		const setListBoxRef = this[_m$5];
+		const props = this[_m$6];
+		const render = this[_m$7];
+		const input = this[_m$8];
+		const textFormValue = this[_m$9];
+		const hiddenValues = this[_m$10];
+		const setGroupRef = this[_m$11];
+		const setPopoverRef = this[_m$12];
+		const listBoxRef = this[_m$13];
+		const triggerRef = this[_m$14];
+		return InputContext(new _P$15(aria, setInputRef, state, setListBoxRef, props, render, input, textFormValue, hiddenValues, setGroupRef, setPopoverRef, listBoxRef, triggerRef));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$16(_p117, _p118, _p119, _p120, _p121, _p122, _p123, _p124, _p125, _p126, _p127, _p128, _p129, _p130) {
+	this[_m$] = _p117;
+	this[_m$2] = _p118;
+	this[_m$3] = _p119;
+	this[_m$4] = _p120;
+	this[_m$5] = _p121;
+	this[_m$6] = _p122;
+	this[_m$7] = _p123;
+	this[_m$8] = _p124;
+	this[_m$9] = _p125;
+	this[_m$10] = _p126;
+	this[_m$11] = _p127;
+	this[_m$12] = _p128;
+	this[_m$13] = _p129;
+	this[_m$14] = _p130;
+	Object.defineProperty(this, "value", _d$27);
+	Object.defineProperty(this, "children", _d$28);
+}
+_P$16.prototype = Object.prototype;
+var _d$29 = {
+	get() {
+		const aria = this[_m$];
+		const registerLabel = this[_m$2];
+		return mergeProps(merge(() => aria.labelProps ?? {}), {
+			get elementType() {
+				return "label";
+			},
+			registerSlot: registerLabel
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$30 = {
+	get() {
+		const aria = this[_m$];
+		const state = this[_m$3];
+		const setButtonRef = this[_m$4];
+		const setInputRef = this[_m$5];
+		const setListBoxRef = this[_m$6];
+		const props = this[_m$7];
+		const render = this[_m$8];
+		const input = this[_m$9];
+		const textFormValue = this[_m$10];
+		const hiddenValues = this[_m$11];
+		const setGroupRef = this[_m$12];
+		const setPopoverRef = this[_m$13];
+		const listBoxRef = this[_m$14];
+		const triggerRef = this[_m$15];
+		return ButtonContext(new _P$16(aria, state, setButtonRef, setInputRef, setListBoxRef, props, render, input, textFormValue, hiddenValues, setGroupRef, setPopoverRef, listBoxRef, triggerRef));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$17(_p131, _p132, _p133, _p134, _p135, _p136, _p137, _p138, _p139, _p140, _p141, _p142, _p143, _p144, _p145) {
+	this[_m$] = _p131;
+	this[_m$2] = _p132;
+	this[_m$3] = _p133;
+	this[_m$4] = _p134;
+	this[_m$5] = _p135;
+	this[_m$6] = _p136;
+	this[_m$7] = _p137;
+	this[_m$8] = _p138;
+	this[_m$9] = _p139;
+	this[_m$10] = _p140;
+	this[_m$11] = _p141;
+	this[_m$12] = _p142;
+	this[_m$13] = _p143;
+	this[_m$14] = _p144;
+	this[_m$15] = _p145;
+	Object.defineProperty(this, "value", _d$29);
+	Object.defineProperty(this, "children", _d$30);
+}
+_P$17.prototype = Object.prototype;
+var _d$31 = {
+	get() {
+		const aria = this[_m$];
+		const registerLabel = this[_m$2];
+		const state = this[_m$3];
+		const setButtonRef = this[_m$4];
+		const setInputRef = this[_m$5];
+		const setListBoxRef = this[_m$6];
+		const props = this[_m$7];
+		const render = this[_m$8];
+		const input = this[_m$9];
+		const textFormValue = this[_m$10];
+		const hiddenValues = this[_m$11];
+		const setGroupRef = this[_m$12];
+		const setPopoverRef = this[_m$13];
+		const listBoxRef = this[_m$14];
+		const triggerRef = this[_m$15];
+		return LabelContext(new _P$17(aria, registerLabel, state, setButtonRef, setInputRef, setListBoxRef, props, render, input, textFormValue, hiddenValues, setGroupRef, setPopoverRef, listBoxRef, triggerRef));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$18(_p146, _p147, _p148, _p149, _p150, _p151, _p152, _p153, _p154, _p155, _p156, _p157, _p158, _p159, _p160, _p161) {
+	this[_m$] = _p146;
+	this[_m$2] = _p147;
+	this[_m$3] = _p148;
+	this[_m$4] = _p149;
+	this[_m$5] = _p150;
+	this[_m$6] = _p151;
+	this[_m$7] = _p152;
+	this[_m$8] = _p153;
+	this[_m$9] = _p154;
+	this[_m$10] = _p155;
+	this[_m$11] = _p156;
+	this[_m$12] = _p157;
+	this[_m$13] = _p158;
+	this[_m$14] = _p159;
+	this[_m$15] = _p160;
+	this.value = _p161;
+	Object.defineProperty(this, "children", _d$31);
+}
+_P$18.prototype = Object.prototype;
+var _d$32 = {
+	get() {
+		return this[_m$].isPlaceholder || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$19(_p162, _p163) {
+	this[_m$] = _p162;
+	this.ref = _p163;
+	Object.defineProperty(this, "data-placeholder", _d$32);
+}
+_P$19.prototype = Object.prototype;
+const ComboBoxContext = createContext(null);
+const ComboBoxStateContext = createContext(null);
+const ComboBoxValueContext = createContext(null);
+function ComboBox(input) {
+	if (createIsHidden()) return null;
+	const [props, , setRef] = createContextProps(input, untrack(() => input.ref), ComboBoxContext);
+	const values = {
+		get isDisabled() {
+			return props.isDisabled === true;
+		},
+		get isInvalid() {
+			return props.isInvalid === true;
+		},
+		isOpen: false,
+		get isReadOnly() {
+			return props.isReadOnly === true;
+		},
+		get isRequired() {
+			return props.isRequired === true;
+		}
+	};
+	const content = () => {
+		const child = props.children;
+		return typeof child === "function" ? child({
+			...values,
+			defaultChildren: void 0
+		}) : child;
+	};
+	return ListStateContext(new _P$3(content, props, setRef, null));
+}
+function ComboBoxInner(input) {
+	const [buttonRef, setButtonRef] = createSignal(null, { ownedWrite: true });
+	const [popoverRef, setPopoverRef] = createSignal(null, { ownedWrite: true });
+	const { props } = untrack(() => input);
+	const form = createSlottedContext(FormContext);
+	const filter = createFilter({ sensitivity: "base" });
+	const state = createComboBoxState(mergeProps(props, {
+		children: void 0,
+		get collection() {
+			return input.collection;
+		},
+		get defaultFilter() {
+			return props.defaultFilter ?? filter.contains;
+		},
+		get validationBehavior() {
+			return props.validationBehavior ?? form?.validationBehavior ?? "native";
+		}
+	}));
+	const [inputRef, setInputRef] = createSignal(null, { ownedWrite: true });
+	const [groupRef, setGroupRef] = createSignal(null, { ownedWrite: true });
+	const [listBoxRef, setListBoxRef] = createSignal(null, { ownedWrite: true });
+	const [registerLabel, label] = createSlot(() => !isTruthy(props["aria-label"]) && !isTruthy(props["aria-labelledby"]));
+	const textFormValue = () => props.allowsCustomValue ?? props.formValue === "text";
+	const aria = createComboBox(mergeProps(props, {
+		buttonRef,
+		inputRef,
+		get label() {
+			return label();
+		},
+		listBoxRef,
+		get name() {
+			return textFormValue() ? props.name : void 0;
+		},
+		popoverRef,
+		get validationBehavior() {
+			return props.validationBehavior ?? form?.validationBehavior ?? "native";
+		}
+	}), state);
+	const triggerRef = () => groupRef() ?? inputRef();
+	const render = createRenderProps(mergeProps(props, {
+		defaultClass: "solid2-aria-ComboBox",
+		values: {
+			get isDisabled() {
+				return props.isDisabled === true;
+			},
+			get isInvalid() {
+				return aria.isInvalid;
+			},
+			get isOpen() {
+				return state.isOpen;
+			},
+			get isReadOnly() {
+				return props.isReadOnly === true;
+			},
+			get isRequired() {
+				return props.isRequired === true;
+			}
+		}
+	}));
+	const hiddenValues = () => {
+		if (Array.isArray(state.value)) return state.value.length > 0 ? state.value : [null];
+		return [state.value];
+	};
+	return ComboBoxStateContext(new _P$18(aria, registerLabel, state, setButtonRef, setInputRef, setListBoxRef, props, render, input, textFormValue, hiddenValues, setGroupRef, setPopoverRef, listBoxRef, triggerRef, state));
+}
+function ComboBoxValue(input) {
+	if (createIsHidden()) return null;
+	const [props, , setRef] = createContextProps(input, untrack(() => input.ref), ComboBoxValueContext);
+	const context = useContext(ComboBoxStateContext);
+	if (!context) throw new Error("ComboBoxValue must be rendered in a ComboBox.");
+	const state = context;
+	const formatter = createListFormatter();
+	const selectedText = createMemo(() => formatter.format(state.selectedItems.map((item) => item.textValue).filter(Boolean)));
+	const values = {
+		get isPlaceholder() {
+			return state.selectedItems.length === 0;
+		},
+		get selectedItems() {
+			return state.selectedItems.map((item) => item.value);
+		},
+		get selectedText() {
+			return selectedText();
+		},
+		state
+	};
+	const render = createRenderProps(mergeProps(props, {
+		get defaultChildren() {
+			return selectedText() || props.placeholder;
+		},
+		defaultClass: "solid2-aria-ComboBoxValue",
+		values
+	}));
+	return dom.div(mergeProps$1(() => {
+		return filterDOMProps(props, { global: true });
+	}, render, new _P$19(values, (element) => {
+		setRef(element);
+	})));
+}
+export { ComboBox, ComboBoxContext, ComboBoxStateContext, ComboBoxValue, ComboBoxValueContext };
+
+//# sourceMappingURL=combo-box.js.map