moonstone/Spinner

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

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

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

Members

SpinnerComponent

A Moonstone-styled Spinner.

import Spinner from '@enact/moonstone/Spinner';
Properties
blockClickOn
String

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

SpinnerBaseComponent

The base component, defining all of the properties.

import {SpinnerBase} from '@enact/moonstone/Spinner';
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 sibbling 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 moonstone/SlotItem.SlotItem.

Default: 'medium'
transparent
Boolean

Removes the background color (making it transparent).

Default: false

SpinnerDecoratorHigher-Order Component

Moonstone-specific Spinner behaviors to apply to Spinner.

import {SpinnerDecorator} from '@enact/moonstone/Spinner';
ArrayBooleanFunctionModuleNumberObjectString