@yamada-ui/radio/dist/use-radio.d.mts

Yamada UI radio component

import * as _yamada_ui_form_control from '@yamada-ui/form-control';
import { FormControlOptions } from '@yamada-ui/form-control';
import * as react from 'react';
import { ChangeEventHandler } from 'react';
import { PropGetter } from '@yamada-ui/core';
import { Dict } from '@yamada-ui/utils';

interface UseRadioProps<Y extends number | string = string> extends FormControlOptions {
    /**
     * id assigned to input.
     */
    id?: string;
    /**
     * The name of the input field in a radio.
     */
    name?: string;
    /**
     * If `true`, the radio will be checked.
     *
     * @default false
     */
    checked?: boolean;
    /**
     * If `true`, the radio will be initially checked.
     *
     * @default false
     */
    defaultChecked?: boolean;
    /**
     * If `true`, the radio will be initially checked.
     *
     * @default false
     *
     * @deprecated Use `defaultChecked` instead.
     */
    defaultIsChecked?: boolean;
    /**
     * If `true`, the radio will be checked.
     *
     * @default false
     *
     * @deprecated Use `checked` instead.
     */
    isChecked?: boolean;
    /**
     * The value to be used in the radio button.
     */
    value?: Y;
    /**
     * The callback invoked when the checked state changes.
     */
    onChange?: ChangeEventHandler<HTMLInputElement>;
}
declare const useRadio: <Y extends number | string = string, M extends Dict = Dict>({ id, ...props }: M & UseRadioProps<Y>) => {
    active: boolean;
    checked: boolean;
    focused: boolean;
    focusVisible: boolean;
    hovered: boolean;
    /**
     * @deprecated Use `active` instead.
     */
    isActive: boolean;
    /**
     * @deprecated Use `checked` instead.
     */
    isChecked: boolean;
    /**
     * @deprecated Use `focused` instead.
     */
    isFocused: boolean;
    /**
     * @deprecated Use `focusVisible` instead.
     */
    isFocusVisible: boolean;
    /**
     * @deprecated Use `hovered` instead.
     */
    isHovered: boolean;
    props: Omit<Omit<{
        _active?: {} | undefined;
        _focus?: {} | undefined;
        _focusVisible?: {} | undefined;
        _hover?: {} | undefined;
        _invalid?: {} | undefined;
        id: string | undefined;
        "aria-disabled": boolean | undefined;
        "aria-invalid": boolean | undefined;
        "aria-readonly": boolean | undefined;
        "aria-required": boolean | undefined;
        "data-readonly": boolean | "false" | "true";
        disabled: boolean | undefined;
        readOnly: boolean | undefined;
        required: boolean | undefined;
        onBlur: (event: react.FocusEvent<HTMLElement, Element>) => void;
        onFocus: (event: react.FocusEvent<HTMLElement, Element>) => void;
    } & Omit<{
        id: string;
    } & Omit<M & UseRadioProps<Y>, "id"> & _yamada_ui_form_control.UseFormControlProps<HTMLElement>, "disabled" | "isDisabled" | "id" | "onFocus" | "onBlur" | "readOnly" | "required" | "invalid" | "isInvalid" | "isReadOnly" | "isRequired">, "value" | "name" | "defaultChecked" | "id" | "onChange" | "checked" | "defaultIsChecked" | "isChecked">, "disabled" | "aria-disabled" | "_active" | "_focus" | "_focusVisible" | "_hover" | "_invalid" | "aria-invalid" | "aria-readonly" | "aria-required" | "onFocus" | "onBlur" | "readOnly" | "required" | "data-readonly">;
    getContainerProps: PropGetter<"label", undefined>;
    getIconProps: PropGetter<"div", undefined>;
    getInputProps: PropGetter<"input", undefined>;
    getLabelProps: PropGetter<"span", undefined>;
};
type UseRadioReturn = ReturnType<typeof useRadio>;

export { type UseRadioProps, type UseRadioReturn, useRadio };