@elevasis/ui 2.52.1 → 2.53.0

package/dist/features/public-agent-chat/index.js

@@ -3,7 +3,7 @@ import { ChatInterface } from '../../chunk-E6NSKXYN.js';
 import { WS_MAX_RETRIES_BEFORE_ERROR, WS_RECONNECT_BASE_DELAY, WS_RECONNECT_MAX_DELAY, validateTokenLimit, TOKEN_LIMITS } from '../../chunk-FVOMKZ7S.js';
 import '../../chunk-TVTSASST.js';
 import '../../chunk-I2KLQ2HA.js';
-import { Center, Loader, Paper, Stack, Group, Title, Alert, PasswordInput, Button, Text, Box, Badge, Divider } from '@mantine/core';
+import { Center, Loader, Paper, Stack, Group, Title, Alert, PasswordInput, Button, Text, List, Box, Badge, Divider } from '@mantine/core';
 import { IconLock, IconAlertCircle, IconSend, IconMessageCircle } from '@tabler/icons-react';
 import { useState, useRef, useCallback, useEffect, useMemo } from 'react';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
@@ -200,7 +200,14 @@ function usePublicAgentChatWebSocket(sessionId, apiUrl, capabilityToken) {
 async function fetchJson(url, init) {
   const response = await fetch(url, init);
   if (!response.ok) {
-    throw new Error(`Request failed with status ${response.status}`);
+    let message = `Request failed with status ${response.status}`;
+    try {
+      const body = await response.json();
+      const apiMessage = typeof body.error === "string" && body.error.trim().length > 0 ? body.error : typeof body.message === "string" && body.message.trim().length > 0 ? body.message : null;
+      if (apiMessage) message = apiMessage;
+    } catch {
+    }
+    throw new Error(message);
   }
   return await response.json();
 }
@@ -221,6 +228,12 @@ function resolveAgentSubtitle(grant) {
   const branding = brandingRecord(grant?.branding);
   return brandingText(branding.subtitle) ?? brandingText(branding.description);
 }
+function hasIntroContent(grant) {
+  const branding = brandingRecord(grant?.branding);
+  const hasIntroText = brandingText(branding.intro) !== void 0;
+  const hasInstructions = Array.isArray(branding.instructions) && branding.instructions.length > 0;
+  return hasIntroText || hasInstructions;
+}
 function statusStyles(tone) {
   if (tone === "ready") {
     return {
@@ -383,6 +396,7 @@ function PublicAgentChat({
   const [accessCode, setAccessCode] = useState("");
   const [input, setInput] = useState("");
   const autoStartedRef = useRef(false);
+  const greetingTimeRef = useRef(/* @__PURE__ */ new Date());
   const displayTitle = resolveAgentTitle(title, slug, grant);
   const displaySubtitle = resolveAgentSubtitle(grant);
   const { data: historyMessages = [] } = usePublicAgentChatMessages(apiUrl, session?.sessionId ?? null, capabilityToken);
@@ -403,7 +417,13 @@ function PublicAgentChat({
     fetchJson(`${apiUrl}/api/public/agent-chat/${encodeURIComponent(slug)}`).then((payload) => {
       if (cancelled) return;
       setGrant(payload.grant);
-      setStatus(payload.grant.requiresCode ? "code-required" : "authorizing");
+      if (payload.grant.requiresCode) {
+        setStatus("code-required");
+      } else if (hasIntroContent(payload.grant)) {
+        setStatus("intro");
+      } else {
+        setStatus("authorizing");
+      }
     }).catch((requestError) => {
       if (cancelled) return;
       setError(requestError instanceof Error ? requestError.message : "Unable to load agent chat");
@@ -454,16 +474,27 @@ function PublicAgentChat({
     [apiUrl, grant, metadata, onSessionReady, slug, visitorId]
   );
   useEffect(() => {
-    if (!grant || grant.requiresCode || autoStartedRef.current) {
+    if (!grant || grant.requiresCode || hasIntroContent(grant) || autoStartedRef.current) {
       return;
     }
     autoStartedRef.current = true;
     void startSession();
   }, [grant, startSession]);
-  const allMessages = useMemo(
-    () => mergeSessionMessages(historyMessages, liveMessages),
-    [historyMessages, liveMessages]
-  );
+  const allMessages = useMemo(() => {
+    const merged = mergeSessionMessages(historyMessages, liveMessages);
+    const greeting = brandingText(brandingRecord(grant?.branding).greeting);
+    if (!greeting) return merged;
+    const greetingMessage = {
+      id: "greeting-bubble",
+      role: "assistant",
+      messageType: "assistant_message",
+      text: greeting,
+      turnNumber: 0,
+      messageIndex: -1,
+      createdAt: greetingTimeRef.current
+    };
+    return [greetingMessage, ...merged];
+  }, [historyMessages, liveMessages, grant]);
   const handleSend = () => {
     const trimmed = input.trim();
     if (!trimmed || state.isProcessing) return;
@@ -536,6 +567,50 @@ function PublicAgentChat({
       }
     );
   }
+  if (status === "intro" && grant) {
+    const branding = brandingRecord(grant.branding);
+    const introText = brandingText(branding.intro);
+    const instructions = Array.isArray(branding.instructions) ? branding.instructions.filter((item) => typeof item === "string") : [];
+    const ctaLabel = brandingText(branding.ctaLabel) ?? "Start the conversation";
+    return /* @__PURE__ */ jsx(
+      PublicAgentChatFrame,
+      {
+        className,
+        style,
+        title: displayTitle,
+        subtitle: displaySubtitle,
+        statusTone: "ready",
+        children: /* @__PURE__ */ jsx(Center, { style: { height: "100%", padding: 16 }, children: /* @__PURE__ */ jsx(
+          Paper,
+          {
+            withBorder: true,
+            p: "xl",
+            radius: 8,
+            style: {
+              width: "min(100%, 480px)",
+              background: "var(--color-surface)",
+              borderColor: "var(--color-border)",
+              boxShadow: "var(--card-shadow)"
+            },
+            children: /* @__PURE__ */ jsxs(Stack, { gap: "lg", children: [
+              introText && /* @__PURE__ */ jsx(Text, { size: "sm", style: { color: "var(--color-text)", lineHeight: 1.6 }, children: introText }),
+              instructions.length > 0 && /* @__PURE__ */ jsx(List, { size: "sm", style: { color: "var(--color-text-dimmed)" }, children: instructions.map((item, index) => /* @__PURE__ */ jsx(List.Item, { children: item }, index)) }),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  onClick: () => {
+                    void startSession();
+                  },
+                  leftSection: /* @__PURE__ */ jsx(IconSend, { size: 16 }),
+                  children: ctaLabel
+                }
+              )
+            ] })
+          }
+        ) })
+      }
+    );
+  }
   if (status === "error") {
     return /* @__PURE__ */ jsx(
       PublicAgentChatFrame,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elevasis/ui",
-  "version": "2.52.1",
+  "version": "2.53.0",
   "description": "UI components and platform-aware hooks for building custom frontends on the Elevasis platform",
   "type": "module",
   "license": "MIT",
@@ -274,11 +274,11 @@
     "typescript": "5.9.2",
     "vite": "^7.0.0",
     "vitest": "^3.2.4",
-    "@elevasis/sdk": "1.36.2",
-    "@repo/core": "0.49.1",
+    "@elevasis/sdk": "1.36.3",
     "@repo/elevasis-core": "1.0.0",
-    "@repo/eslint-config": "0.0.0",
-    "@repo/typescript-config": "0.0.0"
+    "@repo/typescript-config": "0.0.0",
+    "@repo/core": "0.50.0",
+    "@repo/eslint-config": "0.0.0"
   },
   "dependencies": {
     "@dagrejs/dagre": "^1.1.4",