@envive-ai/react-toolkit-v3 0.3.10 → 0.3.12

package/src/components/PromptCarousel/PromptCarousel.tsx

@@ -83,16 +83,20 @@ export const PromptCarousel = ({
       const buttonKey = `button-${buttonId}`;
 
       return (
-        <PromptButton
-          id={buttonId}
+        <div
           key={buttonKey}
-          label={text}
-          variant={promptButtonType}
-          theme={finalTheme}
-          isLoading={isLoading}
-          bold={boldFirstButton && index === 0 && duplicateIndex === 0}
-          onClick={() => handleButtonClick?.(text)}
-        />
+          className="envive-tw-flex-shrink-0"
+        >
+          <PromptButton
+            id={buttonId}
+            label={text}
+            variant={promptButtonType}
+            theme={finalTheme}
+            isLoading={isLoading}
+            bold={boldFirstButton && index === 0 && duplicateIndex === 0}
+            onClick={() => handleButtonClick?.(text)}
+          />
+        </div>
       );
     },
     [id, promptButtonType, boldFirstButton, handleButtonClick, isLoading, finalTheme],
@@ -127,36 +131,30 @@ export const PromptCarousel = ({
         gap="2"
       >
         <div
-          className="envive-tw-no-scrollbar envive-tw-relative envive-tw-w-full envive-tw-overflow-x-scroll"
           ref={setRef1}
-          style={{ cursor: 'grab', userSelect: 'none' }}
+          className="[&::-webkit-scrollbar]:hidden envive-tw-flex envive-tw-gap-2 envive-tw-overflow-x-auto"
+          style={{
+            scrollbarWidth: 'none',
+            msOverflowStyle: 'none',
+            cursor: 'grab',
+            userSelect: 'none',
+          }}
         >
-          <div className="envive-tw-relative envive-tw-inline-block envive-tw-whitespace-nowrap">
-            <Stack
-              direction="row"
-              gap="2"
-              className="envive-tw-pl-0 envive-tw-h-full envive-tw-items-center"
-            >
-              {renderButtonRow(visibleButtonsFirstRow, 0)}
-            </Stack>
-          </div>
+          {renderButtonRow(visibleButtonsFirstRow, 0)}
         </div>
 
         {shouldShowTwoRowsValue && (
           <div
-            className="envive-tw-no-scrollbar envive-tw-relative envive-tw-w-full envive-tw-overflow-x-scroll"
             ref={setRef2}
-            style={{ cursor: 'grab', userSelect: 'none' }}
+            className="[&::-webkit-scrollbar]:hidden envive-tw-flex envive-tw-gap-2 envive-tw-overflow-x-auto"
+            style={{
+              scrollbarWidth: 'none',
+              msOverflowStyle: 'none',
+              cursor: 'grab',
+              userSelect: 'none',
+            }}
           >
-            <div className="envive-tw-relative envive-tw-inline-block envive-tw-whitespace-nowrap">
-              <Stack
-                direction="row"
-                gap="2"
-                className="envive-tw-pl-0 envive-tw-h-full envive-tw-items-center"
-              >
-                {renderButtonRow(visibleButtonsSecondRow, visibleButtonsFirstRow.length)}
-              </Stack>
-            </div>
+            {renderButtonRow(visibleButtonsSecondRow, visibleButtonsFirstRow.length)}
           </div>
         )}
       </Stack>

package/src/components/SalesAgentProductCard/SalesAgentProductCard.tsx

@@ -29,6 +29,7 @@ export const SalesAgentProductCard = ({
   rate,
   image,
   url,
+  target,
   onClick,
 }: SalesAgentProductCardProps) => {
   const finalTheme = resolveTheme(theme);
@@ -42,6 +43,7 @@ export const SalesAgentProductCard = ({
       theme={finalTheme}
       variant={variant}
       url={url}
+      target={target}
       onClick={onClick}
       productName={
         <SalesAgentProductCardComponents.ProductName

package/src/components/SalesAgentProductCard/components/Container.tsx

@@ -1,10 +1,10 @@
 import classNames from 'classnames';
+import { Theme } from '../../../../tokens/theme/theme';
+import { Container as ContainerComponent } from '../../Container';
 import { Stack } from '../../Stack';
-import { SalesAgentProductCardVariant } from '../types/types';
 import { useGetContainerProperties } from '../hooks/useGetContainerProperties';
 import { useGetProductDescriptionProperties } from '../hooks/useGetProductDescriptionProperties';
-import { Container as ContainerComponent } from '../../Container';
-import { Theme } from '../../../../tokens/theme/theme';
+import { SalesAgentProductCardProps, SalesAgentProductCardVariant } from '../types/types';
 
 export type ContainerProps = {
   id?: string;
@@ -18,6 +18,7 @@ export type ContainerProps = {
   rate: React.ReactNode;
   image: React.ReactNode;
   url: string;
+  target?: SalesAgentProductCardProps['target'];
   onClick?: () => void | Promise<void>;
 };
 
@@ -33,6 +34,7 @@ export const Container = ({
   rate,
   image,
   url,
+  target = '_self',
   onClick,
 }: ContainerProps) => {
   const { baseClassName, themeContainerClassNames, containerDirection, containerWidthClassName } =
@@ -48,12 +50,17 @@ export const Container = ({
     variant,
   });
 
-  const anchorProps: React.AnchorHTMLAttributes<HTMLAnchorElement> = {
-    href: url,
-    onClick,
-    target: '_self',
-    draggable: false,
-  };
+  const anchorProps: React.AnchorHTMLAttributes<HTMLAnchorElement> =
+    target !== 'none'
+      ? {
+          href: url,
+          onClick,
+          target,
+          draggable: false,
+        }
+      : {
+          onClick,
+        };
 
   return (
     <ContainerComponent

package/src/components/SalesAgentProductCard/types/types.ts

@@ -71,6 +71,10 @@ export type SalesAgentProductCardProps = {
    * The URL to navigate to when the card is clicked.
    */
   url?: string;
+  /**
+   * The URL target to be applied.
+   */
+  target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'] | 'none';
   /**
    * Callback function called when the card is clicked.
    */

package/dist/ChatFooter/hooks/useGetButtonScrollProperties.cjs

@@ -1,18 +0,0 @@
-
-//#region src/components/ChatFooter/hooks/useGetButtonScrollProperties.ts
-const useGetButtonScrollProperties = () => {
-	return {
-		buttonScrollClasses: [
-			"envive-tw-overflow-x-scroll",
-			"envive-tw-overflow-y-hidden",
-			"[&::-webkit-scrollbar]:hidden"
-		],
-		buttonScrollStyle: {
-			scrollbarWidth: "none",
-			msOverflowStyle: "none"
-		}
-	};
-};
-
-//#endregion
-exports.useGetButtonScrollProperties = useGetButtonScrollProperties;

package/dist/ChatFooter/hooks/useGetButtonScrollProperties.js

@@ -1,17 +0,0 @@
-//#region src/components/ChatFooter/hooks/useGetButtonScrollProperties.ts
-const useGetButtonScrollProperties = () => {
-	return {
-		buttonScrollClasses: [
-			"envive-tw-overflow-x-scroll",
-			"envive-tw-overflow-y-hidden",
-			"[&::-webkit-scrollbar]:hidden"
-		],
-		buttonScrollStyle: {
-			scrollbarWidth: "none",
-			msOverflowStyle: "none"
-		}
-	};
-};
-
-//#endregion
-export { useGetButtonScrollProperties };