Add <fieldset disabled> check to radio group options in React (#1835)

* wip

* Update changelog
This commit is contained in:
Jordan Pittman
2022-09-08 10:55:17 -04:00
committed by GitHub
parent 397ba5c8c2
commit 10f932afef
2 changed files with 11 additions and 2 deletions
+1
View File
@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Fixed
- Improve iOS scroll locking ([#1830](https://github.com/tailwindlabs/headlessui/pull/1830))
- Add `<fieldset disabled>` check to radio group options in React ([#1835](https://github.com/tailwindlabs/headlessui/pull/1835))
## [1.7.0] - 2022-09-06
@@ -8,7 +8,9 @@ import React, {
// Types
ContextType,
ElementType,
FocusEvent as ReactFocusEvent,
KeyboardEvent as ReactKeyboardEvent,
MouseEvent as ReactMouseEvent,
MutableRefObject,
Ref,
} from 'react'
@@ -30,6 +32,7 @@ import { attemptSubmit, objectToFormEntries } from '../../utils/form'
import { getOwnerDocument } from '../../utils/owner'
import { useEvent } from '../../hooks/use-event'
import { useControllable } from '../../hooks/use-controllable'
import { isDisabledReactIssue7711 } from '../../utils/bugs'
interface Option<T = unknown> {
id: string
@@ -385,14 +388,19 @@ let Option = forwardRefWithAs(function Option<
[id, registerOption, internalOptionRef, props]
)
let handleClick = useEvent(() => {
let handleClick = useEvent((event: ReactMouseEvent) => {
if (isDisabledReactIssue7711(event.currentTarget)) return event.preventDefault()
if (!change(value)) return
addFlag(OptionState.Active)
internalOptionRef.current?.focus()
})
let handleFocus = useEvent(() => addFlag(OptionState.Active))
let handleFocus = useEvent((event: ReactFocusEvent) => {
if (isDisabledReactIssue7711(event.currentTarget)) return event.preventDefault()
addFlag(OptionState.Active)
})
let handleBlur = useEvent(() => removeFlag(OptionState.Active))
let isFirstOption = firstOption?.id === id