# Link unfurl

A composer where pasting a URL shows a loading shimmer on the link, then unfurls it into a rich preview card with title, image and favicon in one morph, which can be collapsed back to the inline link or removed.

- ID: `link-unfurl`
- Import: `animui/link-unfurl`
- Category: Special
- Runtime exports: `LinkUnfurl`
- Declaration: `types/pro/link-unfurl.d.ts`
- Type provenance: reconstructed-from-docs-and-runtime
- Related: mention-input, rich-text-editor, hover-card, chat-thread

```tsx
import { LinkUnfurl } from 'animui/link-unfurl';
```

This import example is not a complete render recipe: read the declaration below and its local references for required props, data, callbacks and provider context. Use `animui info link-unfurl` to resolve the local declaration graph. Global setup is in `llms.txt`.

```ts
/** Reconstructed from saved Arc documentation and runtime binding evidence; original TypeScript source was unavailable. */
import type { ComponentType, ReactNode, CSSProperties, Ref, ButtonHTMLAttributes, HTMLAttributes, ReactElement } from 'react';

export interface LinkUnfurlPreview { title: string; description?: string; image?: string; siteName?: string; url: string; }
export interface LinkUnfurlMessage { id: string; preview: LinkUnfurlPreview; }
export interface LinkUnfurlProps {
  label?: string;
  placeholder?: string;
  defaultValue?: string;
  samples?: LinkUnfurlPreview[];
  resolve?: (url: string, signal: AbortSignal) => Promise<LinkUnfurlPreview | null>;
  autoExpand?: boolean;
  autoPlay?: boolean;
  speed?: number;
  paused?: boolean;
  accent?: string;
  sendLabel?: string;
  onSend?: (message: LinkUnfurlMessage) => void | Promise<unknown>;
  className?: string;
  style?: CSSProperties;
}

export declare const LinkUnfurl: ComponentType<LinkUnfurlProps>;

export default LinkUnfurl;
```
