wealth-alpha-chat-widget 1.0.2 → 1.0.4

package/dist/index.cjs

@@ -683,6 +683,9 @@ function useSession(opts = {}) {
 // src/styles/chat.module.css
 var chat_default = {
   root: "chat_root",
+  headerTitle: "chat_headerTitle",
+  menuItemTitle: "chat_menuItemTitle",
+  markdown: "chat_markdown",
   floatingButton: "chat_floatingButton",
   positionRight: "chat_positionRight",
   positionLeft: "chat_positionLeft",
@@ -690,25 +693,27 @@ var chat_default = {
   popupBubbleLeft: "chat_popupBubbleLeft",
   popupBubbleRight: "chat_popupBubbleRight",
   header: "chat_header",
-  headerTitle: "chat_headerTitle",
   headerMeta: "chat_headerMeta",
   headerActions: "chat_headerActions",
   iconButton: "chat_iconButton",
   body: "chat_body",
   bubble: "chat_bubble",
-  markdown: "chat_markdown",
   bubbleBot: "chat_bubbleBot",
   bubbleUser: "chat_bubbleUser",
+  bubbleCard: "chat_bubbleCard",
+  bubbleMeta: "chat_bubbleMeta",
   chipRow: "chat_chipRow",
   chip: "chat_chip",
   chipActive: "chat_chipActive",
   chipDisabled: "chat_chipDisabled",
   typing: "chat_typing",
   typingDot: "chat_typingDot",
+  wacBlink: "chat_wacBlink",
   input: "chat_input",
   inputBox: "chat_inputBox",
   sendButton: "chat_sendButton",
   hiddenFileInput: "chat_hiddenFileInput",
+  csvButton: "chat_csvButton",
   authGate: "chat_authGate",
   authGateIcon: "chat_authGateIcon",
   authGateTitle: "chat_authGateTitle",
@@ -718,7 +723,22 @@ var chat_default = {
   authGateDisclaimerTitle: "chat_authGateDisclaimerTitle",
   errorBanner: "chat_errorBanner",
   popupBubble: "chat_popupBubble",
-  popupDismiss: "chat_popupDismiss"
+  wacPopIn: "chat_wacPopIn",
+  popupDismiss: "chat_popupDismiss",
+  menuGrid: "chat_menuGrid",
+  menuItem: "chat_menuItem",
+  menuItemIcon: "chat_menuItemIcon",
+  menuItemSvg: "chat_menuItemSvg",
+  menuItemSub: "chat_menuItemSub",
+  menuIconGreen: "chat_menuIconGreen",
+  menuIconBlue: "chat_menuIconBlue",
+  menuIconLeaf: "chat_menuIconLeaf",
+  menuIconRed: "chat_menuIconRed",
+  menuIconOrange: "chat_menuIconOrange",
+  menuIconGold: "chat_menuIconGold",
+  menuIconTeal: "chat_menuIconTeal",
+  menuIconPurple: "chat_menuIconPurple",
+  chat_bubbleBot: "chat_chat_bubbleBot"
 };
 function AuthGate({ brandName, loginUrl, onLoginClick }) {
   const handleClick = () => {
@@ -790,9 +810,10 @@ var ALLOWED_TAGS = [
   "ol",
   "li",
   "blockquote",
-  "span"
+  "span",
+  "div"
 ];
-var ALLOWED_ATTR = ["href", "target", "rel", "class"];
+var ALLOWED_ATTR = ["href", "target", "rel", "class", "style", "data-wa-gauge-pct"];
 var SANITIZE_CFG = {
   ALLOWED_TAGS,
   ALLOWED_ATTR,
@@ -803,28 +824,116 @@ var SANITIZE_CFG = {
 function inlineMarkdownToHtml(text) {
   return text.replace(/^[ \t]*#{1,6}[ \t]+(.+?)[ \t]*$/gm, "<b>$1</b>").replace(/\*\*([^\n<>]+?)\*\*/g, "<b>$1</b>").replace(/__([^\n<>]+?)__/g, "<b>$1</b>").replace(/(?<!\*)\*([^\n*<>]+?)\*(?!\*)/g, "<b>$1</b>").replace(/(?<![_a-zA-Z0-9])_([^\n_<>]+?)_(?![_a-zA-Z0-9])/g, "<i>$1</i>");
 }
+function stripCardDateTime(html) {
+  return html.replace(
+    /(<span class="wa-card-date">)([^<]*)(<\/span>)/g,
+    (_m, open, content, close) => open + content.replace(/,\s*\d{1,2}:\d{2}.*$/, "").trim() + close
+  );
+}
 function renderMarkdown(text) {
   if (!text) return "";
   const inlined = inlineMarkdownToHtml(text);
+  if (/<div[\s>]/i.test(inlined)) {
+    return DOMPurify__default.default.sanitize(stripCardDateTime(inlined), SANITIZE_CFG);
+  }
   const paragraphs = inlined.split(/\n{2,}/).map((para) => para.replace(/\n/g, "<br>")).filter((p) => p.length > 0);
   const html = paragraphs.length > 1 ? paragraphs.map((p) => `<p>${p}</p>`).join("") : paragraphs[0] ?? "";
-  return DOMPurify__default.default.sanitize(html, SANITIZE_CFG);
+  return DOMPurify__default.default.sanitize(stripCardDateTime(html), SANITIZE_CFG);
+}
+var ROOT_MENU_CHIP_IDS = /* @__PURE__ */ new Set([
+  "stock_analysis",
+  "stock_discovery",
+  "new_listings",
+  "portfolio_risk",
+  "market_forecast",
+  "crypto",
+  "tradable_picks",
+  "peer_compare"
+]);
+var MENU_SUBTITLES = {
+  stock_analysis: "Fundamental & technical",
+  stock_discovery: "Find promising stocks",
+  new_listings: "Track IPOs & new stocks",
+  portfolio_risk: "Analyze your portfolio",
+  market_forecast: "Outlook & key events",
+  crypto: "BTC, ETH & trends",
+  tradable_picks: "Short-term setups",
+  peer_compare: "Compare peer stocks"
+};
+var MENU_ICON_KEY = {
+  stock_analysis: "menuIconGreen",
+  stock_discovery: "menuIconBlue",
+  new_listings: "menuIconLeaf",
+  portfolio_risk: "menuIconRed",
+  market_forecast: "menuIconOrange",
+  crypto: "menuIconGold",
+  tradable_picks: "menuIconTeal",
+  peer_compare: "menuIconPurple"
+};
+var MENU_ICON_SVG = {
+  stock_analysis: ' <path d="M4 16L9 11L13 15L20 8" /> <path d="M20 8V13" /> <path d="M20 8H15" />',
+  stock_discovery: '<circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/>',
+  new_listings: '<rect x="5" y="5" width="14" height="14" rx="3"/><path d="M12 8v8"/> <path d="M8 12h8"/>',
+  portfolio_risk: '<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z"/>',
+  market_forecast: '<path d="M13 2 4 14h7l-1 8 9-12h-7l1-8Z"/>',
+  crypto: '<path d="M4 20V10M10 20V4M16 20v-7M22 20v-4"/>',
+  tradable_picks: '<circle cx="12" cy="12" r="9"/><circle cx="12" cy="12" r="5"/><circle cx="12" cy="12" r="1.5"/>',
+  peer_compare: '<path d="M12 3v18"/><path d="M5 8l-3 6h6z"/><path d="M19 8l-3 6h6z"/>'
+};
+function isRootMenuChips(chips) {
+  return chips.length > 0 && chips.every((c) => ROOT_MENU_CHIP_IDS.has(c.id));
 }
 function MessageBubble({ message, onChipClick }) {
   const isBot = message.role === "bot";
-  const bubbleClass = isBot ? `${chat_default.bubble} ${chat_default.bubbleBot}` : `${chat_default.bubble} ${chat_default.bubbleUser}`;
+  const isCard = isBot && message.content.includes("<div");
+  const bubbleClass = isBot ? `${chat_default.bubble} ${isCard ? chat_default.bubbleCard : chat_default.bubbleBot}` : `${chat_default.bubble} ${chat_default.bubbleUser}`;
+  const handleMarkdownClick = (e) => {
+    const anchor = e.target.closest("a");
+    if (!anchor?.href) return;
+    e.preventDefault();
+    window.location.assign(anchor.href);
+  };
+  const chips = message.chips ?? [];
+  const showMenuGrid = isBot && message.chipsActive && isRootMenuChips(chips);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column" }, children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: bubbleClass, children: isBot ? /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         className: chat_default.markdown,
-        dangerouslySetInnerHTML: { __html: renderMarkdown(message.content) }
+        dangerouslySetInnerHTML: { __html: renderMarkdown(message.content) },
+        onClick: handleMarkdownClick
       }
     ) : message.content }),
-    isBot && message.chips && message.chips.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+    showMenuGrid ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: chat_default.menuGrid, children: chips.map((chip) => {
+      const iconKey = MENU_ICON_KEY[chip.id];
+      const iconClass = iconKey && chat_default[iconKey] || "";
+      const svgIcon = MENU_ICON_SVG[chip.id];
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          className: chat_default.menuItem,
+          onClick: () => onChipClick(chip),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${chat_default.menuItemIcon} ${iconClass}`, children: svgIcon ? /* @__PURE__ */ jsxRuntime.jsx(
+              "svg",
+              {
+                className: chat_default.menuItemSvg,
+                viewBox: "0 0 24 24",
+                "aria-hidden": "true",
+                dangerouslySetInnerHTML: { __html: svgIcon }
+              }
+            ) : /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: chip.icon }) }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: chat_default.menuItemTitle, children: chip.label }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: chat_default.menuItemSub, children: MENU_SUBTITLES[chip.id] ?? "" })
+          ]
+        },
+        chip.id
+      );
+    }) }) : isBot && chips.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
       ChipRow,
       {
-        chips: message.chips,
+        chips,
         disabled: !message.chipsActive,
         onClick: onChipClick
       }
@@ -873,18 +982,6 @@ function ChatBody({
     /* @__PURE__ */ jsxRuntime.jsx("div", { ref: endRef })
   ] });
 }
-
-// src/utils/time.ts
-function formatCountdown(remainingMs) {
-  if (remainingMs <= 0) return "expired";
-  const totalSeconds = Math.floor(remainingMs / 1e3);
-  const hours = Math.floor(totalSeconds / 3600);
-  const minutes = Math.floor(totalSeconds % 3600 / 60);
-  const seconds = totalSeconds % 60;
-  if (hours > 0) return `${hours}h ${minutes}m left`;
-  if (minutes > 0) return `${minutes}m ${seconds}s left`;
-  return `${seconds}s left`;
-}
 function ChatHeader({
   brandName,
   remainingMs,
@@ -893,13 +990,7 @@ function ChatHeader({
   onClear
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chat_default.header, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: chat_default.headerTitle, children: brandName }),
-      showCountdown && remainingMs > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chat_default.headerMeta, children: [
-        "Session: ",
-        formatCountdown(remainingMs)
-      ] }) : null
-    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: chat_default.headerTitle, children: brandName }) }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chat_default.headerActions, children: [
       onClear ? /* @__PURE__ */ jsxRuntime.jsx(
         "button",
@@ -1015,15 +1106,20 @@ var DEFAULT_BRAND_NAME = "Wealth Alpha AI";
 var DEFAULT_BRAND_COLOR = "#1a2d5a";
 var DEFAULT_AUTH_CHECK = "/me";
 var DEFAULT_GREETING = "Hi! I'm your Wealth Alpha AI assistant. How can I help you?";
-var DISCLAIMER_BLOCK = "DISCLAIMER:\n\u2022 AI-assisted analysis for educational purposes only.\n\u2022 Not financial advice. Markets involve risk.\n\u2022 Consult a SEBI-registered advisor before investing.";
-var CTA_LINE = "Select a quick command below \u2014 or type your query to ask our AI Research Analyst directly.";
+var CTA_LINE = "Select a quick command below";
 var PORTFOLIO_CSV_CHIP_ID = "__portfolio_csv_upload";
+var UPGRADE_PREMIUM_CHIP_ID = "__upgrade_premium__";
+function resolvePricingUrl(upgradeUrl) {
+  if (upgradeUrl) return upgradeUrl;
+  if (typeof window !== "undefined") {
+    return `${window.location.origin}/pricing`;
+  }
+  return "";
+}
 function buildWelcome(name, plan) {
   const greeting = name ? `Welcome back, ${name}! You have ${plan ? plan : "Premium"} access.` : `Welcome! You have ${plan ? plan : "Premium"} access.`;
   return `${greeting}
 
-${DISCLAIMER_BLOCK}
-
 ${CTA_LINE}`;
 }
 function WealthChat(props) {
@@ -1051,6 +1147,16 @@ function WealthChat(props) {
   react.useEffect(() => {
     setMounted(true);
   }, []);
+  react.useEffect(() => {
+    if (typeof document === "undefined") return;
+    const id = "wac-google-fonts";
+    if (document.getElementById(id)) return;
+    const link = document.createElement("link");
+    link.id = id;
+    link.rel = "stylesheet";
+    link.href = "https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Sora:wght@600;700;800&display=swap";
+    document.head.appendChild(link);
+  }, []);
   react.useEffect(() => {
     if (!mounted || open || popupShownRef.current) return;
     const timer = setTimeout(() => {
@@ -1135,16 +1241,30 @@ function WealthChat(props) {
         csvFileRef.current?.click();
         return;
       }
+      if (chip.id === UPGRADE_PREMIUM_CHIP_ID) {
+        appendUserMessage(chip.label);
+        const pricingUrl = resolvePricingUrl(user?.upgradeUrl);
+        if (pricingUrl && typeof window !== "undefined") {
+          window.location.assign(pricingUrl);
+        }
+        return;
+      }
       appendUserMessage(chip.label);
       setTyping(true);
       try {
         const resp = await callChip(chip);
-        if (resp) appendBotResponse(resp);
+        if (!resp) return;
+        const redirectUrl = resp.metadata?.redirectUrl;
+        if (typeof redirectUrl === "string" && redirectUrl && typeof window !== "undefined") {
+          window.location.assign(redirectUrl);
+          return;
+        }
+        appendBotResponse(resp);
       } finally {
         setTyping(false);
       }
     },
-    [touch, deactivatePriorChips, appendUserMessage, callChip, setTyping, appendBotResponse]
+    [touch, deactivatePriorChips, appendUserMessage, callChip, setTyping, appendBotResponse, user?.upgradeUrl]
   );
   const handleCsvFileSelected = react.useCallback(
     (e) => {