@envive-ai/react-widgets 0.1.2-arthur-3 → 0.1.3

package/src/SuggestionBar/SuggestionBar.tsx

@@ -3,22 +3,19 @@ import { useScrollContainer } from 'react-indiana-drag-scroll';
 import { v4 as uuid } from 'uuid';
 import { useSetAtom } from 'jotai';
 
-
-import { SpiffyWidgets, MessageRole, MessageType } from '@envive-ai/react-hooks/application/models';
-import { logPerfMetricAtom, PerfMetricsEvents } from '@envive-ai/react-hooks/atoms/chat';
+import { MessageRole, MessageType, SpiffyWidgets } from '@envive-ai/react-hooks/application/models';
+import { PerfMetricsEvents, logPerfMetricAtom } from '@envive-ai/react-hooks/atoms/chat';
 import { SUGGESTION_BAR_TESTID } from '@envive-ai/react-hooks/config';
 import { useIsSmallScreen } from '@envive-ai/react-hooks/hooks/IsSmallScreen';
 import { useTrackComponentVisibleEvent } from '@envive-ai/react-hooks/hooks/TrackComponentVisibleEvent';
-import { TestProps } from '@envive-ai/react-hooks/types';
 import { Message } from 'postcss';
 
 import { SuggestionButtonVariant } from '@envive-ai/react-hooks/contexts/types';
 import { SuggestionBarLocationForMetrics } from './types';
 import { SuggestionButtonContainer } from '../SuggestionButtonContainer';
 
-
 // SuggestionBarV2 Props
-interface SuggestionBarProps extends TestProps {
+interface SuggestionBarProps {
   id: string;
   locationForMetrics: SuggestionBarLocationForMetrics;
   buttonTexts: string[];
@@ -29,6 +26,7 @@ interface SuggestionBarProps extends TestProps {
   twoRowsOnMobile?: boolean | undefined;
   animationSpeed?: 'standard' | 'slow' | 'none';
   buttonBorderRadius?: 'sm' | 'md' | 'lg';
+  dataTestId?: string;
 }
 
 // SuggestionBar functional component
@@ -57,11 +55,9 @@ function SuggestionBar({
   const isAnimated = animationSpeed !== 'none';
 
   // Track component visibility
-  useTrackComponentVisibleEvent(
-    SpiffyWidgets.SuggestionBar,
-    componentVisibleTriggerRef,
-    { animated: isAnimated },
-  );
+  useTrackComponentVisibleEvent(SpiffyWidgets.SuggestionBar, componentVisibleTriggerRef, {
+    animated: isAnimated,
+  });
 
   // Handle button click
   const handleClickSuggestion = useCallback(
@@ -102,16 +98,12 @@ function SuggestionBar({
   );
 
   return (
-    <div id={id} className="spiffy-tw-justify-center spiffy-tw-w-full spiffy-tw-overflow-hidden">
+    <div
+      id={id}
+      className="spiffy-tw-w-full spiffy-tw-justify-center spiffy-tw-overflow-hidden"
+    >
       <div
-        className={`
-          spiffy-tw-relative 
-          spiffy-tw-w-full 
-          spiffy-tw-overflow-x-scroll 
-          spiffy-tw-overflow-y-hidden 
-          spiffy-tw-no-scrollbar
-          ${twoRowsOnMobile && isSmallScreen ? 'spiffy-tw-h-20' : 'spiffy-tw-h-9'}
-        `}
+        className={`spiffy-tw-no-scrollbar spiffy-tw-relative spiffy-tw-w-full spiffy-tw-overflow-y-hidden spiffy-tw-overflow-x-scroll ${twoRowsOnMobile && isSmallScreen ? 'spiffy-tw-h-20' : 'spiffy-tw-h-9'} `}
         ref={handleContainerRef}
       >
         <div

package/src/SuggestionBar/types.ts

@@ -1,4 +1,4 @@
 export enum SuggestionBarLocationForMetrics {
-    SUGGESTION_BAR_TOP = 'top',
-    SUGGESTION_BAR_BOTTOM = 'bottom'
-}
+  SUGGESTION_BAR_TOP = 'top',
+  SUGGESTION_BAR_BOTTOM = 'bottom',
+}

package/src/SuggestionButtonContainer/SuggestionButtonContainer.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable react/no-array-index-key */
 import { useRef } from 'react';
 import { SuggestionButton } from '@envive-ai/react-toolkit/SuggestionButton';
 import { SpiffyWidgets } from '@envive-ai/react-hooks/application/models';
@@ -15,20 +16,12 @@ interface ButtonContainerProps {
 // ButtonContainer is reused twice within SuggestionBarV2, so we declare it as a seperate functional component
 function ButtonContainer({ children }: ButtonContainerProps) {
   return (
-    <div
-      className="spiffy-tw-flex 
-      spiffy-tw-flex-row
-      spiffy-tw-items-center
-      spiffy-tw-space-x-2
-      spiffy-tw-h-full
-      spiffy-tw-pl-0"
-    >
+    <div className="spiffy-tw-pl-0 spiffy-tw-flex spiffy-tw-h-full spiffy-tw-flex-row spiffy-tw-items-center spiffy-tw-space-x-2">
       {children}
     </div>
   );
 }
 
-
 const SuggestionButtonContainer: React.FC<SuggestionButtonContainerProps> = ({
   buttonVariation,
   hoverButtonVariation,
@@ -47,17 +40,15 @@ const SuggestionButtonContainer: React.FC<SuggestionButtonContainerProps> = ({
   useHorizontalScrollAnimation({
     scrollContainerRef,
     animationSpeed,
-  })
+  });
   const isSmallScreen = useIsSmallScreen();
 
   const isAnimated = animationSpeed !== 'none';
 
   // Track component visibility
-  useTrackComponentVisibleEvent(
-    SpiffyWidgets.SuggestionBar,
-    componentVisibleTriggerRef,
-    { animated: isAnimated },
-  );
+  useTrackComponentVisibleEvent(SpiffyWidgets.SuggestionBar, componentVisibleTriggerRef, {
+    animated: isAnimated,
+  });
 
   const visibleButtonsFirstRow = buttonTexts.slice(
     0,
@@ -70,7 +61,7 @@ const SuggestionButtonContainer: React.FC<SuggestionButtonContainerProps> = ({
   );
 
   return (
-    <div className="spiffy-tw-overflow-x-scroll spiffy-tw-no-scrollbar spiffy-tw-w-full spiffy-tw-whitespace-nowrap">
+    <div className="spiffy-tw-no-scrollbar spiffy-tw-w-full spiffy-tw-overflow-x-scroll spiffy-tw-whitespace-nowrap">
       <ButtonContainer>
         {visibleButtonsFirstRow.map((suggestion, i) => (
           <SuggestionButton
@@ -136,6 +127,6 @@ const SuggestionButtonContainer: React.FC<SuggestionButtonContainerProps> = ({
       )}
     </div>
   );
-}
+};
 
 export { SuggestionButtonContainer };

package/src/SuggestionButtonContainer/types.ts

@@ -1,6 +1,5 @@
-import { SuggestionButtonVariant } from "@envive-ai/react-hooks/contexts/types";
-import { TestProps } from "@envive-ai/react-hooks/types";
-
+import { SuggestionButtonVariant } from '@envive-ai/react-hooks/contexts/types';
+import { TestProps } from '@envive-ai/react-hooks/types';
 
 // SuggestionButtonContainer Props
 export interface SuggestionButtonContainerProps extends TestProps {
@@ -13,4 +12,4 @@ export interface SuggestionButtonContainerProps extends TestProps {
   twoRowsOnMobile?: boolean | undefined;
   animationSpeed?: 'standard' | 'slow' | 'none';
   buttonBorderRadius?: 'sm' | 'md' | 'lg';
-}
+}

package/src/stories/SearchResults.stories.tsx

@@ -18,7 +18,7 @@ const meta = {
       productGridVariant: 'standard',
       searchBoxPlaceholder: '',
       widgetConfigId: '',
-      type: WidgetType.SearchResultsEntryPoint
+      type: WidgetType.SearchResultsEntryPoint,
     },
   },
 } satisfies Meta<typeof SearchResults>;

package/src/stories/SearchZeroState.stories.tsx

@@ -30,11 +30,19 @@ const meta = {
     },
     searchZeroStateVariant: {
       control: 'select',
-      options: ['backgroundTertiary', 'backgroundPrimary', 'backgroundSecondary', 'backgroundQuaternary'],
+      options: [
+        'backgroundTertiary',
+        'backgroundPrimary',
+        'backgroundSecondary',
+        'backgroundQuaternary',
+      ],
     },
   },
   render: (args: SearchEntryPointWidgetConfig & { initialIsOpen: boolean }) => (
-    <SearchZeroState widgetConfig={{ ...args }} initialIsOpen={args.initialIsOpen} />
+    <SearchZeroState
+      widgetConfig={{ ...args }}
+      initialIsOpen={args.initialIsOpen}
+    />
   ),
 } satisfies Meta;
 

package/src/stories/SuggestionBar.stories.tsx

@@ -14,7 +14,7 @@ const meta: Meta<typeof SuggestionBar> = {
       options: ['none', 'standard', 'slow'],
     },
   },
-  render: (args) => (
+  render: args => (
     <div style={{ width: '300px', height: '100px' }}>
       <SuggestionBar {...args} />
     </div>
@@ -35,7 +35,6 @@ export const Default: Story = {
     handleReply: () => {},
     boldFirstButton: false,
   },
-  
 };
 
 export const Animated: Story = {

package/src/util/useHorizontalScrollAnimation.ts

@@ -1,4 +1,4 @@
-import { useEffect, RefObject, useRef } from 'react';
+import { RefObject, useEffect, useRef } from 'react';
 import { useReducedMotionWithOverride } from 'src/util/useReducedMotionWithOverride';
 
 // IMPORTANT: All refs passed to this hook must be mutable (not Readonly)

package/dist/SearchZeroState/index-19CiYvee.d.cts

@@ -1,27 +0,0 @@
-import * as react_jsx_runtime1 from "react/jsx-runtime";
-import { SearchEntryPointWidgetConfig, SearchInputVariant } from "@envive-ai/react-hooks/contexts/types";
-import React$1 from "react";
-
-//#region src/SearchZeroState/types.d.ts
-interface SearchZeroStateProps {
-  widgetConfig: SearchEntryPointWidgetConfig;
-  initialIsOpen?: boolean;
-  entryPointRef?: React.Ref<HTMLButtonElement>;
-}
-//#endregion
-//#region src/SearchZeroState/SearchZeroState.d.ts
-declare const SearchZeroState: React$1.FC<SearchZeroStateProps>;
-//#endregion
-//#region src/SearchZeroState/SearchZeroStateWidget.d.ts
-type SearchZeroStateWidgetProps = {
-  initialIsOpen: boolean;
-  widgetConfigId?: string;
-  entryPointRef: React.Ref<HTMLButtonElement>;
-};
-declare const SearchZeroStateWidget: ({
-  initialIsOpen,
-  widgetConfigId,
-  entryPointRef
-}: SearchZeroStateWidgetProps) => react_jsx_runtime1.JSX.Element;
-//#endregion
-export { type SearchEntryPointWidgetConfig, type SearchInputVariant, SearchZeroState, SearchZeroStateProps, SearchZeroStateWidget };

package/dist/SearchZeroState/index-6EaGWYP4.d.ts

@@ -1,27 +0,0 @@
-import React$1 from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-import { SearchEntryPointWidgetConfig, SearchInputVariant } from "@envive-ai/react-hooks/contexts/types";
-
-//#region src/SearchZeroState/types.d.ts
-interface SearchZeroStateProps {
-  widgetConfig: SearchEntryPointWidgetConfig;
-  initialIsOpen?: boolean;
-  entryPointRef?: React.Ref<HTMLButtonElement>;
-}
-//#endregion
-//#region src/SearchZeroState/SearchZeroState.d.ts
-declare const SearchZeroState: React$1.FC<SearchZeroStateProps>;
-//#endregion
-//#region src/SearchZeroState/SearchZeroStateWidget.d.ts
-type SearchZeroStateWidgetProps = {
-  initialIsOpen: boolean;
-  widgetConfigId?: string;
-  entryPointRef: React.Ref<HTMLButtonElement>;
-};
-declare const SearchZeroStateWidget: ({
-  initialIsOpen,
-  widgetConfigId,
-  entryPointRef
-}: SearchZeroStateWidgetProps) => react_jsx_runtime0.JSX.Element;
-//#endregion
-export { type SearchEntryPointWidgetConfig, type SearchInputVariant, SearchZeroState, SearchZeroStateProps, SearchZeroStateWidget };

package/dist/SuggestionBar-DeMmAK4M.js

@@ -1,131 +0,0 @@
-import { t as SuggestionButtonContainer } from "./SuggestionButtonContainer-CZhOkZaJ.js";
-import { useCallback, useRef } from "react";
-import { useSetAtom } from "jotai";
-import { jsx } from "react/jsx-runtime";
-import { MessageRole, MessageType, SpiffyWidgets } from "@envive-ai/react-hooks/application/models";
-import { useScrollContainer } from "react-indiana-drag-scroll";
-import { PerfMetricsEvents, logPerfMetricAtom } from "@envive-ai/react-hooks/atoms/chat";
-import { SUGGESTION_BAR_TESTID } from "@envive-ai/react-hooks/config";
-import { useIsSmallScreen } from "@envive-ai/react-hooks/hooks/IsSmallScreen";
-import { useTrackComponentVisibleEvent } from "@envive-ai/react-hooks/hooks/TrackComponentVisibleEvent";
-
-//#region ../../node_modules/uuid/dist/stringify.js
-const byteToHex = [];
-for (let i = 0; i < 256; ++i) byteToHex.push((i + 256).toString(16).slice(1));
-function unsafeStringify(arr, offset = 0) {
-	return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + "-" + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + "-" + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + "-" + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + "-" + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
-}
-
-//#endregion
-//#region ../../node_modules/uuid/dist/rng.js
-let getRandomValues;
-const rnds8 = new Uint8Array(16);
-function rng() {
-	if (!getRandomValues) {
-		if (typeof crypto === "undefined" || !crypto.getRandomValues) throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
-		getRandomValues = crypto.getRandomValues.bind(crypto);
-	}
-	return getRandomValues(rnds8);
-}
-
-//#endregion
-//#region ../../node_modules/uuid/dist/native.js
-const randomUUID = typeof crypto !== "undefined" && crypto.randomUUID && crypto.randomUUID.bind(crypto);
-var native_default = { randomUUID };
-
-//#endregion
-//#region ../../node_modules/uuid/dist/v4.js
-function _v4(options, buf, offset) {
-	options = options || {};
-	const rnds = options.random ?? options.rng?.() ?? rng();
-	if (rnds.length < 16) throw new Error("Random bytes length must be >= 16");
-	rnds[6] = rnds[6] & 15 | 64;
-	rnds[8] = rnds[8] & 63 | 128;
-	if (buf) {
-		offset = offset || 0;
-		if (offset < 0 || offset + 16 > buf.length) throw new RangeError(`UUID byte range ${offset}:${offset + 15} is out of buffer bounds`);
-		for (let i = 0; i < 16; ++i) buf[offset + i] = rnds[i];
-		return buf;
-	}
-	return unsafeStringify(rnds);
-}
-function v4(options, buf, offset) {
-	if (native_default.randomUUID && !buf && !options) return native_default.randomUUID();
-	return _v4(options, buf, offset);
-}
-var v4_default = v4;
-
-//#endregion
-//#region src/SuggestionBar/types.ts
-let SuggestionBarLocationForMetrics = /* @__PURE__ */ function(SuggestionBarLocationForMetrics$1) {
-	SuggestionBarLocationForMetrics$1["SUGGESTION_BAR_TOP"] = "top";
-	SuggestionBarLocationForMetrics$1["SUGGESTION_BAR_BOTTOM"] = "bottom";
-	return SuggestionBarLocationForMetrics$1;
-}({});
-
-//#endregion
-//#region src/SuggestionBar/SuggestionBar.tsx
-function SuggestionBar({ id, locationForMetrics, buttonTexts, buttonVariation, hoverButtonVariation, boldFirstButton = false, twoRowsOnMobile = false, animationSpeed = "none", buttonBorderRadius = "lg", handleReply, dataTestId }) {
-	const componentVisibleTriggerRef = useRef(null);
-	const containerRef = useRef(null);
-	const { ref } = useScrollContainer();
-	const isSmallScreen = useIsSmallScreen();
-	const logPerfMetric = useSetAtom(logPerfMetricAtom);
-	const isAnimated = animationSpeed !== "none";
-	useTrackComponentVisibleEvent(SpiffyWidgets.SuggestionBar, componentVisibleTriggerRef, { animated: isAnimated });
-	const handleClickSuggestion = useCallback((buttonText) => {
-		handleReply({
-			id: v4_default(),
-			role: MessageRole.User,
-			type: MessageType.QueryTyped,
-			createdAt: (/* @__PURE__ */ new Date()).toISOString(),
-			metadata: { content: buttonText }
-		});
-	}, [handleReply]);
-	const setRefs = useCallback((el) => {
-		if (typeof ref === "function") ref(el);
-		containerRef.current = el;
-	}, [ref]);
-	const handleContainerRef = useCallback((el) => {
-		if (el) logPerfMetric(locationForMetrics === SuggestionBarLocationForMetrics.SUGGESTION_BAR_TOP ? PerfMetricsEvents.TopSuggestionsBarRendered : PerfMetricsEvents.BottomSuggestionsBarRendered);
-		setRefs(el);
-	}, [
-		locationForMetrics,
-		logPerfMetric,
-		setRefs
-	]);
-	return /* @__PURE__ */ jsx("div", {
-		id,
-		className: "spiffy-tw-justify-center spiffy-tw-w-full spiffy-tw-overflow-hidden",
-		children: /* @__PURE__ */ jsx("div", {
-			className: `
-          spiffy-tw-relative 
-          spiffy-tw-w-full 
-          spiffy-tw-overflow-x-scroll 
-          spiffy-tw-overflow-y-hidden 
-          spiffy-tw-no-scrollbar
-          ${twoRowsOnMobile && isSmallScreen ? "spiffy-tw-h-20" : "spiffy-tw-h-9"}
-        `,
-			ref: handleContainerRef,
-			children: /* @__PURE__ */ jsx("div", {
-				className: "spiffy-tw-relative spiffy-tw-inline-block spiffy-tw-whitespace-nowrap",
-				ref: componentVisibleTriggerRef,
-				"data-testid": dataTestId || SUGGESTION_BAR_TESTID,
-				children: /* @__PURE__ */ jsx(SuggestionButtonContainer, {
-					buttonVariation,
-					hoverButtonVariation,
-					buttonTexts,
-					onButtonClick: handleClickSuggestion,
-					scrollContainerRef: containerRef,
-					boldFirstButton,
-					twoRowsOnMobile,
-					animationSpeed,
-					buttonBorderRadius
-				})
-			})
-		})
-	});
-}
-
-//#endregion
-export { SuggestionBarLocationForMetrics as n, SuggestionBar as t };

package/dist/SuggestionButtonContainer-BeWPpeQk.cjs

@@ -1,173 +0,0 @@
-const require_chunk = require('./chunk-DWy1uDak.cjs');
-let react = require("react");
-let react_jsx_runtime = require("react/jsx-runtime");
-let framer_motion = require("framer-motion");
-let __envive_ai_react_hooks_application_models = require("@envive-ai/react-hooks/application/models");
-let __envive_ai_react_hooks_config = require("@envive-ai/react-hooks/config");
-let __envive_ai_react_hooks_hooks_IsSmallScreen = require("@envive-ai/react-hooks/hooks/IsSmallScreen");
-let __envive_ai_react_hooks_hooks_TrackComponentVisibleEvent = require("@envive-ai/react-hooks/hooks/TrackComponentVisibleEvent");
-let __envive_ai_react_toolkit_SuggestionButton = require("@envive-ai/react-toolkit/SuggestionButton");
-
-//#region src/util/useReducedMotionWithOverride.ts
-const useReducedMotionWithOverride = () => {
-	const reducedMotionConfig = (0, framer_motion.useReducedMotionConfig)();
-	return (0, react.useMemo)(() => {
-		if (window?._spiffy?.reducedMotionOverride) return window?._spiffy?.reducedMotionOverride;
-		return reducedMotionConfig;
-	}, [reducedMotionConfig]);
-};
-
-//#endregion
-//#region src/util/useHorizontalScrollAnimation.ts
-function useHorizontalScrollAnimation({ scrollContainerRef, animationSpeed = "standard" }) {
-	const reducedMotion = useReducedMotionWithOverride();
-	const resumeTimeoutRef = (0, react.useRef)(null);
-	const scrollAnimationRef = (0, react.useRef)(null);
-	const pauseOnHover = true;
-	let PIXELS_PER_SECOND = 40;
-	switch (animationSpeed) {
-		case "standard":
-			PIXELS_PER_SECOND = 40;
-			break;
-		case "slow":
-			PIXELS_PER_SECOND = 25;
-			break;
-		case "none":
-			PIXELS_PER_SECOND = 0;
-			break;
-		default: PIXELS_PER_SECOND = 40;
-	}
-	const RESUME_DELAY_MS = 2e3;
-	const isAnimated = animationSpeed !== "none";
-	(0, react.useEffect)(() => {
-		if (!isAnimated || reducedMotion || !scrollContainerRef) return () => {};
-		const container = scrollContainerRef.current;
-		if (!container) return () => {};
-		if (container.scrollWidth <= container.clientWidth) return () => {};
-		let isPaused = false;
-		let lastTimestamp = null;
-		let accumulatedScroll = 0;
-		const step = (timestamp) => {
-			if (lastTimestamp === null) lastTimestamp = timestamp;
-			if (!isPaused) {
-				const delta = timestamp - lastTimestamp;
-				lastTimestamp = timestamp;
-				accumulatedScroll += PIXELS_PER_SECOND * (delta / 1e3);
-				const pixelsToScroll = Math.floor(accumulatedScroll);
-				if (pixelsToScroll > 0) {
-					container.scrollLeft += pixelsToScroll;
-					accumulatedScroll -= pixelsToScroll;
-					if (Math.ceil(container.scrollLeft) >= container.scrollWidth - container.clientWidth) {
-						container.scrollLeft = 0;
-						accumulatedScroll = 0;
-					}
-				}
-			}
-			scrollAnimationRef.current = requestAnimationFrame(step);
-		};
-		scrollAnimationRef.current = requestAnimationFrame(step);
-		const pauseAnimation = () => {
-			isPaused = true;
-			if (resumeTimeoutRef.current) {
-				clearTimeout(resumeTimeoutRef.current);
-				resumeTimeoutRef.current = null;
-			}
-		};
-		const scheduleResumeAnimation = () => {
-			resumeTimeoutRef.current = setTimeout(() => {
-				isPaused = false;
-				lastTimestamp = null;
-			}, RESUME_DELAY_MS);
-		};
-		container.addEventListener("mouseenter", pauseAnimation);
-		container.addEventListener("mouseleave", scheduleResumeAnimation);
-		container.addEventListener("touchstart", pauseAnimation);
-		container.addEventListener("touchend", scheduleResumeAnimation);
-		return function cleanup() {
-			if (scrollAnimationRef.current) cancelAnimationFrame(scrollAnimationRef.current);
-			container.removeEventListener("mouseenter", pauseAnimation);
-			container.removeEventListener("mouseleave", scheduleResumeAnimation);
-			container.removeEventListener("touchstart", pauseAnimation);
-			container.removeEventListener("touchend", scheduleResumeAnimation);
-			if (resumeTimeoutRef.current) clearTimeout(resumeTimeoutRef.current);
-		};
-	}, [
-		isAnimated,
-		reducedMotion,
-		PIXELS_PER_SECOND,
-		pauseOnHover,
-		scrollContainerRef
-	]);
-}
-
-//#endregion
-//#region src/SuggestionButtonContainer/SuggestionButtonContainer.tsx
-function ButtonContainer({ children }) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: "spiffy-tw-flex \n      spiffy-tw-flex-row\n      spiffy-tw-items-center\n      spiffy-tw-space-x-2\n      spiffy-tw-h-full\n      spiffy-tw-pl-0",
-		children
-	});
-}
-const SuggestionButtonContainer = ({ buttonVariation, hoverButtonVariation, buttonTexts, boldFirstButton = false, twoRowsOnMobile = false, animationSpeed = "none", buttonBorderRadius = "lg", scrollContainerRef, onButtonClick }) => {
-	const componentVisibleTriggerRef = (0, react.useRef)(null);
-	useHorizontalScrollAnimation({
-		scrollContainerRef,
-		animationSpeed
-	});
-	const isSmallScreen = (0, __envive_ai_react_hooks_hooks_IsSmallScreen.useIsSmallScreen)();
-	const isAnimated = animationSpeed !== "none";
-	(0, __envive_ai_react_hooks_hooks_TrackComponentVisibleEvent.useTrackComponentVisibleEvent)(__envive_ai_react_hooks_application_models.SpiffyWidgets.SuggestionBar, componentVisibleTriggerRef, { animated: isAnimated });
-	const visibleButtonsFirstRow = buttonTexts.slice(0, twoRowsOnMobile && isSmallScreen ? Math.ceil((buttonTexts.length + 1) / 2) : void 0);
-	const visibleButtonsSecondRow = buttonTexts.slice(Math.ceil((buttonTexts.length + 1) / 2), buttonTexts.length);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: "spiffy-tw-overflow-x-scroll spiffy-tw-no-scrollbar spiffy-tw-w-full spiffy-tw-whitespace-nowrap",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ButtonContainer, { children: [visibleButtonsFirstRow.map((suggestion, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__envive_ai_react_toolkit_SuggestionButton.SuggestionButton, {
-			variant: buttonVariation,
-			hoverVariant: hoverButtonVariation,
-			isDisabled: false,
-			content: suggestion,
-			boldText: boldFirstButton && i === 0,
-			borderRadius: buttonBorderRadius,
-			onClick: () => onButtonClick(suggestion),
-			dataTestId: __envive_ai_react_hooks_config.SUGGESTION_BAR_BUTTON_TESTID
-		}, i)), isAnimated && buttonTexts.map((suggestion, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__envive_ai_react_toolkit_SuggestionButton.SuggestionButton, {
-			variant: buttonVariation,
-			hoverVariant: hoverButtonVariation,
-			isDisabled: false,
-			content: suggestion,
-			boldText: boldFirstButton && i === 0,
-			borderRadius: buttonBorderRadius,
-			onClick: () => onButtonClick(suggestion),
-			dataTestId: __envive_ai_react_hooks_config.SUGGESTION_BAR_BUTTON_TESTID
-		}, `animation-dupe-${i}`))] }), twoRowsOnMobile && isSmallScreen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "spiffy-tw-mt-1.5",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ButtonContainer, { children: [visibleButtonsSecondRow.map((suggestion, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__envive_ai_react_toolkit_SuggestionButton.SuggestionButton, {
-				variant: buttonVariation,
-				hoverVariant: hoverButtonVariation,
-				isDisabled: false,
-				content: suggestion,
-				boldText: boldFirstButton && i === 0,
-				borderRadius: buttonBorderRadius,
-				onClick: () => onButtonClick(suggestion),
-				dataTestId: __envive_ai_react_hooks_config.SUGGESTION_BAR_BUTTON_TESTID
-			}, i)), isAnimated && visibleButtonsSecondRow.map((suggestion, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__envive_ai_react_toolkit_SuggestionButton.SuggestionButton, {
-				variant: buttonVariation,
-				hoverVariant: hoverButtonVariation,
-				isDisabled: false,
-				content: suggestion,
-				boldText: boldFirstButton && i === 0,
-				borderRadius: buttonBorderRadius,
-				onClick: () => onButtonClick(suggestion),
-				dataTestId: __envive_ai_react_hooks_config.SUGGESTION_BAR_BUTTON_TESTID
-			}, `animation-dupe-${i}`))] })
-		})]
-	});
-};
-
-//#endregion
-Object.defineProperty(exports, 'SuggestionButtonContainer', {
-  enumerable: true,
-  get: function () {
-    return SuggestionButtonContainer;
-  }
-});