enact logoEnact
Edit on GitHub

sandstone/Image

Provides Sandstone styled Image component that supports multiple resolution sources.

import Image from '@enact/sandstone/Image';

Members

ImageComponent

A Sandstone-styled image component

<Image
  src={{
    'hd': 'https://dummyimage.com/64/e048e0/0011ff',
    'fhd': 'https://dummyimage.com/128/e048e0/0011ff',
    'uhd': 'https://dummyimage.com/256/e048e0/0011ff'
  }}
>
import Image from '@enact/sandstone/Image';

ImageBaseComponent

A Sandstone-styled image component without any behavior

import {ImageBase} from '@enact/sandstone/Image';
Properties
componentRef
ObjectFunction

Called with a reference to the root component.

When using sandstone/Image.Image, 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:

  • image - The root component class for Image

ImageDecoratorHigher-Order Component

Sandstone-specific behaviors to apply to Image.

import {ImageDecorator} from '@enact/sandstone/Image';
ArrayBooleanFunctionModuleNumberObjectString