@envive-ai/react-widgets-v3 0.3.32 → 0.3.33

package/dist/hocs/withBaseWidget/withBaseWidget.d.cts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps, WithBaseWidgetOptions } from "./types.cjs";
-import * as react_jsx_runtime6 from "react/jsx-runtime";
+import * as react_jsx_runtime13 from "react/jsx-runtime";
 
 //#region src/hocs/withBaseWidget/withBaseWidget.d.ts
 declare function withBaseWidget<P extends BaseWidgetProps>(Widget: React.ComponentType<P>, options?: WithBaseWidgetOptions): {
-  (props: P): react_jsx_runtime6.JSX.Element;
+  (props: P): react_jsx_runtime13.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/hocs/withBaseWidget/withBaseWidget.d.ts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps, WithBaseWidgetOptions } from "./types.js";
-import * as react_jsx_runtime12 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/hocs/withBaseWidget/withBaseWidget.d.ts
 declare function withBaseWidget<P extends BaseWidgetProps>(Widget: React.ComponentType<P>, options?: WithBaseWidgetOptions): {
-  (props: P): react_jsx_runtime12.JSX.Element;
+  (props: P): react_jsx_runtime0.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/ChatPreviewComparisonWidget/ChatPreviewComparisonWidget.d.cts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.cjs";
-import * as react_jsx_runtime13 from "react/jsx-runtime";
+import * as react_jsx_runtime6 from "react/jsx-runtime";
 
 //#region src/widgets/ChatPreviewComparisonWidget/ChatPreviewComparisonWidget.d.ts
 declare const ChatPreviewComparisonWidgetWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime13.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime6.JSX.Element;
   displayName: string;
 };
 interface ChatPreviewComparisonWidgetProps {
@@ -12,7 +12,7 @@ interface ChatPreviewComparisonWidgetProps {
 declare const ChatPreviewComparisonWidget: {
   ({
     widgetConfigId
-  }: ChatPreviewComparisonWidgetProps): react_jsx_runtime13.JSX.Element;
+  }: ChatPreviewComparisonWidgetProps): react_jsx_runtime6.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/ChatPreviewComparisonWidget/ChatPreviewComparisonWidget.d.ts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.js";
-import * as react_jsx_runtime16 from "react/jsx-runtime";
+import * as react_jsx_runtime9 from "react/jsx-runtime";
 
 //#region src/widgets/ChatPreviewComparisonWidget/ChatPreviewComparisonWidget.d.ts
 declare const ChatPreviewComparisonWidgetWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime16.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime9.JSX.Element;
   displayName: string;
 };
 interface ChatPreviewComparisonWidgetProps {
@@ -12,7 +12,7 @@ interface ChatPreviewComparisonWidgetProps {
 declare const ChatPreviewComparisonWidget: {
   ({
     widgetConfigId
-  }: ChatPreviewComparisonWidgetProps): react_jsx_runtime16.JSX.Element;
+  }: ChatPreviewComparisonWidgetProps): react_jsx_runtime9.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/ChatPreviewLoadingWidget/ChatPreviewLoadingWidget.d.cts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.cjs";
-import * as react_jsx_runtime7 from "react/jsx-runtime";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
 
 //#region src/widgets/ChatPreviewLoadingWidget/ChatPreviewLoadingWidget.d.ts
 declare const ChatPreviewLoadingWidgetWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime7.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime4.JSX.Element;
   displayName: string;
 };
 interface ChatPreviewLoadingWidgetProps {
@@ -11,6 +11,6 @@ interface ChatPreviewLoadingWidgetProps {
 }
 declare const ChatPreviewLoadingWidget: ({
   widgetConfigId
-}: ChatPreviewLoadingWidgetProps) => react_jsx_runtime7.JSX.Element;
+}: ChatPreviewLoadingWidgetProps) => react_jsx_runtime4.JSX.Element;
 //#endregion
 export { ChatPreviewLoadingWidget, ChatPreviewLoadingWidgetProps, ChatPreviewLoadingWidgetWithBaseWidget };

package/dist/widgets/ChatPreviewLoadingWidget/ChatPreviewLoadingWidget.d.ts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.js";
-import * as react_jsx_runtime13 from "react/jsx-runtime";
+import * as react_jsx_runtime15 from "react/jsx-runtime";
 
 //#region src/widgets/ChatPreviewLoadingWidget/ChatPreviewLoadingWidget.d.ts
 declare const ChatPreviewLoadingWidgetWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime13.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime15.JSX.Element;
   displayName: string;
 };
 interface ChatPreviewLoadingWidgetProps {
@@ -11,6 +11,6 @@ interface ChatPreviewLoadingWidgetProps {
 }
 declare const ChatPreviewLoadingWidget: ({
   widgetConfigId
-}: ChatPreviewLoadingWidgetProps) => react_jsx_runtime13.JSX.Element;
+}: ChatPreviewLoadingWidgetProps) => react_jsx_runtime15.JSX.Element;
 //#endregion
 export { ChatPreviewLoadingWidget, ChatPreviewLoadingWidgetProps, ChatPreviewLoadingWidgetWithBaseWidget };

package/dist/widgets/ChatPreviewWidget/ChatPreviewWidget.d.ts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.js";
-import * as react_jsx_runtime18 from "react/jsx-runtime";
+import * as react_jsx_runtime11 from "react/jsx-runtime";
 
 //#region src/widgets/ChatPreviewWidget/ChatPreviewWidget.d.ts
 declare const ChatPreviewWidgetWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime18.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime11.JSX.Element;
   displayName: string;
 };
 interface ChatPreviewWidgetProps {
@@ -12,7 +12,7 @@ interface ChatPreviewWidgetProps {
 declare const ChatPreviewWidget: {
   ({
     widgetConfigId
-  }: ChatPreviewWidgetProps): react_jsx_runtime18.JSX.Element;
+  }: ChatPreviewWidgetProps): react_jsx_runtime11.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/FloatingChatWidget/FloatingChatWidget.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime10 from "react/jsx-runtime";
 
 //#region src/widgets/FloatingChatWidget/FloatingChatWidget.d.ts
 interface FloatingChatWidgetProps {
@@ -13,7 +13,7 @@ declare const FloatingChatWidget: {
     previewChatAlwaysOpen,
     previewCXButtonsEnabled,
     previewDisclaimer
-  }?: FloatingChatWidgetProps): react_jsx_runtime5.JSX.Element;
+  }?: FloatingChatWidgetProps): react_jsx_runtime10.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/FloatingChatWidget/FloatingChatWidget.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime15 from "react/jsx-runtime";
+import * as react_jsx_runtime8 from "react/jsx-runtime";
 
 //#region src/widgets/FloatingChatWidget/FloatingChatWidget.d.ts
 interface FloatingChatWidgetProps {
@@ -13,7 +13,7 @@ declare const FloatingChatWidget: {
     previewChatAlwaysOpen,
     previewCXButtonsEnabled,
     previewDisclaimer
-  }?: FloatingChatWidgetProps): react_jsx_runtime15.JSX.Element;
+  }?: FloatingChatWidgetProps): react_jsx_runtime8.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/FullPageSalesAgentWidget/FullPageSalesAgentWidget.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime9 from "react/jsx-runtime";
+import * as react_jsx_runtime8 from "react/jsx-runtime";
 
 //#region src/widgets/FullPageSalesAgentWidget/FullPageSalesAgentWidget.d.ts
 
@@ -8,7 +8,7 @@ interface FullPageSalesAgentBaseWidgetProps {
 declare const FullPageSalesAgentWidget: {
   ({
     widgetConfigId
-  }: FullPageSalesAgentBaseWidgetProps): react_jsx_runtime9.JSX.Element;
+  }: FullPageSalesAgentBaseWidgetProps): react_jsx_runtime8.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/FullPageSalesAgentWidget/FullPageSalesAgentWidget.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime10 from "react/jsx-runtime";
+import * as react_jsx_runtime17 from "react/jsx-runtime";
 
 //#region src/widgets/FullPageSalesAgentWidget/FullPageSalesAgentWidget.d.ts
 
@@ -8,7 +8,7 @@ interface FullPageSalesAgentBaseWidgetProps {
 declare const FullPageSalesAgentWidget: {
   ({
     widgetConfigId
-  }: FullPageSalesAgentBaseWidgetProps): react_jsx_runtime10.JSX.Element;
+  }: FullPageSalesAgentBaseWidgetProps): react_jsx_runtime17.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/ProductCardWidget/ProductCardWidget.cjs

@@ -44,6 +44,7 @@ const ProductCardWidgetHandler = (props) => {
 	const italicizeHeadline = productCardWidgetConfig?.italicizeHeadline;
 	const fallbackColor = productCardWidgetConfig?.fallbackColor;
 	const imageSrc = productCardWidgetConfig?.imageSrc || "";
+	const variant = productCardWidgetConfig?.mode ?? __envive_ai_react_toolkit_v3_ProductCard.ProductCardVariant.DARK;
 	const voiceInputEnabled = uiConfig?.lookAndFeel?.voiceInputEnabled;
 	const { featureFlagService } = (0, __envive_ai_react_hooks_contexts_featureFlagServiceContext.useFeatureFlagService)();
 	const isVoiceInputEnabled = featureFlagService?.isFeatureGateEnabled(__envive_ai_react_hooks_application_models.FeatureGates.IsVoiceInputEnabled) || voiceInputEnabled;
@@ -108,6 +109,7 @@ const ProductCardWidgetHandler = (props) => {
 	}, []);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__envive_ai_react_toolkit_v3_ProductCard.ProductCard, {
 		theme: __envive_ai_react_toolkit_v3_Tokens.Theme.GLOBAL_CUSTOM,
+		variant,
 		imageSrc,
 		fallbackColor,
 		headline,

package/dist/widgets/ProductCardWidget/ProductCardWidget.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 
 //#region src/widgets/ProductCardWidget/ProductCardWidget.d.ts
 interface ProductCardWidgetProps {
@@ -7,7 +7,7 @@ interface ProductCardWidgetProps {
 declare const ProductCardWidget: {
   ({
     widgetConfigId
-  }: ProductCardWidgetProps): react_jsx_runtime2.JSX.Element;
+  }: ProductCardWidgetProps): react_jsx_runtime3.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/ProductCardWidget/ProductCardWidget.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime9 from "react/jsx-runtime";
+import * as react_jsx_runtime19 from "react/jsx-runtime";
 
 //#region src/widgets/ProductCardWidget/ProductCardWidget.d.ts
 interface ProductCardWidgetProps {
@@ -7,7 +7,7 @@ interface ProductCardWidgetProps {
 declare const ProductCardWidget: {
   ({
     widgetConfigId
-  }: ProductCardWidgetProps): react_jsx_runtime9.JSX.Element;
+  }: ProductCardWidgetProps): react_jsx_runtime19.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/ProductCardWidget/ProductCardWidget.js

@@ -13,7 +13,7 @@ import { useWidgetInteraction } from "@envive-ai/react-hooks/hooks/WidgetInterac
 import { WidgetInteractionComponent, WidgetInteractionType } from "@envive-ai/react-hooks/hooks/WidgetInteraction/types";
 import { usePromptCarouselAnalytics } from "@envive-ai/react-toolkit-v3/PromptCarousel";
 import { Theme } from "@envive-ai/react-toolkit-v3/Tokens";
-import { ProductCard } from "@envive-ai/react-toolkit-v3/ProductCard";
+import { ProductCard, ProductCardVariant } from "@envive-ai/react-toolkit-v3/ProductCard";
 import { PromptButtonVariant } from "@envive-ai/react-toolkit-v3/PromptButton/types";
 
 //#region src/widgets/ProductCardWidget/ProductCardWidget.tsx
@@ -43,6 +43,7 @@ const ProductCardWidgetHandler = (props) => {
 	const italicizeHeadline = productCardWidgetConfig?.italicizeHeadline;
 	const fallbackColor = productCardWidgetConfig?.fallbackColor;
 	const imageSrc = productCardWidgetConfig?.imageSrc || "";
+	const variant = productCardWidgetConfig?.mode ?? ProductCardVariant.DARK;
 	const voiceInputEnabled = uiConfig?.lookAndFeel?.voiceInputEnabled;
 	const { featureFlagService } = useFeatureFlagService();
 	const isVoiceInputEnabled = featureFlagService?.isFeatureGateEnabled(FeatureGates.IsVoiceInputEnabled) || voiceInputEnabled;
@@ -107,6 +108,7 @@ const ProductCardWidgetHandler = (props) => {
 	}, []);
 	return /* @__PURE__ */ jsx(ProductCard, {
 		theme: Theme.GLOBAL_CUSTOM,
+		variant,
 		imageSrc,
 		fallbackColor,
 		headline,

package/dist/widgets/PromptButtonCarouselWithImageWidget/PromptButtonCarouselWithImageWidget.d.cts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.cjs";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime16 from "react/jsx-runtime";
 
 //#region src/widgets/PromptButtonCarouselWithImageWidget/PromptButtonCarouselWithImageWidget.d.ts
 declare const PromptButtonCarouselWithImageWidgetWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime0.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime16.JSX.Element;
   displayName: string;
 };
 interface PromptButtonCarouselWithImageWidgetProps {
@@ -12,7 +12,7 @@ interface PromptButtonCarouselWithImageWidgetProps {
 declare const PromptButtonCarouselWithImageWidget: {
   ({
     widgetConfigId
-  }: PromptButtonCarouselWithImageWidgetProps): react_jsx_runtime0.JSX.Element;
+  }: PromptButtonCarouselWithImageWidgetProps): react_jsx_runtime16.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/PromptButtonCarouselWithImageWidget/PromptButtonCarouselWithImageWidget.d.ts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.js";
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/widgets/PromptButtonCarouselWithImageWidget/PromptButtonCarouselWithImageWidget.d.ts
 declare const PromptButtonCarouselWithImageWidgetWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime5.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime0.JSX.Element;
   displayName: string;
 };
 interface PromptButtonCarouselWithImageWidgetProps {
@@ -12,7 +12,7 @@ interface PromptButtonCarouselWithImageWidgetProps {
 declare const PromptButtonCarouselWithImageWidget: {
   ({
     widgetConfigId
-  }: PromptButtonCarouselWithImageWidgetProps): react_jsx_runtime5.JSX.Element;
+  }: PromptButtonCarouselWithImageWidgetProps): react_jsx_runtime0.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/PromptCarouselWidget/PromptCarouselWidget.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
 
 //#region src/widgets/PromptCarouselWidget/PromptCarouselWidget.d.ts
 interface PromptCarouselWidgetProps {
@@ -7,7 +7,7 @@ interface PromptCarouselWidgetProps {
 declare const PromptCarouselWidget: {
   ({
     widgetConfigId
-  }: PromptCarouselWidgetProps): react_jsx_runtime8.JSX.Element;
+  }: PromptCarouselWidgetProps): react_jsx_runtime7.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/SocialProofFlowWidget/SocialProofFlowWidget.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime4 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 
 //#region src/widgets/SocialProofFlowWidget/SocialProofFlowWidget.d.ts
 interface SocialProofFlowWidgetProps {
@@ -7,7 +7,7 @@ interface SocialProofFlowWidgetProps {
 declare const SocialProofFlowWidget: {
   ({
     widgetConfigId
-  }: SocialProofFlowWidgetProps): react_jsx_runtime4.JSX.Element;
+  }: SocialProofFlowWidgetProps): react_jsx_runtime2.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/SocialProofFlowWidget/SocialProofFlowWidget.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
 
 //#region src/widgets/SocialProofFlowWidget/SocialProofFlowWidget.d.ts
 interface SocialProofFlowWidgetProps {
@@ -7,7 +7,7 @@ interface SocialProofFlowWidgetProps {
 declare const SocialProofFlowWidget: {
   ({
     widgetConfigId
-  }: SocialProofFlowWidgetProps): react_jsx_runtime0.JSX.Element;
+  }: SocialProofFlowWidgetProps): react_jsx_runtime4.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/SocialProofWidget/SocialProofWidget.cjs

@@ -28,7 +28,7 @@ const SocialProofWidgetHandler = (props) => {
 	const variantInfo = (0, jotai.useAtomValue)(__envive_ai_react_hooks_atoms_app.variantInfoAtom);
 	const { trackWidgetInteraction } = (0, __envive_ai_react_hooks_hooks_WidgetInteraction.useWidgetInteraction)();
 	const { onClick: onSuggestionClick, onHover, onDrag, onMouseDown, onMouseUp, onTouchStart, onTouchEnd } = (0, __envive_ai_react_toolkit_v3_PromptCarousel.usePromptCarouselAnalytics)(__envive_ai_react_hooks_hooks_WidgetInteraction_types.WidgetInteractionComponent.SOCIAL_PROOF, (text) => text);
-	const { hardcopyContent, widgetConfig, uiConfig, isLoading, widgetConfigId } = props;
+	const { hardcopyContent: rawHardcopyContent, widgetConfig, uiConfig, isLoading, widgetConfigId } = props;
 	const socialProofWidgetConfig = widgetConfig;
 	const id = widgetConfig?.contentId;
 	const { pageVariant, countKey } = (0, react.useMemo)(() => {
@@ -46,12 +46,13 @@ const SocialProofWidgetHandler = (props) => {
 		};
 	}, [variantInfo]);
 	const hardCopyContent = {
-		titleLabel: hardcopyContent?.values?.titleLabel,
-		customerQueryText: hardcopyContent?.values?.customerQueryText,
-		primaryButtonText: hardcopyContent?.values?.primaryButtonText,
-		secondaryButtonTitleText: hardcopyContent?.values?.secondaryButtonTitleText,
-		secondaryButtonTexts: hardcopyContent?.values?.secondaryButtonTexts,
-		textFieldPlaceholderText: hardcopyContent?.values?.textFieldPlaceholderText
+		titleLabel: rawHardcopyContent?.values?.titleLabel,
+		numberOfCustomersText: rawHardcopyContent?.values.numberOfCustomersText,
+		customerQueryText: rawHardcopyContent?.values?.customerQueryText,
+		primaryButtonText: rawHardcopyContent?.values?.primaryButtonText,
+		secondaryButtonTitleText: rawHardcopyContent?.values?.secondaryButtonTitleText,
+		secondaryButtonTexts: rawHardcopyContent?.values?.secondaryButtonTexts,
+		textFieldPlaceholderText: rawHardcopyContent?.values?.textFieldPlaceholderText
 	};
 	const logoSrc = uiConfig?.lookAndFeel?.widgetLogoSrc;
 	const hideLogo = uiConfig?.lookAndFeel?.hideWidgetLogo;
@@ -65,12 +66,12 @@ const SocialProofWidgetHandler = (props) => {
 	}];
 	const { trackEvent } = (0, __envive_ai_react_hooks_contexts_amplitudeContext.useAmplitude)();
 	const handlePrimaryButtonClick = (0, react.useCallback)((text) => {
-		const rawValues = hardcopyContent?.rawValues;
+		const rawValues = rawHardcopyContent?.rawValues;
 		const stringId = require_functions.getStringIdForText(rawValues, text);
 		trackEvent({
 			eventName: __envive_ai_react_hooks_contexts_amplitudeContext.EnviveMetricsEventName.WidgetTextClicked,
 			eventProps: {
-				response_id: hardcopyContent?.responseId,
+				response_id: rawHardcopyContent?.responseId,
 				string_id: stringId,
 				text
 			}
@@ -101,12 +102,12 @@ const SocialProofWidgetHandler = (props) => {
 		});
 	}, []);
 	const handleSecondaryButtonClick = (0, react.useCallback)((text) => {
-		const rawValues = hardcopyContent?.rawValues;
+		const rawValues = rawHardcopyContent?.rawValues;
 		const stringId = require_functions.getStringIdForText(rawValues, text);
 		trackEvent({
 			eventName: __envive_ai_react_hooks_contexts_amplitudeContext.EnviveMetricsEventName.WidgetTextClicked,
 			eventProps: {
-				response_id: hardcopyContent?.responseId,
+				response_id: rawHardcopyContent?.responseId,
 				string_id: stringId,
 				text
 			}
@@ -152,8 +153,8 @@ const SocialProofWidgetHandler = (props) => {
 	setChatPreviewLoadingData({
 		widgetConfigId,
 		data: {
-			titleLabel: hardcopyContent?.values?.titleLabel,
-			textFieldPlaceholder: hardcopyContent?.values?.textFieldPlaceholderText,
+			titleLabel: hardCopyContent?.titleLabel,
+			textFieldPlaceholder: hardCopyContent?.textFieldPlaceholderText,
 			logoSrc,
 			hideLogo: hideLogo ?? false,
 			variant: socialProofWidgetConfig?.variant,
@@ -177,6 +178,7 @@ const SocialProofWidgetHandler = (props) => {
 	};
 	const widgetContentProps = {
 		titleLabel: hardCopyContent?.titleLabel,
+		numberOfCustomersText: hardCopyContent?.numberOfCustomersText,
 		customerQueryText: hardCopyContent?.customerQueryText,
 		primaryButtonText: hardCopyContent?.primaryButtonText,
 		secondaryButtonTitleText: hardCopyContent?.secondaryButtonTitleText,

package/dist/widgets/SocialProofWidget/SocialProofWidget.d.cts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.cjs";
-import * as react_jsx_runtime18 from "react/jsx-runtime";
+import * as react_jsx_runtime14 from "react/jsx-runtime";
 
 //#region src/widgets/SocialProofWidget/SocialProofWidget.d.ts
 declare const SocialProofWidgetWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime18.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime14.JSX.Element;
   displayName: string;
 };
 interface SocialProofWidgetProps {
@@ -12,7 +12,7 @@ interface SocialProofWidgetProps {
 declare const SocialProofWidget: {
   ({
     widgetConfigId
-  }: SocialProofWidgetProps): react_jsx_runtime18.JSX.Element;
+  }: SocialProofWidgetProps): react_jsx_runtime14.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/SocialProofWidget/SocialProofWidget.d.ts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.js";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime13 from "react/jsx-runtime";
 
 //#region src/widgets/SocialProofWidget/SocialProofWidget.d.ts
 declare const SocialProofWidgetWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime0.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime13.JSX.Element;
   displayName: string;
 };
 interface SocialProofWidgetProps {
@@ -12,7 +12,7 @@ interface SocialProofWidgetProps {
 declare const SocialProofWidget: {
   ({
     widgetConfigId
-  }: SocialProofWidgetProps): react_jsx_runtime0.JSX.Element;
+  }: SocialProofWidgetProps): react_jsx_runtime13.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/SocialProofWidget/SocialProofWidget.js

@@ -27,7 +27,7 @@ const SocialProofWidgetHandler = (props) => {
 	const variantInfo = useAtomValue(variantInfoAtom);
 	const { trackWidgetInteraction } = useWidgetInteraction();
 	const { onClick: onSuggestionClick, onHover, onDrag, onMouseDown, onMouseUp, onTouchStart, onTouchEnd } = usePromptCarouselAnalytics(WidgetInteractionComponent.SOCIAL_PROOF, (text) => text);
-	const { hardcopyContent, widgetConfig, uiConfig, isLoading, widgetConfigId } = props;
+	const { hardcopyContent: rawHardcopyContent, widgetConfig, uiConfig, isLoading, widgetConfigId } = props;
 	const socialProofWidgetConfig = widgetConfig;
 	const id = widgetConfig?.contentId;
 	const { pageVariant, countKey } = useMemo(() => {
@@ -45,12 +45,13 @@ const SocialProofWidgetHandler = (props) => {
 		};
 	}, [variantInfo]);
 	const hardCopyContent = {
-		titleLabel: hardcopyContent?.values?.titleLabel,
-		customerQueryText: hardcopyContent?.values?.customerQueryText,
-		primaryButtonText: hardcopyContent?.values?.primaryButtonText,
-		secondaryButtonTitleText: hardcopyContent?.values?.secondaryButtonTitleText,
-		secondaryButtonTexts: hardcopyContent?.values?.secondaryButtonTexts,
-		textFieldPlaceholderText: hardcopyContent?.values?.textFieldPlaceholderText
+		titleLabel: rawHardcopyContent?.values?.titleLabel,
+		numberOfCustomersText: rawHardcopyContent?.values.numberOfCustomersText,
+		customerQueryText: rawHardcopyContent?.values?.customerQueryText,
+		primaryButtonText: rawHardcopyContent?.values?.primaryButtonText,
+		secondaryButtonTitleText: rawHardcopyContent?.values?.secondaryButtonTitleText,
+		secondaryButtonTexts: rawHardcopyContent?.values?.secondaryButtonTexts,
+		textFieldPlaceholderText: rawHardcopyContent?.values?.textFieldPlaceholderText
 	};
 	const logoSrc = uiConfig?.lookAndFeel?.widgetLogoSrc;
 	const hideLogo = uiConfig?.lookAndFeel?.hideWidgetLogo;
@@ -64,12 +65,12 @@ const SocialProofWidgetHandler = (props) => {
 	}];
 	const { trackEvent } = useAmplitude();
 	const handlePrimaryButtonClick = useCallback((text) => {
-		const rawValues = hardcopyContent?.rawValues;
+		const rawValues = rawHardcopyContent?.rawValues;
 		const stringId = getStringIdForText(rawValues, text);
 		trackEvent({
 			eventName: EnviveMetricsEventName.WidgetTextClicked,
 			eventProps: {
-				response_id: hardcopyContent?.responseId,
+				response_id: rawHardcopyContent?.responseId,
 				string_id: stringId,
 				text
 			}
@@ -100,12 +101,12 @@ const SocialProofWidgetHandler = (props) => {
 		});
 	}, []);
 	const handleSecondaryButtonClick = useCallback((text) => {
-		const rawValues = hardcopyContent?.rawValues;
+		const rawValues = rawHardcopyContent?.rawValues;
 		const stringId = getStringIdForText(rawValues, text);
 		trackEvent({
 			eventName: EnviveMetricsEventName.WidgetTextClicked,
 			eventProps: {
-				response_id: hardcopyContent?.responseId,
+				response_id: rawHardcopyContent?.responseId,
 				string_id: stringId,
 				text
 			}
@@ -151,8 +152,8 @@ const SocialProofWidgetHandler = (props) => {
 	setChatPreviewLoadingData({
 		widgetConfigId,
 		data: {
-			titleLabel: hardcopyContent?.values?.titleLabel,
-			textFieldPlaceholder: hardcopyContent?.values?.textFieldPlaceholderText,
+			titleLabel: hardCopyContent?.titleLabel,
+			textFieldPlaceholder: hardCopyContent?.textFieldPlaceholderText,
 			logoSrc,
 			hideLogo: hideLogo ?? false,
 			variant: socialProofWidgetConfig?.variant,
@@ -176,6 +177,7 @@ const SocialProofWidgetHandler = (props) => {
 	};
 	const widgetContentProps = {
 		titleLabel: hardCopyContent?.titleLabel,
+		numberOfCustomersText: hardCopyContent?.numberOfCustomersText,
 		customerQueryText: hardCopyContent?.customerQueryText,
 		primaryButtonText: hardCopyContent?.primaryButtonText,
 		secondaryButtonTitleText: hardCopyContent?.secondaryButtonTitleText,

package/dist/widgets/TitledPromptCarouselWidget/TitledPromptCarouselWidget.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime17 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/widgets/TitledPromptCarouselWidget/TitledPromptCarouselWidget.d.ts
 interface TitledPromptCarouselWidgetProps {
@@ -7,7 +7,7 @@ interface TitledPromptCarouselWidgetProps {
 declare const TitledPromptCarouselWidget: {
   ({
     widgetConfigId
-  }: TitledPromptCarouselWidgetProps): react_jsx_runtime17.JSX.Element;
+  }: TitledPromptCarouselWidgetProps): react_jsx_runtime0.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/TypingAnimationFlowWidget/TypingAnimationFlowWidget.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/widgets/TypingAnimationFlowWidget/TypingAnimationFlowWidget.d.ts
 interface TypingAnimationFlowWidgetProps {
@@ -7,7 +7,7 @@ interface TypingAnimationFlowWidgetProps {
 declare const TypingAnimationFlowWidget: {
   ({
     widgetConfigId
-  }: TypingAnimationFlowWidgetProps): react_jsx_runtime3.JSX.Element;
+  }: TypingAnimationFlowWidgetProps): react_jsx_runtime0.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/TypingAnimationFlowWidget/TypingAnimationFlowWidget.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime7 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 
 //#region src/widgets/TypingAnimationFlowWidget/TypingAnimationFlowWidget.d.ts
 interface TypingAnimationFlowWidgetProps {
@@ -7,7 +7,7 @@ interface TypingAnimationFlowWidgetProps {
 declare const TypingAnimationFlowWidget: {
   ({
     widgetConfigId
-  }: TypingAnimationFlowWidgetProps): react_jsx_runtime7.JSX.Element;
+  }: TypingAnimationFlowWidgetProps): react_jsx_runtime3.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/TypingAnimationWidget/TypingAnimationWidget.d.cts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.cjs";
-import * as react_jsx_runtime15 from "react/jsx-runtime";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 
 //#region src/widgets/TypingAnimationWidget/TypingAnimationWidget.d.ts
 declare const TypingAnimationWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime15.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime18.JSX.Element;
   displayName: string;
 };
 interface TypingAnimationWidgetProps {
@@ -12,7 +12,7 @@ interface TypingAnimationWidgetProps {
 declare const TypingAnimationWidget: {
   ({
     widgetConfigId
-  }: TypingAnimationWidgetProps): react_jsx_runtime15.JSX.Element;
+  }: TypingAnimationWidgetProps): react_jsx_runtime18.JSX.Element;
   displayName: string;
 };
 //#endregion

package/dist/widgets/TypingAnimationWidget/TypingAnimationWidget.d.ts

@@ -1,9 +1,9 @@
 import { BaseWidgetProps } from "../../hocs/withBaseWidget/types.js";
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime5 from "react/jsx-runtime";
 
 //#region src/widgets/TypingAnimationWidget/TypingAnimationWidget.d.ts
 declare const TypingAnimationWithBaseWidget: {
-  (props: BaseWidgetProps): react_jsx_runtime3.JSX.Element;
+  (props: BaseWidgetProps): react_jsx_runtime5.JSX.Element;
   displayName: string;
 };
 interface TypingAnimationWidgetProps {
@@ -12,7 +12,7 @@ interface TypingAnimationWidgetProps {
 declare const TypingAnimationWidget: {
   ({
     widgetConfigId
-  }: TypingAnimationWidgetProps): react_jsx_runtime3.JSX.Element;
+  }: TypingAnimationWidgetProps): react_jsx_runtime5.JSX.Element;
   displayName: string;
 };
 //#endregion

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@envive-ai/react-widgets-v3",
-  "version": "0.3.32",
+  "version": "0.3.33",
   "description": "React widget library v3 for Envive services.",
   "keywords": [
     "react",

package/src/widgets/ProductCardWidget/ProductCardWidget.tsx

@@ -15,7 +15,7 @@ import {
   WidgetInteractionComponent,
   WidgetInteractionType,
 } from '@envive-ai/react-hooks/hooks/WidgetInteraction/types';
-import { ProductCard } from '@envive-ai/react-toolkit-v3/ProductCard';
+import { ProductCard, ProductCardVariant } from '@envive-ai/react-toolkit-v3/ProductCard';
 import { PromptButtonVariant } from '@envive-ai/react-toolkit-v3/PromptButton/types';
 import { usePromptCarouselAnalytics } from '@envive-ai/react-toolkit-v3/PromptCarousel';
 import { Theme } from '@envive-ai/react-toolkit-v3/Tokens';
@@ -59,6 +59,7 @@ const ProductCardWidgetHandler = (props: BaseWidgetProps) => {
   const italicizeHeadline = productCardWidgetConfig?.italicizeHeadline;
   const fallbackColor = productCardWidgetConfig?.fallbackColor;
   const imageSrc = productCardWidgetConfig?.imageSrc || '';
+  const variant = (productCardWidgetConfig?.mode as ProductCardVariant) ?? ProductCardVariant.DARK;
   const voiceInputEnabled = uiConfig?.lookAndFeel?.voiceInputEnabled;
   const { featureFlagService } = useFeatureFlagService();
   const isVoiceInputEnabled =
@@ -139,6 +140,7 @@ const ProductCardWidgetHandler = (props: BaseWidgetProps) => {
   return (
     <ProductCard
       theme={Theme.GLOBAL_CUSTOM}
+      variant={variant}
       imageSrc={imageSrc}
       fallbackColor={fallbackColor}
       headline={headline}

package/src/widgets/SocialProofWidget/SocialProofWidget.tsx

@@ -53,7 +53,13 @@ const SocialProofWidgetHandler = (props: BaseWidgetProps) => {
     onTouchEnd,
   } = usePromptCarouselAnalytics(WidgetInteractionComponent.SOCIAL_PROOF, text => text);
 
-  const { hardcopyContent, widgetConfig, uiConfig, isLoading, widgetConfigId } = props;
+  const {
+    hardcopyContent: rawHardcopyContent,
+    widgetConfig,
+    uiConfig,
+    isLoading,
+    widgetConfigId,
+  } = props;
 
   const socialProofWidgetConfig = widgetConfig as SocialProofWidgetV3Config;
 
@@ -79,15 +85,17 @@ const SocialProofWidgetHandler = (props: BaseWidgetProps) => {
   }, [variantInfo]);
 
   const hardCopyContent = {
-    titleLabel: hardcopyContent?.values?.titleLabel,
-    customerQueryText: hardcopyContent?.values?.customerQueryText,
-    primaryButtonText: hardcopyContent?.values?.primaryButtonText,
-    secondaryButtonTitleText: hardcopyContent?.values?.secondaryButtonTitleText,
-    secondaryButtonTexts: hardcopyContent?.values?.secondaryButtonTexts,
-    textFieldPlaceholderText: hardcopyContent?.values?.textFieldPlaceholderText,
+    titleLabel: rawHardcopyContent?.values?.titleLabel,
+    numberOfCustomersText: rawHardcopyContent?.values.numberOfCustomersText,
+    customerQueryText: rawHardcopyContent?.values?.customerQueryText,
+    primaryButtonText: rawHardcopyContent?.values?.primaryButtonText,
+    secondaryButtonTitleText: rawHardcopyContent?.values?.secondaryButtonTitleText,
+    secondaryButtonTexts: rawHardcopyContent?.values?.secondaryButtonTexts,
+    textFieldPlaceholderText: rawHardcopyContent?.values?.textFieldPlaceholderText,
   } as Pick<
     SocialProofProps['widgetContentProps'],
     | 'titleLabel'
+    | 'numberOfCustomersText'
     | 'customerQueryText'
     | 'primaryButtonText'
     | 'secondaryButtonTitleText'
@@ -116,12 +124,12 @@ const SocialProofWidgetHandler = (props: BaseWidgetProps) => {
 
   const handlePrimaryButtonClick = useCallback(
     (text: string) => {
-      const rawValues = (hardcopyContent as { rawValues?: RawValues } | undefined)?.rawValues;
+      const rawValues = (rawHardcopyContent as { rawValues?: RawValues } | undefined)?.rawValues;
       const stringId = getStringIdForText(rawValues, text);
       trackEvent({
         eventName: EnviveMetricsEventName.WidgetTextClicked,
         eventProps: {
-          response_id: hardcopyContent?.responseId,
+          response_id: rawHardcopyContent?.responseId,
           string_id: stringId,
           text,
         },
@@ -166,12 +174,12 @@ const SocialProofWidgetHandler = (props: BaseWidgetProps) => {
 
   const handleSecondaryButtonClick = useCallback(
     (text: string) => {
-      const rawValues = (hardcopyContent as { rawValues?: RawValues } | undefined)?.rawValues;
+      const rawValues = (rawHardcopyContent as { rawValues?: RawValues } | undefined)?.rawValues;
       const stringId = getStringIdForText(rawValues, text);
       trackEvent({
         eventName: EnviveMetricsEventName.WidgetTextClicked,
         eventProps: {
-          response_id: hardcopyContent?.responseId,
+          response_id: rawHardcopyContent?.responseId,
           string_id: stringId,
           text,
         },
@@ -228,8 +236,8 @@ const SocialProofWidgetHandler = (props: BaseWidgetProps) => {
   setChatPreviewLoadingData({
     widgetConfigId,
     data: {
-      titleLabel: hardcopyContent?.values?.titleLabel as string,
-      textFieldPlaceholder: hardcopyContent?.values?.textFieldPlaceholderText as string,
+      titleLabel: hardCopyContent?.titleLabel as string,
+      textFieldPlaceholder: hardCopyContent?.textFieldPlaceholderText as string,
       logoSrc: logoSrc as string,
       hideLogo: hideLogo ?? false,
       variant: socialProofWidgetConfig?.variant,
@@ -256,6 +264,7 @@ const SocialProofWidgetHandler = (props: BaseWidgetProps) => {
 
   const widgetContentProps: SocialProofProps['widgetContentProps'] = {
     titleLabel: hardCopyContent?.titleLabel,
+    numberOfCustomersText: hardCopyContent?.numberOfCustomersText,
     customerQueryText: hardCopyContent?.customerQueryText,
     primaryButtonText: hardCopyContent?.primaryButtonText,
     secondaryButtonTitleText: hardCopyContent?.secondaryButtonTitleText,