ascii.cnlibs.com
GithubX

Questionnaire

Multi-step form with progress and conditional questions.

Step 1 of 3
What are you deploying?

## installation

pnpm dlx shadcn@latest add https://ascii.cnlibs.com/r/questionnaire.json

## usage

import { Button } from "@/components/ui/button";
import { Questionnaire, QuestionnaireFooter, QuestionnaireOption, QuestionnaireOptions, QuestionnaireProgress, QuestionnaireQuestion, QuestionnaireStep } from "@/components/ui/questionnaire";
<Questionnaire>
  <QuestionnaireProgress step={1} total={3} />
  <QuestionnaireStep>
    <QuestionnaireQuestion>What are you deploying?</QuestionnaireQuestion>
    <QuestionnaireOptions>
      <QuestionnaireOption selected>A web app</QuestionnaireOption>
      <QuestionnaireOption>An API service</QuestionnaireOption>
    </QuestionnaireOptions>
  </QuestionnaireStep>
  <QuestionnaireFooter>
    <Button variant="ghost">Back</Button>
    <Button>Next</Button>
  </QuestionnaireFooter>
</Questionnaire>