@stack-spot/ai-chat-widget 2.8.5 → 2.9.0

package/dist/views/Steps/FlowChart/layout.d.ts

@@ -1,17 +1,8 @@
 import { Edge } from '@xyflow/react';
-import { NodeWithoutLayout } from './types.js';
-export declare function useLayoutedElements(nodes: NodeWithoutLayout[], edges: Edge[]): {
-    nodes: {
-        targetPosition: string;
-        sourcePosition: string;
-        position: {
-            x: number;
-            y: number;
-        };
-        id: string;
-        type: "step" | "planning" | "answer" | "tool";
-        data?: import("./types.js").NodeData;
-    }[];
+import { NodeFullProps } from './types.js';
+export type LayoutDirection = 'TB' | 'BT' | 'LR' | 'RL';
+export declare function useLayoutedElements(nodes: NodeFullProps[], edges: Edge[], direction?: LayoutDirection): {
+    nodes: NodeFullProps[];
     edges: Edge[];
 };
 //# sourceMappingURL=layout.d.ts.map

package/dist/views/Steps/FlowChart/layout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/layout.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AAGpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAS3C,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,iBAAiB,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE;;;;;;;;;;;;;EAoC5E"}
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/layout.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAY,MAAM,eAAe,CAAA;AAG9C,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AASvC,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAevD,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,aAAa,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,SAAS,GAAE,eAAsB;;;EA2C3G"}

package/dist/views/Steps/FlowChart/layout.js

@@ -1,4 +1,5 @@
 import dagre from '@dagrejs/dagre';
+import { Position } from '@xyflow/react';
 import { useMemo } from 'react';
 import { answerNodeSize, planningNodeSize, stepNodeSize } from './styled.js';
 const nodesSizes = {
@@ -7,30 +8,47 @@ const nodesSizes = {
     answer: answerNodeSize,
     tool: stepNodeSize,
 };
-export function useLayoutedElements(nodes, edges) {
+const getHandlePositions = (direction) => {
+    switch (direction) {
+        case 'TB':
+            return { target: Position.Top, source: Position.Bottom };
+        case 'BT':
+            return { target: Position.Bottom, source: Position.Top };
+        case 'LR':
+            return { target: Position.Left, source: Position.Right };
+        case 'RL':
+            return { target: Position.Right, source: Position.Left };
+    }
+};
+export function useLayoutedElements(nodes, edges, direction = 'LR') {
     const dagreGraph = useMemo(() => new dagre.graphlib.Graph().setDefaultEdgeLabel(() => ({})), []);
     return useMemo(() => {
-        dagreGraph.setGraph({ rankdir: 'LR' });
+        dagreGraph.setGraph({ rankdir: direction });
         nodes.forEach((node) => {
             const { width, height } = nodesSizes[node.type];
-            dagreGraph.setNode(node.id, { width, height });
+            const nodeWidth = node.width ?? width;
+            const nodeHeight = node.height ?? height;
+            dagreGraph.setNode(node.id, { width: nodeWidth, height: nodeHeight });
         });
         edges.forEach((edge) => {
             dagreGraph.setEdge(edge.source, edge.target);
         });
         dagre.layout(dagreGraph);
+        const { target, source } = getHandlePositions(direction);
         const newNodes = nodes.map((node) => {
             const { width, height } = nodesSizes[node.type];
+            const nodeWidth = node?.width ?? width;
+            const nodeHeight = node.height ?? height;
             const nodeWithPosition = dagreGraph.node(node.id);
             const newNode = {
                 ...node,
-                targetPosition: 'left',
-                sourcePosition: 'right',
+                targetPosition: target,
+                sourcePosition: source,
                 // We are shifting the dagre node position (anchor=center center) to the top left
                 // so it matches the React Flow node anchor point (top left).
                 position: {
-                    x: nodeWithPosition.x - width / 2,
-                    y: nodeWithPosition.y - height / 2,
+                    x: nodeWithPosition.x - nodeWidth / 2,
+                    y: nodeWithPosition.y - nodeHeight / 2,
                 },
             };
             return newNode;

package/dist/views/Steps/FlowChart/layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/layout.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,gBAAgB,CAAA;AAElC,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAC/B,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAGzE,MAAM,UAAU,GAAG;IACjB,IAAI,EAAE,YAAY;IAClB,QAAQ,EAAE,gBAAgB;IAC1B,MAAM,EAAE,cAAc;IACtB,IAAI,EAAE,YAAY;CACnB,CAAA;AAED,MAAM,UAAU,mBAAmB,CAAC,KAA0B,EAAE,KAAa;IAC3E,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAC,mBAAmB,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAA;IAChG,OAAO,OAAO,CAAC,GAAG,EAAE;QAClB,UAAU,CAAC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAA;QAEtC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;YACrB,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;YAC/C,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAA;QAChD,CAAC,CAAC,CAAA;QAEF,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;YACrB,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,CAAA;QAC9C,CAAC,CAAC,CAAA;QAEF,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,CAAA;QAExB,MAAM,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;YAClC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;YAC/C,MAAM,gBAAgB,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;YACjD,MAAM,OAAO,GAAG;gBACd,GAAG,IAAI;gBACP,cAAc,EAAE,MAAM;gBACtB,cAAc,EAAE,OAAO;gBACvB,iFAAiF;gBACjF,6DAA6D;gBAC7D,QAAQ,EAAE;oBACR,CAAC,EAAE,gBAAgB,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC;oBACjC,CAAC,EAAE,gBAAgB,CAAC,CAAC,GAAG,MAAM,GAAG,CAAC;iBACnC;aACF,CAAA;YAED,OAAO,OAAO,CAAA;QAChB,CAAC,CAAC,CAAA;QAEF,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAA;IACnC,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAA;AACpB,CAAC"}
+{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/layout.ts"],"names":[],"mappings":"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"}

package/dist/views/Steps/FlowChart/styled.d.ts

@@ -10,6 +10,5 @@ export declare const answerNodeSize: {
     width: number;
     height: number;
 };
-export declare const runningColor = "#0097FA";
 export declare const FlowChartBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 //# sourceMappingURL=styled.d.ts.map

package/dist/views/Steps/FlowChart/styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/styled.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY;;;CAA8B,CAAA;AACvD,eAAO,MAAM,gBAAgB;;;CAA6B,CAAA;AAC1D,eAAO,MAAM,cAAc;;;CAA6B,CAAA;AACxD,eAAO,MAAM,YAAY,YAAY,CAAA;AAErC,eAAO,MAAM,YAAY,wOA4HxB,CAAA"}
+{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/styled.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY;;;CAA8B,CAAA;AACvD,eAAO,MAAM,gBAAgB;;;CAA6B,CAAA;AAC1D,eAAO,MAAM,cAAc;;;CAA6B,CAAA;AAExD,eAAO,MAAM,YAAY,wOAqJxB,CAAA"}

package/dist/views/Steps/FlowChart/styled.js

@@ -1,9 +1,8 @@
 import { theme } from '@stack-spot/portal-theme';
 import { styled } from 'styled-components';
-export const stepNodeSize = { width: 160, height: 167 };
-export const planningNodeSize = { width: 160, height: 61 };
-export const answerNodeSize = { width: 160, height: 40 };
-export const runningColor = '#0097FA';
+export const stepNodeSize = { width: 400, height: 167 };
+export const planningNodeSize = { width: 400, height: 61 };
+export const answerNodeSize = { width: 400, height: 40 };
 export const FlowChartBox = styled.div `
   width: 100%;
   height: 100%;
@@ -17,31 +16,35 @@ export const FlowChartBox = styled.div `
     border: 1px solid ${theme.color.light[600]};
     background-color: ${theme.color.light[500]};
     box-sizing: border-box;
-    justify-content: center;
-
-    &.running .source-handle {
-      background-color: ${runningColor};
-    }
+    justify-content: center; 
+    width: 400px;
 
     &.pending .source-handle {
       opacity: 0.3;
     }
 
+    .source-handle {
+      transition: opacity 1s ease; opacity: 1;
+    }
+
+    &.running .source-handle {
+       opacity: 0;
+    }
+    
     &.step {
       width: ${stepNodeSize.width}px;
-      height: ${stepNodeSize.height}px;
+      min-height: ${stepNodeSize.height}px;
     }
 
     &.planning {
       width: ${planningNodeSize.width}px;
-      height: ${planningNodeSize.height}px;
+      min-height: ${planningNodeSize.height}px;
     }
 
     &.answer {
       width: ${answerNodeSize.width}px;
-      height: ${answerNodeSize.height}px;
+      min-height: ${answerNodeSize.height}px;
     }
-
     header {
       display: flex;
       gap: 4px;
@@ -69,7 +72,7 @@ export const FlowChartBox = styled.div `
       flex-direction: column;
       align-items: start;
       justify-content: space-between;
-      gap: 10px;
+      gap: 8px;
       overflow: hidden;
 
       .step-description {
@@ -87,6 +90,28 @@ export const FlowChartBox = styled.div `
         }
       }
     }
+
+    .wrapper-tool {
+      &:not(:last-child) {         
+        border-bottom: 1px solid ${theme.color.light[600]};
+        padding-bottom: 8px;
+      }
+      
+      .tool {
+        padding: 8px;     
+        border-radius: 4px;
+        min-height: 48px;
+        border: 1px solid ${theme.color.light[500]};
+        background-color: ${theme.color.light[400]}; 
+        border-bottom: 1px solid ${theme.color.light[300]}; 
+        cursor: pointer; 
+      
+        &:hover .title {
+          text-decoration: underline;
+        }      
+      }
+    }
+ 
   }
 
   .source-handle {
@@ -119,7 +144,6 @@ export const FlowChartBox = styled.div `
       opacity: 0.3;
     }
     &.running path {
-      stroke: ${runningColor};
       stroke-dasharray: 5, 5;
     }
   }

package/dist/views/Steps/FlowChart/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/styled.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAE1C,MAAM,CAAC,MAAM,YAAY,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAA;AACvD,MAAM,CAAC,MAAM,gBAAgB,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE,CAAA;AAC1D,MAAM,CAAC,MAAM,cAAc,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE,CAAA;AACxD,MAAM,CAAC,MAAM,YAAY,GAAG,SAAS,CAAA;AAErC,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;wBAUd,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;wBACtB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;0BAKpB,YAAY;;;;;;;;eAQvB,YAAY,CAAC,KAAK;gBACjB,YAAY,CAAC,MAAM;;;;eAIpB,gBAAgB,CAAC,KAAK;gBACrB,gBAAgB,CAAC,MAAM;;;;eAIxB,cAAc,CAAC,KAAK;gBACnB,cAAc,CAAC,MAAM;;;;;;;;;;;;;;;;;eAiBtB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;0BAKX,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBA6BxB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;wBAStB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;gBAa9B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;gBAOtB,YAAY;;;;;;;;;CAS3B,CAAA"}
+{"version":3,"file":"styled.js","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/styled.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAChD,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAE1C,MAAM,CAAC,MAAM,YAAY,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,CAAA;AACvD,MAAM,CAAC,MAAM,gBAAgB,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE,CAAA;AAC1D,MAAM,CAAC,MAAM,cAAc,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE,CAAA;AAExD,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;wBAUd,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;wBACtB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;;;;;eAkB/B,YAAY,CAAC,KAAK;oBACb,YAAY,CAAC,MAAM;;;;eAIxB,gBAAgB,CAAC,KAAK;oBACjB,gBAAgB,CAAC,MAAM;;;;eAI5B,cAAc,CAAC,KAAK;oBACf,cAAc,CAAC,MAAM;;;;;;;;;;;;;;;;eAgB1B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;0BAKX,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mCA6Bb,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;4BAQ7B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;4BACtB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;mCACf,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;wBAYjC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;wBAStB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;gBAa9B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;;CAerC,CAAA"}

package/dist/views/Steps/FlowChart/types.d.ts

@@ -1,13 +1,25 @@
 import { ChatStep } from '@stack-spot/portal-network';
+import { Node } from '@xyflow/react';
+import { ChatEntry } from '../../../state/ChatEntry.js';
+export type NodeType = 'step' | 'planning' | 'answer' | 'tool';
 export interface NodeData {
     nextStatus: ChatStep['status'] | undefined;
-    onClick?: () => void;
+    onClick?: (toolIndex?: number) => void;
     step: ChatStep;
     index: number;
+    message: ChatEntry;
+    onResize?: (size: {
+        width: number;
+        height: number;
+    }) => void;
 }
 export interface NodeWithoutLayout {
     id: string;
-    type: 'step' | 'planning' | 'answer' | 'tool';
+    type: NodeType;
     data?: NodeData;
 }
+export type NodeDataFullProps = NodeData & Record<string, unknown>;
+export interface NodeFullProps extends Node<NodeDataFullProps> {
+    type: NodeType;
+}
 //# sourceMappingURL=types.d.ts.map

package/dist/views/Steps/FlowChart/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAA;AAErD,MAAM,WAAW,QAAQ;IACvB,UAAU,EAAE,QAAQ,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC;IAC3C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC9C,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/views/Steps/FlowChart/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAA;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAA;AAEpD,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAA;AAE9D,MAAM,WAAW,QAAQ;IACvB,UAAU,EAAE,QAAQ,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC;IAC3C,OAAO,CAAC,EAAE,CAAC,SAAS,CAAC,EAAG,MAAM,KAAK,IAAI,CAAC;IACxC,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,SAAS,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CAC9D;AAED,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB;AAED,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;AAElE,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,iBAAiB,CAAC;IAC5D,IAAI,EAAE,QAAQ,CAAC;CAChB"}

package/dist/views/Steps/StepModal.d.ts

@@ -2,8 +2,9 @@ import { ChatEntry } from '../../state/ChatEntry.js';
 interface Props {
     message: ChatEntry;
     stepId: string | undefined;
+    toolIndex?: number;
     onClose: () => void;
 }
-export declare const StepModal: ({ message, stepId, onClose }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const StepModal: ({ message, stepId, toolIndex, onClose }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=StepModal.d.ts.map

package/dist/views/Steps/StepModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StepModal.d.ts","sourceRoot":"","sources":["../../../src/views/Steps/StepModal.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AAIjD,UAAU,KAAK;IACb,OAAO,EAAE,SAAS,CAAC;IACnB,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAuGD,eAAO,MAAM,SAAS,iCAAkC,KAAK,4CAyF5D,CAAA"}
+{"version":3,"file":"StepModal.d.ts","sourceRoot":"","sources":["../../../src/views/Steps/StepModal.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAA;AAIjD,UAAU,KAAK;IACb,OAAO,EAAE,SAAS,CAAC;IACnB,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAiHD,eAAO,MAAM,SAAS,4CAA6C,KAAK,4CAmGvE,CAAA"}

package/dist/views/Steps/StepModal.js

@@ -1,6 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Badge, IconButton, Row, Text } from '@stack-spot/citric-react';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Avatar, Badge, Divider, IconButton, Row, Text } from '@stack-spot/citric-react';
 import { theme } from '@stack-spot/portal-theme';
+import { isNil } from 'lodash';
 import { useMemo, useState } from 'react';
 import { styled } from 'styled-components';
 import { Code } from '../../components/Code.js';
@@ -36,16 +37,26 @@ const StyledSection = styled.section `
     align-items: start;
     align-self: stretch;
     gap: 6px;
-    background-color: ${theme.color.light[500]};
+    background-color: ${theme.color.light[400]};
     border-radius: 5px;
-    padding: 6px;
+    padding: 0 6px;
 
     &:not(:last-child) {
       border-bottom: 1px solid ${theme.color.light[500]};
     }
 
+    hr {
+      margin: 16px 0;
+    }
+    
+    .header-code {
+      background-color: ${theme.color.light[300]};
+    }
+
     .tool-input {
       align-self: stretch;
+      border: 1px solid ${theme.color.light[600]};
+      margin-top: 8px;
       &, .highlighter {
         background: ${theme.color.light[300]} !important;
       }
@@ -109,14 +120,20 @@ const ExecutionBox = styled.div `
     }
   }
 `;
-export const StepModal = ({ message, stepId, onClose }) => {
+export const StepModal = ({ message, stepId, toolIndex, onClose }) => {
     const t = useStepsDictionary();
     const entry = useChatEntry(message);
     const [attempt, setAttempt] = useState(0);
     const stepIndex = useMemo(() => entry.steps?.findIndex(s => s.id === stepId) ?? -1, [entry, stepId]);
     const step = entry.steps?.[stepIndex];
-    const tools = step?.type === 'step' ? step.attempts[attempt]?.tools?.map(tool => (_jsxs("div", { className: "tool", children: [_jsx(ToolBadge, { name: tool.name ?? '', duration: tool.duration, image: tool.image, description: tool.description }), tool.input && _jsxs(_Fragment, { children: [_jsxs(Text, { appearance: "microtext1", color: "light.700", children: [t.input, ":"] }), _jsx(Code, { language: "json", className: "tool-input", showLineNumbers: false, showActionBar: true, children: tool.input })] }), tool.output && _jsxs(_Fragment, { children: [_jsxs(Text, { appearance: "microtext1", color: "light.700", children: [t.response, ":"] }), _jsx(Code, { language: "json", className: "tool-input", showLineNumbers: false, showActionBar: true, children: tool.output })] })] }, tool.id))) : undefined;
-    const title = (_jsxs(Row, { flex: 1, justifyContent: "space-between", children: [_jsx(Text, { appearance: "h6", children: getTitle(t, step, stepIndex) }), _jsxs(ExecutionBox, { children: [_jsxs(Text, { className: "time", appearance: "microtext1", children: [step?.status === 'running' && t.running, step?.status === 'pending' && t.pending, step?.status === 'success' && `${t.executionTime}: ${step?.duration ? `${toPrecision(step?.duration)}s` : t.unknown}`] }), step?.type === 'step' && step.attempts.length > 1 && _jsxs("div", { className: "navigator", children: [attempt > 0 && (_jsx(IconButton, { icon: "ChevronLeft", size: "xs", title: t.previousAttempt, "aria-label": t.previousAttempt, onClick: () => setAttempt(attempt - 1) })), _jsxs(Text, { appearance: "microtext1", children: [attempt + 1, "/", step.attempts.length] }), attempt < step.attempts.length - 1 && (_jsx(IconButton, { icon: "ChevronRight", size: "xs", title: t.nextAttempt, "aria-label": t.nextAttempt, onClick: () => setAttempt(attempt + 1) }))] })] })] }));
+    const showSingleTool = !isNil(toolIndex);
+    const attemptTools = step?.type === 'step' ? step.attempts[attempt]?.tools : undefined;
+    const toolsToRender = showSingleTool && attemptTools ? [attemptTools[toolIndex]].filter(Boolean) : attemptTools;
+    const tools = toolsToRender?.map(tool => (_jsxs("div", { className: "tool", children: [!showSingleTool && _jsx(ToolBadge, { name: tool.name ?? '', duration: tool.duration, image: tool.image, description: tool.description }), tool.input && _jsxs(_Fragment, { children: [_jsx(Badge, { appearance: "square", colorPalette: "cyan", children: t.input }), _jsx(Code, { language: "json", className: "tool-input", showLineNumbers: false, showActionBar: true, children: tool.input })] }), tool.output && _jsxs(_Fragment, { children: [_jsx(Divider, {}), _jsx(Badge, { appearance: "square", colorPalette: "cyan", children: t.response }), _jsx(Code, { language: "json", className: "tool-input", showLineNumbers: false, showActionBar: true, children: tool.output })] })] }, tool.id)));
+    const singleTool = showSingleTool ? toolsToRender?.[0] : undefined;
+    const title = (showSingleTool
+        ? _jsxs(Row, { flex: 1, gap: "8px", children: [!!singleTool?.name && _jsx(Avatar, { size: "xxs", image: singleTool?.image, name: singleTool?.name }), _jsx(Text, { appearance: "h6", children: singleTool?.name ?? t.finalAnswer })] })
+        : _jsxs(Row, { flex: 1, justifyContent: "space-between", children: [_jsx(Text, { appearance: "h6", children: getTitle(t, step, stepIndex) }), _jsxs(ExecutionBox, { children: [_jsxs(Text, { className: "time", appearance: "microtext1", children: [step?.status === 'running' && t.running, step?.status === 'pending' && t.pending, step?.status === 'success' && `${t.executionTime}: ${step?.duration ? `${toPrecision(step?.duration)}s` : t.unknown}`] }), step?.type === 'step' && step.attempts.length > 1 && _jsxs("div", { className: "navigator", children: [attempt > 0 && (_jsx(IconButton, { icon: "ChevronLeft", size: "xs", title: t.previousAttempt, "aria-label": t.previousAttempt, onClick: () => setAttempt(attempt - 1) })), _jsxs(Text, { appearance: "microtext1", children: [attempt + 1, "/", step.attempts.length] }), attempt < step.attempts.length - 1 && (_jsx(IconButton, { icon: "ChevronRight", size: "xs", title: t.nextAttempt, "aria-label": t.nextAttempt, onClick: () => setAttempt(attempt + 1) }))] })] })] }));
     return (_jsxs(Modal, { open: !!step, onClose: onClose, title: title, children: [step?.type === 'answer' && _jsx(StyledSection, { className: "restrict-image-size", children: entry.type === 'md' ? _jsx(Markdown, { children: entry.content }) : _jsx(Text, { children: entry.content }) }), step?.type === 'planning' && _jsxs(StyledSection, { style: { alignItems: 'stretch' }, children: [_jsx(Badge, { appearance: "square", colorPalette: "blue", style: { alignSelf: 'start' }, children: "Prompt" }), _jsx(Text, { children: step.goal }), _jsx("ul", { className: "steps", children: entry.steps?.filter(s => s.type === 'step').map((s, index) => (_jsxs("li", { children: [_jsx(Row, { mb: 2, children: _jsxs(Text, { children: [t.step, " ", index + 1, ": ", _jsx("span", { className: "step-description", children: s.input })] }) }), !!s.attempts[0].tools?.length && _jsx("ul", { className: "side-by-side-tools", children: s.attempts[0].tools.map((tool) => (_jsx("li", { children: _jsx(ToolBadge, { name: tool.name ?? '', image: tool.image }) }, tool.id))) })] }, index))) })] }), step?.type === 'step' && step?.input && _jsxs(StyledSection, { children: [_jsx(Badge, { appearance: "square", colorPalette: "blue", children: "Prompt" }), _jsx(Text, { children: step.input })] }), !!tools?.length && _jsx(StyledSection, { children: tools })] }));
 };
 //# sourceMappingURL=StepModal.js.map

package/dist/views/Steps/StepModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepModal.js","sourceRoot":"","sources":["../../../src/views/Steps/StepModal.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"StepModal.js","sourceRoot":"","sources":["../../../src/views/Steps/StepModal.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAA;AAExF,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAChD,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAC1C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAA;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAA;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAA;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAA;AAElD,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAA;AACjD,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAS/C,MAAM,aAAa,GAAG,MAAM,CAAC,OAAO,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;wBA0BZ,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;iCAKb,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;0BAQ7B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;0BAKtB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;sBAG1B,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;;;;;;0BAmBlB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;eAKjC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;CAYpC,CAAA;AAED,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAA;;sBAET,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;WACjC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;8BAKH,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;;;;;;;;;;;;;;;;CAgBnD,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAS,EAAE,EAAE;IAC1E,MAAM,CAAC,GAAG,kBAAkB,EAAE,CAAA;IAC9B,MAAM,KAAK,GAAG,YAAY,CAAC,OAAO,CAAC,CAAA;IACnC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IACzC,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAA;IACpG,MAAM,IAAI,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC,SAAS,CAAC,CAAA;IACrC,MAAM,cAAc,GAAG,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IACxC,MAAM,YAAY,GAAgC,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,SAAS,CAAA;IACnH,MAAM,aAAa,GAAG,cAAc,IAAI,YAAY,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,YAAY,CAAA;IAE/G,MAAM,KAAK,GAAG,aAAa,EAAE,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACvC,eAAK,SAAS,EAAC,MAAM,aAClB,CAAC,cAAc,IAAI,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,GAAI,EAClI,IAAI,CAAC,KAAK,IAAI,8BACb,KAAC,KAAK,IAAC,UAAU,EAAC,QAAQ,EAAC,YAAY,EAAC,MAAM,YAAE,CAAC,CAAC,KAAK,GAAS,EAChE,KAAC,IAAI,IAAC,QAAQ,EAAC,MAAM,EAAC,SAAS,EAAC,YAAY,EAAC,eAAe,EAAE,KAAK,EAAE,aAAa,kBAAE,IAAI,CAAC,KAAK,GAAQ,IACrG,EACF,IAAI,CAAC,MAAM,IAAI,8BACd,KAAC,OAAO,KAAG,EACX,KAAC,KAAK,IAAC,UAAU,EAAC,QAAQ,EAAC,YAAY,EAAC,MAAM,YAAE,CAAC,CAAC,QAAQ,GAAS,EACnE,KAAC,IAAI,IAAC,QAAQ,EAAC,MAAM,EAAC,SAAS,EAAC,YAAY,EAAC,eAAe,EAAE,KAAK,EAAE,aAAa,kBAAE,IAAI,CAAC,MAAM,GAAQ,IACtG,KAVsB,IAAI,CAAC,EAAE,CAW5B,CACP,CAAC,CAAA;IAEF,MAAM,UAAU,GAAG,cAAc,CAAC,CAAC,CAAC,aAAa,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IAElE,MAAM,KAAK,GAAG,CAAC,cAAc;QAC3B,CAAC,CAAC,MAAC,GAAG,IAAC,IAAI,EAAE,CAAC,EAAE,GAAG,EAAC,KAAK,aACtB,CAAC,CAAC,UAAU,EAAE,IAAI,IAAI,KAAC,MAAM,IAAC,IAAI,EAAC,KAAK,EAAC,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,GAAI,EAC9F,KAAC,IAAI,IAAC,UAAU,EAAC,IAAI,YAAE,UAAU,EAAE,IAAI,IAAI,CAAC,CAAC,WAAW,GAAQ,IAC5D;QACN,CAAC,CAAC,MAAC,GAAG,IAAC,IAAI,EAAE,CAAC,EAAE,cAAc,EAAC,eAAe,aAC5C,KAAC,IAAI,IAAC,UAAU,EAAC,IAAI,YAAE,QAAQ,CAAC,CAAC,EAAE,IAAI,EAAE,SAAS,CAAC,GAAQ,EAC3D,MAAC,YAAY,eACX,MAAC,IAAI,IAAC,SAAS,EAAC,MAAM,EAAC,UAAU,EAAC,YAAY,aAC3C,IAAI,EAAE,MAAM,KAAK,SAAS,IAAI,CAAC,CAAC,OAAO,EACvC,IAAI,EAAE,MAAM,KAAK,SAAS,IAAI,CAAC,CAAC,OAAO,EACvC,IAAI,EAAE,MAAM,KAAK,SAAS,IAAI,GAAG,CAAC,CAAC,aAAa,KAAK,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,IAAI,EAAE,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE,IACjH,EACN,IAAI,EAAE,IAAI,KAAK,MAAM,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,IAAI,eAAK,SAAS,EAAC,WAAW,aAC7E,OAAO,GAAG,CAAC,IAAI,CACd,KAAC,UAAU,IACT,IAAI,EAAC,aAAa,EAClB,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,CAAC,CAAC,eAAe,gBACZ,CAAC,CAAC,eAAe,EAC7B,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,GAAG,CAAC,CAAC,GACtC,CACH,EACD,MAAC,IAAI,IAAC,UAAU,EAAC,YAAY,aAAE,OAAO,GAAG,CAAC,OAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,IAAQ,EACxE,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,IAAI,CACrC,KAAC,UAAU,IACT,IAAI,EAAC,cAAc,EACnB,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,CAAC,CAAC,WAAW,gBACR,CAAC,CAAC,WAAW,EACzB,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,GAAG,CAAC,CAAC,GACtC,CACH,IACG,IACO,IACX,CACP,CAAA;IAED,OAAO,CACL,MAAC,KAAK,IAAC,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,aAChD,IAAI,EAAE,IAAI,KAAK,QAAQ,IAAI,KAAC,aAAa,IAAC,SAAS,EAAC,qBAAqB,YACvE,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,KAAC,QAAQ,cAAE,KAAK,CAAC,OAAO,GAAY,CAAC,CAAC,CAAC,KAAC,IAAI,cAAE,KAAK,CAAC,OAAO,GAAQ,GAC5E,EAEf,IAAI,EAAE,IAAI,KAAK,UAAU,IAAI,MAAC,aAAa,IAAC,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,aAC3E,KAAC,KAAK,IAAC,UAAU,EAAC,QAAQ,EAAC,YAAY,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,uBAAgB,EAC5F,KAAC,IAAI,cAAE,IAAI,CAAC,IAAI,GAAQ,EACxB,aAAI,SAAS,EAAC,OAAO,YAClB,KAAK,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CAC7D,yBACE,KAAC,GAAG,IAAC,EAAE,EAAE,CAAC,YACR,MAAC,IAAI,eAAE,CAAC,CAAC,IAAI,OAAG,KAAK,GAAG,CAAC,QAAG,eAAM,SAAS,EAAC,kBAAkB,YAAE,CAAC,CAAC,KAAK,GAAQ,IAAO,GAClF,EACL,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,aAAI,SAAS,EAAC,oBAAoB,YACjE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACjC,uBACE,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,IADhD,IAAI,CAAC,EAAE,CAEX,CACN,CAAC,GACC,KAVE,KAAK,CAWT,CACN,CAAC,GACC,IACS,EAEf,IAAI,EAAE,IAAI,KAAK,MAAM,IAAI,IAAI,EAAE,KAAK,IAAI,MAAC,aAAa,eACrD,KAAC,KAAK,IAAC,UAAU,EAAC,QAAQ,EAAC,YAAY,EAAC,MAAM,uBAAe,EAC7D,KAAC,IAAI,cAAE,IAAI,CAAC,KAAK,GAAQ,IACX,EACf,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,KAAC,aAAa,cAAE,KAAK,GAAiB,IACpD,CACT,CAAA;AACH,CAAC,CAAA"}

package/dist/views/Steps/StepsPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StepsPanel.d.ts","sourceRoot":"","sources":["../../../src/views/Steps/StepsPanel.tsx"],"names":[],"mappings":"AAOA,QAAA,MAAM,UAAU,0BAA2B;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,mDAc/E,CAAA;AAED,eAAe,UAAU,CAAA"}
+{"version":3,"file":"StepsPanel.d.ts","sourceRoot":"","sources":["../../../src/views/Steps/StepsPanel.tsx"],"names":[],"mappings":"AAQA,QAAA,MAAM,UAAU,0BAA2B;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,mDAoB/E,CAAA;AAED,eAAe,UAAU,CAAA"}

package/dist/views/Steps/StepsPanel.js

@@ -1,14 +1,18 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-/* eslint-disable import/no-default-export */
 import { useMemo, useState } from 'react';
 import { useWidget } from '../../context/hooks.js';
 import { FlowChart } from './FlowChart/index.js';
 import { StepModal } from './StepModal.js';
 const StepsPanel = ({ chatId, messageId }) => {
     const [currentStepId, setCurrentStepId] = useState();
+    const [toolIndex, setToolIndex] = useState();
     const widget = useWidget();
     const message = useMemo(() => widget.chatTabs.getAll().find(c => c.id === chatId)?.getMessages().find(m => m.id === messageId), [chatId, messageId]);
-    return message ? (_jsxs(_Fragment, { children: [_jsx(FlowChart, { message: message, onClick: (step) => setCurrentStepId(step.id) }), _jsx(StepModal, { message: message, stepId: currentStepId, onClose: () => setCurrentStepId(undefined) })] })) : null;
+    const handleClick = (step, tooIndex) => {
+        setCurrentStepId(step.id);
+        setToolIndex(tooIndex);
+    };
+    return message ? (_jsxs(_Fragment, { children: [_jsx(FlowChart, { message: message, onClick: handleClick, direction: "TB" }), _jsx(StepModal, { message: message, stepId: currentStepId, toolIndex: toolIndex, onClose: () => setCurrentStepId(undefined) })] })) : null;
 };
 export default StepsPanel;
 //# sourceMappingURL=StepsPanel.js.map

package/dist/views/Steps/StepsPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepsPanel.js","sourceRoot":"","sources":["../../../src/views/Steps/StepsPanel.tsx"],"names":[],"mappings":";AAAA,6CAA6C;AAE7C,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAEvC,MAAM,UAAU,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAyC,EAAE,EAAE;IAClF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAAsB,CAAA;IACxE,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,SAAS,CAAC,EACtG,CAAC,MAAM,EAAE,SAAS,CAAC,CACpB,CAAA;IAED,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,8BACE,KAAC,SAAS,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,GAAI,EAC7E,KAAC,SAAS,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,SAAS,CAAC,GAAI,IACjG,CACJ,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAA;AAED,eAAe,UAAU,CAAA"}
+{"version":3,"file":"StepsPanel.js","sourceRoot":"","sources":["../../../src/views/Steps/StepsPanel.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAEvC,MAAM,UAAU,GAAG,CAAC,EAAE,MAAM,EAAE,SAAS,EAAyC,EAAE,EAAE;IAClF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAAsB,CAAA;IACxE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,EAAsB,CAAA;IAChE,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,SAAS,CAAC,EACtG,CAAC,MAAM,EAAE,SAAS,CAAC,CACpB,CAAA;IAED,MAAM,WAAW,GAAG,CAAC,IAAc,EAAE,QAAiB,EAAE,EAAE;QACxD,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;QACzB,YAAY,CAAC,QAAQ,CAAC,CAAA;IACxB,CAAC,CAAA;IAED,OAAO,OAAO,CAAC,CAAC,CAAC,CACf,8BACE,KAAC,SAAS,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,EAAC,IAAI,GAAG,EACpE,KAAC,SAAS,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,SAAS,CAAC,GAAI,IACvH,CACJ,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAA;AAED,eAAe,UAAU,CAAA"}

package/dist/views/Steps/dictionary.d.ts

@@ -16,6 +16,8 @@ export declare const dictionary: {
         open: string;
         close: string;
         input: string;
+        finalAnswer: string;
+        userPrompt: string;
     };
     pt: {
         stepsPanelDescription: string;
@@ -32,8 +34,10 @@ export declare const dictionary: {
         nextAttempt: string;
         previousAttempt: string;
         input: string;
+        finalAnswer: string;
+        userPrompt: string;
     };
 };
-export declare function useStepsDictionary(): Record<"pending" | "input" | "step" | "steps" | "answer" | "running" | "tools" | "planning" | "unknown" | "stepsPanelDescription" | "response" | "executionTime" | "nextAttempt" | "previousAttempt", string>;
+export declare function useStepsDictionary(): Record<"pending" | "input" | "step" | "steps" | "answer" | "running" | "tools" | "planning" | "unknown" | "stepsPanelDescription" | "response" | "executionTime" | "nextAttempt" | "previousAttempt" | "finalAnswer" | "userPrompt", string>;
 export type ToolsDictionary = typeof dictionary['en'];
 //# sourceMappingURL=dictionary.d.ts.map

package/dist/views/Steps/dictionary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dictionary.d.ts","sourceRoot":"","sources":["../../../src/views/Steps/dictionary.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCD,CAAA;AAEtB,wBAAgB,kBAAkB,kNAEjC;AAED,MAAM,MAAM,eAAe,GAAG,OAAO,UAAU,CAAC,IAAI,CAAC,CAAA"}
+{"version":3,"file":"dictionary.d.ts","sourceRoot":"","sources":["../../../src/views/Steps/dictionary.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuCD,CAAA;AAEtB,wBAAgB,kBAAkB,iPAEjC;AAED,MAAM,MAAM,eAAe,GAAG,OAAO,UAAU,CAAC,IAAI,CAAC,CAAA"}

package/dist/views/Steps/dictionary.js

@@ -17,6 +17,8 @@ export const dictionary = {
         open: 'Open',
         close: 'Close',
         input: 'Input',
+        finalAnswer: 'Final answer',
+        userPrompt: 'User prompt',
     },
     pt: {
         stepsPanelDescription: 'Os passos e ferramentas usados para chegar na resposta',
@@ -33,6 +35,8 @@ export const dictionary = {
         nextAttempt: 'Próxima execução',
         previousAttempt: 'Execução anterior',
         input: 'Entrada',
+        finalAnswer: 'Resposta final',
+        userPrompt: 'Prompt do usuário',
     },
 };
 export function useStepsDictionary() {

package/dist/views/Steps/dictionary.js.map

@@ -1 +1 @@
-{"version":3,"file":"dictionary.js","sourceRoot":"","sources":["../../../src/views/Steps/dictionary.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAEvE,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,EAAE,EAAE;QACF,qBAAqB,EAAE,8CAA8C;QACrE,KAAK,EAAE,OAAO;QACd,IAAI,EAAE,MAAM;QACZ,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,OAAO;QACd,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,cAAc;QACtB,aAAa,EAAE,MAAM;QACrB,OAAO,EAAE,SAAS;QAClB,OAAO,EAAE,SAAS;QAClB,OAAO,EAAE,SAAS;QAClB,WAAW,EAAE,gBAAgB;QAC7B,eAAe,EAAE,oBAAoB;QACrC,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,OAAO;QACd,KAAK,EAAE,OAAO;KACf;IACD,EAAE,EAAE;QACF,qBAAqB,EAAE,wDAAwD;QAC/E,KAAK,EAAE,QAAQ;QACf,IAAI,EAAE,OAAO;QACb,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,aAAa;QACpB,QAAQ,EAAE,cAAc;QACxB,MAAM,EAAE,gBAAgB;QACxB,aAAa,EAAE,OAAO;QACtB,OAAO,EAAE,cAAc;QACvB,OAAO,EAAE,YAAY;QACrB,OAAO,EAAE,YAAY;QACrB,WAAW,EAAE,kBAAkB;QAC/B,eAAe,EAAE,mBAAmB;QACpC,KAAK,EAAE,SAAS;KACjB;CACmB,CAAA;AAEtB,MAAM,UAAU,kBAAkB;IAChC,OAAO,YAAY,CAAC,UAAU,CAAC,CAAA;AACjC,CAAC"}
+{"version":3,"file":"dictionary.js","sourceRoot":"","sources":["../../../src/views/Steps/dictionary.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAEvE,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,EAAE,EAAE;QACF,qBAAqB,EAAE,8CAA8C;QACrE,KAAK,EAAE,OAAO;QACd,IAAI,EAAE,MAAM;QACZ,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,OAAO;QACd,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,cAAc;QACtB,aAAa,EAAE,MAAM;QACrB,OAAO,EAAE,SAAS;QAClB,OAAO,EAAE,SAAS;QAClB,OAAO,EAAE,SAAS;QAClB,WAAW,EAAE,gBAAgB;QAC7B,eAAe,EAAE,oBAAoB;QACrC,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,OAAO;QACd,KAAK,EAAE,OAAO;QACd,WAAW,EAAE,cAAc;QAC3B,UAAU,EAAE,aAAa;KAC1B;IACD,EAAE,EAAE;QACF,qBAAqB,EAAE,wDAAwD;QAC/E,KAAK,EAAE,QAAQ;QACf,IAAI,EAAE,OAAO;QACb,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,aAAa;QACpB,QAAQ,EAAE,cAAc;QACxB,MAAM,EAAE,gBAAgB;QACxB,aAAa,EAAE,OAAO;QACtB,OAAO,EAAE,cAAc;QACvB,OAAO,EAAE,YAAY;QACrB,OAAO,EAAE,YAAY;QACrB,WAAW,EAAE,kBAAkB;QAC/B,eAAe,EAAE,mBAAmB;QACpC,KAAK,EAAE,SAAS;QAChB,WAAW,EAAE,gBAAgB;QAC7B,UAAU,EAAE,mBAAmB;KAChC;CACmB,CAAA;AAEtB,MAAM,UAAU,kBAAkB;IAChC,OAAO,YAAY,CAAC,UAAU,CAAC,CAAA;AACjC,CAAC"}

package/dist/views/Steps/utils.js

@@ -12,8 +12,8 @@ export function getStatusIcon(status) {
 }
 export function getTypeIcon(type) {
     switch (type) {
-        case 'planning': return { group: 'outline', icon: 'ListUnordered' };
-        default: return { group: 'fill', icon: 'Play' };
+        case 'planning': return { group: 'fill', icon: 'ChevronRight' };
+        default: return { group: 'outline', icon: 'StackSpot' };
     }
 }
 export function getTitle(translation, step, index) {

package/dist/views/Steps/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/views/Steps/utils.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAY,MAAM,0BAA0B,CAAA;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAE3D,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAEhD,MAAM,UAAU,aAAa,CAAC,MAA0B;IACtD,QAAQ,MAAM,EAAE,CAAC;QACf,KAAK,SAAS,CAAC,CAAC,OAAO,KAAC,IAAI,IAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,GAAI,CAAA;QAC3G,KAAK,OAAO,CAAC,CAAC,OAAO,KAAC,IAAI,IAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,GAAI,CAAA;QACxG,KAAK,SAAS,CAAC,CAAC,OAAO,KAAC,gBAAgB,IAAC,WAAW,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,GAAG,CAAA;QAC3E,OAAO,CAAC,CAAC,OAAO,IAAI,CAAA;IACtB,CAAC;AACH,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,IAAsB;IAChD,QAAQ,IAAI,EAAE,CAAC;QACb,KAAK,UAAU,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,eAAe,EAAE,CAAA;QACnE,OAAO,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,CAAA;IACjD,CAAC;AACH,CAAC;AAED,MAAM,UAAU,QAAQ,CAAC,WAA2D,EAAE,IAA0B,EAAE,KAAa;IAC7H,IAAI,CAAC,IAAI;QAAE,OAAO,EAAE,CAAA;IACpB,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;QAClB,KAAK,UAAU,CAAC,CAAC,OAAO,WAAW,CAAC,QAAQ,CAAA;QAC5C,KAAK,MAAM,CAAC,CAAC,OAAO,GAAG,WAAW,CAAC,IAAI,IAAI,KAAK,EAAE,CAAA;QAClD,KAAK,QAAQ,CAAC,CAAC,OAAO,WAAW,CAAC,MAAM,CAAA;IAC1C,CAAC;AACH,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,CAAS,EAAE,eAAe,GAAG,CAAC;IACxD,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,eAAe,CAAC,CAAA;IAC5C,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,MAAM,CAAC,GAAG,MAAM,CAAA;AACxC,CAAC"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/views/Steps/utils.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAY,MAAM,0BAA0B,CAAA;AACzD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAE3D,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAEhD,MAAM,UAAU,aAAa,CAAC,MAA0B;IACtD,QAAQ,MAAM,EAAE,CAAC;QACf,KAAK,SAAS,CAAC,CAAC,OAAO,KAAC,IAAI,IAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,GAAI,CAAA;QAC3G,KAAK,OAAO,CAAC,CAAC,OAAO,KAAC,IAAI,IAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,GAAI,CAAA;QACxG,KAAK,SAAS,CAAC,CAAC,OAAO,KAAC,gBAAgB,IAAC,WAAW,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,GAAG,CAAA;QAC3E,OAAO,CAAC,CAAC,OAAO,IAAI,CAAA;IACtB,CAAC;AACH,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,IAAsB;IAChD,QAAQ,IAAI,EAAE,CAAC;QACb,KAAK,UAAU,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,cAAc,EAAE,CAAA;QAC/D,OAAO,CAAC,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE,CAAA;IACzD,CAAC;AACH,CAAC;AAED,MAAM,UAAU,QAAQ,CAAC,WAA2D,EAAE,IAA0B,EAAE,KAAa;IAC7H,IAAI,CAAC,IAAI;QAAE,OAAO,EAAE,CAAA;IACpB,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;QAClB,KAAK,UAAU,CAAC,CAAC,OAAO,WAAW,CAAC,QAAQ,CAAA;QAC5C,KAAK,MAAM,CAAC,CAAC,OAAO,GAAG,WAAW,CAAC,IAAI,IAAI,KAAK,EAAE,CAAA;QAClD,KAAK,QAAQ,CAAC,CAAC,OAAO,WAAW,CAAC,MAAM,CAAA;IAC1C,CAAC;AACH,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,CAAS,EAAE,eAAe,GAAG,CAAC;IACxD,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,eAAe,CAAC,CAAA;IAC5C,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,MAAM,CAAC,GAAG,MAAM,CAAA;AACxC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stack-spot/ai-chat-widget",
-  "version": "2.8.5",
+  "version": "2.9.0",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -16,7 +16,7 @@
     "@citric/core": "^6.4.0",
     "@stack-spot/portal-components": "^2.27.3",
     "@citric/icons": "^5.13.0",
-    "@stack-spot/portal-network": "0.211.2",
+    "@stack-spot/portal-network": "0.212.0",
     "@citric/ui": "^6.10.2",
     "@stack-spot/portal-translate": "^2.1.0",
     "lodash": "^4.17.0",

package/src/app-metadata.json

@@ -1,7 +1,7 @@
 {
   "name": "@stack-spot/ai-chat-widget",
-  "version": "2.8.5",
-  "date": "Mon Dec 22 2025 20:53:44 GMT+0000 (Coordinated Universal Time)",
+  "version": "2.9.0",
+  "date": "Mon Jan 05 2026 17:22:54 GMT+0000 (Coordinated Universal Time)",
   "dependencies": [
     {
       "name": "@stack-spot/app-metadata",
@@ -121,7 +121,7 @@
     },
     {
       "name": "@stack-spot/portal-network",
-      "version": "0.211.2(@stack-spot/auth@6.1.0)(@stack-spot/opa@2.5.0(@stack-spot/auth@6.1.0)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@stack-spot/portal-translate@2.1.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@tanstack/react-query@5.59.16(react@18.2.0))(react-dom@18.2.0(react@18.2.0))(react@18.2.0)"
+      "version": "0.212.0(@stack-spot/auth@6.1.0)(@stack-spot/opa@2.5.0(@stack-spot/auth@6.1.0)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@stack-spot/portal-translate@2.1.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@tanstack/react-query@5.59.16(react@18.2.0))(react-dom@18.2.0(react@18.2.0))(react@18.2.0)"
     },
     {
       "name": "@stack-spot/portal-theme",

package/src/views/Chat/ButtonExecutionDetail.tsx

@@ -0,0 +1,46 @@
+import { LoadingCircular } from '@citric/ui'
+import { Button, Icon, Row } from '@stack-spot/citric-react'
+import { Dictionary, useTranslate } from '@stack-spot/portal-translate'
+import { useEffect, useMemo } from 'react'
+import { useChatMessages, useWidget } from '../../context/hooks'
+
+export const ButtonExecutionDetail = ({ chatId, messageId }: { chatId: string, messageId: number }) => {
+  const t = useTranslate(dictionary)
+  const messages = useChatMessages(chatId)
+  const widget = useWidget()
+
+  const isRunning = useMemo(() => {
+    const messageEntry = messages?.find((message) => message.id === messageId)
+    return !messageEntry?.getValue().steps?.find((step) => step.type === 'answer' && step.status !== 'running')
+  }, [messageId, messages])
+
+  function openToolsPanel() {
+    if (messageId) {
+      widget.set('currentMessageInPanel', { chatId, messageId })
+      widget.set('panel', 'steps')
+    }
+  }
+
+  useEffect(() => {
+    isRunning && openToolsPanel()
+  }, [isRunning])
+
+  return <>
+    <Row className="step-actions">
+      {isRunning && <LoadingCircular colorScheme="inverse" size="xs" />}
+      <Button colorScheme="light" size="sm" appearance="none" className="icon-button details" onClick={openToolsPanel}>
+        <Icon group="outline" icon="Expand" size="xs" />
+        {t.detailed}
+      </Button>
+    </Row>
+  </>
+}
+
+const dictionary = {
+  en: {
+    detailed: 'View execution details',
+  },
+  pt: {
+    detailed: 'Ver detalhes da execução',
+  },
+} satisfies Dictionary