React hook and optional component for rolling dices.
import useDice, { Dice } from 'use-dice'
function App() {
const { isRolling, value, roll } = useDice({ timeout: 1000 })
return (
<div style={{ display: 'flex', flexDirection: 'column', gap: '2rem' }}>
<h1>Dice value: {isRolling ? 'dice is rolling' : value}</h1>
<Dice value={value} isRolling={isRolling} />
<button onClick={roll} type="button">
Roll dice
</button>
</div>
)
}
export default App
Name |
Description |
Default |
timeout |
Timeout for roll function return a value, useful for animations. |
0 |
Name |
Description |
Default |
roll |
Function that calls for a random dice value |
|
value |
Last dice rolled value |
|
isRolling |
Returns true within the timeout option, useful for animations. |
false |
Name |
Description |
Default |
value |
Last dice rolled value |
|
isRolling |
Returns true within the timeout option, useful for animations. |
false |
Issues and pull requests are welcome.
MIT