Dock
Customize Components
Dock Settings
Panel Height68px
Base Item Size50px
Magnification70px
Distance200px
Props
| Property | Type | Default | Description |
|---|---|---|---|
| items | DockItemData[] | required | Array of dock items with icon, label, and onClick handler. |
| className | string | "" | Additional CSS classes for the dock panel. |
| distance | number | 200 | Distance from mouse cursor for magnification effect. |
| panelHeight | number | 68 | Height of the dock panel when not hovered. |
| baseItemSize | number | 50 | Base size of dock items when not magnified. |
| dockHeight | number | 256 | Maximum height of the dock when fully expanded. |
| magnification | number | 70 | Maximum size of dock items when magnified. |
| spring | SpringOptions | { mass: 0.1, stiffness: 150, damping: 12 } | Spring animation configuration for smooth transitions. |
Dependencies
motion
Created with ❤️ by Cybershoora