Size Picker
Выбор размера: плитки или прокручиваемая строка, нет в наличии. Pro · Формы и ввод › Цвет, размер и эмодзи
Установка
npx valyro-cli@latest login
npx valyro-cli@latest add size-picker
npm install valyro-ui-pro
import 'valyro-ui-pro/styles.css';
import { SizePicker } from 'valyro-ui-pro';
Пропсы
| Prop | Type | Default | |
|---|---|---|---|
options * | SizeOption[] | Sizes in order: "36", "M", "US 8.5". | |
value | string | Selected size (controlled); an empty string means none. | |
defaultValue | string | Initial value when uncontrolled. | |
onValueChange | (value: string) => void | Called with the new value when it changes. | |
name | string | Name of the native radios, so the size submits with a form. | |
layout | 'scroll' | 'wrap' | 'wrap' | scroll: one row that scrolls sideways with faded edges; wrap: rows of tiles. Default wrap. |
variant | 'box' | 'plain' | 'box' | box: tiles; plain: large bare numbers, the selected one bold (a product page). Default box. |
size | 'sm' | 'md' | 'lg' | 'md' | Tile size. Default md. |
Похожие компоненты
- Color Picker — Выбор цвета
- Swatch Picker — Выбор цвета из образцов: товар, тема, метка
- Emoji Picker — Выбор эмодзи: поиск, категории, оттенки кожи, недавние
- Text Input — Текстовые поля
- Textarea — Многострочный ввод
- Search Input — Поисковая строка
- Mentions Input — Текст с @упоминаниями и #тегами, асинхронные подсказки
- Tags Input — Ввод тегов
- Select — Выбор из списка
- Multi Select — Множественный выбор
- Combobox — Поиск и выбор
- Listbox — Список вариантов на странице: один или несколько, диапазоны с Shift
Назад: Swatch Picker · Далее: Emoji Picker · Весь раздел «Формы и ввод»