Switch

This is helper text

Size

Required

ReadOnly

Disabled

Error

Overrides helper text

Clearable

Label

Placeholder

Helper Text

import React from "react"
import { Switch } from "@creation-ui/react"

export const Example = () => (
  <Switch
    size={"md"}
    error={""}
    clearable
    label={"Switch"}
    placeholder={"Placeholder"}
    helperText={"This is helper text"}
  />
)

Controlled example

import { Switch, SwitchProps } from '@creation-ui/react'
 
export const SwitchComponet = ({ ...props }: Omit<SwitchProps, 'onChange'>) => {
  const [checked, setChecked] = useState<boolean>(false)
 
  return <Switch onChange={setChecked} checked={checked} {...props} />
}

Component API

Switch component props.

Prop	Default	Description
`size`	`md`	`sm \| md \| lg` Size of the element
`required`	—	`boolean` Is element required?
`readOnly`	—	`boolean` Is element read-only?
`checked`	—	`boolean` `checked` state
`defaultChecked`	—	`boolean` Switch is defaultChecked?
`label`	—	`string` Input label
`disabled`	—	`boolean` Is disabled?
`onChange`	—	`(value: boolean) => void` Callback function

renderSelection Textarea