ui/ImageItem

Unstyled image item components and behaviors to be customized by a theme or application.

Import Usage

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

Members

ImageItem   Component

A minimally styled ImageItem ready for customization by a theme.

Import Usage

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

Extends: ui/ImageItemui/ImageItem.ImageItemBase
Wrapped with: ui/ImageItemui/ImageItem.ImageItemDecorator

ImageItemBase   Component

A basic image item without any behavior.

Import Usage

import {ImageItemBase} from '@enact/ui/ImageItem';

Properties

children

Node

The caption displayed with the image.

---

componentRef

ObjectFunction

Called with a reference to the root component.

When using ui/ImageItemui/ImageItem.ImageItem, 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:

• imageItem - The root component class

• caption - The caption component class

• horizontal - Applied when `orientation="horizontal"

• image - The image component class

• selected - Applied when selected prop is true

• vertical - Applied when `orientation="vertical"

---

imageComponent

ComponentElement

The component used to render the image component.

---

orientation

'horizontal''vertical'

The layout orientation of the component.

Default: 'vertical'

---

placeholder

String

A placeholder image to be displayed before the image is loaded.

---

selected

Boolean

Applies a selected visual effect to the image.

Default: false

---

slotBefore

Node

Nodes to be inserted before image.

For LTR locales, the nodes are inserted to the left of the image. For RTL locales, the nodes are inserted to the right. If nothing is specified, nothing, not even an empty container, is rendered in this place.

---

src

StringObject

String value or Object of values used to determine which image will appear on a specific screenSize.

ImageItemDecorator   Higher-Order Component

A higher-order component that adds behaviors to an ui/ImageItemui/ImageItem.ImageItemBase.

Import Usage

import {ImageItemDecorator} from '@enact/ui/ImageItem';

Includes: ui/ForwardRefui/ForwardRef.ForwardRef