@yamada-ui/react
Version:
React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion
66 lines (65 loc) • 2.06 kB
TypeScript
import { HTMLProps, HTMLRefAttributes, PropGetter } from "../../core/components/index.types.js";
import "../../core/index.js";
import { FieldProps } from "../field/field.js";
import { ChangeEventHandler, FocusEventHandler } from "react";
//#region src/components/switch/use-switch.d.ts
interface UseSwitchProps<Y extends number | string = string> extends Omit<HTMLProps<"label">, "onBlur" | "onChange" | "onFocus" | "ref">, HTMLRefAttributes<"input">, FieldProps {
/**
* id assigned to input.
*/
id?: string;
/**
* The HTML `name` attribute used for forms.
*/
name?: string;
/**
* If `true`, the switch will be checked.
*
* @default false
*/
checked?: boolean;
/**
* If `true`, the switch will be checked when the Enter key is pressed.
*
* @default true
*/
checkOnEnter?: boolean;
/**
* If `true`, the switch will be initially checked.
*
* @default false
*/
defaultChecked?: boolean;
/**
* The tab-index property of the underlying input element.
*/
tabIndex?: number;
/**
* The value to be used in the switch input.
*/
value?: Y;
/**
* The callback invoked when the switch is blurred.
*/
onBlur?: FocusEventHandler<HTMLInputElement>;
/**
* The callback invoked when the checked state changes.
*/
onChange?: ChangeEventHandler<HTMLInputElement>;
/**
* The callback invoked when the switch is focused.
*/
onFocus?: FocusEventHandler<HTMLInputElement>;
}
declare const useSwitch: <Y extends number | string = string>(props?: UseSwitchProps<Y>) => {
checked: boolean | undefined;
getInputProps: PropGetter<"input", undefined, undefined>;
getLabelProps: PropGetter<"span", undefined, undefined>;
getRootProps: PropGetter<"label", undefined, undefined>;
getThumbProps: PropGetter<"div", undefined, undefined>;
getTrackProps: PropGetter<"div", undefined, undefined>;
};
type UseSwitchReturn = ReturnType<typeof useSwitch>;
//#endregion
export { UseSwitchProps, UseSwitchReturn, useSwitch };
//# sourceMappingURL=use-switch.d.ts.map