@opengovsg/confetti 0.0.4 → 0.0.5

package/build/confetti.css

@@ -1,7 +1,7 @@
 :root {
   --confetti-font-scale: 16px;
   /* Define CSS Variables with defaults */
-  --confetti-box-padding: 20px 24px;
+  --confetti-box-padding: 24px;
   --confetti-max-width: 300px;
   --confetti-z-index: 2147483647;
   --confetti-border-color: #e4e4e7;
@@ -80,7 +80,7 @@
 .confetti {
   font-family: var(--confetti-font-family);
   overflow: hidden;
-  padding: 24px;
+  padding: var(--confetti-box-padding);
   border-radius: var(--confetti-border-radius);
   border: 1px solid var(--confetti-border-color);
   display: flex;
@@ -179,6 +179,45 @@
     }
   }
 
+  .cf-response-choices-tag {
+    flex-direction: row;
+    flex-wrap: wrap;
+    gap: 8px;
+  }
+
+  .cf-tag-input {
+    display: none;
+
+    &[data-visible='true'] {
+      display: inline;
+    }
+  }
+
+  .cf-tag {
+    border-radius: 8px;
+    padding: 6px 12px;
+    font-weight: 500;
+    font-size: 0.875em;
+    transition:
+      background 200ms ease-out,
+      border-color 200ms ease-out;
+
+    &[data-selected='true'] {
+      background: var(--confetti-indicator-active-bg-color);
+      border-color: var(--confetti-indicator-active-bg-color);
+      color: var(--confetti-indicator-active-dot-color);
+    }
+
+    &[data-focus-visible='true'] {
+      outline: 2px solid var(--confetti-outline-color);
+      outline-offset: 2px;
+    }
+
+    &:active {
+      scale: 0.96;
+    }
+  }
+
   .cf-radio,
   .cf-checkbox {
     cursor: pointer;
@@ -335,6 +374,11 @@
         font-weight: 500;
       }
 
+      .cf-label-optional {
+        font-weight: 400;
+        color: var(--confetti-text-subtle-color);
+      }
+
       .cf-description {
         font-size: 0.875em;
         line-height: 20px;

package/build/index.d.ts

@@ -1,169 +1,8 @@
+import { a as MultiSelectQuestionProperties, c as StatementQuestionProperties, i as PublicGetSurveyOutput, l as TextQuestionProperties, n as ConfettiState, o as RatingQuestionProperties, r as Question, s as SingleSelectQuestionProperties, t as Answer } from "./types-qVyTr8wu.js";
 import * as react0 from "react";
 import { HTMLAttributes, PropsWithChildren } from "react";
-import { z } from "zod/v4/mini";
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 
-//#region ../validators/src/questions/properties.d.ts
-
-declare const ratingQuestionSchema: z.ZodMiniObject<{
-  type: z.ZodMiniLiteral<"rating">;
-  scale: z.ZodMiniNumber<number>;
-  labels: z.ZodMiniOptional<z.ZodMiniObject<{
-    lower: z.ZodMiniOptional<z.ZodMiniPipe<z.ZodMiniString<string>, z.ZodMiniTransform<string | undefined, string>>>;
-    upper: z.ZodMiniOptional<z.ZodMiniPipe<z.ZodMiniString<string>, z.ZodMiniTransform<string | undefined, string>>>;
-  }, z.core.$strip>>;
-  display: z.ZodMiniOptional<z.ZodMiniLiteral<"number" | "star" | "emoji" | "tiffany">>;
-}, z.core.$strip>;
-type RatingQuestion = z.infer<typeof ratingQuestionSchema>;
-declare const textQuestionSchema: z.ZodMiniObject<{
-  type: z.ZodMiniLiteral<"open-ended">;
-  max: z.ZodMiniNumber<number>;
-}, z.core.$strip>;
-type TextQuestion = z.infer<typeof textQuestionSchema>;
-declare const singleSelectQuestionSchema: z.ZodMiniObject<{
-  type: z.ZodMiniLiteral<"single-select">;
-  options: z.ZodMiniArray<z.ZodMiniObject<{
-    value: z.ZodMiniString<string>;
-    description: z.ZodMiniOptional<z.ZodMiniString<string>>;
-  }, z.core.$strip>>;
-  editable: z.ZodMiniNullable<z.ZodMiniObject<{
-    label: z.ZodMiniString<string>;
-    max: z.ZodMiniNumber<number>;
-    description: z.ZodMiniOptional<z.ZodMiniString<string>>;
-  }, z.core.$strip>>;
-}, z.core.$strip>;
-type SingleSelectQuestion = z.infer<typeof singleSelectQuestionSchema>;
-declare const multiSelectQuestionSchema: z.ZodMiniObject<{
-  type: z.ZodMiniLiteral<"multi-select">;
-  options: z.ZodMiniArray<z.ZodMiniObject<{
-    value: z.ZodMiniString<string>;
-    description: z.ZodMiniOptional<z.ZodMiniString<string>>;
-  }, z.core.$strip>>;
-  editable: z.ZodMiniNullable<z.ZodMiniObject<{
-    label: z.ZodMiniString<string>;
-    max: z.ZodMiniNumber<number>;
-    description: z.ZodMiniOptional<z.ZodMiniString<string>>;
-  }, z.core.$strip>>;
-  max: z.ZodMiniOptional<z.ZodMiniNumber<number>>;
-}, z.core.$strip>;
-type MultiSelectQuestion = z.infer<typeof multiSelectQuestionSchema>;
-//#endregion
-//#region ../validators/src/survey.d.ts
-declare const publicGetSurveyOutputSchema: z.ZodMiniObject<{
-  title: z.ZodMiniString<string>;
-  description: z.ZodMiniNullable<z.ZodMiniString<string>>;
-  questions: z.ZodMiniArray<z.ZodMiniObject<{
-    id: z.ZodMiniString<string>;
-    title: z.ZodMiniString<string>;
-    description: z.ZodMiniNullable<z.ZodMiniString<string>>;
-    position: z.ZodMiniNumber<number>;
-    required: z.ZodMiniBoolean<boolean>;
-    properties: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
-      type: z.ZodMiniLiteral<"rating">;
-      scale: z.ZodMiniNumber<number>;
-      labels: z.ZodMiniOptional<z.ZodMiniObject<{
-        lower: z.ZodMiniOptional<z.ZodMiniPipe<z.ZodMiniString<string>, z.ZodMiniTransform<string | undefined, string>>>;
-        upper: z.ZodMiniOptional<z.ZodMiniPipe<z.ZodMiniString<string>, z.ZodMiniTransform<string | undefined, string>>>;
-      }, z.core.$strip>>;
-      display: z.ZodMiniOptional<z.ZodMiniLiteral<"number" | "star" | "emoji" | "tiffany">>;
-    }, z.core.$strip>, z.ZodMiniObject<{
-      type: z.ZodMiniLiteral<"single-select">;
-      options: z.ZodMiniArray<z.ZodMiniObject<{
-        value: z.ZodMiniString<string>;
-        description: z.ZodMiniOptional<z.ZodMiniString<string>>;
-      }, z.core.$strip>>;
-      editable: z.ZodMiniNullable<z.ZodMiniObject<{
-        label: z.ZodMiniString<string>;
-        max: z.ZodMiniNumber<number>;
-        description: z.ZodMiniOptional<z.ZodMiniString<string>>;
-      }, z.core.$strip>>;
-    }, z.core.$strip>, z.ZodMiniObject<{
-      type: z.ZodMiniLiteral<"open-ended">;
-      max: z.ZodMiniNumber<number>;
-    }, z.core.$strip>, z.ZodMiniObject<{
-      type: z.ZodMiniLiteral<"multi-select">;
-      options: z.ZodMiniArray<z.ZodMiniObject<{
-        value: z.ZodMiniString<string>;
-        description: z.ZodMiniOptional<z.ZodMiniString<string>>;
-      }, z.core.$strip>>;
-      editable: z.ZodMiniNullable<z.ZodMiniObject<{
-        label: z.ZodMiniString<string>;
-        max: z.ZodMiniNumber<number>;
-        description: z.ZodMiniOptional<z.ZodMiniString<string>>;
-      }, z.core.$strip>>;
-      max: z.ZodMiniOptional<z.ZodMiniNumber<number>>;
-    }, z.core.$strip>], "type">;
-    routingLogic: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
-      type: z.ZodMiniLiteral<"always">;
-      target: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
-        type: z.ZodMiniLiteral<"next">;
-      }, z.core.$strip>, z.ZodMiniObject<{
-        type: z.ZodMiniLiteral<"jump">;
-        target: z.ZodMiniNumber<number>;
-      }, z.core.$strip>, z.ZodMiniObject<{
-        type: z.ZodMiniLiteral<"end">;
-      }, z.core.$strip>], "type">;
-    }, z.core.$strip>, z.ZodMiniObject<{
-      type: z.ZodMiniLiteral<"switch">;
-      cases: z.ZodMiniArray<z.ZodMiniObject<{
-        type: z.ZodMiniLiteral<"binary-operator">;
-        operator: z.ZodMiniUnion<readonly [z.ZodMiniLiteral<"equal">, z.ZodMiniLiteral<"not-equal">, z.ZodMiniLiteral<"greater">, z.ZodMiniLiteral<"greater-or-equal">, z.ZodMiniLiteral<"less">, z.ZodMiniLiteral<"less-or-equal">, z.ZodMiniLiteral<"contains">, z.ZodMiniLiteral<"not-contains">]>;
-        value: z.ZodMiniObject<{
-          type: z.ZodMiniLiteral<"value">;
-          value: z.ZodMiniUnion<readonly [z.ZodMiniString<string>, z.ZodMiniNumber<number>]>;
-        }, z.core.$strip>;
-        target: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
-          type: z.ZodMiniLiteral<"next">;
-        }, z.core.$strip>, z.ZodMiniObject<{
-          type: z.ZodMiniLiteral<"jump">;
-          target: z.ZodMiniNumber<number>;
-        }, z.core.$strip>, z.ZodMiniObject<{
-          type: z.ZodMiniLiteral<"end">;
-        }, z.core.$strip>], "type">;
-      }, z.core.$strip>>;
-      default: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
-        type: z.ZodMiniLiteral<"next">;
-      }, z.core.$strip>, z.ZodMiniObject<{
-        type: z.ZodMiniLiteral<"jump">;
-        target: z.ZodMiniNumber<number>;
-      }, z.core.$strip>, z.ZodMiniObject<{
-        type: z.ZodMiniLiteral<"end">;
-      }, z.core.$strip>], "type">;
-    }, z.core.$strip>], "type">;
-  }, z.core.$strip>>;
-  confirmation: z.ZodMiniObject<{
-    title: z.ZodMiniString<string>;
-    description: z.ZodMiniString<string>;
-    buttonText: z.ZodMiniString<string>;
-  }, z.core.$strip>;
-}, z.core.$strip>;
-type PublicGetSurveyOutput = z.infer<typeof publicGetSurveyOutputSchema>;
-//#endregion
-//#region src/core/types.d.ts
-type Question = {
-  visible: boolean;
-  error?: string;
-} & PublicGetSurveyOutput['questions'][number];
-type Answer = string | number | string[] | undefined;
-interface ConfettiState {
-  questions: Question[];
-  current: number;
-  update: ({
-    question,
-    answer
-  }: {
-    question: number;
-    answer: Answer;
-  }) => {
-    next?: number;
-    error?: string;
-  };
-  submit: () => void;
-  isCompleted: boolean;
-  isSubmitted: boolean;
-  errors: Record<Question['id'], string>;
-}
-//#endregion
 //#region src/core/ConfettiController.d.ts
 interface ConfettiControllerProps {
   children: (props: ConfettiState) => React.ReactElement;
@@ -180,7 +19,7 @@ declare const ConfettiController: ({
   shouldAutoSubmit,
   onFinished,
   children
-}: ConfettiControllerProps) => react_jsx_runtime3.JSX.Element;
+}: ConfettiControllerProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/core/ConfettiProvider.d.ts
 interface ConfettiContextValue {
@@ -214,7 +53,7 @@ declare const ConfettiProvider: ({
   metadata,
   isSurveyVisible: isSurveyVisibleInput,
   apiBaseUrl
-}: ConfettiProviderProps) => react_jsx_runtime3.JSX.Element | null;
+}: ConfettiProviderProps) => react_jsx_runtime2.JSX.Element | null;
 declare const useConfetti: () => ConfettiContextValue;
 //#endregion
 //#region src/components/Confetti.d.ts
@@ -224,7 +63,7 @@ declare const Confetti: ({
   onFinished,
   shouldAutoSubmit,
   ...props
-}: ConfettiProps & Pick<ConfettiControllerProps, "children" | "shouldAutoSubmit">) => react_jsx_runtime3.JSX.Element;
+}: ConfettiProps & Pick<ConfettiControllerProps, "children" | "shouldAutoSubmit">) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/ThankYouMessage.d.ts
 interface ThankYouMessageProps {
@@ -241,7 +80,7 @@ declare const ThankYouMessage: ({
   title,
   description,
   classNames
-}: ThankYouMessageProps) => react_jsx_runtime3.JSX.Element | null;
+}: ThankYouMessageProps) => react_jsx_runtime2.JSX.Element | null;
 //#endregion
 //#region src/components/container/PopoverContainer.d.ts
 interface PopoverContainerProps {
@@ -263,7 +102,7 @@ declare const PopoverContainer: ({
   containerProps,
   onDismiss,
   closeOnFinishMs
-}: PopoverContainerProps) => react_jsx_runtime3.JSX.Element;
+}: PopoverContainerProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/questions/types.d.ts
 type Question$1 = PublicGetSurveyOutput['questions'][number];
@@ -286,16 +125,17 @@ declare const SurveyQuestionFactory: ({
   question,
   onChange,
   error
-}: SurveyQuestionFactoryProps) => react_jsx_runtime3.JSX.Element;
+}: SurveyQuestionFactoryProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/questions/Rating.d.ts
 interface RatingProps extends BaseFieldProps {
-  properties: RatingQuestion;
+  properties: RatingQuestionProperties;
   classNames?: {
     question?: string;
     header?: string;
     title?: string;
     description?: string;
+    optionalLabel?: string;
     ratingSection?: string;
     ratingDisplay?: string;
     ratingText?: string;
@@ -320,15 +160,16 @@ declare const Rating: ({
   id,
   error,
   required
-}: RatingProps) => react_jsx_runtime3.JSX.Element;
+}: RatingProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/questions/FreeText.d.ts
 interface FreeTextProps extends BaseFieldProps {
-  properties: TextQuestion;
+  properties: TextQuestionProperties;
   classNames?: {
     question?: string;
     header?: string;
     title?: string;
+    optionalLabel?: string;
     description?: string;
     textarea?: string;
     error?: string;
@@ -343,17 +184,18 @@ declare const FreeText: ({
   classNames,
   required,
   error
-}: FreeTextProps) => react_jsx_runtime3.JSX.Element;
+}: FreeTextProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/questions/SingleChoice.d.ts
 interface SingleChoiceProps extends BaseFieldProps {
-  properties: SingleSelectQuestion;
+  properties: SingleSelectQuestionProperties;
   classNames?: {
     question?: string;
     header?: string;
     label?: string;
     title?: string;
     description?: string;
+    optionalLabel?: string;
     group?: string;
     radio?: string;
     indicator?: string;
@@ -372,20 +214,23 @@ declare const SingleChoice: ({
   id,
   required,
   error
-}: SingleChoiceProps) => react_jsx_runtime3.JSX.Element;
+}: SingleChoiceProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/questions/MultiChoice.d.ts
 interface MultiChoiceProps extends BaseFieldProps {
-  properties: MultiSelectQuestion;
+  properties: MultiSelectQuestionProperties;
   classNames?: {
     question?: string;
     header?: string;
     label?: string;
     title?: string;
     description?: string;
+    optionalLabel?: string;
     choiceDescription?: string;
     group?: string;
     checkbox?: string;
+    tag?: string;
+    tagLabel?: string;
     indicator?: string;
     svg?: string;
     othersChoice?: string;
@@ -402,7 +247,25 @@ declare const MultiChoice: ({
   id,
   required,
   error
-}: MultiChoiceProps) => react_jsx_runtime3.JSX.Element;
+}: MultiChoiceProps) => react_jsx_runtime2.JSX.Element;
+//#endregion
+//#region src/components/questions/Statement.d.ts
+interface StatementProps extends BaseFieldProps {
+  properties: StatementQuestionProperties;
+  classNames?: {
+    question?: string;
+    header?: string;
+    title?: string;
+    description?: string;
+    ctaButton?: string;
+  };
+}
+declare const Statement: ({
+  properties: _properties,
+  title,
+  description,
+  classNames
+}: StatementProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/presentation/Flow.d.ts
 type ChildField = (_: {
@@ -421,7 +284,7 @@ declare const Flow: ({
   children,
   question,
   isLastQuestion
-}: FlowProps) => react_jsx_runtime3.JSX.Element;
+}: FlowProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/presentation/Embed.d.ts
 declare const Embed: ({
@@ -431,10 +294,10 @@ declare const Embed: ({
 }: PropsWithChildren<{
   isCompleted: boolean;
   onSubmit: () => void;
-}>) => react_jsx_runtime3.JSX.Element;
+}>) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/templates/EmbeddedConfetti.d.ts
-declare const EmbeddedConfetti: (props: ConfettiProps) => react_jsx_runtime3.JSX.Element;
+declare const EmbeddedConfetti: (props: ConfettiProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/templates/PopoverConfetti.d.ts
 interface PopoverConfettiProps extends ConfettiProps {
@@ -449,10 +312,10 @@ interface PopoverConfettiProps extends ConfettiProps {
 declare const PopoverConfetti: ({
   closeOnFinishMs,
   ...props
-}: PopoverConfettiProps) => react_jsx_runtime3.JSX.Element;
+}: PopoverConfettiProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/templates/StepperConfetti.d.ts
-declare const StepperConfetti: (props: ConfettiProps) => react_jsx_runtime3.JSX.Element;
+declare const StepperConfetti: (props: ConfettiProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/hooks/useVisibleAfterDelay.d.ts
 interface UseVisibleAfterDelayOptions {
@@ -494,5 +357,5 @@ declare const useVisibleAfterScroll: ({
   isVisible: boolean;
 };
 //#endregion
-export { type Answer, Confetti, ConfettiContext, ConfettiController, type ConfettiControllerProps, type ConfettiProps, ConfettiProvider, type ConfettiProviderProps, type ConfettiState, Embed, EmbeddedConfetti, Flow, FreeText, type FreeTextProps, MultiChoice, type MultiChoiceProps, PopoverConfetti, PopoverContainer, type PopoverContainerProps, type Question, Rating, type RatingProps, SingleChoice, type SingleChoiceProps, StepperConfetti, SurveyQuestionFactory, type SurveyQuestionFactoryProps, ThankYouMessage, useConfetti, useVisibleAfterDelay, useVisibleAfterPageVisits, useVisibleAfterScroll, useVisibleAfterSessionPageVisits };
+export { type Answer, Confetti, ConfettiContext, ConfettiController, type ConfettiControllerProps, type ConfettiProps, ConfettiProvider, type ConfettiProviderProps, type ConfettiState, Embed, EmbeddedConfetti, Flow, FreeText, type FreeTextProps, MultiChoice, type MultiChoiceProps, PopoverConfetti, PopoverContainer, type PopoverContainerProps, type Question, Rating, type RatingProps, SingleChoice, type SingleChoiceProps, Statement, type StatementProps, StepperConfetti, SurveyQuestionFactory, type SurveyQuestionFactoryProps, ThankYouMessage, useConfetti, useVisibleAfterDelay, useVisibleAfterPageVisits, useVisibleAfterScroll, useVisibleAfterSessionPageVisits };
 //# sourceMappingURL=index.d.ts.map

package/build/index.js

@@ -1,3 +1,4 @@
+import { n as isVisible, t as evaluateCondition } from "./routing-DjtQKwsR.js";
 import { ErrorBoundary } from "react-error-boundary";
 import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
 import { useLocalStorage, useSessionStorage, useTimeout } from "usehooks-ts";
@@ -55,8 +56,16 @@ const alwaysConditionSchema = z.object({
 });
 const routingLogicSchema = z.discriminatedUnion("type", [alwaysConditionSchema, switchConditionSchema]);
 
+//#endregion
+//#region ../validators/src/url.ts
+const urlSchema = z.string().check(z.trim(), z.url({
+	protocol: /^(https|mailto)/,
+	error: "Link must start with https:// or mailto:"
+}));
+
 //#endregion
 //#region ../validators/src/questions/properties.ts
+const buttonLabelSchema = z.optional(z.string().check(z.trim(), z.maxLength(50)));
 const optionSchema = z.object({
 	value: z.string().check(z.trim(), z.minLength(1, { error: "Value is required" })),
 	description: z.optional(z.string().check(z.trim()))
@@ -66,8 +75,9 @@ const editableSchema = z.nullable(z.object({
 	max: z.number(),
 	description: z.optional(z.string().check(z.trim()))
 }));
-const ratingQuestionSchema = z.object({
+const ratingQuestionPropertiesSchema = z.object({
 	type: z.literal("rating"),
+	buttonLabel: buttonLabelSchema,
 	scale: z.number().check(z.minimum(2), z.maximum(10)),
 	labels: z.optional(z.object({
 		lower: z.optional(z.pipe(z.string().check(z.trim()), z.transform((val) => val === "" ? void 0 : val))),
@@ -80,26 +90,36 @@ const ratingQuestionSchema = z.object({
 		"tiffany"
 	]))
 });
-const textQuestionSchema = z.object({
+const textQuestionPropertiesSchema = z.object({
 	type: z.literal("open-ended"),
+	buttonLabel: buttonLabelSchema,
 	max: z.number()
 });
-const singleSelectQuestionSchema = z.object({
+const singleSelectQuestionPropertiesSchema = z.object({
 	type: z.literal("single-select"),
 	options: z.array(optionSchema),
+	buttonLabel: buttonLabelSchema,
 	editable: editableSchema
 });
-const multiSelectQuestionSchema = z.object({
+const multiSelectQuestionPropertiesSchema = z.object({
 	type: z.literal("multi-select"),
+	buttonLabel: buttonLabelSchema,
 	options: z.array(optionSchema),
 	editable: editableSchema,
-	max: z.optional(z.number())
+	max: z.optional(z.number()),
+	display: z.optional(z.literal(["checkbox", "tag"]))
+});
+const statementQuestionPropertiesSchema = z.object({
+	type: z.literal("statement"),
+	buttonLabel: buttonLabelSchema,
+	buttonUrl: z.optional(urlSchema)
 });
 const questionPropertiesSchema = z.discriminatedUnion("type", [
-	ratingQuestionSchema,
-	singleSelectQuestionSchema,
-	textQuestionSchema,
-	multiSelectQuestionSchema
+	ratingQuestionPropertiesSchema,
+	singleSelectQuestionPropertiesSchema,
+	textQuestionPropertiesSchema,
+	multiSelectQuestionPropertiesSchema,
+	statementQuestionPropertiesSchema
 ]);
 
 //#endregion
@@ -121,6 +141,7 @@ const singleSelectAnswerSchemaFactory = ({ maxLength }, { required }) => {
 	return required ? baseSchema : z.optional(baseSchema);
 };
 const multiSelectAnswerSchemaFactory = ({ maxSelected, maxLength }, { required }) => z.array(z.string().check(z.trim(), ...required ? [z.minLength(1, { error: "This field is required" })] : [], z.maxLength(maxLength ?? 1024, { error: ({ maximum }) => `Please enter less than ${maximum} characters` }), z.refine((val) => val !== CHECKBOX_OTHERS_VALUE, { error: "Please fill out the free text field" }))).check(...required ? [z.minLength(1, { error: "Please select at least one option" })] : [], z.maxLength(maxSelected ?? 1024, { error: ({ maximum }) => `Please select less than ${maximum} options` }));
+const statementAnswerSchemaFactory = () => z.optional(z.string());
 
 //#endregion
 //#region ../validators/src/survey.ts
@@ -248,63 +269,6 @@ const useConfetti = () => {
 	return context;
 };
 
-//#endregion
-//#region src/core/logic/route.ts
-const isVisible = ({ index, questions, answers }) => {
-	if (index === 0) return true;
-	for (let i = 0; i < index; i++) {
-		const question = questions[i];
-		const answer = question ? answers[question.id] : void 0;
-		if (!question || !question.visible) continue;
-		const logic = question.routingLogic;
-		if (logic.type === "always") if (evaluateTarget({
-			position: i,
-			value: logic.target
-		}) === index) return true;
-		else continue;
-		if ((answer === void 0 || answer === null) && question.required) continue;
-		const cases = logic.cases;
-		const match = answer !== null ? cases.find((condition) => evaluateCondition({
-			answer,
-			condition
-		})) : void 0;
-		if (!match) if (evaluateTarget({
-			position: i,
-			value: logic.default
-		}) === index) return true;
-		else continue;
-		if (evaluateTarget({
-			position: i,
-			value: match.target
-		}) === index) return true;
-		else continue;
-	}
-	return false;
-};
-const evaluateTarget = ({ position, value }) => {
-	switch (value.type) {
-		case "next": return position + 1;
-		case "jump": return value.target;
-		case "end": return null;
-	}
-};
-const evaluateCondition = ({ answer, condition }) => {
-	const value = evaluateValue(condition.value);
-	switch (condition.operator) {
-		case "equal": return answer === value;
-		case "not-equal": return answer !== value;
-		case "greater": return typeof answer === "number" && typeof value === "number" && answer > value;
-		case "greater-or-equal": return typeof answer === "number" && typeof value === "number" && answer >= value;
-		case "less": return typeof answer === "number" && typeof value === "number" && answer < value;
-		case "less-or-equal": return typeof answer === "number" && typeof value === "number" && answer <= value;
-		case "contains": return Array.isArray(answer) && typeof value === "string" && answer.includes(value);
-		case "not-contains": return Array.isArray(answer) && typeof value === "string" && !answer.includes(value);
-	}
-};
-const evaluateValue = (node) => {
-	return node.value;
-};
-
 //#endregion
 //#region src/core/logic/validate.ts
 const VALIDATOR_FACTORY_MAP = {
@@ -314,7 +278,8 @@ const VALIDATOR_FACTORY_MAP = {
 	"multi-select": ({ editable, max }, meta) => multiSelectAnswerSchemaFactory({
 		maxLength: editable?.max,
 		maxSelected: max
-	}, meta)
+	}, meta),
+	statement: (_properties, _meta) => statementAnswerSchemaFactory()
 };
 const getAnswerValidator = (properties, meta) => {
 	const type = properties.type;
@@ -335,6 +300,10 @@ const getAnswerValidator = (properties, meta) => {
 			const validator = VALIDATOR_FACTORY_MAP[type];
 			return validator(properties, meta);
 		}
+		case "statement": {
+			const validator = VALIDATOR_FACTORY_MAP[type];
+			return validator(properties, meta);
+		}
 		default: throw new Error("Unsupported question type");
 	}
 };
@@ -570,9 +539,12 @@ const FreeText = ({ id, title, description, properties, onChange, classNames, re
 		children: [
 			/* @__PURE__ */ jsxs("div", {
 				className: clsx("cf-header", classNames?.header),
-				children: [/* @__PURE__ */ jsx(Label, {
+				children: [/* @__PURE__ */ jsxs(Label, {
 					className: clsx("cf-title", classNames?.title),
-					children: title
+					children: [title, !required && /* @__PURE__ */ jsxs("span", {
+						className: clsx("cf-label-optional", classNames?.optionalLabel),
+						children: [" ", "(optional)"]
+					})]
 				}), description && /* @__PURE__ */ jsx(Text, {
 					slot: "description",
 					className: clsx("cf-description", classNames?.description),
@@ -620,8 +592,18 @@ const MultiChoiceCheckbox = ({ children, classNames, description, ...props }) =>
 		})] })
 	});
 };
+const MultiChoiceTag = ({ children, classNames, ...props }) => {
+	return /* @__PURE__ */ jsx(Checkbox, {
+		...props,
+		children: /* @__PURE__ */ jsx("div", {
+			className: clsx("cf-tag-label", classNames?.tagLabel),
+			children
+		})
+	});
+};
 const MultiChoice = ({ title, description, properties, classNames, onChange, id, required, error }) => {
 	const hasEditable = !!properties.editable;
+	const display = properties.display ?? "checkbox";
 	const [value, setValue] = useState([]);
 	const [othersValue, setOthersValue] = useState("");
 	const othersRef = useRef(null);
@@ -633,6 +615,7 @@ const MultiChoice = ({ title, description, properties, classNames, onChange, id,
 		submissionValue$1[othersValueIndex] = othersValue || CHECKBOX_OTHERS_VALUE;
 		return submissionValue$1;
 	}, [othersValue, value]);
+	const isTag = display === "tag";
 	useEffect(() => {
 		onChange(submissionValue);
 	}, [onChange, submissionValue]);
@@ -646,9 +629,12 @@ const MultiChoice = ({ title, description, properties, classNames, onChange, id,
 		children: ({ state }) => /* @__PURE__ */ jsxs(Fragment, { children: [
 			/* @__PURE__ */ jsxs("div", {
 				className: clsx("cf-header", classNames?.header),
-				children: [/* @__PURE__ */ jsx(Label, {
+				children: [/* @__PURE__ */ jsxs(Label, {
 					className: clsx("cf-title", classNames?.title),
-					children: title
+					children: [title, !required && /* @__PURE__ */ jsxs("span", {
+						className: clsx("cf-label-optional", classNames?.optionalLabel),
+						children: [" ", "(optional)"]
+					})]
 				}), description && /* @__PURE__ */ jsx(Text, {
 					slot: "description",
 					className: clsx("cf-description", classNames?.description),
@@ -656,17 +642,43 @@ const MultiChoice = ({ title, description, properties, classNames, onChange, id,
 				})]
 			}),
 			/* @__PURE__ */ jsxs("div", {
-				className: clsx("cf-response-choices", classNames?.group),
-				children: [properties.options.map((option, index) => /* @__PURE__ */ jsx(MultiChoiceCheckbox, {
-					className: clsx("cf-choice cf-checkbox", classNames?.checkbox),
-					value: option.value,
-					classNames: {
-						indicator: classNames?.indicator,
-						svg: classNames?.svg
+				className: clsx("cf-response-choices", display === "tag" && "cf-response-choices-tag", classNames?.group),
+				children: [properties.options.map((option, index) => {
+					return /* @__PURE__ */ jsx(isTag ? MultiChoiceTag : MultiChoiceCheckbox, {
+						className: clsx("cf-choice", isTag && ["cf-tag", classNames?.tag], !isTag && ["cf-checkbox", classNames?.checkbox]),
+						value: option.value,
+						classNames: {
+							tag: classNames?.tag,
+							tagLabel: classNames?.tagLabel,
+							choiceDescription: classNames?.choiceDescription,
+							label: classNames?.label,
+							indicator: classNames?.indicator,
+							svg: classNames?.svg
+						},
+						children: option.value
+					}, index);
+				}), hasEditable && (isTag ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(MultiChoiceTag, {
+					inputRef: othersRef,
+					onChange: (isSelected) => {
+						console.log("hehe", isSelected);
+						if (!othersInputRef.current) return;
+						if (isSelected) requestAnimationFrame(() => {
+							if (!othersInputRef.current) return;
+							othersInputRef.current.focus();
+						});
 					},
-					description: option.description,
-					children: option.value
-				}, index)), hasEditable && /* @__PURE__ */ jsxs("div", {
+					className: clsx("cf-choice cf-tag", classNames?.tag),
+					value: CHECKBOX_OTHERS_VALUE,
+					children: properties.editable?.label
+				}), /* @__PURE__ */ jsx(Input, {
+					"data-visible": state.value.includes(CHECKBOX_OTHERS_VALUE) || void 0,
+					value: othersValue,
+					onChange: (e) => {
+						setOthersValue(e.target.value);
+					},
+					ref: othersInputRef,
+					className: clsx("cf-input cf-tag-input", classNames?.othersInput)
+				})] }) : /* @__PURE__ */ jsxs("div", {
 					className: clsx("cf-choice cf-others-choice", classNames?.othersChoice),
 					children: [/* @__PURE__ */ jsx(MultiChoiceCheckbox, {
 						inputRef: othersRef,
@@ -697,7 +709,7 @@ const MultiChoice = ({ title, description, properties, classNames, onChange, id,
 						},
 						className: clsx("cf-input", classNames?.othersInput)
 					})]
-				})]
+				}))]
 			}),
 			/* @__PURE__ */ jsx(FieldError, {
 				className: clsx("cf-error", classNames?.error),
@@ -1045,9 +1057,12 @@ const Rating = ({ properties, title, description, classNames, onChange, id, erro
 		children: ({ state }) => /* @__PURE__ */ jsxs(Fragment, { children: [
 			/* @__PURE__ */ jsxs("div", {
 				className: clsx("cf-header", classNames?.header),
-				children: [/* @__PURE__ */ jsx(Label, {
+				children: [/* @__PURE__ */ jsxs(Label, {
 					className: clsx("cf-title", classNames?.title),
-					children: title
+					children: [title, !required && /* @__PURE__ */ jsxs("span", {
+						className: clsx("cf-label-optional", classNames?.optionalLabel),
+						children: [" ", "(optional)"]
+					})]
 				}), description && /* @__PURE__ */ jsx(Text, {
 					slot: "description",
 					className: clsx("cf-description", classNames?.description),
@@ -1123,9 +1138,12 @@ const SingleChoice = ({ title, description, properties, classNames, onChange, id
 		children: ({ state }) => /* @__PURE__ */ jsxs(Fragment, { children: [
 			/* @__PURE__ */ jsxs("div", {
 				className: clsx("cf-header", classNames?.header),
-				children: [/* @__PURE__ */ jsx(Label, {
+				children: [/* @__PURE__ */ jsxs(Label, {
 					className: clsx("cf-title", classNames?.title),
-					children: title
+					children: [title, !required && /* @__PURE__ */ jsxs("span", {
+						className: clsx("cf-label-optional", classNames?.optionalLabel),
+						children: [" ", "(optional)"]
+					})]
 				}), description && /* @__PURE__ */ jsx(Text, {
 					slot: "description",
 					className: clsx("cf-description", classNames?.description),
@@ -1173,6 +1191,24 @@ const SingleChoice = ({ title, description, properties, classNames, onChange, id
 	});
 };
 
+//#endregion
+//#region src/components/questions/Statement.tsx
+const Statement = ({ properties: _properties, title, description, classNames }) => {
+	return /* @__PURE__ */ jsx("div", {
+		className: clsx("cf-question", classNames?.question),
+		children: /* @__PURE__ */ jsxs("div", {
+			className: clsx("cf-header", classNames?.header),
+			children: [title && /* @__PURE__ */ jsx("div", {
+				className: clsx("cf-title", classNames?.title),
+				children: title
+			}), description && /* @__PURE__ */ jsx("div", {
+				className: clsx("cf-description", classNames?.description),
+				children: description
+			})]
+		})
+	});
+};
+
 //#endregion
 //#region src/components/questions/factory.tsx
 const SurveyQuestionFactory = ({ question, onChange, error }) => {
@@ -1201,6 +1237,12 @@ const SurveyQuestionFactory = ({ question, onChange, error }) => {
 			onChange,
 			error
 		}, question.id);
+		case "statement": return /* @__PURE__ */ jsx(Statement, {
+			...question,
+			properties: question.properties,
+			onChange,
+			error
+		}, question.id);
 	}
 	return /* @__PURE__ */ jsx("div", { children: "Unsupported question type" }, question.id);
 };
@@ -1221,6 +1263,7 @@ const SubmitButton = ({ onPress, isDisabled, children = "Submit" }) => {
 const getInitialState = (type) => {
 	switch (type) {
 		case "multi-select": return [];
+		case "statement": return;
 		default: return "";
 	}
 };
@@ -1248,14 +1291,33 @@ const Flow = ({ onSubmit, children, question, isLastQuestion }) => {
 		question.required,
 		question.routingLogic
 	]);
+	const buttonLabel = useMemo(() => {
+		if (question.properties.buttonLabel) return question.properties.buttonLabel;
+		return hasNextQuestion ? "Next" : "Submit";
+	}, [hasNextQuestion, question.properties.buttonLabel]);
+	const handleSubmitPressed = useCallback(() => {
+		switch (question.properties.type) {
+			case "statement":
+				if (question.properties.buttonUrl && typeof window !== "undefined") {
+					const validatedUrl = urlSchema.safeParse(question.properties.buttonUrl).data;
+					if (validatedUrl) window.open(validatedUrl, "_blank");
+				}
+				return onSubmit(void 0);
+			default: return onSubmit(answer);
+		}
+	}, [
+		answer,
+		onSubmit,
+		question.properties
+	]);
 	return /* @__PURE__ */ jsxs(Fragment, { children: [children({
 		onChange: setAnswer,
 		question,
 		error
 	}), /* @__PURE__ */ jsx(SubmitButton, {
 		isDisabled: !!error,
-		onPress: () => onSubmit(answer),
-		children: hasNextQuestion ? "Next" : "Submit"
+		onPress: handleSubmitPressed,
+		children: buttonLabel
 	})] });
 };
 
@@ -1407,5 +1469,5 @@ const useVisibleAfterScroll = ({ threshold }) => {
 };
 
 //#endregion
-export { Confetti, ConfettiContext, ConfettiController, ConfettiProvider, Embed, EmbeddedConfetti, Flow, FreeText, MultiChoice, PopoverConfetti, PopoverContainer, Rating, SingleChoice, StepperConfetti, SurveyQuestionFactory, ThankYouMessage, useConfetti, useVisibleAfterDelay, useVisibleAfterPageVisits, useVisibleAfterScroll, useVisibleAfterSessionPageVisits };
+export { Confetti, ConfettiContext, ConfettiController, ConfettiProvider, Embed, EmbeddedConfetti, Flow, FreeText, MultiChoice, PopoverConfetti, PopoverContainer, Rating, SingleChoice, Statement, StepperConfetti, SurveyQuestionFactory, ThankYouMessage, useConfetti, useVisibleAfterDelay, useVisibleAfterPageVisits, useVisibleAfterScroll, useVisibleAfterSessionPageVisits };
 //# sourceMappingURL=index.js.map

package/build/internals.d.ts

@@ -0,0 +1,14 @@
+import { t as Answer, u as BinaryOperatorCondition } from "./types-qVyTr8wu.js";
+
+//#region src/core/logic/routing.d.ts
+
+declare const evaluateCondition: ({
+  answer,
+  condition
+}: {
+  answer: Answer;
+  condition: BinaryOperatorCondition;
+}) => boolean;
+//#endregion
+export { evaluateCondition as unstableInternalConfettiEvaluateCondition };
+//# sourceMappingURL=internals.d.ts.map

package/build/internals.js

@@ -0,0 +1,3 @@
+import { t as evaluateCondition } from "./routing-DjtQKwsR.js";
+
+export { evaluateCondition as unstableInternalConfettiEvaluateCondition };

package/build/routing-DjtQKwsR.js

@@ -0,0 +1,59 @@
+//#region src/core/logic/routing.ts
+const isVisible = ({ index, questions, answers }) => {
+	if (index === 0) return true;
+	for (let i = 0; i < index; i++) {
+		const question = questions[i];
+		const answer = question ? answers[question.id] : void 0;
+		if (!question || !question.visible) continue;
+		const logic = question.routingLogic;
+		if (logic.type === "always") if (evaluateTarget({
+			position: i,
+			value: logic.target
+		}) === index) return true;
+		else continue;
+		if ((answer === void 0 || answer === null) && question.required) continue;
+		const cases = logic.cases;
+		const match = answer !== null ? cases.find((condition) => evaluateCondition({
+			answer,
+			condition
+		})) : void 0;
+		if (!match) if (evaluateTarget({
+			position: i,
+			value: logic.default
+		}) === index) return true;
+		else continue;
+		if (evaluateTarget({
+			position: i,
+			value: match.target
+		}) === index) return true;
+		else continue;
+	}
+	return false;
+};
+const evaluateTarget = ({ position, value }) => {
+	switch (value.type) {
+		case "next": return position + 1;
+		case "jump": return value.target;
+		case "end": return null;
+	}
+};
+const evaluateCondition = ({ answer, condition }) => {
+	const value = evaluateValue(condition.value);
+	switch (condition.operator) {
+		case "equal": return answer === value;
+		case "not-equal": return answer !== value;
+		case "greater": return typeof answer === "number" && typeof value === "number" && answer > value;
+		case "greater-or-equal": return typeof answer === "number" && typeof value === "number" && answer >= value;
+		case "less": return typeof answer === "number" && typeof value === "number" && answer < value;
+		case "less-or-equal": return typeof answer === "number" && typeof value === "number" && answer <= value;
+		case "contains": return Array.isArray(answer) && typeof value === "string" && answer.includes(value);
+		case "not-contains": return Array.isArray(answer) && typeof value === "string" && !answer.includes(value);
+	}
+};
+const evaluateValue = (node) => {
+	return node.value;
+};
+
+//#endregion
+export { isVisible as n, evaluateCondition as t };
+//# sourceMappingURL=routing-DjtQKwsR.js.map

package/build/types-qVyTr8wu.d.ts

@@ -0,0 +1,204 @@
+import { z } from "zod/v4/mini";
+
+//#region ../validators/src/questions/routing.d.ts
+
+declare const binaryOperatorConditionSchema: z.ZodMiniObject<{
+  type: z.ZodMiniLiteral<"binary-operator">;
+  operator: z.ZodMiniUnion<readonly [z.ZodMiniLiteral<"equal">, z.ZodMiniLiteral<"not-equal">, z.ZodMiniLiteral<"greater">, z.ZodMiniLiteral<"greater-or-equal">, z.ZodMiniLiteral<"less">, z.ZodMiniLiteral<"less-or-equal">, z.ZodMiniLiteral<"contains">, z.ZodMiniLiteral<"not-contains">]>;
+  value: z.ZodMiniObject<{
+    type: z.ZodMiniLiteral<"value">;
+    value: z.ZodMiniUnion<readonly [z.ZodMiniString<string>, z.ZodMiniNumber<number>]>;
+  }, z.core.$strip>;
+  target: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
+    type: z.ZodMiniLiteral<"next">;
+  }, z.core.$strip>, z.ZodMiniObject<{
+    type: z.ZodMiniLiteral<"jump">;
+    target: z.ZodMiniNumber<number>;
+  }, z.core.$strip>, z.ZodMiniObject<{
+    type: z.ZodMiniLiteral<"end">;
+  }, z.core.$strip>], "type">;
+}, z.core.$strip>;
+type BinaryOperatorCondition = z.infer<typeof binaryOperatorConditionSchema>;
+//#endregion
+//#region ../validators/src/questions/properties.d.ts
+declare const ratingQuestionPropertiesSchema: z.ZodMiniObject<{
+  type: z.ZodMiniLiteral<"rating">;
+  buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+  scale: z.ZodMiniNumber<number>;
+  labels: z.ZodMiniOptional<z.ZodMiniObject<{
+    lower: z.ZodMiniOptional<z.ZodMiniPipe<z.ZodMiniString<string>, z.ZodMiniTransform<string | undefined, string>>>;
+    upper: z.ZodMiniOptional<z.ZodMiniPipe<z.ZodMiniString<string>, z.ZodMiniTransform<string | undefined, string>>>;
+  }, z.core.$strip>>;
+  display: z.ZodMiniOptional<z.ZodMiniLiteral<"number" | "star" | "emoji" | "tiffany">>;
+}, z.core.$strip>;
+type RatingQuestionProperties = z.infer<typeof ratingQuestionPropertiesSchema>;
+declare const textQuestionPropertiesSchema: z.ZodMiniObject<{
+  type: z.ZodMiniLiteral<"open-ended">;
+  buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+  max: z.ZodMiniNumber<number>;
+}, z.core.$strip>;
+type TextQuestionProperties = z.infer<typeof textQuestionPropertiesSchema>;
+declare const singleSelectQuestionPropertiesSchema: z.ZodMiniObject<{
+  type: z.ZodMiniLiteral<"single-select">;
+  options: z.ZodMiniArray<z.ZodMiniObject<{
+    value: z.ZodMiniString<string>;
+    description: z.ZodMiniOptional<z.ZodMiniString<string>>;
+  }, z.core.$strip>>;
+  buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+  editable: z.ZodMiniNullable<z.ZodMiniObject<{
+    label: z.ZodMiniString<string>;
+    max: z.ZodMiniNumber<number>;
+    description: z.ZodMiniOptional<z.ZodMiniString<string>>;
+  }, z.core.$strip>>;
+}, z.core.$strip>;
+type SingleSelectQuestionProperties = z.infer<typeof singleSelectQuestionPropertiesSchema>;
+declare const multiSelectQuestionPropertiesSchema: z.ZodMiniObject<{
+  type: z.ZodMiniLiteral<"multi-select">;
+  buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+  options: z.ZodMiniArray<z.ZodMiniObject<{
+    value: z.ZodMiniString<string>;
+    description: z.ZodMiniOptional<z.ZodMiniString<string>>;
+  }, z.core.$strip>>;
+  editable: z.ZodMiniNullable<z.ZodMiniObject<{
+    label: z.ZodMiniString<string>;
+    max: z.ZodMiniNumber<number>;
+    description: z.ZodMiniOptional<z.ZodMiniString<string>>;
+  }, z.core.$strip>>;
+  max: z.ZodMiniOptional<z.ZodMiniNumber<number>>;
+  display: z.ZodMiniOptional<z.ZodMiniLiteral<"checkbox" | "tag">>;
+}, z.core.$strip>;
+type MultiSelectQuestionProperties = z.infer<typeof multiSelectQuestionPropertiesSchema>;
+declare const statementQuestionPropertiesSchema: z.ZodMiniObject<{
+  type: z.ZodMiniLiteral<"statement">;
+  buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+  buttonUrl: z.ZodMiniOptional<z.ZodMiniString<string>>;
+}, z.core.$strip>;
+type StatementQuestionProperties = z.infer<typeof statementQuestionPropertiesSchema>;
+//#endregion
+//#region ../validators/src/survey.d.ts
+declare const publicGetSurveyOutputSchema: z.ZodMiniObject<{
+  title: z.ZodMiniString<string>;
+  description: z.ZodMiniNullable<z.ZodMiniString<string>>;
+  questions: z.ZodMiniArray<z.ZodMiniObject<{
+    id: z.ZodMiniString<string>;
+    title: z.ZodMiniString<string>;
+    description: z.ZodMiniNullable<z.ZodMiniString<string>>;
+    position: z.ZodMiniNumber<number>;
+    required: z.ZodMiniBoolean<boolean>;
+    properties: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
+      type: z.ZodMiniLiteral<"rating">;
+      buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+      scale: z.ZodMiniNumber<number>;
+      labels: z.ZodMiniOptional<z.ZodMiniObject<{
+        lower: z.ZodMiniOptional<z.ZodMiniPipe<z.ZodMiniString<string>, z.ZodMiniTransform<string | undefined, string>>>;
+        upper: z.ZodMiniOptional<z.ZodMiniPipe<z.ZodMiniString<string>, z.ZodMiniTransform<string | undefined, string>>>;
+      }, z.core.$strip>>;
+      display: z.ZodMiniOptional<z.ZodMiniLiteral<"number" | "star" | "emoji" | "tiffany">>;
+    }, z.core.$strip>, z.ZodMiniObject<{
+      type: z.ZodMiniLiteral<"single-select">;
+      options: z.ZodMiniArray<z.ZodMiniObject<{
+        value: z.ZodMiniString<string>;
+        description: z.ZodMiniOptional<z.ZodMiniString<string>>;
+      }, z.core.$strip>>;
+      buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+      editable: z.ZodMiniNullable<z.ZodMiniObject<{
+        label: z.ZodMiniString<string>;
+        max: z.ZodMiniNumber<number>;
+        description: z.ZodMiniOptional<z.ZodMiniString<string>>;
+      }, z.core.$strip>>;
+    }, z.core.$strip>, z.ZodMiniObject<{
+      type: z.ZodMiniLiteral<"open-ended">;
+      buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+      max: z.ZodMiniNumber<number>;
+    }, z.core.$strip>, z.ZodMiniObject<{
+      type: z.ZodMiniLiteral<"multi-select">;
+      buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+      options: z.ZodMiniArray<z.ZodMiniObject<{
+        value: z.ZodMiniString<string>;
+        description: z.ZodMiniOptional<z.ZodMiniString<string>>;
+      }, z.core.$strip>>;
+      editable: z.ZodMiniNullable<z.ZodMiniObject<{
+        label: z.ZodMiniString<string>;
+        max: z.ZodMiniNumber<number>;
+        description: z.ZodMiniOptional<z.ZodMiniString<string>>;
+      }, z.core.$strip>>;
+      max: z.ZodMiniOptional<z.ZodMiniNumber<number>>;
+      display: z.ZodMiniOptional<z.ZodMiniLiteral<"checkbox" | "tag">>;
+    }, z.core.$strip>, z.ZodMiniObject<{
+      type: z.ZodMiniLiteral<"statement">;
+      buttonLabel: z.ZodMiniOptional<z.ZodMiniString<string>>;
+      buttonUrl: z.ZodMiniOptional<z.ZodMiniString<string>>;
+    }, z.core.$strip>], "type">;
+    routingLogic: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
+      type: z.ZodMiniLiteral<"always">;
+      target: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
+        type: z.ZodMiniLiteral<"next">;
+      }, z.core.$strip>, z.ZodMiniObject<{
+        type: z.ZodMiniLiteral<"jump">;
+        target: z.ZodMiniNumber<number>;
+      }, z.core.$strip>, z.ZodMiniObject<{
+        type: z.ZodMiniLiteral<"end">;
+      }, z.core.$strip>], "type">;
+    }, z.core.$strip>, z.ZodMiniObject<{
+      type: z.ZodMiniLiteral<"switch">;
+      cases: z.ZodMiniArray<z.ZodMiniObject<{
+        type: z.ZodMiniLiteral<"binary-operator">;
+        operator: z.ZodMiniUnion<readonly [z.ZodMiniLiteral<"equal">, z.ZodMiniLiteral<"not-equal">, z.ZodMiniLiteral<"greater">, z.ZodMiniLiteral<"greater-or-equal">, z.ZodMiniLiteral<"less">, z.ZodMiniLiteral<"less-or-equal">, z.ZodMiniLiteral<"contains">, z.ZodMiniLiteral<"not-contains">]>;
+        value: z.ZodMiniObject<{
+          type: z.ZodMiniLiteral<"value">;
+          value: z.ZodMiniUnion<readonly [z.ZodMiniString<string>, z.ZodMiniNumber<number>]>;
+        }, z.core.$strip>;
+        target: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
+          type: z.ZodMiniLiteral<"next">;
+        }, z.core.$strip>, z.ZodMiniObject<{
+          type: z.ZodMiniLiteral<"jump">;
+          target: z.ZodMiniNumber<number>;
+        }, z.core.$strip>, z.ZodMiniObject<{
+          type: z.ZodMiniLiteral<"end">;
+        }, z.core.$strip>], "type">;
+      }, z.core.$strip>>;
+      default: z.ZodMiniDiscriminatedUnion<[z.ZodMiniObject<{
+        type: z.ZodMiniLiteral<"next">;
+      }, z.core.$strip>, z.ZodMiniObject<{
+        type: z.ZodMiniLiteral<"jump">;
+        target: z.ZodMiniNumber<number>;
+      }, z.core.$strip>, z.ZodMiniObject<{
+        type: z.ZodMiniLiteral<"end">;
+      }, z.core.$strip>], "type">;
+    }, z.core.$strip>], "type">;
+  }, z.core.$strip>>;
+  confirmation: z.ZodMiniObject<{
+    title: z.ZodMiniString<string>;
+    description: z.ZodMiniString<string>;
+    buttonText: z.ZodMiniString<string>;
+  }, z.core.$strip>;
+}, z.core.$strip>;
+type PublicGetSurveyOutput = z.infer<typeof publicGetSurveyOutputSchema>;
+//#endregion
+//#region src/core/types.d.ts
+type Question = {
+  visible: boolean;
+  error?: string;
+} & PublicGetSurveyOutput['questions'][number];
+type Answer = string | number | string[] | undefined;
+interface ConfettiState {
+  questions: Question[];
+  current: number;
+  update: ({
+    question,
+    answer
+  }: {
+    question: number;
+    answer: Answer;
+  }) => {
+    next?: number;
+    error?: string;
+  };
+  submit: () => void;
+  isCompleted: boolean;
+  isSubmitted: boolean;
+  errors: Record<Question['id'], string>;
+}
+//#endregion
+export { MultiSelectQuestionProperties as a, StatementQuestionProperties as c, PublicGetSurveyOutput as i, TextQuestionProperties as l, ConfettiState as n, RatingQuestionProperties as o, Question as r, SingleSelectQuestionProperties as s, Answer as t, BinaryOperatorCondition as u };
+//# sourceMappingURL=types-qVyTr8wu.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengovsg/confetti",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "sideEffects": false,
   "description": "Widgets for Confetti",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -13,6 +13,11 @@
       "default": "./build/index.js",
       "types": "./build/index.d.ts"
     },
+    "./internals": {
+      "import": "./build/internals.js",
+      "default": "./build/internals.js",
+      "types": "./build/internals.d.ts"
+    },
     "./confetti.css": "./build/confetti.css"
   },
   "files": [
@@ -38,10 +43,10 @@
     "prettier": "^3.7.4",
     "tsdown": "0.19.0",
     "typescript": "^5.9.3",
-    "@confetti/tsconfig": "0.0.0",
-    "@confetti/validators": "0.0.0",
     "@confetti/prettier-config": "0.0.0",
-    "@confetti/eslint-config": "0.0.0"
+    "@confetti/tsconfig": "0.0.0",
+    "@confetti/eslint-config": "0.0.0",
+    "@confetti/validators": "0.0.0"
   },
   "prettier": "@confetti/prettier-config",
   "scripts": {