BwCheckbox | bw-checkbox

Overview

The checkbox component is a form control that represent the absence or presence of a condition.

Usage

Variants

Basic

Large

Required

Indeterminate

Starting label

Ending Label

<bw-checkbox>Basic</bw-checkbox>
<bw-checkbox large>Large</bw-checkbox>
<bw-checkbox required>Required</bw-checkbox>
<bw-checkbox indeterminate>Indeterminate</bw-checkbox>
<bw-checkbox label-placement="start">Starting label</bw-checkbox>
<bw-checkbox label-placement="end">Ending Label</bw-checkbox>

Properties

Property	Attribute	Description	Type	Default
`disabled`	`disabled`	Shows the disabled state and prevents changes	`boolean`	`false`
`error`	`error`	Shows an error icon. If a string is passed in, it will render the icon as a tooltip. Has no effect on form validation	`any`	`undefined`
`indeterminate`	`indeterminate`	If the checkbox should contain a 3rd indeterminate state	`boolean`	`false`
`labelPlacement`	`label-placement`	Whether or not the label should go before or after the checkbox	`"end" \| "start"`	`'end'`
`large`	`large`	Makes checkbox bigger	`boolean`	`false`
`note`	`note`	Informative text that shows below the control	`string`	`undefined`
`originalValue`	`original-value`	The value the control will reset to. Defaults to the initial value if not set.	`boolean`	`undefined`
`pending`	`pending`	Shows a loading indicator	`boolean`	`false`
`required`	`required`	Is the checkbox required	`boolean`	`false`
`success`	`success`	Shows a success icon. Has no effect on form validation	`boolean`	`false`
`value`	`value`	Whether or not the checkbox is active	`boolean`	`undefined`

Events

Event	Description	Type
`valueChange`	Emits the current value whenever it's state changes	`CustomEvent<boolean>`

Methods

`checkValidity() => Promise<boolean>`

Checks the validity of the checkbox

Returns

Type: Promise<boolean>

true if the checkbox is valid, false otherwise

`getCustomError() => Promise<string>`

Gets the custom validity of the checkbox

Returns

Type: Promise<string>

The custom validity of the checkbox

`reportValidity() => Promise<boolean>`

Reports the validity of the checkbox

Returns

Type: Promise<boolean>

true if the checkbox is valid, false otherwise

`setCustomValidity(message: string | null) => Promise<void>`

Sets the custom validity of the checkbox

Parameters

Name	Type	Description
`message`	`string`	- The message to set the custom validity to

Returns

Type: Promise<void>

Slots

Slot	Description
	The content of the checkbox
`"note"`	The note of the checkbox

Shadow Parts

Part	Description
`"label"`	The label of the checkbox
`"main"`	The main container of the checkbox

BwCheckbox | bw-checkbox

Overview

Usage

Variants

Properties

Events

Methods

`checkValidity() => Promise<boolean>`

Returns

`getCustomError() => Promise<string>`

Returns

`reportValidity() => Promise<boolean>`

Returns

`setCustomValidity(message: string | null) => Promise<void>`

Parameters

Returns

Slots

Shadow Parts

Dependencies

Used by

Depends on

Graph

Overview​

Usage​

Variants​

Properties​

Events​

Methods​

checkValidity() => Promise<boolean>​

Returns​

getCustomError() => Promise<string>​

Returns​

reportValidity() => Promise<boolean>​

Returns​

setCustomValidity(message: string | null) => Promise<void>​

Parameters​

Returns​

Slots​

Shadow Parts​

Dependencies​

Used by​

Depends on​

Graph​

Overview

Usage

Variants

Properties

Events

Methods

`checkValidity() => Promise<boolean>`

Returns

`getCustomError() => Promise<string>`

Returns

`reportValidity() => Promise<boolean>`

Returns

`setCustomValidity(message: string | null) => Promise<void>`

Parameters

Returns

Slots

Shadow Parts

Dependencies

Used by

Depends on

Graph