Timer
Code
| 1 | const { controls, state, isRunning } = useAnimeTimer({ |
| 2 | duration: 1000, |
| 3 | loop: true, |
| 4 | autoplay: true, // start immediately; pause/restart via controls |
| 5 | frameRate: 30, |
| 6 | }) |
Standalone timer with playback controls, lifecycle callbacks, and imperative methods.
Live preview
Standalone TimerLooping timer with playback controls
Time0
Progress0%
Iteration0
Props
| Name | Type | Default | Description |
|---|---|---|---|
| duration | number | 1000 | Timer duration in ms |
| loop | number | boolean | false | Loop count or infinite |
| direction | string | normal | normal | alternate | reverse |
| frameRate | number | 60 | Update frame rate |
| autoplay | boolean | false | Start on mount |
| controls.play | function | - | Start/resume playback |
| controls.pause | function | - | Pause playback |
| controls.restart | function | - | Restart timer |
| state.currentTime | number | - | Elapsed ms |
| state.progress | number | - | Current progress 0→1 |
| state.currentIteration | number | - | Loop iteration count |