enact logoEnact
Edit on GitHub

sandstone/Checkbox

Sandstone styled checkbox components.

import Checkbox from '@enact/sandstone/Checkbox';

Members

CheckboxComponent

A Sandstone-styled checkbox component.

Checkbox will manage its selected state via Toggleable unless set directly.

import Checkbox from '@enact/sandstone/Checkbox';

CheckboxBaseComponent

A checkbox component, ready to use in Sandstone applications.

Checkbox may be used independently to represent a toggleable state but is more commonly used as part of CheckboxItem.

Usage:

<Checkbox selected />
import {CheckboxBase} from '@enact/sandstone/Checkbox';
Properties
children
StringObject

The icon displayed when selected.

May be specified as either:

  • A string that represents an icon from the iconList,

  • An HTML entity string, Unicode reference or hex value (in the form '0x...'),

  • A URL specifying path to an icon image, or

  • An object representing a resolution independent resource (See ui/resolution)

See: sandstone/Icon.IconBase.children
Default: 'check'
css
Object

Customizes the component by mapping the supplied collection of CSS class names to the corresponding internal elements and states of this component.

The following classes are supported:

  • checkbox - The root class name

  • selected - Applied when the selected prop is true

disabled
Boolean

Disables Checkbox and becomes non-interactive.

Default: false
indeterminate
Boolean

Enables the "indeterminate" state.

An indeterminate, mixed, or half-selected state is typically used in a hierarchy or group to represent that some, not all, children are selected.

NOTE: This does not prevent updating the selected state. Applications must control this property directly.

Default: false
indeterminateIcon
String

The icon to be used in the indeterminate state.

May be specified as either:

  • A string that represents an icon from the iconList,

  • An HTML entity string, Unicode reference or hex value (in the form '0x...'),

  • A URL specifying path to an icon image, or

  • An object representing a resolution independent resource (See ui/resolution)

Default: 'minus'
selected
Boolean

Sets whether this control is in the 'on' or 'off' state. true for 'on', false for 'off'.

Default: false

CheckboxDecoratorHigher-Order Component

Adds interactive functionality to Checkbox.

import {CheckboxDecorator} from '@enact/sandstone/Checkbox';
ArrayBooleanFunctionModuleNumberObjectString