feat: Validation for Number, URL, Email and Phone Number in Open Text Question

feat: Validation for Number, URL, Email and Phone Number in Open Text Question

apps/web/app/(app)/environments/[environmentId]/surveys/[surveyId]/edit/OpenQuestionForm.tsx

@@ -1,8 +1,20 @@
-import { TSurveyOpenTextQuestion, TSurveyWithAnalytics } from "@formbricks/types/v1/surveys";
-import { Button, Input, Label } from "@formbricks/ui";
-import { TrashIcon, PlusIcon } from "@heroicons/react/24/solid";
+import {
+  TSurveyOpenTextQuestion,
+  TSurveyOpenTextQuestionInputType,
+  TSurveyWithAnalytics,
+} from "@formbricks/types/v1/surveys";
+import { Button, Input, Label, QuestionTypeSelector } from "@formbricks/ui";
+import { PlusIcon, TrashIcon } from "@heroicons/react/24/solid";
 import { useState } from "react";
 
+const questionTypes = [
+  { value: "text", label: "Text" },
+  { value: "email", label: "Email" },
+  { value: "url", label: "URL" },
+  { value: "number", label: "Number" },
+  { value: "phone", label: "Phone" },
+];
+
 interface OpenQuestionFormProps {
   localSurvey: TSurveyWithAnalytics;
   question: TSurveyOpenTextQuestion;
@@ -19,6 +31,16 @@ export default function OpenQuestionForm({
   isInValid,
 }: OpenQuestionFormProps): JSX.Element {
   const [showSubheader, setShowSubheader] = useState(!!question.subheader);
+  const defaultPlaceholder = getPlaceholderByInputType(question.inputType ?? "text");
+
+  const handleInputChange = (inputType: TSurveyOpenTextQuestionInputType) => {
+    const updatedAttributes = {
+      inputType: inputType,
+      placeholder: getPlaceholderByInputType(inputType),
+      longAnswer: inputType === "text" ? question.longAnswer : false,
+    };
+    updateQuestion(questionIdx, updatedAttributes);
+  };
 
   return (
     <form>
@@ -71,11 +93,38 @@ export default function OpenQuestionForm({
           <Input
             id="placeholder"
             name="placeholder"
-            value={question.placeholder}
+            value={question.placeholder ?? defaultPlaceholder}
             onChange={(e) => updateQuestion(questionIdx, { placeholder: e.target.value })}
           />
         </div>
       </div>
+
+      {/* Add a dropdown to select the question type */}
+      <div className="mt-3">
+        <Label htmlFor="questionType">Input Type</Label>
+        <div className="mt-2 flex items-center">
+          <QuestionTypeSelector
+            questionTypes={questionTypes}
+            currentType={question.inputType}
+            handleTypeChange={handleInputChange} // Use the merged function
+          />
+        </div>
+      </div>
     </form>
   );
 }
+
+function getPlaceholderByInputType(inputType: TSurveyOpenTextQuestionInputType) {
+  switch (inputType) {
+    case "email":
+      return "example@email.com";
+    case "url":
+      return "http://...";
+    case "number":
+      return "42";
+    case "phone":
+      return "+1 123 456 789";
+    default:
+      return "Type your answer here...";
+  }
+}

apps/web/app/(app)/environments/[environmentId]/surveys/templates/templates.ts

@@ -86,12 +86,14 @@ export const templates: TTemplate[] = [
           type: QuestionType.OpenText,
           headline: "What type of people do you think would most benefit from {{productName}}?",
           required: true,
+          inputType: "text",
         },
         {
           id: createId(),
           type: QuestionType.OpenText,
           headline: "What is the main benefit your receive from {{productName}}?",
           required: true,
+          inputType: "text",
         },
         {
           id: createId(),
@@ -99,6 +101,7 @@ export const templates: TTemplate[] = [
           headline: "How can we improve {{productName}} for you?",
           subheader: "Please be as specific as possible.",
           required: true,
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -253,6 +256,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           buttonLabel: "Send",
+          inputType: "text",
         },
         {
           id: "mao94214zoo6c1at5rpuz7io",
@@ -274,6 +278,7 @@ export const templates: TTemplate[] = [
           headline: "What features are you missing?",
           required: true,
           subheader: "",
+          inputType: "text",
         },
         {
           id: "hdftsos1odzjllr7flj4m3j9",
@@ -320,6 +325,7 @@ export const templates: TTemplate[] = [
           headline: "Great to hear! Why did you recommend us?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "duz2qp8eftix9wty1l221x1h",
@@ -327,6 +333,7 @@ export const templates: TTemplate[] = [
           headline: "So sad. Why not?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "yhfew1j3ng6luy7t7qynwj79",
@@ -347,6 +354,7 @@ export const templates: TTemplate[] = [
           headline: "What made you discourage them?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -405,6 +413,7 @@ export const templates: TTemplate[] = [
           headline: "Sorry to hear. What was the biggest problem using {{productName}}?",
           required: true,
           buttonLabel: "Next",
+          inputType: "text",
         },
         {
           id: "rnrfydttavtsf2t2nfx1df7m",
@@ -413,6 +422,7 @@ export const templates: TTemplate[] = [
           headline: "What did you expect {{productName}} would do for you?",
           required: true,
           buttonLabel: "Next",
+          inputType: "text",
         },
         {
           id: "x760wga1fhtr1i80cpssr7af",
@@ -434,6 +444,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "What would you like to achieve?",
           buttonLabel: "Next",
+          inputType: "text",
         },
         {
           id: "bqiyml1ym74ggx6htwdo7rlu",
@@ -445,6 +456,7 @@ export const templates: TTemplate[] = [
           headline: "How are you solving your problem now?",
           required: false,
           subheader: "Please name alternative solutions:",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -490,6 +502,7 @@ export const templates: TTemplate[] = [
           subheader: "Help us improve your experience.",
           buttonLabel: "Send",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -567,6 +580,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "r0zvi3vburf4hm7qewimzjux",
@@ -576,6 +590,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "rbwz3y6y9avzqcfj30nu0qj4",
@@ -585,6 +600,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "gn6298zogd2ipdz7js17qy5i",
@@ -594,6 +610,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "c0exdyri3erugrv0ezkyseh6",
@@ -603,6 +620,7 @@ export const templates: TTemplate[] = [
           required: false,
           subheader: "We're eager to fix it asap.",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -651,6 +669,7 @@ export const templates: TTemplate[] = [
           headline: "Would you like to add something?",
           required: false,
           subheader: "Feel free to speak your mind, we do too.",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -691,6 +710,7 @@ export const templates: TTemplate[] = [
           headline: "How can we improve {{productName}} for you?",
           subheader: "Please be as specific as possible.",
           required: true,
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -959,6 +979,7 @@ export const templates: TTemplate[] = [
           headline: "What's broken?",
           required: true,
           subheader: "The more detail, the better :)",
+          inputType: "text",
         },
         {
           id: "a6c76m5oocw6xp9agf3d2tam",
@@ -982,6 +1003,7 @@ export const templates: TTemplate[] = [
           subheader: "What problem do you want us to solve?",
           buttonLabel: "Request feature",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1014,6 +1036,7 @@ export const templates: TTemplate[] = [
           headline: "Why was it hard?",
           required: false,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "ef0qo3l8iisd517ikp078u1p",
@@ -1021,6 +1044,7 @@ export const templates: TTemplate[] = [
           headline: "What other tools would you like to use with {{productName}}?",
           required: false,
           subheader: "We keep building integrations, yours can be next:",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1096,12 +1120,14 @@ export const templates: TTemplate[] = [
           type: QuestionType.OpenText,
           headline: "Please elaborate:",
           required: false,
+          inputType: "text",
         },
         {
           id: createId(),
           type: QuestionType.OpenText,
           headline: "Page URL",
           required: false,
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1129,6 +1155,7 @@ export const templates: TTemplate[] = [
           type: QuestionType.OpenText,
           headline: "What made you give that rating?",
           required: false,
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1162,6 +1189,7 @@ export const templates: TTemplate[] = [
           headline: "Lovely! Is there anything we can do to improve your experience?",
           required: false,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "vyo4mkw4ln95ts4ya7qp2tth",
@@ -1169,6 +1197,7 @@ export const templates: TTemplate[] = [
           headline: "Ugh, sorry! Is there anything we can do to improve your experience?",
           required: false,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1257,6 +1286,7 @@ export const templates: TTemplate[] = [
           headline: "How else could we improve you experience with {{productName}}?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1286,6 +1316,7 @@ export const templates: TTemplate[] = [
           type: QuestionType.OpenText,
           headline: "What is one thing we could do better?",
           required: false,
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1326,6 +1357,7 @@ export const templates: TTemplate[] = [
           type: QuestionType.OpenText,
           headline: "What’s missing or unclear to you about {{productName}}?",
           required: false,
+          inputType: "text",
         },
         {
           id: createId(),
@@ -1366,6 +1398,7 @@ export const templates: TTemplate[] = [
           headline: "Thanks! How could we make it easier for you to [ADD GOAL]?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1400,6 +1433,7 @@ export const templates: TTemplate[] = [
           headline: "Sorry about that! What would have made it easier for you?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "lpof3d9t9hmnqvyjlpksmxd7",
@@ -1407,6 +1441,7 @@ export const templates: TTemplate[] = [
           headline: "Lovely! Is there anything we can do to improve your experience?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1440,6 +1475,7 @@ export const templates: TTemplate[] = [
           headline: "Ugh! What makes the results irrelevant for you?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "adcs3d9t9hmnqvyjlpksmxd7",
@@ -1447,6 +1483,7 @@ export const templates: TTemplate[] = [
           headline: "Lovely! Is there anything we can do to improve your experience?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1480,6 +1517,7 @@ export const templates: TTemplate[] = [
           headline: "Hmpft! What were you hoping for?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "adcs3d9t9hmnqvyjlpkswi38",
@@ -1487,6 +1525,7 @@ export const templates: TTemplate[] = [
           headline: "Lovely! Is there anything else you would like us to cover?",
           required: true,
           placeholder: "Topics, trends, tutorials...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1539,6 +1578,7 @@ export const templates: TTemplate[] = [
           headline: "What made it hard?",
           required: false,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "nq88udm0jjtylr16ax87xlyc",
@@ -1550,6 +1590,7 @@ export const templates: TTemplate[] = [
           headline: "Great! What did you come here to do today?",
           required: false,
           buttonLabel: "Send",
+          inputType: "text",
         },
         {
           id: "u83zhr66knyfozccoqojx7bc",
@@ -1558,6 +1599,7 @@ export const templates: TTemplate[] = [
           required: true,
           buttonLabel: "Send",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1632,6 +1674,7 @@ export const templates: TTemplate[] = [
           headline: "What do you need but {{productName}} does not offer?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "j7jkpolm5xl7u0zt3g0e4z7d",
@@ -1640,6 +1683,7 @@ export const templates: TTemplate[] = [
           headline: "What options are you looking at?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "t5gvag2d7kq311szz5iyiy79",
@@ -1648,6 +1692,7 @@ export const templates: TTemplate[] = [
           headline: "What seems complicated to you?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "or0yhhrof753sq9ug4mdavgz",
@@ -1656,6 +1701,7 @@ export const templates: TTemplate[] = [
           headline: "What are you concerned about regarding pricing?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "v0pq1qcnm6ohiry5ywcd91qq",
@@ -1663,6 +1709,7 @@ export const templates: TTemplate[] = [
           headline: "Please explain:",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "k3q0vt1ko0bzbsq076p7lnys",
@@ -1706,6 +1753,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1747,6 +1795,7 @@ export const templates: TTemplate[] = [
           headline: "Got it. What's your primary reason for visiting today?",
           required: false,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "zm1hs8qkeuidh3qm0hx8pnw7",
@@ -1754,6 +1803,7 @@ export const templates: TTemplate[] = [
           headline: "What, if anything, is holding you back from making a purchase today?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1793,6 +1843,7 @@ export const templates: TTemplate[] = [
           headline: "What would have made this weeks newsletter more helpful?",
           required: false,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "l2q1chqssong8n0xwaagyl8g",
@@ -1851,6 +1902,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "jmzgbo73cfjswlvhoynn7o0q",
@@ -1884,6 +1936,7 @@ export const templates: TTemplate[] = [
           headline: "Got it. Why wouldn't this feature be valuable to you?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "gvzevzw4hkqd6dmlkcly6kd1",
@@ -1891,6 +1944,7 @@ export const templates: TTemplate[] = [
           headline: "Got it. What would be most valuable to you in this feature?",
           required: true,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "bqmnpyku9etsgbtb322luzb2",
@@ -1898,6 +1952,7 @@ export const templates: TTemplate[] = [
           headline: "Anything else we should keep in mind?",
           required: false,
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -1954,6 +2009,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "g92s5wetp51ps6afmc6y7609",
@@ -1963,6 +2019,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "gn6298zogd2ipdz7js17qy5i",
@@ -1972,6 +2029,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "rbwz3y6y9avzqcfj30nu0qj4",
@@ -1981,6 +2039,7 @@ export const templates: TTemplate[] = [
           required: true,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
         {
           id: "c0exdyri3erugrv0ezkyseh6",
@@ -1990,6 +2049,7 @@ export const templates: TTemplate[] = [
           required: false,
           subheader: "",
           placeholder: "Type your answer here...",
+          inputType: "text",
         },
       ],
       thankYouCard: thankYouCardDefault,
@@ -2032,6 +2092,7 @@ export const customSurvey: TTemplate = {
         subheader: "This is an example survey.",
         placeholder: "Type your answer here...",
         required: true,
+        inputType: "text",
       },
     ],
     thankYouCard: thankYouCardDefault,

package.json

@@ -33,8 +33,8 @@
     "eslint-config-formbricks": "workspace:*",
     "husky": "^8.0.3",
     "lint-staged": "^14.0.1",
-    "rimraf": "^5.0.1",
-    "tsx": "^3.12.7",
+    "rimraf": "^5.0.5",
+    "tsx": "^3.13.0",
     "turbo": "latest"
   },
   "lint-staged": {

packages/surveys/src/components/OpenTextQuestion.tsx

@@ -29,6 +29,11 @@ export default function OpenTextQuestion({
   brandColor,
   autoFocus = true,
 }: OpenTextQuestionProps) {
+  const handleInputChange = (inputValue: string) => {
+    // const isValidInput = validateInput(inputValue, question.inputType, question.required);
+    // setIsValid(isValidInput);
+    onChange({ [question.id]: inputValue });
+  };
   const openTextRef = useCallback((currentElement: HTMLInputElement | HTMLTextAreaElement | null) => {
     if (currentElement && autoFocus) {
       currentElement.focus();
@@ -39,7 +44,9 @@ export default function OpenTextQuestion({
     <form
       onSubmit={(e) => {
         e.preventDefault();
-        onSubmit({ [question.id]: value });
+        //  if ( validateInput(value as string, question.inputType, question.required)) {
+        onSubmit({ [question.id]: value, inputType: question.inputType });
+        // }
       }}
       className="w-full">
       <Headline headline={question.headline} questionId={question.id} required={question.required} />
@@ -53,14 +60,18 @@ export default function OpenTextQuestion({
             id={question.id}
             placeholder={question.placeholder}
             required={question.required}
-            value={value}
-            onInput={(e) => {
-              onChange({ [question.id]: e.currentTarget.value });
-            }}
+            value={value as string}
+            type={question.inputType}
+            onInput={(e) => handleInputChange(e.currentTarget.value)}
+            autoFocus={autoFocus}
             onKeyDown={(e) => {
               if (e.key == "Enter") onSubmit({ [question.id]: value });
             }}
-            className="block w-full rounded-md border border-slate-100 bg-slate-50 p-2 shadow-sm focus:border-slate-500 focus:outline-none focus:ring-0 sm:text-sm"
+            pattern={question.inputType === "phone" ? "[+][0-9 ]+" : ".*"}
+            title={question.inputType === "phone" ? "Enter a valid phone number" : undefined}
+            className={`block w-full rounded-md border
+       border-slate-100
+       bg-slate-50 p-2 shadow-sm focus:border-slate-500 focus:outline-none focus:ring-0 sm:text-sm`}
           />
         ) : (
           <textarea
@@ -71,13 +82,18 @@ export default function OpenTextQuestion({
             id={question.id}
             placeholder={question.placeholder}
             required={question.required}
-            value={value}
-            onInput={(e) => {
-              onChange({ [question.id]: e.currentTarget.value });
-            }}
-            className="block w-full rounded-md border border-slate-100 bg-slate-50 p-2 shadow-sm focus:border-slate-500 focus:outline-none focus:ring-0 sm:text-sm"></textarea>
+            value={value as string}
+            type={question.inputType}
+            onInput={(e) => handleInputChange(e.currentTarget.value)}
+            autoFocus={autoFocus}
+            pattern={question.inputType === "phone" ? "[+][0-9 ]+" : ".*"}
+            title={question.inputType === "phone" ? "Please enter a valid phone number" : undefined}
+            className={`block w-full rounded-md border
+      border-slate-100
+      bg-slate-50 p-2 shadow-sm focus:border-slate-500 focus:outline-none focus:ring-0 sm:text-sm`}></textarea>
         )}
       </div>
+
       <div className="mt-4 flex w-full justify-between">
         {!isFirstQuestion && (
           <BackButton

packages/types/v1/surveys.ts

@@ -162,11 +162,15 @@ const ZSurveyQuestionBase = z.object({
   isDraft: z.boolean().optional(),
 });
 
+export const ZSurveyOpenTextQuestionInputType = z.enum(["text", "email", "url", "number", "phone"]);
+export type TSurveyOpenTextQuestionInputType = z.infer<typeof ZSurveyOpenTextQuestionInputType>;
+
 export const ZSurveyOpenTextQuestion = ZSurveyQuestionBase.extend({
   type: z.literal(QuestionType.OpenText),
   placeholder: z.string().optional(),
   longAnswer: z.boolean().optional(),
   logic: z.array(ZSurveyOpenTextLogic).optional(),
+  inputType: ZSurveyOpenTextQuestionInputType.optional().default("text"),
 });
 
 export type TSurveyOpenTextQuestion = z.infer<typeof ZSurveyOpenTextQuestion>;

packages/ui/components/QuestionTypeSelector.tsx

@@ -0,0 +1,53 @@
+import {
+  ChatBubbleBottomCenterTextIcon,
+  EnvelopeIcon,
+  HashtagIcon,
+  LinkIcon,
+  PhoneIcon,
+} from "@heroicons/react/24/solid";
+import React from "react";
+
+interface QuestionType {
+  value: string;
+  label: string;
+}
+
+interface QuestionTypeSelectorProps {
+  questionTypes: QuestionType[];
+  currentType: string | undefined;
+  handleTypeChange: (value: string) => void;
+}
+
+const typeIcons: { [key: string]: React.ReactNode } = {
+  text: <ChatBubbleBottomCenterTextIcon />,
+  email: <EnvelopeIcon />,
+  url: <LinkIcon />,
+  number: <HashtagIcon />,
+  phone: <PhoneIcon />,
+};
+
+export function QuestionTypeSelector({
+  questionTypes,
+  currentType,
+  handleTypeChange,
+}: QuestionTypeSelectorProps): JSX.Element {
+  return (
+    <div className="flex w-full items-center justify-between rounded-md border p-1">
+      {questionTypes.map((type) => (
+        <div
+          key={type.value}
+          onClick={() => handleTypeChange(type.value)}
+          className={`flex-grow cursor-pointer rounded-md bg-${
+            (currentType === undefined && type.value === "text") || currentType === type.value
+              ? "slate-100"
+              : "white"
+          } p-2 text-center`}>
+          <div className="flex items-center justify-center space-x-2">
+            <span className="text-sm text-slate-900">{type.label}</span>
+            <div className="h-4 w-4 text-slate-600 hover:text-slate-800">{typeIcons[type.value]}</div>
+          </div>
+        </div>
+      ))}
+    </div>
+  );
+}

packages/ui/index.tsx

@@ -74,6 +74,7 @@ export { Switch } from "./components/Switch";
 export { TabBar } from "./components/TabBar";
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./components/Tooltip";
 export { AddVariablesDropdown, Editor } from "./components/editor";
+export { QuestionTypeSelector } from "./components/QuestionTypeSelector";
 
 /* Icons */
 export { AngryBirdRage2Icon } from "./components/icons/AngryBirdRage2Icon";

pnpm-lock.yaml

@@ -21,11 +21,11 @@ importers:
         specifier: ^14.0.1
         version: 14.0.1
       rimraf:
-        specifier: ^5.0.1
-        version: 5.0.1
+        specifier: ^5.0.5
+        version: 5.0.5
       tsx:
-        specifier: ^3.12.7
-        version: 3.12.7
+        specifier: ^3.13.0
+        version: 3.13.0
       turbo:
         specifier: latest
         version: 1.10.12
@@ -3389,27 +3389,6 @@ packages:
     dev: false
     optional: true
 
-  /@esbuild-kit/cjs-loader@2.4.2:
-    resolution: {integrity: sha512-BDXFbYOJzT/NBEtp71cvsrGPwGAMGRB/349rwKuoxNSiKjPraNNnlK6MIIabViCjqZugu6j+xeMDlEkWdHHJSg==}
-    dependencies:
-      '@esbuild-kit/core-utils': 3.0.0
-      get-tsconfig: 4.4.0
-    dev: true
-
-  /@esbuild-kit/core-utils@3.0.0:
-    resolution: {integrity: sha512-TXmwH9EFS3DC2sI2YJWJBgHGhlteK0Xyu1VabwetMULfm3oYhbrsWV5yaSr2NTWZIgDGVLHbRf0inxbjXqAcmQ==}
-    dependencies:
-      esbuild: 0.15.16
-      source-map-support: 0.5.21
-    dev: true
-
-  /@esbuild-kit/esm-loader@2.5.5:
-    resolution: {integrity: sha512-Qwfvj/qoPbClxCRNuac1Du01r9gvNOT+pMYtJDapfB1eoGN1YlJ1BixLyL9WVENRx5RXgNLdfYdx/CuswlGhMw==}
-    dependencies:
-      '@esbuild-kit/core-utils': 3.0.0
-      get-tsconfig: 4.4.0
-    dev: true
-
   /@esbuild/android-arm64@0.16.4:
     resolution: {integrity: sha512-VPuTzXFm/m2fcGfN6CiwZTlLzxrKsWbPkG7ArRFpuxyaHUm/XFHQPD4xNwZT6uUmpIHhnSjcaCmcla8COzmZ5Q==}
     engines: {node: '>=12'}
@@ -3428,10 +3407,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/android-arm@0.15.16:
-    resolution: {integrity: sha512-nyB6CH++2mSgx3GbnrJsZSxzne5K0HMyNIWafDHqYy7IwxFc4fd/CgHVZXr8Eh+Q3KbIAcAe3vGyqIPhGblvMQ==}
+  /@esbuild/android-arm64@0.18.20:
+    resolution: {integrity: sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ==}
     engines: {node: '>=12'}
-    cpu: [arm]
+    cpu: [arm64]
     os: [android]
     requiresBuild: true
     dev: true
@@ -3455,6 +3434,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/android-arm@0.18.20:
+    resolution: {integrity: sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [android]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/android-x64@0.16.4:
     resolution: {integrity: sha512-MW+B2O++BkcOfMWmuHXB15/l1i7wXhJFqbJhp82IBOais8RBEQv2vQz/jHrDEHaY2X0QY7Wfw86SBL2PbVOr0g==}
     engines: {node: '>=12'}
@@ -3473,6 +3461,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/android-x64@0.18.20:
+    resolution: {integrity: sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [android]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/darwin-arm64@0.16.4:
     resolution: {integrity: sha512-a28X1O//aOfxwJVZVs7ZfM8Tyih2Za4nKJrBwW5Wm4yKsnwBy9aiS/xwpxiiTRttw3EaTg4Srerhcm6z0bu9Wg==}
     engines: {node: '>=12'}
@@ -3491,6 +3488,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/darwin-arm64@0.18.20:
+    resolution: {integrity: sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/darwin-x64@0.16.4:
     resolution: {integrity: sha512-e3doCr6Ecfwd7VzlaQqEPrnbvvPjE9uoTpxG5pyLzr2rI2NMjDHmvY1E5EO81O/e9TUOLLkXA5m6T8lfjK9yAA==}
     engines: {node: '>=12'}
@@ -3509,6 +3515,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/darwin-x64@0.18.20:
+    resolution: {integrity: sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/freebsd-arm64@0.16.4:
     resolution: {integrity: sha512-Oup3G/QxBgvvqnXWrBed7xxkFNwAwJVHZcklWyQt7YCAL5bfUkaa6FVWnR78rNQiM8MqqLiT6ZTZSdUFuVIg1w==}
     engines: {node: '>=12'}
@@ -3527,6 +3542,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/freebsd-arm64@0.18.20:
+    resolution: {integrity: sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [freebsd]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/freebsd-x64@0.16.4:
     resolution: {integrity: sha512-vAP+eYOxlN/Bpo/TZmzEQapNS8W1njECrqkTpNgvXskkkJC2AwOXwZWai/Kc2vEFZUXQttx6UJbj9grqjD/+9Q==}
     engines: {node: '>=12'}
@@ -3545,6 +3569,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/freebsd-x64@0.18.20:
+    resolution: {integrity: sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [freebsd]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/linux-arm64@0.16.4:
     resolution: {integrity: sha512-2zXoBhv4r5pZiyjBKrOdFP4CXOChxXiYD50LRUU+65DkdS5niPFHbboKZd/c81l0ezpw7AQnHeoCy5hFrzzs4g==}
     engines: {node: '>=12'}
@@ -3563,6 +3596,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/linux-arm64@0.18.20:
+    resolution: {integrity: sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/linux-arm@0.16.4:
     resolution: {integrity: sha512-A47ZmtpIPyERxkSvIv+zLd6kNIOtJH03XA0Hy7jaceRDdQaQVGSDt4mZqpWqJYgDk9rg96aglbF6kCRvPGDSUA==}
     engines: {node: '>=12'}
@@ -3581,6 +3623,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/linux-arm@0.18.20:
+    resolution: {integrity: sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/linux-ia32@0.16.4:
     resolution: {integrity: sha512-uxdSrpe9wFhz4yBwt2kl2TxS/NWEINYBUFIxQtaEVtglm1eECvsj1vEKI0KX2k2wCe17zDdQ3v+jVxfwVfvvjw==}
     engines: {node: '>=12'}
@@ -3599,10 +3650,10 @@ packages:
     dev: true
     optional: true
 
-  /@esbuild/linux-loong64@0.15.16:
-    resolution: {integrity: sha512-SDLfP1uoB0HZ14CdVYgagllgrG7Mdxhkt4jDJOKl/MldKrkQ6vDJMZKl2+5XsEY/Lzz37fjgLQoJBGuAw/x8kQ==}
+  /@esbuild/linux-ia32@0.18.20:
+    resolution: {integrity: sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA==}
     engines: {node: '>=12'}
-    cpu: [loong64]
+    cpu: [ia32]
     os: [linux]
     requiresBuild: true
     dev: true
@@ -3626,6 +3677,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/linux-loong64@0.18.20:
+    resolution: {integrity: sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg==}
+    engines: {node: '>=12'}
+    cpu: [loong64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/linux-mips64el@0.16.4:
     resolution: {integrity: sha512-sD9EEUoGtVhFjjsauWjflZklTNr57KdQ6xfloO4yH1u7vNQlOfAlhEzbyBKfgbJlW7rwXYBdl5/NcZ+Mg2XhQA==}
     engines: {node: '>=12'}
@@ -3644,6 +3704,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/linux-mips64el@0.18.20:
+    resolution: {integrity: sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ==}
+    engines: {node: '>=12'}
+    cpu: [mips64el]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/linux-ppc64@0.16.4:
     resolution: {integrity: sha512-X1HSqHUX9D+d0l6/nIh4ZZJ94eQky8d8z6yxAptpZE3FxCWYWvTDd9X9ST84MGZEJx04VYUD/AGgciddwO0b8g==}
     engines: {node: '>=12'}
@@ -3662,6 +3731,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/linux-ppc64@0.18.20:
+    resolution: {integrity: sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/linux-riscv64@0.16.4:
     resolution: {integrity: sha512-97ANpzyNp0GTXCt6SRdIx1ngwncpkV/z453ZuxbnBROCJ5p/55UjhbaG23UdHj88fGWLKPFtMoU4CBacz4j9FA==}
     engines: {node: '>=12'}
@@ -3680,6 +3758,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/linux-riscv64@0.18.20:
+    resolution: {integrity: sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A==}
+    engines: {node: '>=12'}
+    cpu: [riscv64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/linux-s390x@0.16.4:
     resolution: {integrity: sha512-pUvPQLPmbEeJRPjP0DYTC1vjHyhrnCklQmCGYbipkep+oyfTn7GTBJXoPodR7ZS5upmEyc8lzAkn2o29wD786A==}
     engines: {node: '>=12'}
@@ -3698,6 +3785,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/linux-s390x@0.18.20:
+    resolution: {integrity: sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ==}
+    engines: {node: '>=12'}
+    cpu: [s390x]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/linux-x64@0.16.4:
     resolution: {integrity: sha512-N55Q0mJs3Sl8+utPRPBrL6NLYZKBCLLx0bme/+RbjvMforTGGzFvsRl4xLTZMUBFC1poDzBEPTEu5nxizQ9Nlw==}
     engines: {node: '>=12'}
@@ -3716,6 +3812,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/linux-x64@0.18.20:
+    resolution: {integrity: sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [linux]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/netbsd-x64@0.16.4:
     resolution: {integrity: sha512-LHSJLit8jCObEQNYkgsDYBh2JrJT53oJO2HVdkSYLa6+zuLJh0lAr06brXIkljrlI+N7NNW1IAXGn/6IZPi3YQ==}
     engines: {node: '>=12'}
@@ -3734,6 +3839,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/netbsd-x64@0.18.20:
+    resolution: {integrity: sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [netbsd]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/openbsd-x64@0.16.4:
     resolution: {integrity: sha512-nLgdc6tWEhcCFg/WVFaUxHcPK3AP/bh+KEwKtl69Ay5IBqUwKDaq/6Xk0E+fh/FGjnLwqFSsarsbPHeKM8t8Sw==}
     engines: {node: '>=12'}
@@ -3752,6 +3866,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/openbsd-x64@0.18.20:
+    resolution: {integrity: sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [openbsd]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/sunos-x64@0.16.4:
     resolution: {integrity: sha512-08SluG24GjPO3tXKk95/85n9kpyZtXCVwURR2i4myhrOfi3jspClV0xQQ0W0PYWHioJj+LejFMt41q+PG3mlAQ==}
     engines: {node: '>=12'}
@@ -3770,6 +3893,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/sunos-x64@0.18.20:
+    resolution: {integrity: sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [sunos]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/win32-arm64@0.16.4:
     resolution: {integrity: sha512-yYiRDQcqLYQSvNQcBKN7XogbrSvBE45FEQdH8fuXPl7cngzkCvpsG2H9Uey39IjQ6gqqc+Q4VXYHsQcKW0OMjQ==}
     engines: {node: '>=12'}
@@ -3788,6 +3920,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/win32-arm64@0.18.20:
+    resolution: {integrity: sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/win32-ia32@0.16.4:
     resolution: {integrity: sha512-5rabnGIqexekYkh9zXG5waotq8mrdlRoBqAktjx2W3kb0zsI83mdCwrcAeKYirnUaTGztR5TxXcXmQrEzny83w==}
     engines: {node: '>=12'}
@@ -3806,6 +3947,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/win32-ia32@0.18.20:
+    resolution: {integrity: sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@esbuild/win32-x64@0.16.4:
     resolution: {integrity: sha512-sN/I8FMPtmtT2Yw+Dly8Ur5vQ5a/RmC8hW7jO9PtPSQUPkowxWpcUZnqOggU7VwyT3Xkj6vcXWd3V/qTXwultQ==}
     engines: {node: '>=12'}
@@ -3824,6 +3974,15 @@ packages:
     dev: true
     optional: true
 
+  /@esbuild/win32-x64@0.18.20:
+    resolution: {integrity: sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [win32]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /@eslint-community/eslint-utils@4.4.0(eslint@8.50.0):
     resolution: {integrity: sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==}
     engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
@@ -12149,216 +12308,6 @@ packages:
       es6-symbol: 3.1.3
     dev: true
 
-  /esbuild-android-64@0.15.16:
-    resolution: {integrity: sha512-Vwkv/sT0zMSgPSVO3Jlt1pUbnZuOgtOQJkJkyyJFAlLe7BiT8e9ESzo0zQSx4c3wW4T6kGChmKDPMbWTgtliQA==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [android]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-android-arm64@0.15.16:
-    resolution: {integrity: sha512-lqfKuofMExL5niNV3gnhMUYacSXfsvzTa/58sDlBET/hCOG99Zmeh+lz6kvdgvGOsImeo6J9SW21rFCogNPLxg==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [android]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-darwin-64@0.15.16:
-    resolution: {integrity: sha512-wo2VWk/n/9V2TmqUZ/KpzRjCEcr00n7yahEdmtzlrfQ3lfMCf3Wa+0sqHAbjk3C6CKkR3WKK/whkMq5Gj4Da9g==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [darwin]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-darwin-arm64@0.15.16:
-    resolution: {integrity: sha512-fMXaUr5ou0M4WnewBKsspMtX++C1yIa3nJ5R2LSbLCfJT3uFdcRoU/NZjoM4kOMKyOD9Sa/2vlgN8G07K3SJnw==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [darwin]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-freebsd-64@0.15.16:
-    resolution: {integrity: sha512-UzIc0xlRx5x9kRuMr+E3+hlSOxa/aRqfuMfiYBXu2jJ8Mzej4lGL7+o6F5hzhLqWfWm1GWHNakIdlqg1ayaTNQ==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [freebsd]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-freebsd-arm64@0.15.16:
-    resolution: {integrity: sha512-8xyiYuGc0DLZphFQIiYaLHlfoP+hAN9RHbE+Ibh8EUcDNHAqbQgUrQg7pE7Bo00rXmQ5Ap6KFgcR0b4ALZls1g==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [freebsd]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-linux-32@0.15.16:
-    resolution: {integrity: sha512-iGijUTV+0kIMyUVoynK0v+32Oi8yyp0xwMzX69GX+5+AniNy/C/AL1MjFTsozRp/3xQPl7jVux/PLe2ds10/2w==}
-    engines: {node: '>=12'}
-    cpu: [ia32]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-linux-64@0.15.16:
-    resolution: {integrity: sha512-tuSOjXdLw7VzaUj89fIdAaQT7zFGbKBcz4YxbWrOiXkwscYgE7HtTxUavreBbnRkGxKwr9iT/gmeJWNm4djy/g==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-linux-arm64@0.15.16:
-    resolution: {integrity: sha512-mPYksnfHnemNrvjrDhZyixL/AfbJN0Xn9S34ZOHYdh6/jJcNd8iTsv3JwJoEvTJqjMggjMhGUPJAdjnFBHoH8A==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-linux-arm@0.15.16:
-    resolution: {integrity: sha512-XKcrxCEXDTOuoRj5l12tJnkvuxXBMKwEC5j0JISw3ziLf0j4zIwXbKbTmUrKFWbo6ZgvNpa7Y5dnbsjVvH39bQ==}
-    engines: {node: '>=12'}
-    cpu: [arm]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-linux-mips64le@0.15.16:
-    resolution: {integrity: sha512-kSJO2PXaxfm0pWY39+YX+QtpFqyyrcp0ZeI8QPTrcFVQoWEPiPVtOfTZeS3ZKedfH+Ga38c4DSzmKMQJocQv6A==}
-    engines: {node: '>=12'}
-    cpu: [mips64el]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-linux-ppc64le@0.15.16:
-    resolution: {integrity: sha512-NimPikwkBY0yGABw6SlhKrtT35sU4O23xkhlrTT/O6lSxv3Pm5iSc6OYaqVAHWkLdVf31bF4UDVFO+D990WpAA==}
-    engines: {node: '>=12'}
-    cpu: [ppc64]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-linux-riscv64@0.15.16:
-    resolution: {integrity: sha512-ty2YUHZlwFOwp7pR+J87M4CVrXJIf5ZZtU/umpxgVJBXvWjhziSLEQxvl30SYfUPq0nzeWKBGw5i/DieiHeKfw==}
-    engines: {node: '>=12'}
-    cpu: [riscv64]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-linux-s390x@0.15.16:
-    resolution: {integrity: sha512-VkZaGssvPDQtx4fvVdZ9czezmyWyzpQhEbSNsHZZN0BHvxRLOYAQ7sjay8nMQwYswP6O2KlZluRMNPYefFRs+w==}
-    engines: {node: '>=12'}
-    cpu: [s390x]
-    os: [linux]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-netbsd-64@0.15.16:
-    resolution: {integrity: sha512-ElQ9rhdY51et6MJTWrCPbqOd/YuPowD7Cxx3ee8wlmXQQVW7UvQI6nSprJ9uVFQISqSF5e5EWpwWqXZsECLvXg==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [netbsd]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-openbsd-64@0.15.16:
-    resolution: {integrity: sha512-KgxMHyxMCT+NdLQE1zVJEsLSt2QQBAvJfmUGDmgEq8Fvjrf6vSKB00dVHUEDKcJwMID6CdgCpvYNt999tIYhqA==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [openbsd]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-sunos-64@0.15.16:
-    resolution: {integrity: sha512-exSAx8Phj7QylXHlMfIyEfNrmqnLxFqLxdQF6MBHPdHAjT7fsKaX6XIJn+aQEFiOcE4X8e7VvdMCJ+WDZxjSRQ==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [sunos]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-windows-32@0.15.16:
-    resolution: {integrity: sha512-zQgWpY5pUCSTOwqKQ6/vOCJfRssTvxFuEkpB4f2VUGPBpdddZfdj8hbZuFRdZRPIVHvN7juGcpgCA/XCF37mAQ==}
-    engines: {node: '>=12'}
-    cpu: [ia32]
-    os: [win32]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-windows-64@0.15.16:
-    resolution: {integrity: sha512-HjW1hHRLSncnM3MBCP7iquatHVJq9l0S2xxsHHj4yzf4nm9TU4Z7k4NkeMlD/dHQ4jPlQQhwcMvwbJiOefSuZw==}
-    engines: {node: '>=12'}
-    cpu: [x64]
-    os: [win32]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild-windows-arm64@0.15.16:
-    resolution: {integrity: sha512-oCcUKrJaMn04Vxy9Ekd8x23O8LoU01+4NOkQ2iBToKgnGj5eo1vU9i27NQZ9qC8NFZgnQQZg5oZWAejmbsppNA==}
-    engines: {node: '>=12'}
-    cpu: [arm64]
-    os: [win32]
-    requiresBuild: true
-    dev: true
-    optional: true
-
-  /esbuild@0.15.16:
-    resolution: {integrity: sha512-o6iS9zxdHrrojjlj6pNGC2NAg86ECZqIETswTM5KmJitq+R1YmahhWtMumeQp9lHqJaROGnsBi2RLawGnfo5ZQ==}
-    engines: {node: '>=12'}
-    hasBin: true
-    requiresBuild: true
-    optionalDependencies:
-      '@esbuild/android-arm': 0.15.16
-      '@esbuild/linux-loong64': 0.15.16
-      esbuild-android-64: 0.15.16
-      esbuild-android-arm64: 0.15.16
-      esbuild-darwin-64: 0.15.16
-      esbuild-darwin-arm64: 0.15.16
-      esbuild-freebsd-64: 0.15.16
-      esbuild-freebsd-arm64: 0.15.16
-      esbuild-linux-32: 0.15.16
-      esbuild-linux-64: 0.15.16
-      esbuild-linux-arm: 0.15.16
-      esbuild-linux-arm64: 0.15.16
-      esbuild-linux-mips64le: 0.15.16
-      esbuild-linux-ppc64le: 0.15.16
-      esbuild-linux-riscv64: 0.15.16
-      esbuild-linux-s390x: 0.15.16
-      esbuild-netbsd-64: 0.15.16
-      esbuild-openbsd-64: 0.15.16
-      esbuild-sunos-64: 0.15.16
-      esbuild-windows-32: 0.15.16
-      esbuild-windows-64: 0.15.16
-      esbuild-windows-arm64: 0.15.16
-    dev: true
-
   /esbuild@0.16.4:
     resolution: {integrity: sha512-qQrPMQpPTWf8jHugLWHoGqZjApyx3OEm76dlTXobHwh/EBbavbRdjXdYi/GWr43GyN0sfpap14GPkb05NH3ROA==}
     engines: {node: '>=12'}
@@ -12419,6 +12368,36 @@ packages:
       '@esbuild/win32-x64': 0.18.10
     dev: true
 
+  /esbuild@0.18.20:
+    resolution: {integrity: sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA==}
+    engines: {node: '>=12'}
+    hasBin: true
+    requiresBuild: true
+    optionalDependencies:
+      '@esbuild/android-arm': 0.18.20
+      '@esbuild/android-arm64': 0.18.20
+      '@esbuild/android-x64': 0.18.20
+      '@esbuild/darwin-arm64': 0.18.20
+      '@esbuild/darwin-x64': 0.18.20
+      '@esbuild/freebsd-arm64': 0.18.20
+      '@esbuild/freebsd-x64': 0.18.20
+      '@esbuild/linux-arm': 0.18.20
+      '@esbuild/linux-arm64': 0.18.20
+      '@esbuild/linux-ia32': 0.18.20
+      '@esbuild/linux-loong64': 0.18.20
+      '@esbuild/linux-mips64el': 0.18.20
+      '@esbuild/linux-ppc64': 0.18.20
+      '@esbuild/linux-riscv64': 0.18.20
+      '@esbuild/linux-s390x': 0.18.20
+      '@esbuild/linux-x64': 0.18.20
+      '@esbuild/netbsd-x64': 0.18.20
+      '@esbuild/openbsd-x64': 0.18.20
+      '@esbuild/sunos-x64': 0.18.20
+      '@esbuild/win32-arm64': 0.18.20
+      '@esbuild/win32-ia32': 0.18.20
+      '@esbuild/win32-x64': 0.18.20
+    dev: true
+
   /escalade@3.1.1:
     resolution: {integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==}
     engines: {node: '>=6'}
@@ -13724,6 +13703,14 @@ packages:
     requiresBuild: true
     optional: true
 
+  /fsevents@2.3.3:
+    resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
+    engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
+    os: [darwin]
+    requiresBuild: true
+    dev: true
+    optional: true
+
   /fstream@1.0.12:
     resolution: {integrity: sha512-WvJ193OHa0GHPEL+AycEJgxvBEwyfRkN1vhjca23OaPVMCaLCXTd5qAu82AjTcgP1UJmytkOKb63Ypde7raDIg==}
     engines: {node: '>=0.6'}
@@ -13850,6 +13837,12 @@ packages:
   /get-tsconfig@4.4.0:
     resolution: {integrity: sha512-0Gdjo/9+FzsYhXCEFueo2aY1z1tpXrxWZzP7k8ul9qt1U5o8rYJwTJYmaeHdrVosYIVYkOy2iwCJ9FdpocJhPQ==}
 
+  /get-tsconfig@4.7.2:
+    resolution: {integrity: sha512-wuMsz4leaj5hbGgg4IvDU0bqJagpftG5l5cXIAvo8uZrqn0NJqwtfupTN00VnkQJPcIRrxYrm1Ue24btpCha2A==}
+    dependencies:
+      resolve-pkg-maps: 1.0.0
+    dev: true
+
   /get-value@2.0.6:
     resolution: {integrity: sha512-Ln0UQDlxH1BapMu3GPtf7CuYNwRZf2gwCuPqbyG6pB8WfmFpzqcy4xtAaAMUhnNqjMKTiCPZG2oMT3YSx8U2NA==}
     engines: {node: '>=0.10.0'}
@@ -13945,16 +13938,16 @@ packages:
       - supports-color
     dev: true
 
-  /glob@10.2.6:
-    resolution: {integrity: sha512-U/rnDpXJGF414QQQZv5uVsabTVxMSwzS5CH0p3DRCIV6ownl4f7PzGnkGmvlum2wB+9RlJWJZ6ACU1INnBqiPA==}
+  /glob@10.3.10:
+    resolution: {integrity: sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==}
     engines: {node: '>=16 || 14 >=14.17'}
     hasBin: true
     dependencies:
       foreground-child: 3.1.1
-      jackspeak: 2.2.0
+      jackspeak: 2.3.6
       minimatch: 9.0.1
       minipass: 5.0.0
-      path-scurry: 1.7.0
+      path-scurry: 1.10.1
     dev: true
 
   /glob@7.1.6:
@@ -15646,8 +15639,8 @@ packages:
       has-symbols: 1.0.3
       reflect.getprototypeof: 1.0.4
 
-  /jackspeak@2.2.0:
-    resolution: {integrity: sha512-r5XBrqIJfwRIjRt/Xr5fv9Wh09qyhHfKnYddDlpM+ibRR20qrYActpCAgU6U+d53EOEjzkvxPMVHSlgR7leXrQ==}
+  /jackspeak@2.3.6:
+    resolution: {integrity: sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==}
     engines: {node: '>=14'}
     dependencies:
       '@isaacs/cliui': 8.0.2
@@ -19264,8 +19257,8 @@ packages:
       path-root-regex: 0.1.2
     dev: true
 
-  /path-scurry@1.7.0:
-    resolution: {integrity: sha512-UkZUeDjczjYRE495+9thsgcVgsaCPkaw80slmfVFgllxY+IO8ubTsOpFVjDPROBqJdHfVPUFRHPBV/WciOVfWg==}
+  /path-scurry@1.10.1:
+    resolution: {integrity: sha512-MkhCqzzBEpPvxxQ71Md0b1Kk51W01lrYvlMzSUaIzNsODdd7mqhiimSZlr+VegAz5Z6Vzt9Xg2ttE//XBhH3EQ==}
     engines: {node: '>=16 || 14 >=14.17'}
     dependencies:
       lru-cache: 9.1.1
@@ -22004,6 +21997,10 @@ packages:
       value-or-function: 3.0.0
     dev: true
 
+  /resolve-pkg-maps@1.0.0:
+    resolution: {integrity: sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw==}
+    dev: true
+
   /resolve-url@0.2.1:
     resolution: {integrity: sha512-ZuF55hVUQaaczgOIwqWzkEcEidmlD/xl44x1UZnhOXcYuFN2S6+rcxpG+C1N3So0wvNI3DmJICUFfu2SxhBmvg==}
     deprecated: https://github.com/lydell/resolve-url#deprecated
@@ -22105,12 +22102,12 @@ packages:
     dependencies:
       glob: 7.2.3
 
-  /rimraf@5.0.1:
-    resolution: {integrity: sha512-OfFZdwtd3lZ+XZzYP/6gTACubwFcHdLRqS9UX3UwpU2dnGQYkPFISRwvM3w9IiB2w7bW5qGo/uAwE4SmXXSKvg==}
+  /rimraf@5.0.5:
+    resolution: {integrity: sha512-CqDakW+hMe/Bz202FPEymy68P+G50RfMQK+Qo5YUqc9SPipvbGjCGKd0RSKEelbsfQuw3g5NZDSrlZZAJurH1A==}
     engines: {node: '>=14'}
     hasBin: true
     dependencies:
-      glob: 10.2.6
+      glob: 10.3.10
     dev: true
 
   /ripemd160@2.0.2:
@@ -24185,15 +24182,15 @@ packages:
       typescript: 5.2.2
     dev: true
 
-  /tsx@3.12.7:
-    resolution: {integrity: sha512-C2Ip+jPmqKd1GWVQDvz/Eyc6QJbGfE7NrR3fx5BpEHMZsEHoIxHL1j+lKdGobr8ovEyqeNkPLSKp6SCSOt7gmw==}
+  /tsx@3.13.0:
+    resolution: {integrity: sha512-rjmRpTu3as/5fjNq/kOkOtihgLxuIz6pbKdj9xwP4J5jOLkBxw/rjN5ANw+KyrrOXV5uB7HC8+SrrSJxT65y+A==}
     hasBin: true
     dependencies:
-      '@esbuild-kit/cjs-loader': 2.4.2
-      '@esbuild-kit/core-utils': 3.0.0
-      '@esbuild-kit/esm-loader': 2.5.5
+      esbuild: 0.18.20
+      get-tsconfig: 4.7.2
+      source-map-support: 0.5.21
     optionalDependencies:
-      fsevents: 2.3.2
+      fsevents: 2.3.3
     dev: true
 
   /tty-browserify@0.0.0: