Back Button
A client-side navigation button that calls router.back() when browser history exists, falling back to a configurable default path.
BackButton detects whether there is a real browser history entry to return to (window.history.length > 2) and calls router.back() if so. When the page was opened directly (no history), it falls back to defaultPath via router.push. This makes it safe to use on both deep-linked and in-app navigation flows.
Installation
npx shadcn@latest add @adv/back-buttonUsage
import BackButton from '@/components/ui/back-button';
<BackButton defaultPath="/work" />Example
Props
| Prop | Type | Default | Description |
|---|---|---|---|
defaultPath | string | — | Path to navigate to when there is no browser history to go back to. Required. |
id | string | — | Optional id attribute applied to the button element. |
text | string | "Back" | Label text rendered next to the arrow icon. |