Checkbox

Checkbox, a React Native component for iOS, Android and web: A checkbox with indeterminate and error states.

Usage

import { useState } from 'react';
import { Checkbox } from './components/ui/checkbox';
import { Stack } from './components/ui/stack';

export default function Example() {
  const [agreed, setAgreed] = useState(false);
  return (
    <Stack gap={3} style={{ maxWidth: 360 }}>
      <Checkbox label="Leave at the door" checked={agreed} onCheckedChange={setAgreed} />
      <Checkbox label="Some items selected" indeterminate />
      <Checkbox label="Accept the terms" description="Needed to place the order" error="Tick this to place the order" />
    </Stack>
  );
}

Props

PropTypeDefaultDescription
checkedboolean
defaultCheckedbooleanfalse
onCheckedChange(checked: boolean) => void
indeterminatebooleanfalseShown as a dash and announced as mixed. Pressing it reports `true`.
labelstringVisible label. Without one, pass `aria-label`.
descriptionstring
errorstringError message shown below and included in the announcement.
styleStyleProp<ViewStyle>
nativebooleanRenders the real platform control when `@leoanimesh/ferrule-native` is available.