diff --git a/packages/@headlessui-react/CHANGELOG.md b/packages/@headlessui-react/CHANGELOG.md
index 85089813b..08ddd19d3 100644
--- a/packages/@headlessui-react/CHANGELOG.md
+++ b/packages/@headlessui-react/CHANGELOG.md
@@ -7,16 +7,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
## [Unreleased]
+### Added
+
+- Accept `tabIndex` on the `Checkbox` component ([#3645](https://github.com/tailwindlabs/headlessui/pull/3645))
+- Accept `tabIndex` on the `RadioGroup` component ([#3646](https://github.com/tailwindlabs/headlessui/pull/3646))
+
### Fixed
-- Use correct `ownerDocument` when using internal `` element ([#3594](https://github.com/tailwindlabs/headlessui/pull/3594))
+- Use correct `ownerDocument` when using internal `Portal` component ([#3594](https://github.com/tailwindlabs/headlessui/pull/3594))
- Bump `@tanstack/react-virtual` to be fix warnings in React 19 projects ([#3588](https://github.com/tailwindlabs/headlessui/pull/3588))
- Fix `aria-invalid` attributes to have a valid `'true'` value ([#3639](https://github.com/tailwindlabs/headlessui/pull/3639))
-### Added
-
-- Accept `tabIndex` on `Checkbox` component ([#3645](https://github.com/tailwindlabs/headlessui/pull/3645))
-
## [2.2.0] - 2024-10-25
### Added
diff --git a/packages/@headlessui-react/src/components/radio-group/radio-group.tsx b/packages/@headlessui-react/src/components/radio-group/radio-group.tsx
index a43d33425..ab3a8a72a 100644
--- a/packages/@headlessui-react/src/components/radio-group/radio-group.tsx
+++ b/packages/@headlessui-react/src/components/radio-group/radio-group.tsx
@@ -100,6 +100,7 @@ let RadioGroupDataContext = createContext<
containsCheckedOption: boolean
disabled: boolean
compare(a: unknown, z: unknown): boolean
+ tabIndex: number
} & StateDefinition)
| null
>(null)
@@ -178,6 +179,7 @@ function RadioGroupFn(
- () => ({ value, firstOption, containsCheckedOption, disabled, compare, ...state }),
- [value, firstOption, containsCheckedOption, disabled, compare, state]
+ () => ({ value, firstOption, containsCheckedOption, disabled, compare, tabIndex, ...state }),
+ [value, firstOption, containsCheckedOption, disabled, compare, tabIndex, state]
)
let radioGroupActions = useMemo<_Actions>(
() => ({ registerOption, change: triggerChange }),
@@ -424,8 +426,8 @@ function OptionFn<
'aria-disabled': disabled ? true : undefined,
tabIndex: (() => {
if (disabled) return -1
- if (checked) return 0
- if (!data.containsCheckedOption && isFirstOption) return 0
+ if (checked) return data.tabIndex
+ if (!data.containsCheckedOption && isFirstOption) return data.tabIndex
return -1
})(),
onClick: disabled ? undefined : handleClick,
@@ -547,8 +549,8 @@ function RadioFn<
'aria-disabled': disabled ? true : undefined,
tabIndex: (() => {
if (disabled) return -1
- if (checked) return 0
- if (!data.containsCheckedOption && isFirstOption) return 0
+ if (checked) return data.tabIndex
+ if (!data.containsCheckedOption && isFirstOption) return data.tabIndex
return -1
})(),
autoFocus,