UNPKG

jobiqo-cl

Version:

[![CircleCI](https://circleci.com/gh/jobiqo/jobiqo-cl.svg?style=svg&circle-token=5a24efa5b8bbc4879276123e77d0d3f35ca7144c)](https://circleci.com/gh/jobiqo/jobiqo-cl)

58 lines (57 loc) 1.4 kB
/** * @file index.tsx * * @fileoverview Renders a toggle switch button. */ import { ChangeEventHandler } from 'react'; export interface ToggleSwitchProps { /** * The id for the switch. Will be used in assistive technologies * to match label and input. */ id?: string; /** * The text to display next to the switch. */ label: string; /** * If the switch is on or off. */ checked?: boolean; /** * If the switch is disabled. */ disabled?: boolean; /** * On value text. */ textOn?: string; /** * Off value text. */ textOff?: string; /** * Width of the toggle. */ width?: number; /** * Height of the toggle. */ height?: number; /** * OnChange event handle for when switch changes value. */ onChange?: ChangeEventHandler<HTMLInputElement>; /** * The style for the switch. * * @default "primary" */ switchStyle?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning'; } /** * A toggle switch is a style of checkbox that turns an on / off value. * Can be used inside forms but also in other settings style pages. */ export declare const ToggleSwitch: ({ id, label, onChange, textOn, textOff, width, height, checked, switchStyle, disabled }: ToggleSwitchProps) => JSX.Element; export default ToggleSwitch;