Button Back

Smart back button. Uses browser history when available, otherwise navigates to a fallback destination derived from the current path. Bound to the B keyboard shortcut by default.

Default

Renders an arrow + Back label. Pressing B triggers it.

Usage

Import the parts you need from the component's folder.

import { ButtonBack } from "@/components/ui/button-back";

Variants

default for inline use, bordered for floating buttons, semiTransparent for over-image headers.

Custom trigger

Use the default scoped slot to render your own UI while keeping the navigation behaviour.

API Reference

ButtonBack

Prop	Type	Default	Description
`destination`	`string`	`null`	Fallback path when history is empty. Falls back to the parent path when null.
`showLabel`	`boolean`	`true`	Show or hide the Back label.
`forceDestination`	`boolean`	`false`	Always navigate to destination, ignoring history.
`variant`	`"default" \| "bordered" \| "semiTransparent"`	`"default"`	Visual style.
`shortcut`	`boolean`	`true`	Enable the B keyboard shortcut.

Slot	Description
`default`	Scoped slot receives goBack handler for fully custom triggers.

Button Button Copy