svelte-simple-counter
A simple animated numeric counter based on css @property
Usage
import { SimpleCounter } from 'svelte-simple-counter';
<SimpleCounter
value={value}
prefersCSS={prefersCSS}
delay={delay}
transitionDuration={duration}
transitionTiming={timing}
customDisplay={customDisplay}
/>;
Configuration options
| Name | Type | Description |
|---|---|---|
| value | number | Required - displayed variable number |
| prefersCSS | boolean | enables pure css version of the component (browser compatibility will be checked)- defaults to true |
| delay | number | animation start delay in milliseconds - defaults to 100 |
| transitionDuration | number | duration in milliseconds of the transition on number change - defaults to 1000 |
| transitionTiming | string | transition css timing function - defaults to 'ease' |
| customDisplay | callback | enables custom display of the computed value (will disable css version) - defaults to null |
