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 Usage

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

Members

ToggleIcon   Component

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

Import Usage

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

Extends: ui/ToggleIconui/ToggleIcon.ToggleIconBase
Wrapped with: ui/ToggleIconui/ToggleIcon.ToggleIconDecorator

Properties

onToggle

Function

The handler to run when the component is toggled.

ToggleIconBase   Component

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

Import Usage

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

Properties

children

StringObject

The icon to use for this component.

See: ui/Iconui/Icon.IconBase.children

---

componentRef

ObjectFunction

Called with a reference to the root component.

When using ui/ToggleIconui/ToggleIcon.ToggleIcon, the ref prop is forwarded to this component as componentRef.

---

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

ToggleIconDecorator   Component

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

Import Usage

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

Wrapped with: ui/ForwardRefui/ForwardRef.ForwardRef
Wrapped with: ui/Toggleableui/Toggleable.Toggleable
Wrapped with: ui/Touchableui/Touchable.Touchable