diff --git a/.changeset/tall-candles-deny.md b/.changeset/tall-candles-deny.md new file mode 100644 index 00000000000..f97e29542f2 --- /dev/null +++ b/.changeset/tall-candles-deny.md @@ -0,0 +1,5 @@ +--- +"@chakra-ui/radio": patch +--- + +Add type for state returned by use-radio hook diff --git a/packages/radio/src/use-radio.ts b/packages/radio/src/use-radio.ts index 16b572bcb83..c43fe4094fe 100644 --- a/packages/radio/src/use-radio.ts +++ b/packages/radio/src/use-radio.ts @@ -76,6 +76,17 @@ export interface UseRadioProps { "aria-describedby"?: string } +export interface RadioState { + isInvalid: boolean | undefined + isFocused: boolean + isChecked: boolean + isActive: boolean + isHovered: boolean + isDisabled: boolean | undefined + isReadOnly: boolean | undefined + isRequired: boolean | undefined +} + export function useRadio(props: UseRadioProps = {}) { const { defaultIsChecked, @@ -163,7 +174,7 @@ export function useRadio(props: UseRadioProps = {}) { [setActive], ) - const getCheckboxProps: PropGetter = useCallback( + const getRadioProps: PropGetter = useCallback( (props = {}, ref = null) => ({ ...props, ref, @@ -263,18 +274,21 @@ export function useRadio(props: UseRadioProps = {}) { "data-invalid": dataAttr(isInvalid), }) + const state: RadioState = { + isInvalid, + isFocused, + isChecked, + isActive, + isHovered, + isDisabled, + isReadOnly, + isRequired, + } + return { - state: { - isInvalid, - isFocused, - isChecked, - isActive, - isHovered, - isDisabled, - isReadOnly, - isRequired, - }, - getCheckboxProps, + state, + // the function is renamed to getRadioProps to make the code more consistent. It is renamed towards outside because otherwise this would produce a breaking change + getCheckboxProps: getRadioProps, getInputProps, getLabelProps, getRootProps, @@ -283,7 +297,7 @@ export function useRadio(props: UseRadioProps = {}) { } /** - * Prevent `onBlur` being fired when the checkbox label is touched + * Prevent `onBlur` being fired when the radio label is touched */ function stop(event: SyntheticEvent) { event.preventDefault()