limestone/ActionGuide

Limestone styled action guide component and behaviors.

Loading Live Preview

Import Usage

import ActionGuide from '@enact/limestone/ActionGuide';

Members

ActionGuide   Component

An Action Guide component, ready to use in Limestone applications.

ActionGuide may be used to display text and icon to describe an action.

Usage:

<ActionGuide icon="arrowlargedown">Hello</ActionGuide>

Import Usage

import ActionGuide from '@enact/limestone/ActionGuide';

Extends: limestone/ActionGuidelimestone/ActionGuide.ActionGuideBase
Wrapped with: limestone/ActionGuidelimestone/ActionGuide.ActionGuideDecorator

ActionGuideBase   Component

An Action Guide component.

This component is most often not used directly but may be composed within another component as it is within limestone/ActionGuidelimestone/ActionGuide.ActionGuide.

Import Usage

import {ActionGuideBase} from '@enact/limestone/ActionGuide';

Properties

buttonAriaLabel

String

The "aria-label" for the button.

---

children

String

The contents for the action guide.

---

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:

• actionGuide - The root component class

---

disabled

Boolean

Disables the button.

---

icon

String

The icon displayed within the action guide.

Default: 'arrowsmalldown'

---

onClick

Function

Called when Button is clicked.

ActionGuideDecorator   Higher-Order Component

Applies Limestone specific behaviors to limestone/ActionGuidelimestone/ActionGuide.ActionGuideBase.

Import Usage

import {ActionGuideDecorator} from '@enact/limestone/ActionGuide';

Includes: limestone/Skinnablelimestone/Skinnable.Skinnable