chrome:shell.skip

generated:catalog.entry.checkbox.title

generated:catalog.entry.checkbox.description

@xngui/components/checkbox
@xngui/components/checkbox

chrome:demo.section

chrome:demo.preview

demo-preview:hints.category.navigation:
Tab
demo-preview:hints.category.focus:
Focus
demo-preview:hints.category.shortcuts:
Space
import { Component } from '@angular/core';
import { XCheckbox } from '@xngui/components/checkbox';
import { XForm } from '@xngui/components/form';
 
@Component({
selector: 'app-example',
imports: [XCheckbox, XForm],
templateUrl: './checkbox.component.html',
})
export class ExampleComponent {}

chrome:demo.events.title

chrome:demo.events.empty

chrome:demo.api.title

x-checkbox

chrome:demo.api.col.property
chrome:demo.api.col.type
chrome:demo.api.col.default
chrome:demo.api.col.description
size
XSize
—
Visual size tier — falls back to XConfigService when unset.
density
XDensity
—
Spacing offsets — orthogonal to `size`; falls back to XConfigService when unset.
label
string
''
Visible label text beside the checkbox.
description
string
''
Optional helper text under the label (shadcn FieldDescription pattern).
indeterminate
boolean
false
Mixed checked state — clear when the user toggles the control.
ariaLabel
string
—
Accessible name when no visible `label` is provided.
controlId
string
—
Native `id` on the control; falls back to `name`, then a generated id.
disabled
boolean
false
Kept in sync by `[formField]`; set directly for standalone use.
readonly
boolean
false
Value-only input — user cannot change when true.
invalid
boolean
false
Marks the control invalid for styling and ARIA.
required
boolean
false
Marks the control as required for validation and ARIA.
name
string
''
Native form control `name` attribute.