Number Flow
Smooth animated number transitions for React dashboards, counters, and KPIs. Features rolling digit animations, locale formatting, and customizable easing.
Installation
npx smoothui-cli add number-flowFeatures
- Smooth counting animations
- Locale-aware formatting
- Easing and duration controls
- Accessible labels
Accessibility
Reduced Motion
This component does not currently support the prefers-reduced-motion media query. Digit slide animations will play regardless of user preference.
ARIA
The increment and decrement buttons include descriptive aria-label attributes ("Increase number" and "Decrease number"). Buttons are properly disabled at the min and max boundaries via the disabled attribute.
Keyboard
The controls use native <button> elements with type="button", so they are focusable and operable via keyboard (Enter and Space) without additional handling.