All components
Social Links
NavigationA row of circular icon links for social profiles.
Installation
Add it with the shadcn CLI:
$
pnpm dlx shadcn@latest add https://nawalkattel.com.np/r/social-links.jsonOr install manually
1. Install dependencies
pnpm add clsx tailwind-merge2. Copy the component source into
components/library/social-links.tsx
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| links | { href: string; label: string; icon: ReactNode }[] | - | Profiles to link. |
Accessibility
- Every icon-only link carries an aria-label naming the destination.
- Hover changes background and colour, not colour alone.
- Real anchors, so they are focusable and open in the usual ways.
Dependencies
clsxtailwind-merge