MultinaireCheckbox

Checkbox control with label for boolean selections.

Basic Usage

import { MultinaireCheckbox } from '@multinaire/multinaire-design';

<MultinaireCheckbox
  title="I agree to the terms"
  value={agreed}
  onChange={setAgreed}
/>

Props

Prop	Type	Default	Description
title	string	-	Checkbox label text
value	boolean	-	Checked state
onChange	(value: boolean) => void	-	Change handler
flex	number	-	Flex value
margin	SpacingProps	-	Margin spacing

Examples

Basic Checkbox

const [isChecked, setIsChecked] = useState(false);

<MultinaireCheckbox
  title="Enable notifications"
  value={isChecked}
  onChange={setIsChecked}
/>

Terms Agreement

<MultinaireCheckbox
  title="I agree to the Terms of Service and Privacy Policy"
  value={agreed}
  onChange={setAgreed}
/>

Multiple Options

<MultinaireContainer gap={8}>
  <MultinaireCheckbox
    title="Email notifications"
    value={emailNotifications}
    onChange={setEmailNotifications}
  />
  <MultinaireCheckbox
    title="Push notifications"
    value={pushNotifications}
    onChange={setPushNotifications}
  />
  <MultinaireCheckbox
    title="SMS notifications"
    value={smsNotifications}
    onChange={setSmsNotifications}
  />
</MultinaireContainer>

With Margin

<MultinaireCheckbox
  title="Remember me"
  value={rememberMe}
  onChange={setRememberMe}
  margin={{ top: 16 }}
/>