Async workflows

Save

SaveStateIcon

Shows whether a change is saving, saved, or failed.

States

4 total

Save

Ready to save.

Save

"idle"

Ready to save.

Saving

"saving"animated

Saving is in progress.

Saved

"saved"

Saved successfully.

Save failed

"error"

The save action failed.

Implementation

Pass your current state.

The component stays presentational. Your application remains in control of async work and business logic. The state prop is a TypeScript string literal union — pass an invalid state and you'll get a type error at build time.

Source
Lucide
License
ISC
States
idle · saving · saved · error
example.tsx
import { SaveStateIcon } from "@stateglyph/react";
<SaveStateIcon state="idle" decorative />