Components · Form

Checkbox

A checkbox with native indeterminate support wired through a ref effect, an invalid state that pairs a red border with aria-invalid rather than colour alone, and a check/dash glyph that switches on state.

Live in all three modes

Day · Night-NVG · Mono: one component, re-themed through the token layer.

Day
Night-NVG
Mono

Variants & states

  • checked
  • indeterminate
  • invalid
  • disabled

Tokens used

  • --semantic-color-surface-input
  • --semantic-color-border-default
  • --semantic-color-status-critical
  • --semantic-color-action-primary

Copy-paste

import { Checkbox } from 'operator-components';

<Checkbox label="Confirm target acquisition" indeterminate={partial} invalid={!hasConsent} />

Figma: library link coming soon. Gated until it's on sole-owned footing. (TODO: replace with the Community/library URL once published.)