Navigation & Structure
Floating Chat
3D floating chat list with perspective transforms and hover effects. Features card-based chat previews with 3D rotation on hover.
navigation-structurechatfloating3dperspectivelist
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
items | Array<{ id: string | number; name: string; message: string; time: string; avatar?: string; color?: string; unread?: boolean }> | [] | Array of chat items to display. |
className | string | undefined | Additional CSS classes for custom styling. |
onItemClick | (item: ChatItem) => void | undefined | Callback function called when a chat item is clicked. |
maxWidth | string | "max-w-sm" | Maximum width of the chat list container. |