@truefoundry/trueforge-ui 0.3.0-rc.1 → 0.3.0-rc.3

package/CHANGELOG.md

@@ -1,5 +1,75 @@
 # Changelog
 
+## 0.3.0-rc.3
+
+### Minor Changes
+
+- 1d31116: Open agent model settings inline and support typed custom model parameters.
+- 74eae6c: Remove pagination from list MCP servers across the API, SDK, and UI; return and search the complete configured MCP catalog client-side.
+- 12b02ff: Open Runtime Config in a right-side drawer and label scheduled sessions consistently.
+- 7e25f68: Open Save Agent in a right-side drawer with only the agent name while preserving configuration from Agent Config.
+- f8b5eeb: Add optional resource permissions and gate agent, schedule, and session mutations.
+
+### Patch Changes
+
+- 762ecc0: TrueFoundry skills catalog: proxy GET /skills and /skills/versions from ServiceFoundry; settings skill writes return 424. SkillManifest is a type-discriminated oneOf of GitSkill | TrueFoundryRegistrySkill (`type: truefoundry`; name is FQN, display_name is short). AvailableSkill exposes optional metadata (display_name, repository_name, version). AgentSpec skill refs allow opaque FQN names, optional preload (registry), and max 50. UI draft skill mounts map catalog `id` to AgentSpec `name`.
+- 26a9b80: Add an agent-scoped Schedules tab and route library schedule actions into it.
+- 1b8a3f7: Add documentation links to the code snippets view and shell actions.
+- d2fdfc9: Add agent-filtered chat history labels, preserve Try Agent and explicit history-filter intent in URL query state while resolving backend IDs, reset active chats when users change filters, keep Try Agent highlighted as chat, and route fresh agent builders at `/build-agent` before their session URL is assigned.
+- 26a9b80: Allow sending user messages that contain attachments without text.
+- 26a9b80: Add an empty state and Build Agent action to the schedule agent picker.
+- 4c522e2: Bump `@truefoundry/assistant-ui-runtime` to `0.1.30`.
+- 4c522e2: Bump `@truefoundry/assistant-ui-runtime` to `0.1.31`.
+- d719155: Keep composer catalogs cached when starting a new chat.
+- c0359ca: Strip a trailing slash from the `base_url` passed to agent code-snippets.
+- 57f1fc2: Improve compact agent building with model configuration bottom sheets, provider-first model selection, and a contextual composer actions menu.
+- e3973a5: Show the selected connector and skill count beside the composer tools icon.
+- 26a9b80: Hide model selection in the Build Agent composer and correct concurrent sub-agent timeline bars.
+- 26a9b80: Require direct switch clicks in the Runtime Config sidebar.
+- 1ec19f0: Replace API key replacement with connector configuration editing from the connector list and details view.
+- b482cdd: Show the four primary agent metrics in a compact summary-card layout.
+- b32d2be: Filter chat history to sessions created by the current user, and bump `@truefoundry/assistant-ui-runtime` to `0.1.34`.
+- a9430bd: Accept optional `base_url` on agent code-snippets (FE public host); fall back to request origin + `PUBLIC_BASE_URL` path.
+- 54e4ec4: Keep Settings hidden until the server explicitly enables it.
+- 4c522e2: Hide session cost metrics when cost data is unavailable.
+- 4e7b67a: Check live per-user MCP authentication before loading tools in the agent builder.
+- d2fdfc9: Section MCP tools in the Build Agent selector by read-only, others, and destructive annotations, with a read-only enable-all toggle.
+- 26a9b80: Show agent names without an icon in the Agents table.
+- 4cea38c: Show draft and named sessions in the history panel, exclude agent-builder sessions, cache session pages, and switch history sessions in place without remounting the chat runtime.
+- 2284d3b: Polish the MCP tool selector controls, loading state, and API error messages.
+- e3973a5: Group schedule recurrence controls and display the cadence in an attached summary footer.
+- f2ca338: Show active/paused schedule counts in the Agents library, pin selected MCPs when reopening the tools modal, and align paused schedule badge colors.
+- 77c5c33: Show TrueFoundry skill repositories and versions in skill pickers, load version choices lazily, preserve the chosen version FQN when attaching skills, keep picker ordering stable while open, and add registry-only preload controls to selected skill pills.
+- 26a9b80: Show weekly schedule days before the time controls.
+- 1b8a3f7: Match the Build Agent configuration panel width to the agent playground and identify sessions created by schedule runs.
+- adaf532: Widen the sidebar rail and its nav buttons so labels like "Build Agent" have more breathing room.
+- Updated dependencies [648273b]
+- Updated dependencies [648273b]
+- Updated dependencies [648273b]
+- Updated dependencies [74eae6c]
+- Updated dependencies [44f9cbe]
+  - @truefoundry/trueforge-sdk@0.2.0-rc.3
+
+## 0.3.0-rc.2
+
+### Minor Changes
+
+- 04d2ee6: Add a `sidebarText` semantic token for sidebar nav labels, refresh trueforge sidebar colors, set trueforge base `radius` to `0.375rem` (6px), and set sidebar / thread-list control corners to `0.75rem` (12px).
+
+  Expose design-system `Button` (`Button.Primary` / `.Secondary` / `.Ghost` / `.Destructive`). `ButtonVariant` is now `primary | secondary | ghost | destructive` (`default` renamed to `primary`; `outline` removed — use `secondary`). Button sizes are `large` (default) and `small` (`icon` for icon-only).
+
+### Patch Changes
+
+- 2a0ae4c: Show connector catalog logos in the composer Tools picker, matching the Connectors settings page.
+- 2a0ae4c: Align AttachmentCard with assistant-ui's default square thumbnail, filename tooltip, and overlay remove control.
+- fe6a14b: Improve session timelines with sub-agent wait states, grouped point-event markers, clean linear ticks, and readable summary durations.
+- d5b479d: Clamp optional sessions/schedules chrome and unregister `/sessions`, `/schedules`, and `/library/:agentId` when those server ports are omitted, matching the Settings Lego gate.
+- 5d72138: Keep `npx @truefoundry/trueforge` working on native Windows: import Kysely migrations with `pathToFileURL`, and keep sandbox guest paths POSIX. Source development stays Unix/WSL; CI also runs unit and SQLite store tests on Windows.
+- Updated dependencies [a000b47]
+- Updated dependencies [0ec8dc6]
+- Updated dependencies [11865b4]
+  - @truefoundry/trueforge-sdk@0.1.4-rc.2
+
 ## 0.3.0-rc.1
 
 ### Minor Changes

package/README.md

@@ -407,7 +407,7 @@ show the title text (see [Custom layouts](#custom-layouts)).
 
 In library modes, picking an agent from Agents switches to a named chat for that agent **and remounts the runtime** so the new agent starts from a clean conversation. Draft chats can be promoted via **Save agent** (`server.saveAgent` on the resolved `AgentUIServer`). **Clear Chat** (thread header) resets the current named or draft session.
 
-Mutable composers expose **Agent Config** for live model parameters, instructions, runtime behavior, per-connector MCP tools, and skills. The compact Tools picker contains only Connectors and Skills. The Save Agent dialog keeps a local editable copy of the same configuration and shares the same selector dialogs; cancelling it leaves the active draft unchanged. Model context and output limits render when the server supplies that optional catalog metadata.
+Mutable composers expose **Agent Config** for live model parameters, instructions, runtime behavior, per-connector MCP tools, and skills. Runtime Config opens in a second right-side drawer. The compact Tools picker contains only Connectors and Skills. The Save Agent drawer only edits the agent name while preserving the active draft configuration; cancelling it discards that local edit. Model context and output limits render when the server supplies that optional catalog metadata.
 
 ```tsx
 {
@@ -446,12 +446,12 @@ Mutable composers expose **Agent Config** for live model parameters, instruction
 
 Built-in `layout` values:
 
-| Value     | Description                                              |
-| --------- | -------------------------------------------------------- |
-| `sidebar` | Left session list + main thread (ChatGPT / Claude style) |
-| `drawer`  | Full-bleed thread; sessions open in a slide-over         |
-| `dock`    | Fixed-width right panel; list XOR thread stack           |
-| `widget`  | Same stack as `dock`, opened from a bottom-right FAB     |
+| Value     | Description                                          |
+| --------- | ---------------------------------------------------- |
+| `sidebar` | Icon rail + recent session history + active thread   |
+| `drawer`  | Full-bleed thread; sessions open in a slide-over     |
+| `dock`    | Fixed-width right panel; list XOR thread stack       |
+| `widget`  | Same stack as `dock`, opened from a bottom-right FAB |
 
 ---
 
@@ -535,6 +535,7 @@ type TrueForgeServerConfig =
       apiKey: string;
       controlPlaneURL: string;
       gatewayPlaneURL?: string;
+      permissions?: PermissionsServer;
     }
   | {
       type: 'trueforge';
@@ -542,6 +543,7 @@ type TrueForgeServerConfig =
       token?: string;
       fetch?: typeof fetch;
       catalog?: CatalogServer;
+      permissions?: PermissionsServer;
     }
   | AgentUIServer;
 
@@ -550,6 +552,8 @@ type AgentUIServer = AgentChatServer &
     catalog?: CatalogServer;
     sessions?: AgentSessionsServer;
     metrics?: AgentMetricsServer;
+    schedules?: ScheduleServer;
+    permissions?: PermissionsServer;
   };
 ```
 
@@ -557,7 +561,18 @@ type AgentUIServer = AgentChatServer &
 | -------------------- | ------------------------------------------------------------------- |
 | `AgentChatServer`    | Sessions, turns, streaming, draft `AgentSpec` sync                  |
 | `AgentBuilderServer` | `getModels` / `getSkills` / `getMcp` / `searchAgents` / `saveAgent` |
+| `catalog`            | Settings CRUD (models / connectors / optional skills & sandbox)     |
+| `sessions`           | Agent details + sessions browser (`/sessions`, `/library/:agentId`) |
+| `schedules`          | Schedules page (`/schedules`)                                       |
 | `AgentMetricsServer` | Agent meter aggregates, chart definitions, and chart data           |
+| `PermissionsServer`  | Per-resource `USE`, `MANAGE`, and `DELETE` grants                   |
+
+Omit a chrome port such as `catalog` or `schedules` to hide and unregister its routes.
+
+When `permissions` is omitted from a custom or TrueFoundry server, actions remain enabled for backward compatibility.
+When provided, denied mutation controls stay visible but disabled with an explanatory tooltip. The built-in
+`type: "trueforge"` server enables checks automatically through the Harness permissions endpoint; an explicit
+`PermissionsServer` overrides that default.
 
 **Zero-config TrueFoundry** — see [Getting started](#getting-started). The SDK calls `createTrueFoundryAgentUIServer` for you.
 

package/dist/{AgentCodeSnippets-NZOFJE57.js → AgentCodeSnippets-N546FNNS.js}

@@ -1,17 +1,17 @@
 "use client";
 import {
   useSlot
-} from "./chunk-ZTMKFZQ3.js";
-import "./chunk-2XPPBEYF.js";
+} from "./chunk-2O5EJ6QS.js";
+import "./chunk-KR7WYHVF.js";
 import {
   Icon
-} from "./chunk-XAU7QFG3.js";
-import "./chunk-U7KURWW3.js";
+} from "./chunk-Q6TCT7ZJ.js";
+import "./chunk-PT4EENB3.js";
 import "./chunk-M6MHLVSO.js";
-import "./chunk-MPNSO7E6.js";
+import "./chunk-J5BPHEDT.js";
 import {
   cn
-} from "./chunk-7Z2C2K7F.js";
+} from "./chunk-LXJMINS6.js";
 
 // src/atoms/agent-details/AgentCodeSnippets.tsx
 import { useEffect, useState } from "react";
@@ -48,22 +48,37 @@ function AgentCodeSnippets({ snippets }) {
       snippet.language
     )) }),
     /* @__PURE__ */ jsxs("section", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden rounded-lg border border-border bg-card-bg", children: [
-      /* @__PURE__ */ jsx("div", { className: "flex h-10 shrink-0 items-end gap-1 border-b border-border px-3", children: [
-        ["stream", "Stream"],
-        ["nonStream", "Non-stream"]
-      ].map(([id, label]) => /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          className: cn(
-            "relative h-10 cursor-pointer px-3 text-xs font-medium text-text-secondary",
-            mode === id && "text-primary-button-bg after:absolute after:inset-x-0 after:bottom-0 after:h-0.5 after:bg-primary-button-bg"
-          ),
-          onClick: () => setMode(id),
-          children: label
-        },
-        id
-      )) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex h-10 shrink-0 items-center justify-between gap-1 border-b border-border px-3", children: [
+        /* @__PURE__ */ jsx("div", { className: "flex items-end gap-1", children: [
+          ["stream", "Stream"],
+          ["nonStream", "Non-stream"]
+        ].map(([id, label]) => /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: cn(
+              "relative h-10 cursor-pointer px-3 text-xs font-medium text-text-secondary",
+              mode === id && "text-primary-button-bg after:absolute after:inset-x-0 after:bottom-0 after:h-0.5 after:bg-primary-button-bg"
+            ),
+            onClick: () => setMode(id),
+            children: label
+          },
+          id
+        )) }),
+        /* @__PURE__ */ jsxs(
+          "a",
+          {
+            href: "https://trueforge.dev/api/use-agent",
+            target: "_blank",
+            rel: "noopener noreferrer",
+            className: "flex items-center gap-1 text-xs text-text-secondary",
+            children: [
+              /* @__PURE__ */ jsx("span", { children: "View Docs" }),
+              /* @__PURE__ */ jsx(Icon, { name: "external-link", className: "size-3 shrink-0" })
+            ]
+          }
+        )
+      ] }),
       /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-auto", children: /* @__PURE__ */ jsx(AgentCodeBlock, { code: selected.sampleCode[mode], language: selected.language }) })
     ] })
   ] });
@@ -71,4 +86,4 @@ function AgentCodeSnippets({ snippets }) {
 export {
   AgentCodeSnippets as default
 };
-//# sourceMappingURL=AgentCodeSnippets-NZOFJE57.js.map
+//# sourceMappingURL=AgentCodeSnippets-N546FNNS.js.map

package/dist/AgentCodeSnippets-N546FNNS.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/agent-details/AgentCodeSnippets.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useState, type ComponentType } from 'react';\nimport { Icon } from '../../icons/Icon.js';\nimport { useSlot } from '../../theme/SlotsProvider.js';\nimport { cn } from '../lib/cn.js';\nimport type { AgentCodeSnippetsProps } from './types.js';\n\ntype SnippetMode = 'stream' | 'nonStream';\n\nexport default function AgentCodeSnippets({ snippets }: AgentCodeSnippetsProps) {\n  const AgentCodeBlock = useSlot('AgentCodeBlock');\n  const [selectedLanguage, setSelectedLanguage] = useState(snippets[0]?.language);\n  const [mode, setMode] = useState<SnippetMode>('stream');\n\n  useEffect(() => {\n    setSelectedLanguage(snippets[0]?.language);\n    setMode('stream');\n  }, [snippets]);\n\n  const selected = snippets.find(snippet => snippet.language === selectedLanguage) ?? snippets[0];\n\n  if (selected === undefined) {\n    return (\n      <div className=\"flex h-full min-h-64 items-center justify-center px-6 text-sm text-text-secondary\">\n        No code samples for this agent.\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"flex min-h-0 flex-1 flex-col gap-3 p-3 md:flex-row\">\n      <nav aria-label=\"Code sample languages\" className=\"flex shrink-0 gap-1 overflow-auto md:w-44 md:flex-col\">\n        {snippets.map(snippet => (\n          <button\n            key={snippet.language}\n            type=\"button\"\n            aria-current={selected.language === snippet.language ? 'page' : undefined}\n            className={cn(\n              'flex h-9 shrink-0 cursor-pointer items-center gap-2 rounded-md px-2.5 text-left text-xs text-text-secondary',\n              'hover:bg-ghost-button-hover hover:text-text-primary',\n              selected.language === snippet.language && 'bg-primary-button-bg/10 font-medium text-primary-button-bg',\n            )}\n            onClick={() => setSelectedLanguage(snippet.language)}\n          >\n            {snippet.icon ? (\n              <img src={snippet.icon} alt=\"\" className=\"size-4 shrink-0 object-contain\" />\n            ) : (\n              <Icon name=\"code\" className=\"size-4 shrink-0\" />\n            )}\n            {snippet.labelName}\n          </button>\n        ))}\n      </nav>\n\n      <section className=\"flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden rounded-lg border border-border bg-card-bg\">\n        <div className=\"flex h-10 shrink-0 items-center justify-between gap-1 border-b border-border px-3\">\n          <div className=\"flex items-end gap-1\">\n            {(\n              [\n                ['stream', 'Stream'],\n                ['nonStream', 'Non-stream'],\n              ] satisfies Array<[SnippetMode, string]>\n            ).map(([id, label]) => (\n              <button\n                key={id}\n                type=\"button\"\n                className={cn(\n                  'relative h-10 cursor-pointer px-3 text-xs font-medium text-text-secondary',\n                  mode === id &&\n                    'text-primary-button-bg after:absolute after:inset-x-0 after:bottom-0 after:h-0.5 after:bg-primary-button-bg',\n                )}\n                onClick={() => setMode(id)}\n              >\n                {label}\n              </button>\n            ))}\n          </div>\n          <a\n            href=\"https://trueforge.dev/api/use-agent\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            className=\"flex items-center gap-1 text-xs text-text-secondary\"\n          >\n            <span>View Docs</span>\n            <Icon name=\"external-link\" className=\"size-3 shrink-0\" />\n          </a>\n        </div>\n        <div className=\"min-h-0 flex-1 overflow-auto\">\n          <AgentCodeBlock code={selected.sampleCode[mode]} language={selected.language} />\n        </div>\n      </section>\n    </div>\n  );\n}\n\ndeclare module '../../theme/SlotsProvider.js' {\n  interface AtomSlots {\n    AgentCodeSnippets: ComponentType<AgentCodeSnippetsProps>;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAEA,SAAS,WAAW,gBAAoC;AAsBlD,cAUI,YAVJ;AAdS,SAAR,kBAAmC,EAAE,SAAS,GAA2B;AAC9E,QAAM,iBAAiB,QAAQ,gBAAgB;AAC/C,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAS,SAAS,CAAC,GAAG,QAAQ;AAC9E,QAAM,CAAC,MAAM,OAAO,IAAI,SAAsB,QAAQ;AAEtD,YAAU,MAAM;AACd,wBAAoB,SAAS,CAAC,GAAG,QAAQ;AACzC,YAAQ,QAAQ;AAAA,EAClB,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,WAAW,SAAS,KAAK,aAAW,QAAQ,aAAa,gBAAgB,KAAK,SAAS,CAAC;AAE9F,MAAI,aAAa,QAAW;AAC1B,WACE,oBAAC,SAAI,WAAU,qFAAoF,6CAEnG;AAAA,EAEJ;AAEA,SACE,qBAAC,SAAI,WAAU,sDACb;AAAA,wBAAC,SAAI,cAAW,yBAAwB,WAAU,yDAC/C,mBAAS,IAAI,aACZ;AAAA,MAAC;AAAA;AAAA,QAEC,MAAK;AAAA,QACL,gBAAc,SAAS,aAAa,QAAQ,WAAW,SAAS;AAAA,QAChE,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA,SAAS,aAAa,QAAQ,YAAY;AAAA,QAC5C;AAAA,QACA,SAAS,MAAM,oBAAoB,QAAQ,QAAQ;AAAA,QAElD;AAAA,kBAAQ,OACP,oBAAC,SAAI,KAAK,QAAQ,MAAM,KAAI,IAAG,WAAU,kCAAiC,IAE1E,oBAAC,QAAK,MAAK,QAAO,WAAU,mBAAkB;AAAA,UAE/C,QAAQ;AAAA;AAAA;AAAA,MAfJ,QAAQ;AAAA,IAgBf,CACD,GACH;AAAA,IAEA,qBAAC,aAAQ,WAAU,mGACjB;AAAA,2BAAC,SAAI,WAAU,qFACb;AAAA,4BAAC,SAAI,WAAU,wBAEX;AAAA,UACE,CAAC,UAAU,QAAQ;AAAA,UACnB,CAAC,aAAa,YAAY;AAAA,QAC5B,EACA,IAAI,CAAC,CAAC,IAAI,KAAK,MACf;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,WAAW;AAAA,cACT;AAAA,cACA,SAAS,MACP;AAAA,YACJ;AAAA,YACA,SAAS,MAAM,QAAQ,EAAE;AAAA,YAExB;AAAA;AAAA,UATI;AAAA,QAUP,CACD,GACH;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,QAAO;AAAA,YACP,KAAI;AAAA,YACJ,WAAU;AAAA,YAEV;AAAA,kCAAC,UAAK,uBAAS;AAAA,cACf,oBAAC,QAAK,MAAK,iBAAgB,WAAU,mBAAkB;AAAA;AAAA;AAAA,QACzD;AAAA,SACF;AAAA,MACA,oBAAC,SAAI,WAAU,gCACb,8BAAC,kBAAe,MAAM,SAAS,WAAW,IAAI,GAAG,UAAU,SAAS,UAAU,GAChF;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/AgentMetricChart-YWJYVYYA.js

@@ -0,0 +1,15 @@
+"use client";
+import {
+  AgentMetricChart
+} from "./chunk-XLFOXQKZ.js";
+import "./chunk-2O5EJ6QS.js";
+import "./chunk-KR7WYHVF.js";
+import "./chunk-Q6TCT7ZJ.js";
+import "./chunk-PT4EENB3.js";
+import "./chunk-M6MHLVSO.js";
+import "./chunk-J5BPHEDT.js";
+import "./chunk-LXJMINS6.js";
+export {
+  AgentMetricChart
+};
+//# sourceMappingURL=AgentMetricChart-YWJYVYYA.js.map

package/dist/{AgentOverview-EEBHJC32.js → AgentOverview-VF74XC7I.js}

@@ -1,17 +1,17 @@
 "use client";
 import {
   useSlot
-} from "./chunk-ZTMKFZQ3.js";
-import "./chunk-2XPPBEYF.js";
+} from "./chunk-2O5EJ6QS.js";
+import "./chunk-KR7WYHVF.js";
 import {
   Icon
-} from "./chunk-XAU7QFG3.js";
-import "./chunk-U7KURWW3.js";
+} from "./chunk-Q6TCT7ZJ.js";
+import "./chunk-PT4EENB3.js";
 import "./chunk-M6MHLVSO.js";
-import "./chunk-MPNSO7E6.js";
+import "./chunk-J5BPHEDT.js";
 import {
   cn
-} from "./chunk-7Z2C2K7F.js";
+} from "./chunk-LXJMINS6.js";
 
 // src/atoms/agent-details/AgentOverview.tsx
 import { useState } from "react";
@@ -164,4 +164,4 @@ function AgentOverview({ detail }) {
 export {
   AgentOverview as default
 };
-//# sourceMappingURL=AgentOverview-EEBHJC32.js.map
+//# sourceMappingURL=AgentOverview-VF74XC7I.js.map

package/dist/{AgentSessionEventTimeline-26Z6IB3B.js → AgentSessionEventTimeline-RFR6LQMY.js}

@@ -1,22 +1,25 @@
 "use client";
 import {
   SESSION_EVENT_TYPES,
-  useSlot
-} from "./chunk-ZTMKFZQ3.js";
-import "./chunk-2XPPBEYF.js";
-import "./chunk-XAU7QFG3.js";
-import "./chunk-U7KURWW3.js";
+  getSessionEventColor,
+  useSlot,
+  useThemeMode
+} from "./chunk-2O5EJ6QS.js";
+import "./chunk-KR7WYHVF.js";
+import "./chunk-Q6TCT7ZJ.js";
+import "./chunk-PT4EENB3.js";
 import "./chunk-M6MHLVSO.js";
-import "./chunk-MPNSO7E6.js";
+import "./chunk-J5BPHEDT.js";
 import {
   cn
-} from "./chunk-7Z2C2K7F.js";
+} from "./chunk-LXJMINS6.js";
 
 // src/atoms/agent-details/AgentSessionEventTimeline.tsx
 import { useCallback, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 function AgentSessionEventTimeline({ turns, segments, onSelectTurn }) {
   const AgentSessionEventTimelineChart = useSlot("AgentSessionEventTimelineChart");
+  const isDark = useThemeMode() === "dark";
   const [hiddenTypes, setHiddenTypes] = useState(() => /* @__PURE__ */ new Set());
   const availableEventTypes = useMemo(() => {
     const available = new Set(segments.map((segment) => segment.type));
@@ -52,7 +55,13 @@ function AgentSessionEventTimeline({ turns, segments, onSelectTurn }) {
                 ),
                 onClick: () => handleToggleType(eventType.id),
                 children: [
-                  /* @__PURE__ */ jsx("span", { className: "size-2 rounded-sm", style: { backgroundColor: eventType.color } }),
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: "size-2 rounded-sm",
+                      style: { backgroundColor: getSessionEventColor(eventType.id, isDark) }
+                    }
+                  ),
                   eventType.label
                 ]
               },
@@ -62,7 +71,7 @@ function AgentSessionEventTimeline({ turns, segments, onSelectTurn }) {
         ]
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: "w-full py-2", children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx("div", { className: "w-full p-2", children: /* @__PURE__ */ jsx(
       AgentSessionEventTimelineChart,
       {
         turns,
@@ -76,4 +85,4 @@ function AgentSessionEventTimeline({ turns, segments, onSelectTurn }) {
 export {
   AgentSessionEventTimeline
 };
-//# sourceMappingURL=AgentSessionEventTimeline-26Z6IB3B.js.map
+//# sourceMappingURL=AgentSessionEventTimeline-RFR6LQMY.js.map

package/dist/AgentSessionEventTimeline-RFR6LQMY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/agent-details/AgentSessionEventTimeline.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback, useMemo, useState, type ComponentType } from 'react';\n\nimport { useSlot, useThemeMode } from '../../theme/SlotsProvider.js';\nimport { getSessionEventColor, SESSION_EVENT_TYPES, type SessionEventType } from '../../utils/sessionEventTimeline.js';\nimport { cn } from '../lib/cn.js';\nimport type { AgentSessionEventTimelineProps } from './types.js';\n\nexport function AgentSessionEventTimeline({ turns, segments, onSelectTurn }: AgentSessionEventTimelineProps) {\n  const AgentSessionEventTimelineChart = useSlot('AgentSessionEventTimelineChart');\n  const isDark = useThemeMode() === 'dark';\n  const [hiddenTypes, setHiddenTypes] = useState<Set<SessionEventType>>(() => new Set());\n\n  const availableEventTypes = useMemo(() => {\n    const available = new Set(segments.map(segment => segment.type));\n    return SESSION_EVENT_TYPES.filter(eventType => available.has(eventType.id));\n  }, [segments]);\n\n  const handleToggleType = useCallback((type: SessionEventType) => {\n    setHiddenTypes(previous => {\n      const next = new Set(previous);\n      if (next.has(type)) next.delete(type);\n      else next.add(type);\n      return next;\n    });\n  }, []);\n\n  if (segments.length === 0) return null;\n\n  return (\n    <div className=\"w-full\" data-slot=\"agent-session-event-timeline\">\n      <div\n        className=\"flex flex-wrap items-center gap-2 border-b border-border px-3 py-2\"\n        data-slot=\"agent-session-event-types\"\n      >\n        <span className=\"text-xs font-medium uppercase text-text-secondary\">Event types</span>\n        <div className=\"flex flex-wrap items-center gap-1\">\n          {availableEventTypes.map(eventType => {\n            const isVisible = !hiddenTypes.has(eventType.id);\n            return (\n              <button\n                key={eventType.id}\n                type=\"button\"\n                aria-pressed={isVisible}\n                className={cn(\n                  'flex items-center gap-1.5 rounded-full border px-2 py-0.5 text-xs font-medium',\n                  isVisible ? 'border-border text-text-primary' : 'border-transparent text-text-secondary opacity-80',\n                )}\n                onClick={() => handleToggleType(eventType.id)}\n              >\n                <span\n                  className=\"size-2 rounded-sm\"\n                  style={{ backgroundColor: getSessionEventColor(eventType.id, isDark) }}\n                />\n                {eventType.label}\n              </button>\n            );\n          })}\n        </div>\n      </div>\n      <div className=\"w-full p-2\">\n        <AgentSessionEventTimelineChart\n          turns={turns}\n          segments={segments}\n          hiddenTypes={hiddenTypes}\n          onSelectTurn={onSelectTurn}\n        />\n      </div>\n    </div>\n  );\n}\n\ndeclare module '../../theme/SlotsProvider.js' {\n  interface AtomSlots {\n    AgentSessionEventTimeline: ComponentType<AgentSessionEventTimelineProps>;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAEA,SAAS,aAAa,SAAS,gBAAoC;AAkC3D,cAKM,YALN;AA3BD,SAAS,0BAA0B,EAAE,OAAO,UAAU,aAAa,GAAmC;AAC3G,QAAM,iCAAiC,QAAQ,gCAAgC;AAC/E,QAAM,SAAS,aAAa,MAAM;AAClC,QAAM,CAAC,aAAa,cAAc,IAAI,SAAgC,MAAM,oBAAI,IAAI,CAAC;AAErF,QAAM,sBAAsB,QAAQ,MAAM;AACxC,UAAM,YAAY,IAAI,IAAI,SAAS,IAAI,aAAW,QAAQ,IAAI,CAAC;AAC/D,WAAO,oBAAoB,OAAO,eAAa,UAAU,IAAI,UAAU,EAAE,CAAC;AAAA,EAC5E,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,mBAAmB,YAAY,CAAC,SAA2B;AAC/D,mBAAe,cAAY;AACzB,YAAM,OAAO,IAAI,IAAI,QAAQ;AAC7B,UAAI,KAAK,IAAI,IAAI,EAAG,MAAK,OAAO,IAAI;AAAA,UAC/B,MAAK,IAAI,IAAI;AAClB,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,MAAI,SAAS,WAAW,EAAG,QAAO;AAElC,SACE,qBAAC,SAAI,WAAU,UAAS,aAAU,gCAChC;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,aAAU;AAAA,QAEV;AAAA,8BAAC,UAAK,WAAU,qDAAoD,yBAAW;AAAA,UAC/E,oBAAC,SAAI,WAAU,qCACZ,8BAAoB,IAAI,eAAa;AACpC,kBAAM,YAAY,CAAC,YAAY,IAAI,UAAU,EAAE;AAC/C,mBACE;AAAA,cAAC;AAAA;AAAA,gBAEC,MAAK;AAAA,gBACL,gBAAc;AAAA,gBACd,WAAW;AAAA,kBACT;AAAA,kBACA,YAAY,oCAAoC;AAAA,gBAClD;AAAA,gBACA,SAAS,MAAM,iBAAiB,UAAU,EAAE;AAAA,gBAE5C;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,WAAU;AAAA,sBACV,OAAO,EAAE,iBAAiB,qBAAqB,UAAU,IAAI,MAAM,EAAE;AAAA;AAAA,kBACvE;AAAA,kBACC,UAAU;AAAA;AAAA;AAAA,cAbN,UAAU;AAAA,YAcjB;AAAA,UAEJ,CAAC,GACH;AAAA;AAAA;AAAA,IACF;AAAA,IACA,oBAAC,SAAI,WAAU,cACb;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,IACF,GACF;AAAA,KACF;AAEJ;","names":[]}