@envive-ai/react-toolkit-v3 0.3.5

package/dist/SalesAgentProductCard/types/types.d.cts

@@ -0,0 +1,104 @@
+import { Theme } from "../../components-v3/tokens/theme/theme.cjs";
+import { ImageAspectRatio } from "../../Image/types/index.cjs";
+
+//#region src/components/SalesAgentProductCard/types/types.d.ts
+
+/**
+ * Variant options for the SalesAgentProductCard component.
+ *
+ * @public
+ */
+declare enum SalesAgentProductCardVariant {
+  SMALL = "small",
+  LARGE = "large",
+}
+/**
+ * Props for the SalesAgentProductCard component.
+ *
+ * @public
+ */
+type SalesAgentProductCardProps = {
+  /**
+   * Unique identifier for the product card.
+   */
+  id?: string;
+  /**
+   * Test identifier for testing purposes.
+   */
+  testId?: string;
+  /**
+   * Additional CSS class names to apply to the card.
+   */
+  className?: string;
+  /**
+   * Inline styles to apply to the card.
+   */
+  style?: React.CSSProperties;
+  /**
+   * The name of the product to display.
+   */
+  productName: string;
+  /**
+   * The previous price of the product (for showing discounts).
+   */
+  previousPrice?: number;
+  /**
+   * The current price of the product.
+   */
+  currentPrice: number;
+  /**
+   * The prefix to display before the price.
+   */
+  pricePrefix?: string;
+  /**
+   * The rating value for the product.
+   */
+  rate: number;
+  /**
+   * The number of reviews for the product.
+   */
+  numberOfReviews: number;
+  /**
+   * The aspect ratio of the product image.
+   * @default ImageAspectRatio.GLOBAL_CUSTOM to use the global custom aspect ratio token (--envive-global-custom-aspect-ratio)
+   */
+  imageAspectRatio?: ImageAspectRatio;
+  /**
+   * The theme to apply to the card.
+   * @default Theme.GLOBAL_CUSTOM
+   */
+  theme?: Theme;
+  /**
+   * The URL to navigate to when the card is clicked.
+   */
+  url?: string;
+  /**
+   * Callback function called when the card is clicked.
+   */
+  onClick?: () => void;
+  /**
+   * The variant size of the card.
+   * @default SalesAgentProductCardVariant.LARGE
+   */
+  variant?: SalesAgentProductCardVariant;
+  /**
+   * The product image configuration.
+   */
+  image: {
+    /**
+     * The source URL of the product image.
+     */
+    src: string;
+    /**
+     * The alt text for the product image.
+     */
+    alt: string;
+  };
+  /**
+   * Whether to force show the current price empty space.
+   * @default false
+   */
+  forceShowCurrentPriceSpace?: boolean;
+};
+//#endregion
+export { SalesAgentProductCardProps, SalesAgentProductCardVariant };

package/dist/SalesAgentProductCard/types/types.d.ts

@@ -0,0 +1,104 @@
+import { Theme } from "../../components-v3/tokens/theme/theme.js";
+import { ImageAspectRatio } from "../../Image/types/index.js";
+
+//#region src/components/SalesAgentProductCard/types/types.d.ts
+
+/**
+ * Variant options for the SalesAgentProductCard component.
+ *
+ * @public
+ */
+declare enum SalesAgentProductCardVariant {
+  SMALL = "small",
+  LARGE = "large",
+}
+/**
+ * Props for the SalesAgentProductCard component.
+ *
+ * @public
+ */
+type SalesAgentProductCardProps = {
+  /**
+   * Unique identifier for the product card.
+   */
+  id?: string;
+  /**
+   * Test identifier for testing purposes.
+   */
+  testId?: string;
+  /**
+   * Additional CSS class names to apply to the card.
+   */
+  className?: string;
+  /**
+   * Inline styles to apply to the card.
+   */
+  style?: React.CSSProperties;
+  /**
+   * The name of the product to display.
+   */
+  productName: string;
+  /**
+   * The previous price of the product (for showing discounts).
+   */
+  previousPrice?: number;
+  /**
+   * The current price of the product.
+   */
+  currentPrice: number;
+  /**
+   * The prefix to display before the price.
+   */
+  pricePrefix?: string;
+  /**
+   * The rating value for the product.
+   */
+  rate: number;
+  /**
+   * The number of reviews for the product.
+   */
+  numberOfReviews: number;
+  /**
+   * The aspect ratio of the product image.
+   * @default ImageAspectRatio.GLOBAL_CUSTOM to use the global custom aspect ratio token (--envive-global-custom-aspect-ratio)
+   */
+  imageAspectRatio?: ImageAspectRatio;
+  /**
+   * The theme to apply to the card.
+   * @default Theme.GLOBAL_CUSTOM
+   */
+  theme?: Theme;
+  /**
+   * The URL to navigate to when the card is clicked.
+   */
+  url?: string;
+  /**
+   * Callback function called when the card is clicked.
+   */
+  onClick?: () => void;
+  /**
+   * The variant size of the card.
+   * @default SalesAgentProductCardVariant.LARGE
+   */
+  variant?: SalesAgentProductCardVariant;
+  /**
+   * The product image configuration.
+   */
+  image: {
+    /**
+     * The source URL of the product image.
+     */
+    src: string;
+    /**
+     * The alt text for the product image.
+     */
+    alt: string;
+  };
+  /**
+   * Whether to force show the current price empty space.
+   * @default false
+   */
+  forceShowCurrentPriceSpace?: boolean;
+};
+//#endregion
+export { SalesAgentProductCardProps, SalesAgentProductCardVariant };

package/dist/SalesAgentProductCard/types/types.js

@@ -0,0 +1,14 @@
+//#region src/components/SalesAgentProductCard/types/types.ts
+/**
+* Variant options for the SalesAgentProductCard component.
+*
+* @public
+*/
+let SalesAgentProductCardVariant = /* @__PURE__ */ function(SalesAgentProductCardVariant$1) {
+	SalesAgentProductCardVariant$1["SMALL"] = "small";
+	SalesAgentProductCardVariant$1["LARGE"] = "large";
+	return SalesAgentProductCardVariant$1;
+}({});
+
+//#endregion
+export { SalesAgentProductCardVariant };

package/dist/SalesAgentProductCard/utils/functions.cjs

@@ -0,0 +1,21 @@
+
+//#region src/components/SalesAgentProductCard/utils/functions.ts
+const formattedRate = (rate, numberOfReviews) => {
+	const rateString = String(Number(rate).toLocaleString("en-US", {
+		minimumFractionDigits: 1,
+		maximumFractionDigits: 1
+	}));
+	if (numberOfReviews) return `${rateString} (${numberOfReviews})`;
+	return !rate ? void 0 : rateString;
+};
+const formattedPrice = (price, pricePrefix) => {
+	if (price == null) return "";
+	return `${pricePrefix}${price.toLocaleString("en-US", {
+		minimumFractionDigits: 2,
+		maximumFractionDigits: 2
+	})}`;
+};
+
+//#endregion
+exports.formattedPrice = formattedPrice;
+exports.formattedRate = formattedRate;

package/dist/SalesAgentProductCard/utils/functions.js

@@ -0,0 +1,19 @@
+//#region src/components/SalesAgentProductCard/utils/functions.ts
+const formattedRate = (rate, numberOfReviews) => {
+	const rateString = String(Number(rate).toLocaleString("en-US", {
+		minimumFractionDigits: 1,
+		maximumFractionDigits: 1
+	}));
+	if (numberOfReviews) return `${rateString} (${numberOfReviews})`;
+	return !rate ? void 0 : rateString;
+};
+const formattedPrice = (price, pricePrefix) => {
+	if (price == null) return "";
+	return `${pricePrefix}${price.toLocaleString("en-US", {
+		minimumFractionDigits: 2,
+		maximumFractionDigits: 2
+	})}`;
+};
+
+//#endregion
+export { formattedPrice, formattedRate };

package/dist/SocialProof/SocialProof.cjs

@@ -0,0 +1,106 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_theme = require('../components-v3/tokens/theme/theme.cjs');
+const require_resolveTheme = require('../utils/resolveTheme.cjs');
+require('../Tokens/index.cjs');
+const require_PromptButton_types_index = require('../PromptButton/types/index.cjs');
+require('../PromptButton/index.cjs');
+const require_useCheckIsMobile = require('../utils/useCheckIsMobile.cjs');
+const require_PromptCarousel_types_types = require('../PromptCarousel/types/types.cjs');
+require('../PromptCarousel/index.cjs');
+const require_types = require('../WidgetWrapper/types/types.cjs');
+require('../WidgetWrapper/index.cjs');
+const require_WidgetWrapperWithTitle = require('../WidgetWrapperWithTitle/WidgetWrapperWithTitle.cjs');
+const require_types$1 = require('../ImageGallery/types/types.cjs');
+const require_index = require('./components/index.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/SocialProof/SocialProof.tsx
+const SocialProof = ({ baseProps, widgetContentProps, widgetStyleProps, widgetEventProps }) => {
+	const { id, testId, className, style } = baseProps ?? {};
+	const { theme = require_theme.Theme.GLOBAL_CUSTOM, variant = require_types.WidgetWrapperVariant.CARD_WITH_BORDER, hexCardColor, promptCarouselRows = require_PromptCarousel_types_types.PromptCarouselRows.TWO_ON_MOBILE_ONE_ON_DESKTOP, hideImage, imageGalleryLayout, hideTextField, primaryButtonVariant = require_PromptButton_types_index.PromptButtonVariant.DARK, secondaryButtonVariant = require_PromptButton_types_index.PromptButtonVariant.LIGHT, hideLogo, dynamicLayout } = widgetStyleProps ?? {};
+	const { numberOfCustomersText, customerQueryText, primaryButtonText, secondaryButtonTitleText, secondaryButtonTexts, textFieldPlaceholderText, images, logoSrc, titleLabel } = widgetContentProps ?? {};
+	const { handlePrimaryButtonClick, handleSecondaryButtonClick, handleTextFieldClick } = widgetEventProps ?? {};
+	const finalTheme = require_resolveTheme.resolveTheme(theme);
+	const { isMobile } = require_useCheckIsMobile.useCheckIsMobile("sm");
+	const hasDynamicLayout = dynamicLayout !== void 0;
+	const headline = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.SocialProofComponents.Headline, {
+		theme: finalTheme,
+		socialProofCounter: numberOfCustomersText,
+		socialProofHeadline: customerQueryText,
+		primaryPromptButtonText: primaryButtonText,
+		primaryPromptButtonVariant: primaryButtonVariant,
+		handleButtonClick: handlePrimaryButtonClick
+	});
+	const subheadline = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.SocialProofComponents.Subheadline, {
+		theme: finalTheme,
+		secondaryPromptButtonTexts: secondaryButtonTexts,
+		secondaryPromptCarouselRows: promptCarouselRows,
+		secondaryPromptButtonType: secondaryButtonVariant,
+		subheadlineText: secondaryButtonTitleText,
+		handleButtonClick: handleSecondaryButtonClick
+	});
+	const textfield = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.SocialProofComponents.Textfield, {
+		theme: finalTheme,
+		placeholder: textFieldPlaceholderText,
+		handleTextFieldClick
+	});
+	const hideImageGallery = hideImage || !images || images.length === 0;
+	if (!isMobile && imageGalleryLayout === require_types$1.ImageGalleryLayout.FOUR_GRID && !hasDynamicLayout) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_WidgetWrapperWithTitle.WidgetWrapperWithTitle, {
+		id,
+		testId,
+		variant,
+		className,
+		style,
+		titleLabel,
+		logoSrc,
+		hexCardColor,
+		hideLogo,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.SocialProofComponents.LayoutFourGrid, {
+			hideImage: hideImageGallery,
+			images,
+			headline,
+			subheadline,
+			textfield: !hideTextField && textfield
+		})
+	});
+	if ((imageGalleryLayout === require_types$1.ImageGalleryLayout.FOUR_HORIZONTAL || isMobile && imageGalleryLayout === require_types$1.ImageGalleryLayout.FOUR_GRID) && !hasDynamicLayout) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_WidgetWrapperWithTitle.WidgetWrapperWithTitle, {
+		id,
+		testId,
+		variant,
+		className,
+		style,
+		titleLabel,
+		logoSrc,
+		hexCardColor,
+		hideLogo,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.SocialProofComponents.LayoutFourHorizontal, {
+			hideImage: hideImageGallery,
+			images,
+			headline,
+			subheadline,
+			textfield: !hideTextField && textfield
+		})
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_WidgetWrapperWithTitle.WidgetWrapperWithTitle, {
+		id,
+		testId,
+		variant,
+		className,
+		style,
+		titleLabel,
+		logoSrc,
+		hexCardColor,
+		hideLogo,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index.SocialProofComponents.LayoutSingle, {
+			hideImage: hideImageGallery,
+			dynamicLayout,
+			images,
+			headline,
+			subheadline,
+			textfield: !hideTextField && textfield
+		})
+	});
+};
+
+//#endregion
+exports.SocialProof = SocialProof;

package/dist/SocialProof/SocialProof.d.cts

@@ -0,0 +1,12 @@
+import { SocialProofProps } from "./types/types.cjs";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
+
+//#region src/components/SocialProof/SocialProof.d.ts
+declare const SocialProof: ({
+  baseProps,
+  widgetContentProps,
+  widgetStyleProps,
+  widgetEventProps
+}: SocialProofProps) => react_jsx_runtime1.JSX.Element;
+//#endregion
+export { SocialProof };

package/dist/SocialProof/SocialProof.d.ts

@@ -0,0 +1,12 @@
+import { SocialProofProps } from "./types/types.js";
+import * as react_jsx_runtime9 from "react/jsx-runtime";
+
+//#region src/components/SocialProof/SocialProof.d.ts
+declare const SocialProof: ({
+  baseProps,
+  widgetContentProps,
+  widgetStyleProps,
+  widgetEventProps
+}: SocialProofProps) => react_jsx_runtime9.JSX.Element;
+//#endregion
+export { SocialProof };

package/dist/SocialProof/SocialProof.js

@@ -0,0 +1,105 @@
+import { Theme } from "../components-v3/tokens/theme/theme.js";
+import { resolveTheme } from "../utils/resolveTheme.js";
+import "../Tokens/index.js";
+import { PromptButtonVariant } from "../PromptButton/types/index.js";
+import "../PromptButton/index.js";
+import { useCheckIsMobile } from "../utils/useCheckIsMobile.js";
+import { PromptCarouselRows } from "../PromptCarousel/types/types.js";
+import "../PromptCarousel/index.js";
+import { WidgetWrapperVariant } from "../WidgetWrapper/types/types.js";
+import "../WidgetWrapper/index.js";
+import { WidgetWrapperWithTitle } from "../WidgetWrapperWithTitle/WidgetWrapperWithTitle.js";
+import { ImageGalleryLayout } from "../ImageGallery/types/types.js";
+import { SocialProofComponents } from "./components/index.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/SocialProof/SocialProof.tsx
+const SocialProof = ({ baseProps, widgetContentProps, widgetStyleProps, widgetEventProps }) => {
+	const { id, testId, className, style } = baseProps ?? {};
+	const { theme = Theme.GLOBAL_CUSTOM, variant = WidgetWrapperVariant.CARD_WITH_BORDER, hexCardColor, promptCarouselRows = PromptCarouselRows.TWO_ON_MOBILE_ONE_ON_DESKTOP, hideImage, imageGalleryLayout, hideTextField, primaryButtonVariant = PromptButtonVariant.DARK, secondaryButtonVariant = PromptButtonVariant.LIGHT, hideLogo, dynamicLayout } = widgetStyleProps ?? {};
+	const { numberOfCustomersText, customerQueryText, primaryButtonText, secondaryButtonTitleText, secondaryButtonTexts, textFieldPlaceholderText, images, logoSrc, titleLabel } = widgetContentProps ?? {};
+	const { handlePrimaryButtonClick, handleSecondaryButtonClick, handleTextFieldClick } = widgetEventProps ?? {};
+	const finalTheme = resolveTheme(theme);
+	const { isMobile } = useCheckIsMobile("sm");
+	const hasDynamicLayout = dynamicLayout !== void 0;
+	const headline = /* @__PURE__ */ jsx(SocialProofComponents.Headline, {
+		theme: finalTheme,
+		socialProofCounter: numberOfCustomersText,
+		socialProofHeadline: customerQueryText,
+		primaryPromptButtonText: primaryButtonText,
+		primaryPromptButtonVariant: primaryButtonVariant,
+		handleButtonClick: handlePrimaryButtonClick
+	});
+	const subheadline = /* @__PURE__ */ jsx(SocialProofComponents.Subheadline, {
+		theme: finalTheme,
+		secondaryPromptButtonTexts: secondaryButtonTexts,
+		secondaryPromptCarouselRows: promptCarouselRows,
+		secondaryPromptButtonType: secondaryButtonVariant,
+		subheadlineText: secondaryButtonTitleText,
+		handleButtonClick: handleSecondaryButtonClick
+	});
+	const textfield = /* @__PURE__ */ jsx(SocialProofComponents.Textfield, {
+		theme: finalTheme,
+		placeholder: textFieldPlaceholderText,
+		handleTextFieldClick
+	});
+	const hideImageGallery = hideImage || !images || images.length === 0;
+	if (!isMobile && imageGalleryLayout === ImageGalleryLayout.FOUR_GRID && !hasDynamicLayout) return /* @__PURE__ */ jsx(WidgetWrapperWithTitle, {
+		id,
+		testId,
+		variant,
+		className,
+		style,
+		titleLabel,
+		logoSrc,
+		hexCardColor,
+		hideLogo,
+		children: /* @__PURE__ */ jsx(SocialProofComponents.LayoutFourGrid, {
+			hideImage: hideImageGallery,
+			images,
+			headline,
+			subheadline,
+			textfield: !hideTextField && textfield
+		})
+	});
+	if ((imageGalleryLayout === ImageGalleryLayout.FOUR_HORIZONTAL || isMobile && imageGalleryLayout === ImageGalleryLayout.FOUR_GRID) && !hasDynamicLayout) return /* @__PURE__ */ jsx(WidgetWrapperWithTitle, {
+		id,
+		testId,
+		variant,
+		className,
+		style,
+		titleLabel,
+		logoSrc,
+		hexCardColor,
+		hideLogo,
+		children: /* @__PURE__ */ jsx(SocialProofComponents.LayoutFourHorizontal, {
+			hideImage: hideImageGallery,
+			images,
+			headline,
+			subheadline,
+			textfield: !hideTextField && textfield
+		})
+	});
+	return /* @__PURE__ */ jsx(WidgetWrapperWithTitle, {
+		id,
+		testId,
+		variant,
+		className,
+		style,
+		titleLabel,
+		logoSrc,
+		hexCardColor,
+		hideLogo,
+		children: /* @__PURE__ */ jsx(SocialProofComponents.LayoutSingle, {
+			hideImage: hideImageGallery,
+			dynamicLayout,
+			images,
+			headline,
+			subheadline,
+			textfield: !hideTextField && textfield
+		})
+	});
+};
+
+//#endregion
+export { SocialProof };

package/dist/SocialProof/components/Headline.cjs

@@ -0,0 +1,53 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_theme = require('../../components-v3/tokens/theme/theme.cjs');
+const require_Stack = require('../../Stack/Stack.cjs');
+require('../../Stack/index.cjs');
+const require_Container = require('../../Container/Container.cjs');
+require('../../Container/index.cjs');
+const require_index = require('../../Typography/types/index.cjs');
+const require_Typography = require('../../Typography/Typography.cjs');
+require('../../Typography/index.cjs');
+const require_resolveTheme = require('../../utils/resolveTheme.cjs');
+const require_PromptButton_types_index = require('../../PromptButton/types/index.cjs');
+const require_PromptButton = require('../../PromptButton/PromptButton.cjs');
+require('../../PromptButton/index.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+
+//#region src/components/SocialProof/components/Headline.tsx
+const Headline = (0, react.forwardRef)(({ theme = require_theme.Theme.GLOBAL_CUSTOM, className, isLoading, socialProofCounter, socialProofHeadline, primaryPromptButtonText, primaryPromptButtonVariant = require_PromptButton_types_index.PromptButtonVariant.DARK, handleButtonClick }, ref) => {
+	const finalTheme = require_resolveTheme.resolveTheme(theme);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Stack.Stack, {
+		ref,
+		gap: "4",
+		className: (0, classnames.default)("envive-tw-h-fit", className),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Stack.Stack, {
+			gap: "2",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Container.Container, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+					variant: require_index.TypographyVariant.B1_MD,
+					color: require_index.TypographyColor.TEXT_ACCENT,
+					children: socialProofCounter
+				}),
+				"\xA0",
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+					variant: require_index.TypographyVariant.B1_MD,
+					color: require_index.TypographyColor.TEXT_PRIMARY,
+					children: socialProofHeadline
+				})
+			] })
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Container.Container, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PromptButton.PromptButton, {
+			theme: finalTheme,
+			isLoading,
+			label: primaryPromptButtonText,
+			variant: primaryPromptButtonVariant,
+			onClick: () => handleButtonClick(primaryPromptButtonText)
+		}) })]
+	});
+});
+Headline.displayName = "Headline";
+
+//#endregion
+exports.Headline = Headline;

package/dist/SocialProof/components/Headline.js

@@ -0,0 +1,51 @@
+import { Theme } from "../../components-v3/tokens/theme/theme.js";
+import { Stack } from "../../Stack/Stack.js";
+import "../../Stack/index.js";
+import { Container } from "../../Container/Container.js";
+import "../../Container/index.js";
+import { TypographyColor, TypographyVariant } from "../../Typography/types/index.js";
+import { Typography } from "../../Typography/Typography.js";
+import "../../Typography/index.js";
+import { resolveTheme } from "../../utils/resolveTheme.js";
+import { PromptButtonVariant } from "../../PromptButton/types/index.js";
+import { PromptButton } from "../../PromptButton/PromptButton.js";
+import "../../PromptButton/index.js";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import classNames from "classnames";
+
+//#region src/components/SocialProof/components/Headline.tsx
+const Headline = forwardRef(({ theme = Theme.GLOBAL_CUSTOM, className, isLoading, socialProofCounter, socialProofHeadline, primaryPromptButtonText, primaryPromptButtonVariant = PromptButtonVariant.DARK, handleButtonClick }, ref) => {
+	const finalTheme = resolveTheme(theme);
+	return /* @__PURE__ */ jsxs(Stack, {
+		ref,
+		gap: "4",
+		className: classNames("envive-tw-h-fit", className),
+		children: [/* @__PURE__ */ jsx(Stack, {
+			gap: "2",
+			children: /* @__PURE__ */ jsxs(Container, { children: [
+				/* @__PURE__ */ jsx(Typography, {
+					variant: TypographyVariant.B1_MD,
+					color: TypographyColor.TEXT_ACCENT,
+					children: socialProofCounter
+				}),
+				"\xA0",
+				/* @__PURE__ */ jsx(Typography, {
+					variant: TypographyVariant.B1_MD,
+					color: TypographyColor.TEXT_PRIMARY,
+					children: socialProofHeadline
+				})
+			] })
+		}), /* @__PURE__ */ jsx(Container, { children: /* @__PURE__ */ jsx(PromptButton, {
+			theme: finalTheme,
+			isLoading,
+			label: primaryPromptButtonText,
+			variant: primaryPromptButtonVariant,
+			onClick: () => handleButtonClick(primaryPromptButtonText)
+		}) })]
+	});
+});
+Headline.displayName = "Headline";
+
+//#endregion
+export { Headline };

package/dist/SocialProof/components/ImageGallery.cjs

@@ -0,0 +1,24 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_Container = require('../../Container/Container.cjs');
+require('../../Container/index.cjs');
+const require_ImageGallery = require('../../ImageGallery/ImageGallery.cjs');
+require('../../ImageGallery/index.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/SocialProof/components/ImageGallery.tsx
+const ImageGallery$1 = ({ isLoading, images, layout, className, style, styleImageGallery, fluid }) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Container.Container, {
+		fluid,
+		className,
+		style,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ImageGallery.ImageGallery, {
+			style: styleImageGallery,
+			imageIsLoading: isLoading,
+			images,
+			layout
+		})
+	});
+};
+
+//#endregion
+exports.ImageGallery = ImageGallery$1;

package/dist/SocialProof/components/ImageGallery.js

@@ -0,0 +1,23 @@
+import { Container } from "../../Container/Container.js";
+import "../../Container/index.js";
+import { ImageGallery } from "../../ImageGallery/ImageGallery.js";
+import "../../ImageGallery/index.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/SocialProof/components/ImageGallery.tsx
+const ImageGallery$1 = ({ isLoading, images, layout, className, style, styleImageGallery, fluid }) => {
+	return /* @__PURE__ */ jsx(Container, {
+		fluid,
+		className,
+		style,
+		children: /* @__PURE__ */ jsx(ImageGallery, {
+			style: styleImageGallery,
+			imageIsLoading: isLoading,
+			images,
+			layout
+		})
+	});
+};
+
+//#endregion
+export { ImageGallery$1 as ImageGallery };