@zag-js/radio-group 0.17.0 → 0.19.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +0 -8
- package/dist/index.d.ts +0 -8
- package/dist/index.js +25 -6
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +27 -8
- package/dist/index.mjs.map +1 -1
- package/package.json +9 -9
- package/src/radio-group.connect.ts +3 -3
- package/src/radio-group.machine.ts +24 -5
- package/src/radio-group.types.ts +0 -8
package/dist/index.d.mts
CHANGED
|
@@ -36,10 +36,6 @@ type PublicContext = DirectionProperty & CommonProperties & {
|
|
|
36
36
|
* If `true`, the radio group will be disabled
|
|
37
37
|
*/
|
|
38
38
|
disabled?: boolean;
|
|
39
|
-
/**
|
|
40
|
-
* If `true`, the radio group will be readonly
|
|
41
|
-
*/
|
|
42
|
-
readOnly?: boolean;
|
|
43
39
|
/**
|
|
44
40
|
* Function called once a radio is checked
|
|
45
41
|
* @param value the value of the checked radio
|
|
@@ -72,10 +68,6 @@ type RadioProps = {
|
|
|
72
68
|
* If `true`, the radio will be disabled
|
|
73
69
|
*/
|
|
74
70
|
disabled?: boolean;
|
|
75
|
-
/**
|
|
76
|
-
* If `true`, the radio will be readonly
|
|
77
|
-
*/
|
|
78
|
-
readOnly?: boolean;
|
|
79
71
|
/**
|
|
80
72
|
* If `true`, the radio is marked as invalid.
|
|
81
73
|
*/
|
package/dist/index.d.ts
CHANGED
|
@@ -36,10 +36,6 @@ type PublicContext = DirectionProperty & CommonProperties & {
|
|
|
36
36
|
* If `true`, the radio group will be disabled
|
|
37
37
|
*/
|
|
38
38
|
disabled?: boolean;
|
|
39
|
-
/**
|
|
40
|
-
* If `true`, the radio group will be readonly
|
|
41
|
-
*/
|
|
42
|
-
readOnly?: boolean;
|
|
43
39
|
/**
|
|
44
40
|
* Function called once a radio is checked
|
|
45
41
|
* @param value the value of the checked radio
|
|
@@ -72,10 +68,6 @@ type RadioProps = {
|
|
|
72
68
|
* If `true`, the radio will be disabled
|
|
73
69
|
*/
|
|
74
70
|
disabled?: boolean;
|
|
75
|
-
/**
|
|
76
|
-
* If `true`, the radio will be readonly
|
|
77
|
-
*/
|
|
78
|
-
readOnly?: boolean;
|
|
79
71
|
/**
|
|
80
72
|
* If `true`, the radio is marked as invalid.
|
|
81
73
|
*/
|
package/dist/index.js
CHANGED
|
@@ -127,10 +127,10 @@ function connect(state, send, normalize) {
|
|
|
127
127
|
return {
|
|
128
128
|
value: state.context.value,
|
|
129
129
|
setValue(value) {
|
|
130
|
-
send({ type: "SET_VALUE", value,
|
|
130
|
+
send({ type: "SET_VALUE", value, isTrusted: false });
|
|
131
131
|
},
|
|
132
132
|
clearValue() {
|
|
133
|
-
send({ type: "SET_VALUE", value: null,
|
|
133
|
+
send({ type: "SET_VALUE", value: null, isTrusted: false });
|
|
134
134
|
},
|
|
135
135
|
focus,
|
|
136
136
|
blur() {
|
|
@@ -222,7 +222,7 @@ function connect(state, send, normalize) {
|
|
|
222
222
|
if (inputState.isDisabled)
|
|
223
223
|
return;
|
|
224
224
|
if (event.target.checked) {
|
|
225
|
-
send({ type: "SET_VALUE", value: props.value });
|
|
225
|
+
send({ type: "SET_VALUE", value: props.value, isTrusted: true });
|
|
226
226
|
}
|
|
227
227
|
},
|
|
228
228
|
onBlur() {
|
|
@@ -277,6 +277,7 @@ var import_dom_query3 = require("@zag-js/dom-query");
|
|
|
277
277
|
var import_element_rect = require("@zag-js/element-rect");
|
|
278
278
|
var import_form_utils = require("@zag-js/form-utils");
|
|
279
279
|
var import_utils = require("@zag-js/utils");
|
|
280
|
+
var { not } = import_core.guards;
|
|
280
281
|
function machine(userContext) {
|
|
281
282
|
const ctx = (0, import_utils.compact)(userContext);
|
|
282
283
|
return (0, import_core.createMachine)(
|
|
@@ -304,9 +305,15 @@ function machine(userContext) {
|
|
|
304
305
|
value: ["setIndicatorTransition", "syncIndicatorRect", "syncInputElements"]
|
|
305
306
|
},
|
|
306
307
|
on: {
|
|
307
|
-
SET_VALUE:
|
|
308
|
-
|
|
309
|
-
|
|
308
|
+
SET_VALUE: [
|
|
309
|
+
{
|
|
310
|
+
guard: not("isTrusted"),
|
|
311
|
+
actions: ["setValue", "dispatchChangeEvent"]
|
|
312
|
+
},
|
|
313
|
+
{
|
|
314
|
+
actions: ["setValue"]
|
|
315
|
+
}
|
|
316
|
+
],
|
|
310
317
|
SET_HOVERED: {
|
|
311
318
|
actions: "setHovered"
|
|
312
319
|
},
|
|
@@ -322,6 +329,9 @@ function machine(userContext) {
|
|
|
322
329
|
}
|
|
323
330
|
},
|
|
324
331
|
{
|
|
332
|
+
guards: {
|
|
333
|
+
isTrusted: (_ctx, evt) => !!evt.isTrusted
|
|
334
|
+
},
|
|
325
335
|
activities: {
|
|
326
336
|
trackFormControlState(ctx2, _evt, { send, initialContext }) {
|
|
327
337
|
return (0, import_form_utils.trackFormControl)(dom.getRootEl(ctx2), {
|
|
@@ -382,6 +392,15 @@ function machine(userContext) {
|
|
|
382
392
|
});
|
|
383
393
|
}
|
|
384
394
|
});
|
|
395
|
+
},
|
|
396
|
+
dispatchChangeEvent(ctx2) {
|
|
397
|
+
const inputEls = dom.getInputEls(ctx2);
|
|
398
|
+
inputEls.forEach((inputEl) => {
|
|
399
|
+
const checked = inputEl.value === ctx2.value;
|
|
400
|
+
if (checked === inputEl.checked)
|
|
401
|
+
return;
|
|
402
|
+
(0, import_form_utils.dispatchInputCheckedEvent)(inputEl, { checked });
|
|
403
|
+
});
|
|
385
404
|
}
|
|
386
405
|
}
|
|
387
406
|
}
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/radio-group.anatomy.ts","../src/radio-group.connect.ts","../src/radio-group.dom.ts","../src/radio-group.machine.ts"],"sourcesContent":["export { anatomy } from \"./radio-group.anatomy\"\nexport { connect } from \"./radio-group.connect\"\nexport { machine } from \"./radio-group.machine\"\nexport type { UserDefinedContext as Context, MachineApi as Api } from \"./radio-group.types\"\n","import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"radio-group\").parts(\n \"root\",\n \"label\",\n \"radio\",\n \"radioLabel\",\n \"radioControl\",\n \"indicator\",\n)\nexport const parts = anatomy.build()\n","import { ariaAttr, dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { visuallyHiddenStyle } from \"@zag-js/visually-hidden\"\nimport { parts } from \"./radio-group.anatomy\"\nimport { dom } from \"./radio-group.dom\"\nimport type { InputProps, MachineApi, RadioProps, Send, State } from \"./radio-group.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const isGroupDisabled = state.context.isDisabled\n\n function getRadioState<T extends RadioProps>(props: T) {\n const radioState = {\n isInvalid: props.invalid,\n isDisabled: props.disabled || isGroupDisabled,\n isChecked: state.context.value === props.value,\n isFocused: state.context.focusedId === props.value,\n isHovered: state.context.hoveredId === props.value,\n isActive: state.context.activeId === props.value,\n }\n return {\n ...radioState,\n isInteractive: !radioState.isDisabled,\n }\n }\n\n function getRadioDataAttrs<T extends RadioProps>(props: T) {\n const radioState = getRadioState(props)\n return {\n \"data-focus\": dataAttr(radioState.isFocused),\n \"data-disabled\": dataAttr(radioState.isDisabled),\n \"data-state\": radioState.isChecked ? \"checked\" : \"unchecked\",\n \"data-hover\": dataAttr(radioState.isHovered),\n \"data-invalid\": dataAttr(radioState.isInvalid),\n \"data-orientation\": state.context.orientation,\n }\n }\n\n const focus = () => {\n const firstEnabledAndCheckedInput = dom.getFirstEnabledAndCheckedInputEl(state.context)\n\n if (firstEnabledAndCheckedInput) {\n firstEnabledAndCheckedInput.focus()\n return\n }\n\n const firstEnabledInput = dom.getFirstEnabledInputEl(state.context)\n firstEnabledInput?.focus()\n }\n\n return {\n value: state.context.value,\n\n setValue(value: string) {\n send({ type: \"SET_VALUE\", value, manual: true })\n },\n\n clearValue() {\n send({ type: \"SET_VALUE\", value: null, manual: true })\n },\n\n focus,\n\n blur() {\n const focusedElement = dom.getActiveElement(state.context)\n const inputEls = dom.getInputEls(state.context)\n const radioHiddenInputIsFocused = inputEls.some((el) => el === focusedElement)\n if (radioHiddenInputIsFocused) focusedElement?.blur()\n },\n\n getRadioState,\n\n rootProps: normalize.element({\n ...parts.root.attrs,\n role: \"radiogroup\",\n id: dom.getRootId(state.context),\n \"aria-labelledby\": dom.getLabelId(state.context),\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(isGroupDisabled),\n \"aria-orientation\": state.context.orientation,\n dir: state.context.dir,\n }),\n\n labelProps: normalize.element({\n ...parts.label.attrs,\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(isGroupDisabled),\n id: dom.getLabelId(state.context),\n onClick: focus,\n }),\n\n getRadioProps(props: RadioProps) {\n const rootState = getRadioState(props)\n\n return normalize.label({\n ...parts.radio.attrs,\n id: dom.getRadioId(state.context, props.value),\n htmlFor: dom.getRadioHiddenInputId(state.context, props.value),\n ...getRadioDataAttrs(props),\n\n onPointerMove() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_HOVERED\", value: props.value, hovered: true })\n },\n onPointerLeave() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_HOVERED\", value: null })\n },\n onPointerDown(event) {\n if (!rootState.isInteractive) return\n // On pointerdown, the input blurs and returns focus to the `body`,\n // we need to prevent this.\n if (rootState.isFocused && event.pointerType === \"mouse\") {\n event.preventDefault()\n }\n send({ type: \"SET_ACTIVE\", value: props.value, active: true })\n },\n onPointerUp() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_ACTIVE\", value: null })\n },\n })\n },\n\n getRadioLabelProps(props: RadioProps) {\n return normalize.element({\n ...parts.radioLabel.attrs,\n id: dom.getRadioLabelId(state.context, props.value),\n ...getRadioDataAttrs(props),\n })\n },\n\n getRadioControlProps(props: RadioProps) {\n const controlState = getRadioState(props)\n\n return normalize.element({\n ...parts.radioControl.attrs,\n id: dom.getRadioControlId(state.context, props.value),\n \"data-active\": dataAttr(controlState.isActive),\n \"aria-hidden\": true,\n ...getRadioDataAttrs(props),\n })\n },\n\n getRadioHiddenInputProps(props: InputProps) {\n const inputState = getRadioState(props)\n\n const isRequired = props.required\n const trulyDisabled = inputState.isDisabled && !props.focusable\n\n return normalize.input({\n \"data-ownedby\": dom.getRootId(state.context),\n id: dom.getRadioHiddenInputId(state.context, props.value),\n type: \"radio\",\n name: state.context.name || state.context.id,\n form: state.context.form,\n value: props.value,\n onChange(event) {\n if (inputState.isDisabled) return\n\n if (event.target.checked) {\n send({ type: \"SET_VALUE\", value: props.value })\n }\n },\n onBlur() {\n send({ type: \"SET_FOCUSED\", value: null })\n },\n onFocus() {\n send({ type: \"SET_FOCUSED\", value: props.value, focused: true })\n },\n onKeyDown(event) {\n if (event.key === \" \") {\n send({ type: \"SET_ACTIVE\", value: props.value, active: true })\n }\n },\n onKeyUp(event) {\n if (event.key === \" \") {\n send({ type: \"SET_ACTIVE\", value: null })\n }\n },\n disabled: trulyDisabled,\n required: isRequired,\n defaultChecked: inputState.isChecked,\n \"data-disabled\": dataAttr(inputState.isDisabled),\n \"aria-required\": ariaAttr(isRequired),\n \"aria-invalid\": ariaAttr(inputState.isInvalid),\n \"aria-disabled\": ariaAttr(trulyDisabled),\n \"aria-checked\": ariaAttr(inputState.isChecked),\n style: visuallyHiddenStyle,\n })\n },\n\n indicatorProps: normalize.element({\n id: dom.getIndicatorId(state.context),\n ...parts.indicator.attrs,\n \"data-disabled\": dataAttr(isGroupDisabled),\n \"data-orientation\": state.context.orientation,\n style: {\n \"--transition-duration\": \"150ms\",\n \"--transition-property\": \"left, top, width, height\",\n position: \"absolute\",\n willChange: \"var(--transition-property)\",\n transitionProperty: \"var(--transition-property)\",\n transitionDuration: state.context.canIndicatorTransition ? \"var(--transition-duration)\" : \"0ms\",\n transitionTimingFunction: \"var(--transition-timing-function)\",\n ...state.context.indicatorRect,\n },\n }),\n }\n}\n","import { createScope, queryAll } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./radio-group.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `radio-group:${ctx.id}`,\n getLabelId: (ctx: Ctx) => ctx.ids?.label ?? `radio-group:${ctx.id}:label`,\n getRadioId: (ctx: Ctx, value: string) => ctx.ids?.radio?.(value) ?? `radio-group:${ctx.id}:radio:${value}`,\n getRadioHiddenInputId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioHiddenInput?.(value) ?? `radio-group:${ctx.id}:radio:input:${value}`,\n getRadioControlId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioControl?.(value) ?? `radio-group:${ctx.id}:radio:control:${value}`,\n getRadioLabelId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioLabel?.(value) ?? `radio-group:${ctx.id}:radio:label:${value}`,\n getIndicatorId: (ctx: Ctx) => ctx.ids?.indicator ?? `radio-group:${ctx.id}:indicator`,\n\n getRootEl: (ctx: Ctx) => dom.getById(ctx, dom.getRootId(ctx)),\n getRadioHiddenInputEl: (ctx: Ctx, value: string) =>\n dom.getById<HTMLInputElement>(ctx, dom.getRadioHiddenInputId(ctx, value)),\n getIndicatorEl: (ctx: Ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),\n\n getFirstEnabledInputEl: (ctx: Ctx) => dom.getRootEl(ctx)?.querySelector<HTMLInputElement>(\"input:not(:disabled)\"),\n getFirstEnabledAndCheckedInputEl: (ctx: Ctx) =>\n dom.getRootEl(ctx)?.querySelector<HTMLInputElement>(\"input:not(:disabled):checked\"),\n\n getInputEls: (ctx: Ctx) => {\n const ownerId = CSS.escape(dom.getRootId(ctx))\n const selector = `input[type=radio][data-ownedby='${ownerId}']:not([disabled])`\n return queryAll<HTMLInputElement>(dom.getRootEl(ctx), selector)\n },\n\n getActiveRadioEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getById(ctx, dom.getRadioId(ctx, ctx.value))\n },\n\n getOffsetRect: (el: HTMLElement | undefined) => ({\n left: el?.offsetLeft ?? 0,\n top: el?.offsetTop ?? 0,\n width: el?.offsetWidth ?? 0,\n height: el?.offsetHeight ?? 0,\n }),\n\n getRectById: (ctx: Ctx, id: string) => {\n const radioEl = dom.getById(ctx, dom.getRadioId(ctx, id))\n if (!radioEl) return\n return dom.resolveRect(dom.getOffsetRect(radioEl))\n },\n\n resolveRect: (rect: Record<\"width\" | \"height\" | \"left\" | \"top\", number>) => ({\n width: `${rect.width}px`,\n height: `${rect.height}px`,\n left: `${rect.left}px`,\n top: `${rect.top}px`,\n }),\n})\n","import { createMachine } from \"@zag-js/core\"\nimport { nextTick } from \"@zag-js/dom-query\"\nimport { trackElementRect } from \"@zag-js/element-rect\"\nimport { trackFormControl } from \"@zag-js/form-utils\"\nimport { compact, isString } from \"@zag-js/utils\"\nimport { dom } from \"./radio-group.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./radio-group.types\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n id: \"radio\",\n initial: \"idle\",\n context: {\n value: null,\n activeId: null,\n focusedId: null,\n hoveredId: null,\n disabled: false,\n ...ctx,\n indicatorRect: {},\n canIndicatorTransition: false,\n fieldsetDisabled: false,\n },\n\n computed: {\n isDisabled: (ctx) => !!ctx.disabled || ctx.fieldsetDisabled,\n },\n\n entry: [\"syncIndicatorRect\"],\n\n exit: [\"cleanupObserver\"],\n\n activities: [\"trackFormControlState\"],\n\n watch: {\n value: [\"setIndicatorTransition\", \"syncIndicatorRect\", \"syncInputElements\"],\n },\n\n on: {\n SET_VALUE: {\n actions: [\"setValue\"],\n },\n SET_HOVERED: {\n actions: \"setHovered\",\n },\n SET_ACTIVE: {\n actions: \"setActive\",\n },\n SET_FOCUSED: {\n actions: \"setFocused\",\n },\n },\n\n states: {\n idle: {},\n },\n },\n\n {\n activities: {\n trackFormControlState(ctx, _evt, { send, initialContext }) {\n return trackFormControl(dom.getRootEl(ctx), {\n onFieldsetDisabledChange(disabled) {\n ctx.fieldsetDisabled = disabled\n },\n onFormReset() {\n send({ type: \"SET_VALUE\", value: initialContext.value })\n },\n })\n },\n },\n\n actions: {\n setValue(ctx, evt) {\n set.value(ctx, evt.value)\n },\n setHovered(ctx, evt) {\n ctx.hoveredId = evt.value\n },\n setActive(ctx, evt) {\n ctx.activeId = evt.value\n },\n setFocused(ctx, evt) {\n ctx.focusedId = evt.value\n },\n syncInputElements(ctx) {\n const inputs = dom.getInputEls(ctx)\n inputs.forEach((input) => {\n input.checked = input.value === ctx.value\n })\n },\n setIndicatorTransition(ctx) {\n ctx.canIndicatorTransition = isString(ctx.value)\n },\n cleanupObserver(ctx) {\n ctx.indicatorCleanup?.()\n },\n syncIndicatorRect(ctx) {\n ctx.indicatorCleanup?.()\n\n if (!dom.getIndicatorEl(ctx)) return\n\n const value = ctx.value\n\n if (value == null) {\n ctx.indicatorRect = {}\n return\n }\n\n const radioEl = dom.getActiveRadioEl(ctx)\n if (!radioEl) return\n\n ctx.indicatorCleanup = trackElementRect(radioEl, {\n getRect(el) {\n return dom.getOffsetRect(el)\n },\n onChange(rect) {\n ctx.indicatorRect = dom.resolveRect(rect)\n nextTick(() => {\n ctx.canIndicatorTransition = false\n })\n },\n })\n },\n },\n },\n )\n}\n\nconst invoke = {\n change: (ctx: MachineContext) => {\n if (ctx.value == null) return\n ctx.onChange?.({ value: ctx.value })\n },\n}\n\nconst set = {\n value: (ctx: MachineContext, value: string) => {\n ctx.value = value\n invoke.change(ctx)\n },\n}\n"],"mappings":"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","names":["import_dom_query","import_dom_query","ctx"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/radio-group.anatomy.ts","../src/radio-group.connect.ts","../src/radio-group.dom.ts","../src/radio-group.machine.ts"],"sourcesContent":["export { anatomy } from \"./radio-group.anatomy\"\nexport { connect } from \"./radio-group.connect\"\nexport { machine } from \"./radio-group.machine\"\nexport type { UserDefinedContext as Context, MachineApi as Api } from \"./radio-group.types\"\n","import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"radio-group\").parts(\n \"root\",\n \"label\",\n \"radio\",\n \"radioLabel\",\n \"radioControl\",\n \"indicator\",\n)\nexport const parts = anatomy.build()\n","import { ariaAttr, dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { visuallyHiddenStyle } from \"@zag-js/visually-hidden\"\nimport { parts } from \"./radio-group.anatomy\"\nimport { dom } from \"./radio-group.dom\"\nimport type { InputProps, MachineApi, RadioProps, Send, State } from \"./radio-group.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const isGroupDisabled = state.context.isDisabled\n\n function getRadioState<T extends RadioProps>(props: T) {\n const radioState = {\n isInvalid: props.invalid,\n isDisabled: props.disabled || isGroupDisabled,\n isChecked: state.context.value === props.value,\n isFocused: state.context.focusedId === props.value,\n isHovered: state.context.hoveredId === props.value,\n isActive: state.context.activeId === props.value,\n }\n return {\n ...radioState,\n isInteractive: !radioState.isDisabled,\n }\n }\n\n function getRadioDataAttrs<T extends RadioProps>(props: T) {\n const radioState = getRadioState(props)\n return {\n \"data-focus\": dataAttr(radioState.isFocused),\n \"data-disabled\": dataAttr(radioState.isDisabled),\n \"data-state\": radioState.isChecked ? \"checked\" : \"unchecked\",\n \"data-hover\": dataAttr(radioState.isHovered),\n \"data-invalid\": dataAttr(radioState.isInvalid),\n \"data-orientation\": state.context.orientation,\n }\n }\n\n const focus = () => {\n const firstEnabledAndCheckedInput = dom.getFirstEnabledAndCheckedInputEl(state.context)\n\n if (firstEnabledAndCheckedInput) {\n firstEnabledAndCheckedInput.focus()\n return\n }\n\n const firstEnabledInput = dom.getFirstEnabledInputEl(state.context)\n firstEnabledInput?.focus()\n }\n\n return {\n value: state.context.value,\n\n setValue(value: string) {\n send({ type: \"SET_VALUE\", value, isTrusted: false })\n },\n\n clearValue() {\n send({ type: \"SET_VALUE\", value: null, isTrusted: false })\n },\n\n focus,\n\n blur() {\n const focusedElement = dom.getActiveElement(state.context)\n const inputEls = dom.getInputEls(state.context)\n const radioHiddenInputIsFocused = inputEls.some((el) => el === focusedElement)\n if (radioHiddenInputIsFocused) focusedElement?.blur()\n },\n\n getRadioState,\n\n rootProps: normalize.element({\n ...parts.root.attrs,\n role: \"radiogroup\",\n id: dom.getRootId(state.context),\n \"aria-labelledby\": dom.getLabelId(state.context),\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(isGroupDisabled),\n \"aria-orientation\": state.context.orientation,\n dir: state.context.dir,\n }),\n\n labelProps: normalize.element({\n ...parts.label.attrs,\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(isGroupDisabled),\n id: dom.getLabelId(state.context),\n onClick: focus,\n }),\n\n getRadioProps(props: RadioProps) {\n const rootState = getRadioState(props)\n\n return normalize.label({\n ...parts.radio.attrs,\n id: dom.getRadioId(state.context, props.value),\n htmlFor: dom.getRadioHiddenInputId(state.context, props.value),\n ...getRadioDataAttrs(props),\n\n onPointerMove() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_HOVERED\", value: props.value, hovered: true })\n },\n onPointerLeave() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_HOVERED\", value: null })\n },\n onPointerDown(event) {\n if (!rootState.isInteractive) return\n // On pointerdown, the input blurs and returns focus to the `body`,\n // we need to prevent this.\n if (rootState.isFocused && event.pointerType === \"mouse\") {\n event.preventDefault()\n }\n send({ type: \"SET_ACTIVE\", value: props.value, active: true })\n },\n onPointerUp() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_ACTIVE\", value: null })\n },\n })\n },\n\n getRadioLabelProps(props: RadioProps) {\n return normalize.element({\n ...parts.radioLabel.attrs,\n id: dom.getRadioLabelId(state.context, props.value),\n ...getRadioDataAttrs(props),\n })\n },\n\n getRadioControlProps(props: RadioProps) {\n const controlState = getRadioState(props)\n\n return normalize.element({\n ...parts.radioControl.attrs,\n id: dom.getRadioControlId(state.context, props.value),\n \"data-active\": dataAttr(controlState.isActive),\n \"aria-hidden\": true,\n ...getRadioDataAttrs(props),\n })\n },\n\n getRadioHiddenInputProps(props: InputProps) {\n const inputState = getRadioState(props)\n\n const isRequired = props.required\n const trulyDisabled = inputState.isDisabled && !props.focusable\n\n return normalize.input({\n \"data-ownedby\": dom.getRootId(state.context),\n id: dom.getRadioHiddenInputId(state.context, props.value),\n type: \"radio\",\n name: state.context.name || state.context.id,\n form: state.context.form,\n value: props.value,\n onChange(event) {\n if (inputState.isDisabled) return\n\n if (event.target.checked) {\n send({ type: \"SET_VALUE\", value: props.value, isTrusted: true })\n }\n },\n onBlur() {\n send({ type: \"SET_FOCUSED\", value: null })\n },\n onFocus() {\n send({ type: \"SET_FOCUSED\", value: props.value, focused: true })\n },\n onKeyDown(event) {\n if (event.key === \" \") {\n send({ type: \"SET_ACTIVE\", value: props.value, active: true })\n }\n },\n onKeyUp(event) {\n if (event.key === \" \") {\n send({ type: \"SET_ACTIVE\", value: null })\n }\n },\n disabled: trulyDisabled,\n required: isRequired,\n defaultChecked: inputState.isChecked,\n \"data-disabled\": dataAttr(inputState.isDisabled),\n \"aria-required\": ariaAttr(isRequired),\n \"aria-invalid\": ariaAttr(inputState.isInvalid),\n \"aria-disabled\": ariaAttr(trulyDisabled),\n \"aria-checked\": ariaAttr(inputState.isChecked),\n style: visuallyHiddenStyle,\n })\n },\n\n indicatorProps: normalize.element({\n id: dom.getIndicatorId(state.context),\n ...parts.indicator.attrs,\n \"data-disabled\": dataAttr(isGroupDisabled),\n \"data-orientation\": state.context.orientation,\n style: {\n \"--transition-duration\": \"150ms\",\n \"--transition-property\": \"left, top, width, height\",\n position: \"absolute\",\n willChange: \"var(--transition-property)\",\n transitionProperty: \"var(--transition-property)\",\n transitionDuration: state.context.canIndicatorTransition ? \"var(--transition-duration)\" : \"0ms\",\n transitionTimingFunction: \"var(--transition-timing-function)\",\n ...state.context.indicatorRect,\n },\n }),\n }\n}\n","import { createScope, queryAll } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./radio-group.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `radio-group:${ctx.id}`,\n getLabelId: (ctx: Ctx) => ctx.ids?.label ?? `radio-group:${ctx.id}:label`,\n getRadioId: (ctx: Ctx, value: string) => ctx.ids?.radio?.(value) ?? `radio-group:${ctx.id}:radio:${value}`,\n getRadioHiddenInputId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioHiddenInput?.(value) ?? `radio-group:${ctx.id}:radio:input:${value}`,\n getRadioControlId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioControl?.(value) ?? `radio-group:${ctx.id}:radio:control:${value}`,\n getRadioLabelId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioLabel?.(value) ?? `radio-group:${ctx.id}:radio:label:${value}`,\n getIndicatorId: (ctx: Ctx) => ctx.ids?.indicator ?? `radio-group:${ctx.id}:indicator`,\n\n getRootEl: (ctx: Ctx) => dom.getById(ctx, dom.getRootId(ctx)),\n getRadioHiddenInputEl: (ctx: Ctx, value: string) =>\n dom.getById<HTMLInputElement>(ctx, dom.getRadioHiddenInputId(ctx, value)),\n getIndicatorEl: (ctx: Ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),\n\n getFirstEnabledInputEl: (ctx: Ctx) => dom.getRootEl(ctx)?.querySelector<HTMLInputElement>(\"input:not(:disabled)\"),\n getFirstEnabledAndCheckedInputEl: (ctx: Ctx) =>\n dom.getRootEl(ctx)?.querySelector<HTMLInputElement>(\"input:not(:disabled):checked\"),\n\n getInputEls: (ctx: Ctx) => {\n const ownerId = CSS.escape(dom.getRootId(ctx))\n const selector = `input[type=radio][data-ownedby='${ownerId}']:not([disabled])`\n return queryAll<HTMLInputElement>(dom.getRootEl(ctx), selector)\n },\n\n getActiveRadioEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getById(ctx, dom.getRadioId(ctx, ctx.value))\n },\n\n getOffsetRect: (el: HTMLElement | undefined) => ({\n left: el?.offsetLeft ?? 0,\n top: el?.offsetTop ?? 0,\n width: el?.offsetWidth ?? 0,\n height: el?.offsetHeight ?? 0,\n }),\n\n getRectById: (ctx: Ctx, id: string) => {\n const radioEl = dom.getById(ctx, dom.getRadioId(ctx, id))\n if (!radioEl) return\n return dom.resolveRect(dom.getOffsetRect(radioEl))\n },\n\n resolveRect: (rect: Record<\"width\" | \"height\" | \"left\" | \"top\", number>) => ({\n width: `${rect.width}px`,\n height: `${rect.height}px`,\n left: `${rect.left}px`,\n top: `${rect.top}px`,\n }),\n})\n","import { createMachine, guards } from \"@zag-js/core\"\nimport { nextTick } from \"@zag-js/dom-query\"\nimport { trackElementRect } from \"@zag-js/element-rect\"\nimport { dispatchInputCheckedEvent, trackFormControl } from \"@zag-js/form-utils\"\nimport { compact, isString } from \"@zag-js/utils\"\nimport { dom } from \"./radio-group.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./radio-group.types\"\n\nconst { not } = guards\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n id: \"radio\",\n initial: \"idle\",\n context: {\n value: null,\n activeId: null,\n focusedId: null,\n hoveredId: null,\n disabled: false,\n ...ctx,\n indicatorRect: {},\n canIndicatorTransition: false,\n fieldsetDisabled: false,\n },\n\n computed: {\n isDisabled: (ctx) => !!ctx.disabled || ctx.fieldsetDisabled,\n },\n\n entry: [\"syncIndicatorRect\"],\n\n exit: [\"cleanupObserver\"],\n\n activities: [\"trackFormControlState\"],\n\n watch: {\n value: [\"setIndicatorTransition\", \"syncIndicatorRect\", \"syncInputElements\"],\n },\n\n on: {\n SET_VALUE: [\n {\n guard: not(\"isTrusted\"),\n actions: [\"setValue\", \"dispatchChangeEvent\"],\n },\n {\n actions: [\"setValue\"],\n },\n ],\n SET_HOVERED: {\n actions: \"setHovered\",\n },\n SET_ACTIVE: {\n actions: \"setActive\",\n },\n SET_FOCUSED: {\n actions: \"setFocused\",\n },\n },\n\n states: {\n idle: {},\n },\n },\n\n {\n guards: {\n isTrusted: (_ctx, evt) => !!evt.isTrusted,\n },\n activities: {\n trackFormControlState(ctx, _evt, { send, initialContext }) {\n return trackFormControl(dom.getRootEl(ctx), {\n onFieldsetDisabledChange(disabled) {\n ctx.fieldsetDisabled = disabled\n },\n onFormReset() {\n send({ type: \"SET_VALUE\", value: initialContext.value })\n },\n })\n },\n },\n\n actions: {\n setValue(ctx, evt) {\n set.value(ctx, evt.value)\n },\n setHovered(ctx, evt) {\n ctx.hoveredId = evt.value\n },\n setActive(ctx, evt) {\n ctx.activeId = evt.value\n },\n setFocused(ctx, evt) {\n ctx.focusedId = evt.value\n },\n syncInputElements(ctx) {\n const inputs = dom.getInputEls(ctx)\n inputs.forEach((input) => {\n input.checked = input.value === ctx.value\n })\n },\n setIndicatorTransition(ctx) {\n ctx.canIndicatorTransition = isString(ctx.value)\n },\n cleanupObserver(ctx) {\n ctx.indicatorCleanup?.()\n },\n syncIndicatorRect(ctx) {\n ctx.indicatorCleanup?.()\n\n if (!dom.getIndicatorEl(ctx)) return\n\n const value = ctx.value\n\n if (value == null) {\n ctx.indicatorRect = {}\n return\n }\n\n const radioEl = dom.getActiveRadioEl(ctx)\n if (!radioEl) return\n\n ctx.indicatorCleanup = trackElementRect(radioEl, {\n getRect(el) {\n return dom.getOffsetRect(el)\n },\n onChange(rect) {\n ctx.indicatorRect = dom.resolveRect(rect)\n nextTick(() => {\n ctx.canIndicatorTransition = false\n })\n },\n })\n },\n dispatchChangeEvent(ctx) {\n const inputEls = dom.getInputEls(ctx)\n inputEls.forEach((inputEl) => {\n const checked = inputEl.value === ctx.value\n if (checked === inputEl.checked) return\n dispatchInputCheckedEvent(inputEl, { checked })\n })\n },\n },\n },\n )\n}\n\nconst invoke = {\n change: (ctx: MachineContext) => {\n if (ctx.value == null) return\n ctx.onChange?.({ value: ctx.value })\n },\n}\n\nconst set = {\n value: (ctx: MachineContext, value: string) => {\n ctx.value = value\n invoke.change(ctx)\n },\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,qBAA8B;AAEvB,IAAM,cAAU,8BAAc,aAAa,EAAE;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AACO,IAAM,QAAQ,QAAQ,MAAM;;;ACVnC,IAAAA,oBAAmC;AAEnC,6BAAoC;;;ACFpC,uBAAsC;AAG/B,IAAM,UAAM,8BAAY;AAAA,EAC7B,WAAW,CAAC,QAAa,IAAI,KAAK,QAAQ,eAAe,IAAI,EAAE;AAAA,EAC/D,YAAY,CAAC,QAAa,IAAI,KAAK,SAAS,eAAe,IAAI,EAAE;AAAA,EACjE,YAAY,CAAC,KAAU,UAAkB,IAAI,KAAK,QAAQ,KAAK,KAAK,eAAe,IAAI,EAAE,UAAU,KAAK;AAAA,EACxG,uBAAuB,CAAC,KAAU,UAChC,IAAI,KAAK,mBAAmB,KAAK,KAAK,eAAe,IAAI,EAAE,gBAAgB,KAAK;AAAA,EAClF,mBAAmB,CAAC,KAAU,UAC5B,IAAI,KAAK,eAAe,KAAK,KAAK,eAAe,IAAI,EAAE,kBAAkB,KAAK;AAAA,EAChF,iBAAiB,CAAC,KAAU,UAC1B,IAAI,KAAK,aAAa,KAAK,KAAK,eAAe,IAAI,EAAE,gBAAgB,KAAK;AAAA,EAC5E,gBAAgB,CAAC,QAAa,IAAI,KAAK,aAAa,eAAe,IAAI,EAAE;AAAA,EAEzE,WAAW,CAAC,QAAa,IAAI,QAAQ,KAAK,IAAI,UAAU,GAAG,CAAC;AAAA,EAC5D,uBAAuB,CAAC,KAAU,UAChC,IAAI,QAA0B,KAAK,IAAI,sBAAsB,KAAK,KAAK,CAAC;AAAA,EAC1E,gBAAgB,CAAC,QAAa,IAAI,QAAQ,KAAK,IAAI,eAAe,GAAG,CAAC;AAAA,EAEtE,wBAAwB,CAAC,QAAa,IAAI,UAAU,GAAG,GAAG,cAAgC,sBAAsB;AAAA,EAChH,kCAAkC,CAAC,QACjC,IAAI,UAAU,GAAG,GAAG,cAAgC,8BAA8B;AAAA,EAEpF,aAAa,CAAC,QAAa;AACzB,UAAM,UAAU,IAAI,OAAO,IAAI,UAAU,GAAG,CAAC;AAC7C,UAAM,WAAW,mCAAmC,OAAO;AAC3D,eAAO,2BAA2B,IAAI,UAAU,GAAG,GAAG,QAAQ;AAAA,EAChE;AAAA,EAEA,kBAAkB,CAAC,QAAa;AAC9B,QAAI,CAAC,IAAI;AAAO;AAChB,WAAO,IAAI,QAAQ,KAAK,IAAI,WAAW,KAAK,IAAI,KAAK,CAAC;AAAA,EACxD;AAAA,EAEA,eAAe,CAAC,QAAiC;AAAA,IAC/C,MAAM,IAAI,cAAc;AAAA,IACxB,KAAK,IAAI,aAAa;AAAA,IACtB,OAAO,IAAI,eAAe;AAAA,IAC1B,QAAQ,IAAI,gBAAgB;AAAA,EAC9B;AAAA,EAEA,aAAa,CAAC,KAAU,OAAe;AACrC,UAAM,UAAU,IAAI,QAAQ,KAAK,IAAI,WAAW,KAAK,EAAE,CAAC;AACxD,QAAI,CAAC;AAAS;AACd,WAAO,IAAI,YAAY,IAAI,cAAc,OAAO,CAAC;AAAA,EACnD;AAAA,EAEA,aAAa,CAAC,UAA+D;AAAA,IAC3E,OAAO,GAAG,KAAK,KAAK;AAAA,IACpB,QAAQ,GAAG,KAAK,MAAM;AAAA,IACtB,MAAM,GAAG,KAAK,IAAI;AAAA,IAClB,KAAK,GAAG,KAAK,GAAG;AAAA,EAClB;AACF,CAAC;;;AD/CM,SAAS,QAA6B,OAAc,MAAY,WAA6C;AAClH,QAAM,kBAAkB,MAAM,QAAQ;AAEtC,WAAS,cAAoC,OAAU;AACrD,UAAM,aAAa;AAAA,MACjB,WAAW,MAAM;AAAA,MACjB,YAAY,MAAM,YAAY;AAAA,MAC9B,WAAW,MAAM,QAAQ,UAAU,MAAM;AAAA,MACzC,WAAW,MAAM,QAAQ,cAAc,MAAM;AAAA,MAC7C,WAAW,MAAM,QAAQ,cAAc,MAAM;AAAA,MAC7C,UAAU,MAAM,QAAQ,aAAa,MAAM;AAAA,IAC7C;AACA,WAAO;AAAA,MACL,GAAG;AAAA,MACH,eAAe,CAAC,WAAW;AAAA,IAC7B;AAAA,EACF;AAEA,WAAS,kBAAwC,OAAU;AACzD,UAAM,aAAa,cAAc,KAAK;AACtC,WAAO;AAAA,MACL,kBAAc,4BAAS,WAAW,SAAS;AAAA,MAC3C,qBAAiB,4BAAS,WAAW,UAAU;AAAA,MAC/C,cAAc,WAAW,YAAY,YAAY;AAAA,MACjD,kBAAc,4BAAS,WAAW,SAAS;AAAA,MAC3C,oBAAgB,4BAAS,WAAW,SAAS;AAAA,MAC7C,oBAAoB,MAAM,QAAQ;AAAA,IACpC;AAAA,EACF;AAEA,QAAM,QAAQ,MAAM;AAClB,UAAM,8BAA8B,IAAI,iCAAiC,MAAM,OAAO;AAEtF,QAAI,6BAA6B;AAC/B,kCAA4B,MAAM;AAClC;AAAA,IACF;AAEA,UAAM,oBAAoB,IAAI,uBAAuB,MAAM,OAAO;AAClE,uBAAmB,MAAM;AAAA,EAC3B;AAEA,SAAO;AAAA,IACL,OAAO,MAAM,QAAQ;AAAA,IAErB,SAAS,OAAe;AACtB,WAAK,EAAE,MAAM,aAAa,OAAO,WAAW,MAAM,CAAC;AAAA,IACrD;AAAA,IAEA,aAAa;AACX,WAAK,EAAE,MAAM,aAAa,OAAO,MAAM,WAAW,MAAM,CAAC;AAAA,IAC3D;AAAA,IAEA;AAAA,IAEA,OAAO;AACL,YAAM,iBAAiB,IAAI,iBAAiB,MAAM,OAAO;AACzD,YAAM,WAAW,IAAI,YAAY,MAAM,OAAO;AAC9C,YAAM,4BAA4B,SAAS,KAAK,CAAC,OAAO,OAAO,cAAc;AAC7E,UAAI;AAA2B,wBAAgB,KAAK;AAAA,IACtD;AAAA,IAEA;AAAA,IAEA,WAAW,UAAU,QAAQ;AAAA,MAC3B,GAAG,MAAM,KAAK;AAAA,MACd,MAAM;AAAA,MACN,IAAI,IAAI,UAAU,MAAM,OAAO;AAAA,MAC/B,mBAAmB,IAAI,WAAW,MAAM,OAAO;AAAA,MAC/C,oBAAoB,MAAM,QAAQ;AAAA,MAClC,qBAAiB,4BAAS,eAAe;AAAA,MACzC,oBAAoB,MAAM,QAAQ;AAAA,MAClC,KAAK,MAAM,QAAQ;AAAA,IACrB,CAAC;AAAA,IAED,YAAY,UAAU,QAAQ;AAAA,MAC5B,GAAG,MAAM,MAAM;AAAA,MACf,oBAAoB,MAAM,QAAQ;AAAA,MAClC,qBAAiB,4BAAS,eAAe;AAAA,MACzC,IAAI,IAAI,WAAW,MAAM,OAAO;AAAA,MAChC,SAAS;AAAA,IACX,CAAC;AAAA,IAED,cAAc,OAAmB;AAC/B,YAAM,YAAY,cAAc,KAAK;AAErC,aAAO,UAAU,MAAM;AAAA,QACrB,GAAG,MAAM,MAAM;AAAA,QACf,IAAI,IAAI,WAAW,MAAM,SAAS,MAAM,KAAK;AAAA,QAC7C,SAAS,IAAI,sBAAsB,MAAM,SAAS,MAAM,KAAK;AAAA,QAC7D,GAAG,kBAAkB,KAAK;AAAA,QAE1B,gBAAgB;AACd,cAAI,CAAC,UAAU;AAAe;AAC9B,eAAK,EAAE,MAAM,eAAe,OAAO,MAAM,OAAO,SAAS,KAAK,CAAC;AAAA,QACjE;AAAA,QACA,iBAAiB;AACf,cAAI,CAAC,UAAU;AAAe;AAC9B,eAAK,EAAE,MAAM,eAAe,OAAO,KAAK,CAAC;AAAA,QAC3C;AAAA,QACA,cAAc,OAAO;AACnB,cAAI,CAAC,UAAU;AAAe;AAG9B,cAAI,UAAU,aAAa,MAAM,gBAAgB,SAAS;AACxD,kBAAM,eAAe;AAAA,UACvB;AACA,eAAK,EAAE,MAAM,cAAc,OAAO,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,QAC/D;AAAA,QACA,cAAc;AACZ,cAAI,CAAC,UAAU;AAAe;AAC9B,eAAK,EAAE,MAAM,cAAc,OAAO,KAAK,CAAC;AAAA,QAC1C;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,mBAAmB,OAAmB;AACpC,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,WAAW;AAAA,QACpB,IAAI,IAAI,gBAAgB,MAAM,SAAS,MAAM,KAAK;AAAA,QAClD,GAAG,kBAAkB,KAAK;AAAA,MAC5B,CAAC;AAAA,IACH;AAAA,IAEA,qBAAqB,OAAmB;AACtC,YAAM,eAAe,cAAc,KAAK;AAExC,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,aAAa;AAAA,QACtB,IAAI,IAAI,kBAAkB,MAAM,SAAS,MAAM,KAAK;AAAA,QACpD,mBAAe,4BAAS,aAAa,QAAQ;AAAA,QAC7C,eAAe;AAAA,QACf,GAAG,kBAAkB,KAAK;AAAA,MAC5B,CAAC;AAAA,IACH;AAAA,IAEA,yBAAyB,OAAmB;AAC1C,YAAM,aAAa,cAAc,KAAK;AAEtC,YAAM,aAAa,MAAM;AACzB,YAAM,gBAAgB,WAAW,cAAc,CAAC,MAAM;AAEtD,aAAO,UAAU,MAAM;AAAA,QACrB,gBAAgB,IAAI,UAAU,MAAM,OAAO;AAAA,QAC3C,IAAI,IAAI,sBAAsB,MAAM,SAAS,MAAM,KAAK;AAAA,QACxD,MAAM;AAAA,QACN,MAAM,MAAM,QAAQ,QAAQ,MAAM,QAAQ;AAAA,QAC1C,MAAM,MAAM,QAAQ;AAAA,QACpB,OAAO,MAAM;AAAA,QACb,SAAS,OAAO;AACd,cAAI,WAAW;AAAY;AAE3B,cAAI,MAAM,OAAO,SAAS;AACxB,iBAAK,EAAE,MAAM,aAAa,OAAO,MAAM,OAAO,WAAW,KAAK,CAAC;AAAA,UACjE;AAAA,QACF;AAAA,QACA,SAAS;AACP,eAAK,EAAE,MAAM,eAAe,OAAO,KAAK,CAAC;AAAA,QAC3C;AAAA,QACA,UAAU;AACR,eAAK,EAAE,MAAM,eAAe,OAAO,MAAM,OAAO,SAAS,KAAK,CAAC;AAAA,QACjE;AAAA,QACA,UAAU,OAAO;AACf,cAAI,MAAM,QAAQ,KAAK;AACrB,iBAAK,EAAE,MAAM,cAAc,OAAO,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,UAC/D;AAAA,QACF;AAAA,QACA,QAAQ,OAAO;AACb,cAAI,MAAM,QAAQ,KAAK;AACrB,iBAAK,EAAE,MAAM,cAAc,OAAO,KAAK,CAAC;AAAA,UAC1C;AAAA,QACF;AAAA,QACA,UAAU;AAAA,QACV,UAAU;AAAA,QACV,gBAAgB,WAAW;AAAA,QAC3B,qBAAiB,4BAAS,WAAW,UAAU;AAAA,QAC/C,qBAAiB,4BAAS,UAAU;AAAA,QACpC,oBAAgB,4BAAS,WAAW,SAAS;AAAA,QAC7C,qBAAiB,4BAAS,aAAa;AAAA,QACvC,oBAAgB,4BAAS,WAAW,SAAS;AAAA,QAC7C,OAAO;AAAA,MACT,CAAC;AAAA,IACH;AAAA,IAEA,gBAAgB,UAAU,QAAQ;AAAA,MAChC,IAAI,IAAI,eAAe,MAAM,OAAO;AAAA,MACpC,GAAG,MAAM,UAAU;AAAA,MACnB,qBAAiB,4BAAS,eAAe;AAAA,MACzC,oBAAoB,MAAM,QAAQ;AAAA,MAClC,OAAO;AAAA,QACL,yBAAyB;AAAA,QACzB,yBAAyB;AAAA,QACzB,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,oBAAoB;AAAA,QACpB,oBAAoB,MAAM,QAAQ,yBAAyB,+BAA+B;AAAA,QAC1F,0BAA0B;AAAA,QAC1B,GAAG,MAAM,QAAQ;AAAA,MACnB;AAAA,IACF,CAAC;AAAA,EACH;AACF;;;AEhNA,kBAAsC;AACtC,IAAAC,oBAAyB;AACzB,0BAAiC;AACjC,wBAA4D;AAC5D,mBAAkC;AAIlC,IAAM,EAAE,IAAI,IAAI;AAET,SAAS,QAAQ,aAAiC;AACvD,QAAM,UAAM,sBAAQ,WAAW;AAC/B,aAAO;AAAA,IACL;AAAA,MACE,IAAI;AAAA,MACJ,SAAS;AAAA,MACT,SAAS;AAAA,QACP,OAAO;AAAA,QACP,UAAU;AAAA,QACV,WAAW;AAAA,QACX,WAAW;AAAA,QACX,UAAU;AAAA,QACV,GAAG;AAAA,QACH,eAAe,CAAC;AAAA,QAChB,wBAAwB;AAAA,QACxB,kBAAkB;AAAA,MACpB;AAAA,MAEA,UAAU;AAAA,QACR,YAAY,CAACC,SAAQ,CAAC,CAACA,KAAI,YAAYA,KAAI;AAAA,MAC7C;AAAA,MAEA,OAAO,CAAC,mBAAmB;AAAA,MAE3B,MAAM,CAAC,iBAAiB;AAAA,MAExB,YAAY,CAAC,uBAAuB;AAAA,MAEpC,OAAO;AAAA,QACL,OAAO,CAAC,0BAA0B,qBAAqB,mBAAmB;AAAA,MAC5E;AAAA,MAEA,IAAI;AAAA,QACF,WAAW;AAAA,UACT;AAAA,YACE,OAAO,IAAI,WAAW;AAAA,YACtB,SAAS,CAAC,YAAY,qBAAqB;AAAA,UAC7C;AAAA,UACA;AAAA,YACE,SAAS,CAAC,UAAU;AAAA,UACtB;AAAA,QACF;AAAA,QACA,aAAa;AAAA,UACX,SAAS;AAAA,QACX;AAAA,QACA,YAAY;AAAA,UACV,SAAS;AAAA,QACX;AAAA,QACA,aAAa;AAAA,UACX,SAAS;AAAA,QACX;AAAA,MACF;AAAA,MAEA,QAAQ;AAAA,QACN,MAAM,CAAC;AAAA,MACT;AAAA,IACF;AAAA,IAEA;AAAA,MACE,QAAQ;AAAA,QACN,WAAW,CAAC,MAAM,QAAQ,CAAC,CAAC,IAAI;AAAA,MAClC;AAAA,MACA,YAAY;AAAA,QACV,sBAAsBA,MAAK,MAAM,EAAE,MAAM,eAAe,GAAG;AACzD,qBAAO,oCAAiB,IAAI,UAAUA,IAAG,GAAG;AAAA,YAC1C,yBAAyB,UAAU;AACjC,cAAAA,KAAI,mBAAmB;AAAA,YACzB;AAAA,YACA,cAAc;AACZ,mBAAK,EAAE,MAAM,aAAa,OAAO,eAAe,MAAM,CAAC;AAAA,YACzD;AAAA,UACF,CAAC;AAAA,QACH;AAAA,MACF;AAAA,MAEA,SAAS;AAAA,QACP,SAASA,MAAK,KAAK;AACjB,cAAI,MAAMA,MAAK,IAAI,KAAK;AAAA,QAC1B;AAAA,QACA,WAAWA,MAAK,KAAK;AACnB,UAAAA,KAAI,YAAY,IAAI;AAAA,QACtB;AAAA,QACA,UAAUA,MAAK,KAAK;AAClB,UAAAA,KAAI,WAAW,IAAI;AAAA,QACrB;AAAA,QACA,WAAWA,MAAK,KAAK;AACnB,UAAAA,KAAI,YAAY,IAAI;AAAA,QACtB;AAAA,QACA,kBAAkBA,MAAK;AACrB,gBAAM,SAAS,IAAI,YAAYA,IAAG;AAClC,iBAAO,QAAQ,CAAC,UAAU;AACxB,kBAAM,UAAU,MAAM,UAAUA,KAAI;AAAA,UACtC,CAAC;AAAA,QACH;AAAA,QACA,uBAAuBA,MAAK;AAC1B,UAAAA,KAAI,6BAAyB,uBAASA,KAAI,KAAK;AAAA,QACjD;AAAA,QACA,gBAAgBA,MAAK;AACnB,UAAAA,KAAI,mBAAmB;AAAA,QACzB;AAAA,QACA,kBAAkBA,MAAK;AACrB,UAAAA,KAAI,mBAAmB;AAEvB,cAAI,CAAC,IAAI,eAAeA,IAAG;AAAG;AAE9B,gBAAM,QAAQA,KAAI;AAElB,cAAI,SAAS,MAAM;AACjB,YAAAA,KAAI,gBAAgB,CAAC;AACrB;AAAA,UACF;AAEA,gBAAM,UAAU,IAAI,iBAAiBA,IAAG;AACxC,cAAI,CAAC;AAAS;AAEd,UAAAA,KAAI,uBAAmB,sCAAiB,SAAS;AAAA,YAC/C,QAAQ,IAAI;AACV,qBAAO,IAAI,cAAc,EAAE;AAAA,YAC7B;AAAA,YACA,SAAS,MAAM;AACb,cAAAA,KAAI,gBAAgB,IAAI,YAAY,IAAI;AACxC,8CAAS,MAAM;AACb,gBAAAA,KAAI,yBAAyB;AAAA,cAC/B,CAAC;AAAA,YACH;AAAA,UACF,CAAC;AAAA,QACH;AAAA,QACA,oBAAoBA,MAAK;AACvB,gBAAM,WAAW,IAAI,YAAYA,IAAG;AACpC,mBAAS,QAAQ,CAAC,YAAY;AAC5B,kBAAM,UAAU,QAAQ,UAAUA,KAAI;AACtC,gBAAI,YAAY,QAAQ;AAAS;AACjC,6DAA0B,SAAS,EAAE,QAAQ,CAAC;AAAA,UAChD,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEA,IAAM,SAAS;AAAA,EACb,QAAQ,CAAC,QAAwB;AAC/B,QAAI,IAAI,SAAS;AAAM;AACvB,QAAI,WAAW,EAAE,OAAO,IAAI,MAAM,CAAC;AAAA,EACrC;AACF;AAEA,IAAM,MAAM;AAAA,EACV,OAAO,CAAC,KAAqB,UAAkB;AAC7C,QAAI,QAAQ;AACZ,WAAO,OAAO,GAAG;AAAA,EACnB;AACF;","names":["import_dom_query","import_dom_query","ctx"]}
|
package/dist/index.mjs
CHANGED
|
@@ -99,10 +99,10 @@ function connect(state, send, normalize) {
|
|
|
99
99
|
return {
|
|
100
100
|
value: state.context.value,
|
|
101
101
|
setValue(value) {
|
|
102
|
-
send({ type: "SET_VALUE", value,
|
|
102
|
+
send({ type: "SET_VALUE", value, isTrusted: false });
|
|
103
103
|
},
|
|
104
104
|
clearValue() {
|
|
105
|
-
send({ type: "SET_VALUE", value: null,
|
|
105
|
+
send({ type: "SET_VALUE", value: null, isTrusted: false });
|
|
106
106
|
},
|
|
107
107
|
focus,
|
|
108
108
|
blur() {
|
|
@@ -194,7 +194,7 @@ function connect(state, send, normalize) {
|
|
|
194
194
|
if (inputState.isDisabled)
|
|
195
195
|
return;
|
|
196
196
|
if (event.target.checked) {
|
|
197
|
-
send({ type: "SET_VALUE", value: props.value });
|
|
197
|
+
send({ type: "SET_VALUE", value: props.value, isTrusted: true });
|
|
198
198
|
}
|
|
199
199
|
},
|
|
200
200
|
onBlur() {
|
|
@@ -244,11 +244,12 @@ function connect(state, send, normalize) {
|
|
|
244
244
|
}
|
|
245
245
|
|
|
246
246
|
// src/radio-group.machine.ts
|
|
247
|
-
import { createMachine } from "@zag-js/core";
|
|
247
|
+
import { createMachine, guards } from "@zag-js/core";
|
|
248
248
|
import { nextTick } from "@zag-js/dom-query";
|
|
249
249
|
import { trackElementRect } from "@zag-js/element-rect";
|
|
250
|
-
import { trackFormControl } from "@zag-js/form-utils";
|
|
250
|
+
import { dispatchInputCheckedEvent, trackFormControl } from "@zag-js/form-utils";
|
|
251
251
|
import { compact, isString } from "@zag-js/utils";
|
|
252
|
+
var { not } = guards;
|
|
252
253
|
function machine(userContext) {
|
|
253
254
|
const ctx = compact(userContext);
|
|
254
255
|
return createMachine(
|
|
@@ -276,9 +277,15 @@ function machine(userContext) {
|
|
|
276
277
|
value: ["setIndicatorTransition", "syncIndicatorRect", "syncInputElements"]
|
|
277
278
|
},
|
|
278
279
|
on: {
|
|
279
|
-
SET_VALUE:
|
|
280
|
-
|
|
281
|
-
|
|
280
|
+
SET_VALUE: [
|
|
281
|
+
{
|
|
282
|
+
guard: not("isTrusted"),
|
|
283
|
+
actions: ["setValue", "dispatchChangeEvent"]
|
|
284
|
+
},
|
|
285
|
+
{
|
|
286
|
+
actions: ["setValue"]
|
|
287
|
+
}
|
|
288
|
+
],
|
|
282
289
|
SET_HOVERED: {
|
|
283
290
|
actions: "setHovered"
|
|
284
291
|
},
|
|
@@ -294,6 +301,9 @@ function machine(userContext) {
|
|
|
294
301
|
}
|
|
295
302
|
},
|
|
296
303
|
{
|
|
304
|
+
guards: {
|
|
305
|
+
isTrusted: (_ctx, evt) => !!evt.isTrusted
|
|
306
|
+
},
|
|
297
307
|
activities: {
|
|
298
308
|
trackFormControlState(ctx2, _evt, { send, initialContext }) {
|
|
299
309
|
return trackFormControl(dom.getRootEl(ctx2), {
|
|
@@ -354,6 +364,15 @@ function machine(userContext) {
|
|
|
354
364
|
});
|
|
355
365
|
}
|
|
356
366
|
});
|
|
367
|
+
},
|
|
368
|
+
dispatchChangeEvent(ctx2) {
|
|
369
|
+
const inputEls = dom.getInputEls(ctx2);
|
|
370
|
+
inputEls.forEach((inputEl) => {
|
|
371
|
+
const checked = inputEl.value === ctx2.value;
|
|
372
|
+
if (checked === inputEl.checked)
|
|
373
|
+
return;
|
|
374
|
+
dispatchInputCheckedEvent(inputEl, { checked });
|
|
375
|
+
});
|
|
357
376
|
}
|
|
358
377
|
}
|
|
359
378
|
}
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/radio-group.anatomy.ts","../src/radio-group.connect.ts","../src/radio-group.dom.ts","../src/radio-group.machine.ts"],"sourcesContent":["import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"radio-group\").parts(\n \"root\",\n \"label\",\n \"radio\",\n \"radioLabel\",\n \"radioControl\",\n \"indicator\",\n)\nexport const parts = anatomy.build()\n","import { ariaAttr, dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { visuallyHiddenStyle } from \"@zag-js/visually-hidden\"\nimport { parts } from \"./radio-group.anatomy\"\nimport { dom } from \"./radio-group.dom\"\nimport type { InputProps, MachineApi, RadioProps, Send, State } from \"./radio-group.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const isGroupDisabled = state.context.isDisabled\n\n function getRadioState<T extends RadioProps>(props: T) {\n const radioState = {\n isInvalid: props.invalid,\n isDisabled: props.disabled || isGroupDisabled,\n isChecked: state.context.value === props.value,\n isFocused: state.context.focusedId === props.value,\n isHovered: state.context.hoveredId === props.value,\n isActive: state.context.activeId === props.value,\n }\n return {\n ...radioState,\n isInteractive: !radioState.isDisabled,\n }\n }\n\n function getRadioDataAttrs<T extends RadioProps>(props: T) {\n const radioState = getRadioState(props)\n return {\n \"data-focus\": dataAttr(radioState.isFocused),\n \"data-disabled\": dataAttr(radioState.isDisabled),\n \"data-state\": radioState.isChecked ? \"checked\" : \"unchecked\",\n \"data-hover\": dataAttr(radioState.isHovered),\n \"data-invalid\": dataAttr(radioState.isInvalid),\n \"data-orientation\": state.context.orientation,\n }\n }\n\n const focus = () => {\n const firstEnabledAndCheckedInput = dom.getFirstEnabledAndCheckedInputEl(state.context)\n\n if (firstEnabledAndCheckedInput) {\n firstEnabledAndCheckedInput.focus()\n return\n }\n\n const firstEnabledInput = dom.getFirstEnabledInputEl(state.context)\n firstEnabledInput?.focus()\n }\n\n return {\n value: state.context.value,\n\n setValue(value: string) {\n send({ type: \"SET_VALUE\", value, manual: true })\n },\n\n clearValue() {\n send({ type: \"SET_VALUE\", value: null, manual: true })\n },\n\n focus,\n\n blur() {\n const focusedElement = dom.getActiveElement(state.context)\n const inputEls = dom.getInputEls(state.context)\n const radioHiddenInputIsFocused = inputEls.some((el) => el === focusedElement)\n if (radioHiddenInputIsFocused) focusedElement?.blur()\n },\n\n getRadioState,\n\n rootProps: normalize.element({\n ...parts.root.attrs,\n role: \"radiogroup\",\n id: dom.getRootId(state.context),\n \"aria-labelledby\": dom.getLabelId(state.context),\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(isGroupDisabled),\n \"aria-orientation\": state.context.orientation,\n dir: state.context.dir,\n }),\n\n labelProps: normalize.element({\n ...parts.label.attrs,\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(isGroupDisabled),\n id: dom.getLabelId(state.context),\n onClick: focus,\n }),\n\n getRadioProps(props: RadioProps) {\n const rootState = getRadioState(props)\n\n return normalize.label({\n ...parts.radio.attrs,\n id: dom.getRadioId(state.context, props.value),\n htmlFor: dom.getRadioHiddenInputId(state.context, props.value),\n ...getRadioDataAttrs(props),\n\n onPointerMove() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_HOVERED\", value: props.value, hovered: true })\n },\n onPointerLeave() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_HOVERED\", value: null })\n },\n onPointerDown(event) {\n if (!rootState.isInteractive) return\n // On pointerdown, the input blurs and returns focus to the `body`,\n // we need to prevent this.\n if (rootState.isFocused && event.pointerType === \"mouse\") {\n event.preventDefault()\n }\n send({ type: \"SET_ACTIVE\", value: props.value, active: true })\n },\n onPointerUp() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_ACTIVE\", value: null })\n },\n })\n },\n\n getRadioLabelProps(props: RadioProps) {\n return normalize.element({\n ...parts.radioLabel.attrs,\n id: dom.getRadioLabelId(state.context, props.value),\n ...getRadioDataAttrs(props),\n })\n },\n\n getRadioControlProps(props: RadioProps) {\n const controlState = getRadioState(props)\n\n return normalize.element({\n ...parts.radioControl.attrs,\n id: dom.getRadioControlId(state.context, props.value),\n \"data-active\": dataAttr(controlState.isActive),\n \"aria-hidden\": true,\n ...getRadioDataAttrs(props),\n })\n },\n\n getRadioHiddenInputProps(props: InputProps) {\n const inputState = getRadioState(props)\n\n const isRequired = props.required\n const trulyDisabled = inputState.isDisabled && !props.focusable\n\n return normalize.input({\n \"data-ownedby\": dom.getRootId(state.context),\n id: dom.getRadioHiddenInputId(state.context, props.value),\n type: \"radio\",\n name: state.context.name || state.context.id,\n form: state.context.form,\n value: props.value,\n onChange(event) {\n if (inputState.isDisabled) return\n\n if (event.target.checked) {\n send({ type: \"SET_VALUE\", value: props.value })\n }\n },\n onBlur() {\n send({ type: \"SET_FOCUSED\", value: null })\n },\n onFocus() {\n send({ type: \"SET_FOCUSED\", value: props.value, focused: true })\n },\n onKeyDown(event) {\n if (event.key === \" \") {\n send({ type: \"SET_ACTIVE\", value: props.value, active: true })\n }\n },\n onKeyUp(event) {\n if (event.key === \" \") {\n send({ type: \"SET_ACTIVE\", value: null })\n }\n },\n disabled: trulyDisabled,\n required: isRequired,\n defaultChecked: inputState.isChecked,\n \"data-disabled\": dataAttr(inputState.isDisabled),\n \"aria-required\": ariaAttr(isRequired),\n \"aria-invalid\": ariaAttr(inputState.isInvalid),\n \"aria-disabled\": ariaAttr(trulyDisabled),\n \"aria-checked\": ariaAttr(inputState.isChecked),\n style: visuallyHiddenStyle,\n })\n },\n\n indicatorProps: normalize.element({\n id: dom.getIndicatorId(state.context),\n ...parts.indicator.attrs,\n \"data-disabled\": dataAttr(isGroupDisabled),\n \"data-orientation\": state.context.orientation,\n style: {\n \"--transition-duration\": \"150ms\",\n \"--transition-property\": \"left, top, width, height\",\n position: \"absolute\",\n willChange: \"var(--transition-property)\",\n transitionProperty: \"var(--transition-property)\",\n transitionDuration: state.context.canIndicatorTransition ? \"var(--transition-duration)\" : \"0ms\",\n transitionTimingFunction: \"var(--transition-timing-function)\",\n ...state.context.indicatorRect,\n },\n }),\n }\n}\n","import { createScope, queryAll } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./radio-group.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `radio-group:${ctx.id}`,\n getLabelId: (ctx: Ctx) => ctx.ids?.label ?? `radio-group:${ctx.id}:label`,\n getRadioId: (ctx: Ctx, value: string) => ctx.ids?.radio?.(value) ?? `radio-group:${ctx.id}:radio:${value}`,\n getRadioHiddenInputId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioHiddenInput?.(value) ?? `radio-group:${ctx.id}:radio:input:${value}`,\n getRadioControlId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioControl?.(value) ?? `radio-group:${ctx.id}:radio:control:${value}`,\n getRadioLabelId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioLabel?.(value) ?? `radio-group:${ctx.id}:radio:label:${value}`,\n getIndicatorId: (ctx: Ctx) => ctx.ids?.indicator ?? `radio-group:${ctx.id}:indicator`,\n\n getRootEl: (ctx: Ctx) => dom.getById(ctx, dom.getRootId(ctx)),\n getRadioHiddenInputEl: (ctx: Ctx, value: string) =>\n dom.getById<HTMLInputElement>(ctx, dom.getRadioHiddenInputId(ctx, value)),\n getIndicatorEl: (ctx: Ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),\n\n getFirstEnabledInputEl: (ctx: Ctx) => dom.getRootEl(ctx)?.querySelector<HTMLInputElement>(\"input:not(:disabled)\"),\n getFirstEnabledAndCheckedInputEl: (ctx: Ctx) =>\n dom.getRootEl(ctx)?.querySelector<HTMLInputElement>(\"input:not(:disabled):checked\"),\n\n getInputEls: (ctx: Ctx) => {\n const ownerId = CSS.escape(dom.getRootId(ctx))\n const selector = `input[type=radio][data-ownedby='${ownerId}']:not([disabled])`\n return queryAll<HTMLInputElement>(dom.getRootEl(ctx), selector)\n },\n\n getActiveRadioEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getById(ctx, dom.getRadioId(ctx, ctx.value))\n },\n\n getOffsetRect: (el: HTMLElement | undefined) => ({\n left: el?.offsetLeft ?? 0,\n top: el?.offsetTop ?? 0,\n width: el?.offsetWidth ?? 0,\n height: el?.offsetHeight ?? 0,\n }),\n\n getRectById: (ctx: Ctx, id: string) => {\n const radioEl = dom.getById(ctx, dom.getRadioId(ctx, id))\n if (!radioEl) return\n return dom.resolveRect(dom.getOffsetRect(radioEl))\n },\n\n resolveRect: (rect: Record<\"width\" | \"height\" | \"left\" | \"top\", number>) => ({\n width: `${rect.width}px`,\n height: `${rect.height}px`,\n left: `${rect.left}px`,\n top: `${rect.top}px`,\n }),\n})\n","import { createMachine } from \"@zag-js/core\"\nimport { nextTick } from \"@zag-js/dom-query\"\nimport { trackElementRect } from \"@zag-js/element-rect\"\nimport { trackFormControl } from \"@zag-js/form-utils\"\nimport { compact, isString } from \"@zag-js/utils\"\nimport { dom } from \"./radio-group.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./radio-group.types\"\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n id: \"radio\",\n initial: \"idle\",\n context: {\n value: null,\n activeId: null,\n focusedId: null,\n hoveredId: null,\n disabled: false,\n ...ctx,\n indicatorRect: {},\n canIndicatorTransition: false,\n fieldsetDisabled: false,\n },\n\n computed: {\n isDisabled: (ctx) => !!ctx.disabled || ctx.fieldsetDisabled,\n },\n\n entry: [\"syncIndicatorRect\"],\n\n exit: [\"cleanupObserver\"],\n\n activities: [\"trackFormControlState\"],\n\n watch: {\n value: [\"setIndicatorTransition\", \"syncIndicatorRect\", \"syncInputElements\"],\n },\n\n on: {\n SET_VALUE: {\n actions: [\"setValue\"],\n },\n SET_HOVERED: {\n actions: \"setHovered\",\n },\n SET_ACTIVE: {\n actions: \"setActive\",\n },\n SET_FOCUSED: {\n actions: \"setFocused\",\n },\n },\n\n states: {\n idle: {},\n },\n },\n\n {\n activities: {\n trackFormControlState(ctx, _evt, { send, initialContext }) {\n return trackFormControl(dom.getRootEl(ctx), {\n onFieldsetDisabledChange(disabled) {\n ctx.fieldsetDisabled = disabled\n },\n onFormReset() {\n send({ type: \"SET_VALUE\", value: initialContext.value })\n },\n })\n },\n },\n\n actions: {\n setValue(ctx, evt) {\n set.value(ctx, evt.value)\n },\n setHovered(ctx, evt) {\n ctx.hoveredId = evt.value\n },\n setActive(ctx, evt) {\n ctx.activeId = evt.value\n },\n setFocused(ctx, evt) {\n ctx.focusedId = evt.value\n },\n syncInputElements(ctx) {\n const inputs = dom.getInputEls(ctx)\n inputs.forEach((input) => {\n input.checked = input.value === ctx.value\n })\n },\n setIndicatorTransition(ctx) {\n ctx.canIndicatorTransition = isString(ctx.value)\n },\n cleanupObserver(ctx) {\n ctx.indicatorCleanup?.()\n },\n syncIndicatorRect(ctx) {\n ctx.indicatorCleanup?.()\n\n if (!dom.getIndicatorEl(ctx)) return\n\n const value = ctx.value\n\n if (value == null) {\n ctx.indicatorRect = {}\n return\n }\n\n const radioEl = dom.getActiveRadioEl(ctx)\n if (!radioEl) return\n\n ctx.indicatorCleanup = trackElementRect(radioEl, {\n getRect(el) {\n return dom.getOffsetRect(el)\n },\n onChange(rect) {\n ctx.indicatorRect = dom.resolveRect(rect)\n nextTick(() => {\n ctx.canIndicatorTransition = false\n })\n },\n })\n },\n },\n },\n )\n}\n\nconst invoke = {\n change: (ctx: MachineContext) => {\n if (ctx.value == null) return\n ctx.onChange?.({ value: ctx.value })\n },\n}\n\nconst set = {\n value: (ctx: MachineContext, value: string) => {\n ctx.value = value\n invoke.change(ctx)\n },\n}\n"],"mappings":";AAAA,SAAS,qBAAqB;AAEvB,IAAM,UAAU,cAAc,aAAa,EAAE;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AACO,IAAM,QAAQ,QAAQ,MAAM;;;ACVnC,SAAS,UAAU,gBAAgB;AAEnC,SAAS,2BAA2B;;;ACFpC,SAAS,aAAa,gBAAgB;AAG/B,IAAM,MAAM,YAAY;AAAA,EAC7B,WAAW,CAAC,QAAa,IAAI,KAAK,QAAQ,eAAe,IAAI,EAAE;AAAA,EAC/D,YAAY,CAAC,QAAa,IAAI,KAAK,SAAS,eAAe,IAAI,EAAE;AAAA,EACjE,YAAY,CAAC,KAAU,UAAkB,IAAI,KAAK,QAAQ,KAAK,KAAK,eAAe,IAAI,EAAE,UAAU,KAAK;AAAA,EACxG,uBAAuB,CAAC,KAAU,UAChC,IAAI,KAAK,mBAAmB,KAAK,KAAK,eAAe,IAAI,EAAE,gBAAgB,KAAK;AAAA,EAClF,mBAAmB,CAAC,KAAU,UAC5B,IAAI,KAAK,eAAe,KAAK,KAAK,eAAe,IAAI,EAAE,kBAAkB,KAAK;AAAA,EAChF,iBAAiB,CAAC,KAAU,UAC1B,IAAI,KAAK,aAAa,KAAK,KAAK,eAAe,IAAI,EAAE,gBAAgB,KAAK;AAAA,EAC5E,gBAAgB,CAAC,QAAa,IAAI,KAAK,aAAa,eAAe,IAAI,EAAE;AAAA,EAEzE,WAAW,CAAC,QAAa,IAAI,QAAQ,KAAK,IAAI,UAAU,GAAG,CAAC;AAAA,EAC5D,uBAAuB,CAAC,KAAU,UAChC,IAAI,QAA0B,KAAK,IAAI,sBAAsB,KAAK,KAAK,CAAC;AAAA,EAC1E,gBAAgB,CAAC,QAAa,IAAI,QAAQ,KAAK,IAAI,eAAe,GAAG,CAAC;AAAA,EAEtE,wBAAwB,CAAC,QAAa,IAAI,UAAU,GAAG,GAAG,cAAgC,sBAAsB;AAAA,EAChH,kCAAkC,CAAC,QACjC,IAAI,UAAU,GAAG,GAAG,cAAgC,8BAA8B;AAAA,EAEpF,aAAa,CAAC,QAAa;AACzB,UAAM,UAAU,IAAI,OAAO,IAAI,UAAU,GAAG,CAAC;AAC7C,UAAM,WAAW,mCAAmC,OAAO;AAC3D,WAAO,SAA2B,IAAI,UAAU,GAAG,GAAG,QAAQ;AAAA,EAChE;AAAA,EAEA,kBAAkB,CAAC,QAAa;AAC9B,QAAI,CAAC,IAAI;AAAO;AAChB,WAAO,IAAI,QAAQ,KAAK,IAAI,WAAW,KAAK,IAAI,KAAK,CAAC;AAAA,EACxD;AAAA,EAEA,eAAe,CAAC,QAAiC;AAAA,IAC/C,MAAM,IAAI,cAAc;AAAA,IACxB,KAAK,IAAI,aAAa;AAAA,IACtB,OAAO,IAAI,eAAe;AAAA,IAC1B,QAAQ,IAAI,gBAAgB;AAAA,EAC9B;AAAA,EAEA,aAAa,CAAC,KAAU,OAAe;AACrC,UAAM,UAAU,IAAI,QAAQ,KAAK,IAAI,WAAW,KAAK,EAAE,CAAC;AACxD,QAAI,CAAC;AAAS;AACd,WAAO,IAAI,YAAY,IAAI,cAAc,OAAO,CAAC;AAAA,EACnD;AAAA,EAEA,aAAa,CAAC,UAA+D;AAAA,IAC3E,OAAO,GAAG,KAAK,KAAK;AAAA,IACpB,QAAQ,GAAG,KAAK,MAAM;AAAA,IACtB,MAAM,GAAG,KAAK,IAAI;AAAA,IAClB,KAAK,GAAG,KAAK,GAAG;AAAA,EAClB;AACF,CAAC;;;AD/CM,SAAS,QAA6B,OAAc,MAAY,WAA6C;AAClH,QAAM,kBAAkB,MAAM,QAAQ;AAEtC,WAAS,cAAoC,OAAU;AACrD,UAAM,aAAa;AAAA,MACjB,WAAW,MAAM;AAAA,MACjB,YAAY,MAAM,YAAY;AAAA,MAC9B,WAAW,MAAM,QAAQ,UAAU,MAAM;AAAA,MACzC,WAAW,MAAM,QAAQ,cAAc,MAAM;AAAA,MAC7C,WAAW,MAAM,QAAQ,cAAc,MAAM;AAAA,MAC7C,UAAU,MAAM,QAAQ,aAAa,MAAM;AAAA,IAC7C;AACA,WAAO;AAAA,MACL,GAAG;AAAA,MACH,eAAe,CAAC,WAAW;AAAA,IAC7B;AAAA,EACF;AAEA,WAAS,kBAAwC,OAAU;AACzD,UAAM,aAAa,cAAc,KAAK;AACtC,WAAO;AAAA,MACL,cAAc,SAAS,WAAW,SAAS;AAAA,MAC3C,iBAAiB,SAAS,WAAW,UAAU;AAAA,MAC/C,cAAc,WAAW,YAAY,YAAY;AAAA,MACjD,cAAc,SAAS,WAAW,SAAS;AAAA,MAC3C,gBAAgB,SAAS,WAAW,SAAS;AAAA,MAC7C,oBAAoB,MAAM,QAAQ;AAAA,IACpC;AAAA,EACF;AAEA,QAAM,QAAQ,MAAM;AAClB,UAAM,8BAA8B,IAAI,iCAAiC,MAAM,OAAO;AAEtF,QAAI,6BAA6B;AAC/B,kCAA4B,MAAM;AAClC;AAAA,IACF;AAEA,UAAM,oBAAoB,IAAI,uBAAuB,MAAM,OAAO;AAClE,uBAAmB,MAAM;AAAA,EAC3B;AAEA,SAAO;AAAA,IACL,OAAO,MAAM,QAAQ;AAAA,IAErB,SAAS,OAAe;AACtB,WAAK,EAAE,MAAM,aAAa,OAAO,QAAQ,KAAK,CAAC;AAAA,IACjD;AAAA,IAEA,aAAa;AACX,WAAK,EAAE,MAAM,aAAa,OAAO,MAAM,QAAQ,KAAK,CAAC;AAAA,IACvD;AAAA,IAEA;AAAA,IAEA,OAAO;AACL,YAAM,iBAAiB,IAAI,iBAAiB,MAAM,OAAO;AACzD,YAAM,WAAW,IAAI,YAAY,MAAM,OAAO;AAC9C,YAAM,4BAA4B,SAAS,KAAK,CAAC,OAAO,OAAO,cAAc;AAC7E,UAAI;AAA2B,wBAAgB,KAAK;AAAA,IACtD;AAAA,IAEA;AAAA,IAEA,WAAW,UAAU,QAAQ;AAAA,MAC3B,GAAG,MAAM,KAAK;AAAA,MACd,MAAM;AAAA,MACN,IAAI,IAAI,UAAU,MAAM,OAAO;AAAA,MAC/B,mBAAmB,IAAI,WAAW,MAAM,OAAO;AAAA,MAC/C,oBAAoB,MAAM,QAAQ;AAAA,MAClC,iBAAiB,SAAS,eAAe;AAAA,MACzC,oBAAoB,MAAM,QAAQ;AAAA,MAClC,KAAK,MAAM,QAAQ;AAAA,IACrB,CAAC;AAAA,IAED,YAAY,UAAU,QAAQ;AAAA,MAC5B,GAAG,MAAM,MAAM;AAAA,MACf,oBAAoB,MAAM,QAAQ;AAAA,MAClC,iBAAiB,SAAS,eAAe;AAAA,MACzC,IAAI,IAAI,WAAW,MAAM,OAAO;AAAA,MAChC,SAAS;AAAA,IACX,CAAC;AAAA,IAED,cAAc,OAAmB;AAC/B,YAAM,YAAY,cAAc,KAAK;AAErC,aAAO,UAAU,MAAM;AAAA,QACrB,GAAG,MAAM,MAAM;AAAA,QACf,IAAI,IAAI,WAAW,MAAM,SAAS,MAAM,KAAK;AAAA,QAC7C,SAAS,IAAI,sBAAsB,MAAM,SAAS,MAAM,KAAK;AAAA,QAC7D,GAAG,kBAAkB,KAAK;AAAA,QAE1B,gBAAgB;AACd,cAAI,CAAC,UAAU;AAAe;AAC9B,eAAK,EAAE,MAAM,eAAe,OAAO,MAAM,OAAO,SAAS,KAAK,CAAC;AAAA,QACjE;AAAA,QACA,iBAAiB;AACf,cAAI,CAAC,UAAU;AAAe;AAC9B,eAAK,EAAE,MAAM,eAAe,OAAO,KAAK,CAAC;AAAA,QAC3C;AAAA,QACA,cAAc,OAAO;AACnB,cAAI,CAAC,UAAU;AAAe;AAG9B,cAAI,UAAU,aAAa,MAAM,gBAAgB,SAAS;AACxD,kBAAM,eAAe;AAAA,UACvB;AACA,eAAK,EAAE,MAAM,cAAc,OAAO,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,QAC/D;AAAA,QACA,cAAc;AACZ,cAAI,CAAC,UAAU;AAAe;AAC9B,eAAK,EAAE,MAAM,cAAc,OAAO,KAAK,CAAC;AAAA,QAC1C;AAAA,MACF,CAAC;AAAA,IACH;AAAA,IAEA,mBAAmB,OAAmB;AACpC,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,WAAW;AAAA,QACpB,IAAI,IAAI,gBAAgB,MAAM,SAAS,MAAM,KAAK;AAAA,QAClD,GAAG,kBAAkB,KAAK;AAAA,MAC5B,CAAC;AAAA,IACH;AAAA,IAEA,qBAAqB,OAAmB;AACtC,YAAM,eAAe,cAAc,KAAK;AAExC,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,aAAa;AAAA,QACtB,IAAI,IAAI,kBAAkB,MAAM,SAAS,MAAM,KAAK;AAAA,QACpD,eAAe,SAAS,aAAa,QAAQ;AAAA,QAC7C,eAAe;AAAA,QACf,GAAG,kBAAkB,KAAK;AAAA,MAC5B,CAAC;AAAA,IACH;AAAA,IAEA,yBAAyB,OAAmB;AAC1C,YAAM,aAAa,cAAc,KAAK;AAEtC,YAAM,aAAa,MAAM;AACzB,YAAM,gBAAgB,WAAW,cAAc,CAAC,MAAM;AAEtD,aAAO,UAAU,MAAM;AAAA,QACrB,gBAAgB,IAAI,UAAU,MAAM,OAAO;AAAA,QAC3C,IAAI,IAAI,sBAAsB,MAAM,SAAS,MAAM,KAAK;AAAA,QACxD,MAAM;AAAA,QACN,MAAM,MAAM,QAAQ,QAAQ,MAAM,QAAQ;AAAA,QAC1C,MAAM,MAAM,QAAQ;AAAA,QACpB,OAAO,MAAM;AAAA,QACb,SAAS,OAAO;AACd,cAAI,WAAW;AAAY;AAE3B,cAAI,MAAM,OAAO,SAAS;AACxB,iBAAK,EAAE,MAAM,aAAa,OAAO,MAAM,MAAM,CAAC;AAAA,UAChD;AAAA,QACF;AAAA,QACA,SAAS;AACP,eAAK,EAAE,MAAM,eAAe,OAAO,KAAK,CAAC;AAAA,QAC3C;AAAA,QACA,UAAU;AACR,eAAK,EAAE,MAAM,eAAe,OAAO,MAAM,OAAO,SAAS,KAAK,CAAC;AAAA,QACjE;AAAA,QACA,UAAU,OAAO;AACf,cAAI,MAAM,QAAQ,KAAK;AACrB,iBAAK,EAAE,MAAM,cAAc,OAAO,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,UAC/D;AAAA,QACF;AAAA,QACA,QAAQ,OAAO;AACb,cAAI,MAAM,QAAQ,KAAK;AACrB,iBAAK,EAAE,MAAM,cAAc,OAAO,KAAK,CAAC;AAAA,UAC1C;AAAA,QACF;AAAA,QACA,UAAU;AAAA,QACV,UAAU;AAAA,QACV,gBAAgB,WAAW;AAAA,QAC3B,iBAAiB,SAAS,WAAW,UAAU;AAAA,QAC/C,iBAAiB,SAAS,UAAU;AAAA,QACpC,gBAAgB,SAAS,WAAW,SAAS;AAAA,QAC7C,iBAAiB,SAAS,aAAa;AAAA,QACvC,gBAAgB,SAAS,WAAW,SAAS;AAAA,QAC7C,OAAO;AAAA,MACT,CAAC;AAAA,IACH;AAAA,IAEA,gBAAgB,UAAU,QAAQ;AAAA,MAChC,IAAI,IAAI,eAAe,MAAM,OAAO;AAAA,MACpC,GAAG,MAAM,UAAU;AAAA,MACnB,iBAAiB,SAAS,eAAe;AAAA,MACzC,oBAAoB,MAAM,QAAQ;AAAA,MAClC,OAAO;AAAA,QACL,yBAAyB;AAAA,QACzB,yBAAyB;AAAA,QACzB,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,oBAAoB;AAAA,QACpB,oBAAoB,MAAM,QAAQ,yBAAyB,+BAA+B;AAAA,QAC1F,0BAA0B;AAAA,QAC1B,GAAG,MAAM,QAAQ;AAAA,MACnB;AAAA,IACF,CAAC;AAAA,EACH;AACF;;;AEhNA,SAAS,qBAAqB;AAC9B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,SAAS,gBAAgB;AAI3B,SAAS,QAAQ,aAAiC;AACvD,QAAM,MAAM,QAAQ,WAAW;AAC/B,SAAO;AAAA,IACL;AAAA,MACE,IAAI;AAAA,MACJ,SAAS;AAAA,MACT,SAAS;AAAA,QACP,OAAO;AAAA,QACP,UAAU;AAAA,QACV,WAAW;AAAA,QACX,WAAW;AAAA,QACX,UAAU;AAAA,QACV,GAAG;AAAA,QACH,eAAe,CAAC;AAAA,QAChB,wBAAwB;AAAA,QACxB,kBAAkB;AAAA,MACpB;AAAA,MAEA,UAAU;AAAA,QACR,YAAY,CAACA,SAAQ,CAAC,CAACA,KAAI,YAAYA,KAAI;AAAA,MAC7C;AAAA,MAEA,OAAO,CAAC,mBAAmB;AAAA,MAE3B,MAAM,CAAC,iBAAiB;AAAA,MAExB,YAAY,CAAC,uBAAuB;AAAA,MAEpC,OAAO;AAAA,QACL,OAAO,CAAC,0BAA0B,qBAAqB,mBAAmB;AAAA,MAC5E;AAAA,MAEA,IAAI;AAAA,QACF,WAAW;AAAA,UACT,SAAS,CAAC,UAAU;AAAA,QACtB;AAAA,QACA,aAAa;AAAA,UACX,SAAS;AAAA,QACX;AAAA,QACA,YAAY;AAAA,UACV,SAAS;AAAA,QACX;AAAA,QACA,aAAa;AAAA,UACX,SAAS;AAAA,QACX;AAAA,MACF;AAAA,MAEA,QAAQ;AAAA,QACN,MAAM,CAAC;AAAA,MACT;AAAA,IACF;AAAA,IAEA;AAAA,MACE,YAAY;AAAA,QACV,sBAAsBA,MAAK,MAAM,EAAE,MAAM,eAAe,GAAG;AACzD,iBAAO,iBAAiB,IAAI,UAAUA,IAAG,GAAG;AAAA,YAC1C,yBAAyB,UAAU;AACjC,cAAAA,KAAI,mBAAmB;AAAA,YACzB;AAAA,YACA,cAAc;AACZ,mBAAK,EAAE,MAAM,aAAa,OAAO,eAAe,MAAM,CAAC;AAAA,YACzD;AAAA,UACF,CAAC;AAAA,QACH;AAAA,MACF;AAAA,MAEA,SAAS;AAAA,QACP,SAASA,MAAK,KAAK;AACjB,cAAI,MAAMA,MAAK,IAAI,KAAK;AAAA,QAC1B;AAAA,QACA,WAAWA,MAAK,KAAK;AACnB,UAAAA,KAAI,YAAY,IAAI;AAAA,QACtB;AAAA,QACA,UAAUA,MAAK,KAAK;AAClB,UAAAA,KAAI,WAAW,IAAI;AAAA,QACrB;AAAA,QACA,WAAWA,MAAK,KAAK;AACnB,UAAAA,KAAI,YAAY,IAAI;AAAA,QACtB;AAAA,QACA,kBAAkBA,MAAK;AACrB,gBAAM,SAAS,IAAI,YAAYA,IAAG;AAClC,iBAAO,QAAQ,CAAC,UAAU;AACxB,kBAAM,UAAU,MAAM,UAAUA,KAAI;AAAA,UACtC,CAAC;AAAA,QACH;AAAA,QACA,uBAAuBA,MAAK;AAC1B,UAAAA,KAAI,yBAAyB,SAASA,KAAI,KAAK;AAAA,QACjD;AAAA,QACA,gBAAgBA,MAAK;AACnB,UAAAA,KAAI,mBAAmB;AAAA,QACzB;AAAA,QACA,kBAAkBA,MAAK;AACrB,UAAAA,KAAI,mBAAmB;AAEvB,cAAI,CAAC,IAAI,eAAeA,IAAG;AAAG;AAE9B,gBAAM,QAAQA,KAAI;AAElB,cAAI,SAAS,MAAM;AACjB,YAAAA,KAAI,gBAAgB,CAAC;AACrB;AAAA,UACF;AAEA,gBAAM,UAAU,IAAI,iBAAiBA,IAAG;AACxC,cAAI,CAAC;AAAS;AAEd,UAAAA,KAAI,mBAAmB,iBAAiB,SAAS;AAAA,YAC/C,QAAQ,IAAI;AACV,qBAAO,IAAI,cAAc,EAAE;AAAA,YAC7B;AAAA,YACA,SAAS,MAAM;AACb,cAAAA,KAAI,gBAAgB,IAAI,YAAY,IAAI;AACxC,uBAAS,MAAM;AACb,gBAAAA,KAAI,yBAAyB;AAAA,cAC/B,CAAC;AAAA,YACH;AAAA,UACF,CAAC;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAEA,IAAM,SAAS;AAAA,EACb,QAAQ,CAAC,QAAwB;AAC/B,QAAI,IAAI,SAAS;AAAM;AACvB,QAAI,WAAW,EAAE,OAAO,IAAI,MAAM,CAAC;AAAA,EACrC;AACF;AAEA,IAAM,MAAM;AAAA,EACV,OAAO,CAAC,KAAqB,UAAkB;AAC7C,QAAI,QAAQ;AACZ,WAAO,OAAO,GAAG;AAAA,EACnB;AACF;","names":["ctx"]}
|
|
1
|
+
{"version":3,"sources":["../src/radio-group.anatomy.ts","../src/radio-group.connect.ts","../src/radio-group.dom.ts","../src/radio-group.machine.ts"],"sourcesContent":["import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"radio-group\").parts(\n \"root\",\n \"label\",\n \"radio\",\n \"radioLabel\",\n \"radioControl\",\n \"indicator\",\n)\nexport const parts = anatomy.build()\n","import { ariaAttr, dataAttr } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { visuallyHiddenStyle } from \"@zag-js/visually-hidden\"\nimport { parts } from \"./radio-group.anatomy\"\nimport { dom } from \"./radio-group.dom\"\nimport type { InputProps, MachineApi, RadioProps, Send, State } from \"./radio-group.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const isGroupDisabled = state.context.isDisabled\n\n function getRadioState<T extends RadioProps>(props: T) {\n const radioState = {\n isInvalid: props.invalid,\n isDisabled: props.disabled || isGroupDisabled,\n isChecked: state.context.value === props.value,\n isFocused: state.context.focusedId === props.value,\n isHovered: state.context.hoveredId === props.value,\n isActive: state.context.activeId === props.value,\n }\n return {\n ...radioState,\n isInteractive: !radioState.isDisabled,\n }\n }\n\n function getRadioDataAttrs<T extends RadioProps>(props: T) {\n const radioState = getRadioState(props)\n return {\n \"data-focus\": dataAttr(radioState.isFocused),\n \"data-disabled\": dataAttr(radioState.isDisabled),\n \"data-state\": radioState.isChecked ? \"checked\" : \"unchecked\",\n \"data-hover\": dataAttr(radioState.isHovered),\n \"data-invalid\": dataAttr(radioState.isInvalid),\n \"data-orientation\": state.context.orientation,\n }\n }\n\n const focus = () => {\n const firstEnabledAndCheckedInput = dom.getFirstEnabledAndCheckedInputEl(state.context)\n\n if (firstEnabledAndCheckedInput) {\n firstEnabledAndCheckedInput.focus()\n return\n }\n\n const firstEnabledInput = dom.getFirstEnabledInputEl(state.context)\n firstEnabledInput?.focus()\n }\n\n return {\n value: state.context.value,\n\n setValue(value: string) {\n send({ type: \"SET_VALUE\", value, isTrusted: false })\n },\n\n clearValue() {\n send({ type: \"SET_VALUE\", value: null, isTrusted: false })\n },\n\n focus,\n\n blur() {\n const focusedElement = dom.getActiveElement(state.context)\n const inputEls = dom.getInputEls(state.context)\n const radioHiddenInputIsFocused = inputEls.some((el) => el === focusedElement)\n if (radioHiddenInputIsFocused) focusedElement?.blur()\n },\n\n getRadioState,\n\n rootProps: normalize.element({\n ...parts.root.attrs,\n role: \"radiogroup\",\n id: dom.getRootId(state.context),\n \"aria-labelledby\": dom.getLabelId(state.context),\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(isGroupDisabled),\n \"aria-orientation\": state.context.orientation,\n dir: state.context.dir,\n }),\n\n labelProps: normalize.element({\n ...parts.label.attrs,\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(isGroupDisabled),\n id: dom.getLabelId(state.context),\n onClick: focus,\n }),\n\n getRadioProps(props: RadioProps) {\n const rootState = getRadioState(props)\n\n return normalize.label({\n ...parts.radio.attrs,\n id: dom.getRadioId(state.context, props.value),\n htmlFor: dom.getRadioHiddenInputId(state.context, props.value),\n ...getRadioDataAttrs(props),\n\n onPointerMove() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_HOVERED\", value: props.value, hovered: true })\n },\n onPointerLeave() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_HOVERED\", value: null })\n },\n onPointerDown(event) {\n if (!rootState.isInteractive) return\n // On pointerdown, the input blurs and returns focus to the `body`,\n // we need to prevent this.\n if (rootState.isFocused && event.pointerType === \"mouse\") {\n event.preventDefault()\n }\n send({ type: \"SET_ACTIVE\", value: props.value, active: true })\n },\n onPointerUp() {\n if (!rootState.isInteractive) return\n send({ type: \"SET_ACTIVE\", value: null })\n },\n })\n },\n\n getRadioLabelProps(props: RadioProps) {\n return normalize.element({\n ...parts.radioLabel.attrs,\n id: dom.getRadioLabelId(state.context, props.value),\n ...getRadioDataAttrs(props),\n })\n },\n\n getRadioControlProps(props: RadioProps) {\n const controlState = getRadioState(props)\n\n return normalize.element({\n ...parts.radioControl.attrs,\n id: dom.getRadioControlId(state.context, props.value),\n \"data-active\": dataAttr(controlState.isActive),\n \"aria-hidden\": true,\n ...getRadioDataAttrs(props),\n })\n },\n\n getRadioHiddenInputProps(props: InputProps) {\n const inputState = getRadioState(props)\n\n const isRequired = props.required\n const trulyDisabled = inputState.isDisabled && !props.focusable\n\n return normalize.input({\n \"data-ownedby\": dom.getRootId(state.context),\n id: dom.getRadioHiddenInputId(state.context, props.value),\n type: \"radio\",\n name: state.context.name || state.context.id,\n form: state.context.form,\n value: props.value,\n onChange(event) {\n if (inputState.isDisabled) return\n\n if (event.target.checked) {\n send({ type: \"SET_VALUE\", value: props.value, isTrusted: true })\n }\n },\n onBlur() {\n send({ type: \"SET_FOCUSED\", value: null })\n },\n onFocus() {\n send({ type: \"SET_FOCUSED\", value: props.value, focused: true })\n },\n onKeyDown(event) {\n if (event.key === \" \") {\n send({ type: \"SET_ACTIVE\", value: props.value, active: true })\n }\n },\n onKeyUp(event) {\n if (event.key === \" \") {\n send({ type: \"SET_ACTIVE\", value: null })\n }\n },\n disabled: trulyDisabled,\n required: isRequired,\n defaultChecked: inputState.isChecked,\n \"data-disabled\": dataAttr(inputState.isDisabled),\n \"aria-required\": ariaAttr(isRequired),\n \"aria-invalid\": ariaAttr(inputState.isInvalid),\n \"aria-disabled\": ariaAttr(trulyDisabled),\n \"aria-checked\": ariaAttr(inputState.isChecked),\n style: visuallyHiddenStyle,\n })\n },\n\n indicatorProps: normalize.element({\n id: dom.getIndicatorId(state.context),\n ...parts.indicator.attrs,\n \"data-disabled\": dataAttr(isGroupDisabled),\n \"data-orientation\": state.context.orientation,\n style: {\n \"--transition-duration\": \"150ms\",\n \"--transition-property\": \"left, top, width, height\",\n position: \"absolute\",\n willChange: \"var(--transition-property)\",\n transitionProperty: \"var(--transition-property)\",\n transitionDuration: state.context.canIndicatorTransition ? \"var(--transition-duration)\" : \"0ms\",\n transitionTimingFunction: \"var(--transition-timing-function)\",\n ...state.context.indicatorRect,\n },\n }),\n }\n}\n","import { createScope, queryAll } from \"@zag-js/dom-query\"\nimport type { MachineContext as Ctx } from \"./radio-group.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `radio-group:${ctx.id}`,\n getLabelId: (ctx: Ctx) => ctx.ids?.label ?? `radio-group:${ctx.id}:label`,\n getRadioId: (ctx: Ctx, value: string) => ctx.ids?.radio?.(value) ?? `radio-group:${ctx.id}:radio:${value}`,\n getRadioHiddenInputId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioHiddenInput?.(value) ?? `radio-group:${ctx.id}:radio:input:${value}`,\n getRadioControlId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioControl?.(value) ?? `radio-group:${ctx.id}:radio:control:${value}`,\n getRadioLabelId: (ctx: Ctx, value: string) =>\n ctx.ids?.radioLabel?.(value) ?? `radio-group:${ctx.id}:radio:label:${value}`,\n getIndicatorId: (ctx: Ctx) => ctx.ids?.indicator ?? `radio-group:${ctx.id}:indicator`,\n\n getRootEl: (ctx: Ctx) => dom.getById(ctx, dom.getRootId(ctx)),\n getRadioHiddenInputEl: (ctx: Ctx, value: string) =>\n dom.getById<HTMLInputElement>(ctx, dom.getRadioHiddenInputId(ctx, value)),\n getIndicatorEl: (ctx: Ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),\n\n getFirstEnabledInputEl: (ctx: Ctx) => dom.getRootEl(ctx)?.querySelector<HTMLInputElement>(\"input:not(:disabled)\"),\n getFirstEnabledAndCheckedInputEl: (ctx: Ctx) =>\n dom.getRootEl(ctx)?.querySelector<HTMLInputElement>(\"input:not(:disabled):checked\"),\n\n getInputEls: (ctx: Ctx) => {\n const ownerId = CSS.escape(dom.getRootId(ctx))\n const selector = `input[type=radio][data-ownedby='${ownerId}']:not([disabled])`\n return queryAll<HTMLInputElement>(dom.getRootEl(ctx), selector)\n },\n\n getActiveRadioEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getById(ctx, dom.getRadioId(ctx, ctx.value))\n },\n\n getOffsetRect: (el: HTMLElement | undefined) => ({\n left: el?.offsetLeft ?? 0,\n top: el?.offsetTop ?? 0,\n width: el?.offsetWidth ?? 0,\n height: el?.offsetHeight ?? 0,\n }),\n\n getRectById: (ctx: Ctx, id: string) => {\n const radioEl = dom.getById(ctx, dom.getRadioId(ctx, id))\n if (!radioEl) return\n return dom.resolveRect(dom.getOffsetRect(radioEl))\n },\n\n resolveRect: (rect: Record<\"width\" | \"height\" | \"left\" | \"top\", number>) => ({\n width: `${rect.width}px`,\n height: `${rect.height}px`,\n left: `${rect.left}px`,\n top: `${rect.top}px`,\n }),\n})\n","import { createMachine, guards } from \"@zag-js/core\"\nimport { nextTick } from \"@zag-js/dom-query\"\nimport { trackElementRect } from \"@zag-js/element-rect\"\nimport { dispatchInputCheckedEvent, trackFormControl } from \"@zag-js/form-utils\"\nimport { compact, isString } from \"@zag-js/utils\"\nimport { dom } from \"./radio-group.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./radio-group.types\"\n\nconst { not } = guards\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n id: \"radio\",\n initial: \"idle\",\n context: {\n value: null,\n activeId: null,\n focusedId: null,\n hoveredId: null,\n disabled: false,\n ...ctx,\n indicatorRect: {},\n canIndicatorTransition: false,\n fieldsetDisabled: false,\n },\n\n computed: {\n isDisabled: (ctx) => !!ctx.disabled || ctx.fieldsetDisabled,\n },\n\n entry: [\"syncIndicatorRect\"],\n\n exit: [\"cleanupObserver\"],\n\n activities: [\"trackFormControlState\"],\n\n watch: {\n value: [\"setIndicatorTransition\", \"syncIndicatorRect\", \"syncInputElements\"],\n },\n\n on: {\n SET_VALUE: [\n {\n guard: not(\"isTrusted\"),\n actions: [\"setValue\", \"dispatchChangeEvent\"],\n },\n {\n actions: [\"setValue\"],\n },\n ],\n SET_HOVERED: {\n actions: \"setHovered\",\n },\n SET_ACTIVE: {\n actions: \"setActive\",\n },\n SET_FOCUSED: {\n actions: \"setFocused\",\n },\n },\n\n states: {\n idle: {},\n },\n },\n\n {\n guards: {\n isTrusted: (_ctx, evt) => !!evt.isTrusted,\n },\n activities: {\n trackFormControlState(ctx, _evt, { send, initialContext }) {\n return trackFormControl(dom.getRootEl(ctx), {\n onFieldsetDisabledChange(disabled) {\n ctx.fieldsetDisabled = disabled\n },\n onFormReset() {\n send({ type: \"SET_VALUE\", value: initialContext.value })\n },\n })\n },\n },\n\n actions: {\n setValue(ctx, evt) {\n set.value(ctx, evt.value)\n },\n setHovered(ctx, evt) {\n ctx.hoveredId = evt.value\n },\n setActive(ctx, evt) {\n ctx.activeId = evt.value\n },\n setFocused(ctx, evt) {\n ctx.focusedId = evt.value\n },\n syncInputElements(ctx) {\n const inputs = dom.getInputEls(ctx)\n inputs.forEach((input) => {\n input.checked = input.value === ctx.value\n })\n },\n setIndicatorTransition(ctx) {\n ctx.canIndicatorTransition = isString(ctx.value)\n },\n cleanupObserver(ctx) {\n ctx.indicatorCleanup?.()\n },\n syncIndicatorRect(ctx) {\n ctx.indicatorCleanup?.()\n\n if (!dom.getIndicatorEl(ctx)) return\n\n const value = ctx.value\n\n if (value == null) {\n ctx.indicatorRect = {}\n return\n }\n\n const radioEl = dom.getActiveRadioEl(ctx)\n if (!radioEl) return\n\n ctx.indicatorCleanup = trackElementRect(radioEl, {\n getRect(el) {\n return dom.getOffsetRect(el)\n },\n onChange(rect) {\n ctx.indicatorRect = dom.resolveRect(rect)\n nextTick(() => {\n ctx.canIndicatorTransition = false\n })\n },\n })\n },\n dispatchChangeEvent(ctx) {\n const inputEls = dom.getInputEls(ctx)\n inputEls.forEach((inputEl) => {\n const checked = inputEl.value === ctx.value\n if (checked === inputEl.checked) return\n dispatchInputCheckedEvent(inputEl, { checked })\n })\n },\n },\n },\n )\n}\n\nconst invoke = {\n change: (ctx: MachineContext) => {\n if (ctx.value == null) return\n ctx.onChange?.({ value: ctx.value })\n },\n}\n\nconst set = {\n value: (ctx: MachineContext, value: string) => {\n ctx.value = value\n invoke.change(ctx)\n },\n}\n"],"mappings":"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","names":["ctx"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zag-js/radio-group",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.19.0",
|
|
4
4
|
"description": "Core logic for the radio group widget implemented as a state machine",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"js",
|
|
@@ -28,14 +28,14 @@
|
|
|
28
28
|
"url": "https://github.com/chakra-ui/zag/issues"
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@zag-js/anatomy": "0.
|
|
32
|
-
"@zag-js/dom-query": "0.
|
|
33
|
-
"@zag-js/element-rect": "0.
|
|
34
|
-
"@zag-js/form-utils": "0.
|
|
35
|
-
"@zag-js/visually-hidden": "0.
|
|
36
|
-
"@zag-js/utils": "0.
|
|
37
|
-
"@zag-js/core": "0.
|
|
38
|
-
"@zag-js/types": "0.
|
|
31
|
+
"@zag-js/anatomy": "0.19.0",
|
|
32
|
+
"@zag-js/dom-query": "0.19.0",
|
|
33
|
+
"@zag-js/element-rect": "0.19.0",
|
|
34
|
+
"@zag-js/form-utils": "0.19.0",
|
|
35
|
+
"@zag-js/visually-hidden": "0.19.0",
|
|
36
|
+
"@zag-js/utils": "0.19.0",
|
|
37
|
+
"@zag-js/core": "0.19.0",
|
|
38
|
+
"@zag-js/types": "0.19.0"
|
|
39
39
|
},
|
|
40
40
|
"devDependencies": {
|
|
41
41
|
"clean-package": "2.2.0"
|
|
@@ -51,11 +51,11 @@ export function connect<T extends PropTypes>(state: State, send: Send, normalize
|
|
|
51
51
|
value: state.context.value,
|
|
52
52
|
|
|
53
53
|
setValue(value: string) {
|
|
54
|
-
send({ type: "SET_VALUE", value,
|
|
54
|
+
send({ type: "SET_VALUE", value, isTrusted: false })
|
|
55
55
|
},
|
|
56
56
|
|
|
57
57
|
clearValue() {
|
|
58
|
-
send({ type: "SET_VALUE", value: null,
|
|
58
|
+
send({ type: "SET_VALUE", value: null, isTrusted: false })
|
|
59
59
|
},
|
|
60
60
|
|
|
61
61
|
focus,
|
|
@@ -158,7 +158,7 @@ export function connect<T extends PropTypes>(state: State, send: Send, normalize
|
|
|
158
158
|
if (inputState.isDisabled) return
|
|
159
159
|
|
|
160
160
|
if (event.target.checked) {
|
|
161
|
-
send({ type: "SET_VALUE", value: props.value })
|
|
161
|
+
send({ type: "SET_VALUE", value: props.value, isTrusted: true })
|
|
162
162
|
}
|
|
163
163
|
},
|
|
164
164
|
onBlur() {
|
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
import { createMachine } from "@zag-js/core"
|
|
1
|
+
import { createMachine, guards } from "@zag-js/core"
|
|
2
2
|
import { nextTick } from "@zag-js/dom-query"
|
|
3
3
|
import { trackElementRect } from "@zag-js/element-rect"
|
|
4
|
-
import { trackFormControl } from "@zag-js/form-utils"
|
|
4
|
+
import { dispatchInputCheckedEvent, trackFormControl } from "@zag-js/form-utils"
|
|
5
5
|
import { compact, isString } from "@zag-js/utils"
|
|
6
6
|
import { dom } from "./radio-group.dom"
|
|
7
7
|
import type { MachineContext, MachineState, UserDefinedContext } from "./radio-group.types"
|
|
8
8
|
|
|
9
|
+
const { not } = guards
|
|
10
|
+
|
|
9
11
|
export function machine(userContext: UserDefinedContext) {
|
|
10
12
|
const ctx = compact(userContext)
|
|
11
13
|
return createMachine<MachineContext, MachineState>(
|
|
@@ -39,9 +41,15 @@ export function machine(userContext: UserDefinedContext) {
|
|
|
39
41
|
},
|
|
40
42
|
|
|
41
43
|
on: {
|
|
42
|
-
SET_VALUE:
|
|
43
|
-
|
|
44
|
-
|
|
44
|
+
SET_VALUE: [
|
|
45
|
+
{
|
|
46
|
+
guard: not("isTrusted"),
|
|
47
|
+
actions: ["setValue", "dispatchChangeEvent"],
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
actions: ["setValue"],
|
|
51
|
+
},
|
|
52
|
+
],
|
|
45
53
|
SET_HOVERED: {
|
|
46
54
|
actions: "setHovered",
|
|
47
55
|
},
|
|
@@ -59,6 +67,9 @@ export function machine(userContext: UserDefinedContext) {
|
|
|
59
67
|
},
|
|
60
68
|
|
|
61
69
|
{
|
|
70
|
+
guards: {
|
|
71
|
+
isTrusted: (_ctx, evt) => !!evt.isTrusted,
|
|
72
|
+
},
|
|
62
73
|
activities: {
|
|
63
74
|
trackFormControlState(ctx, _evt, { send, initialContext }) {
|
|
64
75
|
return trackFormControl(dom.getRootEl(ctx), {
|
|
@@ -124,6 +135,14 @@ export function machine(userContext: UserDefinedContext) {
|
|
|
124
135
|
},
|
|
125
136
|
})
|
|
126
137
|
},
|
|
138
|
+
dispatchChangeEvent(ctx) {
|
|
139
|
+
const inputEls = dom.getInputEls(ctx)
|
|
140
|
+
inputEls.forEach((inputEl) => {
|
|
141
|
+
const checked = inputEl.value === ctx.value
|
|
142
|
+
if (checked === inputEl.checked) return
|
|
143
|
+
dispatchInputCheckedEvent(inputEl, { checked })
|
|
144
|
+
})
|
|
145
|
+
},
|
|
127
146
|
},
|
|
128
147
|
},
|
|
129
148
|
)
|
package/src/radio-group.types.ts
CHANGED
|
@@ -35,10 +35,6 @@ type PublicContext = DirectionProperty &
|
|
|
35
35
|
* If `true`, the radio group will be disabled
|
|
36
36
|
*/
|
|
37
37
|
disabled?: boolean
|
|
38
|
-
/**
|
|
39
|
-
* If `true`, the radio group will be readonly
|
|
40
|
-
*/
|
|
41
|
-
readOnly?: boolean
|
|
42
38
|
/**
|
|
43
39
|
* Function called once a radio is checked
|
|
44
40
|
* @param value the value of the checked radio
|
|
@@ -113,10 +109,6 @@ export type RadioProps = {
|
|
|
113
109
|
* If `true`, the radio will be disabled
|
|
114
110
|
*/
|
|
115
111
|
disabled?: boolean
|
|
116
|
-
/**
|
|
117
|
-
* If `true`, the radio will be readonly
|
|
118
|
-
*/
|
|
119
|
-
readOnly?: boolean
|
|
120
112
|
/**
|
|
121
113
|
* If `true`, the radio is marked as invalid.
|
|
122
114
|
*/
|