enact logoEnact
Edit on GitHub

moonstone/LabeledIcon

An Icon ecorated with a label.

You may specify an image or a font-based icon by setting the icon to either the path to the image or a string from an iconList.

import LabeledIcon from '@enact/moonstone/LabeledIcon';

Members

LabeledIconComponent

A Moonstone-styled icon component with a label.

Usage:

<LabeledIcon icon="star" labelPosition="after">
  Favorite
</LabeledIcon>
import LabeledIcon from '@enact/moonstone/LabeledIcon';

LabeledIconBaseComponent

A basic LabeledIcon component structure without any behaviors applied to it.

import {LabeledIconBase} from '@enact/moonstone/LabeledIcon';
Properties
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:

  • labeledIcon - The root component class

  • label - The label component class

  • icon - The icon component class

LabeledIconDecoratorHigher-Order Component

Adds Moonstone specific behaviors to LabeledIconBase.

import {LabeledIconDecorator} from '@enact/moonstone/LabeledIcon';
ArrayBooleanFunctionModuleNumberObjectString