OnboardingChecklist

Compact, collapsible setup checklist for dashboards and module landing pages. Steps expand inline to reveal a description and a parent-provided action. Supports progress, an optional menu (dismiss, feedback), and controlled or uncontrolled open state.

Import

import { OnboardingChecklist } from "@repo/design-system/components/onboarding/onboarding-checklist";

Basic

Set up your workspace

1 / 4 completed

Complete your profile

Set up your workspace

Customize the workspace name, branding, and default settings.

Invite your team

Connect integrations

With overflow menu (dismiss / feedback)

Get started with Acme

1 / 4 completed

Complete your profile

Set up your workspace

Customize the workspace name, branding, and default settings.

Invite your team

Connect integrations

Permission-gated steps

Get started

0 / 4 completed

Complete your profile

Always available to every member.

Add a payment method

Invite teammates

Review the audit log

All steps completed

Setup complete

Nice work — you're all set up. Reopen any step to revisit it.

4 / 4 completed

Complete your profile

Add your name, photo, and role so teammates know who you are.

Set up your workspace

Invite your team

Connect integrations

With per-step icons

Set up Acme

0 / 4 completed

Complete your profile

Add your personal details so teammates can identify you.

Review workspace settings

Invite and manage members

Set up billing

Without progress (info-only)

Quick links

Read the docs

Tour the platform and discover advanced features.

Watch the product tour

Contact support