Assorted text-based activity indicators for usage in React components, based on cli-spinners.
I love the look and simplicity of sindresorhus' collection of text spinners/activity indicators for CLI applications and wanted to experiment with using them in React.
This package provides a single React component, Spinner
and (for now) accepts, a single prop: type
, which configures the component to use a specific spinner.
Given a spinner type
, react-cli-spinners
looks for the spinner's details, stored as a JSON file, and provides the Spinner
component with the following data:
// example demonstrating the data consumed by `Spinner` React component
"arrow3": {
"interval": 120,
"frames": ["▹▹▹▹▹", "▸▹▹▹▹", "▹▸▹▹▹", "▹▹▸▹▹", "▹▹▹▸▹", "▹▹▹▹▸"]
}
This package is distributed via npm which is bundled with node and should be installed as one of your project's dependencies
:
yarn add react-cli-spinners
or npm install -s react-cli-spinners
Please checkout examples
Basic
AGPL-3.0