MultiStepForm
Vícekrokový formulář kombinující Steps, Progress, Alert, Button a Tag do průvodce
Installation
pnpm dlx shadcn@latest add https://registry.ceskysoftware.cz/r/multi-step-form.json
Usage
Preview
Registrace
Krok 1 z 31
Účet
Základní info
2
Profil
Osobní data
3
Platba
Způsob platby
Import
import { MultiStepForm } from "@/components/ui/multi-step-form"
Example
<MultiStepForm
title="Registrace"
steps={[
{ id: "account", title: "Účet", description: "Základní info" },
{ id: "profile", title: "Profil", description: "Osobní data" },
{ id: "payment", title: "Platba", description: "Způsob platby" },
]}
color="primary"
onSubmit={() => console.log('Odesláno!')}
>
{/* Obsah aktuálního kroku */}
<Input placeholder="Email" />
<Input placeholder="Heslo" type="password" />
</MultiStepForm>
Dependencies
https://registry.ceskysoftware.cz/r/utils.json (registry)https://registry.ceskysoftware.cz/r/steps.json (registry)https://registry.ceskysoftware.cz/r/progress.json (registry)https://registry.ceskysoftware.cz/r/alert.json (registry)https://registry.ceskysoftware.cz/r/button.json (registry)https://registry.ceskysoftware.cz/r/tag.json (registry)