Forms

Checkbox

A checkbox built on the native input.

Server safeSource

Import

import { Checkbox } from '@the_viveksingh/vivek-ui'

With a description

The description is linked with aria-describedby, so it is read after the label rather than being decoration.

Email me about releasesRoughly once a month. Unsubscribe from any email.Share anonymous usage dataHelps decide which components to build next.

<Checkbox
  label="Email me about releases"
  description="Roughly once a month. Unsubscribe from any email."
  defaultChecked
/>

States

<Checkbox label="Unchecked" />
<Checkbox label="Checked" defaultChecked />
<Checkbox label="Disabled" disabled />
<Checkbox label="Invalid" invalid />

Props

Generated from the package's own type declarations, so this table cannot drift from the code.

Props for Checkbox
Prop	Type	Default	Description
`label`	`ReactNode`	—	Visible label. Omit it and supply `aria-label` instead.
`description`	`ReactNode`	—	Secondary line under the label.
`size`	`'sm' \| 'md'`	—	—
`invalid`	`boolean`	—	—

Every remaining prop is spread onto the root element, so all standard HTML and ARIA attributes work. className and style are merged with the library's own, never replaced, and the ref forwards to the root DOM node.

Rendering

Server safe

Checkbox carries no 'use client' directive and renders directly in a React Server Component. No client JavaScript is shipped for it.