Questionnaire

A step-by-step form that moves between questions with a sense of direction, shows real progress and answers from the keyboard.

bypreet from Hextaui

Installation

terminal

pnpm dlx layro-cli add @preetsuthar17/questionnaire

npx layro-cli add @preetsuthar17/questionnaire

npx layro-cli add @preetsuthar17/questionnaire

bunx layro-cli add @preetsuthar17/questionnaire

New project? Start with init. Writes third-party code and installs packages with scripts off.

Code

Dependencies

Demo

"use client"

import * as React from "react"
import { Questionnaire as QuestionnairePrimitive } from "@shadcn/react/questionnaire"
import { IconCheck } from "@tabler/icons-react"
import { type VariantProps } from "class-variance-authority"
import { cn } from "cn"

import { buttonVariants } from "@/components/ui/button"
import { inputVariants } from "@/components/ui/input"
import { Kbd } from "@/components/ui/kbd"
import { NumberFlow } from "@/components/ui/number-flow"
import { easeOut, prefersReducedMotion } from "@/lib/motion"