Questions

1"use client";
2 
3import * as React from "react";
4import {
5  ArrowLeft01Icon,
6  ArrowRight01Icon,
7  Cancel01Icon,
8  Edit03Icon,
9} from "@hugeicons/core-free-icons";
10import { HugeiconsIcon } from "@hugeicons/react";
11 
12import { Button } from "@/components/ui/button";
13import {
14  Card,
15  CardContent,
16  CardFooter,
17  CardHeader,
18  CardTitle,
19} from "@/components/ui/card";
20import { Checkbox } from "@/components/ui/checkbox";
21import {
22  Carousel,
23  CarouselContent,
24  CarouselItem,
25  type CarouselApi,
26} from "@/components/ui/carousel";
27import { cn } from "@/lib/utils";
28 
29export type QuestionType = "single" | "multiple";
30 
31export type QuestionOptionInput = {
32  value: string;
33  label: React.ReactNode;
34};
35 
36export type QuestionInput = {
37  id: string;
38  type: QuestionType;
39  prompt: React.ReactNode;
40  options: QuestionOptionInput[];
41  required?: boolean;
42};
43 
44export const QUESTION_OTHER_VALUE = "__other__";
45export const QUESTION_NO_PREFERENCE_VALUE = "__no_preference__";
46export const QUESTION_NO_PREFERENCE_LABEL = "[No Preference]";
47 
48export type RegisteredQuestion = {
49  id: string;
50  type: QuestionType;
51  prompt: React.ReactNode;
52  required?: boolean;
53  index: number;
54  options?: QuestionOptionInput[];
55};
56 
57type QuestionScope = {
58  id: string;
59  type: QuestionType;
60};
61 
62export type QuestionSubmissionAnswer = {
63  value: string;
64  label: React.ReactNode;
65};
66 
67const NO_PREFERENCE_ANSWER: QuestionSubmissionAnswer = {
68  value: QUESTION_NO_PREFERENCE_VALUE,
69  label: QUESTION_NO_PREFERENCE_LABEL,
70};
71 
72export type SingleQuestionAnswerState = {
73  type: "single";
74  value: string;
75  other?: string;
76};
77 
78export type MultipleQuestionAnswerState = {
79  type: "multiple";
80  value: string[];
81  other?: string;
82};
83 
84export type QuestionAnswerState =
85  | SingleQuestionAnswerState
86  | MultipleQuestionAnswerState;
87 
88export type QuestionsSubmission = Array<
89  | {
90      questionId: string;
91      prompt: React.ReactNode;
92      type: "single";
93      status: "answered";
94      answer: QuestionSubmissionAnswer;
95    }
96  | {
97      questionId: string;
98      prompt: React.ReactNode;
99      type: "single";
100      status: "skipped";
101      answer: QuestionSubmissionAnswer;
102    }
103  | {
104      questionId: string;
105      prompt: React.ReactNode;
106      type: "multiple";
107      status: "answered";
108      answer: QuestionSubmissionAnswer[];
109    }
110  | {
111      questionId: string;
112      prompt: React.ReactNode;
113      type: "multiple";
114      status: "skipped";
115      answer: QuestionSubmissionAnswer[];
116    }
117>;
118 
119// … truncated