@stack-spot/ai-chat-widget 0.10.0 → 1.0.0-dev.1768314799914

package/dist/views/Tools.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { agentToolsClient } from '@stack-spot/portal-network';
+import { useTranslate } from '@stack-spot/portal-translate';
+import { useEffect, useMemo } from 'react';
+import styled from 'styled-components';
+import { ToolBadge } from '../components/ToolBadge.js';
+import { useWidget, useWidgetState } from '../context/hooks.js';
+import { useRightPanel } from '../right-panel/hooks.js';
+import { toolById } from '../utils/tools.js';
+const ToolList = styled.ul `
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+`;
+export const Tools = () => {
+    const t = useTranslate(dictionary);
+    const panel = useWidgetState('panel');
+    const message = useWidgetState('currentMessageInPanel');
+    const { open } = useRightPanel();
+    const widget = useWidget();
+    useEffect(() => {
+        if (panel === 'tools' && message)
+            open(_jsx(ToolsPanel, {}, message.messageId), { title: t.title, description: t.description, onClose: () => widget.set('panel', undefined) });
+    }, [panel, t]);
+    return null;
+};
+const ToolsPanel = () => {
+    const { chatId, messageId } = useWidgetState('currentMessageInPanel') ?? {};
+    const widget = useWidget();
+    const message = useMemo(() => {
+        const chat = widget.chatTabs.getAll().find(c => c.id === chatId);
+        return chat?.getMessages().find(m => m.id === messageId)?.getValue();
+    }, [messageId]);
+    const [toolKits] = agentToolsClient.tools.useStatefulQuery({}, { enabled: !!message?.agent?.id });
+    const [agent] = agentToolsClient.agent.useStatefulQuery({ agentId: message?.agent?.id || '' }, { enabled: !!message?.agent?.id });
+    const tools = useMemo(() => message?.tools?.map(id => toolById(id, toolKits)), [messageId, toolKits]);
+    const customTools = useMemo(() => message?.tools?.map(id => toolById(id, agent?.toolkits?.custom_toolkits)), [messageId, agent?.toolkits?.custom_toolkits]);
+    return !!(tools?.length || customTools?.length) && (_jsx(ToolList, { children: [...(tools || []), ...(customTools || [])].map((tool) => tool && (_jsx("li", { children: _jsx(ToolBadge, { name: tool.name || tool.id || '', image: tool.image ?? '', description: tool.description ?? '' }) }, tool.id))) }));
+};
+const dictionary = {
+    en: {
+        title: 'Tools',
+        description: 'The tools used to generate the answer.',
+    },
+    pt: {
+        title: 'Ferramentas',
+        description: 'As ferramentas usadas para gerar a resposta.',
+    },
+};
+//# sourceMappingURL=Tools.js.map

package/dist/views/Tools.js.map

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

package/dist/views/Workspaces/WorkspacesTab.d.ts

@@ -0,0 +1,20 @@
+import { WorkspaceVisibilityLevelEnum } from '@stack-spot/portal-network/api/workspace-ai';
+import { ChatProperties } from '../../state/ChatState.js';
+export interface TabProps {
+    visibility: WorkspaceVisibilityLevelEnum;
+    allKS: React.MutableRefObject<ChatProperties['knowledgeSources']>;
+    agent: React.MutableRefObject<ChatProperties['agent']>;
+    stack: React.MutableRefObject<ChatProperties['stack']>;
+    workspaceId?: string;
+    onSubmit: () => void;
+}
+export interface WorkspaceResource {
+    id: string;
+    resourceType: 'agent' | 'ks' | 'stack';
+    displayName: string;
+    icon: React.ReactElement;
+    workspaceId?: string;
+}
+export declare const WorkspaceResources: ({ workspaceId, allKS, agent, stack }: Omit<TabProps, "onSubmit">) => import("react/jsx-runtime").JSX.Element;
+export declare function WorkspacesTab({ visibility, allKS, agent, stack, onSubmit }: TabProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=WorkspacesTab.d.ts.map

package/dist/views/Workspaces/WorkspacesTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WorkspacesTab.d.ts","sourceRoot":"","sources":["../../../src/views/Workspaces/WorkspacesTab.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAqB,4BAA4B,EAAE,MAAM,6CAA6C,CAAA;AAM7G,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AAkBtD,MAAM,WAAW,QAAQ;IACvB,UAAU,EAAE,4BAA4B,CAAC;IACzC,KAAK,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAClE,KAAK,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACvD,KAAK,EAAE,KAAK,CAAC,gBAAgB,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACvD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,YAAY,EAAE,OAAO,GAAG,IAAI,GAAG,OAAO,CAAC;IACvC,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAID,eAAO,MAAM,kBAAkB,yCAA0C,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,4CAkClG,CAAA;AASD,wBAAgB,aAAa,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,QAAQ,2CAiBpF"}

package/dist/views/Workspaces/WorkspacesTab.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Icon } from '@stack-spot/citric-icons';
+import { AsyncContent, Button, Center, Column, ImageBox, ImageWithFallback, Text } from '@stack-spot/citric-react';
+import { workspaceAiClient } from '@stack-spot/portal-network';
+import { useTranslate } from '@stack-spot/portal-translate';
+import { useTransition } from 'react';
+import { useComponentNavigation } from '../../components/ComponentNavigator.js';
+import { ListResource } from '../../components/ListResource.js';
+import { CardSpace, WorkspaceTabNavigator } from '../../components/WorkspaceTabNavigator.js';
+import { AgentsTab } from '../Agents/AgentsTab.js';
+import { KnowledgeSourcesTab } from '../KnowledgeSources.js';
+import { StacksTab } from '../Stacks.js';
+const SpaceCard = ({ workspaceId }) => {
+    const workspace = workspaceAiClient.workspaceAi.useQuery({ id: workspaceId });
+    return _jsxs(Column, { gap: "4px", children: [_jsxs(Center, { gap: "8px", children: [_jsx(ImageBox, { size: "sm", appearance: "square", children: _jsx(ImageWithFallback, { src: workspace.logo ?? '', fallback: _jsx(Icon, { icon: "Spaces" }) }) }), _jsx(Text, { appearance: "body2", weight: "medium", children: workspace.name })] }), _jsx(Text, { color: "light.700", children: workspace.description })] });
+};
+const showSubmitButton = false;
+export const WorkspaceResources = ({ workspaceId, allKS, agent, stack }) => {
+    const { navigate } = useComponentNavigation();
+    const [isPending, startTransition] = useTransition();
+    const resourceTypes = [
+        { id: 'agents', resourceType: 'agent', displayName: 'Agents', workspaceId, icon: _jsx(Icon, { icon: "Agent" }) },
+        { id: 'ks', resourceType: 'ks', displayName: 'Knowledge Sources', workspaceId, icon: _jsx(Icon, { icon: "KnowledgeSource" }) },
+        { id: 'stack', resourceType: 'stack', displayName: 'Stacks', workspaceId, icon: _jsx(Icon, { icon: "Stack" }) },
+    ];
+    const handleNavigate = (resource) => {
+        startTransition(() => {
+            if (resource.resourceType === 'agent')
+                navigate({ component: 'agent', props: { visibility: 'workspace', agent, workspaceId, showSubmitButton }, fullScreen: true });
+            if (resource.resourceType === 'ks')
+                navigate({ component: 'ks', props: { visibility: 'workspace', allKS, workspaceId, showSubmitButton }, fullScreen: true });
+            if (resource.resourceType === 'stack')
+                navigate({ component: 'stack', props: { visibility: 'workspace', stack, workspaceId, showSubmitButton }, fullScreen: true });
+        });
+    };
+    return (_jsxs(_Fragment, { children: [workspaceId && _jsx(SpaceCard, { workspaceId: workspaceId }), _jsx(AsyncContent, { loading: isPending, children: _jsx(ListResource, { list: resourceTypes, keygen: w => w.id, renderLabel: r => _jsx(CardSpace, { name: r.displayName, icon: r.icon, onClick: () => handleNavigate(r) }), style: { gap: '6px', display: 'flex', flexDirection: 'column' } }) })] }));
+};
+const workspaceTabComponents = {
+    workspaceResource: WorkspaceResources,
+    agent: AgentsTab,
+    ks: KnowledgeSourcesTab,
+    stack: StacksTab,
+};
+export function WorkspacesTab({ visibility, allKS, agent, stack, onSubmit }) {
+    const t = useTranslate(dictionary);
+    const buildNavigateParams = (workspace) => ({
+        component: 'workspaceResource',
+        props: { allKS, agent, stack, visibility, workspaceId: workspace.id },
+        fullScreen: true,
+    });
+    return (_jsxs(_Fragment, { children: [_jsx(WorkspaceTabNavigator, { components: workspaceTabComponents, getNavigateParam: buildNavigateParams, visibility: visibility }), _jsx(Button, { className: "workspace-submit", onClick: onSubmit, children: t.apply })] }));
+}
+const dictionary = {
+    en: {
+        apply: 'Apply',
+    },
+    pt: {
+        apply: 'Aplicar',
+    },
+};
+//# sourceMappingURL=WorkspacesTab.js.map

package/dist/views/Workspaces/WorkspacesTab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WorkspacesTab.js","sourceRoot":"","sources":["../../../src/views/Workspaces/WorkspacesTab.tsx"],"names":[],"mappings":"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"}

package/dist/views/Workspaces/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Renders the Workspace selection form in the Right Panel if this is the panel that is currently opened.
+ */
+export declare const Workspaces: () => null;
+//# sourceMappingURL=index.d.ts.map

package/dist/views/Workspaces/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/views/Workspaces/index.tsx"],"names":[],"mappings":"AAOA;;GAEG;AACH,eAAO,MAAM,UAAU,YActB,CAAA"}

package/dist/views/Workspaces/index.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useTranslate } from '@stack-spot/portal-translate';
+import { useCallback, useEffect, useRef } from 'react';
+import { RightPanelTabs } from '../../components/RightPanelTabs.js';
+import { useCurrentChat, useWidget, useWidgetState } from '../../context/hooks.js';
+import { useRightPanel } from '../../right-panel/hooks.js';
+import { WorkspacesTab } from './WorkspacesTab.js';
+/**
+ * Renders the Workspace selection form in the Right Panel if this is the panel that is currently opened.
+ */
+export const Workspaces = () => {
+    const t = useTranslate(dictionary);
+    const panel = useWidgetState('panel');
+    const { open } = useRightPanel();
+    const widget = useWidget();
+    const chat = useCurrentChat();
+    useEffect(() => {
+        if (panel === 'workspace')
+            open(_jsx(WorkspacesPanel, {}, chat.id), { title: t.title, description: t.description, onClose: () => widget.set('panel', undefined) });
+    }, [panel, t, chat.id]);
+    return null;
+};
+const WorkspacesPanel = () => {
+    const t = useTranslate(dictionary);
+    const chat = useCurrentChat();
+    const allKS = useRef(chat.get('knowledgeSources') ?? []);
+    const agent = useRef(chat.get('agent'));
+    const stack = useRef(chat.get('stack'));
+    const { close } = useRightPanel();
+    const onSubmit = useCallback(() => {
+        chat.set('knowledgeSources', allKS.current);
+        chat.set('stack', stack.current);
+        chat.set('agent', agent.current);
+        close();
+    }, [chat]);
+    useEffect(() => {
+        allKS.current = chat.get('knowledgeSources') ?? [];
+        agent.current = chat.get('agent');
+        stack.current = chat.get('stack');
+    }, [chat]);
+    return _jsx(RightPanelTabs, { tabs: [
+            {
+                key: 'favorites',
+                label: t.favorites,
+                content: _jsx(WorkspacesTab, { visibility: "favorite", allKS: allKS, agent: agent, stack: stack, onSubmit: onSubmit }, "favorite"),
+            },
+            {
+                key: 'all',
+                label: t.all,
+                content: _jsx(WorkspacesTab, { visibility: "all", allKS: allKS, agent: agent, stack: stack, onSubmit: onSubmit }, "all"),
+            },
+        ] }, chat.id);
+};
+const dictionary = {
+    en: {
+        title: 'Spot',
+        description: 'By selecting a spot, its Knowledge Sources (KSs), Agents, Quick Commands and Stacks Ai will be consulted to generate the answers.',
+        noSearchResults: "Your search didn't yield results.",
+        all: 'All',
+        favorites: 'Favorites',
+    },
+    pt: {
+        title: 'Spot',
+        description: 'Ao selecionar um spot, seus Knowledge Sources (KSs), Agentes, Quick Commands e Stacks Ai serão consultados para gerar as respostas.',
+        all: 'Todos',
+        favorites: 'Favoritos',
+    },
+};
+//# sourceMappingURL=index.js.map

package/dist/views/Workspaces/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/views/Workspaces/index.tsx"],"names":[],"mappings":"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"}

package/package.dev.json

@@ -0,0 +1,3 @@
+{
+  "version": "1.0.0-dev.{timestamp}"
+}

package/package.json

@@ -1,23 +1,31 @@
 {
   "name": "@stack-spot/ai-chat-widget",
-  "version": "0.10.0",
+  "version": "1.0.0-dev.1768314799914",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
+  "scripts": {
+    "build": "node scripts/package-override.js --revert=false && rimraf dist && pnpm generate:metadata && tsc --noEmitOnError && tsc-esm-fix --target='dist' && cpy src/layout.css dist --flat && cpy src/assets/**/*.png dist/assets",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "generate:metadata": "pnpm app-metadata --lockfile ../../pnpm-lock.yaml --path packages/widget"
+  },
   "peerDependencies": {
-    "@citric/core": "^6.0.0",
-    "@citric/icons": "^5.4.0 || ^6.0.0",
-    "@citric/ui": "^5.4.0 || ^6.0.0",
-    "@stack-spot/portal-components": "^2.6.1",
-    "@stack-spot/portal-network": "^0.42.2",
-    "@stack-spot/portal-theme": "^1.0.0",
-    "@stack-spot/portal-translate": "^1.1.0",
+    "@stack-spot/citric-react": "^0.40.3",
+    "@stack-spot/citric-icons": "^0.3.0",
+    "@stack-spot/portal-theme": "^1.2.1",
+    "@citric/core": "^6.4.0",
+    "@stack-spot/portal-components": "^2.27.3",
+    "@citric/icons": "^5.13.0",
+    "@stack-spot/portal-network": "0.212.4",
+    "@citric/ui": "^6.10.2",
+    "@stack-spot/portal-translate": "^2.1.0",
     "lodash": "^4.17.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "styled-components": "6.1.10"
   },
   "devDependencies": {
+    "@stack-spot/app-metadata": "1.0.1",
     "@types/lodash": "^4.14.202",
     "@types/react": "^18.2.37",
     "@types/react-dom": "^18.2.15",
@@ -43,13 +51,12 @@
     "@monaco-editor/react": "^4.6.0",
     "monaco-editor": "^0.52.0",
     "react-infinite-scroll-component": "^6.1.0",
+    "react-international-phone": "^4.5.0",
     "react-markdown": "^9.0.1",
     "react-syntax-highlighter": "^15.5.0",
     "remark-gfm": "^4.0.0",
-    "ulid": "^2.3.0"
-  },
-  "scripts": {
-    "build": "rimraf dist && tsc && tsc-esm-fix --target='dist' && cpy src/layout.css dist --flat",
-    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0"
+    "ulid": "^2.3.0",
+    "@xyflow/react": "^12.3.2",
+    "@dagrejs/dagre": "^1.1.4"
   }
 }

package/package.stg.json

@@ -0,0 +1,4 @@
+{
+  "name": "@stack-spot/ai-chat-widget-stg",
+  "version": "1.0.0-{timestamp}"
+}

package/scripts/package-override.js

@@ -0,0 +1,105 @@
+/* eslint-disable no-console */
+import { exec } from 'child_process'
+import { access, constants, readFile, writeFile } from 'fs/promises'
+
+const variables = {
+  timestamp: () => new Date().getTime(),
+}
+
+function merge(a, b) {
+  if (a === null || typeof a !== 'object') return b
+  if (Array.isArray(a) && Array.isArray(b)) return [...a, ...b]
+  const result = { ...a }
+  for (const key in b) {
+    if (typeof b === 'object') result[key] = merge(result[key], b[key]) 
+    else result[key] = b[key]
+  }
+  return result
+}
+
+function replaceVariables(data) {
+  if (typeof data === 'string') {
+    return data.replace(/\{([\w_]+)\}/g, (match, varname) => varname in variables ? `${variables[varname]()}` : match)
+  }
+  if (Array.isArray(data)) {
+    return data.map(replaceVariables)
+  }
+  if (data && typeof data === 'object') {
+    const result = {}
+    for (const key in data) {
+      result[key] = replaceVariables(data[key])
+    }
+    return result
+  }
+  return data
+}
+
+async function isEnvValid(env) {
+  if (!env) return false
+  try {
+    await access(`package.${env}.json`, constants.F_OK)
+    return true
+  } catch (err) {
+    console.log(err)
+    return false
+  }
+}
+
+async function readPackage(suffix) {
+  const packageString = await readFile(`package${suffix ? `.${suffix}` : ''}.json`, { encoding: 'utf-8' })
+  return [JSON.parse(packageString), packageString]
+}
+
+async function getEnv() {
+  const fromCmd = process.argv.join(' ').match(/--env=(\w+)/)?.[1]
+  if (fromCmd) return fromCmd.trim()
+  try {
+    const fromBranchName = await asyncExec('git rev-parse --abbrev-ref HEAD')
+    return fromBranchName.trim()
+  } catch {
+    return undefined
+  }
+}
+
+function getShouldRevert() {
+  return !/--revert=false/.test(process.argv.join(' '))
+}
+
+async function prepare(env) {
+  const [pckg, originalPckg] = await readPackage()
+  const [envPckg] = await readPackage(env)
+  const resultingPackage = replaceVariables(merge(pckg, envPckg))
+  await writeFile('package.json', JSON.stringify(resultingPackage, null, 2), { encoding: 'utf-8' })
+  return [originalPckg, resultingPackage]
+}
+
+function asyncExec(cmd, dir) {
+  return new Promise((resolve, reject) => exec(cmd, { cwd: dir }, (error, stdout, stderr) => {
+    if (error) reject(`${error.message}\n\n${stdout}\n\n${stderr}`)
+    else resolve(stdout)
+  }))
+}
+
+async function revert(packageBackup) {
+  await writeFile('package.json', packageBackup, { encoding: 'utf-8' })
+}
+
+async function start() {
+  const env = await getEnv()
+  if (!(await isEnvValid(env))) {
+    console.log('No overrides set for environment:', env)
+    return
+  }
+  const shouldRevert = getShouldRevert()
+  console.log(`Overriding dependencies for ${env}...`)
+  const [packageBackup] = await prepare(env)
+  try {
+    console.log('Installing overridden dependencies...')
+    await asyncExec('pnpm i')
+    console.log('Done.')
+  } finally {
+    if (shouldRevert) await revert(packageBackup)
+  }
+}
+
+start()

package/src/AbortedError.ts

@@ -0,0 +1,7 @@
+import { StackspotAPIError } from '@stack-spot/portal-network'
+
+export class AbortedError extends StackspotAPIError {
+  constructor() {
+    super({ status: 0, message: 'Operation canceled by the user.' })
+  }
+}

package/src/StackspotAIWidget.tsx

@@ -1,17 +1,16 @@
-import { listToClass } from '@stack-spot/portal-theme'
+import { FallbackBoundary } from '@stack-spot/citric-react'
+import { listToClass, WithStyle } from '@stack-spot/portal-theme'
 import { useMemo, useRef } from 'react'
-import { quickCommandInterceptor } from './chat-interceptors/quick-commands'
-import { sendMessageInterceptor } from './chat-interceptors/send-message'
-import { TooltipProvider } from './components/Tooltip'
-import { useCurrentChatMessages, useFirstChat, useWidgetState } from './context/hooks'
-import { AIWidgetFeatures, defaultFeatures } from './features'
+import { useCurrentChatMessages, useCurrentChatState, useWidgetState } from './context/hooks'
 import './layout.css'
 import { RightPanel } from './right-panel/RightPanel'
 import { RightPanelProvider } from './right-panel/RightPanelProvider'
-import { MessageInterceptor } from './state/ChatState'
-import { MinimizedActions } from './types'
+import { LabeledAgent } from './state/types'
+import { ButtonAction, MinimizedActions } from './types'
+import { checkIsTrial } from './utils/check-is-trial'
 import { Agents } from './views/Agents'
 import { Chat } from './views/Chat'
+import { CustomMessage } from './views/Chat/ChatMessage'
 import { ChatHistory } from './views/ChatHistory'
 import { ChatTabSelection } from './views/ChatTabSelection'
 import { Editor } from './views/Editor'
@@ -20,54 +19,124 @@ import { KnowledgeSources } from './views/KnowledgeSources'
 import { KSDocument } from './views/KSDocument'
 import { MessageInput } from './views/MessageInput'
 import { MinimizedHeader } from './views/MinimizedHeader'
+import { Resources } from './views/Resources'
 import { Stacks } from './views/Stacks'
+import { Steps } from './views/Steps'
+import { Tools } from './views/Tools'
 import { Workspaces } from './views/Workspaces'
 
-export interface AIWidgetProps {
-  features?: AIWidgetFeatures,
+export interface AIWidgetProps extends WithStyle, CustomMessage {
+  /**
+   * The name of the user currently logged in.
+   */
   username: string,
-  interceptors?: MessageInterceptor[],
+  /**
+   * Initial agents to show in the chat panel when there are still no messages (home).
+   * It doesn't make a difference if this component has children.
+   */
+  initialAgents?: LabeledAgent[],
+  /**
+   * A custom view to show when the chat has no messages to display.
+   */
   children?: React.ReactNode,
+  /**
+   * A custom view to show before the chat messages.
+   */
+  prefix?: React.ReactNode,
+  /**
+   * A custom view to show after the chat messages.
+   */
+  suffix?: React.ReactNode,
+  /**
+   * Input custom placeholder
+   */
+  customInputMessage?: string,
+  /**
+   * If the chat can be minimized, this set of functions tells what to do when minimization related buttons are clicked.
+   */
   minimizedActions?: MinimizedActions,
+  /**
+   * A boolean indicating whether or not the chat should have a visible header.
+   */
+  hasHeader?: boolean,
+  /**
+   *  URL to redirect to the "Create Agent" page on the portal
+   */
+  urlCreateAgent?: string,
+  /**
+   * A set of extra buttons to place in the chat selection tab.
+   */
+  tabButtons?: ButtonAction[],
 }
 
+/**
+ * Renders a Chat Widget according to the closest model found in the React tree (AIWidgetProvider). If no model is found, a global version
+ * of the Chat Widget will be instantiated and used.
+ */
 export const StackspotAIWidget = (
-  { username, features = defaultFeatures, interceptors: userInterceptors = [], minimizedActions = {}, children }: AIWidgetProps,
+  {
+    username,
+    initialAgents,
+    minimizedActions = {},
+    prefix,
+    suffix,
+    children,
+    className,
+    style,
+    hasHeader = true,
+    beforeMessage,
+    afterMessage,
+    urlCreateAgent,
+    tabButtons,
+    customInputMessage,
+    customRenderer,
+  }: AIWidgetProps,
 ) => {
-  const interceptors: MessageInterceptor[] = useMemo(() => [...userInterceptors, quickCommandInterceptor, sendMessageInterceptor], [])
-  useFirstChat(interceptors)
   const rightPanelRef = useRef<HTMLDivElement>(null)
   const chatWindowRef = useRef<HTMLDivElement>(null)
   const currentChat = useCurrentChatMessages()
   const isMinimized = useWidgetState('isMinimized')
   const isCurrentChatEmpty = currentChat.length === 0
-
+  const isTrial = checkIsTrial()
+  const features = useCurrentChatState('features')
+  
   return useMemo(() => (
-    <TooltipProvider>
+    <FallbackBoundary>
       <RightPanelProvider chatWindow={chatWindowRef} panel={rightPanelRef}>
-        <div className={listToClass(['ai-chat-widget', isMinimized && 'minimized'])} translate="no">
+        <div className={listToClass(['ai-chat-widget', isMinimized && 'minimized', className])} translate="no" style={style}>
           <div className="chat-window" ref={chatWindowRef}>
-            {isMinimized
-              ? <MinimizedHeader {...minimizedActions} />
-              : <ChatTabSelection history={features?.chatHistory} interceptors={interceptors}/>
+            {hasHeader &&<>
+              {isMinimized
+                ? <MinimizedHeader {...minimizedActions} />
+                : <ChatTabSelection buttons={tabButtons} />
+              }
+            </>
             }
-            <div className="chat-container">
+            <div className="chat-container" ref={chatWindowRef}>
               <div className="chat-content">
-                {isCurrentChatEmpty ? (children ?? <Home username={username} />) : <Chat username={username} />}
+                {prefix}
+                {isCurrentChatEmpty
+                  ? (children ?? <Home username={username} initialAgents={initialAgents} urlCreateAgent={urlCreateAgent} />)
+                  : <Chat username={username} beforeMessage={beforeMessage} afterMessage={afterMessage} customRenderer={customRenderer} />
+                }
               </div>
-              <MessageInput features={features} />
+              {features.messageInput && <MessageInput chatWindowRef={chatWindowRef} customInputMessage={customInputMessage} />}
+              {suffix}
             </div>
           </div>
           <Stacks />
-          <Workspaces />
+          {!isTrial && <Workspaces />}
           <KnowledgeSources />
           <KSDocument />
           <Agents />
           <Editor />
-          <ChatHistory interceptors={interceptors} />
+          <ChatHistory />
+          <Steps />
+          <Tools />
+          <Resources />
           <div className="chat-right-panel" ref={rightPanelRef}><RightPanel /></div>
         </div>
       </RightPanelProvider>
-    </TooltipProvider>
-  ), [isCurrentChatEmpty, features, username, isMinimized])
+    </FallbackBoundary>
+  ), [isCurrentChatEmpty, username, isMinimized, children, initialAgents, suffix, className, tabButtons])
 }