@envive-ai/react-toolkit-v3 0.3.7 → 0.3.9

package/dist/ImageGallery/components/Layout.cjs

@@ -1,7 +1,7 @@
 const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
-const require_theme = require('../../tokens/theme/theme.cjs');
-const require_useResponsiveValue = require('../../utils/useResponsiveValue.cjs');
+const require_theme = require('../../packages/components-v3/tokens/theme/theme.cjs');
 const require_Container = require('../../Container/Container.cjs');
+const require_useResponsiveValue = require('../../utils/useResponsiveValue.cjs');
 const require_useCheckIsMobile = require('../../utils/useCheckIsMobile.cjs');
 const require_types = require('../types/types.cjs');
 const require_useGetContainerProperties = require('../hooks/useGetContainerProperties.cjs');

package/dist/ImageGallery/components/Layout.js

@@ -1,6 +1,6 @@
-import { Theme } from "../../tokens/theme/theme.js";
-import { useResponsiveValue } from "../../utils/useResponsiveValue.js";
+import { Theme } from "../../packages/components-v3/tokens/theme/theme.js";
 import { Container } from "../../Container/Container.js";
+import { useResponsiveValue } from "../../utils/useResponsiveValue.js";
 import { useCheckIsMobile } from "../../utils/useCheckIsMobile.js";
 import { ImageGalleryLayout } from "../types/types.js";
 import { useGetContainerProperties } from "../hooks/useGetContainerProperties.js";

package/dist/ImageGallery/components/NormalLayout.cjs

@@ -1,7 +1,7 @@
 const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
 let react = require("react");
 react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
 
 //#region src/components/ImageGallery/components/NormalLayout.tsx
 const NormalLayout = ({ displayImages }) => {

package/dist/ImageGallery/components/NormalLayout.js

@@ -1,5 +1,5 @@
-import React from "react";
 import { jsx } from "react/jsx-runtime";
+import React from "react";
 
 //#region src/components/ImageGallery/components/NormalLayout.tsx
 const NormalLayout = ({ displayImages }) => {

package/dist/ImageGallery/types/types.d.ts

@@ -1,4 +1,4 @@
-import { Theme } from "../../tokens/theme/theme.js";
+import { Theme } from "../../packages/components-v3/tokens/theme/theme.js";
 import { ImageAspectRatio, ImageObjectFit } from "../../Image/types/index.js";
 import { ResponsiveValue } from "../../utils/useResponsiveValue.js";
 

package/dist/ImageGallery/utils/functions.cjs

@@ -1,5 +1,5 @@
 const require_utils = require('../../DesignTokens/components/utils.cjs');
-const require_theme = require('../../tokens/theme/theme.cjs');
+const require_theme = require('../../packages/components-v3/tokens/theme/theme.cjs');
 const require_types = require('../types/types.cjs');
 
 //#region src/components/ImageGallery/utils/functions.ts

package/dist/ImageGallery/utils/functions.js

@@ -1,5 +1,5 @@
 import { getComputedCSSVariable } from "../../DesignTokens/components/utils.js";
-import { Theme, ThemeCSSVar } from "../../tokens/theme/theme.js";
+import { Theme, ThemeCSSVar } from "../../packages/components-v3/tokens/theme/theme.js";
 import { ImageGalleryLayout } from "../types/types.js";
 
 //#region src/components/ImageGallery/utils/functions.ts

package/dist/MarkdownProcessor/MarkdownProcessor.cjs

@@ -1,8 +1,8 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
 const require_index = require('./components/index.cjs');
 const require_functions = require('./utils/functions.cjs');
-let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
 let react_markdown = require("react-markdown");
 react_markdown = require_rolldown_runtime.__toESM(react_markdown);
 let remark_gfm = require("remark-gfm");

package/dist/MarkdownProcessor/MarkdownProcessor.d.ts

@@ -1,5 +1,5 @@
 import { MarkdownProcessorProps } from "./types/types.js";
-import * as react_jsx_runtime19 from "react/jsx-runtime";
+import * as react_jsx_runtime17 from "react/jsx-runtime";
 
 //#region src/components/MarkdownProcessor/MarkdownProcessor.d.ts
 declare const MarkdownProcessor: ({
@@ -9,6 +9,6 @@ declare const MarkdownProcessor: ({
   textVariant,
   subTextVariant,
   subTextColor
-}: MarkdownProcessorProps) => react_jsx_runtime19.JSX.Element;
+}: MarkdownProcessorProps) => react_jsx_runtime17.JSX.Element;
 //#endregion
 export { MarkdownProcessor };

package/dist/MarkdownProcessor/MarkdownProcessor.js

@@ -1,7 +1,7 @@
 import { MarkdownProcessorComponents } from "./components/index.js";
 import { createMarkdownParagraphComponent, createMarkdownSubscriptComponent } from "./utils/functions.js";
-import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
 import ReactMarkdown from "react-markdown";
 import remarkGfm from "remark-gfm";
 import rehypeRaw from "rehype-raw";

package/dist/MarkdownProcessor/components/MarkdownLink.cjs

@@ -1,11 +1,14 @@
 const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_index = require('../../Typography/types/index.cjs');
+require('../../Typography/index.cjs');
 const require_LinkButton = require('../../Message/components/LinkButton.cjs');
 let react_jsx_runtime = require("react/jsx-runtime");
 
 //#region src/components/MarkdownProcessor/components/MarkdownLink.tsx
 const MarkdownLink = ({ href, children }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_LinkButton.LinkButton, {
 	url: href,
-	text: children?.toString()
+	text: children?.toString(),
+	typographyColor: require_index.TypographyColor.TEXT_SECONDARY
 });
 
 //#endregion

package/dist/MarkdownProcessor/components/MarkdownLink.js

@@ -1,10 +1,13 @@
+import { TypographyColor } from "../../Typography/types/index.js";
+import "../../Typography/index.js";
 import { LinkButton } from "../../Message/components/LinkButton.js";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/MarkdownProcessor/components/MarkdownLink.tsx
 const MarkdownLink = ({ href, children }) => /* @__PURE__ */ jsx(LinkButton, {
 	url: href,
-	text: children?.toString()
+	text: children?.toString(),
+	typographyColor: TypographyColor.TEXT_SECONDARY
 });
 
 //#endregion

package/dist/Message/components/AgentContent.cjs

@@ -1,15 +1,19 @@
 const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
-const require_MarkdownProcessor = require('../../MarkdownProcessor/MarkdownProcessor.cjs');
 const require_LoadingSkeleton = require('./LoadingSkeleton.cjs');
 let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
 
 //#region src/components/Message/components/AgentContent.tsx
+const MarkdownProcessor = (0, react.lazy)(async () => ({ default: (await Promise.resolve().then(() => require("../../MarkdownProcessor/MarkdownProcessor.cjs"))).MarkdownProcessor }));
 /**
 * Component that renders the message content for the agent.
 */
 const AgentContent = ({ content, isLoading = false }) => {
 	if (isLoading) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_LoadingSkeleton.LoadingSkeleton, {});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MarkdownProcessor.MarkdownProcessor, { content });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Suspense, {
+		fallback: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_LoadingSkeleton.LoadingSkeleton, {}),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(MarkdownProcessor, { content })
+	});
 };
 
 //#endregion

package/dist/Message/components/AgentContent.js

@@ -1,14 +1,18 @@
-import { MarkdownProcessor } from "../../MarkdownProcessor/MarkdownProcessor.js";
 import { LoadingSkeleton } from "./LoadingSkeleton.js";
 import { jsx } from "react/jsx-runtime";
+import { Suspense, lazy } from "react";
 
 //#region src/components/Message/components/AgentContent.tsx
+const MarkdownProcessor = lazy(async () => ({ default: (await import("../../MarkdownProcessor/MarkdownProcessor.js")).MarkdownProcessor }));
 /**
 * Component that renders the message content for the agent.
 */
 const AgentContent = ({ content, isLoading = false }) => {
 	if (isLoading) return /* @__PURE__ */ jsx(LoadingSkeleton, {});
-	return /* @__PURE__ */ jsx(MarkdownProcessor, { content });
+	return /* @__PURE__ */ jsx(Suspense, {
+		fallback: /* @__PURE__ */ jsx(LoadingSkeleton, {}),
+		children: /* @__PURE__ */ jsx(MarkdownProcessor, { content })
+	});
 };
 
 //#endregion

package/dist/Message/components/LinkButton.cjs

@@ -1,8 +1,8 @@
 const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_CustomIcon = require('../../utils/CustomIcon.cjs');
 const require_index = require('../../Typography/types/index.cjs');
 const require_Typography = require('../../Typography/Typography.cjs');
 require('../../Typography/index.cjs');
-const require_CustomIcon = require('../../utils/CustomIcon.cjs');
 const require_useGetLinkButtonProperties = require('../hooks/useGetLinkButtonProperties.cjs');
 const require_useGetLinkButtonIconProperties = require('../hooks/useGetLinkButtonIconProperties.cjs');
 const require_openUrlInNewTab = require('../utils/openUrlInNewTab.cjs');
@@ -15,7 +15,7 @@ __envive_ai_react_icons_VectorUpRight = require_rolldown_runtime.__toESM(__enviv
 * Component that renders an external link with an icon.
 * Uses an inline span with button role for better accessibility and inline text flow.
 */
-const LinkButton = ({ url, text }) => {
+const LinkButton = ({ url, text, typographyColor }) => {
 	const { containerClasses } = require_useGetLinkButtonProperties.useGetLinkButtonProperties();
 	const { iconContainerClasses } = require_useGetLinkButtonIconProperties.useGetLinkButtonIconProperties();
 	const handleClick = () => {
@@ -32,7 +32,7 @@ const LinkButton = ({ url, text }) => {
 		},
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Typography.Typography, {
 			variant: require_index.TypographyVariant.B3_MD,
-			color: require_index.TypographyColor.TEXT_PRIMARY,
+			color: typographyColor ?? require_index.TypographyColor.TEXT_PRIMARY,
 			className: "envive-tw-inline",
 			children: [
 				text,

package/dist/Message/components/LinkButton.d.cts

@@ -1,7 +1,10 @@
+import { TypographyColor } from "../../Typography/types/index.cjs";
+
 //#region src/components/Message/components/LinkButton.d.ts
 type LinkButtonProps = {
   url: string;
   text: string;
+  typographyColor?: TypographyColor;
 };
 /**
  * Component that renders an external link with an icon.
@@ -9,7 +12,8 @@ type LinkButtonProps = {
  */
 declare const LinkButton: ({
   url,
-  text
+  text,
+  typographyColor
 }: LinkButtonProps) => React.ReactNode;
 //#endregion
 export { LinkButton };

package/dist/Message/components/LinkButton.d.ts

@@ -1,7 +1,10 @@
+import { TypographyColor } from "../../Typography/types/index.js";
+
 //#region src/components/Message/components/LinkButton.d.ts
 type LinkButtonProps = {
   url: string;
   text: string;
+  typographyColor?: TypographyColor;
 };
 /**
  * Component that renders an external link with an icon.
@@ -9,7 +12,8 @@ type LinkButtonProps = {
  */
 declare const LinkButton: ({
   url,
-  text
+  text,
+  typographyColor
 }: LinkButtonProps) => React.ReactNode;
 //#endregion
 export { LinkButton };

package/dist/Message/components/LinkButton.js

@@ -1,7 +1,7 @@
+import { CustomIcon } from "../../utils/CustomIcon.js";
 import { TypographyColor, TypographyVariant } from "../../Typography/types/index.js";
 import { Typography } from "../../Typography/Typography.js";
 import "../../Typography/index.js";
-import { CustomIcon } from "../../utils/CustomIcon.js";
 import { useGetLinkButtonProperties } from "../hooks/useGetLinkButtonProperties.js";
 import { useGetLinkButtonIconProperties } from "../hooks/useGetLinkButtonIconProperties.js";
 import { openUrlInNewTab } from "../utils/openUrlInNewTab.js";
@@ -13,7 +13,7 @@ import VectorUpRight from "@envive-ai/react-icons/VectorUpRight";
 * Component that renders an external link with an icon.
 * Uses an inline span with button role for better accessibility and inline text flow.
 */
-const LinkButton = ({ url, text }) => {
+const LinkButton = ({ url, text, typographyColor }) => {
 	const { containerClasses } = useGetLinkButtonProperties();
 	const { iconContainerClasses } = useGetLinkButtonIconProperties();
 	const handleClick = () => {
@@ -30,7 +30,7 @@ const LinkButton = ({ url, text }) => {
 		},
 		children: /* @__PURE__ */ jsxs(Typography, {
 			variant: TypographyVariant.B3_MD,
-			color: TypographyColor.TEXT_PRIMARY,
+			color: typographyColor ?? TypographyColor.TEXT_PRIMARY,
 			className: "envive-tw-inline",
 			children: [
 				text,

package/dist/Message/hooks/useGetLinkButtonProperties.cjs

@@ -7,7 +7,7 @@ let react = require("react");
 */
 const useGetLinkButtonProperties = () => {
 	return { containerClasses: (0, react.useMemo)(() => {
-		return `envive-tw-inline envive-tw-align-middle envive-tw-cursor-pointer hover:envive-tw-underline envive-tw-group envive-tw-transition-all envive-tw-duration-200`;
+		return `envive-tw-inline envive-tw-align-top envive-tw-cursor-pointer hover:envive-tw-underline envive-tw-group envive-tw-transition-all envive-tw-duration-200`;
 	}, []) };
 };
 

package/dist/Message/hooks/useGetLinkButtonProperties.js

@@ -6,7 +6,7 @@ import { useMemo } from "react";
 */
 const useGetLinkButtonProperties = () => {
 	return { containerClasses: useMemo(() => {
-		return `envive-tw-inline envive-tw-align-middle envive-tw-cursor-pointer hover:envive-tw-underline envive-tw-group envive-tw-transition-all envive-tw-duration-200`;
+		return `envive-tw-inline envive-tw-align-top envive-tw-cursor-pointer hover:envive-tw-underline envive-tw-group envive-tw-transition-all envive-tw-duration-200`;
 	}, []) };
 };
 

package/dist/OrderLookupCard/OrderLookupCard.cjs

@@ -1,8 +1,8 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
-const require_theme = require('../tokens/theme/theme.cjs');
+const require_theme = require('../packages/components-v3/tokens/theme/theme.cjs');
+const require_resolveTheme = require('../utils/resolveTheme.cjs');
 const require_Stack = require('../Stack/Stack.cjs');
 require('../Stack/index.cjs');
-const require_resolveTheme = require('../utils/resolveTheme.cjs');
 const require_useGetImageBorderRadiusProperties = require('./hooks/useGetImageBorderRadiusProperties.cjs');
 const require_index = require('./components/index.cjs');
 const require_useGetContainerProperties = require('./hooks/useGetContainerProperties.cjs');

package/dist/OrderLookupCard/OrderLookupCard.js

@@ -1,7 +1,7 @@
-import { Theme } from "../tokens/theme/theme.js";
+import { Theme } from "../packages/components-v3/tokens/theme/theme.js";
+import { resolveTheme } from "../utils/resolveTheme.js";
 import { Stack } from "../Stack/Stack.js";
 import "../Stack/index.js";
-import { resolveTheme } from "../utils/resolveTheme.js";
 import { useGetImageBorderRadiusProperties } from "./hooks/useGetImageBorderRadiusProperties.js";
 import { OrderLookupCardComponents } from "./components/index.js";
 import { useGetContainerProperties } from "./hooks/useGetContainerProperties.js";

package/dist/OrderLookupCard/hooks/useGetContainerProperties.cjs

@@ -1,4 +1,4 @@
-const require_theme = require('../../tokens/theme/theme.cjs');
+const require_theme = require('../../packages/components-v3/tokens/theme/theme.cjs');
 
 //#region src/components/OrderLookupCard/hooks/useGetContainerProperties.ts
 /**

package/dist/OrderLookupCard/hooks/useGetContainerProperties.js

@@ -1,4 +1,4 @@
-import { Theme } from "../../tokens/theme/theme.js";
+import { Theme } from "../../packages/components-v3/tokens/theme/theme.js";
 
 //#region src/components/OrderLookupCard/hooks/useGetContainerProperties.ts
 /**

package/dist/OrderLookupCard/hooks/useGetImageBorderRadiusProperties.cjs

@@ -1,4 +1,4 @@
-const require_theme = require('../../tokens/theme/theme.cjs');
+const require_theme = require('../../packages/components-v3/tokens/theme/theme.cjs');
 
 //#region src/components/OrderLookupCard/hooks/useGetImageBorderRadiusProperties.ts
 /**

package/dist/OrderLookupCard/hooks/useGetImageBorderRadiusProperties.js

@@ -1,4 +1,4 @@
-import { Theme } from "../../tokens/theme/theme.js";
+import { Theme } from "../../packages/components-v3/tokens/theme/theme.js";
 
 //#region src/components/OrderLookupCard/hooks/useGetImageBorderRadiusProperties.ts
 /**

package/dist/OrderLookupCard/hooks/useGetStatusLabelProperties.cjs

@@ -1,4 +1,4 @@
-const require_theme = require('../../tokens/theme/theme.cjs');
+const require_theme = require('../../packages/components-v3/tokens/theme/theme.cjs');
 
 //#region src/components/OrderLookupCard/hooks/useGetStatusLabelProperties.ts
 /**

package/dist/OrderLookupCard/hooks/useGetStatusLabelProperties.js

@@ -1,4 +1,4 @@
-import { Theme } from "../../tokens/theme/theme.js";
+import { Theme } from "../../packages/components-v3/tokens/theme/theme.js";
 
 //#region src/components/OrderLookupCard/hooks/useGetStatusLabelProperties.ts
 /**

package/dist/OrderLookupCard/hooks/useGetTrackOrderLinkProperties.cjs

@@ -1,4 +1,4 @@
-const require_theme = require('../../tokens/theme/theme.cjs');
+const require_theme = require('../../packages/components-v3/tokens/theme/theme.cjs');
 
 //#region src/components/OrderLookupCard/hooks/useGetTrackOrderLinkProperties.ts
 /**

package/dist/OrderLookupCard/hooks/useGetTrackOrderLinkProperties.js

@@ -1,4 +1,4 @@
-import { Theme } from "../../tokens/theme/theme.js";
+import { Theme } from "../../packages/components-v3/tokens/theme/theme.js";
 
 //#region src/components/OrderLookupCard/hooks/useGetTrackOrderLinkProperties.ts
 /**

package/dist/OrderLookupCard/types/index.d.ts

@@ -1,4 +1,4 @@
-import { Theme } from "../../tokens/theme/theme.js";
+import { Theme } from "../../packages/components-v3/tokens/theme/theme.js";
 
 //#region src/components/OrderLookupCard/types/index.d.ts
 

package/dist/ProductCard/ProductCard.cjs

@@ -0,0 +1,47 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_theme = require('../packages/components-v3/tokens/theme/theme.cjs');
+require('../Tokens/index.cjs');
+const require_resolveTheme = require('../utils/resolveTheme.cjs');
+const require_index = require('../Typography/types/index.cjs');
+const require_WidgetTextField = require('../WidgetTextField/WidgetTextField.cjs');
+require('../WidgetTextField/index.cjs');
+const require_index$1 = require('./components/index.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+
+//#region src/components/ProductCard/ProductCard.tsx
+const ProductCard = ({ theme = require_theme.Theme.GLOBAL_CUSTOM, imageSrc, headline, italicizeHeadline, animatedText, prompts, promptButtonType, carouselId, fallbackColor, placeholder, textTypingDuration, textTransition, loop, onSelect, onInputClick }) => {
+	const resolvedTheme = require_resolveTheme.resolveTheme(theme);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_index$1.ProductCardWidgetComponents.Poster, {
+		imageSrc,
+		fallbackColor,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index$1.ProductCardWidgetComponents.Header, {
+				headline,
+				italicizeHeadline,
+				animatedText,
+				textTypingDuration,
+				textTransition,
+				loop
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_index$1.ProductCardWidgetComponents.Carousel, {
+				theme: resolvedTheme,
+				carouselId,
+				prompts,
+				promptButtonType,
+				onSelect
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_WidgetTextField.WidgetTextField, {
+				theme: resolvedTheme,
+				placeholder,
+				onClick: onInputClick,
+				textColor: resolvedTheme === require_theme.Theme.MINIMAL ? require_index.TypographyColor.TEXT_LIGHT : require_index.TypographyColor.TEXT_SECONDARY,
+				className: (0, classnames.default)(resolvedTheme === require_theme.Theme.MINIMAL ? "envive-tw-bg-transparent" : "envive-tw-bg-background-light")
+			})
+		]
+	});
+};
+
+//#endregion
+exports.ProductCard = ProductCard;

package/dist/ProductCard/ProductCard.d.cts

@@ -0,0 +1,23 @@
+import { ProductCardProps } from "./types/index.cjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/ProductCard/ProductCard.d.ts
+declare const ProductCard: ({
+  theme,
+  imageSrc,
+  headline,
+  italicizeHeadline,
+  animatedText,
+  prompts,
+  promptButtonType,
+  carouselId,
+  fallbackColor,
+  placeholder,
+  textTypingDuration,
+  textTransition,
+  loop,
+  onSelect,
+  onInputClick
+}: ProductCardProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+export { ProductCard };

package/dist/ProductCard/ProductCard.d.ts

@@ -0,0 +1,23 @@
+import { ProductCardProps } from "./types/index.js";
+import * as react_jsx_runtime10 from "react/jsx-runtime";
+
+//#region src/components/ProductCard/ProductCard.d.ts
+declare const ProductCard: ({
+  theme,
+  imageSrc,
+  headline,
+  italicizeHeadline,
+  animatedText,
+  prompts,
+  promptButtonType,
+  carouselId,
+  fallbackColor,
+  placeholder,
+  textTypingDuration,
+  textTransition,
+  loop,
+  onSelect,
+  onInputClick
+}: ProductCardProps) => react_jsx_runtime10.JSX.Element;
+//#endregion
+export { ProductCard };

package/dist/ProductCard/ProductCard.js

@@ -0,0 +1,45 @@
+import { Theme } from "../packages/components-v3/tokens/theme/theme.js";
+import "../Tokens/index.js";
+import { resolveTheme } from "../utils/resolveTheme.js";
+import { TypographyColor } from "../Typography/types/index.js";
+import { WidgetTextField } from "../WidgetTextField/WidgetTextField.js";
+import "../WidgetTextField/index.js";
+import { ProductCardWidgetComponents } from "./components/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import classNames from "classnames";
+
+//#region src/components/ProductCard/ProductCard.tsx
+const ProductCard = ({ theme = Theme.GLOBAL_CUSTOM, imageSrc, headline, italicizeHeadline, animatedText, prompts, promptButtonType, carouselId, fallbackColor, placeholder, textTypingDuration, textTransition, loop, onSelect, onInputClick }) => {
+	const resolvedTheme = resolveTheme(theme);
+	return /* @__PURE__ */ jsxs(ProductCardWidgetComponents.Poster, {
+		imageSrc,
+		fallbackColor,
+		children: [
+			/* @__PURE__ */ jsx(ProductCardWidgetComponents.Header, {
+				headline,
+				italicizeHeadline,
+				animatedText,
+				textTypingDuration,
+				textTransition,
+				loop
+			}),
+			/* @__PURE__ */ jsx(ProductCardWidgetComponents.Carousel, {
+				theme: resolvedTheme,
+				carouselId,
+				prompts,
+				promptButtonType,
+				onSelect
+			}),
+			/* @__PURE__ */ jsx(WidgetTextField, {
+				theme: resolvedTheme,
+				placeholder,
+				onClick: onInputClick,
+				textColor: resolvedTheme === Theme.MINIMAL ? TypographyColor.TEXT_LIGHT : TypographyColor.TEXT_SECONDARY,
+				className: classNames(resolvedTheme === Theme.MINIMAL ? "envive-tw-bg-transparent" : "envive-tw-bg-background-light")
+			})
+		]
+	});
+};
+
+//#endregion
+export { ProductCard };

package/dist/ProductCard/components/Carousel.cjs

@@ -0,0 +1,25 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_resolveTheme = require('../../utils/resolveTheme.cjs');
+const require_PromptCarousel_types_types = require('../../PromptCarousel/types/types.cjs');
+const require_PromptCarousel = require('../../PromptCarousel/PromptCarousel.cjs');
+require('../../PromptCarousel/index.cjs');
+const require_useGetCarouselProperties = require('../hooks/useGetCarouselProperties.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/ProductCard/components/Carousel.tsx
+const Carousel = ({ theme, carouselId, prompts, promptButtonType, onSelect }) => {
+	const resolvedTheme = require_resolveTheme.resolveTheme(theme);
+	const { carouselClasses } = require_useGetCarouselProperties.useGetCarouselProperties();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PromptCarousel.PromptCarousel, {
+		className: carouselClasses,
+		handleButtonClick: onSelect,
+		id: carouselId,
+		promptCarouselRows: require_PromptCarousel_types_types.PromptCarouselRows.ALWAYS_TWO,
+		theme: resolvedTheme,
+		promptButtonType,
+		promptButtonTexts: prompts
+	});
+};
+
+//#endregion
+exports.Carousel = Carousel;

package/dist/ProductCard/components/Carousel.js

@@ -0,0 +1,24 @@
+import { resolveTheme } from "../../utils/resolveTheme.js";
+import { PromptCarouselRows } from "../../PromptCarousel/types/types.js";
+import { PromptCarousel } from "../../PromptCarousel/PromptCarousel.js";
+import "../../PromptCarousel/index.js";
+import { useGetCarouselProperties } from "../hooks/useGetCarouselProperties.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/ProductCard/components/Carousel.tsx
+const Carousel = ({ theme, carouselId, prompts, promptButtonType, onSelect }) => {
+	const resolvedTheme = resolveTheme(theme);
+	const { carouselClasses } = useGetCarouselProperties();
+	return /* @__PURE__ */ jsx(PromptCarousel, {
+		className: carouselClasses,
+		handleButtonClick: onSelect,
+		id: carouselId,
+		promptCarouselRows: PromptCarouselRows.ALWAYS_TWO,
+		theme: resolvedTheme,
+		promptButtonType,
+		promptButtonTexts: prompts
+	});
+};
+
+//#endregion
+export { Carousel };

package/dist/ProductCard/components/Header.cjs

@@ -0,0 +1,42 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_AnimatedText = require('../../AnimatedText/AnimatedText.cjs');
+require('../../AnimatedText/index.cjs');
+const require_Stack = require('../../Stack/Stack.cjs');
+require('../../Stack/index.cjs');
+const require_index = require('../../Typography/types/index.cjs');
+const require_Typography = require('../../Typography/Typography.cjs');
+require('../../Typography/index.cjs');
+const require_useGetHeaderProperties = require('../hooks/useGetHeaderProperties.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
+
+//#region src/components/ProductCard/components/Header.tsx
+const Header = ({ headline, italicizeHeadline, animatedText, textTypingDuration, textTransition, loop }) => {
+	const { stackClasses, headlineClasses } = require_useGetHeaderProperties.useGetHeaderProperties(italicizeHeadline);
+	const animatedTextWrapper = (0, react.useCallback)((text) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+		variant: require_index.TypographyVariant.B3_MD,
+		color: require_index.TypographyColor.TEXT_LIGHT,
+		numberOfLines: 2,
+		children: text
+	}), []);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Stack.Stack, {
+		gap: 1,
+		className: stackClasses,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+			variant: require_index.TypographyVariant.H1_MD,
+			color: require_index.TypographyColor.TEXT_LIGHT,
+			className: headlineClasses,
+			numberOfLines: 2,
+			children: headline
+		}), animatedText.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AnimatedText.AnimatedText, {
+			sequence: animatedText,
+			getNodeWrapper: animatedTextWrapper,
+			typingDuration: textTypingDuration,
+			transition: textTransition,
+			loop
+		})]
+	});
+};
+
+//#endregion
+exports.Header = Header;