@qw-ui/core 0.3.0-next.9 → 0.3.0

package/dist/checkbox-group-gGfsTv-e.js

@@ -0,0 +1,223 @@
+import { i as toggleSelectionValue, n as normalizeSelectionValue, r as selectionItemKey, t as normalizeSelectionItems } from "./selection-ivXqO1eu.js";
+import { n as trackSelectionForm, t as syncSelectionInputs } from "./selection-form-BOM_odUk.js";
+import { createMachine } from "@zag-js/core";
+import { dataAttr, visuallyHiddenStyle } from "@zag-js/dom-query";
+//#region src/checkbox-group/checkbox-group.ts
+function createCheckboxGroupProps(props) {
+	return {
+		...props,
+		items: normalizeSelectionItems(props.items),
+		value: props.value === void 0 ? void 0 : normalizeSelectionValue(props.value),
+		defaultValue: normalizeSelectionValue(props.defaultValue),
+		orientation: props.orientation ?? "vertical"
+	};
+}
+const sameValues = (a, b) => !!b && a.length === b.length && a.every((value, index) => value === b[index]);
+const rootId = (scope) => `checkbox-group:${scope.id}`;
+const inputId = (scope, value) => `${rootId(scope)}:input:${selectionItemKey(value)}`;
+function sync(params) {
+	const value = params.context.get("value");
+	syncSelectionInputs(params.scope, params.prop("items").map((item) => ({
+		id: inputId(params.scope, item.value),
+		checked: value.includes(item.value)
+	})));
+}
+function changeFor(params, value) {
+	const item = params.prop("items").find((entry) => entry.value === value);
+	if (!item) return null;
+	return toggleSelectionValue(params.context.get("value"), item, {
+		min: params.prop("min"),
+		max: params.prop("max"),
+		readOnly: params.prop("readOnly"),
+		disabled: params.prop("disabled") || params.context.get("disabledIds").includes(inputId(params.scope, value))
+	});
+}
+/** Zag owns the bindable lifecycle; shared Core rules own all selection behavior. */
+const checkboxGroupMachine = createMachine({
+	props: ({ props }) => ({
+		...props,
+		label: props.label ?? "",
+		items: normalizeSelectionItems(props.items ?? []),
+		defaultValue: normalizeSelectionValue(props.defaultValue),
+		value: props.value === void 0 ? void 0 : normalizeSelectionValue(props.value),
+		orientation: props.orientation ?? "vertical"
+	}),
+	initialState: () => "ready",
+	context({ prop, bindable }) {
+		return {
+			value: bindable(() => ({
+				defaultValue: prop("defaultValue"),
+				value: prop("value"),
+				isEqual: sameValues,
+				onChange: (value) => prop("onValueChange")?.({ value: [...value] })
+			})),
+			disabledIds: bindable(() => ({
+				defaultValue: [],
+				isEqual: sameValues
+			}))
+		};
+	},
+	watch({ track, context, action }) {
+		track([() => context.hash("value")], () => action(["syncInputs"]));
+	},
+	effects: ["trackForm"],
+	on: {
+		"VALUE.SET": { actions: ["setValue"] },
+		"VALUE.TOGGLE": { actions: ["toggleValue"] }
+	},
+	states: { ready: {} },
+	implementations: {
+		effects: { trackForm(params) {
+			return trackSelectionForm({
+				scope: params.scope,
+				rootId: rootId(params.scope),
+				form: () => params.prop("form"),
+				getState: () => params.prop("items").map((item) => ({
+					id: inputId(params.scope, item.value),
+					checked: params.context.get("value").includes(item.value)
+				})),
+				onReset: () => params.context.set("value", normalizeSelectionValue(params.prop("defaultValue"))),
+				onDisabledChange: (ids) => params.context.set("disabledIds", [...ids])
+			}).stop;
+		} },
+		actions: {
+			syncInputs: sync,
+			setValue(params) {
+				if (params.event.type === "VALUE.SET") params.context.set("value", normalizeSelectionValue(params.event.value));
+				queueMicrotask(() => sync(params));
+			},
+			toggleValue(params) {
+				if (params.event.type === "VALUE.TOGGLE") {
+					const change = changeFor(params, params.event.value);
+					if (change && !change.blocked) params.context.set("value", change.value);
+				}
+				queueMicrotask(() => sync(params));
+			}
+		}
+	}
+});
+function connect(service, normalize) {
+	const id = rootId(service.scope);
+	const items = service.prop("items");
+	const value = service.context.get("value");
+	const disabled = (item) => !!service.prop("disabled") || !!item.disabled || service.context.get("disabledIds").includes(inputId(service.scope, item.value));
+	const enabled = items.filter((item) => !disabled(item));
+	const requiredAnchor = service.prop("required") && !enabled.some((item) => value.includes(item.value)) ? enabled[0]?.value : void 0;
+	const resolve = ({ value }) => {
+		const item = items.find((entry) => entry.value === value);
+		if (!item) throw new RangeError("CheckboxGroup item value is not present in items");
+		return item;
+	};
+	const part = (name) => ({
+		"data-scope": "checkbox-group",
+		"data-part": name
+	});
+	const itemData = (item) => ({
+		"data-state": value.includes(item.value) ? "checked" : "unchecked",
+		"data-disabled": dataAttr(disabled(item)),
+		"data-readonly": dataAttr(service.prop("readOnly")),
+		"data-invalid": dataAttr(service.prop("invalid"))
+	});
+	return {
+		value: [...value],
+		items: items.map((item) => ({ ...item })),
+		label: service.prop("label"),
+		description: service.prop("description") ?? "",
+		setValue: (value) => service.send({
+			type: "VALUE.SET",
+			value
+		}),
+		toggleValue: (value) => service.send({
+			type: "VALUE.TOGGLE",
+			value
+		}),
+		getRootProps: () => normalize.element({
+			...part("root"),
+			id,
+			disabled: !!service.prop("disabled"),
+			form: service.prop("form"),
+			dir: service.prop("dir"),
+			"data-orientation": service.prop("orientation"),
+			"data-disabled": dataAttr(service.prop("disabled")),
+			"data-readonly": dataAttr(service.prop("readOnly")),
+			"data-required": dataAttr(service.prop("required")),
+			"data-invalid": dataAttr(service.prop("invalid")),
+			"aria-invalid": service.prop("invalid") || void 0,
+			"aria-describedby": service.prop("description") ? `${id}:description` : void 0
+		}),
+		getLabelProps: () => normalize.element({
+			...part("label"),
+			id: `${id}:label`
+		}),
+		getDescriptionProps: () => normalize.element({
+			...part("description"),
+			id: `${id}:description`
+		}),
+		getItemProps: (props) => {
+			const item = resolve(props);
+			return normalize.label({
+				...part("item"),
+				...itemData(item),
+				htmlFor: inputId(service.scope, item.value)
+			});
+		},
+		getInputProps(props) {
+			const item = resolve(props);
+			return normalize.input({
+				...part("input"),
+				...itemData(item),
+				id: inputId(service.scope, item.value),
+				type: "checkbox",
+				value: item.value,
+				checked: value.includes(item.value),
+				disabled: !!service.prop("disabled") || !!item.disabled,
+				readOnly: !!service.prop("readOnly"),
+				required: requiredAnchor === item.value,
+				name: service.prop("name"),
+				form: service.prop("form"),
+				"aria-checked": value.includes(item.value),
+				"aria-readonly": service.prop("readOnly") || void 0,
+				"aria-invalid": service.prop("invalid") || void 0,
+				"aria-labelledby": `${id}:text:${selectionItemKey(item.value)}`,
+				"aria-describedby": item.description ? `${id}:description:${selectionItemKey(item.value)}` : void 0,
+				style: visuallyHiddenStyle,
+				onChange() {},
+				onClick(event) {
+					const change = changeFor(service, item.value);
+					if (!change || change.blocked) event.preventDefault();
+					service.send({
+						type: "VALUE.TOGGLE",
+						value: item.value
+					});
+					queueMicrotask(() => sync(service));
+				}
+			});
+		},
+		getControlProps: (props) => {
+			const item = resolve(props);
+			return normalize.element({
+				...part("control"),
+				...itemData(item),
+				"aria-hidden": true
+			});
+		},
+		getTextProps: (props) => {
+			const item = resolve(props);
+			return normalize.element({
+				...part("text"),
+				id: `${id}:text:${selectionItemKey(item.value)}`
+			});
+		},
+		getItemDescriptionProps: (props) => {
+			const item = resolve(props);
+			return normalize.element({
+				...part("item-description"),
+				id: `${id}:description:${selectionItemKey(item.value)}`
+			});
+		}
+	};
+}
+//#endregion
+export { connect as n, createCheckboxGroupProps as r, checkboxGroupMachine as t };
+
+//# sourceMappingURL=checkbox-group-gGfsTv-e.js.map

package/dist/checkbox-group-gGfsTv-e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox-group-gGfsTv-e.js","names":[],"sources":["../src/checkbox-group/checkbox-group.ts"],"sourcesContent":["import { createMachine, type Machine, type Params, type Service } from \"@zag-js/core\";\nimport { dataAttr, visuallyHiddenStyle } from \"@zag-js/dom-query\";\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\";\nimport { normalizeSelectionItems, normalizeSelectionValue, selectionItemKey, toggleSelectionValue, type QwSelectionItem } from \"../selection.js\";\nimport { syncSelectionInputs, trackSelectionForm } from \"../selection-form.js\";\n\nexport interface QwCheckboxGroupProps {\n  /** Stable instance id; adapters supply an SSR-safe id when omitted. */\n  id?: string;\n  /** Accessible group name rendered as a native fieldset legend. */\n  label: string;\n  /** Optional group supporting text linked through aria-describedby. */\n  description?: string;\n  /** Ordered options with unique non-empty values and accessible text labels. */\n  items: QwSelectionItem[];\n  /** Controlled ordered values; duplicates are removed, unknown values retained. */\n  value?: string[];\n  /** Uncontrolled initial values and the requested target on form reset. */\n  defaultValue?: string[];\n  /** Minimum selected count for user removals; defaults to zero. */\n  min?: number;\n  /** Maximum selected count for user additions; defaults to unlimited. */\n  max?: number;\n  /** Disable all options and exclude them from native submission. */\n  disabled?: boolean;\n  /** Prevent user changes while retaining focus and submitted values. */\n  readOnly?: boolean;\n  /** Require at least one enabled, rendered option through native validation. */\n  required?: boolean;\n  /** Expose invalid group and input semantics; caller supplies error text. */\n  invalid?: boolean;\n  /** Native field name; selected enabled options submit repeated name/value pairs. */\n  name?: string;\n  /** Form id for inputs associated with an external form. */\n  form?: string;\n  /** Visual layout direction; native Tab order remains the option order. */\n  orientation?: \"vertical\" | \"horizontal\";\n  /** Text and layout direction. */\n  dir?: \"ltr\" | \"rtl\";\n  /** One update request for each accepted value change, including form reset. */\n  onValueChange?: (details: { value: string[] }) => void;\n}\nexport interface QwCheckboxGroupSchema {\n  props: QwCheckboxGroupProps & { defaultValue: string[]; orientation: \"vertical\" | \"horizontal\" };\n  context: { value: string[]; disabledIds: string[] };\n  state: \"ready\";\n  action: \"setValue\" | \"toggleValue\" | \"syncInputs\";\n  effect: \"trackForm\";\n  event: { type: \"VALUE.SET\"; value: string[] } | { type: \"VALUE.TOGGLE\"; value: string };\n}\nexport type QwCheckboxGroupMachine = Machine<QwCheckboxGroupSchema>;\nexport type QwCheckboxGroupService = Service<QwCheckboxGroupSchema>;\nexport interface QwCheckboxGroupItemProps { value: string }\n\nexport function createCheckboxGroupProps(props: QwCheckboxGroupProps): Partial<QwCheckboxGroupSchema[\"props\"]> {\n  return { ...props, items: normalizeSelectionItems(props.items), value: props.value === undefined ? undefined : normalizeSelectionValue(props.value), defaultValue: normalizeSelectionValue(props.defaultValue), orientation: props.orientation ?? \"vertical\" };\n}\nconst sameValues = (a: string[], b: string[] | undefined) => !!b && a.length === b.length && a.every((value, index) => value === b[index]);\nconst rootId = (scope: QwCheckboxGroupService[\"scope\"]) => `checkbox-group:${scope.id}`;\nconst inputId = (scope: QwCheckboxGroupService[\"scope\"], value: string) => `${rootId(scope)}:input:${selectionItemKey(value)}`;\ntype GroupParams = Pick<Params<QwCheckboxGroupSchema>, \"scope\" | \"context\" | \"prop\">;\nfunction sync(params: GroupParams) {\n  const value = params.context.get(\"value\");\n  syncSelectionInputs(params.scope, params.prop(\"items\").map((item) => ({ id: inputId(params.scope, item.value), checked: value.includes(item.value) })));\n}\nfunction changeFor(params: GroupParams, value: string) {\n  const item = params.prop(\"items\").find((entry) => entry.value === value);\n  if (!item) return null;\n  return toggleSelectionValue(params.context.get(\"value\"), item, {\n    min: params.prop(\"min\"), max: params.prop(\"max\"), readOnly: params.prop(\"readOnly\"),\n    disabled: params.prop(\"disabled\") || params.context.get(\"disabledIds\").includes(inputId(params.scope, value)),\n  });\n}\n\n/** Zag owns the bindable lifecycle; shared Core rules own all selection behavior. */\nexport const checkboxGroupMachine: QwCheckboxGroupMachine = createMachine<QwCheckboxGroupSchema>({\n  props: ({ props }) => ({ ...props, label: props.label ?? \"\", items: normalizeSelectionItems(props.items ?? []), defaultValue: normalizeSelectionValue(props.defaultValue), value: props.value === undefined ? undefined : normalizeSelectionValue(props.value), orientation: props.orientation ?? \"vertical\" }),\n  initialState: () => \"ready\",\n  context({ prop, bindable }) {\n    return {\n      value: bindable(() => ({ defaultValue: prop(\"defaultValue\"), value: prop(\"value\"), isEqual: sameValues, onChange: (value) => prop(\"onValueChange\")?.({ value: [...value] }) })),\n      disabledIds: bindable<string[]>(() => ({ defaultValue: [], isEqual: sameValues })),\n    };\n  },\n  watch({ track, context, action }) { track([() => context.hash(\"value\")], () => action([\"syncInputs\"])); },\n  effects: [\"trackForm\"],\n  on: { \"VALUE.SET\": { actions: [\"setValue\"] }, \"VALUE.TOGGLE\": { actions: [\"toggleValue\"] } },\n  states: { ready: {} },\n  implementations: {\n    effects: { trackForm(params) {\n      const tracker = trackSelectionForm({\n        scope: params.scope, rootId: rootId(params.scope), form: () => params.prop(\"form\"),\n        getState: () => params.prop(\"items\").map((item) => ({ id: inputId(params.scope, item.value), checked: params.context.get(\"value\").includes(item.value) })),\n        onReset: () => params.context.set(\"value\", normalizeSelectionValue(params.prop(\"defaultValue\"))),\n        onDisabledChange: (ids) => params.context.set(\"disabledIds\", [...ids]),\n      });\n      return tracker.stop;\n    } },\n    actions: {\n      syncInputs: sync,\n      setValue(params) { if (params.event.type === \"VALUE.SET\") params.context.set(\"value\", normalizeSelectionValue(params.event.value)); queueMicrotask(() => sync(params)); },\n      toggleValue(params) {\n        if (params.event.type === \"VALUE.TOGGLE\") {\n          const change = changeFor(params, params.event.value);\n          if (change && !change.blocked) params.context.set(\"value\", change.value);\n        }\n        queueMicrotask(() => sync(params));\n      },\n    },\n  },\n});\n\nexport interface QwCheckboxGroupApi<T extends PropTypes = PropTypes> {\n  value: string[]; items: QwSelectionItem[]; label: string; description: string;\n  setValue(value: string[]): void;\n  toggleValue(value: string): void;\n  getRootProps(): T[\"element\"];\n  getLabelProps(): T[\"element\"];\n  getDescriptionProps(): T[\"element\"];\n  getItemProps(item: QwCheckboxGroupItemProps): T[\"label\"];\n  getInputProps(item: QwCheckboxGroupItemProps): T[\"input\"];\n  getControlProps(item: QwCheckboxGroupItemProps): T[\"element\"];\n  getTextProps(item: QwCheckboxGroupItemProps): T[\"element\"];\n  getItemDescriptionProps(item: QwCheckboxGroupItemProps): T[\"element\"];\n}\n\nexport function connect<T extends PropTypes>(service: QwCheckboxGroupService, normalize: NormalizeProps<T>): QwCheckboxGroupApi<T> {\n  const id = rootId(service.scope);\n  const items = service.prop(\"items\");\n  const value = service.context.get(\"value\");\n  const disabled = (item: QwSelectionItem) => !!service.prop(\"disabled\") || !!item.disabled || service.context.get(\"disabledIds\").includes(inputId(service.scope, item.value));\n  const enabled = items.filter((item) => !disabled(item));\n  const requiredAnchor = service.prop(\"required\") && !enabled.some((item) => value.includes(item.value)) ? enabled[0]?.value : undefined;\n  const resolve = ({ value }: QwCheckboxGroupItemProps) => { const item = items.find((entry) => entry.value === value); if (!item) throw new RangeError(\"CheckboxGroup item value is not present in items\"); return item; };\n  const part = (name: string) => ({ \"data-scope\": \"checkbox-group\", \"data-part\": name });\n  const itemData = (item: QwSelectionItem) => ({ \"data-state\": value.includes(item.value) ? \"checked\" : \"unchecked\", \"data-disabled\": dataAttr(disabled(item)), \"data-readonly\": dataAttr(service.prop(\"readOnly\")), \"data-invalid\": dataAttr(service.prop(\"invalid\")) });\n  return {\n    value: [...value], items: items.map((item) => ({ ...item })), label: service.prop(\"label\"), description: service.prop(\"description\") ?? \"\",\n    setValue: (value) => service.send({ type: \"VALUE.SET\", value }),\n    toggleValue: (value) => service.send({ type: \"VALUE.TOGGLE\", value }),\n    getRootProps: () => normalize.element({ ...part(\"root\"), id, disabled: !!service.prop(\"disabled\"), form: service.prop(\"form\"), dir: service.prop(\"dir\"), \"data-orientation\": service.prop(\"orientation\"), \"data-disabled\": dataAttr(service.prop(\"disabled\")), \"data-readonly\": dataAttr(service.prop(\"readOnly\")), \"data-required\": dataAttr(service.prop(\"required\")), \"data-invalid\": dataAttr(service.prop(\"invalid\")), \"aria-invalid\": service.prop(\"invalid\") || undefined, \"aria-describedby\": service.prop(\"description\") ? `${id}:description` : undefined }),\n    getLabelProps: () => normalize.element({ ...part(\"label\"), id: `${id}:label` }),\n    getDescriptionProps: () => normalize.element({ ...part(\"description\"), id: `${id}:description` }),\n    getItemProps: (props) => { const item = resolve(props); return normalize.label({ ...part(\"item\"), ...itemData(item), htmlFor: inputId(service.scope, item.value) }); },\n    getInputProps(props) {\n      const item = resolve(props);\n      return normalize.input({\n        ...part(\"input\"), ...itemData(item), id: inputId(service.scope, item.value), type: \"checkbox\", value: item.value,\n        checked: value.includes(item.value), disabled: !!service.prop(\"disabled\") || !!item.disabled, readOnly: !!service.prop(\"readOnly\"),\n        required: requiredAnchor === item.value, name: service.prop(\"name\"), form: service.prop(\"form\"),\n        \"aria-checked\": value.includes(item.value), \"aria-readonly\": service.prop(\"readOnly\") || undefined, \"aria-invalid\": service.prop(\"invalid\") || undefined,\n        \"aria-labelledby\": `${id}:text:${selectionItemKey(item.value)}`, \"aria-describedby\": item.description ? `${id}:description:${selectionItemKey(item.value)}` : undefined,\n        style: visuallyHiddenStyle, onChange() {},\n        onClick(event) {\n          const change = changeFor(service, item.value);\n          if (!change || change.blocked) event.preventDefault();\n          service.send({ type: \"VALUE.TOGGLE\", value: item.value });\n          queueMicrotask(() => sync(service));\n        },\n      });\n    },\n    getControlProps: (props) => { const item = resolve(props); return normalize.element({ ...part(\"control\"), ...itemData(item), \"aria-hidden\": true }); },\n    getTextProps: (props) => { const item = resolve(props); return normalize.element({ ...part(\"text\"), id: `${id}:text:${selectionItemKey(item.value)}` }); },\n    getItemDescriptionProps: (props) => { const item = resolve(props); return normalize.element({ ...part(\"item-description\"), id: `${id}:description:${selectionItemKey(item.value)}` }); },\n  };\n}\n"],"mappings":"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"}

package/dist/choice-group-C4c9m0qe.js

@@ -0,0 +1,373 @@
+import { o as resolveIconState } from "./icon-Cgdbnk1u.js";
+import { i as toggleSelectionValue, n as normalizeSelectionValue, r as selectionItemKey, t as normalizeSelectionItems } from "./selection-ivXqO1eu.js";
+import { t as mergeDescriptionIds } from "./aria-description-CimD2M_C.js";
+import { n as trackSelectionForm, t as syncSelectionInputs } from "./selection-form-BOM_odUk.js";
+import { createMachine } from "@zag-js/core";
+import { dataAttr, getComputedStyle, getEventKey, visuallyHiddenStyle } from "@zag-js/dom-query";
+//#region src/selector/choice-group.ts
+/**
+* Private choice-group kernel shared by Selector and CheckList.
+* Value/limit rules come from `selection.ts`; native input sync, reset and
+* fieldset tracking come from `selection-form.ts`. Not exported from any root.
+*/
+function normalizeChoiceItems(items, family) {
+	return normalizeSelectionItems(items).map((entry) => {
+		const item = entry;
+		if (typeof item.label !== "string" || !item.label.trim()) throw new TypeError(`${family} item labels must be nonempty accessible text`);
+		if (item.extra !== void 0 && typeof item.extra !== "string") throw new TypeError(`${family} item extra must be text`);
+		return { ...item };
+	});
+}
+function normalizeChoiceValue(value = [], multiple = false) {
+	const values = normalizeSelectionValue(value);
+	return multiple ? values : values.slice(0, 1);
+}
+function createChoiceGroupProps(props, family) {
+	if (typeof props.label !== "string" || !props.label.trim()) throw new TypeError(`${family} requires a nonempty accessible group label`);
+	if (props.id !== void 0 && (typeof props.id !== "string" || !props.id.trim())) throw new TypeError(`${family} requires a nonempty instance id when provided`);
+	const multiple = !!props.multiple;
+	return {
+		...props,
+		multiple,
+		items: normalizeChoiceItems(props.items ?? [], family),
+		value: props.value === void 0 ? void 0 : normalizeChoiceValue(props.value, multiple),
+		defaultValue: normalizeChoiceValue(props.defaultValue, multiple),
+		loop: props.loop ?? true
+	};
+}
+const same = (a, b) => !!b && a.length === b.length && a.every((value, index) => value === b[index]);
+/** One machine per family; `family` is the data-scope and id prefix. */
+function createChoiceGroupMachine(family) {
+	const ids = choiceIds(family);
+	const current = (params) => normalizeChoiceValue(params.context.get("value"), params.prop("multiple"));
+	const isDisabled = (params, item) => !!params.prop("disabled") || !!item.disabled || params.context.get("disabledIds").includes(ids.input(params.scope, item.value));
+	const sync = (params) => {
+		const values = current(params);
+		syncSelectionInputs(params.scope, params.prop("items").map((item) => ({
+			id: ids.input(params.scope, item.value),
+			checked: values.includes(item.value)
+		})));
+	};
+	const change = (params, value, selectOnly) => choiceChange(params, value, selectOnly, isDisabled, current);
+	return createMachine({
+		props: ({ props }) => createChoiceGroupProps({
+			...props,
+			label: props.label ?? "",
+			items: props.items ?? []
+		}, family),
+		initialState: () => "ready",
+		context({ prop, bindable }) {
+			return {
+				value: bindable(() => ({
+					defaultValue: prop("defaultValue"),
+					value: prop("value"),
+					isEqual: same,
+					onChange: (value) => prop("onValueChange")?.({
+						value: [...value],
+						items: value.flatMap((entry) => prop("items").filter((item) => item.value === entry).map((item) => ({ ...item })))
+					})
+				})),
+				focusedValue: bindable(() => ({ defaultValue: null })),
+				disabledIds: bindable(() => ({
+					defaultValue: [],
+					isEqual: same
+				}))
+			};
+		},
+		watch({ track, context, prop, action }) {
+			track([() => context.hash("value"), () => context.hash("disabledIds")], () => action(["syncInputs"]));
+			track([() => prop("multiple")], () => action(["normalizeMode"]));
+		},
+		effects: ["trackForm"],
+		on: {
+			"VALUE.SET": { actions: ["setValue"] },
+			"VALUE.TOGGLE": { actions: ["toggleValue"] },
+			"VALUE.SELECT": { actions: ["selectValue"] },
+			FOCUS: { actions: ["setFocus"] }
+		},
+		states: { ready: {} },
+		implementations: {
+			effects: { trackForm(params) {
+				return trackSelectionForm({
+					scope: params.scope,
+					rootId: ids.root(params.scope),
+					form: () => params.prop("form"),
+					getState: () => params.prop("items").map((item) => ({
+						id: ids.input(params.scope, item.value),
+						checked: current(params).includes(item.value)
+					})),
+					onReset: () => params.context.set("value", normalizeChoiceValue(params.prop("defaultValue"), params.prop("multiple"))),
+					onDisabledChange: (list) => params.context.set("disabledIds", [...list])
+				}).stop;
+			} },
+			actions: {
+				syncInputs: sync,
+				normalizeMode(params) {
+					params.context.set("value", current(params));
+					queueMicrotask(() => sync(params));
+				},
+				setValue(params) {
+					if (params.event.type === "VALUE.SET") params.context.set("value", normalizeChoiceValue(params.event.value, params.prop("multiple")));
+					queueMicrotask(() => sync(params));
+				},
+				toggleValue(params) {
+					if (params.event.type === "VALUE.TOGGLE") {
+						const next = change(params, params.event.value, false);
+						if (next) params.context.set("value", next);
+					}
+					queueMicrotask(() => sync(params));
+				},
+				selectValue(params) {
+					if (params.event.type === "VALUE.SELECT") {
+						const next = change(params, params.event.value, true);
+						if (next) params.context.set("value", next);
+					}
+					queueMicrotask(() => sync(params));
+				},
+				setFocus(params) {
+					if (params.event.type === "FOCUS") params.context.set("focusedValue", params.event.value);
+				}
+			}
+		}
+	});
+}
+function choiceIds(family) {
+	const root = (scope) => `${family}:${scope.id}`;
+	return {
+		root,
+		input: (scope, value) => `${root(scope)}:input:${selectionItemKey(value)}`
+	};
+}
+function choiceChange(params, value, selectOnly, isDisabled, current) {
+	const item = params.prop("items").find((entry) => entry.value === value);
+	if (!item || isDisabled(params, item) || params.prop("readOnly") || item.readOnly) return null;
+	const values = current(params);
+	if (!params.prop("multiple")) {
+		if (!values.includes(value)) return [value];
+		return selectOnly || params.prop("required") ? null : [];
+	}
+	const result = toggleSelectionValue(values, item, {
+		min: params.prop("min"),
+		max: params.prop("max")
+	});
+	return result.blocked ? null : result.value;
+}
+/** SSR-pure getters; client handlers use the Zag DOM scope only inside events. */
+function connectChoiceGroup(family, service, normalize) {
+	const ids = choiceIds(family);
+	const id = ids.root(service.scope), multiple = service.prop("multiple"), items = service.prop("items");
+	const values = normalizeChoiceValue(service.context.get("value"), multiple);
+	const isDisabled = (item) => !!service.prop("disabled") || !!item.disabled || service.context.get("disabledIds").includes(ids.input(service.scope, item.value));
+	const readOnly = (item) => !!service.prop("readOnly") || !!item.readOnly;
+	const current = (params) => normalizeChoiceValue(params.context.get("value"), params.prop("multiple"));
+	const sync = () => {
+		const now = current(service);
+		syncSelectionInputs(service.scope, service.prop("items").map((item) => ({
+			id: ids.input(service.scope, item.value),
+			checked: now.includes(item.value)
+		})));
+	};
+	const enabled = items.filter((item) => !isDisabled(item));
+	const focused = service.context.get("focusedValue");
+	const tabAnchor = enabled.find((item) => item.value === focused) ?? enabled.find((item) => values.includes(item.value)) ?? enabled[0];
+	const requiredAnchor = service.prop("required") && !enabled.some((item) => values.includes(item.value)) ? enabled[0]?.value : void 0;
+	const resolve = ({ value }) => {
+		const item = items.find((entry) => entry.value === value);
+		if (!item) throw new RangeError(`${family} item is not present in items`);
+		return item;
+	};
+	const key = (item) => selectionItemKey(item.value);
+	const part = (name) => ({
+		"data-scope": family,
+		"data-part": name
+	});
+	const data = (item) => ({
+		"data-state": values.includes(item.value) ? "checked" : "unchecked",
+		"data-disabled": dataAttr(isDisabled(item)),
+		"data-readonly": dataAttr(readOnly(item)),
+		"data-invalid": dataAttr(service.prop("invalid"))
+	});
+	const describedBy = (item) => mergeDescriptionIds(item.description ? `${id}:description:${key(item)}` : void 0, item.extra ? `${id}:extra:${key(item)}` : void 0);
+	return {
+		value: [...values],
+		items: items.map((item) => ({ ...item })),
+		label: service.prop("label"),
+		description: service.prop("description") ?? "",
+		setValue: (value) => service.send({
+			type: "VALUE.SET",
+			value: normalizeChoiceValue(value, multiple)
+		}),
+		toggleValue: (value) => service.send({
+			type: "VALUE.TOGGLE",
+			value
+		}),
+		clearValue: () => service.send({
+			type: "VALUE.SET",
+			value: []
+		}),
+		getRootProps: (extra = {}) => normalize.element({
+			...part("root"),
+			...extra,
+			id,
+			role: multiple ? "group" : "radiogroup",
+			disabled: !!service.prop("disabled"),
+			form: service.prop("form"),
+			dir: service.prop("dir"),
+			"aria-labelledby": `${id}:label`,
+			"aria-describedby": mergeDescriptionIds(service.prop("description") ? `${id}:description` : void 0, service.prop("describedBy")),
+			"aria-required": !multiple && service.prop("required") || void 0,
+			"aria-readonly": !multiple && service.prop("readOnly") || void 0,
+			"aria-disabled": service.prop("disabled") || items.length > 0 && !enabled.length || void 0,
+			"aria-invalid": service.prop("invalid") || void 0,
+			"data-selection-mode": multiple ? "multiple" : "single",
+			"data-disabled": dataAttr(service.prop("disabled")),
+			"data-readonly": dataAttr(service.prop("readOnly")),
+			"data-invalid": dataAttr(service.prop("invalid"))
+		}),
+		getLabelProps: () => normalize.element({
+			...part("label"),
+			id: `${id}:label`,
+			style: service.prop("hideLabel") ? visuallyHiddenStyle : void 0
+		}),
+		getDescriptionProps: () => normalize.element({
+			...part("description"),
+			id: `${id}:description`,
+			hidden: !service.prop("description")
+		}),
+		getGroupProps: (name) => normalize.element(part(name)),
+		getItemState: (props) => {
+			const item = resolve(props);
+			return {
+				selected: values.includes(item.value),
+				disabled: isDisabled(item),
+				readOnly: readOnly(item)
+			};
+		},
+		getItemProps: (props, name) => {
+			const item = resolve(props);
+			return normalize.label({
+				...part(name),
+				...data(item),
+				htmlFor: ids.input(service.scope, item.value)
+			});
+		},
+		getInputProps(props) {
+			const item = resolve(props), disabled = isDisabled(item), selected = values.includes(item.value);
+			return normalize.input({
+				...part("input"),
+				...data(item),
+				id: ids.input(service.scope, item.value),
+				type: multiple ? "checkbox" : "radio",
+				value: item.value,
+				checked: selected,
+				disabled: !!service.prop("disabled") || !!item.disabled,
+				readOnly: readOnly(item),
+				name: disabled ? void 0 : service.prop("name") || (multiple ? void 0 : service.scope.id),
+				form: service.prop("form"),
+				required: multiple ? requiredAnchor === item.value : !!service.prop("required") && !disabled,
+				tabIndex: multiple ? 0 : tabAnchor?.value === item.value ? 0 : -1,
+				"aria-checked": selected,
+				"aria-readonly": multiple && readOnly(item) || void 0,
+				"aria-invalid": service.prop("invalid") || void 0,
+				"aria-labelledby": `${id}:text:${key(item)}`,
+				"aria-describedby": describedBy(item),
+				style: visuallyHiddenStyle,
+				onChange() {},
+				onFocus() {
+					service.send({
+						type: "FOCUS",
+						value: item.value
+					});
+				},
+				onClick(event) {
+					if (event.defaultPrevented) return;
+					if (!choiceChange(service, item.value, false, (_, entry) => isDisabled(entry), current)) event.preventDefault();
+					service.send({
+						type: "VALUE.TOGGLE",
+						value: item.value
+					});
+					queueMicrotask(sync);
+				},
+				onKeyDown(event) {
+					if (event.defaultPrevented || event.ctrlKey || event.altKey || event.metaKey) return;
+					if (event.key === " " || event.key === "Enter") {
+						event.preventDefault();
+						if (!event.repeat) service.send({
+							type: "VALUE.TOGGLE",
+							value: item.value
+						});
+						queueMicrotask(sync);
+						return;
+					}
+					if (![
+						"ArrowLeft",
+						"ArrowRight",
+						"ArrowUp",
+						"ArrowDown",
+						"Home",
+						"End"
+					].includes(event.key)) return;
+					event.preventDefault();
+					const candidates = service.prop("items").filter((entry) => !isDisabled(entry));
+					if (!candidates.length || isDisabled(item)) return;
+					const direction = service.prop("dir");
+					const pressed = getEventKey(event, { dir: direction === "rtl" || direction === "ltr" ? direction : getComputedStyle(event.currentTarget).direction === "rtl" ? "rtl" : "ltr" }), index = candidates.findIndex((entry) => entry.value === item.value);
+					let target = pressed === "Home" ? 0 : pressed === "End" ? candidates.length - 1 : index + (pressed === "ArrowRight" || pressed === "ArrowDown" ? 1 : -1);
+					if (service.prop("loop")) target = (target + candidates.length) % candidates.length;
+					const next = candidates[target];
+					if (!next) return;
+					service.scope.getById(ids.input(service.scope, next.value))?.focus();
+					service.send({
+						type: "FOCUS",
+						value: next.value
+					});
+					if (!multiple) service.send({
+						type: "VALUE.SELECT",
+						value: next.value
+					});
+				}
+			});
+		},
+		getItemPartProps: (props, name) => normalize.element({
+			...part(name),
+			...data(resolve(props))
+		}),
+		getTextProps: (props, name) => normalize.element({
+			...part(name),
+			id: `${id}:text:${key(resolve(props))}`
+		}),
+		getItemDescriptionProps: (props, name) => {
+			const item = resolve(props);
+			return normalize.element({
+				...part(name),
+				id: `${id}:description:${key(item)}`,
+				hidden: !item.description
+			});
+		},
+		getExtraProps: (props, name) => {
+			const item = resolve(props);
+			return normalize.element({
+				...part(name),
+				id: `${id}:extra:${key(item)}`,
+				hidden: !item.extra
+			});
+		},
+		getCheckProps: (props, name) => {
+			const item = resolve(props);
+			return normalize.element({
+				...part(name),
+				...data(item),
+				"aria-hidden": true,
+				hidden: !values.includes(item.value)
+			});
+		},
+		getCheckIconState: (props) => resolveIconState({
+			id: `${id}:check:${key(resolve(props))}`,
+			name: "check"
+		})
+	};
+}
+//#endregion
+export { normalizeChoiceValue as a, normalizeChoiceItems as i, createChoiceGroupMachine as n, createChoiceGroupProps as r, connectChoiceGroup as t };
+
+//# sourceMappingURL=choice-group-C4c9m0qe.js.map