# Dialog Stack

> Stacked dialog component inspired by Radix UI Dialog. Accessible. Customizable. Open Source. Pre-styled for shadcn/ui.  Features 	•	Stacked dialog interface with smooth transitions 	•	Keyboard navigation support 	•	Accessible by default 	•	Customizable styling 	•	Previous/Next navigation controls 	•	Responsive design 	•	Fully typed with TypeScript  Props  DialogStack 	•	open?: boolean - Controls the open state 	•	onOpenChange?: (open: boolean) => void - Callback when open state changes 	•	clickable?: boolean - Enables clicking on previous dialogs to navigate back  DialogStackTrigger 	•	asChild?: boolean - Merges props onto child element instead of rendering button  DialogStackContent 	•	className?: string - Additional CSS classes 	•	children: ReactNode - Dialog content 	•	index?: number - Dialog position in stack (auto-populated) 	•	offset?: number - Visual offset between stacked dialogs  DialogStackNext/Previous 	•	asChild?: boolean - Merges props onto child element 	•	children?: ReactNode - Button content 	•	className?: string - Additional CSS classes  Example Use Cases 	•	Multi-step forms 	•	Onboarding flows 	•	Wizards 	•	Sequential content presentation 	•	Guided tutorials

- Author: [Hayden Bleasel](https://21st.dev/@haydenbleasel)
- Library: [Kibo UI](https://21st.dev/@haydenbleasel/library/kibo-ui)
- License: mit
- Tags: shadcn/ui, Modal
- npm dependencies: @radix-ui/react-portal
- Live preview: https://21st.dev/@haydenbleasel/components/dialog-stack

## Install

```bash
npx shadcn@latest add "https://21st.dev/r/haydenbleasel/dialog-stack?api_key=$API_KEY_21ST"
```

Requires a 21st API key (generate one at https://21st.dev/mcp) passed as `API_KEY_21ST`. Free accounts get a limited number of installs per day; unlimited on a paid plan — see https://21st.dev/pricing.

Full component directory: https://21st.dev/llms.txt · More like this: https://21st.dev/community/components/s/shadcn.md