@solid2-aria/components 0.0.0-stage → 0.0.1

package/dist/server/toggle-button.js

@@ -0,0 +1,183 @@
+/*
+ * 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/ToggleButton.tsx.
+ * Modified for Solid Aria: adapted components, contexts, refs, and reactive properties for Solid 2; uses Solid class props and an untracked setup-time choice of group interaction behavior.
+ * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.
+ */
+import { createContextProps, createRenderProps, dom } from "./utils.js";
+import { SelectionIndicatorContext } from "./selection-indicator.js";
+import { ToggleGroupStateContext } from "./toggle-button-group.js";
+import { mergeProps } from "@solid2-aria/core/utils/merge-props";
+import { createContext, merge, omit, untrack, useContext } from "solid-js";
+import { mergeProps as mergeProps$1 } from "@solidjs/web";
+import { requireValue } from "@solid2-aria/core/utils/require-value";
+import { filterDOMProps } from "@solid2-aria/core/utils/filter-dom-props";
+import { createFocusRing } from "@solid2-aria/core/focus/create-focus-ring";
+import { createHover } from "@solid2-aria/core/interactions/create-hover";
+import { createToggleState } from "@solid2-aria/stately/toggle/create-toggle-state";
+import { isPresent } from "@solid2-aria/core/utils/is-present";
+import { createToggleButton } from "@solid2-aria/core/button/create-toggle-button";
+import { createToggleButtonGroupItem } from "@solid2-aria/core/button/create-toggle-button-group";
+// src/toggle-button.tsx
+var _m$ = Symbol();
+var _m$2 = Symbol();
+var _m$3 = Symbol();
+var _m$4 = Symbol();
+var _m$5 = Symbol();
+var _m$6 = Symbol();
+var _d$ = {
+	get() {
+		return this[_m$].children;
+	},
+	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() {
+		return this[_m$].slot ?? void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$3 = {
+	get() {
+		return this[_m$2].isSelected || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$4 = {
+	get() {
+		return this[_m$2].isDisabled || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$5 = {
+	get() {
+		return this[_m$2].isPressed || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$6 = {
+	get() {
+		return this[_m$3].isHovered || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$7 = {
+	get() {
+		return this[_m$4].isFocused || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$8 = {
+	get() {
+		return this[_m$4].isFocusVisible || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$9 = {
+	get() {
+		const render = this[_m$5];
+		const state = this[_m$6];
+		return SelectionIndicatorContext(new _P$(render, { get isSelected() {
+			return state.isSelected;
+		} }));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$2(_p3, _p4, _p5, _p6, _p7, _p8, _p9) {
+	this[_m$] = _p3;
+	this[_m$2] = _p4;
+	this[_m$3] = _p5;
+	this[_m$4] = _p6;
+	this[_m$5] = _p7;
+	this[_m$6] = _p8;
+	this.ref = _p9;
+	Object.defineProperty(this, "slot", _d$2);
+	Object.defineProperty(this, "data-selected", _d$3);
+	Object.defineProperty(this, "data-disabled", _d$4);
+	Object.defineProperty(this, "data-pressed", _d$5);
+	Object.defineProperty(this, "data-hovered", _d$6);
+	Object.defineProperty(this, "data-focused", _d$7);
+	Object.defineProperty(this, "data-focus-visible", _d$8);
+	Object.defineProperty(this, "children", _d$9);
+}
+_P$2.prototype = Object.prototype;
+const ToggleButtonContext = createContext(null);
+function ToggleButton(input) {
+	const [props, ref, setRef] = createContextProps(input, untrack(() => input.ref), ToggleButtonContext);
+	const group = useContext(ToggleGroupStateContext);
+	const state = createToggleState(group ? {
+		get isSelected() {
+			return isPresent(props.id) && group.selectedKeys.has(props.id);
+		},
+		onChange(selected) {
+			if (isPresent(props.id)) group.setSelected(props.id, selected);
+		}
+	} : props);
+	const aria = group && untrack(() => isPresent(props.id)) ? createToggleButtonGroupItem(mergeProps(props, { get id() {
+		return requireValue(props.id, "Expected props.id");
+	} }), group, ref) : createToggleButton(mergeProps(props, { get id() {
+		return isPresent(props.id) ? String(props.id) : void 0;
+	} }), state, ref);
+	const focus = createFocusRing(props);
+	const hover = createHover(mergeProps(props, { get isDisabled() {
+		return aria.isDisabled;
+	} }));
+	const values = {
+		get isDisabled() {
+			return aria.isDisabled;
+		},
+		get isFocusVisible() {
+			return focus.isFocusVisible;
+		},
+		get isFocused() {
+			return focus.isFocused;
+		},
+		get isHovered() {
+			return hover.isHovered;
+		},
+		get isPressed() {
+			return aria.isPressed;
+		},
+		get isSelected() {
+			return state.isSelected;
+		},
+		state
+	};
+	const render = createRenderProps(mergeProps(props, {
+		defaultClass: "solid2-aria-ToggleButton",
+		values
+	}));
+	return dom.button(mergeProps$1(() => {
+		return mergeProps(omit(filterDOMProps(props, { global: true }), "id", "onClick"), merge(() => aria.buttonProps ?? {}), merge(() => focus.focusProps ?? {}), merge(() => hover.hoverProps ?? {}), render);
+	}, new _P$2(props, values, hover, focus, render, state, (element) => {
+		setRef(element);
+	})));
+}
+export { ToggleButton, ToggleButtonContext };
+
+//# sourceMappingURL=toggle-button.js.map

package/dist/server/toggle-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toggle-button.js","names":["dom.button","<dom.button\n      {...mergeProps(\n        omit(filterDOMProps(props, { global: true }), \"id\", \"onClick\"),\n        merge(() => aria.buttonProps ?? {}),\n        merge(() => focus.focusProps ?? {}),\n        merge(() => hover.hoverProps ?? {}),\n        render\n      )}\n      ref={(element: HTMLButtonElement) => {\n        setRef(element);\n      }}\n      slot={props.slot ?? undefined}\n      data-selected={values.isSelected || undefined}\n      data-disabled={values.isDisabled || undefined}\n      data-pressed={values.isPressed || undefined}\n      data-hovered={hover.isHovered || undefined}\n      data-focused={focus.isFocused || undefined}\n      data-focus-visible={focus.isFocusVisible || undefined}\n    >\n      <SelectionIndicatorContext\n        value={{\n          get isSelected() {\n            return state.isSelected;\n          },\n        }}\n      >\n        {render.children}\n      </SelectionIndicatorContext>\n    </dom.button>","_$mergeProps"],"sources":["../../src/toggle-button.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n/*\n * Derived from Adobe React Spectrum: packages/react-aria-components/src/ToggleButton.tsx.\n * Modified for Solid Aria: adapted components, contexts, refs, and reactive properties for Solid 2; uses Solid class props and an untracked setup-time choice of group interaction behavior.\n * Licensed under Apache-2.0. See LICENSES/Apache-2.0.txt and NOTICE.txt at the repository root.\n */\n\nimport { createToggleButton } from \"@solid2-aria/core/button/create-toggle-button\";\nimport type { AriaToggleButtonProps } from \"@solid2-aria/core/button/create-toggle-button\";\nimport { createToggleButtonGroupItem } from \"@solid2-aria/core/button/create-toggle-button-group\";\nimport { createFocusRing } from \"@solid2-aria/core/focus/create-focus-ring\";\nimport { createHover } from \"@solid2-aria/core/interactions/create-hover\";\nimport { filterDOMProps } from \"@solid2-aria/core/utils/filter-dom-props\";\nimport { isPresent } from \"@solid2-aria/core/utils/is-present\";\nimport { mergeProps } from \"@solid2-aria/core/utils/merge-props\";\nimport { requireValue } from \"@solid2-aria/core/utils/require-value\";\nimport { createToggleState } from \"@solid2-aria/stately/toggle/create-toggle-state\";\nimport type { ToggleState } from \"@solid2-aria/stately/toggle/create-toggle-state\";\nimport type { HoverEvents, Key } from \"@solid2-aria/types-shared\";\nimport type { JSX } from \"@solidjs/web\";\nimport { merge, untrack, createContext, useContext, omit } from \"solid-js\";\n\nimport type { ButtonRenderProps } from \"./button\";\nimport { SelectionIndicatorContext } from \"./selection-indicator\";\nimport { ToggleGroupStateContext } from \"./toggle-button-group\";\nimport { dom, createContextProps, createRenderProps } from \"./utils\";\nimport type { Ref, ContextValue, SlotProps, RenderProps } from \"./utils\";\n\nexport interface ToggleButtonRenderProps extends Omit<\n  ButtonRenderProps,\n  \"isPending\"\n> {\n  isSelected: boolean;\n  state: ToggleState;\n}\n\nexport interface ToggleButtonProps\n  extends\n    Omit<AriaToggleButtonProps, \"children\" | \"elementType\" | \"id\">,\n    SlotProps,\n    HoverEvents,\n    RenderProps<ToggleButtonRenderProps, \"button\"> {\n  id?: Key;\n  ref?: Ref<HTMLButtonElement>;\n}\n\nexport const ToggleButtonContext =\n  createContext<ContextValue<ToggleButtonProps, HTMLButtonElement>>(null);\n\nexport function ToggleButton(input: ToggleButtonProps): JSX.Element {\n  const [props, ref, setRef] = createContextProps(\n    input,\n    untrack(() => input.ref),\n    ToggleButtonContext\n  );\n\n  const group = useContext(ToggleGroupStateContext);\n\n  const state = createToggleState(\n    group\n      ? {\n          get isSelected() {\n            return isPresent(props.id) && group.selectedKeys.has(props.id);\n          },\n          onChange(selected) {\n            if (isPresent(props.id)) {\n              group.setSelected(props.id, selected);\n            }\n          },\n        }\n      : props\n  );\n\n  const aria =\n    group && untrack(() => isPresent(props.id))\n      ? createToggleButtonGroupItem(\n          mergeProps(props, {\n            get id() {\n              return requireValue(props.id, \"Expected props.id\");\n            },\n          }),\n          group,\n          ref\n        )\n      : createToggleButton(\n          mergeProps(props, {\n            get id() {\n              return isPresent(props.id) ? String(props.id) : undefined;\n            },\n          }),\n          state,\n          ref\n        );\n\n  const focus = createFocusRing(props);\n\n  const hover = createHover(\n    mergeProps(props, {\n      get isDisabled() {\n        return aria.isDisabled;\n      },\n    })\n  );\n\n  const values: ToggleButtonRenderProps = {\n    get isDisabled() {\n      return aria.isDisabled;\n    },\n    get isFocusVisible() {\n      return focus.isFocusVisible;\n    },\n    get isFocused() {\n      return focus.isFocused;\n    },\n    get isHovered() {\n      return hover.isHovered;\n    },\n    get isPressed() {\n      return aria.isPressed;\n    },\n    get isSelected() {\n      return state.isSelected;\n    },\n    state,\n  };\n\n  const render = createRenderProps(\n    mergeProps(props, { defaultClass: \"solid2-aria-ToggleButton\", values })\n  );\n\n  return (\n    <dom.button\n      {...mergeProps(\n        omit(filterDOMProps(props, { global: true }), \"id\", \"onClick\"),\n        merge(() => aria.buttonProps ?? {}),\n        merge(() => focus.focusProps ?? {}),\n        merge(() => hover.hoverProps ?? {}),\n        render\n      )}\n      ref={(element: HTMLButtonElement) => {\n        setRef(element);\n      }}\n      slot={props.slot ?? undefined}\n      data-selected={values.isSelected || undefined}\n      data-disabled={values.isDisabled || undefined}\n      data-pressed={values.isPressed || undefined}\n      data-hovered={hover.isHovered || undefined}\n      data-focused={focus.isFocused || undefined}\n      data-focus-visible={focus.isFocusVisible || undefined}\n    >\n      <SelectionIndicatorContext\n        value={{\n          get isSelected() {\n            return state.isSelected;\n          },\n        }}\n      >\n        {render.children}\n      </SelectionIndicatorContext>\n    </dom.button>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuKQ,O,SAAC,CAAO;;;;;;;;;;;;;EAfV,O,SAAM,CAAM,QAAQ,KAAA;;;;;;;EACpB,O,UAAe,CAAO,cAAc,KAAA;;;;;;;EACpC,O,UAAe,CAAO,cAAc,KAAA;;;;;;;EACpC,O,UAAc,CAAO,aAAa,KAAA;;;;;;;EAClC,O,UAAc,CAAM,aAAa,KAAA;;;;;;;EACjC,O,UAAc,CAAM,aAAa,KAAA;;;;;;;EACjC,O,UAAoB,CAAM,kBAAkB,KAAA;;;;;;;;;EAE5C,OAAA,0BAAA,IAAA,IAOG,QANM,EACL,IAAI,aAAa;GACf,OAAO,MAAM;EACf,EACF,CAGyB,CAAA;;;;;;;;;;;;;;;;;;;;;;;AAhHjC,MAAa,sBACX,cAAkE,IAAI;AAExE,SAAgB,aAAa,OAAuC;CAClE,MAAM,CAAC,OAAO,KAAK,UAAU,mBAC3B,OACA,cAAc,MAAM,GAAG,GACvB,mBACF;CAEA,MAAM,QAAQ,WAAW,uBAAuB;CAEhD,MAAM,QAAQ,kBACZ,QACI;EACE,IAAI,aAAa;GACf,OAAO,UAAU,MAAM,EAAE,KAAK,MAAM,aAAa,IAAI,MAAM,EAAE;EAC/D;EACA,SAAS,UAAU;GACjB,IAAI,UAAU,MAAM,EAAE,GACpB,MAAM,YAAY,MAAM,IAAI,QAAQ;EAExC;CACF,IACA,KACN;CAEA,MAAM,OACJ,SAAS,cAAc,UAAU,MAAM,EAAE,CAAC,IACtC,4BACE,WAAW,OAAO,EAChB,IAAI,KAAK;EACP,OAAO,aAAa,MAAM,IAAI,mBAAmB;CACnD,EACF,CAAC,GACD,OACA,GACF,IACA,mBACE,WAAW,OAAO,EAChB,IAAI,KAAK;EACP,OAAO,UAAU,MAAM,EAAE,IAAI,OAAO,MAAM,EAAE,IAAI,KAAA;CAClD,EACF,CAAC,GACD,OACA,GACF;CAEN,MAAM,QAAQ,gBAAgB,KAAK;CAEnC,MAAM,QAAQ,YACZ,WAAW,OAAO,EAChB,IAAI,aAAa;EACf,OAAO,KAAK;CACd,EACF,CAAC,CACH;CAEA,MAAM,SAAkC;EACtC,IAAI,aAAa;GACf,OAAO,KAAK;EACd;EACA,IAAI,iBAAiB;GACnB,OAAO,MAAM;EACf;EACA,IAAI,YAAY;GACd,OAAO,MAAM;EACf;EACA,IAAI,YAAY;GACd,OAAO,MAAM;EACf;EACA,IAAI,YAAY;GACd,OAAO,KAAK;EACd;EACA,IAAI,aAAa;GACf,OAAO,MAAM;EACf;EACA;CACF;CAEA,MAAM,SAAS,kBACb,WAAW,OAAO;EAAE,cAAc;EAA4B;CAAO,CAAC,CACxE;CAEA,OAAA,IACGA,OAADC,mBACE;EAAI,OAAA,WACF,KAAK,eAAe,OAAO,EAAE,QAAQ,KAAK,CAAC,GAAG,MAAM,SAAS,GAC7D,YAAY,KAAK,eAAe,CAAC,CAAC,GAClC,YAAY,MAAM,cAAc,CAAC,CAAC,GAClC,YAAY,MAAM,cAAc,CAAC,CAAC,GAClC,MACF;CAAC,GAPH,IAAA,KAWQ,OACS,QAGD,OACA,OAUX,QAJU,QAdP,YAA+B;EACnC,OAAO,OAAO;CAChB,CAkBU,CAAA,CAAA;AAEhB"}

package/dist/server/token-field.js

@@ -0,0 +1,457 @@
+/*
+ * Copyright 2026 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/TokenField.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 { assignRef, createContextProps, createRenderProps, createSlot, createSlottedContext, dom } from "./utils.js";
+import { FieldInputContext } from "./autocomplete.js";
+import { LabelContext } from "./label.js";
+import { TextContext } from "./text.js";
+import { mergeProps } from "@solid2-aria/core/utils/merge-props";
+import { For, createContext, createMemo, createSignal, merge, omit, onSettled, untrack, useContext } from "solid-js";
+import { escape, memo, mergeProps as mergeProps$1, scope, ssr, ssrHydrationKey } from "@solidjs/web";
+import { filterDOMProps } from "@solid2-aria/core/utils/filter-dom-props";
+import { createFocusRing } from "@solid2-aria/core/focus/create-focus-ring";
+import { createHover } from "@solid2-aria/core/interactions/create-hover";
+import { isTruthy } from "@solid2-aria/core/utils/truthy";
+import { createIsHidden } from "@solid2-aria/core/collections/hidden";
+import { readProperty } from "@solid2-aria/core/utils/read-property";
+import { createToken } from "@solid2-aria/core/tokenfield/create-token";
+import { createTokenField } from "@solid2-aria/core/tokenfield/create-token-field";
+import { createTokenFieldState } from "@solid2-aria/stately/tokenfield/create-token-field-state";
+// src/token-field.tsx
+var _tmpl$ = [
+	"<span",
+	" data-react-aria-token>​<!--$-->",
+	"<!--/-->​</span>"
+];
+var _tmpl$2 = ["<br", ">"];
+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 _d$ = {
+	get() {
+		return this[_m$].children;
+	},
+	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 render = this[_m$];
+		const aria = this[_m$2];
+		const inputRef = this[_m$3];
+		const values = this[_m$4];
+		const setInputRef = this[_m$5];
+		const baseState = this[_m$6];
+		return TokenInputContext(new _P$(render, {
+			aria,
+			inputRef,
+			get isDisabled() {
+				return values.isDisabled;
+			},
+			get isReadOnly() {
+				return values.isReadOnly;
+			},
+			setInputRef: (element) => {
+				setInputRef(element);
+			},
+			state: baseState
+		}));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$2(_p3, _p4, _p5, _p6, _p7, _p8, _p9) {
+	this[_m$] = _p3;
+	this[_m$2] = _p4;
+	this[_m$3] = _p5;
+	this[_m$4] = _p6;
+	this[_m$5] = _p7;
+	this[_m$6] = _p8;
+	this.value = _p9;
+	Object.defineProperty(this, "children", _d$2);
+}
+_P$2.prototype = Object.prototype;
+var _d$3 = {
+	get() {
+		const aria = this[_m$];
+		const registerLabel = this[_m$2];
+		return mergeProps(merge(() => aria.labelProps ?? {}), {
+			get elementType() {
+				return "span";
+			},
+			registerSlot: registerLabel
+		});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$4 = {
+	get() {
+		const render = this[_m$3];
+		const aria = this[_m$];
+		const inputRef = this[_m$4];
+		const values = this[_m$5];
+		const setInputRef = this[_m$6];
+		const baseState = this[_m$7];
+		return TextContext(new _P$2(render, aria, inputRef, values, setInputRef, baseState, { slots: { get description() {
+			return aria.descriptionProps;
+		} } }));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$3(_p0, _p1, _p10, _p11, _p12, _p13, _p14) {
+	this[_m$] = _p0;
+	this[_m$2] = _p1;
+	this[_m$3] = _p10;
+	this[_m$4] = _p11;
+	this[_m$5] = _p12;
+	this[_m$6] = _p13;
+	this[_m$7] = _p14;
+	Object.defineProperty(this, "value", _d$3);
+	Object.defineProperty(this, "children", _d$4);
+}
+_P$3.prototype = Object.prototype;
+var _d$5 = {
+	get() {
+		return this[_m$].slot ?? void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$6 = {
+	get() {
+		return this[_m$2].isDisabled || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$7 = {
+	get() {
+		return this[_m$2].isReadOnly || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$8 = {
+	get() {
+		const aria = this[_m$3];
+		const registerLabel = this[_m$4];
+		const render = this[_m$5];
+		const inputRef = this[_m$6];
+		const values = this[_m$2];
+		const setInputRef = this[_m$7];
+		const baseState = this[_m$8];
+		return LabelContext(new _P$3(aria, registerLabel, render, inputRef, values, setInputRef, baseState));
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$4(_p15, _p16, _p17, _p18, _p19, _p20, _p21, _p22, _p23) {
+	this[_m$] = _p15;
+	this[_m$2] = _p16;
+	this[_m$3] = _p17;
+	this[_m$4] = _p18;
+	this[_m$5] = _p19;
+	this[_m$6] = _p20;
+	this[_m$7] = _p21;
+	this[_m$8] = _p22;
+	this.ref = _p23;
+	Object.defineProperty(this, "slot", _d$5);
+	Object.defineProperty(this, "data-disabled", _d$6);
+	Object.defineProperty(this, "data-readonly", _d$7);
+	Object.defineProperty(this, "children", _d$8);
+}
+_P$4.prototype = Object.prototype;
+var _d$9 = {
+	get() {
+		const segments = this[_m$];
+		return segments();
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$5(_p24, _p25) {
+	this[_m$] = _p24;
+	Object.defineProperty(this, "each", _d$9);
+	this.children = _p25;
+}
+_P$5.prototype = Object.prototype;
+var _d$10 = {
+	get() {
+		return this[_m$].slot ?? void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$11 = {
+	get() {
+		return this[_m$2].isFocused || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$12 = {
+	get() {
+		return this[_m$2].isFocusVisible || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$13 = {
+	get() {
+		return this[_m$3].isHovered || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$14 = {
+	get() {
+		return this[_m$4].isDisabled || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$15 = {
+	get() {
+		return this[_m$4].isReadOnly || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$16 = {
+	get() {
+		const segments = this[_m$5];
+		const props = this[_m$];
+		return [For(new _P$5(segments, (segment) => {
+			var _v$, _v$2;
+			return segment.type === "text" ? segment.text : (_v$ = ssrHydrationKey(), _v$2 = scope(() => {
+				return escape(props.children(segment));
+			}), ssr(_tmpl$, _v$, _v$2));
+		})), memo(() => {
+			var _v$3;
+			return memo(() => {
+				return segments().at(-1)?.text.endsWith("\n") === true;
+			})() ? (_v$3 = ssrHydrationKey(), ssr(_tmpl$2, _v$3)) : null;
+		})];
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$6(_p26, _p27, _p28, _p29, _p30, _p31) {
+	this[_m$] = _p26;
+	this[_m$2] = _p27;
+	this[_m$3] = _p28;
+	this[_m$4] = _p29;
+	this[_m$5] = _p30;
+	this.ref = _p31;
+	Object.defineProperty(this, "slot", _d$10);
+	Object.defineProperty(this, "data-focused", _d$11);
+	Object.defineProperty(this, "data-focus-visible", _d$12);
+	Object.defineProperty(this, "data-hovered", _d$13);
+	Object.defineProperty(this, "data-disabled", _d$14);
+	Object.defineProperty(this, "data-readonly", _d$15);
+	Object.defineProperty(this, "children", _d$16);
+}
+_P$6.prototype = Object.prototype;
+var _d$17 = {
+	get() {
+		return this[_m$].isSelected || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$18 = {
+	get() {
+		return this[_m$2].isDisabled || void 0;
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$19 = {
+	get() {
+		const render = this[_m$3];
+		const aria = this[_m$];
+		return mergeProps(typeof render.style === "object" ? render.style : {}, typeof aria.tokenProps.style === "object" ? aria.tokenProps.style : {});
+	},
+	enumerable: true,
+	configurable: true
+};
+var _d$20 = {
+	get() {
+		return this[_m$3].children;
+	},
+	enumerable: true,
+	configurable: true
+};
+function _P$7(_p32, _p33, _p34, _p35, _p36) {
+	this[_m$] = _p32;
+	this[_m$2] = _p33;
+	this[_m$3] = _p34;
+	this.ref = _p35;
+	this.contenteditable = _p36;
+	Object.defineProperty(this, "data-selected", _d$17);
+	Object.defineProperty(this, "data-disabled", _d$18);
+	Object.defineProperty(this, "style", _d$19);
+	Object.defineProperty(this, "children", _d$20);
+}
+_P$7.prototype = Object.prototype;
+const TokenFieldContext = createContext(null);
+const TokenInputContext = createContext(null);
+function TokenField(input) {
+	if (createIsHidden()) return null;
+	const [props, , setRef] = createContextProps(input, untrack(() => input.ref), TokenFieldContext);
+	const field = createSlottedContext(FieldInputContext, props.slot);
+	const [inputRef, setInputRef] = createSignal(null, { ownedWrite: true });
+	const [registerLabel, label] = createSlot(() => !isTruthy(props["aria-label"]) && !isTruthy(props["aria-labelledby"]));
+	const stateProps = new Proxy(props, { get(target, key) {
+		if (key === "onChange") return (value) => {
+			props.onChange?.(value);
+			field?.onChange?.(value.toString());
+		};
+		return readProperty(target, key);
+	} });
+	const baseState = createTokenFieldState(stateProps);
+	const ariaProps = new Proxy(props, { get(target, key) {
+		if (key === "label") return label();
+		if (key === "role") return props.role ?? "textbox";
+		return readProperty(target, key);
+	} });
+	const aria = createTokenField(ariaProps, baseState, inputRef);
+	const values = {
+		get isDisabled() {
+			return props.isDisabled === true;
+		},
+		get isReadOnly() {
+			return props.isReadOnly === true;
+		}
+	};
+	const render = createRenderProps(merge(props, {
+		defaultClass: "solid2-aria-TokenField",
+		values
+	}));
+	return dom.div(mergeProps$1(() => {
+		return filterDOMProps(props, { global: true });
+	}, render, new _P$4(props, values, aria, registerLabel, render, inputRef, setInputRef, baseState, (element) => {
+		setRef(element);
+	})));
+}
+function TokenInput(props) {
+	const context = useContext(TokenInputContext);
+	if (!context) throw new Error("TokenInput must be rendered in a TokenField.");
+	const hover = createHover(mergeProps(props, { get isDisabled() {
+		return context.isDisabled;
+	} }));
+	const focus = createFocusRing({ isTextInput: true });
+	const field = createSlottedContext(FieldInputContext, untrack(() => props.slot));
+	const values = {
+		get isDisabled() {
+			return context.isDisabled;
+		},
+		get isFocusVisible() {
+			return focus.isFocusVisible;
+		},
+		get isFocused() {
+			return focus.isFocused;
+		},
+		get isHovered() {
+			return hover.isHovered;
+		},
+		get isReadOnly() {
+			return context.isReadOnly;
+		}
+	};
+	const render = createRenderProps(mergeProps(omit(props, "children"), {
+		defaultClass: "solid2-aria-TokenInput",
+		values
+	}));
+	let previousSegments = untrack(() => context.state.value.segments);
+	const segments = createMemo(() => {
+		if (!context.state.isComposing) previousSegments = context.state.value.segments;
+		return previousSegments;
+	});
+	onSettled(() => insertSelectionStyle(context.inputRef()));
+	return dom.div(mergeProps$1(() => {
+		return mergeProps(filterDOMProps(props, { global: true }), render, merge(() => focus.focusProps ?? {}), merge(() => hover.hoverProps ?? {}), merge(() => context.aria.tokenFieldProps ?? {}), field ? omit(field, "ref", "value", "onChange") : void 0);
+	}, new _P$6(props, focus, hover, values, segments, (el) => {
+		context.setInputRef(el);
+		assignRef(untrack(() => props.ref), el);
+		assignRef(untrack(() => field?.ref), el);
+	})));
+}
+function Token(props) {
+	const context = useContext(TokenInputContext);
+	if (!context) throw new Error("Token must be rendered in a TokenInput.");
+	const [ref, setRef] = createSignal(null, { ownedWrite: true });
+	const aria = createToken({}, context.state, ref);
+	const render = createRenderProps(mergeProps(props, {
+		defaultClass: "solid2-aria-Token",
+		values: {
+			get isDisabled() {
+				return context.isDisabled;
+			},
+			get isSelected() {
+				return aria.isSelected;
+			}
+		}
+	}));
+	return dom.span(mergeProps$1(() => {
+		return mergeProps(filterDOMProps(props, { global: true }), render, merge(() => aria.tokenProps ?? {}));
+	}, new _P$7(aria, context, render, [(element) => {
+		setRef(element);
+	}, (element) => {
+		assignRef(untrack(() => props.ref), element);
+	}], "false")));
+}
+const tokenSelectionStyles = /* @__PURE__ */ new WeakMap();
+function insertSelectionStyle(element) {
+	if (!element || typeof CSSStyleSheet !== "function") return;
+	const root = element.getRootNode();
+	if (!(root instanceof Document) && !(root instanceof ShadowRoot) || !isTruthy(root.adoptedStyleSheets)) return;
+	let entry = tokenSelectionStyles.get(root);
+	if (!entry) {
+		const sheet = new CSSStyleSheet();
+		sheet.replaceSync("[data-react-aria-token]::selection,[data-react-aria-token]>*::selection{background:#ffffff01}");
+		entry = {
+			sheet,
+			users: 0
+		};
+		tokenSelectionStyles.set(root, entry);
+		root.adoptedStyleSheets = [...root.adoptedStyleSheets, sheet];
+	}
+	entry.users += 1;
+	return () => {
+		entry.users -= 1;
+		if (entry.users === 0) {
+			root.adoptedStyleSheets = root.adoptedStyleSheets.filter((sheet) => sheet !== entry.sheet);
+			tokenSelectionStyles.delete(root);
+		}
+	};
+}
+export { Token, TokenField, TokenFieldContext, TokenInput };
+
+//# sourceMappingURL=token-field.js.map