ColidyUI

Installation

npx @colidy/ui i checkbox

API Reference

Prop	Type	Default
indeterminate	boolean	false
checked	boolean	false
onCheckedChange	function	null
label	string	null
size	smmdlg	md
colors	slategrayzincneutralstoneredorangeamberyellowlimegreenemeraldtealcyanskyblueindigovioletpurplefuchsiapinkrose	default

Examples

Basic

A basic checkbox.

example.tsx

import { Button } from "@/colidy-ui/Button";

export default function Basic() {
    return (
        <CheckBox
			label="I agree to the terms and conditions"
		/>
    );
}

With description

A checkbox with a description.

example.tsx

import { Button } from "@/colidy-ui/Button";

export default function WithDescription() {
    return (
        <CheckBox
			label="I agree to the terms and conditions"
			description="By checking this box, you agree to the terms and conditions."
		/>
    );
}

Colors

A checkbox with a color.

example.tsx

import { Button } from "@/colidy-ui/Button";

export default function Colors() {
    return (
        colors.map(color => (
			<CheckBox
				key={color}
				label={color}
				color={color}
			/>
		))
    );
}

Sizes

A checkbox with a size.

example.tsx

import { Button } from "@/colidy-ui/Button";

export default function Sizes() {
    return (
        <CheckBox
			label="I agree to the terms and conditions"
			size="lg"
		/>
    );
}