wealth-alpha-chat-widget 1.0.1 → 1.0.2

package/dist/index.cjs

@@ -284,6 +284,50 @@ async function sendMessage(apiBase, message, sessionId, context, signal) {
     signal
   });
 }
+async function uploadPortfolioCsv(apiBase, file, sessionId, signal) {
+  const url = joinUrl(apiBase, "/upload-portfolio-csv");
+  const requestId = generateRequestId();
+  const session = readSession();
+  const form = new FormData();
+  form.append("sessionId", sessionId);
+  form.append("file", file, file.name);
+  const controller = new AbortController();
+  const timeoutId = setTimeout(() => controller.abort(), 6e4);
+  if (signal) {
+    if (signal.aborted) {
+      clearTimeout(timeoutId);
+      throw new DOMException("Aborted", "AbortError");
+    }
+    signal.addEventListener("abort", () => controller.abort(), { once: true });
+  }
+  try {
+    const headers = { "X-Request-Id": requestId };
+    if (session?.token) headers["Authorization"] = `Bearer ${session.token}`;
+    const res = await fetch(url, {
+      method: "POST",
+      headers,
+      body: form,
+      signal: controller.signal,
+      credentials: "same-origin"
+    });
+    if (res.status === 401 || res.status === 403) {
+      clearSession();
+      throw new AuthExpiredError(requestId);
+    }
+    if (!res.ok) {
+      let detail = res.statusText;
+      try {
+        const errBody = await res.json();
+        detail = errBody.message ?? errBody.detail ?? detail;
+      } catch {
+      }
+      throw new ApiError(detail || `HTTP ${res.status}`, res.status, requestId);
+    }
+    return await res.json();
+  } finally {
+    clearTimeout(timeoutId);
+  }
+}
 async function logout(apiBase, signal) {
   try {
     await request(apiBase, "/auth/logout", {
@@ -430,6 +474,37 @@ function useChat(opts) {
   const deactivatePriorChips = react.useCallback((keepId) => {
     dispatch({ type: "DEACTIVATE_CHIPS", payload: { exceptId: keepId } });
   }, []);
+  const uploadCsv = react.useCallback(
+    async (file) => {
+      if (!sessionId) return;
+      abortRef.current?.abort();
+      const controller = new AbortController();
+      abortRef.current = controller;
+      deactivatePriorChips();
+      appendUserMessage(`Uploaded ${file.name}`);
+      dispatch({ type: "SET_TYPING", payload: true });
+      dispatch({ type: "SET_STATUS", payload: "sending" });
+      dispatch({ type: "SET_ERROR", payload: null });
+      try {
+        const resp = await uploadPortfolioCsv(apiBase, file, sessionId, controller.signal);
+        appendBotResponse(resp);
+        dispatch({ type: "SET_STATUS", payload: "idle" });
+      } catch (err) {
+        const error = err;
+        if (error.name === "AbortError") return;
+        if (error instanceof AuthExpiredError) {
+          onAuthExpiredRef.current?.();
+        } else {
+          onErrorRef.current?.(error);
+          dispatch({ type: "SET_ERROR", payload: error.message });
+        }
+        dispatch({ type: "SET_STATUS", payload: "error" });
+      } finally {
+        dispatch({ type: "SET_TYPING", payload: false });
+      }
+    },
+    [apiBase, sessionId, appendUserMessage, appendBotResponse, deactivatePriorChips]
+  );
   const sendText = react.useCallback(
     async (text) => {
       const trimmed = text.trim();
@@ -476,6 +551,7 @@ function useChat(opts) {
   return {
     state,
     sendText,
+    uploadCsv,
     appendBotResponse,
     appendUserMessage,
     deactivatePriorChips,
@@ -611,6 +687,8 @@ var chat_default = {
   positionRight: "chat_positionRight",
   positionLeft: "chat_positionLeft",
   widget: "chat_widget",
+  popupBubbleLeft: "chat_popupBubbleLeft",
+  popupBubbleRight: "chat_popupBubbleRight",
   header: "chat_header",
   headerTitle: "chat_headerTitle",
   headerMeta: "chat_headerMeta",
@@ -630,6 +708,7 @@ var chat_default = {
   input: "chat_input",
   inputBox: "chat_inputBox",
   sendButton: "chat_sendButton",
+  hiddenFileInput: "chat_hiddenFileInput",
   authGate: "chat_authGate",
   authGateIcon: "chat_authGateIcon",
   authGateTitle: "chat_authGateTitle",
@@ -637,7 +716,9 @@ var chat_default = {
   authGateButton: "chat_authGateButton",
   authGateDisclaimer: "chat_authGateDisclaimer",
   authGateDisclaimerTitle: "chat_authGateDisclaimerTitle",
-  errorBanner: "chat_errorBanner"
+  errorBanner: "chat_errorBanner",
+  popupBubble: "chat_popupBubble",
+  popupDismiss: "chat_popupDismiss"
 };
 function AuthGate({ brandName, loginUrl, onLoginClick }) {
   const handleClick = () => {
@@ -847,16 +928,24 @@ function ChatHeader({
 }
 function ChatInput({ disabled, placeholder, onSend }) {
   const [value, setValue] = react.useState("");
+  const inputRef = react.useRef(null);
+  react.useEffect(() => {
+    if (!disabled) {
+      inputRef.current?.focus();
+    }
+  }, [disabled]);
   const submit = () => {
     const trimmed = value.trim();
     if (!trimmed || disabled) return;
     onSend(trimmed);
     setValue("");
+    inputRef.current?.focus();
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chat_default.input, children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
+        ref: inputRef,
         type: "text",
         className: chat_default.inputBox,
         value,
@@ -884,25 +973,51 @@ function ChatInput({ disabled, placeholder, onSend }) {
     )
   ] });
 }
-function FloatingButton({ position, onClick, brandColor }) {
+function FloatingButton({ position, onClick, brandColor, showPopup, popupMessage, onPopupDismiss }) {
   const posClass = position === "bottom-left" ? chat_default.positionLeft : chat_default.positionRight;
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "button",
-    {
-      type: "button",
-      className: `${chat_default.floatingButton} ${posClass}`,
-      onClick,
-      "aria-label": "Open chat",
-      style: brandColor ? { background: brandColor } : void 0,
-      children: "\u{1F4AC}"
-    }
-  );
+  const popupPosClass = position === "bottom-left" ? chat_default.popupBubbleLeft : chat_default.popupBubbleRight;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    showPopup && popupMessage ? /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: `${chat_default.popupBubble} ${popupPosClass}`,
+        role: "status",
+        "aria-live": "polite",
+        children: [
+          popupMessage,
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              className: chat_default.popupDismiss,
+              onClick: onPopupDismiss,
+              "aria-label": "Dismiss greeting",
+              children: "\u2715"
+            }
+          )
+        ]
+      }
+    ) : null,
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        className: `${chat_default.floatingButton} ${posClass}`,
+        onClick,
+        "aria-label": "Open chat",
+        style: brandColor ? { background: brandColor } : void 0,
+        children: "\u{1F4AC}"
+      }
+    )
+  ] });
 }
 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 PORTFOLIO_CSV_CHIP_ID = "__portfolio_csv_upload";
 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}
@@ -923,6 +1038,7 @@ function WealthChat(props) {
     position = "bottom-right",
     defaultOpen = false,
     showCountdown = true,
+    greetingMessage = DEFAULT_GREETING,
     onLogin,
     onLogout,
     onSessionExpire,
@@ -930,9 +1046,19 @@ function WealthChat(props) {
   } = props;
   const [mounted, setMounted] = react.useState(false);
   const [open, setOpen] = react.useState(defaultOpen);
+  const [showPopup, setShowPopup] = react.useState(false);
+  const popupShownRef = react.useRef(defaultOpen);
   react.useEffect(() => {
     setMounted(true);
   }, []);
+  react.useEffect(() => {
+    if (!mounted || open || popupShownRef.current) return;
+    const timer = setTimeout(() => {
+      setShowPopup(true);
+      popupShownRef.current = true;
+    }, 1e3);
+    return () => clearTimeout(timer);
+  }, [mounted, open]);
   const {
     session,
     remainingMs,
@@ -960,9 +1086,11 @@ function WealthChat(props) {
     },
     [session, setHistory]
   );
+  const csvFileRef = react.useRef(null);
   const {
     state: chatState,
     sendText,
+    uploadCsv,
     appendBotResponse,
     appendUserMessage,
     deactivatePriorChips,
@@ -1002,6 +1130,11 @@ function WealthChat(props) {
     async (chip) => {
       touch();
       deactivatePriorChips();
+      if (chip.id === PORTFOLIO_CSV_CHIP_ID) {
+        appendUserMessage(chip.label);
+        csvFileRef.current?.click();
+        return;
+      }
       appendUserMessage(chip.label);
       setTyping(true);
       try {
@@ -1013,6 +1146,17 @@ function WealthChat(props) {
     },
     [touch, deactivatePriorChips, appendUserMessage, callChip, setTyping, appendBotResponse]
   );
+  const handleCsvFileSelected = react.useCallback(
+    (e) => {
+      const file = e.target.files?.[0];
+      e.target.value = "";
+      if (file) {
+        touch();
+        void uploadCsv(file);
+      }
+    },
+    [touch, uploadCsv]
+  );
   const handleSend = react.useCallback(
     (text) => {
       touch();
@@ -1020,6 +1164,10 @@ function WealthChat(props) {
     },
     [touch, sendText]
   );
+  const handleFloatingButtonClick = react.useCallback(() => {
+    setOpen(true);
+    setShowPopup(false);
+  }, []);
   const handleClose = react.useCallback(() => setOpen(false), []);
   const handleClear = react.useCallback(() => {
     clearChat();
@@ -1036,7 +1184,17 @@ function WealthChat(props) {
     ["--wac-brand"]: brandColor
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chat_default.root, style: rootStyle, children: [
-    !open ? /* @__PURE__ */ jsxRuntime.jsx(FloatingButton, { position, onClick: () => setOpen(true), brandColor }) : null,
+    !open ? /* @__PURE__ */ jsxRuntime.jsx(
+      FloatingButton,
+      {
+        position,
+        onClick: handleFloatingButtonClick,
+        brandColor,
+        showPopup,
+        popupMessage: greetingMessage,
+        onPopupDismiss: () => setShowPopup(false)
+      }
+    ) : null,
     open ? /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
@@ -1066,6 +1224,18 @@ function WealthChat(props) {
               onLoginClick: handleLoginClick
             }
           ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              ref: csvFileRef,
+              type: "file",
+              accept: ".csv,text/csv",
+              className: chat_default.hiddenFileInput,
+              onChange: handleCsvFileSelected,
+              "aria-hidden": true,
+              tabIndex: -1
+            }
+          ),
           isLoggedIn ? /* @__PURE__ */ jsxRuntime.jsx(
             ChatInput,
             {