Feedback

Tour

A guided walk through a screen, one spotlight at a time.

Ant Design: Tour

import { Tour } from '@alea/ui';

Examples

Each step points at part of the page.

A guided walk through a screen: each step spotlights an element and explains it (Ant's Tour). Escape skips; focus stays in the step.

Prop	Type	Default	Description
`isOpen`required	`boolean`	-	Whether the tour runs (controlled).
`onOpenChange`required	`(open: boolean) => void`	-	Called when it starts or ends.
`steps`required	`TourStep[]`	-	The steps: target (a CSS selector), title and content.
`onFinish`	`(() => void)`	-	Called when the last step is done.

Key	Does
`Enter`	Next
`Escape`	Skip the tour

Don't