Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Conversation

@Adebesin-Cell
Copy link
Contributor

@Adebesin-Cell Adebesin-Cell commented Oct 23, 2025

📝 Description

Introduces the new Tour component to Chakra UI, a guided tour feature that helps users understand interfaces through interactive steps with contextual highlights and messaging.

⛳️ Current behavior (updates)

N/A—this is a new component. Chakra UI did not previously have a Tour component.

🚀 New behavior

New Tour component features:

  • Tour.Root / Tour.RootProvider - container with useTour hook support
  • Tour.Backdrop
  • Tour.Spotlight
  • Tour.Positioner
  • Tour.Content, Tour.Title, Tour.Description - step messaging
  • Tour.Arrow, Tour.ArrowTip - pointer styling
  • Tour.Control, Tour.ProgressText, Tour.ActionTriggers - navigation UI
  • Tour.CloseTrigger - dismiss button

Tour features:

  • Multiple step types: dialog, tooltip, floating, wait
  • Configurable placement, backdrop, arrow visibility per step
  • Programmatic control: start(), next(), prev(), setStep(), progress tracking
  • Step effects and lifecycle hooks (onStepChange, onStatusChange)
  • Wait steps for conditional progression

💣 Is this a breaking change (Yes/No):

No

This is a new component with no impact on existing functionality.

📝 Additional Information

Built on top of Ark UI's Tour primitive with Chakra styling and composition patterns. Follows Chakra's slot recipe structure for customization.

@changeset-bot
Copy link

changeset-bot bot commented Oct 23, 2025

🦋 Changeset detected

Latest commit: cdf1e7c

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 4 packages
Name Type
@chakra-ui/panda-preset Minor
@chakra-ui/react Minor
@chakra-ui/charts Minor
@chakra-ui/cli Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel
Copy link

vercel bot commented Oct 23, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Updated (UTC)
chakra-ui-storybook Ready Ready Preview Nov 12, 2025 2:55am
chakra-v3-docs Error Error Nov 12, 2025 2:55am

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant