@zag-js/radio-group 0.11.1 → 0.12.0

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 import * as _zag_js_anatomy from '@zag-js/anatomy';
-import { RequiredBy, DirectionProperty, CommonProperties, Context, PropTypes, NormalizeProps } from '@zag-js/types';
+import { PropTypes, RequiredBy, DirectionProperty, CommonProperties, Context, NormalizeProps } from '@zag-js/types';
 import * as _zag_js_core from '@zag-js/core';
 import { StateMachine } from '@zag-js/core';
 
@@ -52,43 +52,7 @@ type PublicContext = DirectionProperty & CommonProperties & {
      */
     orientation?: "horizontal" | "vertical";
 };
-type PrivateContext = Context<{}>;
-type UserDefinedContext = RequiredBy<PublicContext, "id">;
-type ComputedContext = Readonly<{}>;
-type MachineContext = PublicContext & PrivateContext & ComputedContext;
-type MachineState = {
-    value: "idle";
-};
-type State = StateMachine.State<MachineContext, MachineState>;
-type Send = StateMachine.Send<StateMachine.AnyEventObject>;
-type RadioProps = {
-    value: string;
-    /**
-     * If `true`, the radio will be disabled
-     */
-    disabled?: boolean;
-    /**
-     * If `true`, the radio will be readonly
-     */
-    readOnly?: boolean;
-    /**
-     * If `true`, the radio is marked as invalid.
-     */
-    invalid?: boolean;
-};
-type InputProps = RadioProps & {
-    /**
-     * If `true` and `disabled` is passed, the radio will
-     * remain tabbable but not interactive
-     */
-    focusable?: boolean;
-    /**
-     * If `true`, the radio input is marked as required,
-     */
-    required?: boolean;
-};
-
-declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): {
+type PublicApi<T extends PropTypes = PropTypes> = {
     /**
      * The current value of the radio group
      */
@@ -114,7 +78,6 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
      */
     getRadioState: <T_1 extends RadioProps>(props: T_1) => {
         isInteractive: boolean;
-        isReadOnly: boolean | undefined;
         isInvalid: boolean | undefined;
         isDisabled: boolean | undefined;
         isChecked: boolean;
@@ -130,7 +93,44 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
     getRadioInputProps(props: InputProps): T["input"];
     indicatorProps: T["element"];
 };
+type PrivateContext = Context<{}>;
+type UserDefinedContext = RequiredBy<PublicContext, "id">;
+type ComputedContext = Readonly<{}>;
+type MachineContext = PublicContext & PrivateContext & ComputedContext;
+type MachineState = {
+    value: "idle";
+};
+type State = StateMachine.State<MachineContext, MachineState>;
+type Send = StateMachine.Send<StateMachine.AnyEventObject>;
+type RadioProps = {
+    value: string;
+    /**
+     * If `true`, the radio will be disabled
+     */
+    disabled?: boolean;
+    /**
+     * If `true`, the radio will be readonly
+     */
+    readOnly?: boolean;
+    /**
+     * If `true`, the radio is marked as invalid.
+     */
+    invalid?: boolean;
+};
+type InputProps = RadioProps & {
+    /**
+     * If `true` and `disabled` is passed, the radio will
+     * remain tabbable but not interactive
+     */
+    focusable?: boolean;
+    /**
+     * If `true`, the radio input is marked as required,
+     */
+    required?: boolean;
+};
+
+declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T>;
 
 declare function machine(userContext: UserDefinedContext): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
 
-export { UserDefinedContext as Context, anatomy, connect, machine };
+export { UserDefinedContext as Context, PublicApi, anatomy, connect, machine };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as _zag_js_anatomy from '@zag-js/anatomy';
-import { RequiredBy, DirectionProperty, CommonProperties, Context, PropTypes, NormalizeProps } from '@zag-js/types';
+import { PropTypes, RequiredBy, DirectionProperty, CommonProperties, Context, NormalizeProps } from '@zag-js/types';
 import * as _zag_js_core from '@zag-js/core';
 import { StateMachine } from '@zag-js/core';
 
@@ -52,43 +52,7 @@ type PublicContext = DirectionProperty & CommonProperties & {
      */
     orientation?: "horizontal" | "vertical";
 };
-type PrivateContext = Context<{}>;
-type UserDefinedContext = RequiredBy<PublicContext, "id">;
-type ComputedContext = Readonly<{}>;
-type MachineContext = PublicContext & PrivateContext & ComputedContext;
-type MachineState = {
-    value: "idle";
-};
-type State = StateMachine.State<MachineContext, MachineState>;
-type Send = StateMachine.Send<StateMachine.AnyEventObject>;
-type RadioProps = {
-    value: string;
-    /**
-     * If `true`, the radio will be disabled
-     */
-    disabled?: boolean;
-    /**
-     * If `true`, the radio will be readonly
-     */
-    readOnly?: boolean;
-    /**
-     * If `true`, the radio is marked as invalid.
-     */
-    invalid?: boolean;
-};
-type InputProps = RadioProps & {
-    /**
-     * If `true` and `disabled` is passed, the radio will
-     * remain tabbable but not interactive
-     */
-    focusable?: boolean;
-    /**
-     * If `true`, the radio input is marked as required,
-     */
-    required?: boolean;
-};
-
-declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): {
+type PublicApi<T extends PropTypes = PropTypes> = {
     /**
      * The current value of the radio group
      */
@@ -114,7 +78,6 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
      */
     getRadioState: <T_1 extends RadioProps>(props: T_1) => {
         isInteractive: boolean;
-        isReadOnly: boolean | undefined;
         isInvalid: boolean | undefined;
         isDisabled: boolean | undefined;
         isChecked: boolean;
@@ -130,7 +93,44 @@ declare function connect<T extends PropTypes>(state: State, send: Send, normaliz
     getRadioInputProps(props: InputProps): T["input"];
     indicatorProps: T["element"];
 };
+type PrivateContext = Context<{}>;
+type UserDefinedContext = RequiredBy<PublicContext, "id">;
+type ComputedContext = Readonly<{}>;
+type MachineContext = PublicContext & PrivateContext & ComputedContext;
+type MachineState = {
+    value: "idle";
+};
+type State = StateMachine.State<MachineContext, MachineState>;
+type Send = StateMachine.Send<StateMachine.AnyEventObject>;
+type RadioProps = {
+    value: string;
+    /**
+     * If `true`, the radio will be disabled
+     */
+    disabled?: boolean;
+    /**
+     * If `true`, the radio will be readonly
+     */
+    readOnly?: boolean;
+    /**
+     * If `true`, the radio is marked as invalid.
+     */
+    invalid?: boolean;
+};
+type InputProps = RadioProps & {
+    /**
+     * If `true` and `disabled` is passed, the radio will
+     * remain tabbable but not interactive
+     */
+    focusable?: boolean;
+    /**
+     * If `true`, the radio input is marked as required,
+     */
+    required?: boolean;
+};
+
+declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T>;
 
 declare function machine(userContext: UserDefinedContext): _zag_js_core.Machine<MachineContext, MachineState, _zag_js_core.StateMachine.AnyEventObject>;
 
-export { UserDefinedContext as Context, anatomy, connect, machine };
+export { UserDefinedContext as Context, PublicApi, anatomy, connect, machine };

package/dist/index.js

@@ -93,10 +93,8 @@ var dom = (0, import_dom_query.createScope)({
 // src/radio-group.connect.ts
 function connect(state, send, normalize) {
   const isGroupDisabled = state.context.disabled;
-  const isGroupReadOnly = state.context.readOnly;
   function getRadioState(props) {
     const radioState = {
-      isReadOnly: props.readOnly || isGroupReadOnly,
       isInvalid: props.invalid,
       isDisabled: props.disabled || isGroupDisabled,
       isChecked: state.context.value === props.value,
@@ -106,7 +104,7 @@ function connect(state, send, normalize) {
     };
     return {
       ...radioState,
-      isInteractive: !(radioState.isReadOnly || radioState.isDisabled)
+      isInteractive: !radioState.isDisabled
     };
   }
   function getRadioDataAttrs(props) {
@@ -114,10 +112,9 @@ function connect(state, send, normalize) {
     return {
       "data-focus": (0, import_dom_query2.dataAttr)(radioState.isFocused),
       "data-disabled": (0, import_dom_query2.dataAttr)(radioState.isDisabled),
-      "data-checked": (0, import_dom_query2.dataAttr)(radioState.isChecked),
+      "data-state": radioState.isChecked ? "checked" : "unchecked",
       "data-hover": (0, import_dom_query2.dataAttr)(radioState.isHovered),
-      "data-invalid": (0, import_dom_query2.dataAttr)(radioState.isInvalid),
-      "data-readonly": (0, import_dom_query2.dataAttr)(radioState.isReadOnly)
+      "data-invalid": (0, import_dom_query2.dataAttr)(radioState.isInvalid)
     };
   }
   const focus = () => {
@@ -130,29 +127,14 @@ function connect(state, send, normalize) {
     firstEnabledInput?.focus();
   };
   return {
-    /**
-     * The current value of the radio group
-     */
     value: state.context.value,
-    /**
-     * Function to set the value of the radio group
-     */
     setValue(value) {
       send({ type: "SET_VALUE", value, manual: true });
     },
-    /**
-     * Function to clear the value of the radio group
-     */
     clearValue() {
       send({ type: "SET_VALUE", value: null, manual: true });
     },
-    /**
-     * Function to focus the radio group
-     */
     focus,
-    /**
-     * Function to blur the currently focused radio input in the radio group
-     */
     blur() {
       const focusedElement = dom.getActiveElement(state.context);
       const inputEls = dom.getInputEls(state.context);
@@ -160,9 +142,6 @@ function connect(state, send, normalize) {
       if (radioInputIsFocused)
         focusedElement?.blur();
     },
-    /**
-     * Returns the state details of a radio input
-     */
     getRadioState,
     rootProps: normalize.element({
       ...parts.root.attrs,
@@ -240,9 +219,8 @@ function connect(state, send, normalize) {
         form: state.context.form,
         value: props.value,
         onChange(event) {
-          if (inputState.isReadOnly || inputState.isDisabled) {
+          if (inputState.isDisabled)
             return;
-          }
           if (event.target.checked) {
             send({ type: "SET_VALUE", value: props.value });
           }
@@ -269,8 +247,6 @@ function connect(state, send, normalize) {
         "data-disabled": (0, import_dom_query2.dataAttr)(inputState.isDisabled),
         "aria-required": (0, import_dom_query2.ariaAttr)(isRequired),
         "aria-invalid": (0, import_dom_query2.ariaAttr)(inputState.isInvalid),
-        readOnly: inputState.isReadOnly,
-        "data-readonly": (0, import_dom_query2.dataAttr)(inputState.isReadOnly),
         "aria-disabled": (0, import_dom_query2.ariaAttr)(trulyDisabled),
         "aria-checked": (0, import_dom_query2.ariaAttr)(inputState.isChecked),
         style: import_visually_hidden.visuallyHiddenStyle

package/dist/index.js.map

@@ -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 } 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  \"radioInput\",\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, RadioProps, Send, State } from \"./radio-group.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>) {\n  const isGroupDisabled = state.context.disabled\n  const isGroupReadOnly = state.context.readOnly\n\n  function getRadioState<T extends RadioProps>(props: T) {\n    const radioState = {\n      isReadOnly: props.readOnly || isGroupReadOnly,\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.isReadOnly || 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-checked\": dataAttr(radioState.isChecked),\n      \"data-hover\": dataAttr(radioState.isHovered),\n      \"data-invalid\": dataAttr(radioState.isInvalid),\n      \"data-readonly\": dataAttr(radioState.isReadOnly),\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    /**\n     * The current value of the radio group\n     */\n    value: state.context.value,\n    /**\n     * Function to set the value of the radio group\n     */\n    setValue(value: string) {\n      send({ type: \"SET_VALUE\", value, manual: true })\n    },\n    /**\n     * Function to clear the value of the radio group\n     */\n    clearValue() {\n      send({ type: \"SET_VALUE\", value: null, manual: true })\n    },\n    /**\n     * Function to focus the radio group\n     */\n    focus,\n    /**\n     * Function to blur the currently focused radio input in the radio group\n     */\n    blur() {\n      const focusedElement = dom.getActiveElement(state.context)\n      const inputEls = dom.getInputEls(state.context)\n      const radioInputIsFocused = inputEls.some((el) => el === focusedElement)\n      if (radioInputIsFocused) focusedElement?.blur()\n    },\n    /**\n     * Returns the state details of a radio input\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      \"aria-orientation\": state.context.orientation,\n      dir: state.context.dir,\n    }),\n\n    labelProps: normalize.element({\n      ...parts.label.attrs,\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.getRadioInputId(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    getRadioInputProps(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        ...parts.radioInput.attrs,\n        \"data-ownedby\": dom.getRootId(state.context),\n        id: dom.getRadioInputId(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.isReadOnly || inputState.isDisabled) {\n            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        readOnly: inputState.isReadOnly,\n        \"data-readonly\": dataAttr(inputState.isReadOnly),\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-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  getRadioInputId: (ctx: Ctx, value: string) =>\n    ctx.ids?.radioInput?.(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 ?? `tabs:${ctx.id}:indicator`,\n\n  getRootEl: (ctx: Ctx) => dom.getById(ctx, dom.getRootId(ctx)),\n  getRadioInputEl: (ctx: Ctx, value: string) => dom.getById<HTMLInputElement>(ctx, dom.getRadioInputId(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    return {\n      left: el?.offsetLeft ?? 0,\n      top: el?.offsetTop ?? 0,\n      width: el?.offsetWidth ?? 0,\n      height: el?.offsetHeight ?? 0,\n    }\n  },\n\n  getRectById: (ctx: Ctx, id: string) => {\n    const tab = dom.queryById(ctx, dom.getRadioId(ctx, id))\n    return dom.resolveRect(dom.getOffsetRect(tab))\n  },\n\n  resolveRect(rect: Record<\"width\" | \"height\" | \"left\" | \"top\", number>) {\n    return {\n      width: `${rect.width}px`,\n      height: `${rect.height}px`,\n      left: `${rect.left}px`,\n      top: `${rect.top}px`,\n    }\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        indicatorRect: {},\n        canIndicatorTransition: false,\n        ...ctx,\n      },\n\n      entry: [\"syncIndicatorRect\"],\n\n      exit: [\"cleanupObserver\"],\n\n      activities: [\"trackFormControlState\"],\n\n      watch: {\n        value: [\n          \"setIndicatorTransition\",\n          // important to set this after `setIndicatorTransition`\n          \"setPreviousValue\",\n          \"invokeOnChange\",\n          \"syncIndicatorRect\",\n          \"syncInputElements\",\n        ],\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            onFieldsetDisabled() {\n              ctx.disabled = true\n            },\n            onFormReset() {\n              send({ type: \"SET_VALUE\", value: initialContext.value })\n            },\n          })\n        },\n      },\n\n      actions: {\n        setValue(ctx, evt) {\n          ctx.value = 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        invokeOnChange(ctx, evt) {\n          ctx.onChange?.({ value: 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"],"mappings":"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","names":["import_dom_query","import_dom_query","ctx"]}
+{"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, PublicApi } 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  \"radioInput\",\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, PublicApi, RadioProps, Send, State } from \"./radio-group.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T> {\n  const isGroupDisabled = state.context.disabled\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    }\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 radioInputIsFocused = inputEls.some((el) => el === focusedElement)\n      if (radioInputIsFocused) 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      \"aria-orientation\": state.context.orientation,\n      dir: state.context.dir,\n    }),\n\n    labelProps: normalize.element({\n      ...parts.label.attrs,\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.getRadioInputId(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    getRadioInputProps(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        ...parts.radioInput.attrs,\n        \"data-ownedby\": dom.getRootId(state.context),\n        id: dom.getRadioInputId(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-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  getRadioInputId: (ctx: Ctx, value: string) =>\n    ctx.ids?.radioInput?.(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 ?? `tabs:${ctx.id}:indicator`,\n\n  getRootEl: (ctx: Ctx) => dom.getById(ctx, dom.getRootId(ctx)),\n  getRadioInputEl: (ctx: Ctx, value: string) => dom.getById<HTMLInputElement>(ctx, dom.getRadioInputId(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    return {\n      left: el?.offsetLeft ?? 0,\n      top: el?.offsetTop ?? 0,\n      width: el?.offsetWidth ?? 0,\n      height: el?.offsetHeight ?? 0,\n    }\n  },\n\n  getRectById: (ctx: Ctx, id: string) => {\n    const tab = dom.queryById(ctx, dom.getRadioId(ctx, id))\n    return dom.resolveRect(dom.getOffsetRect(tab))\n  },\n\n  resolveRect(rect: Record<\"width\" | \"height\" | \"left\" | \"top\", number>) {\n    return {\n      width: `${rect.width}px`,\n      height: `${rect.height}px`,\n      left: `${rect.left}px`,\n      top: `${rect.top}px`,\n    }\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        indicatorRect: {},\n        canIndicatorTransition: false,\n        ...ctx,\n      },\n\n      entry: [\"syncIndicatorRect\"],\n\n      exit: [\"cleanupObserver\"],\n\n      activities: [\"trackFormControlState\"],\n\n      watch: {\n        value: [\n          \"setIndicatorTransition\",\n          // important to set this after `setIndicatorTransition`\n          \"setPreviousValue\",\n          \"invokeOnChange\",\n          \"syncIndicatorRect\",\n          \"syncInputElements\",\n        ],\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            onFieldsetDisabled() {\n              ctx.disabled = true\n            },\n            onFormReset() {\n              send({ type: \"SET_VALUE\", value: initialContext.value })\n            },\n          })\n        },\n      },\n\n      actions: {\n        setValue(ctx, evt) {\n          ctx.value = 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        invokeOnChange(ctx, evt) {\n          ctx.onChange?.({ value: 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"],"mappings":"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","names":["import_dom_query","import_dom_query","ctx"]}

package/dist/index.mjs

@@ -65,10 +65,8 @@ var dom = createScope({
 // src/radio-group.connect.ts
 function connect(state, send, normalize) {
   const isGroupDisabled = state.context.disabled;
-  const isGroupReadOnly = state.context.readOnly;
   function getRadioState(props) {
     const radioState = {
-      isReadOnly: props.readOnly || isGroupReadOnly,
       isInvalid: props.invalid,
       isDisabled: props.disabled || isGroupDisabled,
       isChecked: state.context.value === props.value,
@@ -78,7 +76,7 @@ function connect(state, send, normalize) {
     };
     return {
       ...radioState,
-      isInteractive: !(radioState.isReadOnly || radioState.isDisabled)
+      isInteractive: !radioState.isDisabled
     };
   }
   function getRadioDataAttrs(props) {
@@ -86,10 +84,9 @@ function connect(state, send, normalize) {
     return {
       "data-focus": dataAttr(radioState.isFocused),
       "data-disabled": dataAttr(radioState.isDisabled),
-      "data-checked": dataAttr(radioState.isChecked),
+      "data-state": radioState.isChecked ? "checked" : "unchecked",
       "data-hover": dataAttr(radioState.isHovered),
-      "data-invalid": dataAttr(radioState.isInvalid),
-      "data-readonly": dataAttr(radioState.isReadOnly)
+      "data-invalid": dataAttr(radioState.isInvalid)
     };
   }
   const focus = () => {
@@ -102,29 +99,14 @@ function connect(state, send, normalize) {
     firstEnabledInput?.focus();
   };
   return {
-    /**
-     * The current value of the radio group
-     */
     value: state.context.value,
-    /**
-     * Function to set the value of the radio group
-     */
     setValue(value) {
       send({ type: "SET_VALUE", value, manual: true });
     },
-    /**
-     * Function to clear the value of the radio group
-     */
     clearValue() {
       send({ type: "SET_VALUE", value: null, manual: true });
     },
-    /**
-     * Function to focus the radio group
-     */
     focus,
-    /**
-     * Function to blur the currently focused radio input in the radio group
-     */
     blur() {
       const focusedElement = dom.getActiveElement(state.context);
       const inputEls = dom.getInputEls(state.context);
@@ -132,9 +114,6 @@ function connect(state, send, normalize) {
       if (radioInputIsFocused)
         focusedElement?.blur();
     },
-    /**
-     * Returns the state details of a radio input
-     */
     getRadioState,
     rootProps: normalize.element({
       ...parts.root.attrs,
@@ -212,9 +191,8 @@ function connect(state, send, normalize) {
         form: state.context.form,
         value: props.value,
         onChange(event) {
-          if (inputState.isReadOnly || inputState.isDisabled) {
+          if (inputState.isDisabled)
             return;
-          }
           if (event.target.checked) {
             send({ type: "SET_VALUE", value: props.value });
           }
@@ -241,8 +219,6 @@ function connect(state, send, normalize) {
         "data-disabled": dataAttr(inputState.isDisabled),
         "aria-required": ariaAttr(isRequired),
         "aria-invalid": ariaAttr(inputState.isInvalid),
-        readOnly: inputState.isReadOnly,
-        "data-readonly": dataAttr(inputState.isReadOnly),
         "aria-disabled": ariaAttr(trulyDisabled),
         "aria-checked": ariaAttr(inputState.isChecked),
         style: visuallyHiddenStyle

package/dist/index.mjs.map

@@ -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  \"radioInput\",\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, RadioProps, Send, State } from \"./radio-group.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>) {\n  const isGroupDisabled = state.context.disabled\n  const isGroupReadOnly = state.context.readOnly\n\n  function getRadioState<T extends RadioProps>(props: T) {\n    const radioState = {\n      isReadOnly: props.readOnly || isGroupReadOnly,\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.isReadOnly || 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-checked\": dataAttr(radioState.isChecked),\n      \"data-hover\": dataAttr(radioState.isHovered),\n      \"data-invalid\": dataAttr(radioState.isInvalid),\n      \"data-readonly\": dataAttr(radioState.isReadOnly),\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    /**\n     * The current value of the radio group\n     */\n    value: state.context.value,\n    /**\n     * Function to set the value of the radio group\n     */\n    setValue(value: string) {\n      send({ type: \"SET_VALUE\", value, manual: true })\n    },\n    /**\n     * Function to clear the value of the radio group\n     */\n    clearValue() {\n      send({ type: \"SET_VALUE\", value: null, manual: true })\n    },\n    /**\n     * Function to focus the radio group\n     */\n    focus,\n    /**\n     * Function to blur the currently focused radio input in the radio group\n     */\n    blur() {\n      const focusedElement = dom.getActiveElement(state.context)\n      const inputEls = dom.getInputEls(state.context)\n      const radioInputIsFocused = inputEls.some((el) => el === focusedElement)\n      if (radioInputIsFocused) focusedElement?.blur()\n    },\n    /**\n     * Returns the state details of a radio input\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      \"aria-orientation\": state.context.orientation,\n      dir: state.context.dir,\n    }),\n\n    labelProps: normalize.element({\n      ...parts.label.attrs,\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.getRadioInputId(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    getRadioInputProps(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        ...parts.radioInput.attrs,\n        \"data-ownedby\": dom.getRootId(state.context),\n        id: dom.getRadioInputId(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.isReadOnly || inputState.isDisabled) {\n            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        readOnly: inputState.isReadOnly,\n        \"data-readonly\": dataAttr(inputState.isReadOnly),\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-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  getRadioInputId: (ctx: Ctx, value: string) =>\n    ctx.ids?.radioInput?.(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 ?? `tabs:${ctx.id}:indicator`,\n\n  getRootEl: (ctx: Ctx) => dom.getById(ctx, dom.getRootId(ctx)),\n  getRadioInputEl: (ctx: Ctx, value: string) => dom.getById<HTMLInputElement>(ctx, dom.getRadioInputId(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    return {\n      left: el?.offsetLeft ?? 0,\n      top: el?.offsetTop ?? 0,\n      width: el?.offsetWidth ?? 0,\n      height: el?.offsetHeight ?? 0,\n    }\n  },\n\n  getRectById: (ctx: Ctx, id: string) => {\n    const tab = dom.queryById(ctx, dom.getRadioId(ctx, id))\n    return dom.resolveRect(dom.getOffsetRect(tab))\n  },\n\n  resolveRect(rect: Record<\"width\" | \"height\" | \"left\" | \"top\", number>) {\n    return {\n      width: `${rect.width}px`,\n      height: `${rect.height}px`,\n      left: `${rect.left}px`,\n      top: `${rect.top}px`,\n    }\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        indicatorRect: {},\n        canIndicatorTransition: false,\n        ...ctx,\n      },\n\n      entry: [\"syncIndicatorRect\"],\n\n      exit: [\"cleanupObserver\"],\n\n      activities: [\"trackFormControlState\"],\n\n      watch: {\n        value: [\n          \"setIndicatorTransition\",\n          // important to set this after `setIndicatorTransition`\n          \"setPreviousValue\",\n          \"invokeOnChange\",\n          \"syncIndicatorRect\",\n          \"syncInputElements\",\n        ],\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            onFieldsetDisabled() {\n              ctx.disabled = true\n            },\n            onFormReset() {\n              send({ type: \"SET_VALUE\", value: initialContext.value })\n            },\n          })\n        },\n      },\n\n      actions: {\n        setValue(ctx, evt) {\n          ctx.value = 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        invokeOnChange(ctx, evt) {\n          ctx.onChange?.({ value: 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"],"mappings":"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","names":["ctx"]}
+{"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  \"radioInput\",\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, PublicApi, RadioProps, Send, State } from \"./radio-group.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T> {\n  const isGroupDisabled = state.context.disabled\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    }\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 radioInputIsFocused = inputEls.some((el) => el === focusedElement)\n      if (radioInputIsFocused) 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      \"aria-orientation\": state.context.orientation,\n      dir: state.context.dir,\n    }),\n\n    labelProps: normalize.element({\n      ...parts.label.attrs,\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.getRadioInputId(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    getRadioInputProps(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        ...parts.radioInput.attrs,\n        \"data-ownedby\": dom.getRootId(state.context),\n        id: dom.getRadioInputId(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-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  getRadioInputId: (ctx: Ctx, value: string) =>\n    ctx.ids?.radioInput?.(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 ?? `tabs:${ctx.id}:indicator`,\n\n  getRootEl: (ctx: Ctx) => dom.getById(ctx, dom.getRootId(ctx)),\n  getRadioInputEl: (ctx: Ctx, value: string) => dom.getById<HTMLInputElement>(ctx, dom.getRadioInputId(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    return {\n      left: el?.offsetLeft ?? 0,\n      top: el?.offsetTop ?? 0,\n      width: el?.offsetWidth ?? 0,\n      height: el?.offsetHeight ?? 0,\n    }\n  },\n\n  getRectById: (ctx: Ctx, id: string) => {\n    const tab = dom.queryById(ctx, dom.getRadioId(ctx, id))\n    return dom.resolveRect(dom.getOffsetRect(tab))\n  },\n\n  resolveRect(rect: Record<\"width\" | \"height\" | \"left\" | \"top\", number>) {\n    return {\n      width: `${rect.width}px`,\n      height: `${rect.height}px`,\n      left: `${rect.left}px`,\n      top: `${rect.top}px`,\n    }\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        indicatorRect: {},\n        canIndicatorTransition: false,\n        ...ctx,\n      },\n\n      entry: [\"syncIndicatorRect\"],\n\n      exit: [\"cleanupObserver\"],\n\n      activities: [\"trackFormControlState\"],\n\n      watch: {\n        value: [\n          \"setIndicatorTransition\",\n          // important to set this after `setIndicatorTransition`\n          \"setPreviousValue\",\n          \"invokeOnChange\",\n          \"syncIndicatorRect\",\n          \"syncInputElements\",\n        ],\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            onFieldsetDisabled() {\n              ctx.disabled = true\n            },\n            onFormReset() {\n              send({ type: \"SET_VALUE\", value: initialContext.value })\n            },\n          })\n        },\n      },\n\n      actions: {\n        setValue(ctx, evt) {\n          ctx.value = 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        invokeOnChange(ctx, evt) {\n          ctx.onChange?.({ value: 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"],"mappings":"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","names":["ctx"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/radio-group",
-  "version": "0.11.1",
+  "version": "0.12.0",
   "description": "Core logic for the radio group widget implemented as a state machine",
   "keywords": [
     "js",
@@ -28,14 +28,14 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/anatomy": "0.11.1",
-    "@zag-js/dom-query": "0.11.1",
-    "@zag-js/element-rect": "0.11.1",
-    "@zag-js/form-utils": "0.11.1",
-    "@zag-js/visually-hidden": "0.11.1",
-    "@zag-js/utils": "0.11.1",
-    "@zag-js/core": "0.11.1",
-    "@zag-js/types": "0.11.1"
+    "@zag-js/anatomy": "0.12.0",
+    "@zag-js/dom-query": "0.12.0",
+    "@zag-js/element-rect": "0.12.0",
+    "@zag-js/form-utils": "0.12.0",
+    "@zag-js/visually-hidden": "0.12.0",
+    "@zag-js/utils": "0.12.0",
+    "@zag-js/core": "0.12.0",
+    "@zag-js/types": "0.12.0"
   },
   "devDependencies": {
     "clean-package": "2.2.0"

package/src/index.ts

@@ -1,4 +1,4 @@
 export { anatomy } from "./radio-group.anatomy"
 export { connect } from "./radio-group.connect"
 export { machine } from "./radio-group.machine"
-export type { UserDefinedContext as Context } from "./radio-group.types"
+export type { UserDefinedContext as Context, PublicApi } from "./radio-group.types"

package/src/radio-group.connect.ts

@@ -3,15 +3,13 @@ import type { NormalizeProps, PropTypes } from "@zag-js/types"
 import { visuallyHiddenStyle } from "@zag-js/visually-hidden"
 import { parts } from "./radio-group.anatomy"
 import { dom } from "./radio-group.dom"
-import type { InputProps, RadioProps, Send, State } from "./radio-group.types"
+import type { InputProps, PublicApi, RadioProps, Send, State } from "./radio-group.types"
 
-export function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>) {
+export function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): PublicApi<T> {
   const isGroupDisabled = state.context.disabled
-  const isGroupReadOnly = state.context.readOnly
 
   function getRadioState<T extends RadioProps>(props: T) {
     const radioState = {
-      isReadOnly: props.readOnly || isGroupReadOnly,
       isInvalid: props.invalid,
       isDisabled: props.disabled || isGroupDisabled,
       isChecked: state.context.value === props.value,
@@ -21,7 +19,7 @@ export function connect<T extends PropTypes>(state: State, send: Send, normalize
     }
     return {
       ...radioState,
-      isInteractive: !(radioState.isReadOnly || radioState.isDisabled),
+      isInteractive: !radioState.isDisabled,
     }
   }
 
@@ -30,10 +28,9 @@ export function connect<T extends PropTypes>(state: State, send: Send, normalize
     return {
       "data-focus": dataAttr(radioState.isFocused),
       "data-disabled": dataAttr(radioState.isDisabled),
-      "data-checked": dataAttr(radioState.isChecked),
+      "data-state": radioState.isChecked ? "checked" : "unchecked",
       "data-hover": dataAttr(radioState.isHovered),
       "data-invalid": dataAttr(radioState.isInvalid),
-      "data-readonly": dataAttr(radioState.isReadOnly),
     }
   }
 
@@ -50,38 +47,25 @@ export function connect<T extends PropTypes>(state: State, send: Send, normalize
   }
 
   return {
-    /**
-     * The current value of the radio group
-     */
     value: state.context.value,
-    /**
-     * Function to set the value of the radio group
-     */
+
     setValue(value: string) {
       send({ type: "SET_VALUE", value, manual: true })
     },
-    /**
-     * Function to clear the value of the radio group
-     */
+
     clearValue() {
       send({ type: "SET_VALUE", value: null, manual: true })
     },
-    /**
-     * Function to focus the radio group
-     */
+
     focus,
-    /**
-     * Function to blur the currently focused radio input in the radio group
-     */
+
     blur() {
       const focusedElement = dom.getActiveElement(state.context)
       const inputEls = dom.getInputEls(state.context)
       const radioInputIsFocused = inputEls.some((el) => el === focusedElement)
       if (radioInputIsFocused) focusedElement?.blur()
     },
-    /**
-     * Returns the state details of a radio input
-     */
+
     getRadioState,
 
     rootProps: normalize.element({
@@ -168,9 +152,8 @@ export function connect<T extends PropTypes>(state: State, send: Send, normalize
         form: state.context.form,
         value: props.value,
         onChange(event) {
-          if (inputState.isReadOnly || inputState.isDisabled) {
-            return
-          }
+          if (inputState.isDisabled) return
+
           if (event.target.checked) {
             send({ type: "SET_VALUE", value: props.value })
           }
@@ -197,8 +180,6 @@ export function connect<T extends PropTypes>(state: State, send: Send, normalize
         "data-disabled": dataAttr(inputState.isDisabled),
         "aria-required": ariaAttr(isRequired),
         "aria-invalid": ariaAttr(inputState.isInvalid),
-        readOnly: inputState.isReadOnly,
-        "data-readonly": dataAttr(inputState.isReadOnly),
         "aria-disabled": ariaAttr(trulyDisabled),
         "aria-checked": ariaAttr(inputState.isChecked),
         style: visuallyHiddenStyle,

package/src/radio-group.types.ts

@@ -1,5 +1,5 @@
 import type { StateMachine as S } from "@zag-js/core"
-import type { CommonProperties, Context, DirectionProperty, RequiredBy } from "@zag-js/types"
+import type { CommonProperties, Context, DirectionProperty, PropTypes, RequiredBy } from "@zag-js/types"
 
 type ElementIds = Partial<{
   root: string
@@ -49,6 +49,49 @@ type PublicContext = DirectionProperty &
      */
     orientation?: "horizontal" | "vertical"
   }
+export type PublicApi<T extends PropTypes = PropTypes> = {
+  /**
+   * The current value of the radio group
+   */
+  value: string | null
+  /**
+   * Function to set the value of the radio group
+   */
+  setValue(value: string): void
+  /**
+   * Function to clear the value of the radio group
+   */
+  clearValue(): void
+  /**
+   * Function to focus the radio group
+   */
+  focus: () => void
+  /**
+   * Function to blur the currently focused radio input in the radio group
+   */
+  blur(): void
+  /**
+   * Returns the state details of a radio input
+   */
+  getRadioState: <T_1 extends RadioProps>(
+    props: T_1,
+  ) => {
+    isInteractive: boolean
+    isInvalid: boolean | undefined
+    isDisabled: boolean | undefined
+    isChecked: boolean
+    isFocused: boolean
+    isHovered: boolean
+    isActive: boolean
+  }
+  rootProps: T["element"]
+  labelProps: T["element"]
+  getRadioProps(props: RadioProps): T["label"]
+  getRadioLabelProps(props: RadioProps): T["element"]
+  getRadioControlProps(props: RadioProps): T["element"]
+  getRadioInputProps(props: InputProps): T["input"]
+  indicatorProps: T["element"]
+}
 
 type PrivateContext = Context<{
   /**