Questionnaire
A structured question widget for chat-style flows: a single radio, slider, number, or calendar question, or a `steps` sequence of several questions paginated inside one card with a "Question X of N" progress indicator.
Installation
npx dafink-ui add questionnaireAlso installs: Date-picker, Slider, Button, Input
Demo
What kind of feature is this?
Pick the category that fits best.
How severe is this bug?
Choose the closest match.
How's the rollout going?
Pick the closest status.
Props
| Name | Type | Default | Description |
|---|---|---|---|
| step | QuestionStep | - | A single question to render: a discriminated union on type ('radio' | 'slider' | 'number' | 'calendar'), each carrying a question, an optional description, and type-specific fields ('radio' adds options: QuestionOption[] ({ id, label, description? }) and an optional otherPlaceholder; 'slider' adds min/max/step; 'number' adds an optional placeholder). Mutually exclusive with steps. |
| steps | QuestionStep[] | - | A sequence of questions rendered one at a time inside the same card, with a "Question X of N" progress indicator advancing between them. Mutually exclusive with step. |
| answer | string | - | When set, the card renders as a locked "You answered: {answer}" summary instead of the input control. Only applies to a single step; a steps sequence shows its own completed recap once every question is answered. |
| onAnswer | (value: string) => void | - | Called with the submitted answer, formatted as a display string regardless of control type. For a steps sequence, called once at the end with every answer joined together. |
| className | string | '' | Additional classes on the root wrapper. |
Accessibility
Questionnaire has no keyboard handling of its own: each question type is a native or already-documented control (a native radio input per option via the peer pattern, or the Slider/Input/DatePicker components), so Tab, Space, and Enter behavior all comes from those controls. One real gap worth calling out: advancing to the next question never moves focus anywhere — the Next/Submit button isn't remounted between questions, so focus simply stays on it, and keyboard and screen reader users have to Tab forward manually to reach each newly rendered control. Once a multi-step sequence completes, the answered question block is marked aria-hidden and inert, removing it from focus and the accessibility tree so only the recap remains reachable.