Pikas UI

@pikas-ui/checkbox

This package contains a checkbox component.

This library is based on Radix Ui.

Change Log

To use this package, you must install the @pikas-ui/styles package.

You can install this package using npm, yarn, or pnpm.

npm install @pikas-ui/checkbox

yarn add @pikas-ui/checkbox

pnpm add @pikas-ui/checkbox

This component is a checkbox.

Checked

import { Checkbox } from '@pikas-ui/checkbox';

const Example: React.FC = () => <Checkbox />;

Prop	Description	Type	Default
`defaultChecked`	The default checked of the checkbox.	`CheckboxValue`	`false`
`onChange`	The callback when the checkbox is changed.	`(checked: CheckboxValue') => void`	-
`onChangeEvent`	The callback when the checkbox is changed.	`(event: ChangeEvent<HTMLInputElement>) => void`	-
`id`	The id of the checkbox.	`string`	-
`label`	The label of the checkbox.	`string` or `ReactNode`	-
`backgroundColorName`	The background color of the checkbox.	`PikasColors`	`"white-fixed"`
`backgroundColorNameChecked`	The background color of the checkbox when checked.	`PikasColors`	`"primary"`
`textError`	The error text of the checkbox.	`string`	-
`boxShadow`	The box shadow of the checkbox.	`PikasShadow` or `"none"`	`"inner-md"`
`borderColorName`	The border color of the checkbox.	`PikasColors`	-
`borderWidth`	The border width of the checkbox.	`number`	`0`
`borderRadius`	The border radius of the checkbox.	`PikasRadius`	`"md"`
`fontSize`	The font size of the checkbox.	`PikasFontSize`	`"em-base"`
`size`	The size of the checkbox.	`number`	`24`
`checked`	The checked of the checkbox.	`CheckboxValue`	-
`className`	The class name of the checkbox.	`string`	-
`disabled`	The disabled of the checkbox.	`boolean`	`false`
`required`	The required of the checkbox.	`boolean`	`false`
`name`	The name of the checkbox.	`string`	-
`side`	The side of the checkbox.	`"left"` or `"right"`	`"right"`
`outline`	The outline of the checkbox.	`boolean`	`true`
`css`	The css of the checkbox.	`CheckboxCSS`	-

This documentation can be edited on GitHub here