@ykurilov/agent-chat-skin-tandem 0.68.0 → 0.69.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @ykurilov/agent-chat-skin-tandem
 
+## 0.69.0
+
+### Minor Changes
+
+- e6c03dc: Значки шагов и заголовки раздумий (106): в простом виде — ряд значков у «Сделано N шагов» и список «значок + фраза» (`StepIcon`, `icon` в `stepPhrases`, `guessStepIcon`); `thoughtTitles` у службы чата — заголовок раздумья от провайдера или пересказ дешёвой моделью в фоне, хранится в части раздумья, в запрос основной модели не идёт, расход `thought_title`; договор скина 28 (`WorkStepsView.live.icon`, `done.items`, `icons`, `moreIcons`, `Reasoning.title`); фраза навыка с именем.
+
+### Patch Changes
+
+- Updated dependencies [e6c03dc]
+  - @ykurilov/agent-chat-react@0.69.0
+  - @ykurilov/agent-chat-skills@0.69.0
+  - @ykurilov/agent-chat-flows@0.69.0
+  - @ykurilov/agent-chat-mcp@0.69.0
+  - @ykurilov/agent-chat-messengers@0.69.0
+  - @ykurilov/agent-chat-sandbox@0.69.0
+
 ## 0.68.0
 
 ### Patch Changes

package/README.md

@@ -29,6 +29,10 @@ pnpm add @ykurilov/agent-chat-skin-tandem "@tandem/ui@npm:@ykurilov/tandem-ui@^0
 (`BranchSwitcher`), правка идёт на месте пузыря (`MessageEditor`). Строка с кнопками занимает прежний промежуток между сообщениями:
 высота сообщения не меняется. На телефоне кнопки видны без наведения.
 
+Простой вид работы агента (договор 28): рядом с «Сделано N шагов» — ряд значков шагов lucide (больше 8 — «+N»), в
+раскрытом списке у каждой строки свой значок, в живой строке значок текущего шага заменяет точку. Раздумье с заголовком
+от сервера показывает его вместо «Думал N сек», и в подробном виде тоже.
+
 Свои кнопки приложения под ответом (`messageActions`, договор скина версии 17) стоят в том же ряду, после копирования: с иконкой —
 кнопка-иконка с подсказкой, как копирование; без иконки — подпись текстом, как «Повторить». Пока обработчик идёт, кнопка неактивна.
 

package/dist/index.js

@@ -1907,10 +1907,10 @@ import { useChatLabels as useChatLabels30 } from "@ykurilov/agent-chat-react";
 import { ChevronDown as ChevronDown3 } from "lucide-react";
 import { useId as useId3 } from "react";
 import { jsx as jsx34, jsxs as jsxs31 } from "react/jsx-runtime";
-function TandemReasoning({ text, streaming, durationMs, open, onOpenChange }) {
+function TandemReasoning({ text, streaming, durationMs, title: thoughtTitle, open, onOpenChange }) {
   const labels = useChatLabels30();
   const contentId = useId3();
-  const title = streaming ? /* @__PURE__ */ jsx34(TandemThinkingLabel, {}) : durationMs === null ? labels.reasoningRunning : labels.reasoningDone(Math.max(1, Math.round(durationMs / 1e3)));
+  const title = streaming ? /* @__PURE__ */ jsx34(TandemThinkingLabel, {}) : thoughtTitle ? thoughtTitle : durationMs === null ? labels.reasoningRunning : labels.reasoningDone(Math.max(1, Math.round(durationMs / 1e3)));
   return /* @__PURE__ */ jsxs31("div", { className: "mb-2 not-first:mt-3", children: [
     /* @__PURE__ */ jsxs31(
       Button20,
@@ -2775,22 +2775,53 @@ function StatusMark2({ status }) {
 }
 
 // src/work-steps.tsx
-import { Button as Button29, cn as cn12 } from "@tandem/ui";
+import { Button as Button29, cn as cn13 } from "@tandem/ui";
 import { useChatLabels as useChatLabels43 } from "@ykurilov/agent-chat-react";
 import { ChevronDown as ChevronDown6 } from "lucide-react";
 import { useId as useId13 } from "react";
-import { jsx as jsx51, jsxs as jsxs42 } from "react/jsx-runtime";
+
+// src/step-icon.tsx
+import { cn as cn12 } from "@tandem/ui";
+import { BookOpen, Bookmark, Bot, Brain as Brain2, Camera, CircleCheck, Clock as Clock2, Eye, Film as Film2, Globe, Image, Pencil as Pencil4, Plug, Search, SquareTerminal, Wrench } from "lucide-react";
+import { jsx as jsx51 } from "react/jsx-runtime";
+var ICONS = {
+  thinking: Brain2,
+  read: Eye,
+  edit: Pencil4,
+  search: Search,
+  web: Globe,
+  skill: BookOpen,
+  mcp: Plug,
+  image: Image,
+  video: Film2,
+  check: CircleCheck,
+  snapshot: Camera,
+  run: SquareTerminal,
+  memory: Bookmark,
+  helper: Bot,
+  task: Clock2,
+  tool: Wrench
+};
+function TandemStepIcon({ icon, className }) {
+  const known = Object.hasOwn(ICONS, icon) ? icon : "tool";
+  const Icon = ICONS[known];
+  return /* @__PURE__ */ jsx51(Icon, { "aria-hidden": "true", "data-step-icon": known, className: cn12("size-3.5 shrink-0", className), strokeWidth: 1.75 });
+}
+
+// src/work-steps.tsx
+import { jsx as jsx52, jsxs as jsxs42 } from "react/jsx-runtime";
 function TandemWorkSteps(view) {
   const labels = useChatLabels43();
   const listId = useId13();
   if (view.state === "live") {
     return /* @__PURE__ */ jsxs42("div", { "data-work-live": true, className: "mb-2 flex h-7 min-w-0 items-center gap-2 last:mb-0 text-xs font-medium text-[var(--foreground-muted)] not-first:mt-3", children: [
-      /* @__PURE__ */ jsx51("span", { "aria-hidden": "true", className: "size-1.5 shrink-0 rounded-full bg-[var(--action)] motion-safe:animate-pulse" }),
-      /* @__PURE__ */ jsx51("span", { "aria-hidden": "true", "data-work-phrase": true, className: "min-w-0 truncate motion-safe:animate-[tandem-fade-in_var(--motion-fast)_ease-out]", children: view.phrase }, view.phrase),
-      /* @__PURE__ */ jsx51("span", { role: "status", className: "sr-only", children: labels.workView.live(labels.workView.stepRunning) })
+      view.icon ? /* @__PURE__ */ jsx52(TandemStepIcon, { icon: view.icon, className: "text-[var(--action)] motion-safe:animate-pulse" }) : /* @__PURE__ */ jsx52("span", { "aria-hidden": "true", className: "size-1.5 shrink-0 rounded-full bg-[var(--action)] motion-safe:animate-pulse" }),
+      /* @__PURE__ */ jsx52("span", { "aria-hidden": "true", "data-work-phrase": true, className: "min-w-0 truncate motion-safe:animate-[tandem-fade-in_var(--motion-fast)_ease-out]", children: view.phrase }, view.phrase),
+      /* @__PURE__ */ jsx52("span", { role: "status", className: "sr-only", children: labels.workView.live(labels.workView.stepRunning) })
     ] });
   }
-  const { steps, count, open, onOpenChange } = view;
+  const { steps, count, open, onOpenChange, items, icons = [], moreIcons = 0 } = view;
+  const list = items ?? steps.map((step) => ({ ...step, icon: void 0 }));
   return /* @__PURE__ */ jsxs42("div", { className: "mb-2 not-first:mt-3", children: [
     /* @__PURE__ */ jsxs42(
       Button29,
@@ -2800,14 +2831,30 @@ function TandemWorkSteps(view) {
         "aria-expanded": open,
         "aria-controls": listId,
         onClick: () => onOpenChange(!open),
-        className: "-ml-2 h-7 gap-1 px-2 text-xs font-medium text-[var(--foreground-muted)]",
+        className: "-ml-2 h-7 max-w-full min-w-0 gap-1 px-2 text-xs font-medium text-[var(--foreground-muted)]",
         children: [
-          labels.workView.stepsDone(count),
-          /* @__PURE__ */ jsx51(ChevronDown6, { "aria-hidden": "true", className: cn12("size-3.5 transition-transform duration-[var(--motion-fast)]", open && "rotate-180") })
+          /* @__PURE__ */ jsx52("span", { className: "shrink-0", children: labels.workView.stepsDone(count) }),
+          icons.length > 0 && /* @__PURE__ */ jsxs42("span", { "data-step-icons": true, "aria-hidden": "true", className: "ml-1 flex min-w-0 items-center gap-1 overflow-hidden text-[var(--foreground-subtle)]", children: [
+            icons.map((icon, index) => /* @__PURE__ */ jsx52(TandemStepIcon, { icon }, index)),
+            moreIcons > 0 && /* @__PURE__ */ jsx52("span", { className: "shrink-0 tabular-nums", children: labels.workView.moreSteps(moreIcons) })
+          ] }),
+          /* @__PURE__ */ jsx52(ChevronDown6, { "aria-hidden": "true", className: cn13("size-3.5 shrink-0 transition-transform duration-[var(--motion-fast)]", open && "rotate-180") })
         ]
       }
     ),
-    /* @__PURE__ */ jsx51("ol", { id: listId, hidden: !open, className: "mt-1 space-y-1 border-l-2 border-[var(--border)] pl-3 text-xs leading-5 text-[var(--foreground-muted)]", children: open && steps.map((step, index) => /* @__PURE__ */ jsx51("li", { "data-work-step": true, "data-failed": String(step.failed), className: cn12("min-w-0 break-words [overflow-wrap:anywhere]", step.failed && "text-[var(--foreground-subtle)] line-through decoration-[var(--border)]"), children: step.phrase }, index)) })
+    /* @__PURE__ */ jsx52("ol", { id: listId, hidden: !open, className: "mt-1 space-y-1 border-l-2 border-[var(--border)] pl-3 text-xs leading-5 text-[var(--foreground-muted)]", children: open && list.map((step, index) => /* @__PURE__ */ jsxs42(
+      "li",
+      {
+        "data-work-step": true,
+        "data-failed": String(step.failed),
+        className: cn13("flex min-w-0 items-start gap-1.5 break-words [overflow-wrap:anywhere]", step.failed && "text-[var(--foreground-subtle)] line-through decoration-[var(--border)]"),
+        children: [
+          step.icon && /* @__PURE__ */ jsx52(TandemStepIcon, { icon: step.icon, className: "mt-[3px] text-[var(--foreground-subtle)]" }),
+          /* @__PURE__ */ jsx52("span", { className: "min-w-0", children: step.phrase })
+        ]
+      },
+      index
+    )) })
   ] });
 }