@envive-ai/react-hooks 0.1.0

package/src/merchants/skinPerfection/skinPerfection.ts

@@ -0,0 +1,379 @@
+import {
+  CHAT_PREVIEW_TESTID,
+  TOP_SUGGESTION_BAR_TESTID,
+} from "src/config/locators";
+import { OrgShortName, BasicOrgInfoType } from "src/application/models";
+import { ChatElementDisplayLocation } from "src/application/models/chatElementDisplayLocation";
+import { CdnService } from "src/application/service/cdnService";
+import { DOMInsertionType } from "src/application/service/domMutations/domInsertionService";
+import {
+  CHAT_PREVIEW_CONTAINER_ID,
+  TOP_SUGGESTION_BAR_PDP_ID,
+} from "src/config/divIds";
+import { SuggestionBarLocationForMetrics } from "src/types/suggestionBarV2-types";
+import { defaultOrgUIConfig } from "src/merchants/default";
+import {
+  ChatPreviewWidgetConfig,
+  ColorMapping,
+  ColorNames,
+  OrgPageConfig,
+  OrgUIConfig,
+  PageVariantTestType,
+  SuggestionBarWidgetV2Config,
+  WidgetType,
+} from "src/contexts/types";
+import { GridInsertionType } from "src/application/service/domMutations/GridInsertionService";
+
+const skinPerfectionColors: ColorMapping = {
+  [ColorNames.TextPrimary]: "#121212",
+  [ColorNames.TextSecondary]: "#121212",
+  [ColorNames.TextAccent]: "#99CC02",
+  [ColorNames.TextLink]: "#0B8396",
+  [ColorNames.TextLight]: "#FFFFFF",
+  [ColorNames.BackgroundPrimary]: "#0B8396",
+  [ColorNames.BackgroundSecondary]: "#E9E9E9",
+  [ColorNames.BackgroundSecondaryDark]: "#ECEAE6",
+  [ColorNames.BackgroundTertiary]: "#F8F9FA",
+  [ColorNames.BackgroundDark]: "#121212",
+  [ColorNames.BackgroundLight]: "#FFFFFF",
+  [ColorNames.BackgroundSaturated]: "#CCCCCC",
+  [ColorNames.BorderLight]: "#EEEEEE",
+  [ColorNames.BorderMedium]: "#E9E9E9",
+  [ColorNames.BorderDark]: "#121212",
+  [ColorNames.BorderOutline]: "#0B8396",
+  [ColorNames.AccentPrimary]: "#0B8396",
+  [ColorNames.AccentSecondary]: "#F5F5F5",
+};
+const skinPerfectionOrgUIConfig = (): OrgUIConfig => {
+  const defaultSkinPerfectionOrgConfig = defaultOrgUIConfig(
+    OrgShortName.SkinPerfection
+  );
+
+  return {
+    ...defaultSkinPerfectionOrgConfig,
+    chatMessageConfig: {
+      ...defaultSkinPerfectionOrgConfig.chatMessageConfig,
+      assistantChatTitle: "Skin Perfection AI",
+      productLink: {
+        ...(defaultSkinPerfectionOrgConfig.chatMessageConfig?.productLink ||
+          {}),
+        iconVariant: "backgroundPrimary",
+        variant: "textLink",
+      },
+    },
+    chatHeader: {
+      ...defaultSkinPerfectionOrgConfig.chatHeader,
+      imageSrc: CdnService.getAssetURL(
+        "skin-perfection-logo.svg",
+        OrgShortName.SkinPerfection
+      ),
+      collapsedColor: skinPerfectionColors[ColorNames.AccentPrimary],
+      expandedColor: skinPerfectionColors[ColorNames.AccentPrimary],
+      chevronColor: skinPerfectionColors[ColorNames.TextLight],
+      customerSupportSwitchConfig: {
+        variant: "attached",
+        borderColor: skinPerfectionColors[ColorNames.AccentPrimary],
+        selectedTextColor: skinPerfectionColors[ColorNames.TextLight],
+        backgroundColor: skinPerfectionColors[ColorNames.AccentPrimary],
+        unselectedTextColor: skinPerfectionColors[ColorNames.TextLight],
+        supportTitle: "Live Support",
+        spiffyTitle: "Shop with AI",
+        spiffyTitleHasLogo: false,
+      },
+    },
+    chatPreviewConfig: {
+      ...defaultSkinPerfectionOrgConfig.chatPreviewConfig!,
+      buttonBackgroundColor:
+        skinPerfectionColors[ColorNames.BackgroundSecondary],
+      buttonTextColor: skinPerfectionColors[ColorNames.TextLink],
+      iconFillColor: skinPerfectionColors[ColorNames.TextLink],
+      headerConfig: {
+        ...defaultSkinPerfectionOrgConfig.chatPreviewConfig!.headerConfig,
+        title: "Skin Perfection Assistant",
+        imageSrc: CdnService.getAssetURL(
+          "skin-perfection-logo.svg",
+          OrgShortName.SkinPerfection
+        ),
+      },
+      footerConfig: {
+        ...defaultSkinPerfectionOrgConfig.chatPreviewConfig!.footerConfig,
+      },
+    },
+    floatingEntrypointConfig: {
+      ...defaultSkinPerfectionOrgConfig.floatingEntrypointConfig!,
+      showOption: "always",
+      expandedColor: skinPerfectionColors[ColorNames.BackgroundDark],
+      expansionText: {
+        plp: "Need help perfecting your routine?",
+        pdp: "Will this complete your routine?",
+      },
+    },
+    productCardConfig: {
+      ...defaultSkinPerfectionOrgConfig.productCardConfig!,
+    },
+    pageCardConfig: {
+      ...defaultSkinPerfectionOrgConfig.pageCardConfig!,
+    },
+    productReviewConfig: {
+      ...defaultSkinPerfectionOrgConfig.productReviewConfig!,
+      colorVariant: "brand",
+      styleVariant: "standard",
+    },
+    welcomeSectionConfig: {
+      ...defaultSkinPerfectionOrgConfig.welcomeSectionConfig!,
+      title: "Welcome to Skin Perfection AI!",
+      subtitle:
+        "Hi! I'm Lumi, your Skin Perfection personal skincare guide, here to answer your questions about how to use our innovative, natural products. Just tell me your skin type and goals, and I'll help you find your next perfect, anti-aging solutions.",
+      variant: "standard",
+      colorVariant: "accent",
+      iconName: "sparkles",
+    },
+    floatingChatConfig: {
+      ...defaultSkinPerfectionOrgConfig.floatingChatConfig,
+      suggestionButtonConfig: {
+        variant: "secondary",
+        hoverVariant: "dark",
+        answerVariant: "outlined",
+      },
+      replyInputConfig: {
+        size: "md",
+        sendIcon: "send",
+      },
+    },
+    merchantOverrideCss: `
+      /* Suggestion bar icon colors - override Tailwind classes */
+      .spiffy-suggestion-bar button svg,
+      .spiffy-suggestion-bar button path {
+        fill: var(--spiffy-colors-accent-primary) !important;
+        stroke: var(--spiffy-colors-accent-primary) !important;
+      }
+      
+      /* Target the specific Tailwind classes used by the dark variant */
+      .spiffy-tw-fill-\\[--spiffy-colors-text-light\\] {
+        fill: var(--spiffy-colors-accent-primary) !important;
+      }
+      
+      .spiffy-tw-stroke-\\[--spiffy-colors-text-light\\] {
+        stroke: var(--spiffy-colors-accent-primary) !important;
+      }
+      
+      /* Chat preview icon colors for PLP and PDP */
+      .spiffy-chat-preview button svg,
+      .spiffy-chat-preview button path,
+      .spiffy-social-proof-content-button button svg,
+      .spiffy-social-proof-content-button button path {
+        fill: var(--spiffy-colors-accent-primary) !important;
+        stroke: var(--spiffy-colors-accent-primary) !important;
+      }
+      
+      /* Chat preview button hover states */
+      .spiffy-chat-preview button:hover svg,
+      .spiffy-chat-preview button:hover path,
+      .spiffy-social-proof-content-button button:hover svg,
+      .spiffy-social-proof-content-button button:hover path {
+        fill: var(--spiffy-colors-accent-primary) !important;
+        stroke: var(--spiffy-colors-accent-primary) !important;
+      }
+      
+      /* Chat preview customer count text color */
+      .spiffy-social-proof-customer-count,
+      .spiffy-social-proof-content-container .spiffy-tw-text-\\[--spiffy-colors-text-accent\\] {
+        color: var(--spiffy-colors-text-accent) !important;
+      }
+         /* Product link icon custom styling - force teal background with white arrow */
+      .spiffy-product-link-icon-container {
+        background-color: #0B8396 !important;
+      }
+      
+      .spiffy-product-link-icon {
+        fill: #FFFFFF !important;
+      }
+      
+      /* Override any existing background and fill classes */
+      .spiffy-product-link-icon-container.spiffy-tw-bg-\\[--spiffy-colors-background-primary\\],
+      .spiffy-product-link-icon-container.spiffy-tw-bg-\\[--spiffy-colors-text-accent\\],
+      .spiffy-product-link-icon-container.spiffy-tw-bg-\\[--spiffy-colors-accent-primary\\] {
+        background-color: #0B8396 !important;
+      }
+      
+      .spiffy-product-link-icon-container .spiffy-tw-fill-\\[--spiffy-colors-text-light\\],
+      .spiffy-product-link-icon-container .spiffy-tw-fill-\\[var\\(--spiffy-colors-text-light\\)\\] {
+        fill: #FFFFFF !important;
+      }
+    `,
+  };
+};
+
+const skinPerfectionPageConfig = (): OrgPageConfig => ({
+  pageVariants: [
+    {
+      variantId: "plp",
+      variantType: "plp",
+      variantTests: [{ testType: PageVariantTestType.UrlResolver }],
+      plpIdExtractor: "url-resolver-plp-id",
+      widgetMounting: [
+        {
+          mountingConfigId: "chatPreviewPLP",
+          widgetConfigId: "chatPreviewPLP",
+        },
+      ],
+    },
+    {
+      variantId: "pdp",
+      variantType: "pdp",
+      variantTests: [{ testType: PageVariantTestType.UrlResolver }],
+      productIdExtractor: "url-resolver-product-id",
+      widgetMounting: [
+        {
+          mountingConfigId: "topSuggestionBarPDP",
+          widgetConfigId: "topSuggestionBar",
+        },
+        {
+          mountingConfigId: "chatPreviewPDP",
+          widgetConfigId: "chatPreviewPDP",
+        },
+      ],
+    },
+  ],
+  widgetConfigs: {
+    topSuggestionBar: {
+      buttonBorderRadius: "md",
+      type: WidgetType.SuggestionBarV2,
+      widgetConfigId: "topSuggestionBar",
+      contentId: "spiffy-top-suggestion-bar-contents",
+      metricDisplayLocation: ChatElementDisplayLocation.TOP_REVIEWS_SNIPPET,
+      location: SuggestionBarLocationForMetrics.SUGGESTION_BAR_TOP,
+      variant: "dark",
+      hoverVariant: "secondaryDark",
+      buttonTexts: {
+        default: [
+          "Summarize the reviews",
+          "What results have others seen?",
+          "How do I use this?",
+          "How does it feel on the skin?",
+          "Which skin type is this ideal for?",
+        ],
+      },
+    } satisfies SuggestionBarWidgetV2Config,
+    chatPreviewPLP: {
+      widgetConfigId: "chatPreviewPLP",
+      type: WidgetType.ChatPreview,
+      variant: "filled",
+      addSeparators: true,
+      socialProofConfig: {
+        staticPLPImagesLayout: "grid",
+        logoName: "skin-perfection-logo.svg",
+        customerQuery: "asked which products target wrinkles?",
+        headerTitle: "Skin Perfection Assistant",
+        suggestionButtonStrings: [
+          "How will this improve my skin?",
+          "What's best for fine lines?",
+          "What's gentle for beginners?",
+          "What's popular with other customers?",
+          "What will help to brighten my skin?",
+          "How can I boost collagen production?",
+        ],
+        staticPLPImageNames: [
+          "plp-image1.png",
+          "plp-image2.png",
+          "plp-image3.png",
+          "plp-image4.png",
+        ],
+        suggestionButtonVariantDefault: "secondary",
+        suggestionButtonVariantAccent: "dark",
+        userQueryButtonConfig: {
+          placeholderText: "Need help with your routine?",
+          icon: "magnifyingGlass",
+        },
+      },
+    } satisfies ChatPreviewWidgetConfig,
+    chatPreviewPDP: {
+      widgetConfigId: "chatPreviewPDP",
+      type: WidgetType.ChatPreview,
+      variant: "filled",
+      addSeparators: true,
+      socialProofConfig: {
+        staticPLPImagesLayout: "horizontal",
+        logoName: "skin-perfection-logo.svg",
+        customerQuery: "asked how will this improve my skin?",
+        headerTitle: "Skin Perfection Assistant",
+        suggestionButtonStrings: [
+          "What are others saying?",
+          "What are the key ingredients?",
+          "What skin types is this suitable for?",
+          "What results might I see?",
+          "How do I use this?",
+          "Does it mix and match with other products?",
+        ],
+        staticPLPImageNames: ["plp-image1.png"],
+        suggestionButtonVariantDefault: "secondary",
+        suggestionButtonVariantAccent: "dark",
+        userQueryButtonConfig: {
+          placeholderText: "Ask me anything",
+          icon: "send",
+        },
+      },
+    } satisfies ChatPreviewWidgetConfig,
+  },
+  mountingConfigs: {
+    chatPreviewPLP: {
+      mountingConfigId: "chatPreviewPLP",
+      containerId: CHAT_PREVIEW_CONTAINER_ID,
+      testId: CHAT_PREVIEW_TESTID,
+      insertionPoint: {
+        selector: ".product-list",
+        insertionType: DOMInsertionType.AFTER,
+      },
+      gridInsertionType: GridInsertionType.FIXED_3,
+      style: {
+        width: "100%",
+        maxWidth: "100%",
+        justifyItems: "start",
+        alignItems: "start",
+        textAlign: "left",
+      },
+    },
+    chatPreviewPDP: {
+      mountingConfigId: "chatPreviewPDP",
+      containerId: CHAT_PREVIEW_CONTAINER_ID,
+      testId: CHAT_PREVIEW_TESTID,
+      insertionPoint: {
+        selector: ".accordion-item",
+        insertionType: DOMInsertionType.BEFORE,
+      },
+      style: {
+        marginBottom: "16px",
+      },
+    },
+    topSuggestionBarPDP: {
+      mountingConfigId: "topSuggestionBarPDP",
+      containerId: TOP_SUGGESTION_BAR_PDP_ID,
+      testId: TOP_SUGGESTION_BAR_TESTID,
+      insertionPoint: {
+        selector: ".product-price",
+        insertionType: DOMInsertionType.AFTER,
+      },
+      style: {
+        marginBottom: "16px",
+      },
+    },
+  },
+});
+
+const skinPerfectionOrgInfo = {
+  shortName: OrgShortName.SkinPerfection,
+  name: "Skin Perfection AI",
+  domain: "naturalorganicskincare.com",
+  defaultProductId: "bioderma-sensibio-foaming-gel",
+  alwaysEnabledMerchants: true,
+  orgUIConfig: skinPerfectionOrgUIConfig,
+  orgColors: () => skinPerfectionColors,
+  orgPageConfig: skinPerfectionPageConfig,
+} satisfies BasicOrgInfoType;
+
+export {
+  skinPerfectionOrgInfo,
+  skinPerfectionOrgUIConfig,
+  skinPerfectionColors,
+  skinPerfectionPageConfig,
+};

package/src/merchants/snapSupplements/snapSupplements.ts

@@ -0,0 +1,325 @@
+import {
+  CHAT_PREVIEW_TESTID,
+  TOP_SUGGESTION_BAR_TESTID,
+} from "src/config/locators";
+import { OrgShortName, BasicOrgInfoType } from "src/application/models";
+import { ChatElementDisplayLocation } from "src/application/models/chatElementDisplayLocation";
+import { CdnService } from "src/application/service/cdnService";
+import { GridInsertionType } from "src/application/service/domMutations/GridInsertionService";
+import { DOMInsertionType } from "src/application/service/domMutations/domInsertionService";
+import {
+  CHAT_PREVIEW_CONTAINER_ID,
+  TOP_SUGGESTION_BAR_PDP_ID,
+} from "src/config/divIds";
+import { SuggestionBarLocationForMetrics } from "src/types/suggestionBarV2-types";
+import {
+  ChatPreviewWidgetConfig,
+  ColorMapping,
+  ColorNames,
+  colorVar,
+  OrgPageConfig,
+  OrgUIConfig,
+  PageVariantTestType,
+  SuggestionBarWidgetV2Config,
+  WidgetType,
+} from "src/contexts/types";
+import { defaultOrgUIConfig } from "src/merchants/default";
+
+const snapSupplementsColors: ColorMapping = {
+  [ColorNames.TextPrimary]: "#333",
+  [ColorNames.TextSecondary]: "#333",
+  [ColorNames.TextAccent]: "#346739",
+  [ColorNames.TextLink]: "#333",
+  [ColorNames.TextLight]: "#FFF",
+  [ColorNames.BackgroundPrimary]: "#17311B",
+  [ColorNames.BackgroundSecondary]: "#EFEFE9",
+  [ColorNames.BackgroundSecondaryDark]: "#E3E3DD",
+  [ColorNames.BackgroundTertiary]: "#CCDBBB",
+  [ColorNames.BackgroundDark]: "#333",
+  [ColorNames.BackgroundLight]: "#FFF",
+  [ColorNames.BackgroundSaturated]: "#CCCCCC",
+  [ColorNames.BorderLight]: "#EFEFE9",
+  [ColorNames.BorderMedium]: "#CCDBBB",
+  [ColorNames.BorderDark]: "#333",
+  [ColorNames.BorderOutline]: "#333",
+  [ColorNames.AccentPrimary]: "#346739",
+  [ColorNames.AccentSecondary]: "#CCDBBB",
+};
+
+const snapSupplementsOrgUIConfig = (): OrgUIConfig => {
+  const defaultSnapSupplementsOrgConfig = defaultOrgUIConfig(
+    OrgShortName.SnapSupplements
+  );
+
+  return {
+    ...defaultSnapSupplementsOrgConfig,
+    chatMessageConfig: {
+      ...defaultSnapSupplementsOrgConfig.chatMessageConfig,
+      assistantChatTitle: "SNAP Assistant",
+    },
+    chatHeader: {
+      ...defaultSnapSupplementsOrgConfig.chatHeader,
+      imageSrc: CdnService.getAssetURL(
+        "snap-logo2.png",
+        OrgShortName.SnapSupplements
+      ),
+    },
+    chatPreviewConfig: {
+      ...defaultSnapSupplementsOrgConfig.chatPreviewConfig!,
+      headerConfig: {
+        ...defaultSnapSupplementsOrgConfig.chatPreviewConfig!.headerConfig,
+      },
+      footerConfig: {
+        ...defaultSnapSupplementsOrgConfig.chatPreviewConfig!.footerConfig,
+      },
+    },
+    floatingEntrypointConfig: {
+      ...defaultSnapSupplementsOrgConfig.floatingEntrypointConfig!,
+      showOption: "always",
+      expansionText: {
+        plp: "Need clean nutrition help?",
+        pdp: "How will this enhance your wellness?",
+      },
+      expandedColor: colorVar(ColorNames.BackgroundDark),
+    },
+    productCardConfig: {
+      ...defaultSnapSupplementsOrgConfig.productCardConfig!,
+    },
+    pageCardConfig: {
+      ...defaultSnapSupplementsOrgConfig.pageCardConfig!,
+      variant: "filled",
+    },
+    productReviewConfig: {
+      ...defaultSnapSupplementsOrgConfig.productReviewConfig!,
+      colorVariant: "brand",
+    },
+    welcomeSectionConfig: {
+      ...defaultSnapSupplementsOrgConfig.welcomeSectionConfig!,
+      title: "Welcome to SNAP AI!",
+      subtitle:
+        "Hi there! I'm Sarah, your SNAP Supplements guide—here to make personalized recommendations so you can achieve your wellness goals. What can I help you support today?",
+      colorVariant: "accent",
+    },
+    merchantOverrideCss: `
+		.spiffy-chat-header-container > div > div > img {
+			height: 56px !important;
+		}
+
+		.spiffy-chat-preview-footer-container > div > div > div > button {
+			border: 1px solid var(--spiffy-colors-background-secondary-dark) !important;
+		}
+
+		.spiffy-social-proof-content-button > button:hover {
+			background: var(--spiffy-colors-background-secondary-dark) !important;
+			color: var(--spiffy-colors-text-primary) !important;
+		}
+		.spiffy-social-proof-content-button > button:hover > svg {
+			fill: var(--spiffy-colors-accent-primary) !important;
+			stroke: var(--spiffy-colors-accent-primary) !important;
+		}
+
+		/* Suggestion buttons in chat */
+		.spiffy-modal-sheet-content button.spiffy-button-base-button[data-testid="spiffy-suggestion-button"] {
+			background: var(--spiffy-colors-background-secondary) !important;
+			border: 1px solid var(--spiffy-colors-background-secondary-dark) !important;
+		}
+		.spiffy-modal-sheet-content button.spiffy-button-base-button[data-testid="spiffy-suggestion-button"]:hover {
+			color: var(--spiffy-colors-text-primary) !important;
+			background: var(--spiffy-colors-background-secondary-dark) !important;
+		}
+		.spiffy-modal-sheet-content button.spiffy-button-base-button[data-testid="spiffy-suggestion-button"]:hover > svg {
+			fill: var(--spiffy-colors-accent-primary) !important;
+			stroke: var(--spiffy-colors-accent-primary) !important;
+		}
+
+		:root {
+			--chat-preview-pdp-max-width: 1020px;
+			--chat-preview-plp-max-width: 958px;
+		}
+		@media (max-width: 1439px) {
+			:root {
+				--chat-preview-plp-max-width: 728px;
+			}
+		}
+		@media (max-width: 1023px) {
+			:root {
+				--chat-preview-pdp-max-width: 720px;
+				--chat-preview-plp-max-width: 704px;
+			}
+		}
+    `,
+  };
+};
+
+const snapSupplementsPageConfig = (): OrgPageConfig => ({
+  pageVariants: [
+    {
+      variantId: "plp",
+      variantType: "plp",
+      variantTests: [{ testType: PageVariantTestType.UrlResolver }],
+      plpIdExtractor: "url-resolver-plp-id",
+      widgetMounting: [
+        {
+          mountingConfigId: "chatPreviewPLP",
+          widgetConfigId: "chatPreviewPLP",
+        },
+      ],
+    },
+    {
+      variantId: "pdp",
+      variantType: "pdp",
+      variantTests: [{ testType: PageVariantTestType.UrlResolver }],
+      productIdExtractor: "url-resolver-product-id",
+      widgetMounting: [
+        {
+          mountingConfigId: "topSuggestionBarPDP",
+          widgetConfigId: "topSuggestionBar",
+        },
+        {
+          mountingConfigId: "chatPreviewPDP",
+          widgetConfigId: "chatPreviewPDP",
+        },
+      ],
+    },
+  ],
+  widgetConfigs: {
+    topSuggestionBar: {
+      type: WidgetType.SuggestionBarV2,
+      widgetConfigId: "topSuggestionsBar",
+      contentId: "spiffy-top-suggestion-bar-contents",
+      metricDisplayLocation: ChatElementDisplayLocation.TOP_REVIEWS_SNIPPET,
+      location: SuggestionBarLocationForMetrics.SUGGESTION_BAR_TOP,
+      variant: "darkPrimary",
+      hoverVariant: "secondaryAccent",
+      buttonBorderRadius: "md",
+      buttonTexts: {
+        default: [
+          "Summarize the reviews",
+          "What are the main benefits?",
+          "What do customers say about results?",
+          "How do I take this?",
+          "How will this support my health goals?",
+        ],
+      },
+      animationSpeed: "standard",
+    } satisfies SuggestionBarWidgetV2Config,
+    chatPreviewPLP: {
+      widgetConfigId: "chatPreviewPLP",
+      type: WidgetType.ChatPreview,
+      variant: "filled",
+      addSeparators: false,
+      socialProofConfig: {
+        staticPLPImagesLayout: "grid",
+        logoName: "snap-logo1.png",
+        customerQuery: 'asked "what are the main benefits?"',
+        headerTitle: "Shopping Assistant",
+        suggestionButtonStrings: [
+          "What are reviewers saying?",
+          "What boosts energy levels?",
+          "Which products support prostate health?",
+          "What’s good for cardio support?",
+          "How can I support my digestive health?",
+          "What helps with blood sugar?",
+        ],
+        staticPLPImageNames: [
+          "plp-image1.png",
+          "plp-image2.png",
+          "plp-image3.png",
+          "plp-image4.png",
+        ],
+        suggestionButtonVariantDefault: "secondary",
+        suggestionButtonVariantAccent: "primary",
+        userQueryButtonConfig: {
+          placeholderText: "Ask me anything",
+          icon: "magnifyingGlass",
+        },
+      },
+    } satisfies ChatPreviewWidgetConfig,
+    chatPreviewPDP: {
+      widgetConfigId: "chatPreviewPDP",
+      type: WidgetType.ChatPreview,
+      variant: "filled",
+      addSeparators: false,
+      socialProofConfig: {
+        staticPLPImagesLayout: "horizontal",
+        logoName: "snap-logo1.png",
+        customerQuery: 'asked "what results did others see?"',
+        headerTitle: "Shopping Assistant",
+        suggestionButtonStrings: [
+          "What are reviewers saying?",
+          "What benefits should I expect?",
+          "How should I use this?",
+          "Is this right for me?",
+          "What are the active ingredients?",
+        ],
+        staticImageIndex: 0,
+        suggestionButtonVariantDefault: "secondary",
+        suggestionButtonVariantAccent: "primary",
+        userQueryButtonConfig: {
+          placeholderText: "Ask me anything",
+          icon: "send",
+        },
+      },
+    } satisfies ChatPreviewWidgetConfig,
+  },
+  mountingConfigs: {
+    chatPreviewPLP: {
+      mountingConfigId: "chatPreviewPLP",
+      containerId: CHAT_PREVIEW_CONTAINER_ID,
+      testId: CHAT_PREVIEW_TESTID,
+      insertionPoint: {
+        selector: ".shop-product-items",
+        insertionType: DOMInsertionType.AFTER,
+      },
+      gridInsertionType: GridInsertionType.FIXED_3,
+      style: {
+        maxWidth: "var(--chat-preview-plp-max-width, 958px)",
+        minWidth: "98%",
+        marginLeft: "9px",
+      },
+    },
+    chatPreviewPDP: {
+      mountingConfigId: "chatPreviewPDP",
+      containerId: CHAT_PREVIEW_CONTAINER_ID,
+      testId: CHAT_PREVIEW_TESTID,
+      insertionPoint: {
+        selector: "#productMainSection",
+        insertionType: DOMInsertionType.AFTER,
+      },
+      style: {
+        maxWidth: "var(--chat-preview-pdp-max-width, 1020px)",
+        margin: "0px auto 10px auto",
+      },
+    },
+    topSuggestionBarPDP: {
+      mountingConfigId: "topSuggestionBarPDP",
+      containerId: TOP_SUGGESTION_BAR_PDP_ID,
+      testId: TOP_SUGGESTION_BAR_TESTID,
+      insertionPoint: {
+        selector: ".product__catchline",
+        insertionType: DOMInsertionType.AFTER,
+      },
+      style: {
+        marginTop: "12px",
+      },
+    },
+  },
+});
+
+const snapSupplementsOrgInfo = {
+  shortName: OrgShortName.SnapSupplements,
+  name: "SNAP Assistant",
+  domain: "snapsupplements.com",
+  defaultProductId: "",
+  alwaysEnabledMerchants: true,
+  orgUIConfig: snapSupplementsOrgUIConfig,
+  orgColors: () => snapSupplementsColors,
+  orgPageConfig: snapSupplementsPageConfig,
+} satisfies BasicOrgInfoType;
+
+export {
+  snapSupplementsOrgInfo,
+  snapSupplementsOrgUIConfig,
+  snapSupplementsColors,
+  snapSupplementsPageConfig,
+};