@mastra/playground-ui 68.0.0-alpha.2 → 68.0.0

package/dist/domains/workflows/runs/workflow-run-list.cjs.js

@@ -15,8 +15,8 @@ const require_components_AlertDialog = require("../../../components/AlertDialog.
 const require_components_ThreadList = require("../../../components/ThreadList.cjs.js");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
-let _mastra_react_hooks_workflows = require("@mastra/react/hooks/workflows");
 let zod = require("zod");
+let _mastra_react_hooks_workflows = require("@mastra/react/hooks/workflows");
 // src/domains/workflows/runs/workflow-run-list.tsx
 var runSnapshotSchema = zod.z.object({
 	status: zod.z.enum([

package/dist/domains/workflows/runs/workflow-run-list.es.js

@@ -14,8 +14,8 @@ import { AlertDialog } from "../../../components/AlertDialog.es.js";
 import { ThreadList, ThreadListEmpty, ThreadListItem, ThreadListItems } from "../../../components/ThreadList.es.js";
 import { useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { useDeleteWorkflowRun, useWorkflowRun, useWorkflowRuns } from "@mastra/react/hooks/workflows";
 import { z } from "zod";
+import { useDeleteWorkflowRun, useWorkflowRun, useWorkflowRuns } from "@mastra/react/hooks/workflows";
 // src/domains/workflows/runs/workflow-run-list.tsx
 var runSnapshotSchema = z.object({
 	status: z.enum([

package/dist/domains/workflows/workflow/input/workflow-processor-input.cjs.js

@@ -1,9 +1,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_select = require("../../../../select-Dg8L5ROX.cjs");
 const require_components_Field = require("../../../../components/Field.cjs.js");
-const require_domains_workflows_workflow_input_processor_input = require("./processor-input.cjs.js");
-const require_lib_form_components_form_submit_row = require("../../../../lib/form/components/form-submit-row.cjs.js");
 const require_components_Textarea = require("../../../../components/Textarea.cjs.js");
+const require_lib_form_components_form_submit_row = require("../../../../lib/form/components/form-submit-row.cjs.js");
+const require_domains_workflows_workflow_input_processor_input = require("./processor-input.cjs.js");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/workflows/workflow/input/workflow-processor-input.tsx

package/dist/domains/workflows/workflow/input/workflow-processor-input.es.js

@@ -1,8 +1,8 @@
 import { i as SelectItem, n as SelectContent, o as SelectTrigger, s as SelectValue, t as Select } from "../../../../select-BdIZEdcy.js";
 import { Field, FieldDescription, FieldError, FieldLabel } from "../../../../components/Field.es.js";
-import { getProcessorMessage, updateProcessorMessage, withPhaseRole } from "./processor-input.es.js";
-import { FormSubmitRow } from "../../../../lib/form/components/form-submit-row.es.js";
 import { Textarea } from "../../../../components/Textarea.es.js";
+import { FormSubmitRow } from "../../../../lib/form/components/form-submit-row.es.js";
+import { getProcessorMessage, updateProcessorMessage, withPhaseRole } from "./processor-input.es.js";
 import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 // src/domains/workflows/workflow/input/workflow-processor-input.tsx

package/dist/domains/workflows/workflow/use-workflow-trigger.cjs.js

@@ -1,12 +1,12 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_lib_form_zod_provider_compat = require("../../../lib/form/zod-provider/compat.cjs.js");
+const require_lib_form_json_schema_to_zod_runtime = require("../../../lib/form/json-schema-to-zod-runtime.cjs.js");
 const require_domains_workflows_context_workflow_run_context = require("../context/workflow-run-context.cjs.js");
 require("./workflow-step-node-utils.cjs.js");
 const require_domains_workflows_workflow_utils = require("./utils.cjs.js");
-const require_lib_form_json_schema_to_zod_runtime = require("../../../lib/form/json-schema-to-zod-runtime.cjs.js");
-const require_lib_form_zod_provider_compat = require("../../../lib/form/zod-provider/compat.cjs.js");
 let react = require("react");
-let superjson = require("superjson");
 let zod = require("zod");
+let superjson = require("superjson");
 // src/domains/workflows/workflow/use-workflow-trigger.ts
 function useSuspendedSteps(streamResult, runId) {
 	return (0, react.useMemo)(() => {

package/dist/domains/workflows/workflow/use-workflow-trigger.es.js

@@ -1,11 +1,11 @@
+import { asObjectProperty } from "../../../lib/form/zod-provider/compat.es.js";
+import { jsonSchemaToZodRuntime } from "../../../lib/form/json-schema-to-zod-runtime.es.js";
 import { WorkflowRunContext } from "../context/workflow-run-context.es.js";
 import "./workflow-step-node-utils.es.js";
 import { buildNextStepInput, buildStepSuccessors, buildStepsFlow, collectGraphStepFlags, constructNodesAndEdges, isBranchArmBypassed, isLastRunnableStep, selectNextStepKey } from "./utils.es.js";
-import { jsonSchemaToZodRuntime } from "../../../lib/form/json-schema-to-zod-runtime.es.js";
-import { asObjectProperty } from "../../../lib/form/zod-provider/compat.es.js";
 import { useCallback, useContext, useMemo } from "react";
-import { parse } from "superjson";
 import { z } from "zod";
+import { parse } from "superjson";
 // src/domains/workflows/workflow/use-workflow-trigger.ts
 function useSuspendedSteps(streamResult, runId) {
 	return useMemo(() => {

package/dist/domains/workflows/workflow/workflow-input-data.cjs.js

@@ -4,11 +4,11 @@ const require_icons_Icon = require("../../../icons/Icon.cjs.js");
 const require_Txt = require("../../../Txt-BnoSqxKE.cjs");
 const require_components_Collapsible = require("../../../components/Collapsible.cjs.js");
 const require_components_DisclosureChevron = require("../../../components/DisclosureChevron.cjs.js");
+const require_lib_form_dynamic_form = require("../../../lib/form/dynamic-form.cjs.js");
 const require_domains_workflows_workflow_input_processor_input = require("./input/processor-input.cjs.js");
 const require_domains_workflows_workflow_input_workflow_json_input = require("./input/workflow-json-input.cjs.js");
 const require_domains_workflows_workflow_input_workflow_processor_input = require("./input/workflow-processor-input.cjs.js");
 const require_domains_workflows_workflow_workflow_input_type_toggle = require("./workflow-input-type-toggle.cjs.js");
-const require_lib_form_dynamic_form = require("../../../lib/form/dynamic-form.cjs.js");
 const require_lib_form_json_draft = require("../../../lib/form/json-draft.cjs.js");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");

package/dist/domains/workflows/workflow/workflow-input-data.es.js

@@ -3,11 +3,11 @@ import { Icon } from "../../../icons/Icon.es.js";
 import { t as Txt } from "../../../Txt-BM6TVV_c.js";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../../../components/Collapsible.es.js";
 import { DisclosureChevron } from "../../../components/DisclosureChevron.es.js";
+import { DynamicForm } from "../../../lib/form/dynamic-form.es.js";
 import { createProcessorInput, parseProcessorDraft } from "./input/processor-input.es.js";
 import { WorkflowJsonInput } from "./input/workflow-json-input.es.js";
 import { WorkflowProcessorInput } from "./input/workflow-processor-input.es.js";
 import { WorkflowInputTypeToggle } from "./workflow-input-type-toggle.es.js";
-import { DynamicForm } from "../../../lib/form/dynamic-form.es.js";
 import { getFormShapeError, parseJsonDraft, validateJsonDraft } from "../../../lib/form/json-draft.es.js";
 import { useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";

package/dist/domains/workflows/workflow/workflow-suspended-steps.cjs.js

@@ -8,15 +8,15 @@ const require_components_Collapsible = require("../../../components/Collapsible.
 const require_components_DisclosureChevron = require("../../../components/DisclosureChevron.cjs.js");
 const require_Badge = require("../../../Badge-DZ6r6bcw.cjs");
 const require_CodeEditor = require("../../../CodeEditor-CLzs0yVc.cjs");
-const require_components_Activity = require("../../../components/Activity.cjs.js");
 const require_lib_form_json_schema_to_zod_runtime = require("../../../lib/form/json-schema-to-zod-runtime.cjs.js");
+const require_components_Activity = require("../../../components/Activity.cjs.js");
 const require_domains_workflows_workflow_workflow_input_data = require("./workflow-input-data.cjs.js");
 const require_domains_workflows_components_workflow_layout = require("../components/workflow-layout.cjs.js");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let lucide_react = require("lucide-react");
-let superjson = require("superjson");
 let zod = require("zod");
+let superjson = require("superjson");
 // src/domains/workflows/workflow/workflow-suspended-steps.tsx
 var suspendedWickStyle = { "--belt-hue": "var(--warning-indicator)" };
 function formatPayloadSize(payload) {

package/dist/domains/workflows/workflow/workflow-suspended-steps.es.js

@@ -7,15 +7,15 @@ import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "../../../co
 import { DisclosureChevron } from "../../../components/DisclosureChevron.es.js";
 import { t as Badge } from "../../../Badge-aVu5iGAF.js";
 import { t as CodeEditor } from "../../../CodeEditor-COnz9c6B.js";
-import { ActivityWick } from "../../../components/Activity.es.js";
 import { jsonSchemaToZodRuntime } from "../../../lib/form/json-schema-to-zod-runtime.es.js";
+import { ActivityWick } from "../../../components/Activity.es.js";
 import { WorkflowInputData } from "./workflow-input-data.es.js";
 import { panelSurfaceStyle } from "../components/workflow-layout.es.js";
 import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { CirclePause, MoveDownLeft, MoveUpRight, Play } from "lucide-react";
-import { parse } from "superjson";
 import { z } from "zod";
+import { parse } from "superjson";
 // src/domains/workflows/workflow/workflow-suspended-steps.tsx
 var suspendedWickStyle = { "--belt-hue": "var(--warning-indicator)" };
 function formatPayloadSize(payload) {

package/dist/domains/workflows/workflow/workflow-time-travel-form.cjs.js

@@ -12,14 +12,14 @@ const require_components_DisclosureChevron = require("../../../components/Disclo
 const require_CodeEditor = require("../../../CodeEditor-CLzs0yVc.cjs");
 const require_Notice = require("../../../Notice-JZ7SW7q6.cjs");
 const require_components_Field = require("../../../components/Field.cjs.js");
-const require_domains_workflows_context_workflow_run_context = require("../context/workflow-run-context.cjs.js");
 const require_lib_form_json_schema_to_zod_runtime = require("../../../lib/form/json-schema-to-zod-runtime.cjs.js");
+const require_domains_workflows_context_workflow_run_context = require("../context/workflow-run-context.cjs.js");
 const require_domains_workflows_workflow_workflow_input_data = require("./workflow-input-data.cjs.js");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let lucide_react = require("lucide-react");
-let superjson = require("superjson");
 let zod = require("zod");
+let superjson = require("superjson");
 // src/domains/workflows/workflow/workflow-time-travel-form.tsx
 var buttonClass = require_primitives_typography.quietTextHover;
 var prettyJson = (value) => {

package/dist/domains/workflows/workflow/workflow-time-travel-form.es.js

@@ -11,14 +11,14 @@ import { DisclosureChevron } from "../../../components/DisclosureChevron.es.js";
 import { t as CodeEditor } from "../../../CodeEditor-COnz9c6B.js";
 import { t as Notice } from "../../../Notice-C-8oOZZF.js";
 import { Field, FieldError, FieldLabel } from "../../../components/Field.es.js";
-import { WorkflowRunContext } from "../context/workflow-run-context.es.js";
 import { jsonSchemaToZodRuntime } from "../../../lib/form/json-schema-to-zod-runtime.es.js";
+import { WorkflowRunContext } from "../context/workflow-run-context.es.js";
 import { WorkflowInputData } from "./workflow-input-data.es.js";
 import { useContext, useMemo, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { Braces, CopyIcon, EyeIcon, EyeOffIcon } from "lucide-react";
-import { parse } from "superjson";
 import { z } from "zod";
+import { parse } from "superjson";
 // src/domains/workflows/workflow/workflow-time-travel-form.tsx
 var buttonClass = quietTextHover;
 var prettyJson = (value) => {

package/dist/domains/workspace/components/workspace-add-skill-dialog.cjs.js

@@ -8,7 +8,7 @@ const require_select = require("../../../select-Dg8L5ROX.cjs");
 const require_Txt = require("../../../Txt-BnoSqxKE.cjs");
 const require_icons_GithubIcon = require("../../../icons/GithubIcon.cjs.js");
 const require_icons_SkillIcon = require("../../../icons/SkillIcon.cjs.js");
-const require_MarkdownRenderer = require("../../../MarkdownRenderer-CB8Z_CHc.cjs");
+const require_MarkdownRenderer = require("../../../MarkdownRenderer-y65WGBhC.cjs");
 const require_Dialog = require("../../../Dialog-BvWF9HE-.cjs");
 const require_components_Field = require("../../../components/Field.cjs.js");
 const require_components_SearchInput = require("../../../components/SearchInput.cjs.js");

package/dist/domains/workspace/components/workspace-add-skill-dialog.es.js

@@ -7,7 +7,7 @@ import { i as SelectItem, n as SelectContent, o as SelectTrigger, s as SelectVal
 import { t as Txt } from "../../../Txt-BM6TVV_c.js";
 import { GithubIcon } from "../../../icons/GithubIcon.es.js";
 import { SkillIcon } from "../../../icons/SkillIcon.es.js";
-import { t as MarkdownRenderer } from "../../../MarkdownRenderer-2GOXQJEv.js";
+import { t as MarkdownRenderer } from "../../../MarkdownRenderer-CI30RqdB.js";
 import { a as DialogContent, c as DialogHeader, d as DialogTitle, n as DialogBody, o as DialogDescription, p as DialogAction, r as DialogCancel, s as DialogFooter, t as Dialog } from "../../../Dialog-DaWtxwd9.js";
 import { Field, FieldLabel } from "../../../components/Field.es.js";
 import { SearchInput } from "../../../components/SearchInput.es.js";

package/dist/domains/workspace/components/workspace-markdown-preview.cjs.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_components_CodeBlock = require("../../../components/CodeBlock.cjs.js");
-const require_MarkdownRenderer = require("../../../MarkdownRenderer-CB8Z_CHc.cjs");
+const require_MarkdownRenderer = require("../../../MarkdownRenderer-y65WGBhC.cjs");
 const require_domains_workspace_components_frontmatter = require("./frontmatter.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/workspace/components/workspace-markdown-preview.tsx

package/dist/domains/workspace/components/workspace-markdown-preview.es.js

@@ -1,5 +1,5 @@
 import { CodeBlock } from "../../../components/CodeBlock.es.js";
-import { t as MarkdownRenderer } from "../../../MarkdownRenderer-2GOXQJEv.js";
+import { t as MarkdownRenderer } from "../../../MarkdownRenderer-CI30RqdB.js";
 import { splitFrontmatter } from "./frontmatter.es.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 // src/domains/workspace/components/workspace-markdown-preview.tsx

package/dist/{filter-bar-time-range-mg9JeYue.js → filter-bar-time-range-qlV8p7hp.js}

@@ -1,4 +1,4 @@
-import { t as DateTimeRangePicker } from "./date-time-range-picker-DKh1K9Iy.js";
+import { t as DateTimeRangePicker } from "./date-time-range-picker-CdSiXwB4.js";
 import { p as useFilterBarItemKeys, y as useFilterBarContext } from "./filter-bar-chip-CABeKrtf.js";
 import { useRef } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -57,4 +57,4 @@ function FilterBarTimeRange(props) {
 }
 export { FilterBarTimeRange as i, FILTER_BAR_TIME_RANGE_FIELD_ID as n, FILTER_BAR_TIME_RANGE_ITEM as r, FILTER_BAR_TIME_RANGE_FIELD as t };
 
-//# sourceMappingURL=filter-bar-time-range-mg9JeYue.js.map
+//# sourceMappingURL=filter-bar-time-range-qlV8p7hp.js.map

package/dist/{filter-bar-time-range-mg9JeYue.js.map → filter-bar-time-range-qlV8p7hp.js.map}

@@ -1 +1 @@
-{"version":3,"file":"filter-bar-time-range-mg9JeYue.js","names":[],"sources":["../src/ds/components/FilterBar/filter-bar-time-range.tsx"],"sourcesContent":["/* eslint-disable react-refresh/only-export-components */\nimport { CalendarIcon } from 'lucide-react';\nimport { useRef } from 'react';\nimport { FILTER_BAR_CONTROL_SIZE } from './filter-bar-chip';\nimport { useFilterBarContext } from './filter-bar-context';\nimport type { FilterBarField, FilterBarItem } from './types';\nimport { useFilterBarItemKeys } from './use-filter-bar-item-keys';\nimport { DateTimeRangePicker } from '@/ds/components/DateTimeRangePicker/date-time-range-picker';\nimport type { DateTimeRangePickerProps } from '@/ds/components/DateTimeRangePicker/date-time-range-picker';\n\nexport const FILTER_BAR_TIME_RANGE_FIELD_ID = 'timeRange';\n\n/**\n * Synthetic field backing the time range control. Hidden from the input's field step (the\n * range cannot be added twice) but registered so the bar resolves its label and takes it into\n * keyboard navigation. Add it to the bar's `fields` and `FILTER_BAR_TIME_RANGE_ITEM` to its\n * `items`, then render `FilterBar.TimeRange` for that item from `FilterBar.Chips`.\n */\nexport const FILTER_BAR_TIME_RANGE_FIELD: FilterBarField = {\n  id: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  label: 'Time',\n  icon: CalendarIcon,\n  type: 'text',\n  operators: ['is'],\n  hidden: true,\n};\n\nexport const FILTER_BAR_TIME_RANGE_ITEM: FilterBarItem = {\n  id: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  fieldId: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  operatorId: 'is',\n  value: '',\n};\n\nexport type FilterBarTimeRangeProps = Omit<DateTimeRangePickerProps, 'size' | 'ref'>;\n\n/**\n * A filter bar's time range: the `DateTimeRangePicker` itself at the bar's rung, so it looks and\n * behaves exactly as it does anywhere else, reset × included. It scopes the bar rather than\n * filtering it, so it is not a removable chip; the wrapper only joins it to the bar's arrow-key\n * order.\n */\nexport function FilterBarTimeRange(props: FilterBarTimeRangeProps) {\n  const ctx = useFilterBarContext();\n  const rootRef = useRef<HTMLDivElement>(null);\n  const { onKeyDown } = useFilterBarItemKeys({\n    item: FILTER_BAR_TIME_RANGE_ITEM,\n    rootRef,\n    pinned: true,\n    removable: false,\n    segmentSelector: 'button',\n  });\n\n  return (\n    <div\n      ref={rootRef}\n      role=\"group\"\n      aria-label=\"Time range\"\n      data-slot=\"filter-bar-time-range\"\n      className=\"flex\"\n      onKeyDown={onKeyDown}\n    >\n      <DateTimeRangePicker\n        {...props}\n        size={FILTER_BAR_CONTROL_SIZE}\n        ref={el => ctx.registerSegment(FILTER_BAR_TIME_RANGE_ITEM.id, 'value', el)}\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAUA,IAAa,iCAAiC;;;;;;;AAQ9C,IAAa,8BAA8C;CACzD,IAAI;CACJ,OAAO;CACP,MAAM;CACN,MAAM;CACN,WAAW,CAAC,IAAI;CAChB,QAAQ;AACV;AAEA,IAAa,6BAA4C;CACvD,IAAI;CACJ,SAAS;CACT,YAAY;CACZ,OAAO;AACT;;;;;;;AAUA,SAAgB,mBAAmB,OAAgC;CACjE,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,OAAuB,IAAI;CAC3C,MAAM,EAAE,cAAc,qBAAqB;EACzC,MAAM;EACN;EACA,QAAQ;EACR,WAAW;EACX,iBAAiB;CACnB,CAAC;CAED,OACE,oBAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,cAAW;EACX,aAAU;EACV,WAAU;EACC;EAEX,UAAA,oBAAC,qBAAD;GACE,GAAI;GACJ,MAAA;GACA,MAAK,OAAM,IAAI,gBAAgB,2BAA2B,IAAI,SAAS,EAAE;EAC1E,CAAA;CACE,CAAA;AAET"}
+{"version":3,"file":"filter-bar-time-range-qlV8p7hp.js","names":[],"sources":["../src/ds/components/FilterBar/filter-bar-time-range.tsx"],"sourcesContent":["/* eslint-disable react-refresh/only-export-components */\nimport { CalendarIcon } from 'lucide-react';\nimport { useRef } from 'react';\nimport { FILTER_BAR_CONTROL_SIZE } from './filter-bar-chip';\nimport { useFilterBarContext } from './filter-bar-context';\nimport type { FilterBarField, FilterBarItem } from './types';\nimport { useFilterBarItemKeys } from './use-filter-bar-item-keys';\nimport { DateTimeRangePicker } from '@/ds/components/DateTimeRangePicker/date-time-range-picker';\nimport type { DateTimeRangePickerProps } from '@/ds/components/DateTimeRangePicker/date-time-range-picker';\n\nexport const FILTER_BAR_TIME_RANGE_FIELD_ID = 'timeRange';\n\n/**\n * Synthetic field backing the time range control. Hidden from the input's field step (the\n * range cannot be added twice) but registered so the bar resolves its label and takes it into\n * keyboard navigation. Add it to the bar's `fields` and `FILTER_BAR_TIME_RANGE_ITEM` to its\n * `items`, then render `FilterBar.TimeRange` for that item from `FilterBar.Chips`.\n */\nexport const FILTER_BAR_TIME_RANGE_FIELD: FilterBarField = {\n  id: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  label: 'Time',\n  icon: CalendarIcon,\n  type: 'text',\n  operators: ['is'],\n  hidden: true,\n};\n\nexport const FILTER_BAR_TIME_RANGE_ITEM: FilterBarItem = {\n  id: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  fieldId: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  operatorId: 'is',\n  value: '',\n};\n\nexport type FilterBarTimeRangeProps = Omit<DateTimeRangePickerProps, 'size' | 'ref'>;\n\n/**\n * A filter bar's time range: the `DateTimeRangePicker` itself at the bar's rung, so it looks and\n * behaves exactly as it does anywhere else, reset × included. It scopes the bar rather than\n * filtering it, so it is not a removable chip; the wrapper only joins it to the bar's arrow-key\n * order.\n */\nexport function FilterBarTimeRange(props: FilterBarTimeRangeProps) {\n  const ctx = useFilterBarContext();\n  const rootRef = useRef<HTMLDivElement>(null);\n  const { onKeyDown } = useFilterBarItemKeys({\n    item: FILTER_BAR_TIME_RANGE_ITEM,\n    rootRef,\n    pinned: true,\n    removable: false,\n    segmentSelector: 'button',\n  });\n\n  return (\n    <div\n      ref={rootRef}\n      role=\"group\"\n      aria-label=\"Time range\"\n      data-slot=\"filter-bar-time-range\"\n      className=\"flex\"\n      onKeyDown={onKeyDown}\n    >\n      <DateTimeRangePicker\n        {...props}\n        size={FILTER_BAR_CONTROL_SIZE}\n        ref={el => ctx.registerSegment(FILTER_BAR_TIME_RANGE_ITEM.id, 'value', el)}\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAUA,IAAa,iCAAiC;;;;;;;AAQ9C,IAAa,8BAA8C;CACzD,IAAI;CACJ,OAAO;CACP,MAAM;CACN,MAAM;CACN,WAAW,CAAC,IAAI;CAChB,QAAQ;AACV;AAEA,IAAa,6BAA4C;CACvD,IAAI;CACJ,SAAS;CACT,YAAY;CACZ,OAAO;AACT;;;;;;;AAUA,SAAgB,mBAAmB,OAAgC;CACjE,MAAM,MAAM,oBAAoB;CAChC,MAAM,UAAU,OAAuB,IAAI;CAC3C,MAAM,EAAE,cAAc,qBAAqB;EACzC,MAAM;EACN;EACA,QAAQ;EACR,WAAW;EACX,iBAAiB;CACnB,CAAC;CAED,OACE,oBAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,cAAW;EACX,aAAU;EACV,WAAU;EACC;EAEX,UAAA,oBAAC,qBAAD;GACE,GAAI;GACJ,MAAA;GACA,MAAK,OAAM,IAAI,gBAAgB,2BAA2B,IAAI,SAAS,EAAE;EAC1E,CAAA;CACE,CAAA;AAET"}

package/dist/{filter-bar-time-range-BA-pXMlo.cjs → filter-bar-time-range-zdM024JD.cjs}

@@ -1,4 +1,4 @@
-const require_date_time_range_picker = require("./date-time-range-picker-CTt7Od0P.cjs");
+const require_date_time_range_picker = require("./date-time-range-picker-CWGjoR3j.cjs");
 const require_filter_bar_chip = require("./filter-bar-chip-Cg-UbIwP.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -80,4 +80,4 @@ Object.defineProperty(exports, "FilterBarTimeRange", {
 	}
 });
 
-//# sourceMappingURL=filter-bar-time-range-BA-pXMlo.cjs.map
+//# sourceMappingURL=filter-bar-time-range-zdM024JD.cjs.map

package/dist/{filter-bar-time-range-BA-pXMlo.cjs.map → filter-bar-time-range-zdM024JD.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"filter-bar-time-range-BA-pXMlo.cjs","names":["CalendarIcon","useFilterBarContext","useRef","useFilterBarItemKeys","DateTimeRangePicker"],"sources":["../src/ds/components/FilterBar/filter-bar-time-range.tsx"],"sourcesContent":["/* eslint-disable react-refresh/only-export-components */\nimport { CalendarIcon } from 'lucide-react';\nimport { useRef } from 'react';\nimport { FILTER_BAR_CONTROL_SIZE } from './filter-bar-chip';\nimport { useFilterBarContext } from './filter-bar-context';\nimport type { FilterBarField, FilterBarItem } from './types';\nimport { useFilterBarItemKeys } from './use-filter-bar-item-keys';\nimport { DateTimeRangePicker } from '@/ds/components/DateTimeRangePicker/date-time-range-picker';\nimport type { DateTimeRangePickerProps } from '@/ds/components/DateTimeRangePicker/date-time-range-picker';\n\nexport const FILTER_BAR_TIME_RANGE_FIELD_ID = 'timeRange';\n\n/**\n * Synthetic field backing the time range control. Hidden from the input's field step (the\n * range cannot be added twice) but registered so the bar resolves its label and takes it into\n * keyboard navigation. Add it to the bar's `fields` and `FILTER_BAR_TIME_RANGE_ITEM` to its\n * `items`, then render `FilterBar.TimeRange` for that item from `FilterBar.Chips`.\n */\nexport const FILTER_BAR_TIME_RANGE_FIELD: FilterBarField = {\n  id: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  label: 'Time',\n  icon: CalendarIcon,\n  type: 'text',\n  operators: ['is'],\n  hidden: true,\n};\n\nexport const FILTER_BAR_TIME_RANGE_ITEM: FilterBarItem = {\n  id: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  fieldId: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  operatorId: 'is',\n  value: '',\n};\n\nexport type FilterBarTimeRangeProps = Omit<DateTimeRangePickerProps, 'size' | 'ref'>;\n\n/**\n * A filter bar's time range: the `DateTimeRangePicker` itself at the bar's rung, so it looks and\n * behaves exactly as it does anywhere else, reset × included. It scopes the bar rather than\n * filtering it, so it is not a removable chip; the wrapper only joins it to the bar's arrow-key\n * order.\n */\nexport function FilterBarTimeRange(props: FilterBarTimeRangeProps) {\n  const ctx = useFilterBarContext();\n  const rootRef = useRef<HTMLDivElement>(null);\n  const { onKeyDown } = useFilterBarItemKeys({\n    item: FILTER_BAR_TIME_RANGE_ITEM,\n    rootRef,\n    pinned: true,\n    removable: false,\n    segmentSelector: 'button',\n  });\n\n  return (\n    <div\n      ref={rootRef}\n      role=\"group\"\n      aria-label=\"Time range\"\n      data-slot=\"filter-bar-time-range\"\n      className=\"flex\"\n      onKeyDown={onKeyDown}\n    >\n      <DateTimeRangePicker\n        {...props}\n        size={FILTER_BAR_CONTROL_SIZE}\n        ref={el => ctx.registerSegment(FILTER_BAR_TIME_RANGE_ITEM.id, 'value', el)}\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAUA,IAAa,iCAAiC;;;;;;;AAQ9C,IAAa,8BAA8C;CACzD,IAAI;CACJ,OAAO;CACP,MAAMA,aAAAA;CACN,MAAM;CACN,WAAW,CAAC,IAAI;CAChB,QAAQ;AACV;AAEA,IAAa,6BAA4C;CACvD,IAAI;CACJ,SAAS;CACT,YAAY;CACZ,OAAO;AACT;;;;;;;AAUA,SAAgB,mBAAmB,OAAgC;CACjE,MAAM,MAAMC,wBAAAA,oBAAoB;CAChC,MAAM,WAAA,GAAUC,MAAAA,OAAAA,CAAuB,IAAI;CAC3C,MAAM,EAAE,cAAcC,wBAAAA,qBAAqB;EACzC,MAAM;EACN;EACA,QAAQ;EACR,WAAW;EACX,iBAAiB;CACnB,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,cAAW;EACX,aAAU;EACV,WAAU;EACC;EAEX,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,+BAAAA,qBAAD;GACE,GAAI;GACJ,MAAA;GACA,MAAK,OAAM,IAAI,gBAAgB,2BAA2B,IAAI,SAAS,EAAE;EAC1E,CAAA;CACE,CAAA;AAET"}
+{"version":3,"file":"filter-bar-time-range-zdM024JD.cjs","names":["CalendarIcon","useFilterBarContext","useRef","useFilterBarItemKeys","DateTimeRangePicker"],"sources":["../src/ds/components/FilterBar/filter-bar-time-range.tsx"],"sourcesContent":["/* eslint-disable react-refresh/only-export-components */\nimport { CalendarIcon } from 'lucide-react';\nimport { useRef } from 'react';\nimport { FILTER_BAR_CONTROL_SIZE } from './filter-bar-chip';\nimport { useFilterBarContext } from './filter-bar-context';\nimport type { FilterBarField, FilterBarItem } from './types';\nimport { useFilterBarItemKeys } from './use-filter-bar-item-keys';\nimport { DateTimeRangePicker } from '@/ds/components/DateTimeRangePicker/date-time-range-picker';\nimport type { DateTimeRangePickerProps } from '@/ds/components/DateTimeRangePicker/date-time-range-picker';\n\nexport const FILTER_BAR_TIME_RANGE_FIELD_ID = 'timeRange';\n\n/**\n * Synthetic field backing the time range control. Hidden from the input's field step (the\n * range cannot be added twice) but registered so the bar resolves its label and takes it into\n * keyboard navigation. Add it to the bar's `fields` and `FILTER_BAR_TIME_RANGE_ITEM` to its\n * `items`, then render `FilterBar.TimeRange` for that item from `FilterBar.Chips`.\n */\nexport const FILTER_BAR_TIME_RANGE_FIELD: FilterBarField = {\n  id: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  label: 'Time',\n  icon: CalendarIcon,\n  type: 'text',\n  operators: ['is'],\n  hidden: true,\n};\n\nexport const FILTER_BAR_TIME_RANGE_ITEM: FilterBarItem = {\n  id: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  fieldId: FILTER_BAR_TIME_RANGE_FIELD_ID,\n  operatorId: 'is',\n  value: '',\n};\n\nexport type FilterBarTimeRangeProps = Omit<DateTimeRangePickerProps, 'size' | 'ref'>;\n\n/**\n * A filter bar's time range: the `DateTimeRangePicker` itself at the bar's rung, so it looks and\n * behaves exactly as it does anywhere else, reset × included. It scopes the bar rather than\n * filtering it, so it is not a removable chip; the wrapper only joins it to the bar's arrow-key\n * order.\n */\nexport function FilterBarTimeRange(props: FilterBarTimeRangeProps) {\n  const ctx = useFilterBarContext();\n  const rootRef = useRef<HTMLDivElement>(null);\n  const { onKeyDown } = useFilterBarItemKeys({\n    item: FILTER_BAR_TIME_RANGE_ITEM,\n    rootRef,\n    pinned: true,\n    removable: false,\n    segmentSelector: 'button',\n  });\n\n  return (\n    <div\n      ref={rootRef}\n      role=\"group\"\n      aria-label=\"Time range\"\n      data-slot=\"filter-bar-time-range\"\n      className=\"flex\"\n      onKeyDown={onKeyDown}\n    >\n      <DateTimeRangePicker\n        {...props}\n        size={FILTER_BAR_CONTROL_SIZE}\n        ref={el => ctx.registerSegment(FILTER_BAR_TIME_RANGE_ITEM.id, 'value', el)}\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAUA,IAAa,iCAAiC;;;;;;;AAQ9C,IAAa,8BAA8C;CACzD,IAAI;CACJ,OAAO;CACP,MAAMA,aAAAA;CACN,MAAM;CACN,WAAW,CAAC,IAAI;CAChB,QAAQ;AACV;AAEA,IAAa,6BAA4C;CACvD,IAAI;CACJ,SAAS;CACT,YAAY;CACZ,OAAO;AACT;;;;;;;AAUA,SAAgB,mBAAmB,OAAgC;CACjE,MAAM,MAAMC,wBAAAA,oBAAoB;CAChC,MAAM,WAAA,GAAUC,MAAAA,OAAAA,CAAuB,IAAI;CAC3C,MAAM,EAAE,cAAcC,wBAAAA,qBAAqB;EACzC,MAAM;EACN;EACA,QAAQ;EACR,WAAW;EACX,iBAAiB;CACnB,CAAC;CAED,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,cAAW;EACX,aAAU;EACV,WAAU;EACC;EAEX,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,+BAAAA,qBAAD;GACE,GAAI;GACJ,MAAA;GACA,MAAK,OAAM,IAAI,gBAAgB,2BAA2B,IAAI,SAAS,EAAE;EAC1E,CAAA;CACE,CAAA;AAET"}

package/dist/lib/form/dynamic-form.cjs.js

@@ -1,8 +1,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_lib_form_zod_provider_compat = require("./zod-provider/compat.cjs.js");
-const require_lib_form_components_form_submit_row = require("./components/form-submit-row.cjs.js");
 require("./field-context.cjs.js");
 const require_lib_form_auto_form = require("./auto-form.cjs.js");
+const require_lib_form_components_form_submit_row = require("./components/form-submit-row.cjs.js");
+const require_lib_form_zod_provider_compat = require("./zod-provider/compat.cjs.js");
 const require_lib_form_is_empty_zod_object = require("./is-empty-zod-object.cjs.js");
 const require_lib_form_zod_provider = require("./zod-provider.cjs.js");
 let react = require("react");

package/dist/lib/form/dynamic-form.es.js

@@ -1,7 +1,7 @@
-import { asObjectProperty, getShape } from "./zod-provider/compat.es.js";
-import { FormSubmitRow } from "./components/form-submit-row.es.js";
 import "./field-context.es.js";
 import { AutoForm } from "./auto-form.es.js";
+import { FormSubmitRow } from "./components/form-submit-row.es.js";
+import { asObjectProperty, getShape } from "./zod-provider/compat.es.js";
 import { isEmptyZodObject } from "./is-empty-zod-object.es.js";
 import { CustomZodProvider } from "./zod-provider.es.js";
 import { createContext, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef } from "react";

package/dist/lib/form/json-draft.cjs.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_lib_form_zod_provider_compat = require("./zod-provider/compat.cjs.js");
 const require_lib_form_utils = require("./utils.cjs.js");
+const require_lib_form_zod_provider_compat = require("./zod-provider/compat.cjs.js");
 const require_lib_form_zod_provider_field_type_inference = require("./zod-provider/field-type-inference.cjs.js");
 // src/lib/form/json-draft.ts
 /** Parses the text of a JSON view, with an error ready to show under the editor. */

package/dist/lib/form/json-draft.es.js

@@ -1,5 +1,5 @@
-import { getBaseSchema } from "./zod-provider/compat.es.js";
 import { isPlainObject } from "./utils.es.js";
+import { getBaseSchema } from "./zod-provider/compat.es.js";
 import { inferFieldType } from "./zod-provider/field-type-inference.es.js";
 // src/lib/form/json-draft.ts
 /** Parses the text of a JSON view, with an error ready to show under the editor. */

package/dist/lib/form/zod-provider.cjs.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_lib_form_zod_provider_compat = require("./zod-provider/compat.cjs.js");
 const require_lib_form_utils = require("./utils.cjs.js");
+const require_lib_form_zod_provider_compat = require("./zod-provider/compat.cjs.js");
 const require_lib_form_zod_provider_default_values = require("./zod-provider/default-values.cjs.js");
 const require_lib_form_zod_provider_field_type_inference = require("./zod-provider/field-type-inference.cjs.js");
 // src/lib/form/zod-provider/index.ts

package/dist/lib/form/zod-provider.es.js

@@ -1,5 +1,5 @@
-import { getArrayElement, getBaseSchema, getDef, getEnumValues, getIntersection, getLiteralValues, getRecordValueSchema, getShape, getUnionOptions, isOptional } from "./zod-provider/compat.es.js";
 import { isPlainObject } from "./utils.es.js";
+import { getArrayElement, getBaseSchema, getDef, getEnumValues, getIntersection, getLiteralValues, getRecordValueSchema, getShape, getUnionOptions, isOptional } from "./zod-provider/compat.es.js";
 import { getDefaultValueInZodStack, getDefaultValues } from "./zod-provider/default-values.es.js";
 import { inferFieldType } from "./zod-provider/field-type-inference.es.js";
 // src/lib/form/zod-provider/index.ts

package/dist/{span-payload-primitives-B3RdahsC.js → span-payload-primitives-CKKIAVPJ.js}

@@ -3,11 +3,11 @@ import { t as cn } from "./utils-DQx8TpNT.js";
 import "./primitives/raised-surface.es.js";
 import { t as ScrollArea } from "./scroll-area-C226l0v0.js";
 import { t as Txt } from "./Txt-BM6TVV_c.js";
-import { r as presentTool } from "./tool-presentation-DvCsb_kz.js";
-import { f as ActivityHeadline } from "./activity-rJ1NQl_2.js";
+import { r as presentTool } from "./tool-presentation-CvibOP1J.js";
+import { f as ActivityHeadline } from "./activity-C8Ql81WM.js";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "./components/Collapsible.es.js";
 import { DisclosureChevron } from "./components/DisclosureChevron.es.js";
-import { t as MarkdownRenderer } from "./MarkdownRenderer-2GOXQJEv.js";
+import { t as MarkdownRenderer } from "./MarkdownRenderer-CI30RqdB.js";
 import { BadgeWrapper } from "./domains/chat/components/badge-wrapper.es.js";
 import { t as DataKeysAndValues } from "./DataKeysAndValues-PwOmGxyp.js";
 import { getDelegatedTool, getDelegatedToolHref } from "./domains/traces/components/span-payload/span-payload-registry.es.js";
@@ -161,4 +161,4 @@ function SpanPayloadToolCalls({ toolCalls }) {
 }
 export { SpanPayloadListName as a, SpanPayloadTool as c, SpanPayloadList as i, SpanToolNameValue as l, SpanPayloadField as n, SpanPayloadMarkdown as o, SpanPayloadLabel as r, SpanPayloadToolCalls as s, SpanPayloadCollapsible as t };
 
-//# sourceMappingURL=span-payload-primitives-B3RdahsC.js.map
+//# sourceMappingURL=span-payload-primitives-CKKIAVPJ.js.map

package/dist/{span-payload-primitives-B3RdahsC.js.map → span-payload-primitives-CKKIAVPJ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"span-payload-primitives-B3RdahsC.js","names":[],"sources":["../src/domains/traces/components/span-payload/span-payload-tool.tsx","../src/domains/traces/components/span-payload/span-payload-primitives.tsx"],"sourcesContent":["import { SpanPayloadJson } from './span-payload-json';\nimport { SpanPayloadField } from './span-payload-primitives';\nimport { getDelegatedTool, getDelegatedToolHref } from './span-payload-registry';\nimport { BadgeWrapper } from '@/domains/chat/components/badge-wrapper';\nimport { ActivityHeadline } from '@/ds/components/ai/activity';\nimport { presentTool } from '@/ds/components/ai/tool-call/tool-presentation';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { useLinkComponent } from '@/lib/framework';\n\nconst isRecord = (value: unknown): value is Record<string, unknown> =>\n  typeof value === 'object' && value !== null && !Array.isArray(value);\n\n/** A tool name in a key/value list, linked to its page when the tool is a workflow or sub-agent. */\nexport function SpanToolNameValue({ toolName }: { toolName: string }) {\n  const { Link, paths } = useLinkComponent();\n  const href = getDelegatedToolHref(paths, toolName);\n  if (!href) return <DataKeysAndValues.Value>{toolName}</DataKeysAndValues.Value>;\n  return (\n    <DataKeysAndValues.ValueLink href={href} as={Link}>\n      {toolName}\n    </DataKeysAndValues.ValueLink>\n  );\n}\n\nexport function SpanPayloadTool({ value }: { value: unknown }) {\n  const { Link, paths } = useLinkComponent();\n  if (!isRecord(value)) return <SpanPayloadJson value={value} />;\n  const call = value.type === 'tool-invocation' ? value.toolInvocation : value;\n  if (!isRecord(call) || typeof call.toolName !== 'string' || !call.toolName) {\n    return <SpanPayloadJson value={value} />;\n  }\n  const input = 'args' in call ? call.args : call.input;\n  const output = 'result' in call ? call.result : call.output;\n  const error = call.isError === true || call.state === 'output-error';\n  const errorText = typeof call.errorText === 'string' ? call.errorText : undefined;\n  const { icon: ToolIcon, label, detail, description } = presentTool(call.toolName, input);\n  const delegated = getDelegatedTool(call.toolName);\n  // The header toggles the body, so the workflow or agent link sits in the body rather than in it.\n  const delegatedHref = getDelegatedToolHref(paths, call.toolName);\n  const hasBody = Boolean(delegatedHref) || input !== undefined || output !== undefined || errorText !== undefined;\n  return (\n    <div data-slot=\"span-payload-tool\" className=\"flex flex-col gap-2\">\n      <BadgeWrapper\n        status={error ? 'error' : 'idle'}\n        header={\n          <ActivityHeadline icon={<ToolIcon aria-hidden />} label={label} detail={detail} description={description} />\n        }\n      >\n        {hasBody && (\n          <div className=\"flex flex-col gap-3\">\n            {delegated && delegatedHref && (\n              <DataKeysAndValues>\n                <DataKeysAndValues.Key>{delegated.kind === 'workflow' ? 'Workflow' : 'Agent'}</DataKeysAndValues.Key>\n                <DataKeysAndValues.ValueLink href={delegatedHref} as={Link}>\n                  {delegated.key}\n                </DataKeysAndValues.ValueLink>\n              </DataKeysAndValues>\n            )}\n            {input !== undefined && (\n              <SpanPayloadField label=\"Arguments\">\n                <SpanPayloadJson value={input} />\n              </SpanPayloadField>\n            )}\n            {output !== undefined && (\n              <SpanPayloadField label=\"Result\">\n                <SpanPayloadJson value={output} />\n              </SpanPayloadField>\n            )}\n            {errorText !== undefined && (\n              <SpanPayloadField label=\"Error\">\n                <SpanPayloadJson value={errorText} />\n              </SpanPayloadField>\n            )}\n          </div>\n        )}\n      </BadgeWrapper>\n    </div>\n  );\n}\n","import type { ReactNode } from 'react';\nimport { SpanPayloadTool } from './span-payload-tool';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { DisclosureChevron } from '@/ds/components/DisclosureChevron';\nimport { MarkdownRenderer } from '@/ds/components/MarkdownRenderer';\nimport { ScrollArea } from '@/ds/components/ScrollArea';\nimport { Txt } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\n/** Small-caps label above a field of a rich payload. */\nexport function SpanPayloadLabel({ children }: { children: ReactNode }) {\n  return (\n    <Txt as=\"span\" variant=\"meta\" tone=\"faint\" className=\"block uppercase\">\n      {children}\n    </Txt>\n  );\n}\n\nexport function SpanPayloadField({ label, children }: { label: ReactNode; children: ReactNode }) {\n  return (\n    <div data-slot=\"span-payload-field\" className=\"flex flex-col gap-1.5\">\n      <SpanPayloadLabel>{label}</SpanPayloadLabel>\n      {children}\n    </div>\n  );\n}\n\nexport function SpanPayloadMarkdown({ children }: { children: string }) {\n  return (\n    <div data-slot=\"span-payload-markdown\" className=\"text-foreground\">\n      <MarkdownRenderer>{children}</MarkdownRenderer>\n    </div>\n  );\n}\n\n/** A collapsed block for secondary data (reasoning, steps, warnings…). */\nexport function SpanPayloadCollapsible({\n  label,\n  children,\n  defaultOpen = false,\n}: {\n  label: ReactNode;\n  children: ReactNode;\n  defaultOpen?: boolean;\n}) {\n  return (\n    <Collapsible defaultOpen={defaultOpen}>\n      <CollapsibleTrigger className=\"flex items-center gap-1 text-meta text-placeholder uppercase\">\n        <DisclosureChevron direction=\"right\" className=\"size-3\" />\n        {label}\n      </CollapsibleTrigger>\n      <CollapsibleContent className=\"pt-1.5\">{children}</CollapsibleContent>\n    </Collapsible>\n  );\n}\n\nexport interface SpanPayloadListItem {\n  key: string;\n  /** The item name, a link when it has a page to open. */\n  name: ReactNode;\n  description?: string;\n}\n\n/**\n * A scrollable list of named items with an optional description (tools, skills…). The scrollbar\n * stays visible while the list overflows, so readers can tell there are more items below.\n * `card` frames it on its own surface, for a list that stands alone in a section.\n */\nexport function SpanPayloadList({ items, slot, card }: { items: SpanPayloadListItem[]; slot: string; card?: boolean }) {\n  return (\n    <ScrollArea\n      maxHeight=\"12rem\"\n      alwaysShowScrollbar\n      className={cn(card && cn(raisedSurfaceStyle, 'rounded-lg [--scroll-area-scrollbar-inset:0.5rem]'))}\n    >\n      <ul data-slot={slot} className={cn('flex flex-col gap-2', card ? 'p-3 pr-4' : 'pr-3')}>\n        {items.map(item => (\n          <li key={item.key} className=\"flex min-w-0 flex-col\">\n            {item.name}\n            {item.description && (\n              // Payload content reads in ink like the messages around it; grey is kept for the labels.\n              <Txt as=\"span\" variant=\"body-sm\" className=\"line-clamp-2\" title={item.description}>\n                {item.description}\n              </Txt>\n            )}\n          </li>\n        ))}\n      </ul>\n    </ScrollArea>\n  );\n}\n\n/** A list item name rendered as plain text. */\nexport function SpanPayloadListName({ children }: { children: string }) {\n  return (\n    <Txt as=\"span\" variant=\"label\" tone=\"ink\" className=\"truncate\">\n      {children}\n    </Txt>\n  );\n}\n\n/** Tool calls as core records them: `{ toolName, args | input }` when they have that shape, JSON otherwise. */\nexport function SpanPayloadToolCalls({ toolCalls }: { toolCalls: unknown[] }) {\n  return (\n    <ul data-slot=\"span-payload-tool-calls\" className=\"flex flex-col gap-2\">\n      {toolCalls.map((call, index) => (\n        <li key={index}>\n          <SpanPayloadTool value={call} />\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"span-payload-primitives-CKKIAVPJ.js","names":[],"sources":["../src/domains/traces/components/span-payload/span-payload-tool.tsx","../src/domains/traces/components/span-payload/span-payload-primitives.tsx"],"sourcesContent":["import { SpanPayloadJson } from './span-payload-json';\nimport { SpanPayloadField } from './span-payload-primitives';\nimport { getDelegatedTool, getDelegatedToolHref } from './span-payload-registry';\nimport { BadgeWrapper } from '@/domains/chat/components/badge-wrapper';\nimport { ActivityHeadline } from '@/ds/components/ai/activity';\nimport { presentTool } from '@/ds/components/ai/tool-call/tool-presentation';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { useLinkComponent } from '@/lib/framework';\n\nconst isRecord = (value: unknown): value is Record<string, unknown> =>\n  typeof value === 'object' && value !== null && !Array.isArray(value);\n\n/** A tool name in a key/value list, linked to its page when the tool is a workflow or sub-agent. */\nexport function SpanToolNameValue({ toolName }: { toolName: string }) {\n  const { Link, paths } = useLinkComponent();\n  const href = getDelegatedToolHref(paths, toolName);\n  if (!href) return <DataKeysAndValues.Value>{toolName}</DataKeysAndValues.Value>;\n  return (\n    <DataKeysAndValues.ValueLink href={href} as={Link}>\n      {toolName}\n    </DataKeysAndValues.ValueLink>\n  );\n}\n\nexport function SpanPayloadTool({ value }: { value: unknown }) {\n  const { Link, paths } = useLinkComponent();\n  if (!isRecord(value)) return <SpanPayloadJson value={value} />;\n  const call = value.type === 'tool-invocation' ? value.toolInvocation : value;\n  if (!isRecord(call) || typeof call.toolName !== 'string' || !call.toolName) {\n    return <SpanPayloadJson value={value} />;\n  }\n  const input = 'args' in call ? call.args : call.input;\n  const output = 'result' in call ? call.result : call.output;\n  const error = call.isError === true || call.state === 'output-error';\n  const errorText = typeof call.errorText === 'string' ? call.errorText : undefined;\n  const { icon: ToolIcon, label, detail, description } = presentTool(call.toolName, input);\n  const delegated = getDelegatedTool(call.toolName);\n  // The header toggles the body, so the workflow or agent link sits in the body rather than in it.\n  const delegatedHref = getDelegatedToolHref(paths, call.toolName);\n  const hasBody = Boolean(delegatedHref) || input !== undefined || output !== undefined || errorText !== undefined;\n  return (\n    <div data-slot=\"span-payload-tool\" className=\"flex flex-col gap-2\">\n      <BadgeWrapper\n        status={error ? 'error' : 'idle'}\n        header={\n          <ActivityHeadline icon={<ToolIcon aria-hidden />} label={label} detail={detail} description={description} />\n        }\n      >\n        {hasBody && (\n          <div className=\"flex flex-col gap-3\">\n            {delegated && delegatedHref && (\n              <DataKeysAndValues>\n                <DataKeysAndValues.Key>{delegated.kind === 'workflow' ? 'Workflow' : 'Agent'}</DataKeysAndValues.Key>\n                <DataKeysAndValues.ValueLink href={delegatedHref} as={Link}>\n                  {delegated.key}\n                </DataKeysAndValues.ValueLink>\n              </DataKeysAndValues>\n            )}\n            {input !== undefined && (\n              <SpanPayloadField label=\"Arguments\">\n                <SpanPayloadJson value={input} />\n              </SpanPayloadField>\n            )}\n            {output !== undefined && (\n              <SpanPayloadField label=\"Result\">\n                <SpanPayloadJson value={output} />\n              </SpanPayloadField>\n            )}\n            {errorText !== undefined && (\n              <SpanPayloadField label=\"Error\">\n                <SpanPayloadJson value={errorText} />\n              </SpanPayloadField>\n            )}\n          </div>\n        )}\n      </BadgeWrapper>\n    </div>\n  );\n}\n","import type { ReactNode } from 'react';\nimport { SpanPayloadTool } from './span-payload-tool';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { DisclosureChevron } from '@/ds/components/DisclosureChevron';\nimport { MarkdownRenderer } from '@/ds/components/MarkdownRenderer';\nimport { ScrollArea } from '@/ds/components/ScrollArea';\nimport { Txt } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\n/** Small-caps label above a field of a rich payload. */\nexport function SpanPayloadLabel({ children }: { children: ReactNode }) {\n  return (\n    <Txt as=\"span\" variant=\"meta\" tone=\"faint\" className=\"block uppercase\">\n      {children}\n    </Txt>\n  );\n}\n\nexport function SpanPayloadField({ label, children }: { label: ReactNode; children: ReactNode }) {\n  return (\n    <div data-slot=\"span-payload-field\" className=\"flex flex-col gap-1.5\">\n      <SpanPayloadLabel>{label}</SpanPayloadLabel>\n      {children}\n    </div>\n  );\n}\n\nexport function SpanPayloadMarkdown({ children }: { children: string }) {\n  return (\n    <div data-slot=\"span-payload-markdown\" className=\"text-foreground\">\n      <MarkdownRenderer>{children}</MarkdownRenderer>\n    </div>\n  );\n}\n\n/** A collapsed block for secondary data (reasoning, steps, warnings…). */\nexport function SpanPayloadCollapsible({\n  label,\n  children,\n  defaultOpen = false,\n}: {\n  label: ReactNode;\n  children: ReactNode;\n  defaultOpen?: boolean;\n}) {\n  return (\n    <Collapsible defaultOpen={defaultOpen}>\n      <CollapsibleTrigger className=\"flex items-center gap-1 text-meta text-placeholder uppercase\">\n        <DisclosureChevron direction=\"right\" className=\"size-3\" />\n        {label}\n      </CollapsibleTrigger>\n      <CollapsibleContent className=\"pt-1.5\">{children}</CollapsibleContent>\n    </Collapsible>\n  );\n}\n\nexport interface SpanPayloadListItem {\n  key: string;\n  /** The item name, a link when it has a page to open. */\n  name: ReactNode;\n  description?: string;\n}\n\n/**\n * A scrollable list of named items with an optional description (tools, skills…). The scrollbar\n * stays visible while the list overflows, so readers can tell there are more items below.\n * `card` frames it on its own surface, for a list that stands alone in a section.\n */\nexport function SpanPayloadList({ items, slot, card }: { items: SpanPayloadListItem[]; slot: string; card?: boolean }) {\n  return (\n    <ScrollArea\n      maxHeight=\"12rem\"\n      alwaysShowScrollbar\n      className={cn(card && cn(raisedSurfaceStyle, 'rounded-lg [--scroll-area-scrollbar-inset:0.5rem]'))}\n    >\n      <ul data-slot={slot} className={cn('flex flex-col gap-2', card ? 'p-3 pr-4' : 'pr-3')}>\n        {items.map(item => (\n          <li key={item.key} className=\"flex min-w-0 flex-col\">\n            {item.name}\n            {item.description && (\n              // Payload content reads in ink like the messages around it; grey is kept for the labels.\n              <Txt as=\"span\" variant=\"body-sm\" className=\"line-clamp-2\" title={item.description}>\n                {item.description}\n              </Txt>\n            )}\n          </li>\n        ))}\n      </ul>\n    </ScrollArea>\n  );\n}\n\n/** A list item name rendered as plain text. */\nexport function SpanPayloadListName({ children }: { children: string }) {\n  return (\n    <Txt as=\"span\" variant=\"label\" tone=\"ink\" className=\"truncate\">\n      {children}\n    </Txt>\n  );\n}\n\n/** Tool calls as core records them: `{ toolName, args | input }` when they have that shape, JSON otherwise. */\nexport function SpanPayloadToolCalls({ toolCalls }: { toolCalls: unknown[] }) {\n  return (\n    <ul data-slot=\"span-payload-tool-calls\" className=\"flex flex-col gap-2\">\n      {toolCalls.map((call, index) => (\n        <li key={index}>\n          <SpanPayloadTool value={call} />\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"mappings":"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"}

package/dist/{span-payload-primitives-_2d-pAOD.cjs → span-payload-primitives-D4tHWN2W.cjs}

@@ -3,11 +3,11 @@ const require_utils = require("./utils-uDc1ofX1.cjs");
 require("./primitives/raised-surface.cjs.js");
 const require_scroll_area = require("./scroll-area-BP4gPZ4G.cjs");
 const require_Txt = require("./Txt-BnoSqxKE.cjs");
-const require_tool_presentation = require("./tool-presentation-CQlDEwgS.cjs");
-const require_activity = require("./activity-DyB5H3gF.cjs");
+const require_tool_presentation = require("./tool-presentation-D6nzVruN.cjs");
+const require_activity = require("./activity-CcQZeDYi.cjs");
 const require_components_Collapsible = require("./components/Collapsible.cjs.js");
 const require_components_DisclosureChevron = require("./components/DisclosureChevron.cjs.js");
-const require_MarkdownRenderer = require("./MarkdownRenderer-CB8Z_CHc.cjs");
+const require_MarkdownRenderer = require("./MarkdownRenderer-y65WGBhC.cjs");
 const require_domains_chat_components_badge_wrapper = require("./domains/chat/components/badge-wrapper.cjs.js");
 const require_DataKeysAndValues = require("./DataKeysAndValues-DsH6AbAo.cjs");
 const require_domains_traces_components_span_payload_span_payload_registry = require("./domains/traces/components/span-payload/span-payload-registry.cjs.js");
@@ -214,4 +214,4 @@ Object.defineProperty(exports, "SpanToolNameValue", {
 	}
 });
 
-//# sourceMappingURL=span-payload-primitives-_2d-pAOD.cjs.map
+//# sourceMappingURL=span-payload-primitives-D4tHWN2W.cjs.map

package/dist/{span-payload-primitives-_2d-pAOD.cjs.map → span-payload-primitives-D4tHWN2W.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"span-payload-primitives-_2d-pAOD.cjs","names":["useLinkComponent","getDelegatedToolHref","DataKeysAndValues","SpanPayloadJson","presentTool","getDelegatedTool","BadgeWrapper","ActivityHeadline","Txt","MarkdownRenderer","Collapsible","CollapsibleTrigger","DisclosureChevron","CollapsibleContent","ScrollArea","cn"],"sources":["../src/domains/traces/components/span-payload/span-payload-tool.tsx","../src/domains/traces/components/span-payload/span-payload-primitives.tsx"],"sourcesContent":["import { SpanPayloadJson } from './span-payload-json';\nimport { SpanPayloadField } from './span-payload-primitives';\nimport { getDelegatedTool, getDelegatedToolHref } from './span-payload-registry';\nimport { BadgeWrapper } from '@/domains/chat/components/badge-wrapper';\nimport { ActivityHeadline } from '@/ds/components/ai/activity';\nimport { presentTool } from '@/ds/components/ai/tool-call/tool-presentation';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { useLinkComponent } from '@/lib/framework';\n\nconst isRecord = (value: unknown): value is Record<string, unknown> =>\n  typeof value === 'object' && value !== null && !Array.isArray(value);\n\n/** A tool name in a key/value list, linked to its page when the tool is a workflow or sub-agent. */\nexport function SpanToolNameValue({ toolName }: { toolName: string }) {\n  const { Link, paths } = useLinkComponent();\n  const href = getDelegatedToolHref(paths, toolName);\n  if (!href) return <DataKeysAndValues.Value>{toolName}</DataKeysAndValues.Value>;\n  return (\n    <DataKeysAndValues.ValueLink href={href} as={Link}>\n      {toolName}\n    </DataKeysAndValues.ValueLink>\n  );\n}\n\nexport function SpanPayloadTool({ value }: { value: unknown }) {\n  const { Link, paths } = useLinkComponent();\n  if (!isRecord(value)) return <SpanPayloadJson value={value} />;\n  const call = value.type === 'tool-invocation' ? value.toolInvocation : value;\n  if (!isRecord(call) || typeof call.toolName !== 'string' || !call.toolName) {\n    return <SpanPayloadJson value={value} />;\n  }\n  const input = 'args' in call ? call.args : call.input;\n  const output = 'result' in call ? call.result : call.output;\n  const error = call.isError === true || call.state === 'output-error';\n  const errorText = typeof call.errorText === 'string' ? call.errorText : undefined;\n  const { icon: ToolIcon, label, detail, description } = presentTool(call.toolName, input);\n  const delegated = getDelegatedTool(call.toolName);\n  // The header toggles the body, so the workflow or agent link sits in the body rather than in it.\n  const delegatedHref = getDelegatedToolHref(paths, call.toolName);\n  const hasBody = Boolean(delegatedHref) || input !== undefined || output !== undefined || errorText !== undefined;\n  return (\n    <div data-slot=\"span-payload-tool\" className=\"flex flex-col gap-2\">\n      <BadgeWrapper\n        status={error ? 'error' : 'idle'}\n        header={\n          <ActivityHeadline icon={<ToolIcon aria-hidden />} label={label} detail={detail} description={description} />\n        }\n      >\n        {hasBody && (\n          <div className=\"flex flex-col gap-3\">\n            {delegated && delegatedHref && (\n              <DataKeysAndValues>\n                <DataKeysAndValues.Key>{delegated.kind === 'workflow' ? 'Workflow' : 'Agent'}</DataKeysAndValues.Key>\n                <DataKeysAndValues.ValueLink href={delegatedHref} as={Link}>\n                  {delegated.key}\n                </DataKeysAndValues.ValueLink>\n              </DataKeysAndValues>\n            )}\n            {input !== undefined && (\n              <SpanPayloadField label=\"Arguments\">\n                <SpanPayloadJson value={input} />\n              </SpanPayloadField>\n            )}\n            {output !== undefined && (\n              <SpanPayloadField label=\"Result\">\n                <SpanPayloadJson value={output} />\n              </SpanPayloadField>\n            )}\n            {errorText !== undefined && (\n              <SpanPayloadField label=\"Error\">\n                <SpanPayloadJson value={errorText} />\n              </SpanPayloadField>\n            )}\n          </div>\n        )}\n      </BadgeWrapper>\n    </div>\n  );\n}\n","import type { ReactNode } from 'react';\nimport { SpanPayloadTool } from './span-payload-tool';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { DisclosureChevron } from '@/ds/components/DisclosureChevron';\nimport { MarkdownRenderer } from '@/ds/components/MarkdownRenderer';\nimport { ScrollArea } from '@/ds/components/ScrollArea';\nimport { Txt } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\n/** Small-caps label above a field of a rich payload. */\nexport function SpanPayloadLabel({ children }: { children: ReactNode }) {\n  return (\n    <Txt as=\"span\" variant=\"meta\" tone=\"faint\" className=\"block uppercase\">\n      {children}\n    </Txt>\n  );\n}\n\nexport function SpanPayloadField({ label, children }: { label: ReactNode; children: ReactNode }) {\n  return (\n    <div data-slot=\"span-payload-field\" className=\"flex flex-col gap-1.5\">\n      <SpanPayloadLabel>{label}</SpanPayloadLabel>\n      {children}\n    </div>\n  );\n}\n\nexport function SpanPayloadMarkdown({ children }: { children: string }) {\n  return (\n    <div data-slot=\"span-payload-markdown\" className=\"text-foreground\">\n      <MarkdownRenderer>{children}</MarkdownRenderer>\n    </div>\n  );\n}\n\n/** A collapsed block for secondary data (reasoning, steps, warnings…). */\nexport function SpanPayloadCollapsible({\n  label,\n  children,\n  defaultOpen = false,\n}: {\n  label: ReactNode;\n  children: ReactNode;\n  defaultOpen?: boolean;\n}) {\n  return (\n    <Collapsible defaultOpen={defaultOpen}>\n      <CollapsibleTrigger className=\"flex items-center gap-1 text-meta text-placeholder uppercase\">\n        <DisclosureChevron direction=\"right\" className=\"size-3\" />\n        {label}\n      </CollapsibleTrigger>\n      <CollapsibleContent className=\"pt-1.5\">{children}</CollapsibleContent>\n    </Collapsible>\n  );\n}\n\nexport interface SpanPayloadListItem {\n  key: string;\n  /** The item name, a link when it has a page to open. */\n  name: ReactNode;\n  description?: string;\n}\n\n/**\n * A scrollable list of named items with an optional description (tools, skills…). The scrollbar\n * stays visible while the list overflows, so readers can tell there are more items below.\n * `card` frames it on its own surface, for a list that stands alone in a section.\n */\nexport function SpanPayloadList({ items, slot, card }: { items: SpanPayloadListItem[]; slot: string; card?: boolean }) {\n  return (\n    <ScrollArea\n      maxHeight=\"12rem\"\n      alwaysShowScrollbar\n      className={cn(card && cn(raisedSurfaceStyle, 'rounded-lg [--scroll-area-scrollbar-inset:0.5rem]'))}\n    >\n      <ul data-slot={slot} className={cn('flex flex-col gap-2', card ? 'p-3 pr-4' : 'pr-3')}>\n        {items.map(item => (\n          <li key={item.key} className=\"flex min-w-0 flex-col\">\n            {item.name}\n            {item.description && (\n              // Payload content reads in ink like the messages around it; grey is kept for the labels.\n              <Txt as=\"span\" variant=\"body-sm\" className=\"line-clamp-2\" title={item.description}>\n                {item.description}\n              </Txt>\n            )}\n          </li>\n        ))}\n      </ul>\n    </ScrollArea>\n  );\n}\n\n/** A list item name rendered as plain text. */\nexport function SpanPayloadListName({ children }: { children: string }) {\n  return (\n    <Txt as=\"span\" variant=\"label\" tone=\"ink\" className=\"truncate\">\n      {children}\n    </Txt>\n  );\n}\n\n/** Tool calls as core records them: `{ toolName, args | input }` when they have that shape, JSON otherwise. */\nexport function SpanPayloadToolCalls({ toolCalls }: { toolCalls: unknown[] }) {\n  return (\n    <ul data-slot=\"span-payload-tool-calls\" className=\"flex flex-col gap-2\">\n      {toolCalls.map((call, index) => (\n        <li key={index}>\n          <SpanPayloadTool value={call} />\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"span-payload-primitives-D4tHWN2W.cjs","names":["useLinkComponent","getDelegatedToolHref","DataKeysAndValues","SpanPayloadJson","presentTool","getDelegatedTool","BadgeWrapper","ActivityHeadline","Txt","MarkdownRenderer","Collapsible","CollapsibleTrigger","DisclosureChevron","CollapsibleContent","ScrollArea","cn"],"sources":["../src/domains/traces/components/span-payload/span-payload-tool.tsx","../src/domains/traces/components/span-payload/span-payload-primitives.tsx"],"sourcesContent":["import { SpanPayloadJson } from './span-payload-json';\nimport { SpanPayloadField } from './span-payload-primitives';\nimport { getDelegatedTool, getDelegatedToolHref } from './span-payload-registry';\nimport { BadgeWrapper } from '@/domains/chat/components/badge-wrapper';\nimport { ActivityHeadline } from '@/ds/components/ai/activity';\nimport { presentTool } from '@/ds/components/ai/tool-call/tool-presentation';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { useLinkComponent } from '@/lib/framework';\n\nconst isRecord = (value: unknown): value is Record<string, unknown> =>\n  typeof value === 'object' && value !== null && !Array.isArray(value);\n\n/** A tool name in a key/value list, linked to its page when the tool is a workflow or sub-agent. */\nexport function SpanToolNameValue({ toolName }: { toolName: string }) {\n  const { Link, paths } = useLinkComponent();\n  const href = getDelegatedToolHref(paths, toolName);\n  if (!href) return <DataKeysAndValues.Value>{toolName}</DataKeysAndValues.Value>;\n  return (\n    <DataKeysAndValues.ValueLink href={href} as={Link}>\n      {toolName}\n    </DataKeysAndValues.ValueLink>\n  );\n}\n\nexport function SpanPayloadTool({ value }: { value: unknown }) {\n  const { Link, paths } = useLinkComponent();\n  if (!isRecord(value)) return <SpanPayloadJson value={value} />;\n  const call = value.type === 'tool-invocation' ? value.toolInvocation : value;\n  if (!isRecord(call) || typeof call.toolName !== 'string' || !call.toolName) {\n    return <SpanPayloadJson value={value} />;\n  }\n  const input = 'args' in call ? call.args : call.input;\n  const output = 'result' in call ? call.result : call.output;\n  const error = call.isError === true || call.state === 'output-error';\n  const errorText = typeof call.errorText === 'string' ? call.errorText : undefined;\n  const { icon: ToolIcon, label, detail, description } = presentTool(call.toolName, input);\n  const delegated = getDelegatedTool(call.toolName);\n  // The header toggles the body, so the workflow or agent link sits in the body rather than in it.\n  const delegatedHref = getDelegatedToolHref(paths, call.toolName);\n  const hasBody = Boolean(delegatedHref) || input !== undefined || output !== undefined || errorText !== undefined;\n  return (\n    <div data-slot=\"span-payload-tool\" className=\"flex flex-col gap-2\">\n      <BadgeWrapper\n        status={error ? 'error' : 'idle'}\n        header={\n          <ActivityHeadline icon={<ToolIcon aria-hidden />} label={label} detail={detail} description={description} />\n        }\n      >\n        {hasBody && (\n          <div className=\"flex flex-col gap-3\">\n            {delegated && delegatedHref && (\n              <DataKeysAndValues>\n                <DataKeysAndValues.Key>{delegated.kind === 'workflow' ? 'Workflow' : 'Agent'}</DataKeysAndValues.Key>\n                <DataKeysAndValues.ValueLink href={delegatedHref} as={Link}>\n                  {delegated.key}\n                </DataKeysAndValues.ValueLink>\n              </DataKeysAndValues>\n            )}\n            {input !== undefined && (\n              <SpanPayloadField label=\"Arguments\">\n                <SpanPayloadJson value={input} />\n              </SpanPayloadField>\n            )}\n            {output !== undefined && (\n              <SpanPayloadField label=\"Result\">\n                <SpanPayloadJson value={output} />\n              </SpanPayloadField>\n            )}\n            {errorText !== undefined && (\n              <SpanPayloadField label=\"Error\">\n                <SpanPayloadJson value={errorText} />\n              </SpanPayloadField>\n            )}\n          </div>\n        )}\n      </BadgeWrapper>\n    </div>\n  );\n}\n","import type { ReactNode } from 'react';\nimport { SpanPayloadTool } from './span-payload-tool';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { DisclosureChevron } from '@/ds/components/DisclosureChevron';\nimport { MarkdownRenderer } from '@/ds/components/MarkdownRenderer';\nimport { ScrollArea } from '@/ds/components/ScrollArea';\nimport { Txt } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\n/** Small-caps label above a field of a rich payload. */\nexport function SpanPayloadLabel({ children }: { children: ReactNode }) {\n  return (\n    <Txt as=\"span\" variant=\"meta\" tone=\"faint\" className=\"block uppercase\">\n      {children}\n    </Txt>\n  );\n}\n\nexport function SpanPayloadField({ label, children }: { label: ReactNode; children: ReactNode }) {\n  return (\n    <div data-slot=\"span-payload-field\" className=\"flex flex-col gap-1.5\">\n      <SpanPayloadLabel>{label}</SpanPayloadLabel>\n      {children}\n    </div>\n  );\n}\n\nexport function SpanPayloadMarkdown({ children }: { children: string }) {\n  return (\n    <div data-slot=\"span-payload-markdown\" className=\"text-foreground\">\n      <MarkdownRenderer>{children}</MarkdownRenderer>\n    </div>\n  );\n}\n\n/** A collapsed block for secondary data (reasoning, steps, warnings…). */\nexport function SpanPayloadCollapsible({\n  label,\n  children,\n  defaultOpen = false,\n}: {\n  label: ReactNode;\n  children: ReactNode;\n  defaultOpen?: boolean;\n}) {\n  return (\n    <Collapsible defaultOpen={defaultOpen}>\n      <CollapsibleTrigger className=\"flex items-center gap-1 text-meta text-placeholder uppercase\">\n        <DisclosureChevron direction=\"right\" className=\"size-3\" />\n        {label}\n      </CollapsibleTrigger>\n      <CollapsibleContent className=\"pt-1.5\">{children}</CollapsibleContent>\n    </Collapsible>\n  );\n}\n\nexport interface SpanPayloadListItem {\n  key: string;\n  /** The item name, a link when it has a page to open. */\n  name: ReactNode;\n  description?: string;\n}\n\n/**\n * A scrollable list of named items with an optional description (tools, skills…). The scrollbar\n * stays visible while the list overflows, so readers can tell there are more items below.\n * `card` frames it on its own surface, for a list that stands alone in a section.\n */\nexport function SpanPayloadList({ items, slot, card }: { items: SpanPayloadListItem[]; slot: string; card?: boolean }) {\n  return (\n    <ScrollArea\n      maxHeight=\"12rem\"\n      alwaysShowScrollbar\n      className={cn(card && cn(raisedSurfaceStyle, 'rounded-lg [--scroll-area-scrollbar-inset:0.5rem]'))}\n    >\n      <ul data-slot={slot} className={cn('flex flex-col gap-2', card ? 'p-3 pr-4' : 'pr-3')}>\n        {items.map(item => (\n          <li key={item.key} className=\"flex min-w-0 flex-col\">\n            {item.name}\n            {item.description && (\n              // Payload content reads in ink like the messages around it; grey is kept for the labels.\n              <Txt as=\"span\" variant=\"body-sm\" className=\"line-clamp-2\" title={item.description}>\n                {item.description}\n              </Txt>\n            )}\n          </li>\n        ))}\n      </ul>\n    </ScrollArea>\n  );\n}\n\n/** A list item name rendered as plain text. */\nexport function SpanPayloadListName({ children }: { children: string }) {\n  return (\n    <Txt as=\"span\" variant=\"label\" tone=\"ink\" className=\"truncate\">\n      {children}\n    </Txt>\n  );\n}\n\n/** Tool calls as core records them: `{ toolName, args | input }` when they have that shape, JSON otherwise. */\nexport function SpanPayloadToolCalls({ toolCalls }: { toolCalls: unknown[] }) {\n  return (\n    <ul data-slot=\"span-payload-tool-calls\" className=\"flex flex-col gap-2\">\n      {toolCalls.map((call, index) => (\n        <li key={index}>\n          <SpanPayloadTool value={call} />\n        </li>\n      ))}\n    </ul>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AASA,IAAM,YAAY,UAChB,OAAO,UAAU,YAAY,UAAU,QAAQ,CAAC,MAAM,QAAQ,KAAK;;AAGrE,SAAgB,kBAAkB,EAAE,YAAkC;CACpE,MAAM,EAAE,MAAM,UAAUA,sBAAAA,iBAAiB;CACzC,MAAM,OAAOC,qEAAAA,qBAAqB,OAAO,QAAQ;CACjD,IAAI,CAAC,MAAM,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,0BAAAA,kBAAkB,OAAnB,EAAA,UAA0B,SAAkC,CAAA;CAC9E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,0BAAAA,kBAAkB,WAAnB;EAAmC;EAAM,IAAI;EAC1C,UAAA;CAC0B,CAAA;AAEjC;AAEA,SAAgB,gBAAgB,EAAE,SAA6B;CAC7D,MAAM,EAAE,MAAM,UAAUF,sBAAAA,iBAAiB;CACzC,IAAI,CAAC,SAAS,KAAK,GAAG,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACG,iEAAAA,iBAAD,EAAwB,MAAQ,CAAA;CAC7D,MAAM,OAAO,MAAM,SAAS,oBAAoB,MAAM,iBAAiB;CACvE,IAAI,CAAC,SAAS,IAAI,KAAK,OAAO,KAAK,aAAa,YAAY,CAAC,KAAK,UAChE,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACA,iEAAAA,iBAAD,EAAwB,MAAQ,CAAA;CAEzC,MAAM,QAAQ,UAAU,OAAO,KAAK,OAAO,KAAK;CAChD,MAAM,SAAS,YAAY,OAAO,KAAK,SAAS,KAAK;CACrD,MAAM,QAAQ,KAAK,YAAY,QAAQ,KAAK,UAAU;CACtD,MAAM,YAAY,OAAO,KAAK,cAAc,WAAW,KAAK,YAAY,KAAA;CACxE,MAAM,EAAE,MAAM,UAAU,OAAO,QAAQ,gBAAgBC,0BAAAA,YAAY,KAAK,UAAU,KAAK;CACvF,MAAM,YAAYC,qEAAAA,iBAAiB,KAAK,QAAQ;CAEhD,MAAM,gBAAgBJ,qEAAAA,qBAAqB,OAAO,KAAK,QAAQ;CAE/D,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EAAK,aAAU;EAAoB,WAAU;EAC3C,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACK,8CAAAA,cAAD;GACE,QAAQ,QAAQ,UAAU;GAC1B,QACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,iBAAAA,kBAAD;IAAkB,MAAM,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD,EAAU,eAAA,KAAa,CAAA;IAAU;IAAe;IAAqB;GAAc,CAAA;GAG5G,WATS,QAAQ,aAAa,KAAK,UAAU,KAAA,KAAa,WAAW,KAAA,KAAa,cAAc,KAAA,MAU/F,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACG,aAAa,iBACZ,iBAAA,GAAA,kBAAA,KAAA,CAACL,0BAAAA,mBAAD,EAAA,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,0BAAAA,kBAAkB,KAAnB,EAAA,UAAwB,UAAU,SAAS,aAAa,aAAa,QAA+B,CAAA,GACpG,iBAAA,GAAA,kBAAA,IAAA,CAACA,0BAAAA,kBAAkB,WAAnB;MAA6B,MAAM;MAAe,IAAI;MACnD,UAAA,UAAU;KACgB,CAAA,CACZ,EAAA,CAAA;KAEpB,UAAU,KAAA,KACT,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;MAAkB,OAAM;MACtB,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,iEAAAA,iBAAD,EAAiB,OAAO,MAAQ,CAAA;KAChB,CAAA;KAEnB,WAAW,KAAA,KACV,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;MAAkB,OAAM;MACtB,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACA,iEAAAA,iBAAD,EAAiB,OAAO,OAAS,CAAA;KACjB,CAAA;KAEnB,cAAc,KAAA,KACb,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;MAAkB,OAAM;MACtB,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACA,iEAAAA,iBAAD,EAAiB,OAAO,UAAY,CAAA;KACpB,CAAA;IAEjB;;EAEK,CAAA;CACX,CAAA;AAET;;;ACnEA,SAAgB,iBAAiB,EAAE,YAAqC;CACtE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACK,YAAAA,KAAD;EAAK,IAAG;EAAO,SAAQ;EAAO,MAAK;EAAQ,WAAU;EAClD;CACE,CAAA;AAET;AAEA,SAAgB,iBAAiB,EAAE,OAAO,YAAuD;CAC/F,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,aAAU;EAAqB,WAAU;EAA9C,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD,EAAA,UAAmB,MAAwB,CAAA,GAC1C,QACE;;AAET;AAEA,SAAgB,oBAAoB,EAAE,YAAkC;CACtE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EAAK,aAAU;EAAwB,WAAU;EAC/C,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,yBAAAA,kBAAD,EAAmB,SAA2B,CAAA;CAC3C,CAAA;AAET;;AAGA,SAAgB,uBAAuB,EACrC,OACA,UACA,cAAc,SAKb;CACD,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,+BAAAA,aAAD;EAA0B;EAA1B,UAAA,CACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,+BAAAA,oBAAD;GAAoB,WAAU;GAA9B,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,qCAAAA,mBAAD;IAAmB,WAAU;IAAQ,WAAU;GAAU,CAAA,GACxD,KACiB;EACpB,CAAA,GAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,+BAAAA,oBAAD;GAAoB,WAAU;GAAU;EAA6B,CAAA,CAC1D;;AAEjB;;;;;;AAcA,SAAgB,gBAAgB,EAAE,OAAO,MAAM,QAAwE;CACrH,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,oBAAAA,YAAD;EACE,WAAU;EACV,qBAAA;EACA,WAAWC,cAAAA,GAAG,QAAQA,cAAAA,GAAAA,6KAAuB,mDAAmD,CAAC;EAEjG,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD;GAAI,aAAW;GAAM,WAAWA,cAAAA,GAAG,uBAAuB,OAAO,aAAa,MAAM;GACjF,UAAA,MAAM,KAAI,SACT,iBAAA,GAAA,kBAAA,KAAA,CAAC,MAAD;IAAmB,WAAU;IAA7B,UAAA,CACG,KAAK,MACL,KAAK,eAEJ,iBAAA,GAAA,kBAAA,IAAA,CAACP,YAAAA,KAAD;KAAK,IAAG;KAAO,SAAQ;KAAU,WAAU;KAAe,OAAO,KAAK;KACnE,UAAA,KAAK;IACH,CAAA,CAEL;GARK,GAAA,KAAK,GAQV,CACL;EACC,CAAA;CACM,CAAA;AAEhB;;AAGA,SAAgB,oBAAoB,EAAE,YAAkC;CACtE,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,YAAAA,KAAD;EAAK,IAAG;EAAO,SAAQ;EAAQ,MAAK;EAAM,WAAU;EACjD;CACE,CAAA;AAET;;AAGA,SAAgB,qBAAqB,EAAE,aAAuC;CAC5E,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD;EAAI,aAAU;EAA0B,WAAU;EAC/C,UAAA,UAAU,KAAK,MAAM,UACpB,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,iBAAD,EAAiB,OAAO,KAAO,CAAA,EAC7B,GAFK,KAEL,CACL;CACC,CAAA;AAER"}

package/dist/src/domains/chat/knowledge/knowledge-links.d.ts

@@ -1,21 +1,49 @@
 import type { ReactNode } from 'react';
+import type { KnowledgePageCardProps } from '../../knowledge/components/KnowledgePageCard';
 import type { LinkComponent } from '../../../lib/framework';
+/** Names the page a link points at: by id, or by reference the way `refHref` takes it. */
+export type KnowledgePageTarget = {
+    pageId: string;
+    pageRef?: never;
+} | {
+    pageRef: string;
+    pageId?: never;
+};
+/**
+ * What a hover card says about a page. Called, as a hook, only while a card is open, so a host fetches
+ * the page on hover and not for every link in the transcript. (Chat prose is the exception: a bare address
+ * in text calls it on render, since it links only if the page resolves.) `undefined` while loading or unreadable.
+ */
+export type UseKnowledgePagePreview = (target: KnowledgePageTarget) => KnowledgePageCardProps | undefined;
 interface KnowledgeLinks {
+    /** Left out where the host cannot look a page up; links then have no hover card. */
+    usePagePreview?: UseKnowledgePagePreview;
     /** Undefined when this host has no page to open, e.g. a chat outside any project; the name shows as text. */
     pageHref: (pageId: string) => string | undefined;
+    /**
+     * Where a page named by reference (a scope address, or `scope#key/path` as `knowledge_list` names
+     * entries) opens. Studio's Knowledge page resolves the reference itself, so it uses the page URL. A
+     * host that only opens pages by id leaves it out, and those names show as text.
+     */
+    refHref?: (ref: string) => string | undefined;
     Link?: LinkComponent;
+    /** Set by the provider: this host has Knowledge pages, so references in chat prose become links. */
+    provided?: boolean;
 }
 /**
  * Where Knowledge page links in chat (tool cards, pinned Knowledge) point. Studio's default opens its own
  * Knowledge page; a host with its own route (Factory's per-project page) or its own router passes both.
  */
-export declare function KnowledgeLinksProvider({ pageHref, Link, children }: KnowledgeLinks & {
+export declare function KnowledgeLinksProvider({ pageHref, refHref, Link, usePagePreview, children, }: Omit<KnowledgeLinks, 'provided'> & {
     children: ReactNode;
 }): import("react").JSX.Element;
+/** What the host gave the provider; for renderers that must decide before drawing a link. */
+export declare function useKnowledgeLinksContext(): KnowledgeLinks;
+/** Whether this host mounted a `KnowledgeLinksProvider`, i.e. has Knowledge pages chat prose can link to. */
+export declare function useHasKnowledgeLinks(): boolean;
 /** A link to a Knowledge page, through the host's link component and route. */
-export declare function KnowledgePageLink({ pageId, children, className, }: {
-    pageId: string;
+export declare function KnowledgePageLink({ pageId, pageRef, children, className, }: {
     children: ReactNode;
     className?: string;
-}): import("react").JSX.Element;
+} & KnowledgePageTarget): import("react").JSX.Element;
 export {};

package/dist/src/domains/chat/knowledge/pinned-knowledge-data.d.ts

@@ -6,6 +6,8 @@ export interface PinnedPage {
     /** From the pin itself on newer cores; read off the delivered text's `<name> (<id>): ` prefix on older ones. */
     name?: string;
     scope?: string;
+    /** For a pinned listing, the id of the page whose subtree it lists; the row links there. */
+    listOf?: string;
     /** What the agent was given for this pin, verbatim. */
     text?: string;
 }