# Magnify Dock

A barra de atalhos em que os ícones crescem em onda conforme o cursor chega perto, com o nome em cima do mais próximo.

- Nome no registry: `magnify-dock`
- Tipo: componente
- Dependências npm: motion, react
- Demo: https://ui.visantlabs.com/c/magnify-dock
- Categorias: controles, dock, navegacao, toolbar, icones, ampliacao, spring

## Quando usar

- Use quando: Barra de atalhos de ícones que amplia em onda, em portfólio ou app de criação no desktop
- Evite quando: Navegação principal de app: side-nav; mobile, nav-drawer; poucas ações num botão, orbit-menu

## Instalar

```bash
npx shadcn@latest add @visant/magnify-dock
```

## Usar

```tsx
<MagnifyDock
  active="inicio"
/>
```

## API

### MagnifyDock

- `items: MagnifyDockItem[]`
- `active?: string` — Item marcado como atual (ganha o ponto embaixo).
- `lift?: number = 8` — Quanto o ícone mais perto sobe, em px.
- `magnify?: number = 1.4` — Escala do ícone mais perto do cursor. 1 desliga a onda.
- `onSelect?: (id: string) => void`
- `reach?: number = 2` — Alcance da onda, em ícones de distância.
- `size?: number = 40` — Lado do ícone em repouso, em px.