Form

Input Checkbox

A control that allows the user to toggle between checked and not checked.

Overview

InputCheckbox combines a Checkbox control with a Label in one component, so you get a labelled checkbox without wiring them manually. Supports required indicator and fits forms and filter panels.

Key Business & UX Benefits

Single component for labelled checkbox reduces markup and errors.
Required indicator and accessible label association built in.
Matches Field and other form components for consistent layout.
Fits consent checkboxes, filters, and preference toggles.

Pro-Tip from Larry: Use InputCheckbox when you need a labelled checkbox so the label is always associated.

Usage

Combines Checkbox component with Label component.

InputCheckbox

<InputCheckbox label="Label" isRequired />

Feature List

Checkbox with integrated label
Required indicator support
Accessible label-to-control association
Consistent styling with other form controls

API Reference

Prop	Default	Type
`id`		`string`
`checked`		`boolean \| "indeterminate"`
`defaultChecked`	`false`	`boolean`
`disabled`	`false`	`boolean`
`name`		`string`
`value`	`on`	`string`
`required`	`false`	`boolean`
`isRequired`	`false`	`boolean` Whether the label's corresponding input is required or not.
`size`	`small`	`"small" \| "medium"` The label's font size.
`forId`		`string` The id of the element that the label is for.
`label`	`Label`	`string`

Event	Type
`update:checked`	`(event: "update:checked", value: boolean \| "indeterminate" \| undefined): void`

Edit this pageorReport an issue

Input

Styled text input for forms and search with optional icon or button addons and variant support.

Password Input

A password input component