Color Picker
Выбор цвета. Бесплатно, MIT · Формы и ввод › Цвет, размер и эмодзи
Установка
npx valyro-cli@latest add color-picker
npx shadcn@latest add https://valyro.xyz/r/color-picker.json
npm install valyro-ui
import 'valyro-ui/styles.css';
import { ColorPicker } from 'valyro-ui';
Пропсы
| Prop | Type | Default | |
|---|---|---|---|
value | string | Hex colour: #rrggbb, or #rrggbbaa when alpha is on and the colour is translucent. | |
defaultValue | string | DEFAULT_COLOR | Initial value when uncontrolled. |
onValueChange | (value: string) => void | Called with the new value when it changes. | |
alpha | boolean | false | Show the opacity slider. |
presets | string[] | Preset swatches (any hex form). | |
name | string | Submits the colour with the surrounding form as lowercase hex (#rrggbb or #rrggbbaa). | |
invalid | boolean | false | Error state, e.g. from a FormField (marks the root with data-invalid). |
labels | Partial<ColorPickerLabels> | Overrides for the built-in English text; keys left out keep their defaults. |
Похожие компоненты
- Swatch Picker — Выбор цвета из образцов: товар, тема, метка
- Size Picker — Выбор размера: плитки или прокручиваемая строка, нет в наличии
- Emoji Picker — Выбор эмодзи: поиск, категории, оттенки кожи, недавние
- Text Input — Текстовые поля
- Textarea — Многострочный ввод
- Search Input — Поисковая строка
- Mentions Input — Текст с @упоминаниями и #тегами, асинхронные подсказки
- Tags Input — Ввод тегов
- Select — Выбор из списка
- Multi Select — Множественный выбор
- Combobox — Поиск и выбор
- Listbox — Список вариантов на странице: один или несколько, диапазоны с Shift
Назад: Date Of Birth Input · Далее: Swatch Picker · Весь раздел «Формы и ввод»