ui/ToggleIcon

An unstyled icon component that handles interaction and toggles state between activated and deactivated.

Visually, it may be to be customized by a theme or application to represent any state.

import ToggleIcon from '@enact/ui/ToggleIcon';

Members

ToggleIconComponent

Represents a Boolean state, and can accept any icon to toggle.

import ToggleIcon from '@enact/ui/ToggleIcon';
Properties
onToggle
Function

The handler to run when the component is toggled.

ToggleIconBaseComponent

Represents a Boolean state, and can accept any icon to toggle.

import {ToggleIconBase} from '@enact/ui/ToggleIcon';
Properties
children
StringObject

The icon to use for this component.

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:

  • toggleIcon - The root class name

  • icon - The background node of the button

  • selected - Applied to a selected button

disabled
Boolean

Disables ToggleIcon.

Default: false
iconClasses
String

CSS classes to be used on the Icon component

iconComponent
StringComponent

The component used to render the icon.

Default: 'div'
selected
Boolean

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

Default: false

ToggleIconDecoratorComponent

Adds support for the onToggle prop callback to be fired when the onTap (touch-safe onClick) event executes.

import {ToggleIconDecorator} from '@enact/ui/ToggleIcon';
ArrayBooleanFunctionModuleNumberObjectString