@tangle-network/ui 9.1.0 → 9.1.1

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.
Files changed (14) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/chat.js +3 -3
  3. package/dist/{chunk-A5HKP3NA.js → chunk-IVQYFG5D.js} +1 -1
  4. package/dist/{chunk-CVXAXVYZ.js → chunk-KWRLQ3MR.js} +5 -5
  5. package/dist/{chunk-N5DJ4TUO.js → chunk-V6BF4AZ7.js} +1 -1
  6. package/dist/{chunk-J6RQHBHR.js → chunk-WVW4KHEH.js} +2 -2
  7. package/dist/{chunk-4RDW4GFG.js → chunk-YUY6D62P.js} +2 -2
  8. package/dist/hooks.js +3 -3
  9. package/dist/index.js +5 -5
  10. package/dist/run.js +3 -3
  11. package/dist/sdk-hooks.js +3 -3
  12. package/package.json +1 -1
  13. package/src/run/inline-tool-item.tsx +2 -2
  14. package/src/run/run-group.tsx +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @tangle-network/ui
2
2
 
3
+ ## 9.1.1
4
+
5
+ ### Patch Changes
6
+
7
+ - a8d770e: Give run/timeline tool rows a proper elevation ladder. Rows read as the same value as the canvas: `InlineToolItem` used `bg-card/40` (near-transparent) and RunGroup's OpenUI/running blocks used `bg-[var(--bg-root)]` (literally the page background). Both now use `--md3-surface-container` — one clear step above the `--bg-root` canvas — with hover/open stepping to `--md3-surface-container-high`. Rows now separate from the background instead of blending into it.
8
+
3
9
  ## 9.1.0
4
10
 
5
11
  ### Minor Changes
package/dist/chat.js CHANGED
@@ -5,10 +5,10 @@ import {
5
5
  MessageList,
6
6
  ThinkingIndicator,
7
7
  UserMessage
8
- } from "./chunk-4RDW4GFG.js";
8
+ } from "./chunk-YUY6D62P.js";
9
9
  import "./chunk-AZWDI2JG.js";
10
- import "./chunk-CVXAXVYZ.js";
11
- import "./chunk-J6RQHBHR.js";
10
+ import "./chunk-KWRLQ3MR.js";
11
+ import "./chunk-WVW4KHEH.js";
12
12
  import "./chunk-ULDNFLIM.js";
13
13
  import "./chunk-AAUNOHVL.js";
14
14
  import "./chunk-52Y3FMFI.js";
package/dist/{chunk-A5HKP3NA.js → chunk-IVQYFG5D.js} RENAMED
@@ -11,7 +11,7 @@ import {
11
11
  } from "./chunk-OEX7NZE3.js";
12
12
  import {
13
13
  parseToolEvent
14
- } from "./chunk-N5DJ4TUO.js";
14
+ } from "./chunk-V6BF4AZ7.js";
15
15
 
16
16
  // src/hooks/use-dropdown-menu.ts
17
17
  import { useEffect, useRef, useState } from "react";
package/dist/{chunk-CVXAXVYZ.js → chunk-KWRLQ3MR.js} RENAMED
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  InlineToolItem,
3
3
  LiveDuration
4
- } from "./chunk-J6RQHBHR.js";
4
+ } from "./chunk-WVW4KHEH.js";
5
5
  import {
6
6
  formatDuration,
7
7
  truncateText
@@ -347,7 +347,7 @@ var RunGroup = memo2(
347
347
  return /* @__PURE__ */ jsxs2(
348
348
  "div",
349
349
  {
350
- className: "overflow-hidden rounded-[22px] border border-[var(--border-subtle)] bg-[var(--bg-root)]",
350
+ className: "overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)]",
351
351
  children: [
352
352
  summary ? /* @__PURE__ */ jsx2("div", { className: "border-b border-[var(--border-subtle)] px-4 py-3 text-sm leading-6 text-foreground", children: summary }) : null,
353
353
  /* @__PURE__ */ jsx2("div", { className: "p-4", children: /* @__PURE__ */ jsx2(OpenUIArtifactRenderer, { schema }) })
@@ -360,7 +360,7 @@ var RunGroup = memo2(
360
360
  return /* @__PURE__ */ jsxs2(
361
361
  "div",
362
362
  {
363
- className: "flex items-center gap-2 rounded-[18px] border border-[var(--border-subtle)] bg-[var(--bg-root)] px-4 py-3 text-sm text-muted-foreground",
363
+ className: "flex items-center gap-2 rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)] px-4 py-3 text-sm text-muted-foreground",
364
364
  children: [
365
365
  /* @__PURE__ */ jsx2(Loader2, { className: "h-4 w-4 animate-spin text-primary" }),
366
366
  "Building view\u2026"
@@ -423,12 +423,12 @@ var RunGroup = memo2(
423
423
  const schema = extractOpenUISchema(toolPart.state.output);
424
424
  const summary = getOpenUISummary(toolPart.state.output);
425
425
  if (toolPart.state.status === "completed" && schema) {
426
- node = /* @__PURE__ */ jsxs2("div", { className: "overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--bg-card)]", children: [
426
+ node = /* @__PURE__ */ jsxs2("div", { className: "overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)]", children: [
427
427
  summary ? /* @__PURE__ */ jsx2("div", { className: "border-b border-[var(--border-subtle)] px-4 py-3 text-sm leading-6 text-foreground", children: summary }) : null,
428
428
  /* @__PURE__ */ jsx2("div", { className: "p-4", children: /* @__PURE__ */ jsx2(OpenUIArtifactRenderer, { schema }) })
429
429
  ] });
430
430
  } else if (toolPart.state.status === "running") {
431
- node = /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-3 rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--bg-card)] px-4 py-3 text-sm text-muted-foreground", children: [
431
+ node = /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-3 rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)] px-4 py-3 text-sm text-muted-foreground", children: [
432
432
  /* @__PURE__ */ jsx2(Loader2, { className: "h-4 w-4 animate-spin text-primary" }),
433
433
  "Building view\u2026"
434
434
  ] });
package/dist/{chunk-N5DJ4TUO.js → chunk-V6BF4AZ7.js} RENAMED
@@ -1,7 +1,7 @@
1
1
  import {
2
2
  ToolCallGroup,
3
3
  ToolCallStep
4
- } from "./chunk-J6RQHBHR.js";
4
+ } from "./chunk-WVW4KHEH.js";
5
5
  import {
6
6
  Markdown
7
7
  } from "./chunk-FJBTCTZM.js";
package/dist/{chunk-J6RQHBHR.js → chunk-WVW4KHEH.js} RENAMED
@@ -227,8 +227,8 @@ var InlineToolItem = memo2(
227
227
  {
228
228
  className: cn(
229
229
  "w-full border text-left transition-colors",
230
- "border-[var(--border-subtle)] bg-card/40 hover:border-border hover:bg-accent/25",
231
- open && "border-border bg-accent/20",
230
+ "border-[var(--border-subtle)] bg-[var(--md3-surface-container)] hover:border-border hover:bg-[var(--md3-surface-container-high)]",
231
+ open && "border-border bg-[var(--md3-surface-container-high)]",
232
232
  shapeClass,
233
233
  className
234
234
  ),
package/dist/{chunk-4RDW4GFG.js → chunk-YUY6D62P.js} RENAMED
@@ -6,11 +6,11 @@ import {
6
6
  import {
7
7
  InlineThinkingItem,
8
8
  RunGroup
9
- } from "./chunk-CVXAXVYZ.js";
9
+ } from "./chunk-KWRLQ3MR.js";
10
10
  import {
11
11
  ToolCallGroup,
12
12
  ToolCallStep
13
- } from "./chunk-J6RQHBHR.js";
13
+ } from "./chunk-WVW4KHEH.js";
14
14
  import {
15
15
  getToolDisplayMetadata
16
16
  } from "./chunk-ULDNFLIM.js";
package/dist/hooks.js CHANGED
@@ -11,15 +11,15 @@ import {
11
11
  useSSEStream,
12
12
  useSdkSession,
13
13
  useToolCallStream
14
- } from "./chunk-A5HKP3NA.js";
14
+ } from "./chunk-IVQYFG5D.js";
15
15
  import "./chunk-OEX7NZE3.js";
16
16
  import {
17
17
  useAutoScroll,
18
18
  useRunCollapseState,
19
19
  useRunGroups
20
20
  } from "./chunk-AZWDI2JG.js";
21
- import "./chunk-N5DJ4TUO.js";
22
- import "./chunk-J6RQHBHR.js";
21
+ import "./chunk-V6BF4AZ7.js";
22
+ import "./chunk-WVW4KHEH.js";
23
23
  import "./chunk-ULDNFLIM.js";
24
24
  import "./chunk-AAUNOHVL.js";
25
25
  import "./chunk-ZRVH3WCA.js";
package/dist/index.js CHANGED
@@ -17,7 +17,7 @@ import {
17
17
  useSSEStream,
18
18
  useSdkSession,
19
19
  useToolCallStream
20
- } from "./chunk-A5HKP3NA.js";
20
+ } from "./chunk-IVQYFG5D.js";
21
21
  import {
22
22
  addMessage,
23
23
  addParts,
@@ -137,7 +137,7 @@ import {
137
137
  MessageList,
138
138
  ThinkingIndicator,
139
139
  UserMessage
140
- } from "./chunk-4RDW4GFG.js";
140
+ } from "./chunk-YUY6D62P.js";
141
141
  import {
142
142
  useAutoScroll,
143
143
  useRunCollapseState,
@@ -147,16 +147,16 @@ import "./chunk-47XH56SV.js";
147
147
  import {
148
148
  ToolCallFeed,
149
149
  parseToolEvent
150
- } from "./chunk-N5DJ4TUO.js";
150
+ } from "./chunk-V6BF4AZ7.js";
151
151
  import {
152
152
  InlineThinkingItem,
153
153
  RunGroup
154
- } from "./chunk-CVXAXVYZ.js";
154
+ } from "./chunk-KWRLQ3MR.js";
155
155
  import {
156
156
  ExpandedToolDetail,
157
157
  InlineToolItem,
158
158
  LiveDuration
159
- } from "./chunk-J6RQHBHR.js";
159
+ } from "./chunk-WVW4KHEH.js";
160
160
  import {
161
161
  TOOL_CATEGORY_ICONS,
162
162
  formatBytes,
package/dist/run.js CHANGED
@@ -2,16 +2,16 @@ import "./chunk-47XH56SV.js";
2
2
  import {
3
3
  ToolCallFeed,
4
4
  parseToolEvent
5
- } from "./chunk-N5DJ4TUO.js";
5
+ } from "./chunk-V6BF4AZ7.js";
6
6
  import {
7
7
  InlineThinkingItem,
8
8
  RunGroup
9
- } from "./chunk-CVXAXVYZ.js";
9
+ } from "./chunk-KWRLQ3MR.js";
10
10
  import {
11
11
  ExpandedToolDetail,
12
12
  InlineToolItem,
13
13
  LiveDuration
14
- } from "./chunk-J6RQHBHR.js";
14
+ } from "./chunk-WVW4KHEH.js";
15
15
  import "./chunk-ULDNFLIM.js";
16
16
  import "./chunk-AAUNOHVL.js";
17
17
  import "./chunk-52Y3FMFI.js";
package/dist/sdk-hooks.js CHANGED
@@ -5,15 +5,15 @@ import {
5
5
  useSSEStream,
6
6
  useSdkSession,
7
7
  useToolCallStream
8
- } from "./chunk-A5HKP3NA.js";
8
+ } from "./chunk-IVQYFG5D.js";
9
9
  import "./chunk-OEX7NZE3.js";
10
10
  import {
11
11
  useAutoScroll,
12
12
  useRunCollapseState,
13
13
  useRunGroups
14
14
  } from "./chunk-AZWDI2JG.js";
15
- import "./chunk-N5DJ4TUO.js";
16
- import "./chunk-J6RQHBHR.js";
15
+ import "./chunk-V6BF4AZ7.js";
16
+ import "./chunk-WVW4KHEH.js";
17
17
  import "./chunk-ULDNFLIM.js";
18
18
  import "./chunk-AAUNOHVL.js";
19
19
  import "./chunk-ZRVH3WCA.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tangle-network/ui",
3
- "version": "9.1.0",
3
+ "version": "9.1.1",
4
4
  "description": "Generic React UI components for Tangle products — primitives, chat, run, files, editor, markdown.",
5
5
  "type": "module",
6
6
  "license": "MIT",
package/src/run/inline-tool-item.tsx CHANGED
@@ -109,8 +109,8 @@ export const InlineToolItem = memo(
109
109
  <button
110
110
  className={cn(
111
111
  "w-full border text-left transition-colors",
112
- "border-[var(--border-subtle)] bg-card/40 hover:border-border hover:bg-accent/25",
113
- open && "border-border bg-accent/20",
112
+ "border-[var(--border-subtle)] bg-[var(--md3-surface-container)] hover:border-border hover:bg-[var(--md3-surface-container-high)]",
113
+ open && "border-border bg-[var(--md3-surface-container-high)]",
114
114
  shapeClass,
115
115
  className,
116
116
  )}
package/src/run/run-group.tsx CHANGED
@@ -366,7 +366,7 @@ export const RunGroup = memo(
366
366
  return (
367
367
  <div
368
368
  key={key}
369
- className="overflow-hidden rounded-[22px] border border-[var(--border-subtle)] bg-[var(--bg-root)]"
369
+ className="overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)]"
370
370
  >
371
371
  {summary ? (
372
372
  <div className="border-b border-[var(--border-subtle)] px-4 py-3 text-sm leading-6 text-foreground">
@@ -384,7 +384,7 @@ export const RunGroup = memo(
384
384
  return (
385
385
  <div
386
386
  key={key}
387
- className="flex items-center gap-2 rounded-[18px] border border-[var(--border-subtle)] bg-[var(--bg-root)] px-4 py-3 text-sm text-muted-foreground"
387
+ className="flex items-center gap-2 rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)] px-4 py-3 text-sm text-muted-foreground"
388
388
  >
389
389
  <Loader2 className="h-4 w-4 animate-spin text-primary" />
390
390
  Building view…
@@ -493,7 +493,7 @@ export const RunGroup = memo(
493
493
 
494
494
  if (toolPart.state.status === "completed" && schema) {
495
495
  node = (
496
- <div className="overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--bg-card)]">
496
+ <div className="overflow-hidden rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)]">
497
497
  {summary ? (
498
498
  <div className="border-b border-[var(--border-subtle)] px-4 py-3 text-sm leading-6 text-foreground">
499
499
  {summary}
@@ -506,7 +506,7 @@ export const RunGroup = memo(
506
506
  );
507
507
  } else if (toolPart.state.status === "running") {
508
508
  node = (
509
- <div className="flex items-center gap-3 rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--bg-card)] px-4 py-3 text-sm text-muted-foreground">
509
+ <div className="flex items-center gap-3 rounded-[var(--radius-lg)] border border-[var(--border-subtle)] bg-[var(--md3-surface-container)] px-4 py-3 text-sm text-muted-foreground">
510
510
  <Loader2 className="h-4 w-4 animate-spin text-primary" />
511
511
  Building view…
512
512
  </div>