@envive-ai/react-toolkit-v3 0.3.5

package/dist/TitledPromptCarousel/TitledPromptCarousel.d.ts

@@ -0,0 +1,20 @@
+import { TitledPromptCarouselProps } from "./types/index.js";
+import * as react_jsx_runtime20 from "react/jsx-runtime";
+
+//#region src/components/TitledPromptCarousel/TitledPromptCarousel.d.ts
+declare const TitledPromptCarousel: ({
+  id,
+  titleLabel,
+  titleAriaLabel,
+  theme,
+  isLoading,
+  boldFirstButton,
+  promptButtonType,
+  promptCarouselRows,
+  animationSpeed,
+  handleButtonClick,
+  promptButtonTexts,
+  promptCarouselAriaLabel
+}: TitledPromptCarouselProps) => react_jsx_runtime20.JSX.Element;
+//#endregion
+export { TitledPromptCarousel };

package/dist/TitledPromptCarousel/TitledPromptCarousel.js

@@ -0,0 +1,46 @@
+import { Theme } from "../components-v3/tokens/theme/theme.js";
+import { Stack } from "../Stack/Stack.js";
+import "../Stack/index.js";
+import { TypographyVariant } from "../Typography/types/index.js";
+import { Typography } from "../Typography/Typography.js";
+import "../Typography/index.js";
+import "../Tokens/index.js";
+import { PromptButtonVariant } from "../PromptButton/types/index.js";
+import "../PromptButton/index.js";
+import { AnimationSpeed, PromptCarouselRows } from "../PromptCarousel/types/types.js";
+import { PromptCarousel } from "../PromptCarousel/PromptCarousel.js";
+import "../PromptCarousel/index.js";
+import { useGetSkeletonProperties } from "../Image/hooks/useGetSkeletonProperties.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import classNames from "classnames";
+
+//#region src/components/TitledPromptCarousel/TitledPromptCarousel.tsx
+const TitledPromptCarousel = ({ id, titleLabel, titleAriaLabel, theme = Theme.GLOBAL_CUSTOM, isLoading = false, boldFirstButton = false, promptButtonType = PromptButtonVariant.LIGHT, promptCarouselRows = PromptCarouselRows.ALWAYS_ONE, animationSpeed = AnimationSpeed.NONE, handleButtonClick, promptButtonTexts, promptCarouselAriaLabel }) => {
+	const { skeletonClass } = useGetSkeletonProperties(isLoading);
+	const loadingHeightClass = isLoading ? "envive-tw-h-[24px]" : "";
+	return /* @__PURE__ */ jsxs(Stack, {
+		direction: "column",
+		gap: 4,
+		align: "stretch",
+		children: [/* @__PURE__ */ jsx(Typography, {
+			variant: TypographyVariant.H1_MD,
+			className: classNames(skeletonClass, loadingHeightClass),
+			"aria-label": titleAriaLabel,
+			children: isLoading ? "" : titleLabel
+		}), /* @__PURE__ */ jsx(PromptCarousel, {
+			id,
+			theme,
+			isLoading,
+			boldFirstButton,
+			promptButtonType,
+			promptCarouselRows,
+			animationSpeed,
+			handleButtonClick,
+			promptButtonTexts,
+			"aria-label": promptCarouselAriaLabel
+		})]
+	});
+};
+
+//#endregion
+export { TitledPromptCarousel };

package/dist/TitledPromptCarousel/index.cjs

@@ -0,0 +1,3 @@
+const require_TitledPromptCarousel = require('./TitledPromptCarousel.cjs');
+
+exports.TitledPromptCarousel = require_TitledPromptCarousel.TitledPromptCarousel;

package/dist/TitledPromptCarousel/index.d.cts

@@ -0,0 +1,3 @@
+import { TitledPromptCarouselProps } from "./types/index.cjs";
+import { TitledPromptCarousel } from "./TitledPromptCarousel.cjs";
+export { TitledPromptCarousel, type TitledPromptCarouselProps };

package/dist/TitledPromptCarousel/index.d.ts

@@ -0,0 +1,3 @@
+import { TitledPromptCarouselProps } from "./types/index.js";
+import { TitledPromptCarousel } from "./TitledPromptCarousel.js";
+export { TitledPromptCarousel, type TitledPromptCarouselProps };

package/dist/TitledPromptCarousel/index.js

@@ -0,0 +1,3 @@
+import { TitledPromptCarousel } from "./TitledPromptCarousel.js";
+
+export { TitledPromptCarousel };

package/dist/TitledPromptCarousel/types/index.d.cts

@@ -0,0 +1,71 @@
+import { Theme } from "../../components-v3/tokens/theme/theme.cjs";
+import { PromptButtonVariant } from "../../PromptButton/types/index.cjs";
+import { AnimationSpeed, PromptCarouselRows } from "../../PromptCarousel/types/types.cjs";
+
+//#region src/components/TitledPromptCarousel/types/index.d.ts
+
+/**
+ * Props for the TitledPromptCarousel component.
+ *
+ * @interface TitledPromptCarouselProps
+ */
+interface TitledPromptCarouselProps {
+  /**
+   * Unique identifier for the titled prompt carousel component.
+   */
+  id: string;
+  /**
+   * Text label displayed as the title above the prompt carousel.
+   */
+  titleLabel: string;
+  /**
+   * Accessibility: Provides an accessible name for the title element.
+   */
+  titleAriaLabel?: string;
+  /**
+   * Whether the component is in a loading state.
+   * @default false
+   */
+  isLoading?: boolean;
+  /**
+   * Whether the first button should be rendered with bold text.
+   * @default false
+   */
+  boldFirstButton?: boolean;
+  /**
+   * Visual variant/style of the prompt buttons.
+   * @default PromptButtonVariant.LIGHT
+   */
+  /**
+   * Visual theme of the prompt carousel.
+   * @default Theme.GLOBAL_CUSTOM
+   */
+  theme?: Theme;
+  promptButtonType?: PromptButtonVariant;
+  /**
+   * Number of rows to display in the carousel.
+   * Controls the layout behavior (always one row, always two rows, or responsive).
+   * @default PromptCarouselRows.ALWAYS_ONE
+   */
+  promptCarouselRows?: PromptCarouselRows;
+  /**
+   * Animation speed for carousel transitions.
+   * Controls how fast or slow the animations play, or disables them entirely.
+   */
+  animationSpeed?: AnimationSpeed;
+  /**
+   * Callback function invoked when a prompt button is clicked.
+   * @param text - The text of the clicked button.
+   */
+  handleButtonClick: (text: string) => void;
+  /**
+   * Array of text labels for the prompt buttons in the carousel.
+   */
+  promptButtonTexts: string[];
+  /**
+   * Accessibility: Provides an accessible name for the carousel container.
+   */
+  promptCarouselAriaLabel?: string;
+}
+//#endregion
+export { TitledPromptCarouselProps };

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

@@ -0,0 +1,71 @@
+import { Theme } from "../../components-v3/tokens/theme/theme.js";
+import { PromptButtonVariant } from "../../PromptButton/types/index.js";
+import { AnimationSpeed, PromptCarouselRows } from "../../PromptCarousel/types/types.js";
+
+//#region src/components/TitledPromptCarousel/types/index.d.ts
+
+/**
+ * Props for the TitledPromptCarousel component.
+ *
+ * @interface TitledPromptCarouselProps
+ */
+interface TitledPromptCarouselProps {
+  /**
+   * Unique identifier for the titled prompt carousel component.
+   */
+  id: string;
+  /**
+   * Text label displayed as the title above the prompt carousel.
+   */
+  titleLabel: string;
+  /**
+   * Accessibility: Provides an accessible name for the title element.
+   */
+  titleAriaLabel?: string;
+  /**
+   * Whether the component is in a loading state.
+   * @default false
+   */
+  isLoading?: boolean;
+  /**
+   * Whether the first button should be rendered with bold text.
+   * @default false
+   */
+  boldFirstButton?: boolean;
+  /**
+   * Visual variant/style of the prompt buttons.
+   * @default PromptButtonVariant.LIGHT
+   */
+  /**
+   * Visual theme of the prompt carousel.
+   * @default Theme.GLOBAL_CUSTOM
+   */
+  theme?: Theme;
+  promptButtonType?: PromptButtonVariant;
+  /**
+   * Number of rows to display in the carousel.
+   * Controls the layout behavior (always one row, always two rows, or responsive).
+   * @default PromptCarouselRows.ALWAYS_ONE
+   */
+  promptCarouselRows?: PromptCarouselRows;
+  /**
+   * Animation speed for carousel transitions.
+   * Controls how fast or slow the animations play, or disables them entirely.
+   */
+  animationSpeed?: AnimationSpeed;
+  /**
+   * Callback function invoked when a prompt button is clicked.
+   * @param text - The text of the clicked button.
+   */
+  handleButtonClick: (text: string) => void;
+  /**
+   * Array of text labels for the prompt buttons in the carousel.
+   */
+  promptButtonTexts: string[];
+  /**
+   * Accessibility: Provides an accessible name for the carousel container.
+   */
+  promptCarouselAriaLabel?: string;
+}
+//#endregion
+export { TitledPromptCarouselProps };

package/dist/Tokens/index.cjs

@@ -0,0 +1,30 @@
+const require_colors = require('../components-v3/tokens/colors/colors.cjs');
+const require_fontSize = require('../components-v3/tokens/typography/fontSize.cjs');
+const require_fontWeight = require('../components-v3/tokens/typography/fontWeight.cjs');
+const require_lineHeight = require('../components-v3/tokens/typography/lineHeight.cjs');
+const require_letterSpacing = require('../components-v3/tokens/typography/letterSpacing.cjs');
+const require_fontFamily = require('../components-v3/tokens/typography/fontFamily.cjs');
+const require_radius = require('../components-v3/tokens/radius/radius.cjs');
+const require_aspectRatio = require('../components-v3/tokens/aspectRatio/aspectRatio.cjs');
+const require_theme = require('../components-v3/tokens/theme/theme.cjs');
+const require_breakpoints = require('../components-v3/tokens/breakpoints/breakpoints.cjs');
+const require_typography = require('../components-v3/tokens/typography/typography.cjs');
+const require_spacing = require('../components-v3/tokens/spacing/spacing.cjs');
+const require_motion = require('../components-v3/tokens/montion/motion.cjs');
+
+exports.FontFamily = require_fontFamily.FontFamily;
+exports.Theme = require_theme.Theme;
+exports.animationsVariables = require_motion.animationsVariables;
+exports.aspectRatioVariables = require_aspectRatio.aspectRatioVariables;
+exports.borderRadiusVariables = require_radius.borderRadiusVariables;
+exports.colorsVariables = require_colors.colorsVariables;
+exports.createTypographyComponents = require_typography.createTypographyComponents;
+exports.fontFamilyVariables = require_fontFamily.fontFamilyVariables;
+exports.fontSizeVariables = require_fontSize.fontSizeVariables;
+exports.fontWeightVariables = require_fontWeight.fontWeightVariables;
+exports.keyFramesVariables = require_motion.keyFramesVariables;
+exports.letterSpacingVariables = require_letterSpacing.letterSpacingVariables;
+exports.lineHeightVariables = require_lineHeight.lineHeightVariables;
+exports.screensBreakpointsVariables = require_breakpoints.screensBreakpointsVariables;
+exports.spacingVariables = require_spacing.spacingVariables;
+exports.tailwindScreens = require_breakpoints.tailwindScreens;

package/dist/Tokens/index.d.cts

@@ -0,0 +1,14 @@
+import { Theme } from "../components-v3/tokens/theme/theme.cjs";
+import { createTypographyComponents } from "../components-v3/tokens/typography/typography.cjs";
+import { FontFamily, fontFamilyVariables } from "../components-v3/tokens/typography/fontFamily.cjs";
+import { fontSizeVariables } from "../components-v3/tokens/typography/fontSize.cjs";
+import { fontWeightVariables } from "../components-v3/tokens/typography/fontWeight.cjs";
+import { lineHeightVariables } from "../components-v3/tokens/typography/lineHeight.cjs";
+import { letterSpacingVariables } from "../components-v3/tokens/typography/letterSpacing.cjs";
+import { borderRadiusVariables } from "../components-v3/tokens/radius/radius.cjs";
+import { screensBreakpointsVariables, tailwindScreens } from "../components-v3/tokens/breakpoints/breakpoints.cjs";
+import { spacingVariables } from "../components-v3/tokens/spacing/spacing.cjs";
+import { colorsVariables } from "../components-v3/tokens/colors/colors.cjs";
+import { animationsVariables, keyFramesVariables } from "../components-v3/tokens/montion/motion.cjs";
+import { aspectRatioVariables } from "../components-v3/tokens/aspectRatio/aspectRatio.cjs";
+export { FontFamily, Theme, animationsVariables, aspectRatioVariables, borderRadiusVariables, colorsVariables, createTypographyComponents, fontFamilyVariables, fontSizeVariables, fontWeightVariables, keyFramesVariables, letterSpacingVariables, lineHeightVariables, screensBreakpointsVariables, spacingVariables, tailwindScreens };

package/dist/Tokens/index.d.ts

@@ -0,0 +1,14 @@
+import { Theme } from "../components-v3/tokens/theme/theme.js";
+import { createTypographyComponents } from "../components-v3/tokens/typography/typography.js";
+import { FontFamily, fontFamilyVariables } from "../components-v3/tokens/typography/fontFamily.js";
+import { fontSizeVariables } from "../components-v3/tokens/typography/fontSize.js";
+import { fontWeightVariables } from "../components-v3/tokens/typography/fontWeight.js";
+import { lineHeightVariables } from "../components-v3/tokens/typography/lineHeight.js";
+import { letterSpacingVariables } from "../components-v3/tokens/typography/letterSpacing.js";
+import { borderRadiusVariables } from "../components-v3/tokens/radius/radius.js";
+import { screensBreakpointsVariables, tailwindScreens } from "../components-v3/tokens/breakpoints/breakpoints.js";
+import { spacingVariables } from "../components-v3/tokens/spacing/spacing.js";
+import { colorsVariables } from "../components-v3/tokens/colors/colors.js";
+import { animationsVariables, keyFramesVariables } from "../components-v3/tokens/montion/motion.js";
+import { aspectRatioVariables } from "../components-v3/tokens/aspectRatio/aspectRatio.js";
+export { FontFamily, Theme, animationsVariables, aspectRatioVariables, borderRadiusVariables, colorsVariables, createTypographyComponents, fontFamilyVariables, fontSizeVariables, fontWeightVariables, keyFramesVariables, letterSpacingVariables, lineHeightVariables, screensBreakpointsVariables, spacingVariables, tailwindScreens };

package/dist/Tokens/index.js

@@ -0,0 +1,15 @@
+import { colorsVariables } from "../components-v3/tokens/colors/colors.js";
+import { fontSizeVariables } from "../components-v3/tokens/typography/fontSize.js";
+import { fontWeightVariables } from "../components-v3/tokens/typography/fontWeight.js";
+import { lineHeightVariables } from "../components-v3/tokens/typography/lineHeight.js";
+import { letterSpacingVariables } from "../components-v3/tokens/typography/letterSpacing.js";
+import { FontFamily, fontFamilyVariables } from "../components-v3/tokens/typography/fontFamily.js";
+import { borderRadiusVariables } from "../components-v3/tokens/radius/radius.js";
+import { aspectRatioVariables } from "../components-v3/tokens/aspectRatio/aspectRatio.js";
+import { Theme } from "../components-v3/tokens/theme/theme.js";
+import { screensBreakpointsVariables, tailwindScreens } from "../components-v3/tokens/breakpoints/breakpoints.js";
+import { createTypographyComponents } from "../components-v3/tokens/typography/typography.js";
+import { spacingVariables } from "../components-v3/tokens/spacing/spacing.js";
+import { animationsVariables, keyFramesVariables } from "../components-v3/tokens/montion/motion.js";
+
+export { FontFamily, Theme, animationsVariables, aspectRatioVariables, borderRadiusVariables, colorsVariables, createTypographyComponents, fontFamilyVariables, fontSizeVariables, fontWeightVariables, keyFramesVariables, letterSpacingVariables, lineHeightVariables, screensBreakpointsVariables, spacingVariables, tailwindScreens };

package/dist/TypingAnimation/TypingAnimation.cjs

@@ -0,0 +1,94 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_AnimatedText = require('../AnimatedText/AnimatedText.cjs');
+require('../AnimatedText/index.cjs');
+const require_theme = require('../components-v3/tokens/theme/theme.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');
+require('../Tokens/index.cjs');
+const require_PromptButton_types_index = require('../PromptButton/types/index.cjs');
+const require_PromptCarousel_types_types = require('../PromptCarousel/types/types.cjs');
+const require_PromptCarousel = require('../PromptCarousel/PromptCarousel.cjs');
+require('../PromptCarousel/index.cjs');
+const require_types = require('../WidgetWrapper/types/types.cjs');
+const require_WidgetTextField = require('../WidgetTextField/WidgetTextField.cjs');
+require('../WidgetTextField/index.cjs');
+require('../WidgetWrapper/index.cjs');
+const require_WidgetWrapperWithTitle = require('../WidgetWrapperWithTitle/WidgetWrapperWithTitle.cjs');
+require('../WidgetWrapperWithTitle/index.cjs');
+const require_useGetTypographyVariant = require('./hooks/useGetTypographyVariant.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/components/TypingAnimation/TypingAnimation.tsx
+const TypingAnimation = ({ baseProps, widgetContentProps, widgetStyleProps, widgetEventProps }) => {
+	const { id, testId, className, style } = baseProps || {};
+	const { titleLabel, headlineText, animatedTextSequence, promptButtonTexts, hintText, textFieldAriaLabel } = widgetContentProps || {};
+	const { widgetVariant = require_types.WidgetWrapperVariant.CARD_WITH_BORDER, cardColor, promptButtonType = require_PromptButton_types_index.PromptButtonVariant.LIGHT, promptCarouselRows = require_PromptCarousel_types_types.PromptCarouselRows.ALWAYS_ONE, showTextField = true, theme = require_theme.Theme.GLOBAL_CUSTOM, isLoading = false } = widgetStyleProps || {};
+	const { handleButtonClick, handleTextFieldClick } = widgetEventProps || {};
+	const typographyVariant = require_useGetTypographyVariant.useGetTypographyVariant(theme);
+	const getAnimatedTextWrapper = (0, react.useCallback)((text) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+		variant: typographyVariant,
+		color: require_index.TypographyColor.TEXT_ACCENT,
+		as: "span",
+		children: text
+	}), [typographyVariant]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_WidgetWrapperWithTitle.WidgetWrapperWithTitle, {
+		id,
+		testId,
+		variant: widgetVariant,
+		className,
+		style,
+		titleLabel,
+		hexCardColor: cardColor,
+		fullIsLoading: isLoading,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Stack.Stack, {
+			direction: "column",
+			gap: "4",
+			children: [
+				(headlineText || animatedTextSequence && animatedTextSequence.length > 0) && !isLoading && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+					"data-testid": "typing-animation-headline-text",
+					className: "envive-tw-max-w-[90ch] envive-tw-overflow-hidden envive-tw-text-ellipsis envive-tw-whitespace-nowrap",
+					style: { textAlign: "left" },
+					children: [
+						headlineText && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.Typography, {
+							variant: typographyVariant,
+							color: require_index.TypographyColor.TEXT_PRIMARY,
+							as: "span",
+							children: headlineText
+						}),
+						" ",
+						animatedTextSequence && animatedTextSequence.length > 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AnimatedText.AnimatedText, {
+							sequence: animatedTextSequence,
+							loop: true,
+							getNodeWrapper: getAnimatedTextWrapper
+						}) : null
+					]
+				}),
+				promptButtonTexts && promptButtonTexts.length > 0 && handleButtonClick && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PromptCarousel.PromptCarousel, {
+					id,
+					theme,
+					isLoading,
+					boldFirstButton: false,
+					promptButtonType,
+					promptCarouselRows,
+					handleButtonClick,
+					promptButtonTexts
+				}),
+				showTextField && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_WidgetTextField.WidgetTextField, {
+					placeholder: hintText,
+					onClick: handleTextFieldClick,
+					ariaLabel: textFieldAriaLabel,
+					theme,
+					isLoading,
+					className: "envive-tw-mt-2 envive-tw-overflow-hidden envive-tw-text-ellipsis envive-tw-whitespace-nowrap"
+				})
+			]
+		})
+	});
+};
+
+//#endregion
+exports.TypingAnimation = TypingAnimation;

package/dist/TypingAnimation/TypingAnimation.d.cts

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

package/dist/TypingAnimation/TypingAnimation.d.ts

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

package/dist/TypingAnimation/TypingAnimation.js

@@ -0,0 +1,93 @@
+import { AnimatedText } from "../AnimatedText/AnimatedText.js";
+import "../AnimatedText/index.js";
+import { Theme } from "../components-v3/tokens/theme/theme.js";
+import { Stack } from "../Stack/Stack.js";
+import "../Stack/index.js";
+import { TypographyColor } from "../Typography/types/index.js";
+import { Typography } from "../Typography/Typography.js";
+import "../Typography/index.js";
+import "../Tokens/index.js";
+import { PromptButtonVariant } from "../PromptButton/types/index.js";
+import { PromptCarouselRows } from "../PromptCarousel/types/types.js";
+import { PromptCarousel } from "../PromptCarousel/PromptCarousel.js";
+import "../PromptCarousel/index.js";
+import { WidgetWrapperVariant } from "../WidgetWrapper/types/types.js";
+import { WidgetTextField } from "../WidgetTextField/WidgetTextField.js";
+import "../WidgetTextField/index.js";
+import "../WidgetWrapper/index.js";
+import { WidgetWrapperWithTitle } from "../WidgetWrapperWithTitle/WidgetWrapperWithTitle.js";
+import "../WidgetWrapperWithTitle/index.js";
+import { useGetTypographyVariant } from "./hooks/useGetTypographyVariant.js";
+import { useCallback } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/TypingAnimation/TypingAnimation.tsx
+const TypingAnimation = ({ baseProps, widgetContentProps, widgetStyleProps, widgetEventProps }) => {
+	const { id, testId, className, style } = baseProps || {};
+	const { titleLabel, headlineText, animatedTextSequence, promptButtonTexts, hintText, textFieldAriaLabel } = widgetContentProps || {};
+	const { widgetVariant = WidgetWrapperVariant.CARD_WITH_BORDER, cardColor, promptButtonType = PromptButtonVariant.LIGHT, promptCarouselRows = PromptCarouselRows.ALWAYS_ONE, showTextField = true, theme = Theme.GLOBAL_CUSTOM, isLoading = false } = widgetStyleProps || {};
+	const { handleButtonClick, handleTextFieldClick } = widgetEventProps || {};
+	const typographyVariant = useGetTypographyVariant(theme);
+	const getAnimatedTextWrapper = useCallback((text) => /* @__PURE__ */ jsx(Typography, {
+		variant: typographyVariant,
+		color: TypographyColor.TEXT_ACCENT,
+		as: "span",
+		children: text
+	}), [typographyVariant]);
+	return /* @__PURE__ */ jsx(WidgetWrapperWithTitle, {
+		id,
+		testId,
+		variant: widgetVariant,
+		className,
+		style,
+		titleLabel,
+		hexCardColor: cardColor,
+		fullIsLoading: isLoading,
+		children: /* @__PURE__ */ jsxs(Stack, {
+			direction: "column",
+			gap: "4",
+			children: [
+				(headlineText || animatedTextSequence && animatedTextSequence.length > 0) && !isLoading && /* @__PURE__ */ jsxs("p", {
+					"data-testid": "typing-animation-headline-text",
+					className: "envive-tw-max-w-[90ch] envive-tw-overflow-hidden envive-tw-text-ellipsis envive-tw-whitespace-nowrap",
+					style: { textAlign: "left" },
+					children: [
+						headlineText && /* @__PURE__ */ jsx(Typography, {
+							variant: typographyVariant,
+							color: TypographyColor.TEXT_PRIMARY,
+							as: "span",
+							children: headlineText
+						}),
+						" ",
+						animatedTextSequence && animatedTextSequence.length > 0 ? /* @__PURE__ */ jsx(AnimatedText, {
+							sequence: animatedTextSequence,
+							loop: true,
+							getNodeWrapper: getAnimatedTextWrapper
+						}) : null
+					]
+				}),
+				promptButtonTexts && promptButtonTexts.length > 0 && handleButtonClick && /* @__PURE__ */ jsx(PromptCarousel, {
+					id,
+					theme,
+					isLoading,
+					boldFirstButton: false,
+					promptButtonType,
+					promptCarouselRows,
+					handleButtonClick,
+					promptButtonTexts
+				}),
+				showTextField && /* @__PURE__ */ jsx(WidgetTextField, {
+					placeholder: hintText,
+					onClick: handleTextFieldClick,
+					ariaLabel: textFieldAriaLabel,
+					theme,
+					isLoading,
+					className: "envive-tw-mt-2 envive-tw-overflow-hidden envive-tw-text-ellipsis envive-tw-whitespace-nowrap"
+				})
+			]
+		})
+	});
+};
+
+//#endregion
+export { TypingAnimation };

package/dist/TypingAnimation/hooks/useGetTypographyVariant.cjs

@@ -0,0 +1,12 @@
+const require_theme = require('../../components-v3/tokens/theme/theme.cjs');
+const require_index = require('../../Typography/types/index.cjs');
+require('../../Typography/index.cjs');
+require('../../Tokens/index.cjs');
+
+//#region src/components/TypingAnimation/hooks/useGetTypographyVariant.tsx
+const useGetTypographyVariant = (theme) => {
+	return theme === require_theme.Theme.STANDARD ? require_index.TypographyVariant.B1_MD : require_index.TypographyVariant.B2_MD;
+};
+
+//#endregion
+exports.useGetTypographyVariant = useGetTypographyVariant;

package/dist/TypingAnimation/hooks/useGetTypographyVariant.js

@@ -0,0 +1,12 @@
+import { Theme } from "../../components-v3/tokens/theme/theme.js";
+import { TypographyVariant } from "../../Typography/types/index.js";
+import "../../Typography/index.js";
+import "../../Tokens/index.js";
+
+//#region src/components/TypingAnimation/hooks/useGetTypographyVariant.tsx
+const useGetTypographyVariant = (theme) => {
+	return theme === Theme.STANDARD ? TypographyVariant.B1_MD : TypographyVariant.B2_MD;
+};
+
+//#endregion
+export { useGetTypographyVariant };

package/dist/TypingAnimation/index.cjs

@@ -0,0 +1,3 @@
+const require_TypingAnimation = require('./TypingAnimation.cjs');
+
+exports.TypingAnimation = require_TypingAnimation.TypingAnimation;

package/dist/TypingAnimation/index.d.cts

@@ -0,0 +1,3 @@
+import { TypingAnimationProps } from "./types/index.cjs";
+import { TypingAnimation } from "./TypingAnimation.cjs";
+export { TypingAnimation, type TypingAnimationProps };

package/dist/TypingAnimation/index.d.ts

@@ -0,0 +1,3 @@
+import { TypingAnimationProps } from "./types/index.js";
+import { TypingAnimation } from "./TypingAnimation.js";
+export { TypingAnimation, type TypingAnimationProps };

package/dist/TypingAnimation/index.js

@@ -0,0 +1,3 @@
+import { TypingAnimation } from "./TypingAnimation.js";
+
+export { TypingAnimation };