@eshal-bot/chat-widget 0.1.54 → 0.1.56

package/dist/chat-widget.js

@@ -54312,9 +54312,17 @@
   }
   function numericData(data, xKey, yKey) {
     return (data || []).map(row => {
-      var _row$xKey;
+      const raw = row === null || row === void 0 ? void 0 : row[xKey];
       return {
-        label: String((_row$xKey = row === null || row === void 0 ? void 0 : row[xKey]) !== null && _row$xKey !== void 0 ? _row$xKey : ''),
+        // Pre-format the label so bar/line ticks read "Jan" instead
+        // of "1" and "Office Supplies" instead of "office_supplies".
+        // formatAxisTick handles the month-number → month-name mapping
+        // when xKey matches /month/i AND value is 1..12; otherwise it
+        // falls through to prettifyLabel. See Bug 1 + Bug 3 in the
+        // 2026-06-16 chart-formatting fix.
+        label: formatAxisTick(raw, xKey),
+        // Raw value preserved — value formatting (currency etc.) is
+        // applied at render-time by BarSvg/LineSvg using yKey.
         value: Number(row === null || row === void 0 ? void 0 : row[yKey])
       };
     }).filter(d => Number.isFinite(d.value));
@@ -54352,18 +54360,23 @@
       });
     }
     const t = String(type || '').trim().toLowerCase();
+    // Pass yKey down so the SVG renderers can apply currency formatting
+    // ($23,376.60) when the column name suggests money — see formatValueForKey.
     let body;
     if (t === 'pie' || t === 'donut') body = /*#__PURE__*/jsxRuntimeExports.jsx(PieSvg, {
       rows: rows,
       donut: t === 'donut',
-      isDark: isDark
+      isDark: isDark,
+      yKey: y
     });else if (t === 'line' || t === 'area') body = /*#__PURE__*/jsxRuntimeExports.jsx(LineSvg, {
       rows: rows,
       area: t === 'area',
-      isDark: isDark
+      isDark: isDark,
+      yKey: y
     });else body = /*#__PURE__*/jsxRuntimeExports.jsx(BarSvg, {
       rows: rows,
-      isDark: isDark
+      isDark: isDark,
+      yKey: y
     }); // bar + every fallback
 
     return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
@@ -54380,7 +54393,8 @@
   function BarSvg(_ref3) {
     let {
       rows,
-      isDark
+      isDark,
+      yKey
     } = _ref3;
     const w = 320;
     const h = 180;
@@ -54433,7 +54447,7 @@
             fontSize: "9",
             fill: labelStroke,
             textAnchor: "middle",
-            children: formatNum(r.value)
+            children: formatValueForKey(r.value, yKey)
           })]
         }, i);
       })]
@@ -54443,7 +54457,8 @@
     let {
       rows,
       area,
-      isDark
+      isDark,
+      yKey
     } = _ref4;
     const w = 320;
     const h = 180;
@@ -54491,14 +54506,14 @@
         fontSize: "9",
         fill: labelStroke,
         textAnchor: "end",
-        children: formatNum(maxV)
+        children: formatValueForKey(maxV, yKey)
       }), /*#__PURE__*/jsxRuntimeExports.jsx("text", {
         x: padLeft - 4,
         y: padTop + innerH,
         fontSize: "9",
         fill: labelStroke,
         textAnchor: "end",
-        children: formatNum(minV)
+        children: formatValueForKey(minV, yKey)
       }), area && /*#__PURE__*/jsxRuntimeExports.jsx("path", {
         d: areaPath,
         fill: lineColor,
@@ -54531,7 +54546,8 @@
     let {
       rows,
       donut,
-      isDark
+      isDark,
+      yKey
     } = _ref5;
     const size = 200;
     const cx = size / 2;
@@ -54626,7 +54642,7 @@
               style: {
                 opacity: 0.7
               },
-              children: formatNum(s.value)
+              children: formatValueForKey(s.value, yKey)
             })]
           })]
         }, i))
@@ -54720,7 +54736,7 @@
                   textAlign: 'left',
                   fontWeight: 600
                 },
-                children: c
+                children: prettifyLabel(c)
               }, c))
             })
           }), /*#__PURE__*/jsxRuntimeExports.jsx("tbody", {
@@ -54730,7 +54746,7 @@
                   border,
                   padding: '6px 8px'
                 },
-                children: row && typeof row === 'object' ? formatCell(row[c]) : ''
+                children: row && typeof row === 'object' ? formatCell(row[c], c) : ''
               }, c))
             }, i))
           })]
@@ -54953,9 +54969,66 @@
     if (Number.isInteger(n)) return String(n);
     return n.toFixed(2);
   }
-  function formatCell(v) {
+
+  // ── Bug 1 + Bug 3 helpers (2026-06-16) ───────────────────────────────────
+  // PORTED from packages/frontend/src/components/charts/eshal-chart/
+  // chartShared.tsx. Duplicated rather than shared because the widget is
+  // bundle-size-conscious (a separate package import here would pull a
+  // chunk of the frontend with it). The authoritative tests live with
+  // the frontend copy in __tests__/chartShared.test.ts — keep this code
+  // in lockstep with that file when either is touched. Regex boundaries
+  // use `(^|[_\W])` instead of `\b` because JS regex `\b` doesn't fire
+  // next to `_` (underscore is a word char), so "total_expenses" with
+  // `\bexpense\b` would miss the match.
+
+  const MONTH_NAMES = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+  const CURRENCY_KEY_RE = /(^|[_\W])(price|salary|cost|amount|revenue|expense|total|value|budget|spend|income|sale|balance)/i;
+  const MONTH_KEY_RE = /(^|[_\W])month/i;
+  const USD_FORMATTER = new Intl.NumberFormat('en-US', {
+    style: 'currency',
+    currency: 'USD',
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2
+  });
+  function prettifyLabel(value) {
+    if (value === null || value === undefined) return '';
+    const s = String(value);
+    if (!s) return '';
+    return s.replace(/[_\-]+/g, ' ').replace(/([a-z])([A-Z])/g, '$1 $2').replace(/\s+/g, ' ').trim().split(' ').map(w => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join(' ');
+  }
+  function isCurrencyKey(key) {
+    return typeof key === 'string' && CURRENCY_KEY_RE.test(key);
+  }
+
+  // Like formatNum, but adds $ + comma + 2 decimals when `key` suggests
+  // currency. Used for bar/line value labels and table cells so the
+  // widget matches the frontend chart's formatting on the same data.
+  function formatValueForKey(value, key) {
+    if (typeof value === 'number' && Number.isFinite(value)) {
+      if (isCurrencyKey(key)) return USD_FORMATTER.format(value);
+      return formatNum(value);
+    }
+    return prettifyLabel(value);
+  }
+
+  // Axis-tick formatter: month-number columns (column matches /month/i,
+  // value 1..12) render as 3-letter month names; everything else gets
+  // prettifyLabel applied so "office_supplies" reads "Office Supplies".
+  function formatAxisTick(value, dataKey) {
+    if (typeof dataKey === 'string' && MONTH_KEY_RE.test(dataKey)) {
+      const n = typeof value === 'number' ? value : Number(value);
+      if (Number.isInteger(n) && n >= 1 && n <= 12) return MONTH_NAMES[n - 1];
+    }
+    return prettifyLabel(value);
+  }
+  function formatCell(v, columnKey) {
     if (v == null) return '';
-    if (typeof v === 'number') return Number.isInteger(v) ? String(v) : v.toFixed(2);
+    if (typeof v === 'number') {
+      // Currency-keyed numeric cells in tables also get $ + decimals so
+      // the table next to a chart agrees on its number formatting.
+      if (isCurrencyKey(columnKey)) return USD_FORMATTER.format(v);
+      return Number.isInteger(v) ? String(v) : v.toFixed(2);
+    }
     if (typeof v === 'object') return JSON.stringify(v);
     return String(v);
   }
@@ -58040,6 +58113,30 @@
         window.cancelAnimationFrame(frame);
       };
     }, [autoScrollKey, isLoading]);
+
+    // When voice connects, scroll so the listening indicator (rendered after the
+    // topic tags and quick questions) is visible at the bottom. Neither
+    // autoScrollKey nor isLoading changes on voice-connect, so the main scroll
+    // effect never fires — without this the indicator is pushed below the viewport
+    // while the topic tags remain in view above it.
+    reactExports.useEffect(() => {
+      if (!isVoiceSessionActive || voiceStatus !== "connected") {
+        return undefined;
+      }
+      if (typeof window === "undefined") {
+        return undefined;
+      }
+      const frame = window.requestAnimationFrame(() => {
+        var _messagesEndRef$curre3;
+        (_messagesEndRef$curre3 = messagesEndRef.current) === null || _messagesEndRef$curre3 === void 0 || _messagesEndRef$curre3.scrollIntoView({
+          behavior: "smooth",
+          block: "end"
+        });
+      });
+      return () => {
+        window.cancelAnimationFrame(frame);
+      };
+    }, [isVoiceSessionActive, voiceStatus]);
     const normalizedDisclaimerLinkUrl = reactExports.useMemo(() => normalizeExternalUrl(disclaimerLinkUrl), [disclaimerLinkUrl]);
     return /*#__PURE__*/jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
       children: [disclaimerEnabled && disclaimerText && disclaimerPosition === "top" && /*#__PURE__*/jsxRuntimeExports.jsx("div", {