@eshal-bot/chat-widget 0.1.86 → 0.1.88

package/dist/chat-widget-markdown-chunk.js

@@ -20764,7 +20764,7 @@
   function exitCodeText(token) {
     let value = this.resume();
     if (this.data.inTable) {
-      value = value.replace(/\\([\\|])/g, replace);
+      value = value.replace(/\\([\\|])/g, replace$1);
     }
     const node = this.stack[this.stack.length - 1];
     ok$2(node.type === 'inlineCode');
@@ -20777,7 +20777,7 @@
    * @param {string} $1
    * @returns {string}
    */
-  function replace($0, $1) {
+  function replace$1($0, $1) {
     // Pipes work, backslashes don’t (but can’t escape pipes).
     return $1 === '|' ? $1 : $0;
   }
@@ -23860,6 +23860,61 @@
     toMarkdownExtensions.push(gfmToMarkdown(settings));
   }
 
+  /**
+   * @typedef {import('mdast').Nodes} Nodes
+   * @typedef {import('mdast-util-find-and-replace').ReplaceFunction} ReplaceFunction
+   */
+
+
+  /**
+   * Turn normal line endings into hard breaks.
+   *
+   * @param {Nodes} tree
+   *   Tree to change.
+   * @returns {undefined}
+   *   Nothing.
+   */
+  function newlineToBreak(tree) {
+    findAndReplace(tree, [/\r?\n|\r/g, replace]);
+  }
+
+  /**
+   * Replace line endings.
+   *
+   * @type {ReplaceFunction}
+   */
+  function replace() {
+    return {
+      type: 'break'
+    };
+  }
+
+  /**
+   * @typedef {import('mdast').Root} Root
+   */
+
+
+  /**
+   * Support hard breaks without needing spaces or escapes (turns enters into
+   * `<br>`s).
+   *
+   * @returns
+   *   Transform.
+   */
+  function remarkBreaks() {
+    /**
+     * Transform.
+     *
+     * @param {Root} tree
+     *   Tree.
+     * @returns {undefined}
+     *   Nothing.
+     */
+    return function (tree) {
+      newlineToBreak(tree);
+    };
+  }
+
   function _objectWithoutPropertiesLoose$l(r, e) {
     if (null == r) return {};
     var t = {};
@@ -88048,6 +88103,36 @@
       isDark: isDark,
       onButtonClick: onButtonClick
     });
+    // Cross-industry primitives (14-08-2026) - mirrors
+    // packages/frontend/src/components/charts/A2uiBlock.tsx's menu/profile/
+    // timeline/rating/comparison/gallery additions.
+    if (t === 'menu') return /*#__PURE__*/jsxRuntimeExports.jsx(Menu, {
+      spec: spec,
+      isDark: isDark,
+      onButtonClick: onButtonClick
+    });
+    if (t === 'profile') return /*#__PURE__*/jsxRuntimeExports.jsx(Profile, {
+      spec: spec,
+      isDark: isDark,
+      onButtonClick: onButtonClick
+    });
+    if (t === 'timeline') return /*#__PURE__*/jsxRuntimeExports.jsx(Timeline, {
+      spec: spec,
+      isDark: isDark
+    });
+    if (t === 'rating') return /*#__PURE__*/jsxRuntimeExports.jsx(Rating, {
+      spec: spec,
+      isDark: isDark
+    });
+    if (t === 'comparison') return /*#__PURE__*/jsxRuntimeExports.jsx(Comparison, {
+      spec: spec,
+      isDark: isDark,
+      onButtonClick: onButtonClick
+    });
+    if (t === 'gallery') return /*#__PURE__*/jsxRuntimeExports.jsx(Gallery, {
+      spec: spec,
+      isDark: isDark
+    });
 
     // Unrecognised type - render the data (if any) as a labeled list. Never
     // fall through to raw JSON; that's the bug we're fixing.
@@ -88243,33 +88328,33 @@
       isDark
     } = _ref10;
     const lvl = String(spec.level || 'info').toLowerCase();
+    // EV-2258 Status Message Spec v1 - same --status-success/warning/error/info
+    // tokens as packages/frontend/src/app/globals.css. This file styles via JS
+    // objects rather than Tailwind classes/CSS vars, so the locked hsl() values
+    // are inlined directly instead of the previous ad-hoc blue/amber/red hexes.
     const palette = {
       info: {
-        bg: isDark ? '#1e3a5f' : '#eff6ff',
-        border: '#3b82f6',
-        text: isDark ? '#dbeafe' : '#1e40af'
+        bg: isDark ? 'hsl(204 33% 14%)' : 'hsl(204 100% 97%)',
+        border: isDark ? 'hsl(199 89% 58%)' : 'hsl(199 89% 48%)',
+        text: isDark ? '#bae6fd' : '#0c4a6e'
       },
       warn: {
-        bg: isDark ? '#3d2e0a' : '#fef3c7',
-        border: '#f59e0b',
-        text: isDark ? '#fde68a' : '#92400e'
-      },
-      warning: {
-        bg: isDark ? '#3d2e0a' : '#fef3c7',
-        border: '#f59e0b',
-        text: isDark ? '#fde68a' : '#92400e'
+        bg: isDark ? 'hsl(36 33% 14%)' : 'hsl(34 100% 95%)',
+        border: isDark ? 'hsl(38 92% 60%)' : 'hsl(35 100% 50%)',
+        text: isDark ? '#fde68a' : '#663c00'
       },
       error: {
-        bg: isDark ? '#3a1216' : '#fee2e2',
-        border: '#ef4444',
-        text: isDark ? '#fecaca' : '#991b1b'
+        bg: isDark ? 'hsl(356 33% 16%)' : 'hsl(356 100% 97%)',
+        border: isDark ? 'hsl(350 89% 65%)' : 'hsl(350 89% 60%)',
+        text: isDark ? '#fecdd3' : '#9f1239'
       },
       success: {
-        bg: isDark ? '#0e2e1d' : '#d1fae5',
-        border: '#10b981',
+        bg: isDark ? 'hsl(152 36% 14%)' : 'hsl(152 81% 96%)',
+        border: isDark ? 'hsl(158 64% 52%)' : 'hsl(160 84% 39%)',
         text: isDark ? '#a7f3d0' : '#065f46'
       }
     };
+    palette.warning = palette.warn;
     const p = palette[lvl] || palette.info;
     return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
       style: _objectSpread2(_objectSpread2({}, card(isDark)), {}, {
@@ -88439,6 +88524,740 @@
     });
   }
 
+  // ── Cross-industry primitives (14-08-2026) ──────────────────────────────
+  // menu/catalog, person profile, status timeline, rating/review, pricing
+  // comparison, image gallery. Plain inline styles + isDark ternaries, same
+  // convention as everything above - mirrors
+  // packages/frontend/src/components/charts/A2uiBlock.tsx's Tailwind
+  // versions but hand-rolled here (no Tailwind runtime in the widget bundle).
+
+  const BRAND_BLUE = '#2563eb';
+  function tagChipStyle(isDark) {
+    return {
+      display: 'inline-flex',
+      alignItems: 'center',
+      borderRadius: 999,
+      padding: '2px 8px',
+      fontSize: 10,
+      fontWeight: 600,
+      background: isDark ? 'rgba(37,99,235,0.20)' : '#eff6ff',
+      color: isDark ? '#93c5fd' : '#1d4ed8'
+    };
+  }
+  function primaryButtonStyle(isDark, disabled) {
+    return {
+      display: 'inline-flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      padding: '6px 12px',
+      borderRadius: 6,
+      fontSize: 12,
+      fontWeight: 600,
+      border: 'none',
+      background: BRAND_BLUE,
+      color: '#ffffff',
+      cursor: disabled ? 'default' : 'pointer',
+      opacity: disabled ? 0.5 : 1
+    };
+  }
+  function secondaryButtonStyle(isDark, disabled) {
+    return {
+      display: 'inline-flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      padding: '6px 12px',
+      borderRadius: 6,
+      fontSize: 12,
+      fontWeight: 600,
+      border: '1px solid ' + (isDark ? '#374151' : '#d1d5db'),
+      background: isDark ? '#1f2937' : '#ffffff',
+      color: isDark ? '#f3f4f6' : '#111827',
+      textDecoration: 'none',
+      cursor: disabled ? 'default' : 'pointer',
+      opacity: disabled ? 0.5 : 1
+    };
+  }
+  function StarRow(_ref19) {
+    let {
+      score,
+      maxScore = 5,
+      size = 14,
+      isDark
+    } = _ref19;
+    const stars = [];
+    for (let i = 0; i < maxScore; i += 1) {
+      const filled = score >= i + 1;
+      const half = !filled && score > i && score < i + 1;
+      stars.push(/*#__PURE__*/jsxRuntimeExports.jsxs("svg", {
+        width: size,
+        height: size,
+        viewBox: "0 0 24 24",
+        fill: filled ? '#fbbf24' : half ? "url(#a2ui-half-star-".concat(i, ")") : 'none',
+        stroke: filled || half ? '#fbbf24' : isDark ? '#4b5563' : '#d1d5db',
+        strokeWidth: "1.5",
+        children: [half && /*#__PURE__*/jsxRuntimeExports.jsx("defs", {
+          children: /*#__PURE__*/jsxRuntimeExports.jsxs("linearGradient", {
+            id: "a2ui-half-star-".concat(i),
+            children: [/*#__PURE__*/jsxRuntimeExports.jsx("stop", {
+              offset: "50%",
+              stopColor: "#fbbf24"
+            }), /*#__PURE__*/jsxRuntimeExports.jsx("stop", {
+              offset: "50%",
+              stopColor: "transparent"
+            })]
+          })
+        }), /*#__PURE__*/jsxRuntimeExports.jsx("polygon", {
+          points: "12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"
+        })]
+      }, i));
+    }
+    return /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+      style: {
+        display: 'flex',
+        alignItems: 'center',
+        gap: 1
+      },
+      children: stars
+    });
+  }
+
+  // ── 1. Menu (catalog / product / service list) ──
+
+  function Menu(_ref20) {
+    let {
+      spec,
+      isDark,
+      onButtonClick
+    } = _ref20;
+    const items = Array.isArray(spec.items) ? spec.items : [];
+    if (items.length === 0) return null;
+    const border = isDark ? '1px solid #374151' : '1px solid #e5e7eb';
+    const subColor = isDark ? '#9ca3af' : '#6b7280';
+    return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+      style: {
+        margin: '8px 0'
+      },
+      children: [(spec.title || spec.subtitle) && /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+        style: {
+          marginBottom: 8
+        },
+        children: [spec.title && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+          style: {
+            fontSize: 13,
+            fontWeight: 700
+          },
+          children: spec.title
+        }), spec.subtitle && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+          style: {
+            fontSize: 11,
+            color: subColor
+          },
+          children: spec.subtitle
+        })]
+      }), /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        style: {
+          display: 'grid',
+          gridTemplateColumns: 'repeat(auto-fit, minmax(160px, 1fr))',
+          gap: 10
+        },
+        children: items.map((item, i) => /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+          style: {
+            border,
+            borderRadius: 10,
+            overflow: 'hidden',
+            background: isDark ? '#1f2937' : '#ffffff',
+            display: 'flex',
+            flexDirection: 'column'
+          },
+          children: [item.image && /*#__PURE__*/jsxRuntimeExports.jsx("img", {
+            src: item.image,
+            alt: item.name || '',
+            referrerPolicy: "no-referrer",
+            onError: e => {
+              e.currentTarget.style.display = 'none';
+            },
+            style: {
+              height: 96,
+              width: '100%',
+              objectFit: 'cover',
+              background: isDark ? '#111827' : '#f9fafb'
+            }
+          }), /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+            style: {
+              padding: 10,
+              display: 'flex',
+              flexDirection: 'column',
+              gap: 6,
+              flex: 1
+            },
+            children: [/*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+              style: {
+                display: 'flex',
+                justifyContent: 'space-between',
+                gap: 6,
+                alignItems: 'flex-start'
+              },
+              children: [/*#__PURE__*/jsxRuntimeExports.jsx("div", {
+                style: {
+                  fontSize: 12,
+                  fontWeight: 700,
+                  minWidth: 0
+                },
+                children: item.name
+              }), item.price && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+                style: {
+                  fontSize: 12,
+                  fontWeight: 700,
+                  color: BRAND_BLUE,
+                  flexShrink: 0
+                },
+                children: item.price
+              })]
+            }), item.description && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+              style: {
+                fontSize: 11,
+                color: subColor,
+                lineHeight: 1.4
+              },
+              children: item.description
+            }), Array.isArray(item.tags) && item.tags.length > 0 && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+              style: {
+                display: 'flex',
+                flexWrap: 'wrap',
+                gap: 4
+              },
+              children: item.tags.map((t, ti) => /*#__PURE__*/jsxRuntimeExports.jsx("span", {
+                style: tagChipStyle(isDark),
+                children: t
+              }, ti))
+            }), /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+              style: {
+                flex: 1
+              }
+            }), item.actionLabel && /*#__PURE__*/jsxRuntimeExports.jsx("button", {
+              type: "button",
+              onClick: onButtonClick ? () => {
+                var _item$value;
+                return onButtonClick(String((_item$value = item.value) !== null && _item$value !== void 0 ? _item$value : item.actionLabel), String(item.actionLabel));
+              } : undefined,
+              disabled: !onButtonClick,
+              style: _objectSpread2(_objectSpread2({}, primaryButtonStyle(isDark, !onButtonClick)), {}, {
+                alignSelf: 'flex-start',
+                marginTop: 4
+              }),
+              children: item.actionLabel
+            })]
+          })]
+        }, i))
+      })]
+    });
+  }
+
+  // ── 2. Profile (person card: doctor / agent / seller) ──
+
+  function Profile(_ref21) {
+    let {
+      spec,
+      isDark,
+      onButtonClick
+    } = _ref21;
+    const tags = Array.isArray(spec.tags) ? spec.tags : [];
+    const actions = Array.isArray(spec.actions) ? spec.actions : [];
+    const subColor = isDark ? '#9ca3af' : '#6b7280';
+    return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+      style: card(isDark),
+      children: [/*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+        style: {
+          display: 'flex',
+          gap: 10,
+          alignItems: 'flex-start'
+        },
+        children: [/*#__PURE__*/jsxRuntimeExports.jsx("div", {
+          style: {
+            flexShrink: 0,
+            height: 44,
+            width: 44,
+            borderRadius: '50%',
+            overflow: 'hidden',
+            background: isDark ? 'rgba(37,99,235,0.20)' : '#eff6ff',
+            color: isDark ? '#93c5fd' : BRAND_BLUE,
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            fontWeight: 700,
+            fontSize: 16
+          },
+          children: spec.avatar ? /*#__PURE__*/jsxRuntimeExports.jsx("img", {
+            src: spec.avatar,
+            alt: spec.name || '',
+            referrerPolicy: "no-referrer",
+            onError: e => {
+              e.currentTarget.style.display = 'none';
+            },
+            style: {
+              height: '100%',
+              width: '100%',
+              objectFit: 'cover'
+            }
+          }) : String(spec.name || '').charAt(0).toUpperCase()
+        }), /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+          style: {
+            minWidth: 0,
+            flex: 1
+          },
+          children: [/*#__PURE__*/jsxRuntimeExports.jsx("div", {
+            style: {
+              fontSize: 13,
+              fontWeight: 700
+            },
+            children: spec.name
+          }), spec.role && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+            style: {
+              fontSize: 11,
+              color: subColor
+            },
+            children: spec.role
+          }), typeof spec.rating === 'number' && /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+            style: {
+              marginTop: 4,
+              display: 'flex',
+              alignItems: 'center',
+              gap: 6
+            },
+            children: [/*#__PURE__*/jsxRuntimeExports.jsx(StarRow, {
+              score: spec.rating,
+              size: 11,
+              isDark: isDark
+            }), /*#__PURE__*/jsxRuntimeExports.jsxs("span", {
+              style: {
+                fontSize: 10,
+                color: subColor
+              },
+              children: [spec.rating.toFixed(1), typeof spec.reviewCount === 'number' ? " (".concat(spec.reviewCount, ")") : '']
+            })]
+          })]
+        })]
+      }), tags.length > 0 && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        style: {
+          display: 'flex',
+          flexWrap: 'wrap',
+          gap: 4,
+          marginTop: 8
+        },
+        children: tags.map((t, i) => /*#__PURE__*/jsxRuntimeExports.jsx("span", {
+          style: tagChipStyle(isDark),
+          children: t
+        }, i))
+      }), spec.bio && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        style: {
+          marginTop: 8,
+          fontSize: 12,
+          lineHeight: 1.5
+        },
+        children: spec.bio
+      }), actions.length > 0 && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        style: {
+          display: 'flex',
+          flexWrap: 'wrap',
+          gap: 6,
+          marginTop: 10
+        },
+        children: actions.map((a, i) => {
+          const primary = a.variant !== 'secondary';
+          if (a.url) {
+            return /*#__PURE__*/jsxRuntimeExports.jsx("a", {
+              href: a.url,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              style: secondaryButtonStyle(isDark, false),
+              children: a.label
+            }, i);
+          }
+          const value = a.value || a.label;
+          return /*#__PURE__*/jsxRuntimeExports.jsx("button", {
+            type: "button",
+            onClick: onButtonClick ? () => onButtonClick(String(value), String(a.label)) : undefined,
+            disabled: !onButtonClick,
+            style: primary ? primaryButtonStyle(isDark, !onButtonClick) : secondaryButtonStyle(isDark, !onButtonClick),
+            children: a.label
+          }, i);
+        })
+      })]
+    });
+  }
+
+  // ── 3. Timeline (status stepper: order tracking, appointment stages) ──
+
+  function Timeline(_ref22) {
+    let {
+      spec,
+      isDark
+    } = _ref22;
+    const steps = Array.isArray(spec.steps) ? spec.steps : [];
+    if (steps.length === 0) return null;
+    const lineColor = isDark ? '#374151' : '#e5e7eb';
+    const subColor = isDark ? '#6b7280' : '#9ca3af';
+    const dotStyle = status => {
+      if (status === 'done') return {
+        background: '#10b981',
+        border: '2px solid #10b981'
+      };
+      if (status === 'active') return {
+        background: BRAND_BLUE,
+        border: "2px solid ".concat(BRAND_BLUE),
+        boxShadow: isDark ? '0 0 0 4px rgba(37,99,235,0.25)' : '0 0 0 4px #dbeafe'
+      };
+      return {
+        background: isDark ? '#1f2937' : '#ffffff',
+        border: '2px solid ' + (isDark ? '#4b5563' : '#d1d5db')
+      };
+    };
+    return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+      style: card(isDark),
+      children: [spec.title && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        style: {
+          fontWeight: 700,
+          fontSize: 13,
+          marginBottom: 10
+        },
+        children: spec.title
+      }), /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        children: steps.map((s, i) => {
+          const status = s.status || (i === 0 ? 'done' : 'pending');
+          const isLast = i === steps.length - 1;
+          return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+            style: {
+              display: 'flex',
+              gap: 10
+            },
+            children: [/*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+              style: {
+                display: 'flex',
+                flexDirection: 'column',
+                alignItems: 'center'
+              },
+              children: [/*#__PURE__*/jsxRuntimeExports.jsx("div", {
+                style: _objectSpread2({
+                  height: 12,
+                  width: 12,
+                  borderRadius: '50%',
+                  flexShrink: 0
+                }, dotStyle(status))
+              }), !isLast && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+                style: {
+                  width: 1,
+                  flex: 1,
+                  background: lineColor,
+                  minHeight: 16,
+                  margin: '2px 0'
+                }
+              })]
+            }), /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+              style: {
+                minWidth: 0,
+                flex: 1,
+                paddingBottom: isLast ? 0 : 12
+              },
+              children: [/*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+                style: {
+                  display: 'flex',
+                  justifyContent: 'space-between',
+                  gap: 6
+                },
+                children: [/*#__PURE__*/jsxRuntimeExports.jsx("span", {
+                  style: {
+                    fontSize: 12,
+                    fontWeight: 600,
+                    color: status === 'pending' ? subColor : isDark ? '#f3f4f6' : '#111827'
+                  },
+                  children: s.label
+                }), s.timestamp && /*#__PURE__*/jsxRuntimeExports.jsx("span", {
+                  style: {
+                    fontSize: 10,
+                    color: subColor,
+                    flexShrink: 0
+                  },
+                  children: s.timestamp
+                })]
+              }), s.description && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+                style: {
+                  fontSize: 11,
+                  color: isDark ? '#9ca3af' : '#6b7280',
+                  marginTop: 2
+                },
+                children: s.description
+              })]
+            })]
+          }, i);
+        })
+      })]
+    });
+  }
+
+  // ── 4. Rating (score + review) ──
+
+  function Rating(_ref23) {
+    let {
+      spec,
+      isDark
+    } = _ref23;
+    const maxScore = spec.maxScore || 5;
+    const subColor = isDark ? '#9ca3af' : '#6b7280';
+    return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+      style: card(isDark),
+      children: [spec.title && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        style: {
+          fontSize: 11,
+          textTransform: 'uppercase',
+          letterSpacing: '0.05em',
+          color: subColor,
+          marginBottom: 4
+        },
+        children: spec.title
+      }), /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+        style: {
+          display: 'flex',
+          alignItems: 'center',
+          gap: 8
+        },
+        children: [/*#__PURE__*/jsxRuntimeExports.jsx("span", {
+          style: {
+            fontSize: 22,
+            fontWeight: 700
+          },
+          children: Number(spec.score).toFixed(1)
+        }), /*#__PURE__*/jsxRuntimeExports.jsx(StarRow, {
+          score: spec.score,
+          maxScore: maxScore,
+          size: 15,
+          isDark: isDark
+        }), typeof spec.reviewCount === 'number' && /*#__PURE__*/jsxRuntimeExports.jsxs("span", {
+          style: {
+            fontSize: 11,
+            color: subColor
+          },
+          children: ["(", spec.reviewCount, " review", spec.reviewCount === 1 ? '' : 's', ")"]
+        })]
+      }), spec.review && /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+        style: {
+          marginTop: 8,
+          borderLeft: '2px solid ' + (isDark ? '#1e40af' : '#bfdbfe'),
+          paddingLeft: 10,
+          fontSize: 12,
+          fontStyle: 'italic',
+          color: isDark ? '#d1d5db' : '#374151',
+          lineHeight: 1.5
+        },
+        children: ["\"", spec.review, "\"", spec.author && /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+          style: {
+            marginTop: 4,
+            fontStyle: 'normal',
+            fontSize: 10,
+            color: subColor
+          },
+          children: ["- ", spec.author]
+        })]
+      })]
+    });
+  }
+
+  // ── 5. Comparison (pricing tiers / plan comparison) ──
+
+  function Comparison(_ref24) {
+    let {
+      spec,
+      isDark,
+      onButtonClick
+    } = _ref24;
+    const plans = Array.isArray(spec.plans) ? spec.plans : [];
+    if (plans.length === 0) return null;
+    const subColor = isDark ? '#9ca3af' : '#6b7280';
+    return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+      style: {
+        margin: '8px 0'
+      },
+      children: [spec.title && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        style: {
+          fontWeight: 700,
+          fontSize: 13,
+          marginBottom: 8
+        },
+        children: spec.title
+      }), /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        style: {
+          display: 'grid',
+          gridTemplateColumns: 'repeat(auto-fit, minmax(150px, 1fr))',
+          gap: 10
+        },
+        children: plans.map((p, i) => /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+          style: {
+            border: p.highlight ? "1px solid ".concat(BRAND_BLUE) : '1px solid ' + (isDark ? '#374151' : '#e5e7eb'),
+            background: p.highlight ? isDark ? 'rgba(37,99,235,0.10)' : '#eff6ff' : isDark ? '#1f2937' : '#ffffff',
+            borderRadius: 10,
+            padding: 12,
+            display: 'flex',
+            flexDirection: 'column'
+          },
+          children: [p.highlight && /*#__PURE__*/jsxRuntimeExports.jsx("span", {
+            style: {
+              alignSelf: 'flex-start',
+              marginBottom: 6,
+              background: BRAND_BLUE,
+              color: '#ffffff',
+              fontSize: 9,
+              fontWeight: 700,
+              padding: '2px 7px',
+              borderRadius: 999
+            },
+            children: "Recommended"
+          }), /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+            style: {
+              fontSize: 13,
+              fontWeight: 700
+            },
+            children: p.name
+          }), p.price && /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+            style: {
+              marginTop: 2,
+              display: 'flex',
+              alignItems: 'baseline',
+              gap: 3
+            },
+            children: [/*#__PURE__*/jsxRuntimeExports.jsx("span", {
+              style: {
+                fontSize: 18,
+                fontWeight: 700
+              },
+              children: p.price
+            }), p.period && /*#__PURE__*/jsxRuntimeExports.jsxs("span", {
+              style: {
+                fontSize: 11,
+                color: subColor
+              },
+              children: ["/", p.period]
+            })]
+          }), Array.isArray(p.features) && p.features.length > 0 && /*#__PURE__*/jsxRuntimeExports.jsx("ul", {
+            style: {
+              listStyle: 'none',
+              padding: 0,
+              margin: '8px 0 0',
+              display: 'flex',
+              flexDirection: 'column',
+              gap: 6,
+              flex: 1
+            },
+            children: p.features.map((f, fi) => /*#__PURE__*/jsxRuntimeExports.jsxs("li", {
+              style: {
+                display: 'flex',
+                gap: 6,
+                alignItems: 'flex-start',
+                fontSize: 11,
+                color: isDark ? '#d1d5db' : '#374151'
+              },
+              children: [/*#__PURE__*/jsxRuntimeExports.jsx("svg", {
+                width: "12",
+                height: "12",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "#10b981",
+                strokeWidth: "3",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                style: {
+                  marginTop: 2,
+                  flexShrink: 0
+                },
+                children: /*#__PURE__*/jsxRuntimeExports.jsx("polyline", {
+                  points: "20 6 9 17 4 12"
+                })
+              }), /*#__PURE__*/jsxRuntimeExports.jsx("span", {
+                children: f
+              })]
+            }, fi))
+          }), p.actionLabel && /*#__PURE__*/jsxRuntimeExports.jsx("button", {
+            type: "button",
+            onClick: onButtonClick ? () => {
+              var _p$value;
+              return onButtonClick(String((_p$value = p.value) !== null && _p$value !== void 0 ? _p$value : p.actionLabel), String(p.actionLabel));
+            } : undefined,
+            disabled: !onButtonClick,
+            style: _objectSpread2(_objectSpread2({}, p.highlight ? primaryButtonStyle(isDark, !onButtonClick) : secondaryButtonStyle(isDark, !onButtonClick)), {}, {
+              marginTop: 10
+            }),
+            children: p.actionLabel
+          })]
+        }, i))
+      })]
+    });
+  }
+
+  // ── 6. Gallery (horizontal image strip) ──
+
+  function Gallery(_ref25) {
+    let {
+      spec,
+      isDark
+    } = _ref25;
+    const images = Array.isArray(spec.images) ? spec.images : [];
+    if (images.length === 0) return null;
+    const subColor = isDark ? '#9ca3af' : '#6b7280';
+    return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+      style: {
+        margin: '8px 0'
+      },
+      children: [spec.title && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        style: {
+          fontWeight: 700,
+          fontSize: 13,
+          marginBottom: 8
+        },
+        children: spec.title
+      }), /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        className: "slim-scrollbar-x",
+        style: {
+          display: 'flex',
+          gap: 8,
+          overflowX: 'auto',
+          paddingBottom: 4
+        },
+        children: images.map((img, i) => /*#__PURE__*/jsxRuntimeExports.jsxs("figure", {
+          style: {
+            flexShrink: 0,
+            width: 140,
+            margin: 0,
+            borderRadius: 8,
+            overflow: 'hidden',
+            border: '1px solid ' + (isDark ? '#374151' : '#e5e7eb'),
+            background: isDark ? '#111827' : '#f9fafb'
+          },
+          children: [/*#__PURE__*/jsxRuntimeExports.jsx("img", {
+            src: img.url,
+            alt: img.caption || "Image ".concat(i + 1),
+            referrerPolicy: "no-referrer",
+            onError: e => {
+              e.currentTarget.style.display = 'none';
+            },
+            style: {
+              height: 96,
+              width: '100%',
+              objectFit: 'cover'
+            }
+          }), img.caption && /*#__PURE__*/jsxRuntimeExports.jsx("figcaption", {
+            style: {
+              padding: '5px 8px',
+              fontSize: 10,
+              color: subColor,
+              whiteSpace: 'nowrap',
+              overflow: 'hidden',
+              textOverflow: 'ellipsis'
+            },
+            children: img.caption
+          })]
+        }, i))
+      })]
+    });
+  }
+
   // ── 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
@@ -88560,10 +89379,10 @@
 
   // ── Lucide-style SVG icons (sharp, monoline, inherit color via currentColor)
 
-  function IconTrendingUp(_ref19) {
+  function IconTrendingUp(_ref26) {
     let {
       size = 14
-    } = _ref19;
+    } = _ref26;
     return /*#__PURE__*/jsxRuntimeExports.jsxs("svg", {
       width: size,
       height: size,
@@ -88581,10 +89400,10 @@
       })]
     });
   }
-  function IconScale(_ref20) {
+  function IconScale(_ref27) {
     let {
       size = 14
-    } = _ref20;
+    } = _ref27;
     return /*#__PURE__*/jsxRuntimeExports.jsxs("svg", {
       width: size,
       height: size,
@@ -88610,10 +89429,10 @@
       })]
     });
   }
-  function IconGitCompare(_ref21) {
+  function IconGitCompare(_ref28) {
     let {
       size = 14
-    } = _ref21;
+    } = _ref28;
     return /*#__PURE__*/jsxRuntimeExports.jsxs("svg", {
       width: size,
       height: size,
@@ -88639,10 +89458,10 @@
       })]
     });
   }
-  function IconZap(_ref22) {
+  function IconZap(_ref29) {
     let {
       size = 14
-    } = _ref22;
+    } = _ref29;
     return /*#__PURE__*/jsxRuntimeExports.jsx("svg", {
       width: size,
       height: size,
@@ -88658,10 +89477,10 @@
       })
     });
   }
-  function IconLightbulb(_ref23) {
+  function IconLightbulb(_ref30) {
     let {
       size = 14
-    } = _ref23;
+    } = _ref30;
     return /*#__PURE__*/jsxRuntimeExports.jsxs("svg", {
       width: size,
       height: size,
@@ -88681,10 +89500,10 @@
       })]
     });
   }
-  function IconTarget(_ref24) {
+  function IconTarget(_ref31) {
     let {
       size = 14
-    } = _ref24;
+    } = _ref31;
     return /*#__PURE__*/jsxRuntimeExports.jsxs("svg", {
       width: size,
       height: size,
@@ -88733,7 +89552,7 @@
 
   // ── Shared shell for all six insight cards ──
 
-  function InsightShell(_ref25) {
+  function InsightShell(_ref32) {
     let {
       type,
       icon,
@@ -88741,7 +89560,7 @@
       count,
       isDark,
       children
-    } = _ref25;
+    } = _ref32;
     const {
       accent,
       iconBg,
@@ -88820,11 +89639,11 @@
     if (s.startsWith('-') || s.startsWith('−')) return 'dn';
     return 'flat';
   }
-  function DeltaTag(_ref26) {
+  function DeltaTag(_ref33) {
     let {
       delta,
       isDark
-    } = _ref26;
+    } = _ref33;
     if (!delta) return null;
     const tone = deltaToneInsights(delta);
     const map = isDark ? {
@@ -88868,11 +89687,11 @@
       children: delta
     });
   }
-  function MetricChipsInsights(_ref27) {
+  function MetricChipsInsights(_ref34) {
     let {
       items,
       isDark
-    } = _ref27;
+    } = _ref34;
     if (!items || !items.length) return null;
     const border = isDark ? '1px solid #374151' : '1px solid #e5e7eb';
     const labelCol = isDark ? '#9ca3af' : '#64748b';
@@ -88919,11 +89738,11 @@
 
   // ── 1. Revenue Insights ──
 
-  function RevenueInsightsCard(_ref28) {
+  function RevenueInsightsCard(_ref35) {
     let {
       spec,
       isDark
-    } = _ref28;
+    } = _ref35;
     const totals = Array.isArray(spec.totals) ? spec.totals : [];
     const narrCol = isDark ? '#9ca3af' : '#64748b';
     return /*#__PURE__*/jsxRuntimeExports.jsxs(InsightShell, {
@@ -88983,12 +89802,12 @@
 
   // ── 2. Impact Analysis ──
 
-  function ImpactGroupBlock(_ref29) {
+  function ImpactGroupBlock(_ref36) {
     let {
       items,
       sentiment,
       isDark
-    } = _ref29;
+    } = _ref36;
     if (!items || items.length === 0) return null;
     const label = sentiment === 'positive' ? 'Positive impact' : sentiment === 'negative' ? 'Negative impact' : 'Neutral';
     const subColor = isDark ? '#9ca3af' : '#64748b';
@@ -89054,11 +89873,11 @@
       }, i))]
     });
   }
-  function ImpactAnalysisCard(_ref30) {
+  function ImpactAnalysisCard(_ref37) {
     let {
       spec,
       isDark
-    } = _ref30;
+    } = _ref37;
     return /*#__PURE__*/jsxRuntimeExports.jsxs(InsightShell, {
       type: "impact-analysis",
       icon: /*#__PURE__*/jsxRuntimeExports.jsx(IconScale, {}),
@@ -89083,11 +89902,11 @@
 
   // ── 3. Deviation Analysis ──
 
-  function DeviationAnalysisCard(_ref31) {
+  function DeviationAnalysisCard(_ref38) {
     let {
       spec,
       isDark
-    } = _ref31;
+    } = _ref38;
     const rows = Array.isArray(spec.deviations) ? spec.deviations : [];
     const border = isDark ? '1px solid #374151' : '1px solid #e5e7eb';
     const headColor = isDark ? '#9ca3af' : '#64748b';
@@ -89199,11 +90018,11 @@
 
   // ── 4. Main Drivers ──
 
-  function MainDriversCard(_ref32) {
+  function MainDriversCard(_ref39) {
     let {
       spec,
       isDark
-    } = _ref32;
+    } = _ref39;
     const sec = Array.isArray(spec.secondary) ? spec.secondary : [];
     const evidenceColor = isDark ? '#9ca3af' : '#64748b';
     const subColor = isDark ? '#9ca3af' : '#64748b';
@@ -89298,7 +90117,7 @@
 
   // ── Shared item-row for Observations & Recommendations ──
 
-  function InsightItem(_ref33) {
+  function InsightItem(_ref40) {
     let {
       rankBgFg,
       rank,
@@ -89308,7 +90127,7 @@
       metrics,
       impactPill,
       isDark
-    } = _ref33;
+    } = _ref40;
     const narrCol = isDark ? '#9ca3af' : '#64748b';
     const dashedBorder = isDark ? '1px dashed #374151' : '1px dashed #e5e7eb';
     return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
@@ -89365,11 +90184,11 @@
 
   // ── 5. Key Observations ──
 
-  function KeyObservationsCard(_ref34) {
+  function KeyObservationsCard(_ref41) {
     let {
       spec,
       isDark
-    } = _ref34;
+    } = _ref41;
     const items = Array.isArray(spec.items) ? [...spec.items].sort((a, b) => (a.rank || 0) - (b.rank || 0)) : [];
     const rankBgFg = isDark ? {
       bg: '#064e3b',
@@ -89425,11 +90244,11 @@
 
   // ── 6. Recommendations ──
 
-  function RecommendationsCard(_ref35) {
+  function RecommendationsCard(_ref42) {
     let {
       spec,
       isDark
-    } = _ref35;
+    } = _ref42;
     const items = Array.isArray(spec.items) ? [...spec.items].sort((a, b) => (a.rank || 0) - (b.rank || 0)) : [];
     const rankBgFg = isDark ? {
       bg: '#312e81',
@@ -90417,8 +91236,12 @@
       provideCitations = true
     } = _ref;
     return /*#__PURE__*/jsxRuntimeExports.jsx(Markdown, {
-      className: "max-w-none [&>*:last-child]:!mb-0 [&>*:first-child]:!mt-0",
-      remarkPlugins: [remarkGfm]
+      className: "max-w-none [&>*:last-child]:!mb-0 [&>*:first-child]:!mt-0"
+      // remarkBreaks turns single `\n` line breaks into <br> instead of a
+      // markdown soft break (rendered as a space) - keeps agent-authored
+      // field-per-line summaries readable (EV-2699).
+      ,
+      remarkPlugins: [remarkGfm, remarkBreaks]
       // Skip the rehypeCitations plugin when the org opted out -
       // markers then render as plain text so nothing squeaks
       // through as a placeholder pill.