@zmzai/theme 0.5.5 → 0.5.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -4,7 +4,8 @@ import { forwardRef, type ButtonHTMLAttributes } from "react";
|
|
|
4
4
|
import { cn } from "../../utils/cn";
|
|
5
5
|
|
|
6
6
|
export interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "ref"> {
|
|
7
|
-
/** 尺寸：sm=h-6 md=h-7 lg=h-8（密集工具条场景，不做 hover
|
|
7
|
+
/** 尺寸：sm=h-6 md=h-7 lg=h-8（密集工具条场景，不做 hover 缩放）。
|
|
8
|
+
* 触控热区通过 ::after(-inset-2) 扩到 ≥40px，视觉尺寸不变。 */
|
|
8
9
|
size?: "sm" | "md" | "lg";
|
|
9
10
|
/** 视觉：ghost=透明 hover 背景；quiet=无 hover 背景只有颜色变化 */
|
|
10
11
|
tone?: "ghost" | "quiet";
|
|
@@ -29,7 +30,7 @@ export const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(
|
|
|
29
30
|
aria-label={label}
|
|
30
31
|
title={label}
|
|
31
32
|
className={cn(
|
|
32
|
-
"inline-flex shrink-0 cursor-pointer items-center justify-center rounded-sm text-ink-3 transition-colors disabled:pointer-events-none disabled:opacity-40",
|
|
33
|
+
"relative inline-flex shrink-0 cursor-pointer items-center justify-center rounded-sm text-ink-3 transition-colors after:absolute after:-inset-2 after:content-[''] disabled:pointer-events-none disabled:opacity-40",
|
|
33
34
|
size === "sm" && "h-6 w-6",
|
|
34
35
|
size === "md" && "h-7 w-7",
|
|
35
36
|
size === "lg" && "h-8 w-8",
|
|
@@ -59,7 +59,8 @@ export function ToolCard({ call, sessionIdle = false }: { call: ToolCall; sessio
|
|
|
59
59
|
/**
|
|
60
60
|
* ToolGroup — 连续工具调用的折叠组（G1 防淹没）。
|
|
61
61
|
*
|
|
62
|
-
*
|
|
62
|
+
* 仅运行中自动展开；失败/单条/历史组一律折叠为一条可点击的摘要行，
|
|
63
|
+
* 避免长会话里"运行了 1 个工具"头 + 展开卡的双倍瀑布。
|
|
63
64
|
*
|
|
64
65
|
* @example
|
|
65
66
|
* <ToolGroup calls={toolCalls} sessionIdle={idle} />
|
|
@@ -69,9 +70,17 @@ export function ToolGroup({ calls, sessionIdle = false }: { calls: ToolCall[]; s
|
|
|
69
70
|
const running = calls.filter((c) => c.state.status === "running" || c.state.status === "pending");
|
|
70
71
|
const failed = calls.filter((c) => c.state.status === "error" || (sessionIdle && (c.state.status === "running" || c.state.status === "pending")));
|
|
71
72
|
const done = calls.filter((c) => c.state.status === "completed");
|
|
72
|
-
const autoExpand = running.length > 0
|
|
73
|
+
const autoExpand = running.length > 0;
|
|
73
74
|
const open = expanded || autoExpand;
|
|
74
75
|
const glyph = failed.length > 0 ? "cross" : running.length > 0 ? "chevron-down" : "check";
|
|
76
|
+
const single = calls.length === 1 ? calls[0] : undefined;
|
|
77
|
+
const singleTitle = single
|
|
78
|
+
? single.state.status === "completed"
|
|
79
|
+
? (single.state.title ?? single.tool)
|
|
80
|
+
: single.state.status === "error"
|
|
81
|
+
? single.state.error
|
|
82
|
+
: single.tool
|
|
83
|
+
: null;
|
|
75
84
|
const summary = [
|
|
76
85
|
running.length > 0 && `${running.length} 个进行中`,
|
|
77
86
|
failed.length > 0 && `${failed.length} 个失败`,
|
|
@@ -81,8 +90,8 @@ export function ToolGroup({ calls, sessionIdle = false }: { calls: ToolCall[]; s
|
|
|
81
90
|
<div className="zmz-tool-group">
|
|
82
91
|
<button type="button" className="zmz-tool-group-trigger" aria-expanded={open} onClick={() => setExpanded((value) => !value)} disabled={autoExpand}>
|
|
83
92
|
<span className="tool-card-glyph" aria-hidden><Icon name={glyph} size={12} /></span>
|
|
84
|
-
<span className="zmz-tool-group-label"
|
|
85
|
-
|
|
93
|
+
<span className="zmz-tool-group-label">{single ? singleTitle : `运行了 ${calls.length} 个工具`}</span>
|
|
94
|
+
<small>{single ? (single.state.status === "completed" ? "完成" : single.state.status === "error" ? "失败" : "进行中") : summary}</small>
|
|
86
95
|
<Icon name="chevron-down" size={12} className={open ? "tool-card-chevron open" : "tool-card-chevron"} />
|
|
87
96
|
</button>
|
|
88
97
|
{open && (
|