@envive-ai/react-hooks 0.3.3 → 0.3.5

package/src/contexts/types.ts

@@ -13,6 +13,7 @@ import { ChatState } from 'src/types/custservice-types';
 import { SuggestionBarLocationForMetrics } from 'src/types/suggestionBarV2-types';
 import { TestProps } from 'src/types/test-types';
 import { OrgConfigFeatureGate } from 'src/application/models/api/orgConfigResults';
+import { WidgetConfigV3 } from './typesV3';
 
 type ShowFloatingButtonOptions =
   | 'always'
@@ -389,7 +390,10 @@ interface SearchConfig {
   recommendedProductsHeading?: string;
 }
 
+type ConfigVersion = 'v3' | 'deprecated' | undefined;
+
 type OrgUIConfig = {
+  version?: ConfigVersion;
   shortName: string;
   id?: string;
   floatingEntrypointConfig?: FloatingEntryPointConfig;
@@ -475,8 +479,6 @@ type WrappingElement = {
 };
 
 enum PageVariantTestType {
-  ShopifyPLP = 'ShopifyPLP',
-  ShopifyPDP = 'ShopifyPDP',
   PageCategory = 'PageCategory',
   CatalogCategory = 'CatalogCategory',
   TopCatalogCategory = 'TopCatalogCategory',
@@ -493,6 +495,7 @@ enum PageVariantTestType {
   isProductComparison = 'isProductComparison',
   Fallback = 'Fallback',
   UrlResolver = 'UrlResolver',
+  isScreenWidthSmaller = 'isScreenWidthSmaller',
   Null = 'null',
 }
 
@@ -522,10 +525,6 @@ interface HasMerchantTagTest extends BasePageVariantTest<PageVariantTestType.Has
   merchantTags: string[];
 }
 
-interface ShopifyPLPURLTest extends BasePageVariantTest<PageVariantTestType.ShopifyPLP> {}
-
-interface ShopifyPDPURLTest extends BasePageVariantTest<PageVariantTestType.ShopifyPDP> {}
-
 interface PageCategoryTest extends BasePageVariantTest<PageVariantTestType.PageCategory> {
   extractor: CategoryExtractor;
 }
@@ -560,10 +559,12 @@ interface PageFallbackTest extends BasePageVariantTest<PageVariantTestType.Fallb
 
 interface UrlResolverTest extends BasePageVariantTest<PageVariantTestType.UrlResolver> {}
 
+interface IsScreenWidthSmallerTest extends BasePageVariantTest<PageVariantTestType.isScreenWidthSmaller> {
+  breakpoint: number;
+}
+
 export type PageVariantTest =
   | PageCategoryTest
-  | ShopifyPLPURLTest
-  | ShopifyPDPURLTest
   | CatalogCategoryTest
   | TopCatalogCategory
   | HasReviewsTest
@@ -578,7 +579,8 @@ export type PageVariantTest =
   | IsLoadingTest
   | IsProductComparison
   | PageFallbackTest
-  | UrlResolverTest;
+  | UrlResolverTest
+  | IsScreenWidthSmallerTest;
 
 /**
  * Configuration for the social proof embedded widget
@@ -660,15 +662,6 @@ enum WidgetType {
   NoOp = 'NoOp',
 }
 
-export enum WidgetTypeV3 {
-  SuggestionBarV3 = 'SuggestionBarV3',
-  ChatPreviewV3 = 'ChatPreviewV3',
-  SocialProofV3 = 'SocialProofV3',
-  ImagePromptCardV3 = 'ImagePromptCardV3',
-  ImageBannerV3 = 'ImageBannerV3',
-  SingleImagePromptV3 = 'SingleImagePromptV3',
-}
-
 type WidgetConfig =
   | ChatPreviewWidgetConfig
   | SocialProofV2WidgetConfig
@@ -911,7 +904,7 @@ export type OrgPageConfig = {
   // pageVariants is a list of page variants that we support.
   pageVariants: PageVariantConfig[];
   // widgetConfigs is a named set of widget configs
-  widgetConfigs: Record<string, WidgetConfig>;
+  widgetConfigs: Record<string, WidgetConfigV3>;
   mountingConfigs: Record<string, WidgetMountingConfig>;
 };
 
@@ -929,6 +922,7 @@ export interface EnviveConfig {
   contextSource?: string;
   orgLevelApiKey?: string;
   orgShortName?: string;
+  orgId?: string;
   identifyingPrefix?: string;
   featureOverrides?: Record<string, boolean>;
   variantUrlOverride?: string;
@@ -963,6 +957,8 @@ export type {
   ImagePromptWidgetConfig,
   InsertionPoint,
   MultiImageConfig,
+  MerchantVariantSettings,
+  SearchConfig,
   OrgUIConfig,
   PageCardConfig,
   PageCardVariant,

package/src/contexts/typesV3.ts

@@ -0,0 +1,348 @@
+import { AnimationSpeed, PromptCarouselRows } from '@envive-ai/react-toolkit-v3/PromptCarousel';
+import { ImageGalleryImage, ImageGalleryLayout } from '@envive-ai/react-toolkit-v3/ImageGallery';
+import { PromptButtonVariant } from '@envive-ai/react-toolkit-v3/PromptButton';
+import { WidgetWrapperVariant } from '@envive-ai/react-toolkit-v3/WidgetWrapper';
+import { Theme } from '@envive-ai/react-toolkit-v3/Tokens';
+import { DynamicLayout } from '@envive-ai/react-toolkit-v3/SocialProof';
+import { SparkleIconColor } from '@envive-ai/react-toolkit-v3/WelcomeMessage';
+import { ColorNames } from '../application/models/colorsConfigV3';
+import { CustomerServiceType } from '../types/customerService';
+import type { MerchantVariantSettings, SearchConfig } from './types';
+
+export enum LetterSpacingCSSVar {
+  Tight0 = 'envive-typography-letter-spacing-tight-0',
+  Wide1 = 'envive-typography-letter-spacing-wide-1',
+}
+
+export enum LineHeightCSSVar {
+  LineHeight124 = 'envive-typography-line-height-124',
+  LineHeight120 = 'envive-typography-line-height-120',
+  LineHeight118 = 'envive-typography-line-height-118',
+  LineHeight116 = 'envive-typography-line-height-116',
+  LineHeight114 = 'envive-typography-line-height-114',
+  LineHeight148 = 'envive-typography-line-height-148',
+  LineHeight140 = 'envive-typography-line-height-140',
+  LineHeight128 = 'envive-typography-line-height-128',
+  LineHeight130 = 'envive-typography-line-height-130',
+  LineHeight133 = 'envive-typography-line-height-133',
+}
+
+export enum FontWeightCSSVar {
+  RG = 'envive-typography-font-weight-rg',
+  MD = 'envive-typography-font-weight-md',
+  SB = 'envive-typography-font-weight-sb',
+}
+
+export enum FontSizeCSSVar {
+  T1 = 'envive-typography-font-size-t1',
+  T2 = 'envive-typography-font-size-t2',
+  T3 = 'envive-typography-font-size-t3',
+  H1 = 'envive-typography-font-size-h1',
+  H2 = 'envive-typography-font-size-h2',
+  H3 = 'envive-typography-font-size-h3',
+  B1 = 'envive-typography-font-size-b1',
+  B2 = 'envive-typography-font-size-b2',
+  B3 = 'envive-typography-font-size-b3',
+  B4 = 'envive-typography-font-size-b4',
+  B5 = 'envive-typography-font-size-b5',
+  L1 = 'envive-typography-font-size-l1',
+  L2 = 'envive-typography-font-size-l2',
+}
+
+export enum FontFamilyCSSVar {
+  Title = 'envive-typography-font-family-title',
+  Header = 'envive-typography-font-family-header',
+  Body = 'envive-typography-font-family-body',
+}
+
+export enum ThemeCSSVar {
+  GlobalCustom = 'envive-global-custom-theme',
+}
+
+export enum AspectRatioCSSVar {
+  GlobalCustom = 'envive-global-custom-aspect-ratio',
+}
+
+export enum BorderRadiusCSSVar {
+  GlobalCustom = 'envive-global-custom-border-radius',
+}
+
+export const enum ColorsNamesVars {
+  TextPrimary = `envive-colors-${ColorNames.TextPrimary}`,
+  TextSecondary = `envive-colors-${ColorNames.TextSecondary}`,
+  TextAccent = `envive-colors-${ColorNames.TextAccent}`,
+  TextLink = `envive-colors-${ColorNames.TextLink}`,
+  TextLight = `envive-colors-${ColorNames.TextLight}`,
+  BackgroundPrimary = `envive-colors-${ColorNames.BackgroundPrimary}`,
+  BackgroundSecondary = `envive-colors-${ColorNames.BackgroundSecondary}`,
+  BackgroundTertiary = `envive-colors-${ColorNames.BackgroundTertiary}`,
+  BackgroundDark = `envive-colors-${ColorNames.BackgroundDark}`,
+  BackgroundLight = `envive-colors-${ColorNames.BackgroundLight}`,
+  BorderLight = `envive-colors-${ColorNames.BorderLight}`,
+  BorderMedium = `envive-colors-${ColorNames.BorderMedium}`,
+  BorderDark = `envive-colors-${ColorNames.BorderDark}`,
+  AccentPrimary = `envive-colors-${ColorNames.AccentPrimary}`,
+  AccentSecondary = `envive-colors-${ColorNames.AccentSecondary}`,
+}
+
+export const enum ButtonColorsVars {
+  LightButtonBackgroundColor = 'envive-colors-button-light-background-color',
+  LightButtonIconColor = 'envive-colors-button-light-icon-color',
+  DarkButtonBackgroundColor = 'envive-colors-button-dark-background-color',
+  DarkButtonIconColor = 'envive-colors-button-dark-icon-color',
+}
+
+type ImageAspectRatio = '1/1' | '3/4';
+
+type ButtonColors = {
+  lightButtonBackgroundColor: string;
+  lightButtonIconColor: string;
+  darkButtonBackgroundColor: string;
+  darkButtonIconColor: string;
+};
+
+// TODO: Set default values for the typography configs
+type Typography = {
+  titleFontFamily: string;
+  headerFontFamily: string;
+  bodyFontFamily: string;
+
+  fontSize?: {
+    t1: string;
+    t2: string;
+    t3: string;
+    h1: string;
+    h2: string;
+    h3: string;
+    b1: string;
+    b2: string;
+    b3: string;
+    b4: string;
+    b5: string;
+    l1: string;
+    l2: string;
+  };
+
+  fontWeight?: {
+    rg: string;
+    md: string;
+    sb: string;
+  };
+
+  letterSpacing?: {
+    '0': string;
+    'wide-1': string;
+  };
+
+  lineHeight?: {
+    '124': number;
+    '120': number;
+    '118': number;
+    '116': number;
+    '114': number;
+    '148': number;
+    '140': number;
+    '128': number;
+    '130': number;
+    '133': number;
+  };
+};
+
+type LookAndFeelConfig = {
+  theme: Theme;
+  agentName: string;
+  chatHeaderLogoDarkSrc: string;
+  chatHeaderLogoLightSrc: string;
+  widgetLogoSrc: string;
+  hideWidgetLogo: boolean;
+  elementRadius: number;
+  imageAspectRatio: ImageAspectRatio;
+  buttonColors: ButtonColors;
+  typography: Typography;
+};
+
+export enum ConfigVersionEnum {
+  V3 = 'v3',
+  Deprecated = 'deprecated',
+}
+
+type ConfigVersion = ConfigVersionEnum.V3 | ConfigVersionEnum.Deprecated | undefined;
+
+type Mode = 'dark' | 'light';
+
+type Position = 'bottomLeft' | 'middleLeft' | 'middleRight' | 'bottomRight';
+
+type ShowOptions = 'always' | 'postInteraction' | 'none';
+
+type Style = 'attached' | 'detached';
+
+type FloatingButtonConfig = {
+  position: Position;
+  backgroundColor?: string;
+  mode: Mode;
+  showOption: ShowOptions;
+  iconSVGSrc?: string;
+  style: Style;
+};
+
+type FloatingChatConfig = {
+  headerBackgroundColor?: string;
+  headerMode: Mode;
+  welcomeMessageIconColor: SparkleIconColor;
+  showVerifiedBuyer: boolean;
+  userQueryInputEnabled: boolean;
+  showEnviveLogo: boolean;
+  ignoreFirstModelResponse?: boolean;
+  neverShowSingleProductCards?: boolean;
+  welcomeMessageTitle: string;
+  welcomeMessageText: string;
+  chatFooterTextFieldPlaceholderText: string;
+};
+
+type CustomerServiceIntegration = {
+  enabled: boolean;
+  provider: CustomerServiceType;
+  suppressMerchantButton?: boolean;
+};
+
+type OrgUIConfigV3 = {
+  id?: string;
+
+  version: ConfigVersion;
+
+  shortName: string;
+
+  lookAndFeel: LookAndFeelConfig;
+
+  floatingButton: FloatingButtonConfig;
+
+  floatingChat: FloatingChatConfig;
+
+  merchantOverrideCss?: string;
+
+  customerServiceIntegration?: CustomerServiceIntegration;
+
+  merchantVariantSettings?: MerchantVariantSettings;
+
+  searchConfig?: SearchConfig;
+};
+
+export enum WidgetTypeV3 {
+  PromptCarouselV3 = 'PromptCarouselV3',
+  TitledPromptCarouselV3 = 'TitledPromptCarouselV3',
+  SocialProofV3 = 'SocialProofV3',
+  TypingAnimationV3 = 'TypingAnimationV3',
+  ChatPreviewV3 = 'ChatPreviewV3',
+  ChatPreviewComparisonV3 = 'ChatPreviewComparisonV3',
+  ChatPreviewLoadingV3 = 'ChatPreviewLoadingV3',
+  ImagePromptCardV3 = 'ImagePromptCardV3',
+  PromptButtonCarouselWithImageV3 = 'PromptButtonCarouselWithImageV3',
+  ImageBannerV3 = 'ImageBannerV3',
+  SingleImagePromptV3 = 'SingleImagePromptV3',
+  FloatingChatV3 = 'FloatingChatV3',
+  FloatingButtonV3 = 'FloatingButtonV3',
+}
+
+interface BaseWidgetConfig<T extends WidgetTypeV3> {
+  widgetConfigId: string;
+  type: T;
+  contentId?: string; // Widget ID
+}
+
+interface PromptCarouselWidgetV3Config extends BaseWidgetConfig<WidgetTypeV3.PromptCarouselV3> {
+  promptButtonType?: PromptButtonVariant;
+  boldFirstButton?: boolean;
+  promptCarouselRows?: PromptCarouselRows;
+  animationSpeed?: AnimationSpeed;
+}
+
+interface TitledPromptCarouselWidgetV3Config extends BaseWidgetConfig<WidgetTypeV3.TitledPromptCarouselV3> {
+  promptButtonType?: PromptButtonVariant;
+  boldFirstButton?: boolean;
+  promptCarouselRows?: PromptCarouselRows;
+  animationSpeed?: AnimationSpeed;
+}
+
+enum SocialProofWidgetKind {
+  STATIC = 'static',
+  DYNAMIC = 'dynamic',
+}
+interface SocialProofWidgetV3Config extends BaseWidgetConfig<WidgetTypeV3.SocialProofV3> {
+  kind: SocialProofWidgetKind;
+  variant: WidgetWrapperVariant;
+  hexCardColor?: string;
+  promptCarouselRows: PromptCarouselRows;
+  hideImage?: boolean;
+  imageGalleryLayout: Exclude<ImageGalleryLayout, 'TWO_SIDE'>;
+  hideTextField?: boolean;
+  primaryButtonVariant: Exclude<PromptButtonVariant, 'suggestedResponse' | 'ghost'>;
+  secondaryButtonVariant: Exclude<PromptButtonVariant, 'suggestedResponse' | 'ghost'>;
+  dynamicLayout?: DynamicLayout;
+  images?: ImageGalleryImage[];
+}
+
+interface TypingAnimationWidgetV3Config extends BaseWidgetConfig<WidgetTypeV3.TypingAnimationV3> {
+  widgetVariant?: WidgetWrapperVariant;
+  cardColor?: string;
+  promptButtonType?: PromptButtonVariant;
+  promptCarouselRows?: PromptCarouselRows;
+  showTextField?: boolean;
+}
+
+interface ChatPreviewComparisonWidgetV3Config extends BaseWidgetConfig<WidgetTypeV3.ChatPreviewComparisonV3> {
+  variant: WidgetWrapperVariant;
+  hexCardColor?: string;
+  hideImage?: boolean;
+  hideTextField?: boolean;
+}
+
+interface ChatPreviewLoadingWidgetV3Config extends BaseWidgetConfig<WidgetTypeV3.ChatPreviewLoadingV3> {
+  variant: WidgetWrapperVariant;
+  hexCardColor?: string;
+  hideTextField?: boolean;
+}
+
+interface ChatPreviewWidgetV3Config extends BaseWidgetConfig<WidgetTypeV3.ChatPreviewV3> {
+  variant: WidgetWrapperVariant;
+  hexCardColor?: string;
+  hideTextField?: boolean;
+}
+
+interface PromptButtonCarouselWithImageWidgetV3Config extends BaseWidgetConfig<WidgetTypeV3.PromptButtonCarouselWithImageV3> {
+  promptButtonType?: PromptButtonVariant;
+  image?: ImageGalleryImage;
+  hideTextField?: boolean;
+}
+
+interface FloatingChatWidgetV3Config extends BaseWidgetConfig<WidgetTypeV3.FloatingChatV3> {}
+
+type WidgetConfigV3 =
+  | PromptCarouselWidgetV3Config
+  | SocialProofWidgetV3Config
+  | TitledPromptCarouselWidgetV3Config
+  | ChatPreviewComparisonWidgetV3Config
+  | ChatPreviewLoadingWidgetV3Config
+  | TypingAnimationWidgetV3Config
+  | ChatPreviewWidgetV3Config
+  | PromptButtonCarouselWithImageWidgetV3Config
+  | FloatingChatWidgetV3Config;
+
+export type {
+  OrgUIConfigV3,
+  WidgetConfigV3,
+  LookAndFeelConfig,
+  SocialProofWidgetV3Config,
+  PromptCarouselWidgetV3Config,
+  ChatPreviewComparisonWidgetV3Config,
+  ChatPreviewLoadingWidgetV3Config,
+  ChatPreviewWidgetV3Config,
+  TitledPromptCarouselWidgetV3Config,
+  TypingAnimationWidgetV3Config,
+  PromptButtonCarouselWithImageWidgetV3Config,
+  FloatingChatWidgetV3Config,
+  FloatingChatConfig,
+  CustomerServiceIntegration,
+  Position,
+};
+
+export { SocialProofWidgetKind };