Number Wheel

Число на вращающемся барабане с соседними значениями. Pro · Анимированные компоненты › Код и числа

Установка

npx valyro-cli@latest login
npx valyro-cli@latest add number-wheel

npm install valyro-ui-pro

import 'valyro-ui-pro/styles.css';
import { NumberWheel } from 'valyro-ui-pro';

Prop	Type	Default
`value` *	`number`		The number the wheel comes to rest on.
`from`	`number`		Number shown before the wheel first turns, e.g. 0 to roll up to `value` (default: `value`, no roll).
`step`	`number`	`1`	Difference between neighbouring numbers on the wheel (default 1).
`sideItems`	`number`	`2`	Neighbours shown above and below the current number (default 2).
`itemSize`	`number`	`35`	Height of one number, px (default 35).
`direction`	`'btt' \| 'ttb'`	`'btt'`	`btt`: higher numbers come up from below (default); `ttb`: they come down from above.
`min`	`number`		Numbers below this stay blank, e.g. 0 for a count.
`startOnView`	`boolean`	`false`	Start turning only when the wheel scrolls into view (default false).
`delay`	`number`	`0`	Pause before turning, ms (default 0).
`format`	`Intl.NumberFormatOptions`		Intl.NumberFormat options for every number on the wheel.
`locale`	`string`		Locale for the numbers (default: the ThemeProvider's, then the browser's).