Forms

Checkbox

A native checkbox under a drawn box. The check draws itself in on the brand fill. Takes a label, a muted description, and an indeterminate state for a select all.

view .md

Installation

terminal

bash

npx @entrepta/cli@latest add checkbox

// Resolves dependencies, copies the source, and installs npm packages automatically.

Usage

checkbox.tsx

tsx

import { Checkbox } from "@/components/entrepta/checkbox"

<Checkbox label="button" defaultChecked />
<Checkbox label="diamond" description="needed by card" checked disabled />
<Checkbox
  label="primitives"
  checked={all}
  indeterminate={some && !all}
  onChange={toggleAll}
/>

Props

Prop	Type	Default	Description
label	ReactNode	-	Clickable label beside the box
description	ReactNode	-	Muted line under the label, read as the description
indeterminate	boolean	false	The mixed state, a dash on the brand fill
checked	boolean	-	Controlled state, like a native input