@opengovsg/confetti 0.0.11 → 0.0.12

package/build/index.d.ts

@@ -1,7 +1,7 @@
 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-COft9SvA.js";
 import * as react0 from "react";
 import { HTMLAttributes, PropsWithChildren } from "react";
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 
 //#region src/core/ConfettiController.d.ts
 interface ConfettiControllerProps {
@@ -19,7 +19,7 @@ declare const ConfettiController: ({
   shouldAutoSubmit,
   onFinished,
   children
-}: ConfettiControllerProps) => react_jsx_runtime2.JSX.Element;
+}: ConfettiControllerProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/core/ConfettiProvider.d.ts
 interface ConfettiContextValue {
@@ -43,17 +43,18 @@ interface ConfettiProviderProps {
   apiBaseUrl?: string;
   isSurveyVisible?: boolean | ((_: {
     lastRespondedAt: Date | null;
+    lastDismissedAt: Date | null;
   }) => boolean);
 }
 declare const ConfettiProvider: ({
   children,
   surveyId,
   publishableKey,
-  respondent,
+  respondent: respondentInput,
   metadata,
   isSurveyVisible: isSurveyVisibleInput,
   apiBaseUrl
-}: ConfettiProviderProps) => react_jsx_runtime2.JSX.Element | null;
+}: ConfettiProviderProps) => react_jsx_runtime3.JSX.Element | null;
 declare const useConfetti: () => ConfettiContextValue;
 //#endregion
 //#region src/components/Confetti.d.ts
@@ -63,7 +64,7 @@ declare const Confetti: ({
   onFinished,
   shouldAutoSubmit,
   ...props
-}: ConfettiProps & Pick<ConfettiControllerProps, "children" | "shouldAutoSubmit">) => react_jsx_runtime2.JSX.Element;
+}: ConfettiProps & Pick<ConfettiControllerProps, "children" | "shouldAutoSubmit">) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/components/ThankYouMessage.d.ts
 interface ThankYouMessageProps {
@@ -80,7 +81,7 @@ declare const ThankYouMessage: ({
   title,
   description,
   classNames
-}: ThankYouMessageProps) => react_jsx_runtime2.JSX.Element | null;
+}: ThankYouMessageProps) => react_jsx_runtime3.JSX.Element | null;
 //#endregion
 //#region src/components/container/PopoverContainer.d.ts
 interface PopoverContainerProps {
@@ -102,7 +103,7 @@ declare const PopoverContainer: ({
   containerProps,
   onDismiss,
   closeOnFinishMs
-}: PopoverContainerProps) => react_jsx_runtime2.JSX.Element;
+}: PopoverContainerProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/components/questions/types.d.ts
 type Question$1 = PublicGetSurveyOutput['questions'][number];
@@ -125,7 +126,7 @@ declare const SurveyQuestionFactory: ({
   question,
   onChange,
   error
-}: SurveyQuestionFactoryProps) => react_jsx_runtime2.JSX.Element;
+}: SurveyQuestionFactoryProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/components/questions/Rating.d.ts
 interface RatingProps extends BaseFieldProps {
@@ -160,7 +161,7 @@ declare const Rating: ({
   id,
   error,
   required
-}: RatingProps) => react_jsx_runtime2.JSX.Element;
+}: RatingProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/components/questions/FreeText.d.ts
 interface FreeTextProps extends BaseFieldProps {
@@ -184,7 +185,7 @@ declare const FreeText: ({
   classNames,
   required,
   error
-}: FreeTextProps) => react_jsx_runtime2.JSX.Element;
+}: FreeTextProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/components/questions/SingleChoice.d.ts
 interface SingleChoiceProps extends BaseFieldProps {
@@ -214,7 +215,7 @@ declare const SingleChoice: ({
   id,
   required,
   error
-}: SingleChoiceProps) => react_jsx_runtime2.JSX.Element;
+}: SingleChoiceProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/components/questions/MultiChoice.d.ts
 interface MultiChoiceProps extends BaseFieldProps {
@@ -247,7 +248,7 @@ declare const MultiChoice: ({
   id,
   required,
   error
-}: MultiChoiceProps) => react_jsx_runtime2.JSX.Element;
+}: MultiChoiceProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/components/questions/Statement.d.ts
 interface StatementProps extends BaseFieldProps {
@@ -265,7 +266,7 @@ declare const Statement: ({
   title,
   description,
   classNames
-}: StatementProps) => react_jsx_runtime2.JSX.Element;
+}: StatementProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/components/presentation/Flow.d.ts
 type ChildField = (_: {
@@ -284,7 +285,7 @@ declare const Flow: ({
   children,
   question,
   isLastQuestion
-}: FlowProps) => react_jsx_runtime2.JSX.Element;
+}: FlowProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/components/presentation/Embed.d.ts
 declare const Embed: ({
@@ -294,10 +295,10 @@ declare const Embed: ({
 }: PropsWithChildren<{
   isCompleted: boolean;
   onSubmit: () => void;
-}>) => react_jsx_runtime2.JSX.Element;
+}>) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/templates/EmbeddedConfetti.d.ts
-declare const EmbeddedConfetti: (props: ConfettiProps) => react_jsx_runtime2.JSX.Element;
+declare const EmbeddedConfetti: (props: ConfettiProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/templates/PopoverConfetti.d.ts
 interface PopoverConfettiProps extends ConfettiProps {
@@ -317,10 +318,10 @@ declare const PopoverConfetti: ({
   onDismiss,
   closeOnFinishMs,
   ...props
-}: PopoverConfettiProps) => react_jsx_runtime2.JSX.Element;
+}: PopoverConfettiProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/templates/StepperConfetti.d.ts
-declare const StepperConfetti: (props: ConfettiProps) => react_jsx_runtime2.JSX.Element;
+declare const StepperConfetti: (props: ConfettiProps) => react_jsx_runtime3.JSX.Element;
 //#endregion
 //#region src/hooks/useVisibleAfterDelay.d.ts
 interface UseVisibleAfterDelayOptions {

package/build/index.js

@@ -177,7 +177,12 @@ const publicPutResponseInputSchema = z.object({
 	])),
 	metadata: z.record(z.string().check(z.trim(), z.maxLength(1e3)), z.string().check(z.trim(), z.maxLength(1e3)))
 });
-const publicGetRespondentOutputSchema = z.object({ lastRespondedAt: z.nullable(z.union([z.iso.datetime(), z.date()])) });
+const publicGetRespondentOutputSchema = z.object({
+	lastRespondedAt: z.nullable(z.union([z.iso.datetime(), z.date()])),
+	lastViewedAt: z.nullable(z.union([z.iso.datetime(), z.date()])),
+	lastDismissedAt: z.nullable(z.union([z.iso.datetime(), z.date()]))
+});
+const publicPostRespondentEventInputSchema = z.object({ type: z.enum(["view", "dismiss"]) });
 
 //#endregion
 //#region src/core/logic/api.ts
@@ -194,15 +199,18 @@ const client = ky.create({
 //#endregion
 //#region src/core/ConfettiProvider.tsx
 const ConfettiContext = createContext(null);
-const ConfettiProvider = ({ children, surveyId, publishableKey, respondent, metadata = {}, isSurveyVisible: isSurveyVisibleInput, apiBaseUrl }) => {
+const ConfettiProvider = ({ children, surveyId, publishableKey, respondent: respondentInput, metadata = {}, isSurveyVisible: isSurveyVisibleInput, apiBaseUrl }) => {
+	const hasTrackedViewRef = useRef(false);
 	const [survey, setSurvey] = useState();
 	const [lastRespondedAt, setLastRespondedAt] = useState();
+	const [lastDismissedAt, setLastDismissedAt] = useState();
 	const responseId = useMemo(() => crypto.randomUUID(), []);
 	const [internalRespondentId, setInternalRespondentId] = useLocalStorage(`cfti:${surveyId}:respondent`, "");
 	useEffect(() => {
 		if (internalRespondentId) return;
 		setInternalRespondentId(crypto.randomUUID());
 	}, [internalRespondentId, setInternalRespondentId]);
+	const respondent = useMemo(() => respondentInput || internalRespondentId, [respondentInput, internalRespondentId]);
 	const client$1 = useMemo(() => {
 		const properties = { headers: { "x-cfti-pk": publishableKey } };
 		if (apiBaseUrl) properties.prefixUrl = apiBaseUrl;
@@ -214,14 +222,16 @@ const ConfettiProvider = ({ children, surveyId, publishableKey, respondent, meta
 			if (!parseResult.success) return;
 			setSurvey(parseResult.data);
 		});
-		if (!respondent && !internalRespondentId) return;
-		client$1.get(`v1/cfti/${surveyId}/respondent/${respondent || internalRespondentId}`).json().then((data) => {
+		if (!respondent) return;
+		client$1.get(`v1/cfti/${surveyId}/respondent/${respondent}`).json().then((data) => {
 			const parseResult = publicGetRespondentOutputSchema.safeParse(data);
 			if (!parseResult.success) {
 				setLastRespondedAt(null);
+				setLastDismissedAt(null);
 				return;
 			}
 			setLastRespondedAt(parseResult.data.lastRespondedAt ? new Date(parseResult.data.lastRespondedAt) : null);
+			setLastDismissedAt(parseResult.data.lastDismissedAt ? new Date(parseResult.data.lastDismissedAt) : null);
 		});
 	}, [
 		apiBaseUrl,
@@ -232,13 +242,12 @@ const ConfettiProvider = ({ children, surveyId, publishableKey, respondent, meta
 	]);
 	const submit = useCallback(async ({ answers }) => {
 		await client$1.put(`v1/cfti/${surveyId}/response/${responseId}`, { json: {
-			respondent: respondent || internalRespondentId,
+			respondent,
 			data: answers,
 			metadata
 		} });
 	}, [
 		client$1,
-		internalRespondentId,
 		metadata,
 		respondent,
 		responseId,
@@ -246,13 +255,38 @@ const ConfettiProvider = ({ children, surveyId, publishableKey, respondent, meta
 	]);
 	const dismiss = useCallback(() => {
 		setSurvey(void 0);
-	}, []);
-	if (!useMemo(() => {
+		client$1.post(`v1/cfti/${surveyId}/respondent/${respondent}/event`, { json: { type: "dismiss" } }).catch(() => {});
+	}, [
+		client$1,
+		respondent,
+		surveyId
+	]);
+	const isSurveyVisible = useMemo(() => {
 		if (isSurveyVisibleInput === void 0) return true;
 		if (typeof isSurveyVisibleInput === "boolean") return isSurveyVisibleInput;
-		if (lastRespondedAt === void 0) return false;
-		return isSurveyVisibleInput({ lastRespondedAt });
-	}, [isSurveyVisibleInput, lastRespondedAt]) || !survey) return null;
+		if (lastRespondedAt === void 0 || lastDismissedAt === void 0) return false;
+		return isSurveyVisibleInput({
+			lastRespondedAt,
+			lastDismissedAt
+		});
+	}, [
+		isSurveyVisibleInput,
+		lastRespondedAt,
+		lastDismissedAt
+	]);
+	useEffect(() => {
+		if (hasTrackedViewRef.current) return;
+		if (isSurveyVisible) {
+			hasTrackedViewRef.current = true;
+			client$1.post(`v1/cfti/${surveyId}/respondent/${respondent}/event`, { json: { type: "view" } }).catch(() => {});
+		}
+	}, [
+		client$1,
+		isSurveyVisible,
+		respondent,
+		surveyId
+	]);
+	if (!isSurveyVisible || !survey) return null;
 	return /* @__PURE__ */ jsx(ConfettiContext.Provider, {
 		value: {
 			submit,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengovsg/confetti",
-  "version": "0.0.11",
+  "version": "0.0.12",
   "sideEffects": false,
   "description": "Widgets for Confetti",
   "license": "SEE LICENSE IN LICENSE.md",