aljaz/opencode
1
0
Fork 0
mirror of https://github.com/aljazceru/opencode.git synced 2025-12-22 10:14:22 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: toggle tool details visible

Browse Source
This commit is contained in:
adamdotdevin
2025-08-11 11:58:40 -05:00
parent 3c71fda648
commit 5e777fd2a2
8 changed files with 103 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/web/src/components/share/part.module.css
View File

@@ -136,13 +136,14 @@
flex-grow: 1;
max-width: var(--md-tool-width);
& > [data-component="assistant-reasoning-markdown"] {
[data-component="assistant-reasoning-markdown"] {
align-self: flex-start;
font-size: 0.875rem;
border: 1px solid var(--sl-color-blue-high);
padding: 0.5rem calc(0.5rem + 3px);
border-radius: 0.25rem;
position: relative;
margin-top: 0.5rem;
[data-component="copy-button"] {
top: 0.5rem;

21
packages/web/src/components/share/part.tsx
View File

@@ -152,18 +152,23 @@ export function Part(props: PartProps) {
)}
{` | ${props.message.modelID}`}
{props.message.mode && (
<span style={{ "font-weight": "bold", color: "var(--sl-color-accent)" }}>
{` | ${props.message.mode}`}
</span>
<span style={{ color: "var(--sl-color-accent)" }}>{` | ${props.message.mode}`}</span>
)}
</Footer>
)}
</div>
)}
{props.message.role === "assistant" && props.part.type === "reasoning" && (
<div data-component="assistant-reasoning">
<div data-component="assistant-reasoning-markdown">
<ContentMarkdown expand={props.last} text={props.part.text || "Thinking..."} />
<div data-component="tool">
<div data-component="tool-title">
<span data-slot="name">Thinking</span>
</div>
<div data-component="assistant-reasoning">
<ResultsButton showCopy="Show details" hideCopy="Hide details">
<div data-component="assistant-reasoning-markdown">
<ContentMarkdown expand text={props.part.text || "Thinking..."} />
</div>
</ResultsButton>
</div>
</div>
)}
@@ -182,9 +187,7 @@ export function Part(props: PartProps) {
)}
{` | ${props.message.modelID}`}
{props.message.mode && (
<span style={{ "font-weight": "bold", color: "var(--sl-color-accent)" }}>
{` | ${props.message.mode}`}
</span>
<span style={{ color: "var(--sl-color-accent)" }}>{` | ${props.message.mode}`}</span>
)}
</div>
</div>