@informedai/react 0.4.18 → 0.4.20

package/dist/index.d.mts

@@ -31,6 +31,7 @@ interface QuickAction {
     id: string;
     label: string;
     action: string;
+    group?: string;
     payload?: Record<string, unknown>;
 }
 interface TaskState {
@@ -46,8 +47,18 @@ interface FieldDefinition {
     label: string;
     description?: string;
 }
+interface QuickActionGroup {
+    id: string;
+    label: string;
+    fieldNames: string[];
+}
 interface DocumentTypeSchema {
     fields: Record<string, FieldDefinition>;
+    orchestratorConfig?: {
+        greeting?: string;
+        quickActions?: QuickAction[];
+        quickActionGroups?: QuickActionGroup[];
+    };
 }
 interface DocumentType {
     id: string;
@@ -419,4 +430,4 @@ declare class InformedAIClient {
     private processSSEStream;
 }
 
-export { AdminChatbot, type AdminChatbotConfig, type AdminChatbotTheme, type ChatMessage, type Document, type DocumentType, type DocumentTypeSchema, type FieldDefinition, InformedAIClient, InformedAIProvider, InformedAssistant, type InformedAssistantConfig, type QuickAction, type SSEEvent, type Session, type TaskConfig, type TaskState, type UseSessionReturn, WebsiteChatbot, type WebsiteChatbotConfig, type WebsiteChatbotTheme, type WidgetMessage, type WidgetReadyContext, type WidgetTheme, useInformedAI, useSession };
+export { AdminChatbot, type AdminChatbotConfig, type AdminChatbotTheme, type ChatMessage, type Document, type DocumentType, type DocumentTypeSchema, type FieldDefinition, InformedAIClient, InformedAIProvider, InformedAssistant, type InformedAssistantConfig, type QuickAction, type QuickActionGroup, type SSEEvent, type Session, type TaskConfig, type TaskState, type UseSessionReturn, WebsiteChatbot, type WebsiteChatbotConfig, type WebsiteChatbotTheme, type WidgetMessage, type WidgetReadyContext, type WidgetTheme, useInformedAI, useSession };

package/dist/index.d.ts

@@ -31,6 +31,7 @@ interface QuickAction {
     id: string;
     label: string;
     action: string;
+    group?: string;
     payload?: Record<string, unknown>;
 }
 interface TaskState {
@@ -46,8 +47,18 @@ interface FieldDefinition {
     label: string;
     description?: string;
 }
+interface QuickActionGroup {
+    id: string;
+    label: string;
+    fieldNames: string[];
+}
 interface DocumentTypeSchema {
     fields: Record<string, FieldDefinition>;
+    orchestratorConfig?: {
+        greeting?: string;
+        quickActions?: QuickAction[];
+        quickActionGroups?: QuickActionGroup[];
+    };
 }
 interface DocumentType {
     id: string;
@@ -419,4 +430,4 @@ declare class InformedAIClient {
     private processSSEStream;
 }
 
-export { AdminChatbot, type AdminChatbotConfig, type AdminChatbotTheme, type ChatMessage, type Document, type DocumentType, type DocumentTypeSchema, type FieldDefinition, InformedAIClient, InformedAIProvider, InformedAssistant, type InformedAssistantConfig, type QuickAction, type SSEEvent, type Session, type TaskConfig, type TaskState, type UseSessionReturn, WebsiteChatbot, type WebsiteChatbotConfig, type WebsiteChatbotTheme, type WidgetMessage, type WidgetReadyContext, type WidgetTheme, useInformedAI, useSession };
+export { AdminChatbot, type AdminChatbotConfig, type AdminChatbotTheme, type ChatMessage, type Document, type DocumentType, type DocumentTypeSchema, type FieldDefinition, InformedAIClient, InformedAIProvider, InformedAssistant, type InformedAssistantConfig, type QuickAction, type QuickActionGroup, type SSEEvent, type Session, type TaskConfig, type TaskState, type UseSessionReturn, WebsiteChatbot, type WebsiteChatbotConfig, type WebsiteChatbotTheme, type WidgetMessage, type WidgetReadyContext, type WidgetTheme, useInformedAI, useSession };

package/dist/index.js

@@ -964,7 +964,8 @@ function AssistantWidget({ className, theme, position = "inline", defaultCollaps
                   message: msg,
                   theme,
                   onQuickAction: handleQuickAction,
-                  isLatest: index === session.widgetMessages.length - 1
+                  isLatest: index === session.widgetMessages.length - 1,
+                  quickActionGroups: documentType?.schema?.orchestratorConfig?.quickActionGroups
                 },
                 msg.id
               )),
@@ -1144,38 +1145,20 @@ function QuickActionButton({
     }
   );
 }
-function MessageBubble({ message, theme, onQuickAction, isLatest = false }) {
+function MessageBubble({ message, theme, onQuickAction, isLatest = false, quickActionGroups }) {
   const isUser = message.role === "user";
   const hasQuickActions = isLatest && message.quickActions && message.quickActions.length > 0;
   const hasKbSearch = message.kbSearch != null;
   if ((message.type === "quick_actions" || !message.content) && hasQuickActions) {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center",
-      gap: "8px",
-      padding: "12px 0"
-    }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { style: {
-        fontSize: "11px",
-        color: "#a3a3a3",
-        fontWeight: 500
-      }, children: "Quick actions:" }),
-      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: {
-        display: "flex",
-        flexWrap: "wrap",
-        justifyContent: "center",
-        gap: "8px"
-      }, children: message.quickActions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        QuickActionButton,
-        {
-          action,
-          theme,
-          onClick: () => onQuickAction(action)
-        },
-        action.id || action.action || index
-      )) })
-    ] });
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      GroupedQuickActions,
+      {
+        actions: message.quickActions,
+        groups: quickActionGroups,
+        theme,
+        onQuickAction
+      }
+    );
   }
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
     hasKbSearch && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
@@ -1231,7 +1214,21 @@ function MessageBubble({ message, theme, onQuickAction, isLatest = false }) {
         )
       }
     ),
-    hasQuickActions && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: {
+    hasQuickActions && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      GroupedQuickActions,
+      {
+        actions: message.quickActions,
+        groups: quickActionGroups,
+        theme,
+        onQuickAction
+      }
+    )
+  ] });
+}
+function GroupedQuickActions({ actions, groups, theme, onQuickAction }) {
+  const hasGroupedActions = actions.some((a) => a.group);
+  if (!hasGroupedActions) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: {
       display: "flex",
       flexDirection: "column",
       alignItems: "center",
@@ -1248,7 +1245,7 @@ function MessageBubble({ message, theme, onQuickAction, isLatest = false }) {
         flexWrap: "wrap",
         justifyContent: "center",
         gap: "8px"
-      }, children: message.quickActions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      }, children: actions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
         QuickActionButton,
         {
           action,
@@ -1257,8 +1254,73 @@ function MessageBubble({ message, theme, onQuickAction, isLatest = false }) {
         },
         action.id || action.action || index
       )) })
-    ] })
-  ] });
+    ] });
+  }
+  const groupLabelMap = /* @__PURE__ */ new Map();
+  if (groups) {
+    for (const g of groups) {
+      groupLabelMap.set(g.id, g.label);
+    }
+  }
+  const grouped = {};
+  const groupOrder = [];
+  for (const action of actions) {
+    const groupKey = action.group || "_default";
+    if (!grouped[groupKey]) {
+      grouped[groupKey] = [];
+      groupOrder.push(groupKey);
+    }
+    grouped[groupKey].push(action);
+  }
+  if (groups) {
+    groupOrder.sort((a, b) => {
+      if (a === "_default") return 1;
+      if (b === "_default") return -1;
+      const aIdx = groups.findIndex((g) => g.id === a);
+      const bIdx = groups.findIndex((g) => g.id === b);
+      return (aIdx === -1 ? 999 : aIdx) - (bIdx === -1 ? 999 : bIdx);
+    });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    gap: "12px",
+    padding: "12px 0"
+  }, children: groupOrder.map((groupKey) => {
+    const groupActions = grouped[groupKey];
+    const label = groupKey === "_default" ? "Quick actions" : groupLabelMap.get(groupKey) || groupKey;
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      gap: "8px",
+      width: "100%"
+    }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { style: {
+        fontSize: "11px",
+        color: "#a3a3a3",
+        fontWeight: 500
+      }, children: [
+        label,
+        ":"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: {
+        display: "flex",
+        flexWrap: "wrap",
+        justifyContent: "center",
+        gap: "8px"
+      }, children: groupActions.map((action, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        QuickActionButton,
+        {
+          action,
+          theme,
+          onClick: () => onQuickAction(action)
+        },
+        action.id || action.action || index
+      )) })
+    ] }, groupKey);
+  }) });
 }
 function SparklesIcon({ color = "currentColor" }) {
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", children: [
@@ -2089,8 +2151,8 @@ function WebsiteChatbot({ className, ...config }) {
       style: {
         ...cssVars,
         ...positionStyles,
-        width: config.position === "inline" ? "100%" : "400px",
-        maxHeight: config.position === "inline" ? "600px" : "80vh",
+        width: config.position === "inline" ? "100%" : "380px",
+        maxHeight: config.position === "inline" ? "600px" : "500px",
         backgroundColor: "var(--wc-bg)",
         borderRadius: "var(--wc-radius)",
         border: "1px solid #e5e5e5",

package/dist/index.mjs

@@ -932,7 +932,8 @@ function AssistantWidget({ className, theme, position = "inline", defaultCollaps
                   message: msg,
                   theme,
                   onQuickAction: handleQuickAction,
-                  isLatest: index === session.widgetMessages.length - 1
+                  isLatest: index === session.widgetMessages.length - 1,
+                  quickActionGroups: documentType?.schema?.orchestratorConfig?.quickActionGroups
                 },
                 msg.id
               )),
@@ -1112,38 +1113,20 @@ function QuickActionButton({
     }
   );
 }
-function MessageBubble({ message, theme, onQuickAction, isLatest = false }) {
+function MessageBubble({ message, theme, onQuickAction, isLatest = false, quickActionGroups }) {
   const isUser = message.role === "user";
   const hasQuickActions = isLatest && message.quickActions && message.quickActions.length > 0;
   const hasKbSearch = message.kbSearch != null;
   if ((message.type === "quick_actions" || !message.content) && hasQuickActions) {
-    return /* @__PURE__ */ jsxs("div", { style: {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center",
-      gap: "8px",
-      padding: "12px 0"
-    }, children: [
-      /* @__PURE__ */ jsx2("span", { style: {
-        fontSize: "11px",
-        color: "#a3a3a3",
-        fontWeight: 500
-      }, children: "Quick actions:" }),
-      /* @__PURE__ */ jsx2("div", { style: {
-        display: "flex",
-        flexWrap: "wrap",
-        justifyContent: "center",
-        gap: "8px"
-      }, children: message.quickActions.map((action, index) => /* @__PURE__ */ jsx2(
-        QuickActionButton,
-        {
-          action,
-          theme,
-          onClick: () => onQuickAction(action)
-        },
-        action.id || action.action || index
-      )) })
-    ] });
+    return /* @__PURE__ */ jsx2(
+      GroupedQuickActions,
+      {
+        actions: message.quickActions,
+        groups: quickActionGroups,
+        theme,
+        onQuickAction
+      }
+    );
   }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     hasKbSearch && /* @__PURE__ */ jsxs(
@@ -1199,7 +1182,21 @@ function MessageBubble({ message, theme, onQuickAction, isLatest = false }) {
         )
       }
     ),
-    hasQuickActions && /* @__PURE__ */ jsxs("div", { style: {
+    hasQuickActions && /* @__PURE__ */ jsx2(
+      GroupedQuickActions,
+      {
+        actions: message.quickActions,
+        groups: quickActionGroups,
+        theme,
+        onQuickAction
+      }
+    )
+  ] });
+}
+function GroupedQuickActions({ actions, groups, theme, onQuickAction }) {
+  const hasGroupedActions = actions.some((a) => a.group);
+  if (!hasGroupedActions) {
+    return /* @__PURE__ */ jsxs("div", { style: {
       display: "flex",
       flexDirection: "column",
       alignItems: "center",
@@ -1216,7 +1213,7 @@ function MessageBubble({ message, theme, onQuickAction, isLatest = false }) {
         flexWrap: "wrap",
         justifyContent: "center",
         gap: "8px"
-      }, children: message.quickActions.map((action, index) => /* @__PURE__ */ jsx2(
+      }, children: actions.map((action, index) => /* @__PURE__ */ jsx2(
         QuickActionButton,
         {
           action,
@@ -1225,8 +1222,73 @@ function MessageBubble({ message, theme, onQuickAction, isLatest = false }) {
         },
         action.id || action.action || index
       )) })
-    ] })
-  ] });
+    ] });
+  }
+  const groupLabelMap = /* @__PURE__ */ new Map();
+  if (groups) {
+    for (const g of groups) {
+      groupLabelMap.set(g.id, g.label);
+    }
+  }
+  const grouped = {};
+  const groupOrder = [];
+  for (const action of actions) {
+    const groupKey = action.group || "_default";
+    if (!grouped[groupKey]) {
+      grouped[groupKey] = [];
+      groupOrder.push(groupKey);
+    }
+    grouped[groupKey].push(action);
+  }
+  if (groups) {
+    groupOrder.sort((a, b) => {
+      if (a === "_default") return 1;
+      if (b === "_default") return -1;
+      const aIdx = groups.findIndex((g) => g.id === a);
+      const bIdx = groups.findIndex((g) => g.id === b);
+      return (aIdx === -1 ? 999 : aIdx) - (bIdx === -1 ? 999 : bIdx);
+    });
+  }
+  return /* @__PURE__ */ jsx2("div", { style: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    gap: "12px",
+    padding: "12px 0"
+  }, children: groupOrder.map((groupKey) => {
+    const groupActions = grouped[groupKey];
+    const label = groupKey === "_default" ? "Quick actions" : groupLabelMap.get(groupKey) || groupKey;
+    return /* @__PURE__ */ jsxs("div", { style: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      gap: "8px",
+      width: "100%"
+    }, children: [
+      /* @__PURE__ */ jsxs("span", { style: {
+        fontSize: "11px",
+        color: "#a3a3a3",
+        fontWeight: 500
+      }, children: [
+        label,
+        ":"
+      ] }),
+      /* @__PURE__ */ jsx2("div", { style: {
+        display: "flex",
+        flexWrap: "wrap",
+        justifyContent: "center",
+        gap: "8px"
+      }, children: groupActions.map((action, index) => /* @__PURE__ */ jsx2(
+        QuickActionButton,
+        {
+          action,
+          theme,
+          onClick: () => onQuickAction(action)
+        },
+        action.id || action.action || index
+      )) })
+    ] }, groupKey);
+  }) });
 }
 function SparklesIcon({ color = "currentColor" }) {
   return /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", children: [
@@ -2057,8 +2119,8 @@ function WebsiteChatbot({ className, ...config }) {
       style: {
         ...cssVars,
         ...positionStyles,
-        width: config.position === "inline" ? "100%" : "400px",
-        maxHeight: config.position === "inline" ? "600px" : "80vh",
+        width: config.position === "inline" ? "100%" : "380px",
+        maxHeight: config.position === "inline" ? "600px" : "500px",
         backgroundColor: "var(--wc-bg)",
         borderRadius: "var(--wc-radius)",
         border: "1px solid #e5e5e5",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@informedai/react",
-  "version": "0.4.18",
+  "version": "0.4.20",
   "description": "React SDK for InformedAI Assistant - AI-powered content creation widget",
   "main": "dist/index.js",
   "module": "dist/index.mjs",