@botonic/react 0.48.0 → 0.49.0-alpha.0

package/lib/esm/dev-app.js.map

@@ -1 +1 @@
-{"version":3,"file":"dev-app.js","sourceRoot":"","sources":["../../src/dev-app.jsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"dev-app.js","sourceRoot":"","sources":["../../src/dev-app.jsx"],"names":[],"mappings":"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"}

package/lib/esm/index.d.ts

@@ -1,6 +1,7 @@
 export { BotonicInputTester, BotonicOutputTester } from './botonic-tester';
 export * from './components';
 export * from './contexts';
+export { DEBUG_SYSTEM_MESSAGES } from './debug-system-messages';
 export { DevApp } from './dev-app';
 export * from './index-types';
 export { msgsToBotonic, msgToBotonic } from './msg-to-botonic';

package/lib/esm/index.js

@@ -1,12 +1,14 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.WebviewApp = exports.WebchatApp = exports.NodeApp = exports.msgToBotonic = exports.msgsToBotonic = exports.DevApp = exports.BotonicOutputTester = exports.BotonicInputTester = void 0;
+exports.WebviewApp = exports.WebchatApp = exports.NodeApp = exports.msgToBotonic = exports.msgsToBotonic = exports.DevApp = exports.DEBUG_SYSTEM_MESSAGES = exports.BotonicOutputTester = exports.BotonicInputTester = void 0;
 const tslib_1 = require("tslib");
 var botonic_tester_1 = require("./botonic-tester");
 Object.defineProperty(exports, "BotonicInputTester", { enumerable: true, get: function () { return botonic_tester_1.BotonicInputTester; } });
 Object.defineProperty(exports, "BotonicOutputTester", { enumerable: true, get: function () { return botonic_tester_1.BotonicOutputTester; } });
 tslib_1.__exportStar(require("./components"), exports);
 tslib_1.__exportStar(require("./contexts"), exports);
+var debug_system_messages_1 = require("./debug-system-messages");
+Object.defineProperty(exports, "DEBUG_SYSTEM_MESSAGES", { enumerable: true, get: function () { return debug_system_messages_1.DEBUG_SYSTEM_MESSAGES; } });
 var dev_app_1 = require("./dev-app");
 Object.defineProperty(exports, "DevApp", { enumerable: true, get: function () { return dev_app_1.DevApp; } });
 tslib_1.__exportStar(require("./index-types"), exports);

package/lib/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;AAAA,mDAA0E;AAAjE,oHAAA,kBAAkB,OAAA;AAAE,qHAAA,mBAAmB,OAAA;AAChD,uDAA4B;AAC5B,qDAA0B;AAC1B,qCAAkC;AAAzB,iGAAA,MAAM,OAAA;AACf,wDAA6B;AAC7B,mDAA8D;AAArD,+GAAA,aAAa,OAAA;AAAE,8GAAA,YAAY,OAAA;AACpC,uCAAoC;AAA3B,mGAAA,OAAO,OAAA;AAChB,iDAAsB;AACtB,oDAAyB;AACzB,6CAA0C;AAAjC,yGAAA,UAAU,OAAA;AACnB,6CAA0C;AAAjC,yGAAA,UAAU,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;AAAA,mDAA0E;AAAjE,oHAAA,kBAAkB,OAAA;AAAE,qHAAA,mBAAmB,OAAA;AAChD,uDAA4B;AAC5B,qDAA0B;AAC1B,iEAA+D;AAAtD,8HAAA,qBAAqB,OAAA;AAC9B,qCAAkC;AAAzB,iGAAA,MAAM,OAAA;AACf,wDAA6B;AAC7B,mDAA8D;AAArD,+GAAA,aAAa,OAAA;AAAE,8GAAA,YAAY,OAAA;AACpC,uCAAoC;AAA3B,mGAAA,OAAO,OAAA;AAChB,iDAAsB;AACtB,oDAAyB;AACzB,6CAA0C;AAAjC,yGAAA,UAAU,OAAA;AACnB,6CAA0C;AAAjC,yGAAA,UAAU,OAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@botonic/react",
-  "version": "0.48.0",
+  "version": "0.49.0-alpha.0",
   "license": "MIT",
   "description": "Build Chatbots using React",
   "main": "./lib/cjs",
@@ -20,8 +20,8 @@
     "format": "biome format --write src/ tests/"
   },
   "dependencies": {
-    "@botonic/core": "^0.48.0",
-    "axios": "^1.13.6",
+    "@botonic/core": "^0.49.0-alpha.0",
+    "axios": "^1.15.2",
     "emoji-picker-react": "^4.12.0",
     "lodash.merge": "^4.6.2",
     "markdown-it": "^12.3.2",

package/src/components/button/index.tsx

@@ -44,8 +44,9 @@ export const Button = (props: ButtonProps) => {
             payload: props.payload,
           })
     } else if (props.url) {
-      const defaultTarget = isInWebviewApp() ? '_self' : '_blank'
-      window.open(props.url, props.target || defaultTarget)
+      const defaultTarget = props.target || '_blank'
+      const target = isInWebviewApp() ? '_self' : defaultTarget
+      window.open(props.url, target)
     }
 
     if (props.onClick) {

package/src/components/system-debug-trace/debug-message.tsx

@@ -5,6 +5,7 @@ import { useContext, useEffect, useRef, useState } from 'react'
 import { WebchatContext } from '../../webchat/context'
 import {
   getAiAgentEventConfig,
+  getAiAgentRouterEventConfig,
   getBotActionEventConfig,
   getConditionalChannelEventConfig,
   getConditionalCountryEventConfig,
@@ -43,6 +44,8 @@ const getEventConfig = (
       return getHandoffSuccessEventConfig(debugEvent)
     case EventAction.AiAgent:
       return getAiAgentEventConfig(debugEvent)
+    case EventAction.AiAgentRouter:
+      return getAiAgentRouterEventConfig(debugEvent)
     case EventAction.Knowledgebase:
       return getKnowledgeBaseEventConfig(debugEvent)
     case EventAction.Fallback:

package/src/components/system-debug-trace/events/ai-agent/ai-agent.tsx

@@ -116,7 +116,7 @@ export const getAiAgentEventConfig = (
 ): DebugEventConfig => {
   const title = (
     <>
-      AI Agent triggered <span>- {data.flow_node_content_id}</span>
+      Specialist triggered <span>- {data.flow_node_content_id}</span>
     </>
   )
 

package/src/components/system-debug-trace/events/ai-agent/parse-tools.ts

@@ -2,7 +2,12 @@ import type { ToolExecuted } from './types'
 
 export const RETRIEVE_KNOWLEDGE_TOOL = 'retrieve_knowledge'
 
-export function parseTools(tools: ToolExecuted[]) {
+const TRANSFER_TOOL_PREFIX = 'transfer_to_'
+
+export function parseTools(
+  tools: ToolExecuted[],
+  excludeTransferTools = false
+) {
   const result = {
     retrieveKnowledgeTools: [] as ToolExecuted[],
     otherTools: [] as ToolExecuted[],
@@ -13,7 +18,14 @@ export function parseTools(tools: ToolExecuted[]) {
 
   for (const tool of tools) {
     if (tool.tool_name !== RETRIEVE_KNOWLEDGE_TOOL) {
-      result.otherTools.push(tool)
+      if (
+        !(
+          excludeTransferTools &&
+          tool.tool_name.startsWith(TRANSFER_TOOL_PREFIX)
+        )
+      ) {
+        result.otherTools.push(tool)
+      }
       continue
     }
 

package/src/components/system-debug-trace/events/ai-agent-router/ai-agent-router.tsx

@@ -0,0 +1,75 @@
+import { EventAction } from '@botonic/core'
+import { AiRouterSvg, HandSvg, HeadSetSvg } from '../../icons'
+import {
+  StyledDebugDetail,
+  StyledDebugItemWithIcon,
+  StyledDebugLabel,
+  StyledDebugValue,
+  StyledGuardrailLabel,
+  StyledGuardrailValue,
+} from '../../styles'
+import type { DebugEventConfig } from '../../types'
+import { LABELS } from '../constants'
+import type { AiAgentRouterDebugEvent } from './types'
+
+export const AiAgentRouter = ({
+  input_guardrails_triggered,
+  available_specialists,
+  is_transferred_to_specialist,
+  last_agent_name,
+}: AiAgentRouterDebugEvent) => {
+  return (
+    <>
+      {available_specialists.length > 0 && (
+        <StyledDebugDetail data-line-end>
+          <StyledDebugLabel>{LABELS.SPECIALISTS_AVAILABLE}</StyledDebugLabel>
+          {available_specialists.map(h => (
+            <StyledDebugItemWithIcon key={h.name}>
+              <HeadSetSvg />
+              {h.name}
+            </StyledDebugItemWithIcon>
+          ))}
+        </StyledDebugDetail>
+      )}
+
+      <StyledDebugDetail>
+        {is_transferred_to_specialist ? (
+          <StyledDebugValue>
+            {LABELS.TRANSFERRED_TO}{' '}
+            <span style={{ fontWeight: 400 }}>- {last_agent_name}</span>
+          </StyledDebugValue>
+        ) : input_guardrails_triggered.length > 0 ? (
+          <>
+            {input_guardrails_triggered.map(guardrail => (
+              <StyledDebugItemWithIcon key={`input-guardrail-${guardrail}`}>
+                <HandSvg />
+                <StyledGuardrailLabel>
+                  {LABELS.GUARDRAIL_TRIGGERED}
+                </StyledGuardrailLabel>
+                <StyledGuardrailValue>- {guardrail}</StyledGuardrailValue>
+              </StyledDebugItemWithIcon>
+            ))}
+          </>
+        ) : (
+          <StyledDebugValue>{LABELS.NO_TRANSFER}</StyledDebugValue>
+        )}
+      </StyledDebugDetail>
+    </>
+  )
+}
+
+export const getAiAgentRouterEventConfig = (
+  data: AiAgentRouterDebugEvent
+): DebugEventConfig => {
+  return {
+    action: EventAction.AiAgentRouter,
+    title: (
+      <>
+        Router triggered <span>- {data.flow_node_content_id}</span>
+      </>
+    ),
+    component: AiAgentRouter,
+    icon: <AiRouterSvg />,
+    collapsible: true,
+  }
+}

package/src/components/system-debug-trace/events/ai-agent-router/index.ts

@@ -0,0 +1,2 @@
+export * from './ai-agent-router'
+export * from './types'

package/src/components/system-debug-trace/events/ai-agent-router/types.ts

@@ -0,0 +1,26 @@
+import type { EventAction } from '@botonic/core'
+import type { ToolExecuted } from '../ai-agent/types'
+import type { ChunkIdsGroupedBySourceData } from '../knowledge-bases-types'
+
+export type { ToolExecuted }
+
+export interface SpecialistDebugEvent {
+  name: string
+  description: string
+}
+
+export interface AiAgentRouterDebugEvent {
+  action: EventAction.AiAgentRouter
+  flow_node_content_id: string
+  tools_executed: ToolExecuted[]
+  memory_length: number
+  input_guardrails_triggered: string[]
+  output_guardrails_triggered: string[]
+  exit: boolean
+  starting_agent_name: string
+  last_agent_name: string
+  available_specialists: SpecialistDebugEvent[]
+  is_transferred_to_specialist: boolean
+  knowledge_base_chunks_with_sources?: ChunkIdsGroupedBySourceData[]
+  messageId?: string
+}

package/src/components/system-debug-trace/events/constants.ts

@@ -25,4 +25,8 @@ export const LABELS = {
   OPEN: 'Open',
   CLOSED: 'Closed',
   AGENTS_AVAILABLE: 'Agents available',
+  AVAILABLE_TRANSFERS: 'Available transfers',
+  SPECIALISTS_AVAILABLE: 'Specialists available',
+  NO_TRANSFER: 'No transfer',
+  TRANSFERRED_TO: 'Transferred to',
 } as const

package/src/components/system-debug-trace/events/index.ts

@@ -1,4 +1,5 @@
 export * from './ai-agent'
+export * from './ai-agent-router'
 export * from './bot-action'
 export * from './conditional-channel'
 export * from './conditional-country'

package/src/components/system-debug-trace/hooks/use-last-label-position.ts

@@ -38,43 +38,53 @@ export function useLastLabelPosition({
         return
       }
 
-      // Find all label elements in order (both <strong> for DebugLabel and <span> for GuardrailLabel)
-      // We need to get them in DOM order to find the actual last one
-      const allElements = wrapper.querySelectorAll<HTMLElement>('strong, span')
-      const allLabels = Array.from(allElements).filter(el => {
-        // Include all <strong> elements (they're DebugLabels)
-        if (el.tagName === 'STRONG') {
-          return true
-        }
+      // If an explicit line-end marker exists, use its bottom edge
+      const lineEndMarker =
+        wrapper.querySelector<HTMLElement>('[data-line-end]')
+
+      let labelBottomPosition: number
 
-        // For <span>, only include if it's a direct child of a flex container (GuardrailLabel pattern)
-        // and has no child elements (just text)
-        if (
-          el.tagName === 'SPAN' &&
-          el.children.length === 0 &&
-          el.textContent?.trim()
-        ) {
-          const parent = el.parentElement
-          if (parent) {
-            const parentStyle = window.getComputedStyle(parent)
-            // GuardrailItem has display: flex
-            return parentStyle.display === 'flex'
+      if (lineEndMarker) {
+        const wrapperTop = wrapper.getBoundingClientRect().top
+        labelBottomPosition =
+          lineEndMarker.getBoundingClientRect().bottom - wrapperTop
+      } else {
+        // Find all label elements in order (both <strong> for DebugLabel and <span> for GuardrailLabel)
+        // We need to get them in DOM order to find the actual last one
+        const allElements =
+          wrapper.querySelectorAll<HTMLElement>('strong, span')
+        const allLabels = Array.from(allElements).filter(el => {
+          // Include all <strong> elements (they're DebugLabels)
+          if (el.tagName === 'STRONG') {
+            return true
           }
-        }
-        return false
-      })
 
-      if (allLabels.length === 0) {
-        return
-      }
+          // For <span>, only include if it's a direct child of a flex container (GuardrailLabel pattern)
+          // and has no child elements (just text)
+          if (
+            el.tagName === 'SPAN' &&
+            el.children.length === 0 &&
+            el.textContent?.trim()
+          ) {
+            const parent = el.parentElement
+            if (parent) {
+              const parentStyle = window.getComputedStyle(parent)
+              // GuardrailItem has display: flex
+              return parentStyle.display === 'flex'
+            }
+          }
+          return false
+        })
 
-      // Get the last label
-      const lastLabel = allLabels[allLabels.length - 1]
+        if (allLabels.length === 0) {
+          return
+        }
 
-      // Calculate distance from wrapper top to label bottom
-      const wrapperTop = wrapper.getBoundingClientRect().top
-      const labelBottom = lastLabel.getBoundingClientRect().bottom
-      const labelBottomPosition = labelBottom - wrapperTop
+        const lastLabel = allLabels[allLabels.length - 1]
+        const wrapperTop = wrapper.getBoundingClientRect().top
+        labelBottomPosition =
+          lastLabel.getBoundingClientRect().bottom - wrapperTop
+      }
 
       // Set CSS variable for line height calculation
       wrapper.style.setProperty(

package/src/components/system-debug-trace/icons/ai-router.tsx

@@ -0,0 +1,45 @@
+export const AiRouterSvg = () => {
+  return (
+    // biome-ignore lint/a11y/noSvgWithoutTitle: This is a SVG icon
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
+      width='18'
+      height='18'
+      viewBox='0 0 18 18'
+      fill='none'
+    >
+      <path
+        d='M3.93749 3.63077C4.42648 3.63077 4.85794 3.22807 4.85794 2.71032C4.85794 2.22132 4.42648 1.78986 3.93749 1.78986C3.41974 1.78986 3.01703 2.22132 3.01703 2.71032C3.01703 3.22807 3.41974 3.63077 3.93749 3.63077ZM6.23863 2.71032C6.23863 3.74582 5.54828 4.63752 4.62783 4.92516V7.77282C5.20312 7.34136 5.92222 7.08248 6.69885 7.08248H9.46022C10.582 7.08248 11.5313 6.16202 11.5313 5.01145V4.92516C10.582 4.63752 9.92044 3.74582 9.92044 2.71032C9.92044 1.44469 10.9272 0.40918 12.2216 0.40918C13.4872 0.40918 14.5227 1.44469 14.5227 2.71032C14.5227 3.74582 13.8323 4.63752 12.9119 4.92516V5.01145C12.9119 6.93865 11.3586 8.4632 9.46022 8.4632H6.69885C5.54828 8.4632 4.62783 9.41237 4.62783 10.5342V10.6492C5.54828 10.9369 6.23863 11.8285 6.23863 12.8353C6.23863 14.1297 5.20312 15.1365 3.93749 15.1365C2.6431 15.1365 1.63635 14.1297 1.63635 12.8353C1.63635 11.8285 2.29793 10.9369 3.24715 10.6492V10.5342V4.92516C2.29793 4.63752 1.63635 3.74582 1.63635 2.71032C1.63635 1.44469 2.6431 0.40918 3.93749 0.40918C5.20312 0.40918 6.23863 1.44469 6.23863 2.71032ZM13.142 2.71032C13.142 2.22132 12.7106 1.78986 12.2216 1.78986C11.7038 1.78986 11.3011 2.22132 11.3011 2.71032C11.3011 3.22807 11.7038 3.63077 12.2216 3.63077C12.7106 3.63077 13.142 3.22807 13.142 2.71032ZM3.93749 13.7558C4.42648 13.7558 4.85794 13.3531 4.85794 12.8353C4.85794 12.3463 4.42648 11.9149 3.93749 11.9149C3.41974 11.9149 3.01703 12.3463 3.01703 12.8353C3.01703 13.3531 3.41974 13.7558 3.93749 13.7558Z'
+        fill='url(#ai-router-gradient-0)'
+      />
+      <path
+        d='M12.5839 10.0164C12.5285 9.89486 12.4069 9.81812 12.2748 9.81812C12.1427 9.81812 12.0211 9.89486 11.9657 10.0164L10.8337 12.4672L8.38215 13.5989C8.25851 13.6565 8.18176 13.778 8.18176 13.9101C8.18176 14.0422 8.25851 14.1637 8.38002 14.2191L10.8316 15.3508L11.9636 17.8017C12.019 17.9232 12.1405 17.9999 12.2727 17.9999C12.4048 17.9999 12.5264 17.9232 12.5818 17.8017L13.7137 15.3508L16.1653 14.2191C16.2868 14.1637 16.3636 14.0422 16.3636 13.9101C16.3636 13.778 16.2868 13.6565 16.1653 13.6011L13.7137 12.4694L12.5818 10.0185L12.5839 10.0164Z'
+        fill='url(#ai-router-gradient-1)'
+      />
+      <defs>
+        <linearGradient
+          id='ai-router-gradient-0'
+          x1='1.63635'
+          y1='7.77282'
+          x2='14.5227'
+          y2='7.77282'
+          gradientUnits='userSpaceOnUse'
+        >
+          <stop stopColor='#6E49FF' />
+          <stop offset='1' stopColor='#CC3559' />
+        </linearGradient>
+        <linearGradient
+          id='ai-router-gradient-1'
+          x1='8.18176'
+          y1='13.909'
+          x2='16.3636'
+          y2='13.909'
+          gradientUnits='userSpaceOnUse'
+        >
+          <stop stopColor='#6E49FF' />
+          <stop offset='1' stopColor='#CC3559' />
+        </linearGradient>
+      </defs>
+    </svg>
+  )
+}

package/src/components/system-debug-trace/icons/index.ts

@@ -1,3 +1,4 @@
+export * from './ai-router'
 export * from './brain'
 export * from './caret-down'
 export * from './caret-up'
@@ -10,4 +11,5 @@ export * from './life-ring'
 export * from './link'
 export * from './quote-right'
 export * from './screwdriver-wrench'
+export * from './split'
 export * from './wand'

package/src/components/system-debug-trace/types.ts

@@ -2,6 +2,7 @@ import type React from 'react'
 
 import type {
   AiAgentDebugEvent,
+  AiAgentRouterDebugEvent,
   BotActionDebugEvent,
   ConditionalChannelDebugEvent,
   ConditionalCountryDebugEvent,
@@ -24,6 +25,7 @@ export interface IconProps {
 export type DebugEvent =
   | KeywordDebugEvent
   | AiAgentDebugEvent
+  | AiAgentRouterDebugEvent
   | KnowledgeBaseDebugEvent
   | FallbackDebugEvent
   | SmartIntentDebugEvent