Switch 3D
Переключатель-кубик: перекатывается между «выкл» и светящимся «вкл». Pro · 3D и моушн › 3D-кнопки, формы и текст
Установка
npx valyro-cli@latest login
npx valyro-cli@latest add switch-3dnpm install valyro-ui-pro
import 'valyro-ui-pro/styles.css';
import { Switch3D } from 'valyro-ui-pro';Пропсы
| Prop | Type | Default | |
|---|---|---|---|
checked | boolean | Whether it is on (controlled). | |
defaultChecked | boolean | false | Whether it is on at first (uncontrolled). |
onCheckedChange | (checked: boolean) => void | Called when it is switched. | |
size | 'sm' | 'md' | 'lg' | 'md' | Height, width and text size. |
label | ReactNode | Visible text next to the switch; also its accessible name (pressing it switches too). | |
labels | Partial<Switch3DLabels> | The words on the two faces. | |
className | string | Root element class (the label around the switch). | |
style | CSSProperties | Root element style. |
Похожие компоненты
- Button 3D — Объёмная кнопка-клавиша: утапливается при нажатии и отпружинивает
- Shape Morph — Форма перетекает в другую: круг, капля, звезда, цветок — на пружине
- Path Text — Текст по кругу, дуге или волне: вращается со временем или прокруткой
- Reveal — Появление любого компонента при прокрутке: подъём, наплыв, 3D-разворот
- Stagger — Списки, сетки и строки таблиц появляются волной, один за другим
- Tilt — Наклон, подъём, блик и притяжение под курсором для любой карточки
- Layout Group — Перестановка без прыжков: фильтр, сортировка, перестроение сетки
- Presence — Появление и уход: элемент живёт, пока проигрывается выход
- Scene Backdrop — WebGL- или CSS-сцена под обычным интерфейсом: hero, карточки, дашборд
- Scroll Cylinder — Строки заголовка на вращающемся цилиндре — поворот от прокрутки
- Stacking Panels — Панели прилипают при прокрутке и складываются в стопку
- Helix Rail — Карточки на спирали, которая вращается от прокрутки
Назад: Button 3D · Далее: Shape Morph · Весь раздел «3D и моушн»