limestone/Spinner

Provides Limestone-themed indeterminate progress indicator (spinner) components and behaviors.

Used for indicating to the user that something is busy and interaction is temporarily suspended.

Loading Live Preview

Import Usage

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

Members

Spinner   Component

A Limestone-styled Spinner.

Import Usage

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

Extends: limestone/Spinnerlimestone/Spinner.SpinnerBase
Wrapped with: limestone/Spinnerlimestone/Spinner.SpinnerDecorator

Properties

blockClickOn

'screen''container'

Determines how far the click-blocking should extend.

It can be either 'screen', 'container', or null. 'screen' pauses spotlight. Changing this property to 'screen' after creation is not supported.

Default: null

SpinnerBase   Component

The base component, defining all the properties.

Import Usage

import {SpinnerBase} from '@enact/limestone/Spinner';

Extends: ui/Spinnerui/Spinner.SpinnerBase

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:

• spinner - The root component class, unless there is a scrim. The scrim and floating layer can be a sibling or parent to this root "spinner" element.

---

size

'medium''small'

Customize the size of this component.

Recommended usage is "medium" (default) for standalone and popup scenarios, while "small" is best suited for use inside other elements, like limestone/Itemlimestone/Item.Item.

Default: 'medium'

---

transparent

Boolean

Removes the background color (making it transparent).

Default: false

SpinnerDecorator   Higher-Order Component

Limestone-specific Spinner behaviors to apply to limestone/Spinnerlimestone/Spinner.Spinner.

Import Usage

import {SpinnerDecorator} from '@enact/limestone/Spinner';

Includes: limestone/Skinnablelimestone/Skinnable.Skinnable