Checkbox

Import/Installation

import { Checkbox, Label } from "@lottiefiles/creator-plugins-ui";

Preview

Usage

import { useState } from "react";

const [checked, setChecked] = useState(true);

<div className="flex items-center gap-2">
  <Checkbox checked={checked} onCheckedChange={setChecked} aria-label="Enable snapping" />
  <Label variant="inline">Enable snapping</Label>
</div>;

Props

Prop	Type	Default	Required	Description
checked	boolean	—	No	The controlled checked state of the checkbox.
defaultChecked	boolean	—	No	The default checked state when uncontrolled.
onCheckedChange	(checked: boolean) => void	—	No	Callback fired when the checked state changes.
disabled	boolean	—	No	Whether the checkbox is disabled.
variant	"default" \| "error"	"default"	No	The visual variant of the checkbox.
size	"xs" \| "sm" \| "default"	"default"	No	The size of the checkbox.
aria-label	string	—	No	Optional aria-label. Required if no visible label is provided.

Built on Base UI Checkbox. See their docs for primitive-level details.