ReasoningDisplay
Collapsible chain-of-thought block for AI reasoning traces.
Installation
dotnet add package Lumeo
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo <ReasoningDisplay />
When to Use
- Display reasoning traces from chain-of-thought models (e.g. Claude's extended thinking mode).
- Show an intermediate thinking step collapsed by default to avoid cluttering the chat UI.
- Use
IsStreamingto animate while tokens are arriving, then set it to false when the trace is complete.
Reasoning
First, I need to consider the user's question carefully. The problem involves finding the optimal path through a weighted graph. I should apply Dijkstra's algorithm here, starting from the source node. Let me trace through the steps: initialize distances to infinity, process nodes by priority queue... After analyzing all edges, the shortest path from A to D is A → B → C → D with total weight 7.
Reasoned for 4.2s
First, I need to consider the user's question carefully. The problem involves finding the optimal path through a weighted graph. I should apply Dijkstra's algorithm here, starting from the source node. Let me trace through the steps: initialize distances to infinity, process nodes by priority queue... After analyzing all edges, the shortest path from A to D is A → B → C → D with total weight 7.
Reasoning
Analyzing the request...
Chain of thought
First, I need to consider the user's question carefully. The problem involves finding the optimal path through a weighted graph. I should apply Dijkstra's algorithm here, starting from the source node. Let me trace through the steps: initialize distances to infinity, process nodes by priority queue... After analyzing all edges, the shortest path from A to D is A → B → C → D with total weight 7.
Reasoning (markdown)
Let me break this down into steps:
- Parse the input graph
- Run
Dijkstrafrom the source - Return the shortest path
The result is A → B → C → D with total weight 7.
Switch variant to compare Default, Compact, and Detailed layouts.
Reasoned for 2.8s
First, I need to consider the user's question carefully. The problem involves finding the optimal path through a weighted graph. I should apply Dijkstra's algorithm here, starting from the source node. Let me trace through the steps: initialize distances to infinity, process nodes by priority queue... After analyzing all edges, the shortest path from A to D is A → B → C → D with total weight 7.
Switch size to compare Small, Medium, and Large text scaling.
Reasoning
First, I need to consider the user's question carefully. The problem involves finding the optimal path through a weighted graph. I should apply Dijkstra's algorithm here, starting from the source node. Let me trace through the steps: initialize distances to infinity, process nodes by priority queue... After analyzing all edges, the shortest path from A to D is A → B → C → D with total weight 7.
API Reference
ReasoningDisplay
Variant: Default renders the full block, Compact condenses the height, and Detailed expands with extra meta.
Related Components
- StreamingText — Token-by-token streaming text renderer for AI responses.
- ToolCallCard — AI tool-invocation card showing call and result.