UNPKG

@yamada-ui/toggle

Version:

Yamada UI toggle component

73 lines (69 loc) 2.36 kB
import { HTMLUIProps, ThemeProps, CSSUIProps, ComponentArgs } from '@yamada-ui/core'; import { RefAttributes, ReactElement } from 'react'; interface ToggleGroupContext extends ThemeProps<"Button"> { controlled: boolean; disabled?: boolean; readOnly?: boolean; value?: (number | string)[] | number | string; onChange?: <M extends number | string = string>(value: M | undefined) => void; } declare const useToggleGroup: () => ToggleGroupContext | undefined; interface ToggleGroupOptions<Y extends (number | string)[] | number | string = string> { /** * The initial value of the toggle button group. */ defaultValue?: Y extends any[] ? Y : undefined | Y; /** * The CSS `flex-direction` property. * * @deprecated Use `flexDirection` instead. */ direction?: CSSUIProps["flexDirection"]; /** * If `true`, all wrapped toggle button will be disabled. * * @default false */ disabled?: boolean; /** * If `true`, all wrapped toggle button will be disabled. * * @default false * * @deprecated Use `disabled` instead. */ isDisabled?: boolean; /** * If `true`, all wrapped toggle button will be readonly. * * @default false * * @deprecated Use `readOnly` instead. */ isReadOnly?: boolean; /** * If `true`, all wrapped toggle button will be readonly. * * @default false */ readOnly?: boolean; /** * The value of the toggle button group. */ value?: Y extends any[] ? Y : undefined | Y; /** * The callback fired when any children toggle button is selected or unselected. */ onChange?: (value: Y extends any[] ? Y : undefined | Y) => void; } /** * `ToggleGroup` is a set of two-state buttons that can be toggled on or off. * * @see Docs https://yamada-ui.com/components/forms/toggle */ interface ToggleGroupProps<Y extends (number | string)[] | number | string = string> extends Omit<HTMLUIProps, "defaultValue" | "direction" | "onChange">, ThemeProps<"Toggle">, ToggleGroupOptions<Y> { } declare const ToggleGroup: { <Y extends (number | string)[] | number | string = string>(props: RefAttributes<HTMLDivElement> & ToggleGroupProps<Y>): ReactElement; } & ComponentArgs; export { ToggleGroup, type ToggleGroupProps, useToggleGroup };