@base-ui/react 1.6.0 → 1.7.0

package/radio/root/RadioRoot.js

@@ -9,14 +9,13 @@ exports.RadioRoot = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _useMergedRefs = require("@base-ui/utils/useMergedRefs");
 var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
-var _useStableCallback = require("@base-ui/utils/useStableCallback");
 var _visuallyHidden = require("@base-ui/utils/visuallyHidden");
 var _empty = require("@base-ui/utils/empty");
-var _owner = require("@base-ui/utils/owner");
 var _createBaseUIEventDetails = require("../../internals/createBaseUIEventDetails");
 var _reasons = require("../../internals/reasons");
 var _noop = require("../../internals/noop");
 var _stateAttributesMapping = require("../utils/stateAttributesMapping");
+var _dispatchClickWithModifiers = require("../../utils/dispatchClickWithModifiers");
 var _useBaseUiId = require("../../internals/useBaseUiId");
 var _useRenderElement = require("../../internals/useRenderElement");
 var _useButton = require("../../internals/use-button");
@@ -61,12 +60,11 @@ const RadioRoot = exports.RadioRoot = /*#__PURE__*/React.forwardRef(function Rad
     checkedValue,
     touched = false,
     validation,
-    name
+    name,
+    setCheckedValue = _noop.NOOP,
+    setTouched = _noop.NOOP,
+    registerInputRef = _noop.NOOP
   } = groupContext ?? {};
-  const setCheckedValue = groupContext?.setCheckedValue ?? _noop.NOOP;
-  const setTouched = groupContext?.setTouched ?? _noop.NOOP;
-  const registerControlRef = groupContext?.registerControlRef ?? _noop.NOOP;
-  const registerInputRef = groupContext?.registerInputRef ?? _noop.NOOP;
   const {
     setTouched: setFieldTouched,
     setFilled,
@@ -85,13 +83,12 @@ const RadioRoot = exports.RadioRoot = /*#__PURE__*/React.forwardRef(function Rad
   const checked = groupContext ? checkedValue === value : value === '';
   const radioRef = React.useRef(null);
   const inputRef = React.useRef(null);
-  const handleControlRef = (0, _useStableCallback.useStableCallback)(element => {
-    if (!element) {
-      return;
-    }
-    registerControlRef(element, disabled);
-  });
-  const mergedInputRef = (0, _useMergedRefs.useMergedRefs)(inputRefProp, inputRef, registerInputRef);
+  const registerFieldInput = validation?.registerInput;
+  const registerInput = React.useCallback(element => registerFieldInput?.(element, {
+    controlRef: radioRef,
+    value: undefined
+  }), [registerFieldInput]);
+  const mergedInputRef = (0, _useMergedRefs.useMergedRefs)(inputRefProp, inputRef, registerInputRef, registerInput);
   (0, _useIsoLayoutEffect.useIsoLayoutEffect)(() => {
     if (inputRef.current?.checked) {
       setFilled(true);
@@ -105,11 +102,8 @@ const RadioRoot = exports.RadioRoot = /*#__PURE__*/React.forwardRef(function Rad
       registerInputRef(null);
       return;
     }
-    if (radioRef.current) {
-      registerControlRef(radioRef.current, disabled);
-    }
     registerInputRef(inputRef.current);
-  }, [checked, disabled, registerControlRef, registerInputRef]);
+  }, [checked, disabled, registerInputRef]);
   const id = (0, _useBaseUiId.useBaseUiId)();
   const inputId = (0, _useLabelableId.useLabelableId)({
     id: idProp,
@@ -121,13 +115,13 @@ const RadioRoot = exports.RadioRoot = /*#__PURE__*/React.forwardRef(function Rad
   const rootProps = {
     role: 'radio',
     'aria-checked': checked,
-    'aria-required': required || undefined,
-    'aria-readonly': readOnly || undefined,
     'aria-labelledby': ariaLabelledBy,
     [_constants.ACTIVE_COMPOSITE_ITEM]: checked ? '' : undefined,
     id: nativeButton ? inputId : id,
     onKeyDown(event) {
       if (event.key === 'Enter') {
+        // Radio only activates with Space. Preventing the keydown's default
+        // stops useButton from turning Enter into a click.
         event.preventDefault();
       }
     },
@@ -140,13 +134,7 @@ const RadioRoot = exports.RadioRoot = /*#__PURE__*/React.forwardRef(function Rad
       if (!input) {
         return;
       }
-      input.dispatchEvent(new ((0, _owner.ownerWindow)(input).PointerEvent)('click', {
-        bubbles: true,
-        shiftKey: event.shiftKey,
-        ctrlKey: event.ctrlKey,
-        altKey: event.altKey,
-        metaKey: event.metaKey
-      }));
+      (0, _dispatchClickWithModifiers.dispatchClickWithModifiers)(input, event);
     },
     onFocus(event) {
       if (event.defaultPrevented || disabled || readOnly || !touched) {
@@ -181,7 +169,7 @@ const RadioRoot = exports.RadioRoot = /*#__PURE__*/React.forwardRef(function Rad
     required,
     readOnly,
     onChange(event) {
-      // Workaround for https://github.com/facebook/react/issues/9023
+      // Workaround for https://github.com/react/react/issues/9023
       if (event.nativeEvent.defaultPrevented) {
         return;
       }
@@ -195,6 +183,11 @@ const RadioRoot = exports.RadioRoot = /*#__PURE__*/React.forwardRef(function Rad
       }
       setFieldTouched(true);
     },
+    onClick(event) {
+      // Clicks dispatched on the input from the root's `onClick` and `onFocus` are an
+      // implementation detail and must not reach ancestors.
+      event.stopPropagation();
+    },
     onFocus() {
       radioRef.current?.focus();
     }
@@ -208,7 +201,7 @@ const RadioRoot = exports.RadioRoot = /*#__PURE__*/React.forwardRef(function Rad
   }), [fieldState, disabled, readOnly, checked, required]);
   const contextValue = state;
   const isRadioGroup = groupContext !== undefined;
-  const refs = [forwardedRef, radioRef, buttonRef, handleControlRef];
+  const refs = [forwardedRef, radioRef, buttonRef];
   const props = [rootProps, elementProps, getButtonProps, getDescriptionProps, validation ? validationProps => validation.getValidationProps(disabled, validationProps) : _empty.EMPTY_OBJECT];
   const element = (0, _useRenderElement.useRenderElement)('span', componentProps, {
     enabled: !isRadioGroup,

package/radio/root/RadioRoot.mjs

@@ -3,14 +3,13 @@
 import * as React from 'react';
 import { useMergedRefs } from '@base-ui/utils/useMergedRefs';
 import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
-import { useStableCallback } from '@base-ui/utils/useStableCallback';
 import { visuallyHidden, visuallyHiddenInput } from '@base-ui/utils/visuallyHidden';
 import { EMPTY_OBJECT } from '@base-ui/utils/empty';
-import { ownerWindow } from '@base-ui/utils/owner';
 import { createChangeEventDetails } from "../../internals/createBaseUIEventDetails.mjs";
 import { REASONS } from "../../internals/reasons.mjs";
 import { NOOP } from "../../internals/noop.mjs";
 import { stateAttributesMapping } from "../utils/stateAttributesMapping.mjs";
+import { dispatchClickWithModifiers } from "../../utils/dispatchClickWithModifiers.mjs";
 import { useBaseUiId } from "../../internals/useBaseUiId.mjs";
 import { useRenderElement } from "../../internals/useRenderElement.mjs";
 import { useButton } from "../../internals/use-button/index.mjs";
@@ -56,12 +55,11 @@ export const RadioRoot = /*#__PURE__*/React.forwardRef(function RadioRoot(compon
     checkedValue,
     touched = false,
     validation,
-    name
+    name,
+    setCheckedValue = NOOP,
+    setTouched = NOOP,
+    registerInputRef = NOOP
   } = groupContext ?? {};
-  const setCheckedValue = groupContext?.setCheckedValue ?? NOOP;
-  const setTouched = groupContext?.setTouched ?? NOOP;
-  const registerControlRef = groupContext?.registerControlRef ?? NOOP;
-  const registerInputRef = groupContext?.registerInputRef ?? NOOP;
   const {
     setTouched: setFieldTouched,
     setFilled,
@@ -80,13 +78,12 @@ export const RadioRoot = /*#__PURE__*/React.forwardRef(function RadioRoot(compon
   const checked = groupContext ? checkedValue === value : value === '';
   const radioRef = React.useRef(null);
   const inputRef = React.useRef(null);
-  const handleControlRef = useStableCallback(element => {
-    if (!element) {
-      return;
-    }
-    registerControlRef(element, disabled);
-  });
-  const mergedInputRef = useMergedRefs(inputRefProp, inputRef, registerInputRef);
+  const registerFieldInput = validation?.registerInput;
+  const registerInput = React.useCallback(element => registerFieldInput?.(element, {
+    controlRef: radioRef,
+    value: undefined
+  }), [registerFieldInput]);
+  const mergedInputRef = useMergedRefs(inputRefProp, inputRef, registerInputRef, registerInput);
   useIsoLayoutEffect(() => {
     if (inputRef.current?.checked) {
       setFilled(true);
@@ -100,11 +97,8 @@ export const RadioRoot = /*#__PURE__*/React.forwardRef(function RadioRoot(compon
       registerInputRef(null);
       return;
     }
-    if (radioRef.current) {
-      registerControlRef(radioRef.current, disabled);
-    }
     registerInputRef(inputRef.current);
-  }, [checked, disabled, registerControlRef, registerInputRef]);
+  }, [checked, disabled, registerInputRef]);
   const id = useBaseUiId();
   const inputId = useLabelableId({
     id: idProp,
@@ -116,13 +110,13 @@ export const RadioRoot = /*#__PURE__*/React.forwardRef(function RadioRoot(compon
   const rootProps = {
     role: 'radio',
     'aria-checked': checked,
-    'aria-required': required || undefined,
-    'aria-readonly': readOnly || undefined,
     'aria-labelledby': ariaLabelledBy,
     [ACTIVE_COMPOSITE_ITEM]: checked ? '' : undefined,
     id: nativeButton ? inputId : id,
     onKeyDown(event) {
       if (event.key === 'Enter') {
+        // Radio only activates with Space. Preventing the keydown's default
+        // stops useButton from turning Enter into a click.
         event.preventDefault();
       }
     },
@@ -135,13 +129,7 @@ export const RadioRoot = /*#__PURE__*/React.forwardRef(function RadioRoot(compon
       if (!input) {
         return;
       }
-      input.dispatchEvent(new (ownerWindow(input).PointerEvent)('click', {
-        bubbles: true,
-        shiftKey: event.shiftKey,
-        ctrlKey: event.ctrlKey,
-        altKey: event.altKey,
-        metaKey: event.metaKey
-      }));
+      dispatchClickWithModifiers(input, event);
     },
     onFocus(event) {
       if (event.defaultPrevented || disabled || readOnly || !touched) {
@@ -176,7 +164,7 @@ export const RadioRoot = /*#__PURE__*/React.forwardRef(function RadioRoot(compon
     required,
     readOnly,
     onChange(event) {
-      // Workaround for https://github.com/facebook/react/issues/9023
+      // Workaround for https://github.com/react/react/issues/9023
       if (event.nativeEvent.defaultPrevented) {
         return;
       }
@@ -190,6 +178,11 @@ export const RadioRoot = /*#__PURE__*/React.forwardRef(function RadioRoot(compon
       }
       setFieldTouched(true);
     },
+    onClick(event) {
+      // Clicks dispatched on the input from the root's `onClick` and `onFocus` are an
+      // implementation detail and must not reach ancestors.
+      event.stopPropagation();
+    },
     onFocus() {
       radioRef.current?.focus();
     }
@@ -203,7 +196,7 @@ export const RadioRoot = /*#__PURE__*/React.forwardRef(function RadioRoot(compon
   }), [fieldState, disabled, readOnly, checked, required]);
   const contextValue = state;
   const isRadioGroup = groupContext !== undefined;
-  const refs = [forwardedRef, radioRef, buttonRef, handleControlRef];
+  const refs = [forwardedRef, radioRef, buttonRef];
   const props = [rootProps, elementProps, getButtonProps, getDescriptionProps, validation ? validationProps => validation.getValidationProps(disabled, validationProps) : EMPTY_OBJECT];
   const element = useRenderElement('span', componentProps, {
     enabled: !isRadioGroup,

package/radio/utils/stateAttributesMapping.js

@@ -6,16 +6,15 @@ Object.defineProperty(exports, "__esModule", {
 exports.stateAttributesMapping = void 0;
 var _stateAttributesMapping = require("../../internals/stateAttributesMapping");
 var _constants = require("../../internals/field-constants/constants");
-var _RadioRootDataAttributes = require("../root/RadioRootDataAttributes");
 const stateAttributesMapping = exports.stateAttributesMapping = {
   checked(value) {
     if (value) {
       return {
-        [_RadioRootDataAttributes.RadioRootDataAttributes.checked]: ''
+        'data-checked': ''
       };
     }
     return {
-      [_RadioRootDataAttributes.RadioRootDataAttributes.unchecked]: ''
+      'data-unchecked': ''
     };
   },
   ..._stateAttributesMapping.transitionStatusMapping,

package/radio/utils/stateAttributesMapping.mjs

@@ -1,15 +1,14 @@
 import { transitionStatusMapping } from "../../internals/stateAttributesMapping.mjs";
 import { fieldValidityMapping } from "../../internals/field-constants/constants.mjs";
-import { RadioRootDataAttributes } from "../root/RadioRootDataAttributes.mjs";
 export const stateAttributesMapping = {
   checked(value) {
     if (value) {
       return {
-        [RadioRootDataAttributes.checked]: ''
+        'data-checked': ''
       };
     }
     return {
-      [RadioRootDataAttributes.unchecked]: ''
+      'data-unchecked': ''
     };
   },
   ...transitionStatusMapping,

package/radio-group/RadioGroup.js

@@ -16,6 +16,7 @@ var _CompositeRoot = require("../internals/composite/root/CompositeRoot");
 var _FieldRootContext = require("../internals/field-root-context/FieldRootContext");
 var _useRegisterFieldControl = require("../internals/field-register-control/useRegisterFieldControl");
 var _constants = require("../internals/field-constants/constants");
+var _useFieldValidation = require("../field/root/useFieldValidation");
 var _FieldsetRootContext = require("../fieldset/root/FieldsetRootContext");
 var _FormContext = require("../internals/form-context/FormContext");
 var _LabelableContext = require("../internals/labelable-provider/LabelableContext");
@@ -63,7 +64,8 @@ const RadioGroup = exports.RadioGroup = /*#__PURE__*/React.forwardRef(function R
     labelId
   } = (0, _LabelableContext.useLabelableContext)();
   const {
-    clearErrors
+    clearErrors,
+    elementRef
   } = (0, _FormContext.useFormContext)();
   const fieldsetContext = (0, _FieldsetRootContext.useFieldsetRootContext)(true);
   const disabled = fieldDisabled || disabledProp;
@@ -83,9 +85,19 @@ const RadioGroup = exports.RadioGroup = /*#__PURE__*/React.forwardRef(function R
     }
     setCheckedValueUnwrapped(value);
   });
-  const controlRef = React.useRef(null);
+  const getInputControl = validation.getInputControl;
+  const controlRef = React.useMemo(() => ({
+    get current() {
+      return getInputControl();
+    }
+  }), [getInputControl]);
   const groupInputRef = React.useRef(null);
   const firstEnabledInputRef = React.useRef(null);
+
+  // Only forwards the public `inputRef` and tracks the current representative for that forwarding.
+  // The registry (`validation.registeredInputs`) is authoritative for validation and form-value
+  // projection, so the group must not write `validation.inputRef`: a stale, unmounted radio left
+  // there would become the Field's fallback once the registry empties and keep blocking submission.
   function setInputRef(hiddenInput) {
     let cleanup = undefined;
     if (inputRefProp) {
@@ -96,23 +108,8 @@ const RadioGroup = exports.RadioGroup = /*#__PURE__*/React.forwardRef(function R
       }
     }
     groupInputRef.current = hiddenInput;
-    validation.inputRef.current = hiddenInput;
     return cleanup;
   }
-  const registerControlRef = (0, _useStableCallback.useStableCallback)((element, isDisabled = false) => {
-    if (!element) {
-      return;
-    }
-    if (isDisabled) {
-      if (controlRef.current === element) {
-        controlRef.current = null;
-      }
-      return;
-    }
-    if (controlRef.current == null) {
-      controlRef.current = element;
-    }
-  });
   const registerInputRef = (0, _useStableCallback.useStableCallback)(input => {
     if (!input || input.disabled) {
       return undefined;
@@ -121,19 +118,38 @@ const RadioGroup = exports.RadioGroup = /*#__PURE__*/React.forwardRef(function R
       firstEnabledInputRef.current = input;
     }
     const currentInput = groupInputRef.current;
-    if (input.checked || currentInput == null || currentInput.disabled) {
-      return setInputRef(input);
-    }
-    return undefined;
+    const cleanup = input.checked || currentInput == null || currentInput.disabled ? setInputRef(input) : undefined;
+
+    // Detach when this input unmounts while still forwarded, so consumers don't
+    // keep holding a disconnected node. The input may have become the forwarded
+    // one after attach (via the re-registration effect), so always return this.
+    return () => {
+      if (firstEnabledInputRef.current === input) {
+        firstEnabledInputRef.current = null;
+      }
+      if (groupInputRef.current === input) {
+        if (cleanup) {
+          cleanup();
+          groupInputRef.current = null;
+        } else {
+          void setInputRef(null);
+        }
+      } else {
+        cleanup?.();
+      }
+    };
   });
   const getFormValue = (0, _useStableCallback.useStableCallback)(() => {
-    // Disabled radios are excluded from native form submission, so a disabled
-    // selection shouldn't be reported as the field's value either.
-    const input = groupInputRef.current;
-    if (!input || input.disabled || !input.checked) {
-      return null;
+    const formElement = elementRef.current;
+    if (!formElement) {
+      return checkedValue ?? null;
+    }
+    for (const input of validation.registeredInputs.keys()) {
+      if (input.checked && (0, _useFieldValidation.isEligibleInput)(input, formElement)) {
+        return checkedValue ?? null;
+      }
     }
-    return checkedValue ?? null;
+    return null;
   });
   (0, _useRegisterFieldControl.useRegisterFieldControl)(controlRef, id, checkedValue ?? null, getFormValue, !disabled, nameProp);
   (0, _useValueChanged.useValueChanged)(checkedValue, () => {
@@ -143,10 +159,11 @@ const RadioGroup = exports.RadioGroup = /*#__PURE__*/React.forwardRef(function R
     validation.change(checkedValue);
     const fallbackInput = firstEnabledInputRef.current;
     if (checkedValue == null && fallbackInput && !fallbackInput.disabled) {
-      setInputRef(fallbackInput);
+      // Imperative re-point outside React's ref lifecycle; the ref-callback cleanup isn't tracked here.
+      void setInputRef(fallbackInput);
     }
   });
-  const ariaLabelledby = elementProps['aria-labelledby'] ?? labelId ?? fieldsetContext?.legendId;
+  const ariaLabelledby = labelId ?? fieldsetContext?.legendId;
   const state = {
     ...fieldState,
     disabled: disabled ?? false,
@@ -154,20 +171,18 @@ const RadioGroup = exports.RadioGroup = /*#__PURE__*/React.forwardRef(function R
     readOnly: readOnly ?? false
   };
   const contextValue = React.useMemo(() => ({
-    ...fieldState,
     checkedValue,
     disabled,
     form,
     validation,
     name,
     readOnly,
-    registerControlRef,
     registerInputRef,
     required,
     setCheckedValue,
     setTouched,
     touched
-  }), [checkedValue, disabled, form, validation, fieldState, name, readOnly, registerControlRef, registerInputRef, required, setCheckedValue, setTouched, touched]);
+  }), [checkedValue, disabled, form, validation, name, readOnly, registerInputRef, required, setCheckedValue, setTouched, touched]);
   const defaultProps = {
     id: idProp,
     role: 'radiogroup',

package/radio-group/RadioGroup.mjs

@@ -10,6 +10,7 @@ import { CompositeRoot } from "../internals/composite/root/CompositeRoot.mjs";
 import { useFieldRootContext } from "../internals/field-root-context/FieldRootContext.mjs";
 import { useRegisterFieldControl } from "../internals/field-register-control/useRegisterFieldControl.mjs";
 import { fieldValidityMapping } from "../internals/field-constants/constants.mjs";
+import { isEligibleInput } from "../field/root/useFieldValidation.mjs";
 import { useFieldsetRootContext } from "../fieldset/root/FieldsetRootContext.mjs";
 import { useFormContext } from "../internals/form-context/FormContext.mjs";
 import { useLabelableContext } from "../internals/labelable-provider/LabelableContext.mjs";
@@ -57,7 +58,8 @@ export const RadioGroup = /*#__PURE__*/React.forwardRef(function RadioGroup(comp
     labelId
   } = useLabelableContext();
   const {
-    clearErrors
+    clearErrors,
+    elementRef
   } = useFormContext();
   const fieldsetContext = useFieldsetRootContext(true);
   const disabled = fieldDisabled || disabledProp;
@@ -77,9 +79,19 @@ export const RadioGroup = /*#__PURE__*/React.forwardRef(function RadioGroup(comp
     }
     setCheckedValueUnwrapped(value);
   });
-  const controlRef = React.useRef(null);
+  const getInputControl = validation.getInputControl;
+  const controlRef = React.useMemo(() => ({
+    get current() {
+      return getInputControl();
+    }
+  }), [getInputControl]);
   const groupInputRef = React.useRef(null);
   const firstEnabledInputRef = React.useRef(null);
+
+  // Only forwards the public `inputRef` and tracks the current representative for that forwarding.
+  // The registry (`validation.registeredInputs`) is authoritative for validation and form-value
+  // projection, so the group must not write `validation.inputRef`: a stale, unmounted radio left
+  // there would become the Field's fallback once the registry empties and keep blocking submission.
   function setInputRef(hiddenInput) {
     let cleanup = undefined;
     if (inputRefProp) {
@@ -90,23 +102,8 @@ export const RadioGroup = /*#__PURE__*/React.forwardRef(function RadioGroup(comp
       }
     }
     groupInputRef.current = hiddenInput;
-    validation.inputRef.current = hiddenInput;
     return cleanup;
   }
-  const registerControlRef = useStableCallback((element, isDisabled = false) => {
-    if (!element) {
-      return;
-    }
-    if (isDisabled) {
-      if (controlRef.current === element) {
-        controlRef.current = null;
-      }
-      return;
-    }
-    if (controlRef.current == null) {
-      controlRef.current = element;
-    }
-  });
   const registerInputRef = useStableCallback(input => {
     if (!input || input.disabled) {
       return undefined;
@@ -115,19 +112,38 @@ export const RadioGroup = /*#__PURE__*/React.forwardRef(function RadioGroup(comp
       firstEnabledInputRef.current = input;
     }
     const currentInput = groupInputRef.current;
-    if (input.checked || currentInput == null || currentInput.disabled) {
-      return setInputRef(input);
-    }
-    return undefined;
+    const cleanup = input.checked || currentInput == null || currentInput.disabled ? setInputRef(input) : undefined;
+
+    // Detach when this input unmounts while still forwarded, so consumers don't
+    // keep holding a disconnected node. The input may have become the forwarded
+    // one after attach (via the re-registration effect), so always return this.
+    return () => {
+      if (firstEnabledInputRef.current === input) {
+        firstEnabledInputRef.current = null;
+      }
+      if (groupInputRef.current === input) {
+        if (cleanup) {
+          cleanup();
+          groupInputRef.current = null;
+        } else {
+          void setInputRef(null);
+        }
+      } else {
+        cleanup?.();
+      }
+    };
   });
   const getFormValue = useStableCallback(() => {
-    // Disabled radios are excluded from native form submission, so a disabled
-    // selection shouldn't be reported as the field's value either.
-    const input = groupInputRef.current;
-    if (!input || input.disabled || !input.checked) {
-      return null;
+    const formElement = elementRef.current;
+    if (!formElement) {
+      return checkedValue ?? null;
+    }
+    for (const input of validation.registeredInputs.keys()) {
+      if (input.checked && isEligibleInput(input, formElement)) {
+        return checkedValue ?? null;
+      }
     }
-    return checkedValue ?? null;
+    return null;
   });
   useRegisterFieldControl(controlRef, id, checkedValue ?? null, getFormValue, !disabled, nameProp);
   useValueChanged(checkedValue, () => {
@@ -137,10 +153,11 @@ export const RadioGroup = /*#__PURE__*/React.forwardRef(function RadioGroup(comp
     validation.change(checkedValue);
     const fallbackInput = firstEnabledInputRef.current;
     if (checkedValue == null && fallbackInput && !fallbackInput.disabled) {
-      setInputRef(fallbackInput);
+      // Imperative re-point outside React's ref lifecycle; the ref-callback cleanup isn't tracked here.
+      void setInputRef(fallbackInput);
     }
   });
-  const ariaLabelledby = elementProps['aria-labelledby'] ?? labelId ?? fieldsetContext?.legendId;
+  const ariaLabelledby = labelId ?? fieldsetContext?.legendId;
   const state = {
     ...fieldState,
     disabled: disabled ?? false,
@@ -148,20 +165,18 @@ export const RadioGroup = /*#__PURE__*/React.forwardRef(function RadioGroup(comp
     readOnly: readOnly ?? false
   };
   const contextValue = React.useMemo(() => ({
-    ...fieldState,
     checkedValue,
     disabled,
     form,
     validation,
     name,
     readOnly,
-    registerControlRef,
     registerInputRef,
     required,
     setCheckedValue,
     setTouched,
     touched
-  }), [checkedValue, disabled, form, validation, fieldState, name, readOnly, registerControlRef, registerInputRef, required, setCheckedValue, setTouched, touched]);
+  }), [checkedValue, disabled, form, validation, name, readOnly, registerInputRef, required, setCheckedValue, setTouched, touched]);
   const defaultProps = {
     id: idProp,
     role: 'radiogroup',

package/radio-group/RadioGroupContext.d.mts

@@ -13,7 +13,6 @@ export interface RadioGroupContext<Value> {
   touched: boolean;
   setTouched: React.Dispatch<React.SetStateAction<boolean>>;
   validation?: UseFieldValidationReturnValue | undefined;
-  registerControlRef: (element: HTMLElement | null, disabled?: boolean) => void;
   registerInputRef: (element: HTMLInputElement | null) => void;
 }
 export declare const RadioGroupContext: React.Context<RadioGroupContext<any> | undefined>;

package/radio-group/RadioGroupContext.d.ts

@@ -13,7 +13,6 @@ export interface RadioGroupContext<Value> {
   touched: boolean;
   setTouched: React.Dispatch<React.SetStateAction<boolean>>;
   validation?: UseFieldValidationReturnValue | undefined;
-  registerControlRef: (element: HTMLElement | null, disabled?: boolean) => void;
   registerInputRef: (element: HTMLInputElement | null) => void;
 }
 export declare const RadioGroupContext: React.Context<RadioGroupContext<any> | undefined>;