Checkbox

Usage

import { Checkbox } from '@jamie/ui/checkbox'
 
export function CheckboxDemo() {
  return <Checkbox defaultChecked />
}

With Label

Pair checkboxes with labels for accessible form controls. Use disabled to prevent interaction.

Send meeting recap to participantsInclude action items in recapAuto-record all meetings (admin only)

import { Checkbox } from '@jamie/ui/checkbox'
import { Label } from '@jamie/ui/label'
 
export function CheckboxWithLabelDemo() {
  return (
    <div className="flex flex-col gap-3">
      <Label className="flex items-center gap-2 text-sm">
        <Checkbox defaultChecked />
        Send meeting recap to participants
      </Label>
      <Label className="flex items-center gap-2 text-sm">
        <Checkbox />
        Include action items in recap
      </Label>
      <Label className="flex items-center gap-2 text-sm text-muted-foreground">
        <Checkbox disabled />
        Auto-record all meetings (admin only)
      </Label>
    </div>
  )
}