@mastra/playground-ui 66.1.0-alpha.2 → 67.0.0

package/dist/domains/traces/components/trace-span-timeline-markers.es.js

@@ -0,0 +1,119 @@
+import { t as cn } from "../../../utils-DQx8TpNT.js";
+import { formatDuration } from "../../../utils/duration.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 { TIMELINE_TRACK_PADDING } from "../utils/span-timeline.es.js";
+import { SPAN_TREE_PAD_Y } from "./span-tree-rail.es.js";
+import { TimelineGridlines } from "./span-timeline-row.es.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { TimerIcon } from "lucide-react";
+// src/domains/traces/components/trace-span-timeline-markers.tsx
+var SUBGRID_PANEL_STYLE = {
+	gridColumn: "1 / -1",
+	display: "grid",
+	gridTemplateColumns: "subgrid"
+};
+/** A "Metrics" row, closed by default, revealing one row per streaming timing laid out like the span rows. */
+function TimelineTimingRows({ layout }) {
+	return /* @__PURE__ */ jsxs(Collapsible, {
+		className: "col-span-2 grid grid-cols-subgrid",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "col-span-2 grid grid-cols-subgrid items-stretch",
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "flex min-w-0 items-center pl-1",
+				style: { paddingBlock: SPAN_TREE_PAD_Y },
+				children: /* @__PURE__ */ jsxs(CollapsibleTrigger, {
+					className: "flex min-w-0 items-center rounded-sm text-muted-foreground",
+					children: [/* @__PURE__ */ jsx("span", {
+						"aria-hidden": true,
+						className: "flex shrink-0 items-center justify-center",
+						style: {
+							width: 24,
+							height: 20
+						},
+						children: /* @__PURE__ */ jsx(DisclosureChevron, {
+							direction: "right",
+							className: "size-3"
+						})
+					}), /* @__PURE__ */ jsx(Txt, {
+						as: "span",
+						variant: "body-sm",
+						className: "min-w-0 truncate px-2",
+						children: "Metrics"
+					})]
+				})
+			}), /* @__PURE__ */ jsx("div", {
+				className: cn("flex min-w-0", TIMELINE_TRACK_PADDING),
+				children: /* @__PURE__ */ jsx("div", {
+					className: "relative flex-1",
+					children: /* @__PURE__ */ jsx(TimelineGridlines, {})
+				})
+			})]
+		}), /* @__PURE__ */ jsxs(CollapsibleContent, {
+			style: SUBGRID_PANEL_STYLE,
+			className: "col-span-2 grid grid-cols-subgrid gap-y-px",
+			children: [/* @__PURE__ */ jsx(TimingRow, {
+				name: "Time to first chunk",
+				bar: layout.firstChunk
+			}), layout.firstToken && /* @__PURE__ */ jsx(TimingRow, {
+				name: "Time to first token",
+				bar: layout.firstToken
+			})]
+		})]
+	});
+}
+function TimingRow({ name, bar }) {
+	const { durationMs, leftPercent, widthPercent } = bar;
+	return /* @__PURE__ */ jsxs("div", {
+		role: "group",
+		"aria-label": name,
+		className: "col-span-2 grid grid-cols-subgrid items-stretch",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex min-w-0 items-center pl-1",
+			style: { paddingBlock: SPAN_TREE_PAD_Y },
+			children: [/* @__PURE__ */ jsx("span", {
+				"aria-hidden": true,
+				className: "flex shrink-0 items-center justify-center text-muted-foreground [&>svg]:size-3.5",
+				style: {
+					width: 24,
+					height: 20
+				},
+				children: /* @__PURE__ */ jsx(TimerIcon, {})
+			}), /* @__PURE__ */ jsx(Txt, {
+				as: "span",
+				variant: "body-sm",
+				tone: "muted",
+				className: "min-w-0 truncate px-2",
+				children: name
+			})]
+		}), /* @__PURE__ */ jsx("div", {
+			className: cn("flex min-w-0", TIMELINE_TRACK_PADDING),
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "relative flex-1",
+				children: [
+					/* @__PURE__ */ jsx(TimelineGridlines, {}),
+					/* @__PURE__ */ jsx("div", {
+						"data-testid": "streaming-timing-bar",
+						className: "absolute top-1/2 h-3 -translate-y-1/2 rounded-sm border border-dashed border-muted-foreground bg-fill-subtle",
+						style: {
+							left: `${leftPercent}%`,
+							width: widthPercent ? `${widthPercent}%` : "2px"
+						}
+					}),
+					/* @__PURE__ */ jsx(Txt, {
+						as: "span",
+						variant: "body-sm",
+						tone: "muted",
+						className: "absolute top-1/2 ml-1.5 -translate-y-1/2 whitespace-nowrap tabular-nums",
+						style: { left: `${leftPercent + widthPercent}%` },
+						children: formatDuration(durationMs)
+					})
+				]
+			})
+		})]
+	});
+}
+export { TimelineTimingRows };
+
+//# sourceMappingURL=trace-span-timeline-markers.es.js.map

package/dist/domains/traces/components/trace-span-timeline-markers.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"trace-span-timeline-markers.es.js","names":[],"sources":["../../../../src/domains/traces/components/trace-span-timeline-markers.tsx"],"sourcesContent":["import { TimerIcon } from 'lucide-react';\nimport { TIMELINE_TRACK_PADDING } from '../utils/span-timeline';\nimport type { TimelineMarkersLayout, TimelineTimingBar } from '../utils/timeline-markers';\nimport { TimelineGridlines } from './span-timeline-row';\nimport { SPAN_TREE_INDENT, SPAN_TREE_LINE, SPAN_TREE_PAD_Y } from './span-tree-rail';\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/ds/components/Collapsible';\nimport { DisclosureChevron } from '@/ds/components/DisclosureChevron';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\nimport { formatDuration } from '@/utils/duration';\n\n// The panel sits in the timeline grid, so it spans both columns and hands them down to the rows.\nconst SUBGRID_PANEL_STYLE = { gridColumn: '1 / -1', display: 'grid', gridTemplateColumns: 'subgrid' } as const;\n\n/** A \"Metrics\" row, closed by default, revealing one row per streaming timing laid out like the span rows. */\nexport function TimelineTimingRows({ layout }: { layout: TimelineMarkersLayout }) {\n  return (\n    <Collapsible className=\"col-span-2 grid grid-cols-subgrid\">\n      <div className=\"col-span-2 grid grid-cols-subgrid items-stretch\">\n        <div className=\"flex min-w-0 items-center pl-1\" style={{ paddingBlock: SPAN_TREE_PAD_Y }}>\n          <CollapsibleTrigger className=\"flex min-w-0 items-center rounded-sm text-muted-foreground\">\n            <span\n              aria-hidden\n              className=\"flex shrink-0 items-center justify-center\"\n              style={{ width: SPAN_TREE_INDENT, height: SPAN_TREE_LINE }}\n            >\n              <DisclosureChevron direction=\"right\" className=\"size-3\" />\n            </span>\n            <Txt as=\"span\" variant=\"body-sm\" className=\"min-w-0 truncate px-2\">\n              Metrics\n            </Txt>\n          </CollapsibleTrigger>\n        </div>\n        <div className={cn('flex min-w-0', TIMELINE_TRACK_PADDING)}>\n          <div className=\"relative flex-1\">\n            <TimelineGridlines />\n          </div>\n        </div>\n      </div>\n      <CollapsibleContent style={SUBGRID_PANEL_STYLE} className=\"col-span-2 grid grid-cols-subgrid gap-y-px\">\n        <TimingRow name=\"Time to first chunk\" bar={layout.firstChunk} />\n        {layout.firstToken && <TimingRow name=\"Time to first token\" bar={layout.firstToken} />}\n      </CollapsibleContent>\n    </Collapsible>\n  );\n}\n\nfunction TimingRow({ name, bar }: { name: string; bar: TimelineTimingBar }) {\n  const { durationMs, leftPercent, widthPercent } = bar;\n\n  return (\n    <div role=\"group\" aria-label={name} className=\"col-span-2 grid grid-cols-subgrid items-stretch\">\n      <div className=\"flex min-w-0 items-center pl-1\" style={{ paddingBlock: SPAN_TREE_PAD_Y }}>\n        <span\n          aria-hidden\n          className=\"flex shrink-0 items-center justify-center text-muted-foreground [&>svg]:size-3.5\"\n          style={{ width: SPAN_TREE_INDENT, height: SPAN_TREE_LINE }}\n        >\n          <TimerIcon />\n        </span>\n        <Txt as=\"span\" variant=\"body-sm\" tone=\"muted\" className=\"min-w-0 truncate px-2\">\n          {name}\n        </Txt>\n      </div>\n\n      <div className={cn('flex min-w-0', TIMELINE_TRACK_PADDING)}>\n        <div className=\"relative flex-1\">\n          <TimelineGridlines />\n          <div\n            data-testid=\"streaming-timing-bar\"\n            className=\"absolute top-1/2 h-3 -translate-y-1/2 rounded-sm border border-dashed border-muted-foreground bg-fill-subtle\"\n            style={{ left: `${leftPercent}%`, width: widthPercent ? `${widthPercent}%` : '2px' }}\n          />\n          <Txt\n            as=\"span\"\n            variant=\"body-sm\"\n            tone=\"muted\"\n            className=\"absolute top-1/2 ml-1.5 -translate-y-1/2 whitespace-nowrap tabular-nums\"\n            style={{ left: `${leftPercent + widthPercent}%` }}\n          >\n            {formatDuration(durationMs)}\n          </Txt>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAYA,IAAM,sBAAsB;CAAE,YAAY;CAAU,SAAS;CAAQ,qBAAqB;AAAU;;AAGpG,SAAgB,mBAAmB,EAAE,UAA6C;CAChF,OACE,qBAAC,aAAD;EAAa,WAAU;EAAvB,UAAA,CACE,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACE,oBAAC,OAAD;IAAK,WAAU;IAAiC,OAAO,EAAE,cAAc,gBAAgB;IACrF,UAAA,qBAAC,oBAAD;KAAoB,WAAU;KAA9B,UAAA,CACE,oBAAC,QAAD;MACE,eAAA;MACA,WAAU;MACV,OAAO;OAAE,OAAA;OAAyB,QAAA;MAAuB;MAEzD,UAAA,oBAAC,mBAAD;OAAmB,WAAU;OAAQ,WAAU;MAAU,CAAA;KACrD,CAAA,GACN,oBAAC,KAAD;MAAK,IAAG;MAAO,SAAQ;MAAU,WAAU;MAAwB,UAAA;KAE9D,CAAA,CACa;;GACjB,CAAA,GACL,oBAAC,OAAD;IAAK,WAAW,GAAG,gBAAgB,sBAAsB;IACvD,UAAA,oBAAC,OAAD;KAAK,WAAU;KACb,UAAA,oBAAC,mBAAD,CAAoB,CAAA;IACjB,CAAA;GACF,CAAA,CACF;EACL,CAAA,GAAA,qBAAC,oBAAD;GAAoB,OAAO;GAAqB,WAAU;GAA1D,UAAA,CACE,oBAAC,WAAD;IAAW,MAAK;IAAsB,KAAK,OAAO;GAAa,CAAA,GAC9D,OAAO,cAAc,oBAAC,WAAD;IAAW,MAAK;IAAsB,KAAK,OAAO;GAAa,CAAA,CACnE;EACT,CAAA,CAAA;;AAEjB;AAEA,SAAS,UAAU,EAAE,MAAM,OAAiD;CAC1E,MAAM,EAAE,YAAY,aAAa,iBAAiB;CAElD,OACE,qBAAC,OAAD;EAAK,MAAK;EAAQ,cAAY;EAAM,WAAU;EAA9C,UAAA,CACE,qBAAC,OAAD;GAAK,WAAU;GAAiC,OAAO,EAAE,cAAc,gBAAgB;GAAvF,UAAA,CACE,oBAAC,QAAD;IACE,eAAA;IACA,WAAU;IACV,OAAO;KAAE,OAAA;KAAyB,QAAA;IAAuB;IAEzD,UAAA,oBAAC,WAAD,CAAY,CAAA;GACR,CAAA,GACN,oBAAC,KAAD;IAAK,IAAG;IAAO,SAAQ;IAAU,MAAK;IAAQ,WAAU;IACrD,UAAA;GACE,CAAA,CACF;EAEL,CAAA,GAAA,oBAAC,OAAD;GAAK,WAAW,GAAG,gBAAgB,sBAAsB;GACvD,UAAA,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,oBAAC,mBAAD,CAAoB,CAAA;KACpB,oBAAC,OAAD;MACE,eAAY;MACZ,WAAU;MACV,OAAO;OAAE,MAAM,GAAG,YAAY;OAAI,OAAO,eAAe,GAAG,aAAa,KAAK;MAAM;KACpF,CAAA;KACD,oBAAC,KAAD;MACE,IAAG;MACH,SAAQ;MACR,MAAK;MACL,WAAU;MACV,OAAO,EAAE,MAAM,GAAG,cAAc,aAAa,GAAG;MAE/C,UAAA,eAAe,UAAU;KACvB,CAAA;IACF;;EACF,CAAA,CACF;;AAET"}

package/dist/domains/traces/components/trace-span-timeline.cjs.js

@@ -6,9 +6,10 @@ const require_domains_traces_components_span_rows = require("./span-rows.cjs.js"
 const require_domains_traces_utils_span_timeline = require("../utils/span-timeline.cjs.js");
 const require_domains_traces_components_trace_span_tree = require("./trace-span-tree.cjs.js");
 const require_domains_traces_components_span_timeline_row = require("./span-timeline-row.cjs.js");
+const require_domains_traces_utils_timeline_markers = require("../utils/timeline-markers.cjs.js");
+const require_domains_traces_components_trace_span_timeline_markers = require("./trace-span-timeline-markers.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/traces/components/trace-span-timeline.tsx
-/** Axis ticks are approximate gridline marks, so two decimals are enough: `250 ms`, `3.74 s`. */
 function formatTick(durationMs) {
 	return durationMs < 1e3 ? `${Math.round(durationMs)} ms` : `${(durationMs / 1e3).toFixed(2)} s`;
 }
@@ -17,18 +18,19 @@ function formatTick(durationMs) {
 * but each row is a compact name cell plus a bar on a shared time axis. Rendered with its
 * own row component (`SpanTimelineRow`), independent from the tree's rows.
 */
-function TraceSpanTimeline({ hierarchicalSpans = [], onSpanClick, selectedSpanId, isLoading, fadedTypes, expandedSpanIds, setExpandedSpanIds, featuredSpanIds, revealSpanId, leadingSlot }) {
+function TraceSpanTimeline({ hierarchicalSpans = [], onSpanClick, selectedSpanId, isLoading, fadedTypes, expandedSpanIds, setExpandedSpanIds, featuredSpanIds, revealSpanId, leadingSlot, streamingTimings }) {
 	if (isLoading) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_traces_components_trace_span_tree.TraceSpanTreeLoading, {});
 	const overallLatency = require_domains_traces_utils_span_timing.getOverallLatency(hierarchicalSpans);
+	const markers = require_domains_traces_utils_timeline_markers.getTimelineMarkersLayout(hierarchicalSpans, overallLatency, streamingTimings);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [leadingSlot, /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 		className: "grid grid-cols-[minmax(12rem,2fr)_minmax(12rem,3fr)] content-start gap-y-px overflow-hidden py-1",
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				"aria-label": "Trace time axis",
-				className: require_utils.cn("flex", require_domains_traces_utils_span_timeline.TIMELINE_TRACK_PADDING),
+				className: require_domains_traces_utils_span_timeline.TIMELINE_TRACK_PADDING,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: "relative h-6 flex-1 tabular-nums",
+					"aria-label": "Trace time axis",
+					className: "relative h-6 tabular-nums",
 					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_traces_components_span_timeline_row.TimelineGridlines, {}), require_domains_traces_utils_span_timeline.TIMELINE_TICKS.map((tick, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Txt.Txt, {
 						tone: "muted",
 						as: "span",
@@ -39,6 +41,7 @@ function TraceSpanTimeline({ hierarchicalSpans = [], onSpanClick, selectedSpanId
 					}, tick))]
 				})
 			}),
+			markers && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_traces_components_trace_span_timeline_markers.TimelineTimingRows, { layout: markers }),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_traces_components_span_rows.SpanRows, {
 				spans: hierarchicalSpans,
 				onSpanClick,

package/dist/domains/traces/components/trace-span-timeline.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-span-timeline.cjs.js","names":["TraceSpanTreeLoading","getOverallLatency","_Fragment","cn","TIMELINE_TRACK_PADDING","TimelineGridlines","TIMELINE_TICKS","Txt","SpanRows","SpanTimelineRow"],"sources":["../../../../src/domains/traces/components/trace-span-timeline.tsx"],"sourcesContent":["import type { Dispatch, ReactNode, SetStateAction } from 'react';\nimport type { UISpan } from '../types';\nimport { TIMELINE_TICKS, TIMELINE_TRACK_PADDING } from '../utils/span-timeline';\nimport { getOverallLatency } from '../utils/span-timing';\nimport { SpanRows } from './span-rows';\nimport { SpanTimelineRow, TimelineGridlines } from './span-timeline-row';\nimport { TraceSpanTreeLoading } from './trace-span-tree';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\n/** Axis ticks are approximate gridline marks, so two decimals are enough: `250 ms`, `3.74 s`. */\nfunction formatTick(durationMs: number) {\n  return durationMs < 1_000 ? `${Math.round(durationMs)} ms` : `${(durationMs / 1_000).toFixed(2)} s`;\n}\n\nexport type TraceSpanTimelineProps = {\n  hierarchicalSpans: UISpan[];\n  onSpanClick: (id: string) => void;\n  selectedSpanId?: string;\n  isLoading?: boolean;\n  fadedTypes?: string[];\n  expandedSpanIds?: string[];\n  setExpandedSpanIds?: Dispatch<SetStateAction<string[]>>;\n  featuredSpanIds?: string[];\n  /** Row scrolled into view once it is mounted (ancestors auto-expand when the span is featured). */\n  revealSpanId?: string;\n  /** Rendered full-width above the span rows. */\n  leadingSlot?: ReactNode;\n};\n\n/**\n * Gantt-style view of a trace: the same hierarchy and expansion state as `TraceSpanTree`,\n * but each row is a compact name cell plus a bar on a shared time axis. Rendered with its\n * own row component (`SpanTimelineRow`), independent from the tree's rows.\n */\nexport function TraceSpanTimeline({\n  hierarchicalSpans = [],\n  onSpanClick,\n  selectedSpanId,\n  isLoading,\n  fadedTypes,\n  expandedSpanIds,\n  setExpandedSpanIds,\n  featuredSpanIds,\n  revealSpanId,\n  leadingSlot,\n}: TraceSpanTimelineProps) {\n  if (isLoading) return <TraceSpanTreeLoading />;\n\n  const overallLatency = getOverallLatency(hierarchicalSpans);\n\n  return (\n    <>\n      {leadingSlot}\n      <div className=\"grid grid-cols-[minmax(12rem,2fr)_minmax(12rem,3fr)] content-start gap-y-px overflow-hidden py-1\">\n        {/* Header row: empty name cell, then the axis on the same track as the bars. */}\n        <div />\n        <div aria-label=\"Trace time axis\" className={cn('flex', TIMELINE_TRACK_PADDING)}>\n          <div className=\"relative h-6 flex-1 tabular-nums\">\n            <TimelineGridlines />\n            {TIMELINE_TICKS.map((tick, index) => (\n              <Txt\n                tone=\"muted\"\n                as=\"span\"\n                variant=\"meta\"\n                key={tick}\n                style={{ left: `${tick * 100}%` }}\n                // Each label sits just after its gridline; the last one lands in the track's right padding.\n                className={cn(\n                  'absolute top-0.5 px-1.5 whitespace-nowrap',\n                  index > 0 && index < TIMELINE_TICKS.length - 1 && 'hidden sm:inline',\n                )}\n              >\n                {formatTick(overallLatency * tick)}\n              </Txt>\n            ))}\n          </div>\n        </div>\n        <SpanRows\n          spans={hierarchicalSpans}\n          onSpanClick={onSpanClick}\n          selectedSpanId={selectedSpanId}\n          revealSpanId={revealSpanId}\n          fadedTypes={fadedTypes}\n          featuredSpanIds={featuredSpanIds}\n          expandedSpanIds={expandedSpanIds}\n          setExpandedSpanIds={setExpandedSpanIds}\n          renderRow={ctx => <SpanTimelineRow ctx={ctx} />}\n        />\n      </div>\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAWA,SAAS,WAAW,YAAoB;CACtC,OAAO,aAAa,MAAQ,GAAG,KAAK,MAAM,UAAU,EAAE,OAAO,IAAI,aAAa,IAAA,CAAO,QAAQ,CAAC,EAAE;AAClG;;;;;;AAsBA,SAAgB,kBAAkB,EAChC,oBAAoB,CAAC,GACrB,aACA,gBACA,WACA,YACA,iBACA,oBACA,iBACA,cACA,eACyB;CACzB,IAAI,WAAW,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACA,kDAAAA,sBAAD,CAAuB,CAAA;CAE7C,MAAM,iBAAiBC,yCAAAA,kBAAkB,iBAAiB;CAE1D,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAAC,kBAAAA,UAAA,EAAA,UAAA,CACG,aACD,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GAEE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD,CAAM,CAAA;GACN,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IAAK,cAAW;IAAkB,WAAWC,cAAAA,GAAG,QAAQC,2CAAAA,sBAAsB;IAC5E,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,oDAAAA,mBAAD,CAAoB,CAAA,GACnBC,2CAAAA,eAAe,KAAK,MAAM,UACzB,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;MACE,MAAK;MACL,IAAG;MACH,SAAQ;MAER,OAAO,EAAE,MAAM,GAAG,OAAO,IAAI,GAAG;MAEhC,WAAWJ,cAAAA,GACT,6CACA,QAAQ,KAAK,QAAQG,2CAAAA,eAAe,SAAS,KAAK,kBACpD;MAEC,UAAA,WAAW,iBAAiB,IAAI;KAC9B,GATE,IASF,CACN,CACE;;GACF,CAAA;GACL,iBAAA,GAAA,kBAAA,IAAA,CAACE,4CAAAA,UAAD;IACE,OAAO;IACM;IACG;IACF;IACF;IACK;IACA;IACG;IACpB,YAAW,QAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,oDAAAA,iBAAD,EAAsB,IAAM,CAAA;GAC/C,CAAA;EACE;CACL,CAAA,CAAA,EAAA,CAAA;AAEN"}
+{"version":3,"file":"trace-span-timeline.cjs.js","names":["TraceSpanTreeLoading","getOverallLatency","getTimelineMarkersLayout","_Fragment","TIMELINE_TRACK_PADDING","TimelineGridlines","TIMELINE_TICKS","Txt","cn","TimelineTimingRows","SpanRows","SpanTimelineRow"],"sources":["../../../../src/domains/traces/components/trace-span-timeline.tsx"],"sourcesContent":["import type { Dispatch, ReactNode, SetStateAction } from 'react';\nimport type { UISpan } from '../types';\nimport { TIMELINE_TICKS, TIMELINE_TRACK_PADDING } from '../utils/span-timeline';\nimport { getOverallLatency } from '../utils/span-timing';\nimport { getTimelineMarkersLayout } from '../utils/timeline-markers';\nimport type { TraceStreamingTimings } from '../utils/timeline-markers';\nimport { SpanRows } from './span-rows';\nimport { SpanTimelineRow, TimelineGridlines } from './span-timeline-row';\nimport { TimelineTimingRows } from './trace-span-timeline-markers';\nimport { TraceSpanTreeLoading } from './trace-span-tree';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\n/** Axis ticks are approximate gridline marks, so two decimals are enough: `250 ms`, `3.74 s`. */\nexport type { TraceStreamingTimings };\n\nfunction formatTick(durationMs: number) {\n  return durationMs < 1_000 ? `${Math.round(durationMs)} ms` : `${(durationMs / 1_000).toFixed(2)} s`;\n}\n\nexport type TraceSpanTimelineProps = {\n  hierarchicalSpans: UISpan[];\n  onSpanClick: (id: string) => void;\n  selectedSpanId?: string;\n  isLoading?: boolean;\n  fadedTypes?: string[];\n  expandedSpanIds?: string[];\n  setExpandedSpanIds?: Dispatch<SetStateAction<string[]>>;\n  featuredSpanIds?: string[];\n  /** Row scrolled into view once it is mounted (ancestors auto-expand when the span is featured). */\n  revealSpanId?: string;\n  /** Rendered full-width above the span rows. */\n  leadingSlot?: ReactNode;\n  /** Adds a collapsed \"Metrics\" row above the spans, revealing a row per streaming timing. */\n  streamingTimings?: TraceStreamingTimings;\n};\n\n/**\n * Gantt-style view of a trace: the same hierarchy and expansion state as `TraceSpanTree`,\n * but each row is a compact name cell plus a bar on a shared time axis. Rendered with its\n * own row component (`SpanTimelineRow`), independent from the tree's rows.\n */\nexport function TraceSpanTimeline({\n  hierarchicalSpans = [],\n  onSpanClick,\n  selectedSpanId,\n  isLoading,\n  fadedTypes,\n  expandedSpanIds,\n  setExpandedSpanIds,\n  featuredSpanIds,\n  revealSpanId,\n  leadingSlot,\n  streamingTimings,\n}: TraceSpanTimelineProps) {\n  if (isLoading) return <TraceSpanTreeLoading />;\n\n  const overallLatency = getOverallLatency(hierarchicalSpans);\n  const markers = getTimelineMarkersLayout(hierarchicalSpans, overallLatency, streamingTimings);\n\n  return (\n    <>\n      {leadingSlot}\n      <div className=\"grid grid-cols-[minmax(12rem,2fr)_minmax(12rem,3fr)] content-start gap-y-px overflow-hidden py-1\">\n        {/* Header row: empty name cell, then the axis on the same track as the bars. */}\n        <div />\n        <div className={TIMELINE_TRACK_PADDING}>\n          <div aria-label=\"Trace time axis\" className=\"relative h-6 tabular-nums\">\n            <TimelineGridlines />\n            {TIMELINE_TICKS.map((tick, index) => (\n              <Txt\n                tone=\"muted\"\n                as=\"span\"\n                variant=\"meta\"\n                key={tick}\n                style={{ left: `${tick * 100}%` }}\n                // Each label sits just after its gridline; the last one lands in the track's right padding.\n                className={cn(\n                  'absolute top-0.5 px-1.5 whitespace-nowrap',\n                  index > 0 && index < TIMELINE_TICKS.length - 1 && 'hidden sm:inline',\n                )}\n              >\n                {formatTick(overallLatency * tick)}\n              </Txt>\n            ))}\n          </div>\n        </div>\n        {markers && <TimelineTimingRows layout={markers} />}\n        <SpanRows\n          spans={hierarchicalSpans}\n          onSpanClick={onSpanClick}\n          selectedSpanId={selectedSpanId}\n          revealSpanId={revealSpanId}\n          fadedTypes={fadedTypes}\n          featuredSpanIds={featuredSpanIds}\n          expandedSpanIds={expandedSpanIds}\n          setExpandedSpanIds={setExpandedSpanIds}\n          renderRow={ctx => <SpanTimelineRow ctx={ctx} />}\n        />\n      </div>\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AAgBA,SAAS,WAAW,YAAoB;CACtC,OAAO,aAAa,MAAQ,GAAG,KAAK,MAAM,UAAU,EAAE,OAAO,IAAI,aAAa,IAAA,CAAO,QAAQ,CAAC,EAAE;AAClG;;;;;;AAwBA,SAAgB,kBAAkB,EAChC,oBAAoB,CAAC,GACrB,aACA,gBACA,WACA,YACA,iBACA,oBACA,iBACA,cACA,aACA,oBACyB;CACzB,IAAI,WAAW,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACA,kDAAAA,sBAAD,CAAuB,CAAA;CAE7C,MAAM,iBAAiBC,yCAAAA,kBAAkB,iBAAiB;CAC1D,MAAM,UAAUC,8CAAAA,yBAAyB,mBAAmB,gBAAgB,gBAAgB;CAE5F,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAAC,kBAAAA,UAAA,EAAA,UAAA,CACG,aACD,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GAEE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD,CAAM,CAAA;GACN,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IAAK,WAAWC,2CAAAA;IACd,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;KAAK,cAAW;KAAkB,WAAU;KAA5C,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,oDAAAA,mBAAD,CAAoB,CAAA,GACnBC,2CAAAA,eAAe,KAAK,MAAM,UACzB,iBAAA,GAAA,kBAAA,IAAA,CAACC,YAAAA,KAAD;MACE,MAAK;MACL,IAAG;MACH,SAAQ;MAER,OAAO,EAAE,MAAM,GAAG,OAAO,IAAI,GAAG;MAEhC,WAAWC,cAAAA,GACT,6CACA,QAAQ,KAAK,QAAQF,2CAAAA,eAAe,SAAS,KAAK,kBACpD;MAEC,UAAA,WAAW,iBAAiB,IAAI;KAC9B,GATE,IASF,CACN,CACE;;GACF,CAAA;GACJ,WAAW,iBAAA,GAAA,kBAAA,IAAA,CAACG,8DAAAA,oBAAD,EAAoB,QAAQ,QAAU,CAAA;GAClD,iBAAA,GAAA,kBAAA,IAAA,CAACC,4CAAAA,UAAD;IACE,OAAO;IACM;IACG;IACF;IACF;IACK;IACA;IACG;IACpB,YAAW,QAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,oDAAAA,iBAAD,EAAsB,IAAM,CAAA;GAC/C,CAAA;EACE;CACL,CAAA,CAAA,EAAA,CAAA;AAEN"}

package/dist/domains/traces/components/trace-span-timeline.es.js

@@ -5,9 +5,10 @@ import { SpanRows } from "./span-rows.es.js";
 import { TIMELINE_TICKS, TIMELINE_TRACK_PADDING } from "../utils/span-timeline.es.js";
 import { TraceSpanTreeLoading } from "./trace-span-tree.es.js";
 import { SpanTimelineRow, TimelineGridlines } from "./span-timeline-row.es.js";
+import { getTimelineMarkersLayout } from "../utils/timeline-markers.es.js";
+import { TimelineTimingRows } from "./trace-span-timeline-markers.es.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 // src/domains/traces/components/trace-span-timeline.tsx
-/** Axis ticks are approximate gridline marks, so two decimals are enough: `250 ms`, `3.74 s`. */
 function formatTick(durationMs) {
 	return durationMs < 1e3 ? `${Math.round(durationMs)} ms` : `${(durationMs / 1e3).toFixed(2)} s`;
 }
@@ -16,18 +17,19 @@ function formatTick(durationMs) {
 * but each row is a compact name cell plus a bar on a shared time axis. Rendered with its
 * own row component (`SpanTimelineRow`), independent from the tree's rows.
 */
-function TraceSpanTimeline({ hierarchicalSpans = [], onSpanClick, selectedSpanId, isLoading, fadedTypes, expandedSpanIds, setExpandedSpanIds, featuredSpanIds, revealSpanId, leadingSlot }) {
+function TraceSpanTimeline({ hierarchicalSpans = [], onSpanClick, selectedSpanId, isLoading, fadedTypes, expandedSpanIds, setExpandedSpanIds, featuredSpanIds, revealSpanId, leadingSlot, streamingTimings }) {
 	if (isLoading) return /* @__PURE__ */ jsx(TraceSpanTreeLoading, {});
 	const overallLatency = getOverallLatency(hierarchicalSpans);
+	const markers = getTimelineMarkersLayout(hierarchicalSpans, overallLatency, streamingTimings);
 	return /* @__PURE__ */ jsxs(Fragment, { children: [leadingSlot, /* @__PURE__ */ jsxs("div", {
 		className: "grid grid-cols-[minmax(12rem,2fr)_minmax(12rem,3fr)] content-start gap-y-px overflow-hidden py-1",
 		children: [
 			/* @__PURE__ */ jsx("div", {}),
 			/* @__PURE__ */ jsx("div", {
-				"aria-label": "Trace time axis",
-				className: cn("flex", TIMELINE_TRACK_PADDING),
+				className: TIMELINE_TRACK_PADDING,
 				children: /* @__PURE__ */ jsxs("div", {
-					className: "relative h-6 flex-1 tabular-nums",
+					"aria-label": "Trace time axis",
+					className: "relative h-6 tabular-nums",
 					children: [/* @__PURE__ */ jsx(TimelineGridlines, {}), TIMELINE_TICKS.map((tick, index) => /* @__PURE__ */ jsx(Txt, {
 						tone: "muted",
 						as: "span",
@@ -38,6 +40,7 @@ function TraceSpanTimeline({ hierarchicalSpans = [], onSpanClick, selectedSpanId
 					}, tick))]
 				})
 			}),
+			markers && /* @__PURE__ */ jsx(TimelineTimingRows, { layout: markers }),
 			/* @__PURE__ */ jsx(SpanRows, {
 				spans: hierarchicalSpans,
 				onSpanClick,

package/dist/domains/traces/components/trace-span-timeline.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-span-timeline.es.js","names":["_Fragment"],"sources":["../../../../src/domains/traces/components/trace-span-timeline.tsx"],"sourcesContent":["import type { Dispatch, ReactNode, SetStateAction } from 'react';\nimport type { UISpan } from '../types';\nimport { TIMELINE_TICKS, TIMELINE_TRACK_PADDING } from '../utils/span-timeline';\nimport { getOverallLatency } from '../utils/span-timing';\nimport { SpanRows } from './span-rows';\nimport { SpanTimelineRow, TimelineGridlines } from './span-timeline-row';\nimport { TraceSpanTreeLoading } from './trace-span-tree';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\n/** Axis ticks are approximate gridline marks, so two decimals are enough: `250 ms`, `3.74 s`. */\nfunction formatTick(durationMs: number) {\n  return durationMs < 1_000 ? `${Math.round(durationMs)} ms` : `${(durationMs / 1_000).toFixed(2)} s`;\n}\n\nexport type TraceSpanTimelineProps = {\n  hierarchicalSpans: UISpan[];\n  onSpanClick: (id: string) => void;\n  selectedSpanId?: string;\n  isLoading?: boolean;\n  fadedTypes?: string[];\n  expandedSpanIds?: string[];\n  setExpandedSpanIds?: Dispatch<SetStateAction<string[]>>;\n  featuredSpanIds?: string[];\n  /** Row scrolled into view once it is mounted (ancestors auto-expand when the span is featured). */\n  revealSpanId?: string;\n  /** Rendered full-width above the span rows. */\n  leadingSlot?: ReactNode;\n};\n\n/**\n * Gantt-style view of a trace: the same hierarchy and expansion state as `TraceSpanTree`,\n * but each row is a compact name cell plus a bar on a shared time axis. Rendered with its\n * own row component (`SpanTimelineRow`), independent from the tree's rows.\n */\nexport function TraceSpanTimeline({\n  hierarchicalSpans = [],\n  onSpanClick,\n  selectedSpanId,\n  isLoading,\n  fadedTypes,\n  expandedSpanIds,\n  setExpandedSpanIds,\n  featuredSpanIds,\n  revealSpanId,\n  leadingSlot,\n}: TraceSpanTimelineProps) {\n  if (isLoading) return <TraceSpanTreeLoading />;\n\n  const overallLatency = getOverallLatency(hierarchicalSpans);\n\n  return (\n    <>\n      {leadingSlot}\n      <div className=\"grid grid-cols-[minmax(12rem,2fr)_minmax(12rem,3fr)] content-start gap-y-px overflow-hidden py-1\">\n        {/* Header row: empty name cell, then the axis on the same track as the bars. */}\n        <div />\n        <div aria-label=\"Trace time axis\" className={cn('flex', TIMELINE_TRACK_PADDING)}>\n          <div className=\"relative h-6 flex-1 tabular-nums\">\n            <TimelineGridlines />\n            {TIMELINE_TICKS.map((tick, index) => (\n              <Txt\n                tone=\"muted\"\n                as=\"span\"\n                variant=\"meta\"\n                key={tick}\n                style={{ left: `${tick * 100}%` }}\n                // Each label sits just after its gridline; the last one lands in the track's right padding.\n                className={cn(\n                  'absolute top-0.5 px-1.5 whitespace-nowrap',\n                  index > 0 && index < TIMELINE_TICKS.length - 1 && 'hidden sm:inline',\n                )}\n              >\n                {formatTick(overallLatency * tick)}\n              </Txt>\n            ))}\n          </div>\n        </div>\n        <SpanRows\n          spans={hierarchicalSpans}\n          onSpanClick={onSpanClick}\n          selectedSpanId={selectedSpanId}\n          revealSpanId={revealSpanId}\n          fadedTypes={fadedTypes}\n          featuredSpanIds={featuredSpanIds}\n          expandedSpanIds={expandedSpanIds}\n          setExpandedSpanIds={setExpandedSpanIds}\n          renderRow={ctx => <SpanTimelineRow ctx={ctx} />}\n        />\n      </div>\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;AAWA,SAAS,WAAW,YAAoB;CACtC,OAAO,aAAa,MAAQ,GAAG,KAAK,MAAM,UAAU,EAAE,OAAO,IAAI,aAAa,IAAA,CAAO,QAAQ,CAAC,EAAE;AAClG;;;;;;AAsBA,SAAgB,kBAAkB,EAChC,oBAAoB,CAAC,GACrB,aACA,gBACA,WACA,YACA,iBACA,oBACA,iBACA,cACA,eACyB;CACzB,IAAI,WAAW,OAAO,oBAAC,sBAAD,CAAuB,CAAA;CAE7C,MAAM,iBAAiB,kBAAkB,iBAAiB;CAE1D,OACE,qBAAAA,UAAA,EAAA,UAAA,CACG,aACD,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GAEE,oBAAC,OAAD,CAAM,CAAA;GACN,oBAAC,OAAD;IAAK,cAAW;IAAkB,WAAW,GAAG,QAAQ,sBAAsB;IAC5E,UAAA,qBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,oBAAC,mBAAD,CAAoB,CAAA,GACnB,eAAe,KAAK,MAAM,UACzB,oBAAC,KAAD;MACE,MAAK;MACL,IAAG;MACH,SAAQ;MAER,OAAO,EAAE,MAAM,GAAG,OAAO,IAAI,GAAG;MAEhC,WAAW,GACT,6CACA,QAAQ,KAAK,QAAQ,eAAe,SAAS,KAAK,kBACpD;MAEC,UAAA,WAAW,iBAAiB,IAAI;KAC9B,GATE,IASF,CACN,CACE;;GACF,CAAA;GACL,oBAAC,UAAD;IACE,OAAO;IACM;IACG;IACF;IACF;IACK;IACA;IACG;IACpB,YAAW,QAAO,oBAAC,iBAAD,EAAsB,IAAM,CAAA;GAC/C,CAAA;EACE;CACL,CAAA,CAAA,EAAA,CAAA;AAEN"}
+{"version":3,"file":"trace-span-timeline.es.js","names":["_Fragment"],"sources":["../../../../src/domains/traces/components/trace-span-timeline.tsx"],"sourcesContent":["import type { Dispatch, ReactNode, SetStateAction } from 'react';\nimport type { UISpan } from '../types';\nimport { TIMELINE_TICKS, TIMELINE_TRACK_PADDING } from '../utils/span-timeline';\nimport { getOverallLatency } from '../utils/span-timing';\nimport { getTimelineMarkersLayout } from '../utils/timeline-markers';\nimport type { TraceStreamingTimings } from '../utils/timeline-markers';\nimport { SpanRows } from './span-rows';\nimport { SpanTimelineRow, TimelineGridlines } from './span-timeline-row';\nimport { TimelineTimingRows } from './trace-span-timeline-markers';\nimport { TraceSpanTreeLoading } from './trace-span-tree';\nimport { Txt } from '@/ds/components/Txt';\nimport { cn } from '@/lib/utils';\n\n/** Axis ticks are approximate gridline marks, so two decimals are enough: `250 ms`, `3.74 s`. */\nexport type { TraceStreamingTimings };\n\nfunction formatTick(durationMs: number) {\n  return durationMs < 1_000 ? `${Math.round(durationMs)} ms` : `${(durationMs / 1_000).toFixed(2)} s`;\n}\n\nexport type TraceSpanTimelineProps = {\n  hierarchicalSpans: UISpan[];\n  onSpanClick: (id: string) => void;\n  selectedSpanId?: string;\n  isLoading?: boolean;\n  fadedTypes?: string[];\n  expandedSpanIds?: string[];\n  setExpandedSpanIds?: Dispatch<SetStateAction<string[]>>;\n  featuredSpanIds?: string[];\n  /** Row scrolled into view once it is mounted (ancestors auto-expand when the span is featured). */\n  revealSpanId?: string;\n  /** Rendered full-width above the span rows. */\n  leadingSlot?: ReactNode;\n  /** Adds a collapsed \"Metrics\" row above the spans, revealing a row per streaming timing. */\n  streamingTimings?: TraceStreamingTimings;\n};\n\n/**\n * Gantt-style view of a trace: the same hierarchy and expansion state as `TraceSpanTree`,\n * but each row is a compact name cell plus a bar on a shared time axis. Rendered with its\n * own row component (`SpanTimelineRow`), independent from the tree's rows.\n */\nexport function TraceSpanTimeline({\n  hierarchicalSpans = [],\n  onSpanClick,\n  selectedSpanId,\n  isLoading,\n  fadedTypes,\n  expandedSpanIds,\n  setExpandedSpanIds,\n  featuredSpanIds,\n  revealSpanId,\n  leadingSlot,\n  streamingTimings,\n}: TraceSpanTimelineProps) {\n  if (isLoading) return <TraceSpanTreeLoading />;\n\n  const overallLatency = getOverallLatency(hierarchicalSpans);\n  const markers = getTimelineMarkersLayout(hierarchicalSpans, overallLatency, streamingTimings);\n\n  return (\n    <>\n      {leadingSlot}\n      <div className=\"grid grid-cols-[minmax(12rem,2fr)_minmax(12rem,3fr)] content-start gap-y-px overflow-hidden py-1\">\n        {/* Header row: empty name cell, then the axis on the same track as the bars. */}\n        <div />\n        <div className={TIMELINE_TRACK_PADDING}>\n          <div aria-label=\"Trace time axis\" className=\"relative h-6 tabular-nums\">\n            <TimelineGridlines />\n            {TIMELINE_TICKS.map((tick, index) => (\n              <Txt\n                tone=\"muted\"\n                as=\"span\"\n                variant=\"meta\"\n                key={tick}\n                style={{ left: `${tick * 100}%` }}\n                // Each label sits just after its gridline; the last one lands in the track's right padding.\n                className={cn(\n                  'absolute top-0.5 px-1.5 whitespace-nowrap',\n                  index > 0 && index < TIMELINE_TICKS.length - 1 && 'hidden sm:inline',\n                )}\n              >\n                {formatTick(overallLatency * tick)}\n              </Txt>\n            ))}\n          </div>\n        </div>\n        {markers && <TimelineTimingRows layout={markers} />}\n        <SpanRows\n          spans={hierarchicalSpans}\n          onSpanClick={onSpanClick}\n          selectedSpanId={selectedSpanId}\n          revealSpanId={revealSpanId}\n          fadedTypes={fadedTypes}\n          featuredSpanIds={featuredSpanIds}\n          expandedSpanIds={expandedSpanIds}\n          setExpandedSpanIds={setExpandedSpanIds}\n          renderRow={ctx => <SpanTimelineRow ctx={ctx} />}\n        />\n      </div>\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAgBA,SAAS,WAAW,YAAoB;CACtC,OAAO,aAAa,MAAQ,GAAG,KAAK,MAAM,UAAU,EAAE,OAAO,IAAI,aAAa,IAAA,CAAO,QAAQ,CAAC,EAAE;AAClG;;;;;;AAwBA,SAAgB,kBAAkB,EAChC,oBAAoB,CAAC,GACrB,aACA,gBACA,WACA,YACA,iBACA,oBACA,iBACA,cACA,aACA,oBACyB;CACzB,IAAI,WAAW,OAAO,oBAAC,sBAAD,CAAuB,CAAA;CAE7C,MAAM,iBAAiB,kBAAkB,iBAAiB;CAC1D,MAAM,UAAU,yBAAyB,mBAAmB,gBAAgB,gBAAgB;CAE5F,OACE,qBAAAA,UAAA,EAAA,UAAA,CACG,aACD,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GAEE,oBAAC,OAAD,CAAM,CAAA;GACN,oBAAC,OAAD;IAAK,WAAW;IACd,UAAA,qBAAC,OAAD;KAAK,cAAW;KAAkB,WAAU;KAA5C,UAAA,CACE,oBAAC,mBAAD,CAAoB,CAAA,GACnB,eAAe,KAAK,MAAM,UACzB,oBAAC,KAAD;MACE,MAAK;MACL,IAAG;MACH,SAAQ;MAER,OAAO,EAAE,MAAM,GAAG,OAAO,IAAI,GAAG;MAEhC,WAAW,GACT,6CACA,QAAQ,KAAK,QAAQ,eAAe,SAAS,KAAK,kBACpD;MAEC,UAAA,WAAW,iBAAiB,IAAI;KAC9B,GATE,IASF,CACN,CACE;;GACF,CAAA;GACJ,WAAW,oBAAC,oBAAD,EAAoB,QAAQ,QAAU,CAAA;GAClD,oBAAC,UAAD;IACE,OAAO;IACM;IACG;IACF;IACF;IACK;IACA;IACG;IACpB,YAAW,QAAO,oBAAC,iBAAD,EAAsB,IAAM,CAAA;GAC/C,CAAA;EACE;CACL,CAAA,CAAA,EAAA,CAAA;AAEN"}

package/dist/domains/traces/components/trace-time-range-chip.cjs.js

@@ -1,8 +1,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_utils = require("../../../utils-uDc1ofX1.cjs");
-const require_trace_filters = require("../../../trace-filters-BpeBUjCb.cjs");
-const require_DateTimeRangePicker = require("../../../DateTimeRangePicker-DGbH5WOn.cjs");
-const require_filter_bar_chip = require("../../../filter-bar-chip-CyTAmjt6.cjs");
+const require_trace_filters = require("../../../trace-filters-BNEZ31HX.cjs");
+const require_DateTimeRangePicker = require("../../../DateTimeRangePicker-HmPOHwAQ.cjs");
+const require_filter_bar_chip = require("../../../filter-bar-chip-BUyMf8XQ.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
 let lucide_react = require("lucide-react");
 // src/domains/traces/components/trace-time-range-chip.tsx
@@ -33,7 +33,7 @@ var isSegment = (target) => target instanceof HTMLElement && target.hasAttribute
 * present and non-removable; the value segment opens the regular DateTimeRangePicker
 * menu/popover. With `defaultPreset`, a trailing × resets the range to it.
 */
-function TraceTimeRangeChip({ defaultPreset, ...props }) {
+function TraceTimeRangeChip({ defaultPreset, onReset, ...props }) {
 	const ctx = require_filter_bar_chip.useFilterBarContext();
 	const canReset = defaultPreset !== void 0 && props.preset !== defaultPreset;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_filter_bar_chip.FilterBarChip, {
@@ -76,7 +76,7 @@ function TraceTimeRangeChip({ defaultPreset, ...props }) {
 				"aria-label": "Reset time range",
 				title: "Reset time range",
 				className: require_filter_bar_chip.removeSegmentClass,
-				onClick: () => props.onPresetChange?.(defaultPreset),
+				onClick: () => onReset ? onReset() : props.onPresetChange?.(defaultPreset),
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.XIcon, { className: "size-[1.1em]" })
 			})
 		]

package/dist/domains/traces/components/trace-time-range-chip.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-time-range-chip.cjs.js","names":["traceFilterFieldIcon","traceFilterFieldColor","useFilterBarContext","FilterBarChip","cn","segmentClass","fieldSegmentAccentStyle","FilterBarFieldLabel","DateTimeRangePicker","editableSegmentClass","removeSegmentClass","XIcon"],"sources":["../../../../src/domains/traces/components/trace-time-range-chip.tsx"],"sourcesContent":["/* eslint-disable react-refresh/only-export-components */\nimport { XIcon } from 'lucide-react';\nimport type { KeyboardEvent } from 'react';\nimport { traceFilterFieldColor, traceFilterFieldIcon } from '../trace-filters';\nimport type { DateRangePreset, DateTimeRangePickerProps } from '@/ds/components/DateTimeRangePicker';\nimport { DateTimeRangePicker } from '@/ds/components/DateTimeRangePicker';\nimport {\n  FilterBarChip,\n  FilterBarFieldLabel,\n  editableSegmentClass,\n  fieldSegmentAccentStyle,\n  removeSegmentClass,\n  segmentClass,\n} from '@/ds/components/FilterBar/filter-bar-chip';\nimport { useFilterBarContext } from '@/ds/components/FilterBar/filter-bar-context';\nimport type { FilterBarField, FilterBarItem } from '@/ds/components/FilterBar/types';\nimport { cn } from '@/lib/utils';\n\nexport const TRACE_TIME_RANGE_FIELD_ID = 'timeRange';\n\n/**\n * Synthetic FilterBar field backing the always-present time-range chip. Hidden from the\n * input's field step (the chip cannot be added twice) but registered so the chip resolves\n * its label and takes part in keyboard navigation.\n */\nexport const TRACE_TIME_RANGE_FIELD: FilterBarField = {\n  id: TRACE_TIME_RANGE_FIELD_ID,\n  label: 'Time',\n  icon: traceFilterFieldIcon(TRACE_TIME_RANGE_FIELD_ID),\n  color: traceFilterFieldColor(TRACE_TIME_RANGE_FIELD_ID),\n  type: 'text',\n  operators: ['is'],\n  hidden: true,\n};\n\nexport const TRACE_TIME_RANGE_ITEM: FilterBarItem = {\n  id: TRACE_TIME_RANGE_FIELD_ID,\n  fieldId: TRACE_TIME_RANGE_FIELD_ID,\n  operatorId: 'is',\n  value: '',\n};\n\nexport type TraceTimeRangeChipProps = Pick<\n  DateTimeRangePickerProps,\n  | 'preset'\n  | 'onPresetChange'\n  | 'dateFrom'\n  | 'dateTo'\n  | 'onDateChange'\n  | 'onDateRangeChange'\n  | 'disabled'\n  | 'maxRangeMs'\n  | 'minDate'\n  | 'presets'\n> & {\n  /** Shows a × that switches back to this preset whenever another range is selected. */\n  defaultPreset?: DateRangePreset;\n};\n\nconst isSegment = (target: EventTarget | null) =>\n  target instanceof HTMLElement && target.hasAttribute('data-filter-bar-segment');\n\n/**\n * The trace list's date range rendered as a FilterBar chip: `Time <preset>`. Always\n * present and non-removable; the value segment opens the regular DateTimeRangePicker\n * menu/popover. With `defaultPreset`, a trailing × resets the range to it.\n */\nexport function TraceTimeRangeChip({ defaultPreset, ...props }: TraceTimeRangeChipProps) {\n  const ctx = useFilterBarContext();\n  const canReset = defaultPreset !== undefined && props.preset !== defaultPreset;\n  return (\n    <FilterBarChip item={TRACE_TIME_RANGE_ITEM} removable={false}>\n      <span className={cn(segmentClass, 'text-foreground')} style={fieldSegmentAccentStyle(TRACE_TIME_RANGE_FIELD)}>\n        <FilterBarFieldLabel field={TRACE_TIME_RANGE_FIELD} />\n      </span>\n      {/* The picker popup is portaled but bubbles React events through here — keep its\n          keystrokes from reaching the chip's arrow-key navigation. */}\n      <div\n        className=\"contents\"\n        onKeyDown={(event: KeyboardEvent<HTMLDivElement>) => {\n          if (!isSegment(event.target)) event.stopPropagation();\n        }}\n      >\n        <DateTimeRangePicker\n          {...props}\n          renderTrigger={({ label, disabled }) => (\n            <button\n              type=\"button\"\n              ref={el => ctx.registerSegment(TRACE_TIME_RANGE_ITEM.id, 'value', el)}\n              data-filter-bar-segment=\"\"\n              disabled={disabled}\n              aria-label={`Value: ${label}`}\n              title={label}\n              className={editableSegmentClass}\n            >\n              <span className=\"truncate\">{label}</span>\n            </button>\n          )}\n        />\n      </div>\n      {canReset && (\n        <button\n          type=\"button\"\n          data-filter-bar-segment=\"\"\n          tabIndex={-1}\n          ref={el => ctx.registerSegment(TRACE_TIME_RANGE_ITEM.id, 'remove', el)}\n          disabled={props.disabled}\n          aria-label=\"Reset time range\"\n          title=\"Reset time range\"\n          className={removeSegmentClass}\n          onClick={() => props.onPresetChange?.(defaultPreset)}\n        >\n          <XIcon className=\"size-[1.1em]\" />\n        </button>\n      )}\n    </FilterBarChip>\n  );\n}\n"],"mappings":";;;;;;;;AAkBA,IAAa,4BAA4B;;;;;;AAOzC,IAAa,yBAAyC;CACpD,IAAI;CACJ,OAAO;CACP,MAAMA,sBAAAA,qBAAqB,yBAAyB;CACpD,OAAOC,sBAAAA,sBAAsB,yBAAyB;CACtD,MAAM;CACN,WAAW,CAAC,IAAI;CAChB,QAAQ;AACV;AAEA,IAAa,wBAAuC;CAClD,IAAI;CACJ,SAAS;CACT,YAAY;CACZ,OAAO;AACT;AAmBA,IAAM,aAAa,WACjB,kBAAkB,eAAe,OAAO,aAAa,yBAAyB;;;;;;AAOhF,SAAgB,mBAAmB,EAAE,eAAe,GAAG,SAAkC;CACvF,MAAM,MAAMC,wBAAAA,oBAAoB;CAChC,MAAM,WAAW,kBAAkB,KAAA,KAAa,MAAM,WAAW;CACjE,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,wBAAAA,eAAD;EAAe,MAAM;EAAuB,WAAW;EAAvD,UAAA;GACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,WAAWC,cAAAA,GAAGC,wBAAAA,cAAc,iBAAiB;IAAG,OAAOC,wBAAAA,wBAAwB,sBAAsB;IACzG,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,wBAAAA,qBAAD,EAAqB,OAAO,uBAAyB,CAAA;GACjD,CAAA;GAGN,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IACE,WAAU;IACV,YAAY,UAAyC;KACnD,IAAI,CAAC,UAAU,MAAM,MAAM,GAAG,MAAM,gBAAgB;IACtD;IAEA,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,4BAAAA,qBAAD;KACE,GAAI;KACJ,gBAAgB,EAAE,OAAO,eACvB,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;MACE,MAAK;MACL,MAAK,OAAM,IAAI,gBAAgB,sBAAsB,IAAI,SAAS,EAAE;MACpE,2BAAwB;MACd;MACV,cAAY,UAAU;MACtB,OAAO;MACP,WAAWC,wBAAAA;MAEX,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;OAAM,WAAU;OAAY,UAAA;MAAY,CAAA;KAClC,CAAA;IAEX,CAAA;GACE,CAAA;GACJ,YACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;IACE,MAAK;IACL,2BAAwB;IACxB,UAAU;IACV,MAAK,OAAM,IAAI,gBAAgB,sBAAsB,IAAI,UAAU,EAAE;IACrE,UAAU,MAAM;IAChB,cAAW;IACX,OAAM;IACN,WAAWC,wBAAAA;IACX,eAAe,MAAM,iBAAiB,aAAa;IAEnD,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,aAAAA,OAAD,EAAO,WAAU,eAAgB,CAAA;GAC3B,CAAA;EAEG;;AAEnB"}
+{"version":3,"file":"trace-time-range-chip.cjs.js","names":["traceFilterFieldIcon","traceFilterFieldColor","useFilterBarContext","FilterBarChip","cn","segmentClass","fieldSegmentAccentStyle","FilterBarFieldLabel","DateTimeRangePicker","editableSegmentClass","removeSegmentClass","XIcon"],"sources":["../../../../src/domains/traces/components/trace-time-range-chip.tsx"],"sourcesContent":["/* eslint-disable react-refresh/only-export-components */\nimport { XIcon } from 'lucide-react';\nimport type { KeyboardEvent } from 'react';\nimport { traceFilterFieldColor, traceFilterFieldIcon } from '../trace-filters';\nimport type { DateRangePreset, DateTimeRangePickerProps } from '@/ds/components/DateTimeRangePicker';\nimport { DateTimeRangePicker } from '@/ds/components/DateTimeRangePicker';\nimport {\n  FilterBarChip,\n  FilterBarFieldLabel,\n  editableSegmentClass,\n  fieldSegmentAccentStyle,\n  removeSegmentClass,\n  segmentClass,\n} from '@/ds/components/FilterBar/filter-bar-chip';\nimport { useFilterBarContext } from '@/ds/components/FilterBar/filter-bar-context';\nimport type { FilterBarField, FilterBarItem } from '@/ds/components/FilterBar/types';\nimport { cn } from '@/lib/utils';\n\nexport const TRACE_TIME_RANGE_FIELD_ID = 'timeRange';\n\n/**\n * Synthetic FilterBar field backing the always-present time-range chip. Hidden from the\n * input's field step (the chip cannot be added twice) but registered so the chip resolves\n * its label and takes part in keyboard navigation.\n */\nexport const TRACE_TIME_RANGE_FIELD: FilterBarField = {\n  id: TRACE_TIME_RANGE_FIELD_ID,\n  label: 'Time',\n  icon: traceFilterFieldIcon(TRACE_TIME_RANGE_FIELD_ID),\n  color: traceFilterFieldColor(TRACE_TIME_RANGE_FIELD_ID),\n  type: 'text',\n  operators: ['is'],\n  hidden: true,\n};\n\nexport const TRACE_TIME_RANGE_ITEM: FilterBarItem = {\n  id: TRACE_TIME_RANGE_FIELD_ID,\n  fieldId: TRACE_TIME_RANGE_FIELD_ID,\n  operatorId: 'is',\n  value: '',\n};\n\nexport type TraceTimeRangeChipProps = Pick<\n  DateTimeRangePickerProps,\n  | 'preset'\n  | 'onPresetChange'\n  | 'dateFrom'\n  | 'dateTo'\n  | 'onDateChange'\n  | 'onDateRangeChange'\n  | 'disabled'\n  | 'maxRangeMs'\n  | 'minDate'\n  | 'presets'\n> & {\n  /** Shows a × that switches back to this preset whenever another range is selected. */\n  defaultPreset?: DateRangePreset;\n  /** Replaces what the × does, e.g. to undo a histogram zoom before falling back to `defaultPreset`. */\n  onReset?: () => void;\n};\n\nconst isSegment = (target: EventTarget | null) =>\n  target instanceof HTMLElement && target.hasAttribute('data-filter-bar-segment');\n\n/**\n * The trace list's date range rendered as a FilterBar chip: `Time <preset>`. Always\n * present and non-removable; the value segment opens the regular DateTimeRangePicker\n * menu/popover. With `defaultPreset`, a trailing × resets the range to it.\n */\nexport function TraceTimeRangeChip({ defaultPreset, onReset, ...props }: TraceTimeRangeChipProps) {\n  const ctx = useFilterBarContext();\n  const canReset = defaultPreset !== undefined && props.preset !== defaultPreset;\n  return (\n    <FilterBarChip item={TRACE_TIME_RANGE_ITEM} removable={false}>\n      <span className={cn(segmentClass, 'text-foreground')} style={fieldSegmentAccentStyle(TRACE_TIME_RANGE_FIELD)}>\n        <FilterBarFieldLabel field={TRACE_TIME_RANGE_FIELD} />\n      </span>\n      {/* The picker popup is portaled but bubbles React events through here — keep its\n          keystrokes from reaching the chip's arrow-key navigation. */}\n      <div\n        className=\"contents\"\n        onKeyDown={(event: KeyboardEvent<HTMLDivElement>) => {\n          if (!isSegment(event.target)) event.stopPropagation();\n        }}\n      >\n        <DateTimeRangePicker\n          {...props}\n          renderTrigger={({ label, disabled }) => (\n            <button\n              type=\"button\"\n              ref={el => ctx.registerSegment(TRACE_TIME_RANGE_ITEM.id, 'value', el)}\n              data-filter-bar-segment=\"\"\n              disabled={disabled}\n              aria-label={`Value: ${label}`}\n              title={label}\n              className={editableSegmentClass}\n            >\n              <span className=\"truncate\">{label}</span>\n            </button>\n          )}\n        />\n      </div>\n      {canReset && (\n        <button\n          type=\"button\"\n          data-filter-bar-segment=\"\"\n          tabIndex={-1}\n          ref={el => ctx.registerSegment(TRACE_TIME_RANGE_ITEM.id, 'remove', el)}\n          disabled={props.disabled}\n          aria-label=\"Reset time range\"\n          title=\"Reset time range\"\n          className={removeSegmentClass}\n          onClick={() => (onReset ? onReset() : props.onPresetChange?.(defaultPreset))}\n        >\n          <XIcon className=\"size-[1.1em]\" />\n        </button>\n      )}\n    </FilterBarChip>\n  );\n}\n"],"mappings":";;;;;;;;AAkBA,IAAa,4BAA4B;;;;;;AAOzC,IAAa,yBAAyC;CACpD,IAAI;CACJ,OAAO;CACP,MAAMA,sBAAAA,qBAAqB,yBAAyB;CACpD,OAAOC,sBAAAA,sBAAsB,yBAAyB;CACtD,MAAM;CACN,WAAW,CAAC,IAAI;CAChB,QAAQ;AACV;AAEA,IAAa,wBAAuC;CAClD,IAAI;CACJ,SAAS;CACT,YAAY;CACZ,OAAO;AACT;AAqBA,IAAM,aAAa,WACjB,kBAAkB,eAAe,OAAO,aAAa,yBAAyB;;;;;;AAOhF,SAAgB,mBAAmB,EAAE,eAAe,SAAS,GAAG,SAAkC;CAChG,MAAM,MAAMC,wBAAAA,oBAAoB;CAChC,MAAM,WAAW,kBAAkB,KAAA,KAAa,MAAM,WAAW;CACjE,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACC,wBAAAA,eAAD;EAAe,MAAM;EAAuB,WAAW;EAAvD,UAAA;GACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,WAAWC,cAAAA,GAAGC,wBAAAA,cAAc,iBAAiB;IAAG,OAAOC,wBAAAA,wBAAwB,sBAAsB;IACzG,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,wBAAAA,qBAAD,EAAqB,OAAO,uBAAyB,CAAA;GACjD,CAAA;GAGN,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;IACE,WAAU;IACV,YAAY,UAAyC;KACnD,IAAI,CAAC,UAAU,MAAM,MAAM,GAAG,MAAM,gBAAgB;IACtD;IAEA,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,4BAAAA,qBAAD;KACE,GAAI;KACJ,gBAAgB,EAAE,OAAO,eACvB,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;MACE,MAAK;MACL,MAAK,OAAM,IAAI,gBAAgB,sBAAsB,IAAI,SAAS,EAAE;MACpE,2BAAwB;MACd;MACV,cAAY,UAAU;MACtB,OAAO;MACP,WAAWC,wBAAAA;MAEX,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;OAAM,WAAU;OAAY,UAAA;MAAY,CAAA;KAClC,CAAA;IAEX,CAAA;GACE,CAAA;GACJ,YACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;IACE,MAAK;IACL,2BAAwB;IACxB,UAAU;IACV,MAAK,OAAM,IAAI,gBAAgB,sBAAsB,IAAI,UAAU,EAAE;IACrE,UAAU,MAAM;IAChB,cAAW;IACX,OAAM;IACN,WAAWC,wBAAAA;IACX,eAAgB,UAAU,QAAQ,IAAI,MAAM,iBAAiB,aAAa;IAE1E,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,aAAAA,OAAD,EAAO,WAAU,eAAgB,CAAA;GAC3B,CAAA;EAEG;;AAEnB"}

package/dist/domains/traces/components/trace-time-range-chip.es.js

@@ -1,7 +1,7 @@
 import { t as cn } from "../../../utils-DQx8TpNT.js";
-import { X as traceFilterFieldIcon, Y as traceFilterFieldColor } from "../../../trace-filters-C27yWcan.js";
-import { t as DateTimeRangePicker } from "../../../DateTimeRangePicker-ByMbLdom.js";
-import { b as useFilterBarContext, f as removeSegmentClass, l as editableSegmentClass, o as FilterBarFieldLabel, p as segmentClass, t as FilterBarChip, u as fieldSegmentAccentStyle } from "../../../filter-bar-chip-B3pgpngW.js";
+import { Q as traceFilterFieldIcon, Z as traceFilterFieldColor } from "../../../trace-filters-BJaebsxJ.js";
+import { t as DateTimeRangePicker } from "../../../DateTimeRangePicker-C_Lie_2P.js";
+import { b as useFilterBarContext, f as removeSegmentClass, l as editableSegmentClass, o as FilterBarFieldLabel, p as segmentClass, t as FilterBarChip, u as fieldSegmentAccentStyle } from "../../../filter-bar-chip-7O02P9Vk.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { XIcon } from "lucide-react";
 // src/domains/traces/components/trace-time-range-chip.tsx
@@ -32,7 +32,7 @@ var isSegment = (target) => target instanceof HTMLElement && target.hasAttribute
 * present and non-removable; the value segment opens the regular DateTimeRangePicker
 * menu/popover. With `defaultPreset`, a trailing × resets the range to it.
 */
-function TraceTimeRangeChip({ defaultPreset, ...props }) {
+function TraceTimeRangeChip({ defaultPreset, onReset, ...props }) {
 	const ctx = useFilterBarContext();
 	const canReset = defaultPreset !== void 0 && props.preset !== defaultPreset;
 	return /* @__PURE__ */ jsxs(FilterBarChip, {
@@ -75,7 +75,7 @@ function TraceTimeRangeChip({ defaultPreset, ...props }) {
 				"aria-label": "Reset time range",
 				title: "Reset time range",
 				className: removeSegmentClass,
-				onClick: () => props.onPresetChange?.(defaultPreset),
+				onClick: () => onReset ? onReset() : props.onPresetChange?.(defaultPreset),
 				children: /* @__PURE__ */ jsx(XIcon, { className: "size-[1.1em]" })
 			})
 		]

package/dist/domains/traces/components/trace-time-range-chip.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-time-range-chip.es.js","names":[],"sources":["../../../../src/domains/traces/components/trace-time-range-chip.tsx"],"sourcesContent":["/* eslint-disable react-refresh/only-export-components */\nimport { XIcon } from 'lucide-react';\nimport type { KeyboardEvent } from 'react';\nimport { traceFilterFieldColor, traceFilterFieldIcon } from '../trace-filters';\nimport type { DateRangePreset, DateTimeRangePickerProps } from '@/ds/components/DateTimeRangePicker';\nimport { DateTimeRangePicker } from '@/ds/components/DateTimeRangePicker';\nimport {\n  FilterBarChip,\n  FilterBarFieldLabel,\n  editableSegmentClass,\n  fieldSegmentAccentStyle,\n  removeSegmentClass,\n  segmentClass,\n} from '@/ds/components/FilterBar/filter-bar-chip';\nimport { useFilterBarContext } from '@/ds/components/FilterBar/filter-bar-context';\nimport type { FilterBarField, FilterBarItem } from '@/ds/components/FilterBar/types';\nimport { cn } from '@/lib/utils';\n\nexport const TRACE_TIME_RANGE_FIELD_ID = 'timeRange';\n\n/**\n * Synthetic FilterBar field backing the always-present time-range chip. Hidden from the\n * input's field step (the chip cannot be added twice) but registered so the chip resolves\n * its label and takes part in keyboard navigation.\n */\nexport const TRACE_TIME_RANGE_FIELD: FilterBarField = {\n  id: TRACE_TIME_RANGE_FIELD_ID,\n  label: 'Time',\n  icon: traceFilterFieldIcon(TRACE_TIME_RANGE_FIELD_ID),\n  color: traceFilterFieldColor(TRACE_TIME_RANGE_FIELD_ID),\n  type: 'text',\n  operators: ['is'],\n  hidden: true,\n};\n\nexport const TRACE_TIME_RANGE_ITEM: FilterBarItem = {\n  id: TRACE_TIME_RANGE_FIELD_ID,\n  fieldId: TRACE_TIME_RANGE_FIELD_ID,\n  operatorId: 'is',\n  value: '',\n};\n\nexport type TraceTimeRangeChipProps = Pick<\n  DateTimeRangePickerProps,\n  | 'preset'\n  | 'onPresetChange'\n  | 'dateFrom'\n  | 'dateTo'\n  | 'onDateChange'\n  | 'onDateRangeChange'\n  | 'disabled'\n  | 'maxRangeMs'\n  | 'minDate'\n  | 'presets'\n> & {\n  /** Shows a × that switches back to this preset whenever another range is selected. */\n  defaultPreset?: DateRangePreset;\n};\n\nconst isSegment = (target: EventTarget | null) =>\n  target instanceof HTMLElement && target.hasAttribute('data-filter-bar-segment');\n\n/**\n * The trace list's date range rendered as a FilterBar chip: `Time <preset>`. Always\n * present and non-removable; the value segment opens the regular DateTimeRangePicker\n * menu/popover. With `defaultPreset`, a trailing × resets the range to it.\n */\nexport function TraceTimeRangeChip({ defaultPreset, ...props }: TraceTimeRangeChipProps) {\n  const ctx = useFilterBarContext();\n  const canReset = defaultPreset !== undefined && props.preset !== defaultPreset;\n  return (\n    <FilterBarChip item={TRACE_TIME_RANGE_ITEM} removable={false}>\n      <span className={cn(segmentClass, 'text-foreground')} style={fieldSegmentAccentStyle(TRACE_TIME_RANGE_FIELD)}>\n        <FilterBarFieldLabel field={TRACE_TIME_RANGE_FIELD} />\n      </span>\n      {/* The picker popup is portaled but bubbles React events through here — keep its\n          keystrokes from reaching the chip's arrow-key navigation. */}\n      <div\n        className=\"contents\"\n        onKeyDown={(event: KeyboardEvent<HTMLDivElement>) => {\n          if (!isSegment(event.target)) event.stopPropagation();\n        }}\n      >\n        <DateTimeRangePicker\n          {...props}\n          renderTrigger={({ label, disabled }) => (\n            <button\n              type=\"button\"\n              ref={el => ctx.registerSegment(TRACE_TIME_RANGE_ITEM.id, 'value', el)}\n              data-filter-bar-segment=\"\"\n              disabled={disabled}\n              aria-label={`Value: ${label}`}\n              title={label}\n              className={editableSegmentClass}\n            >\n              <span className=\"truncate\">{label}</span>\n            </button>\n          )}\n        />\n      </div>\n      {canReset && (\n        <button\n          type=\"button\"\n          data-filter-bar-segment=\"\"\n          tabIndex={-1}\n          ref={el => ctx.registerSegment(TRACE_TIME_RANGE_ITEM.id, 'remove', el)}\n          disabled={props.disabled}\n          aria-label=\"Reset time range\"\n          title=\"Reset time range\"\n          className={removeSegmentClass}\n          onClick={() => props.onPresetChange?.(defaultPreset)}\n        >\n          <XIcon className=\"size-[1.1em]\" />\n        </button>\n      )}\n    </FilterBarChip>\n  );\n}\n"],"mappings":";;;;;;;AAkBA,IAAa,4BAA4B;;;;;;AAOzC,IAAa,yBAAyC;CACpD,IAAI;CACJ,OAAO;CACP,MAAM,qBAAqB,yBAAyB;CACpD,OAAO,sBAAsB,yBAAyB;CACtD,MAAM;CACN,WAAW,CAAC,IAAI;CAChB,QAAQ;AACV;AAEA,IAAa,wBAAuC;CAClD,IAAI;CACJ,SAAS;CACT,YAAY;CACZ,OAAO;AACT;AAmBA,IAAM,aAAa,WACjB,kBAAkB,eAAe,OAAO,aAAa,yBAAyB;;;;;;AAOhF,SAAgB,mBAAmB,EAAE,eAAe,GAAG,SAAkC;CACvF,MAAM,MAAM,oBAAoB;CAChC,MAAM,WAAW,kBAAkB,KAAA,KAAa,MAAM,WAAW;CACjE,OACE,qBAAC,eAAD;EAAe,MAAM;EAAuB,WAAW;EAAvD,UAAA;GACE,oBAAC,QAAD;IAAM,WAAW,GAAG,cAAc,iBAAiB;IAAG,OAAO,wBAAwB,sBAAsB;IACzG,UAAA,oBAAC,qBAAD,EAAqB,OAAO,uBAAyB,CAAA;GACjD,CAAA;GAGN,oBAAC,OAAD;IACE,WAAU;IACV,YAAY,UAAyC;KACnD,IAAI,CAAC,UAAU,MAAM,MAAM,GAAG,MAAM,gBAAgB;IACtD;IAEA,UAAA,oBAAC,qBAAD;KACE,GAAI;KACJ,gBAAgB,EAAE,OAAO,eACvB,oBAAC,UAAD;MACE,MAAK;MACL,MAAK,OAAM,IAAI,gBAAgB,sBAAsB,IAAI,SAAS,EAAE;MACpE,2BAAwB;MACd;MACV,cAAY,UAAU;MACtB,OAAO;MACP,WAAW;MAEX,UAAA,oBAAC,QAAD;OAAM,WAAU;OAAY,UAAA;MAAY,CAAA;KAClC,CAAA;IAEX,CAAA;GACE,CAAA;GACJ,YACC,oBAAC,UAAD;IACE,MAAK;IACL,2BAAwB;IACxB,UAAU;IACV,MAAK,OAAM,IAAI,gBAAgB,sBAAsB,IAAI,UAAU,EAAE;IACrE,UAAU,MAAM;IAChB,cAAW;IACX,OAAM;IACN,WAAW;IACX,eAAe,MAAM,iBAAiB,aAAa;IAEnD,UAAA,oBAAC,OAAD,EAAO,WAAU,eAAgB,CAAA;GAC3B,CAAA;EAEG;;AAEnB"}
+{"version":3,"file":"trace-time-range-chip.es.js","names":[],"sources":["../../../../src/domains/traces/components/trace-time-range-chip.tsx"],"sourcesContent":["/* eslint-disable react-refresh/only-export-components */\nimport { XIcon } from 'lucide-react';\nimport type { KeyboardEvent } from 'react';\nimport { traceFilterFieldColor, traceFilterFieldIcon } from '../trace-filters';\nimport type { DateRangePreset, DateTimeRangePickerProps } from '@/ds/components/DateTimeRangePicker';\nimport { DateTimeRangePicker } from '@/ds/components/DateTimeRangePicker';\nimport {\n  FilterBarChip,\n  FilterBarFieldLabel,\n  editableSegmentClass,\n  fieldSegmentAccentStyle,\n  removeSegmentClass,\n  segmentClass,\n} from '@/ds/components/FilterBar/filter-bar-chip';\nimport { useFilterBarContext } from '@/ds/components/FilterBar/filter-bar-context';\nimport type { FilterBarField, FilterBarItem } from '@/ds/components/FilterBar/types';\nimport { cn } from '@/lib/utils';\n\nexport const TRACE_TIME_RANGE_FIELD_ID = 'timeRange';\n\n/**\n * Synthetic FilterBar field backing the always-present time-range chip. Hidden from the\n * input's field step (the chip cannot be added twice) but registered so the chip resolves\n * its label and takes part in keyboard navigation.\n */\nexport const TRACE_TIME_RANGE_FIELD: FilterBarField = {\n  id: TRACE_TIME_RANGE_FIELD_ID,\n  label: 'Time',\n  icon: traceFilterFieldIcon(TRACE_TIME_RANGE_FIELD_ID),\n  color: traceFilterFieldColor(TRACE_TIME_RANGE_FIELD_ID),\n  type: 'text',\n  operators: ['is'],\n  hidden: true,\n};\n\nexport const TRACE_TIME_RANGE_ITEM: FilterBarItem = {\n  id: TRACE_TIME_RANGE_FIELD_ID,\n  fieldId: TRACE_TIME_RANGE_FIELD_ID,\n  operatorId: 'is',\n  value: '',\n};\n\nexport type TraceTimeRangeChipProps = Pick<\n  DateTimeRangePickerProps,\n  | 'preset'\n  | 'onPresetChange'\n  | 'dateFrom'\n  | 'dateTo'\n  | 'onDateChange'\n  | 'onDateRangeChange'\n  | 'disabled'\n  | 'maxRangeMs'\n  | 'minDate'\n  | 'presets'\n> & {\n  /** Shows a × that switches back to this preset whenever another range is selected. */\n  defaultPreset?: DateRangePreset;\n  /** Replaces what the × does, e.g. to undo a histogram zoom before falling back to `defaultPreset`. */\n  onReset?: () => void;\n};\n\nconst isSegment = (target: EventTarget | null) =>\n  target instanceof HTMLElement && target.hasAttribute('data-filter-bar-segment');\n\n/**\n * The trace list's date range rendered as a FilterBar chip: `Time <preset>`. Always\n * present and non-removable; the value segment opens the regular DateTimeRangePicker\n * menu/popover. With `defaultPreset`, a trailing × resets the range to it.\n */\nexport function TraceTimeRangeChip({ defaultPreset, onReset, ...props }: TraceTimeRangeChipProps) {\n  const ctx = useFilterBarContext();\n  const canReset = defaultPreset !== undefined && props.preset !== defaultPreset;\n  return (\n    <FilterBarChip item={TRACE_TIME_RANGE_ITEM} removable={false}>\n      <span className={cn(segmentClass, 'text-foreground')} style={fieldSegmentAccentStyle(TRACE_TIME_RANGE_FIELD)}>\n        <FilterBarFieldLabel field={TRACE_TIME_RANGE_FIELD} />\n      </span>\n      {/* The picker popup is portaled but bubbles React events through here — keep its\n          keystrokes from reaching the chip's arrow-key navigation. */}\n      <div\n        className=\"contents\"\n        onKeyDown={(event: KeyboardEvent<HTMLDivElement>) => {\n          if (!isSegment(event.target)) event.stopPropagation();\n        }}\n      >\n        <DateTimeRangePicker\n          {...props}\n          renderTrigger={({ label, disabled }) => (\n            <button\n              type=\"button\"\n              ref={el => ctx.registerSegment(TRACE_TIME_RANGE_ITEM.id, 'value', el)}\n              data-filter-bar-segment=\"\"\n              disabled={disabled}\n              aria-label={`Value: ${label}`}\n              title={label}\n              className={editableSegmentClass}\n            >\n              <span className=\"truncate\">{label}</span>\n            </button>\n          )}\n        />\n      </div>\n      {canReset && (\n        <button\n          type=\"button\"\n          data-filter-bar-segment=\"\"\n          tabIndex={-1}\n          ref={el => ctx.registerSegment(TRACE_TIME_RANGE_ITEM.id, 'remove', el)}\n          disabled={props.disabled}\n          aria-label=\"Reset time range\"\n          title=\"Reset time range\"\n          className={removeSegmentClass}\n          onClick={() => (onReset ? onReset() : props.onPresetChange?.(defaultPreset))}\n        >\n          <XIcon className=\"size-[1.1em]\" />\n        </button>\n      )}\n    </FilterBarChip>\n  );\n}\n"],"mappings":";;;;;;;AAkBA,IAAa,4BAA4B;;;;;;AAOzC,IAAa,yBAAyC;CACpD,IAAI;CACJ,OAAO;CACP,MAAM,qBAAqB,yBAAyB;CACpD,OAAO,sBAAsB,yBAAyB;CACtD,MAAM;CACN,WAAW,CAAC,IAAI;CAChB,QAAQ;AACV;AAEA,IAAa,wBAAuC;CAClD,IAAI;CACJ,SAAS;CACT,YAAY;CACZ,OAAO;AACT;AAqBA,IAAM,aAAa,WACjB,kBAAkB,eAAe,OAAO,aAAa,yBAAyB;;;;;;AAOhF,SAAgB,mBAAmB,EAAE,eAAe,SAAS,GAAG,SAAkC;CAChG,MAAM,MAAM,oBAAoB;CAChC,MAAM,WAAW,kBAAkB,KAAA,KAAa,MAAM,WAAW;CACjE,OACE,qBAAC,eAAD;EAAe,MAAM;EAAuB,WAAW;EAAvD,UAAA;GACE,oBAAC,QAAD;IAAM,WAAW,GAAG,cAAc,iBAAiB;IAAG,OAAO,wBAAwB,sBAAsB;IACzG,UAAA,oBAAC,qBAAD,EAAqB,OAAO,uBAAyB,CAAA;GACjD,CAAA;GAGN,oBAAC,OAAD;IACE,WAAU;IACV,YAAY,UAAyC;KACnD,IAAI,CAAC,UAAU,MAAM,MAAM,GAAG,MAAM,gBAAgB;IACtD;IAEA,UAAA,oBAAC,qBAAD;KACE,GAAI;KACJ,gBAAgB,EAAE,OAAO,eACvB,oBAAC,UAAD;MACE,MAAK;MACL,MAAK,OAAM,IAAI,gBAAgB,sBAAsB,IAAI,SAAS,EAAE;MACpE,2BAAwB;MACd;MACV,cAAY,UAAU;MACtB,OAAO;MACP,WAAW;MAEX,UAAA,oBAAC,QAAD;OAAM,WAAU;OAAY,UAAA;MAAY,CAAA;KAClC,CAAA;IAEX,CAAA;GACE,CAAA;GACJ,YACC,oBAAC,UAAD;IACE,MAAK;IACL,2BAAwB;IACxB,UAAU;IACV,MAAK,OAAM,IAAI,gBAAgB,sBAAsB,IAAI,UAAU,EAAE;IACrE,UAAU,MAAM;IAChB,cAAW;IACX,OAAM;IACN,WAAW;IACX,eAAgB,UAAU,QAAQ,IAAI,MAAM,iBAAiB,aAAa;IAE1E,UAAA,oBAAC,OAAD,EAAO,WAAU,eAAgB,CAAA;GAC3B,CAAA;EAEG;;AAEnB"}

package/dist/domains/traces/components/traces-explorer/traces-explorer-actions.cjs.js

@@ -1,6 +1,12 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_trace_filters = require("../../../../trace-filters-BpeBUjCb.cjs");
+const require_trace_filters = require("../../../../trace-filters-BNEZ31HX.cjs");
 // src/domains/traces/components/traces-explorer/traces-explorer-actions.ts
+/** Fields the traces list can be sorted by, named like the trace query's `orderBy` fields. */
+var TRACES_SORT_FIELDS = [
+	"startedAt",
+	"timeToFirstChunkMs",
+	"timeToFirstTokenMs"
+];
 var DEFAULT_TRACES_SORT = {
 	field: "startedAt",
 	direction: "desc"
@@ -96,22 +102,19 @@ var applyDateRange = (filters, dateFrom, dateTo) => filters.datePreset === "cust
 	dateFrom,
 	dateTo
 } : filters;
-var ROOT_DURATION_FIELD_IDS = /* @__PURE__ */ new Set(["durationMs"]);
-var NO_FIELD_IDS = /* @__PURE__ */ new Set();
-/** Fields this server can't query on top of the always-unsupported ones: root duration needs its capability. */
-var serverUnqueryableFieldIds = (withRootDuration) => withRootDuration ? NO_FIELD_IDS : ROOT_DURATION_FIELD_IDS;
-var isQueryableToken = (token, withRootDuration) => {
+var isQueryableToken = (token, unqueryableFieldIds) => {
 	if (token.fieldId === "status" && token.value === "running") return false;
 	if (require_trace_filters.TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS.has(token.fieldId)) return false;
-	return !serverUnqueryableFieldIds(withRootDuration).has(token.fieldId);
+	return !unqueryableFieldIds.has(token.fieldId);
 };
 /**
 * Drops the top-level tokens the trace query can't run, so no chip advertises a filter with no effect.
 * Groups pass through and stay visible in the bar: `buildTracesQueryRequest` leaves their unqueryable
 * conditions out of the query. Returns the same object when nothing is dropped.
 */
-var sanitizeTracesFilters = (filters, withRootDuration) => {
-	const tokens = filters.tokens.filter((token) => isQueryableToken(token, withRootDuration));
+var sanitizeTracesFilters = (filters, support) => {
+	const unqueryableFieldIds = require_trace_filters.traceQueryUnqueryableFieldIds(support);
+	const tokens = filters.tokens.filter((token) => isQueryableToken(token, unqueryableFieldIds));
 	return tokens.length === filters.tokens.length ? filters : {
 		...filters,
 		tokens
@@ -137,14 +140,14 @@ var getSelectedStatus = (tokens) => {
 	return value && require_trace_filters.TRACE_STATUS_VALUES.has(value) ? value : void 0;
 };
 /** The trace query for the (sanitized) filters and the resolved date window. */
-var buildTracesQueryRequest = ({ filters, dateFrom, dateTo, withRootDuration, now }) => require_trace_filters.buildTraceQueryRequest({
+var buildTracesQueryRequest = ({ filters, dateFrom, dateTo, now, ...support }) => require_trace_filters.buildTraceQueryRequest({
 	rootEntityType: getSelectedEntityOption(filters.tokens)?.entityType,
 	status: getSelectedStatus(filters.tokens),
 	dateFrom,
 	dateTo,
 	tokens: filters.tokens,
 	groups: filters.groups,
-	excludedFieldIds: serverUnqueryableFieldIds(withRootDuration),
+	excludedFieldIds: require_trace_filters.traceQueryUnqueryableFieldIds(support),
 	now
 });
 /** The `listTracesLight` filters for servers without the trace query API (no groups there). */
@@ -170,6 +173,7 @@ var resolveTracesDateWindow = (datePreset, dateFrom, dateTo) => {
 exports.DEFAULT_TRACES_FILTERS = DEFAULT_TRACES_FILTERS;
 exports.DEFAULT_TRACES_SORT = DEFAULT_TRACES_SORT;
 exports.EMPTY_TRACES_SELECTION = EMPTY_TRACES_SELECTION;
+exports.TRACES_SORT_FIELDS = TRACES_SORT_FIELDS;
 exports.applyDate = applyDate;
 exports.applyDatePreset = applyDatePreset;
 exports.applyDateRange = applyDateRange;

package/dist/domains/traces/components/traces-explorer/traces-explorer-actions.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"traces-explorer-actions.cjs.js","names":["TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS","ROOT_ENTITY_TYPE_OPTIONS","TRACE_STATUS_VALUES","buildTraceQueryRequest","buildTraceListFilters"],"sources":["../../../../../src/domains/traces/components/traces-explorer/traces-explorer-actions.ts"],"sourcesContent":["import { buildTraceListFilters, ROOT_ENTITY_TYPE_OPTIONS, TRACE_STATUS_VALUES } from '../../trace-filters';\nimport type { EntityOptions, TraceFilterGroup, TraceFilterToken, TraceStatusFilter } from '../../trace-filters';\nimport { buildTraceQueryRequest, TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS } from '../../trace-query-filters';\nimport type { SpanTab, TraceDatePreset } from '../../types';\nimport type { TraceSpanView } from '../trace-data-panel-view';\n\nexport type TracesSelection = {\n  traceId?: string;\n  spanId?: string;\n  spanTab?: SpanTab;\n  spanView: TraceSpanView;\n  scoreId?: string;\n  highlightSpanIds: string[];\n};\n\n/** `rootEntityType` and `status` are tokens too (`fieldId: 'rootEntityType' | 'status'`), like every other filter. */\nexport type TracesFilters = {\n  datePreset: TraceDatePreset;\n  /** Only read when `datePreset` is `custom`. */\n  dateFrom?: Date;\n  /** Only read when `datePreset` is `custom`. */\n  dateTo?: Date;\n  tokens: TraceFilterToken[];\n  groups: TraceFilterGroup[];\n};\n\nexport type TracesSortDirection = 'asc' | 'desc';\n\n/** Fields the traces list can be sorted by, named like the trace query's `orderBy` fields. */\nexport type TracesSortField = 'startedAt' | 'timeToFirstChunkMs';\n\nexport type TracesSort = { field: TracesSortField; direction: TracesSortDirection };\n\nexport const DEFAULT_TRACES_SORT: TracesSort = { field: 'startedAt', direction: 'desc' };\n\n/** What the explorer emits on every change: filters and selection move together (a filter edit clears the selection). */\nexport type TracesExplorerState = { selection: TracesSelection; filters: TracesFilters };\n\nexport const EMPTY_TRACES_SELECTION: TracesSelection = { spanView: 'tree', highlightSpanIds: [] };\n\nexport const DEFAULT_TRACES_FILTERS: TracesFilters = { datePreset: 'last-7d', tokens: [], groups: [] };\n\nconst DAY_MS = 24 * 60 * 60 * 1000;\nconst PRESET_MS: Partial<Record<TraceDatePreset, number>> = {\n  'last-24h': DAY_MS,\n  'last-3d': 3 * DAY_MS,\n  'last-7d': 7 * DAY_MS,\n  'last-14d': 14 * DAY_MS,\n  'last-30d': 30 * DAY_MS,\n};\n\nexport const isSelectionEmpty = (selection: TracesSelection) =>\n  !selection.traceId &&\n  !selection.spanId &&\n  !selection.spanTab &&\n  !selection.scoreId &&\n  selection.highlightSpanIds.length === 0;\n\n/** Keeps the span view: it is a display preference, not part of what is selected. */\nexport const clearSelection = (selection: TracesSelection): TracesSelection => ({\n  spanView: selection.spanView,\n  highlightSpanIds: [],\n});\n\nexport const selectTrace = (selection: TracesSelection, traceId: string | null): TracesSelection =>\n  traceId ? { traceId, spanView: selection.spanView, highlightSpanIds: [] } : clearSelection(selection);\n\n/**\n * The open tab stays, so stepping through spans compares the same tab; the score belongs to the\n * previous span and is dropped with it.\n */\nexport const selectSpan = (selection: TracesSelection, spanId: string | null): TracesSelection => {\n  if ((spanId ?? undefined) === selection.spanId) return selection;\n  return { ...selection, spanId: spanId ?? undefined, scoreId: undefined };\n};\n\nexport const setSpanTab = (selection: TracesSelection, tab: SpanTab): TracesSelection => {\n  if (tab === selection.spanTab) return selection;\n  return { ...selection, spanTab: tab === 'details' ? undefined : tab, scoreId: undefined };\n};\n\nexport const setSpanView = (selection: TracesSelection, spanView: TraceSpanView): TracesSelection =>\n  spanView === selection.spanView ? selection : { ...selection, spanView };\n\nexport const selectScore = (selection: TracesSelection, scoreId: string | null): TracesSelection =>\n  (scoreId ?? undefined) === selection.scoreId ? selection : { ...selection, scoreId: scoreId ?? undefined };\n\nexport const highlightSpans = (selection: TracesSelection, spanIds: string[]): TracesSelection => {\n  const unchanged =\n    spanIds.length === selection.highlightSpanIds.length &&\n    spanIds.every((id, index) => id === selection.highlightSpanIds[index]);\n  return unchanged ? selection : { ...selection, highlightSpanIds: spanIds };\n};\n\nexport const applyFilterTokens = (\n  filters: TracesFilters,\n  tokens: TraceFilterToken[],\n  groups: TraceFilterGroup[],\n): TracesFilters => ({ ...filters, tokens, groups });\n\n/** Switching to `custom` keeps the current dates so the picker opens on them; any other preset drops them. */\nexport const applyDatePreset = (filters: TracesFilters, datePreset: TraceDatePreset): TracesFilters =>\n  datePreset === 'custom' ? { ...filters, datePreset } : { datePreset, tokens: filters.tokens, groups: filters.groups };\n\n// The picker can report a date right after switching away from `custom`; those are ignored.\nexport const applyDate = (filters: TracesFilters, date: Date | undefined, end: 'from' | 'to'): TracesFilters => {\n  if (filters.datePreset !== 'custom') return filters;\n  return end === 'from' ? { ...filters, dateFrom: date } : { ...filters, dateTo: date };\n};\n\nexport const applyDateRange = (\n  filters: TracesFilters,\n  dateFrom: Date | undefined,\n  dateTo: Date | undefined,\n): TracesFilters => (filters.datePreset === 'custom' ? { ...filters, dateFrom, dateTo } : filters);\n\nconst ROOT_DURATION_FIELD_IDS: ReadonlySet<string> = new Set(['durationMs']);\nconst NO_FIELD_IDS: ReadonlySet<string> = new Set();\n\n/** Fields this server can't query on top of the always-unsupported ones: root duration needs its capability. */\nconst serverUnqueryableFieldIds = (withRootDuration: boolean) =>\n  withRootDuration ? NO_FIELD_IDS : ROOT_DURATION_FIELD_IDS;\n\nconst isQueryableToken = (token: TraceFilterToken, withRootDuration: boolean) => {\n  if (token.fieldId === 'status' && token.value === 'running') return false;\n  if (TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS.has(token.fieldId)) return false;\n  return !serverUnqueryableFieldIds(withRootDuration).has(token.fieldId);\n};\n\n/**\n * Drops the top-level tokens the trace query can't run, so no chip advertises a filter with no effect.\n * Groups pass through and stay visible in the bar: `buildTracesQueryRequest` leaves their unqueryable\n * conditions out of the query. Returns the same object when nothing is dropped.\n */\nexport const sanitizeTracesFilters = (filters: TracesFilters, withRootDuration: boolean): TracesFilters => {\n  const tokens = filters.tokens.filter(token => isQueryableToken(token, withRootDuration));\n  return tokens.length === filters.tokens.length ? filters : { ...filters, tokens };\n};\n\nconst selectsRunning = (node: TraceFilterGroup | TraceFilterToken): boolean => {\n  if ('nodes' in node) return node.nodes.some(selectsRunning);\n  if (node.fieldId !== 'status') return false;\n  return Array.isArray(node.value) ? node.value.includes('running') : node.value === 'running';\n};\n\n/** Whether a status filter asks for `running`, which the trace query can't express and drops. */\nexport const selectsRunningStatus = (filters: TracesFilters): boolean =>\n  filters.tokens.some(selectsRunning) || filters.groups.some(selectsRunning);\n\nconst tokenValue = (tokens: TraceFilterToken[], fieldId: string) => {\n  const value = tokens.find(token => token.fieldId === fieldId)?.value;\n  return typeof value === 'string' ? value : undefined;\n};\n\nexport const getSelectedEntityOption = (tokens: TraceFilterToken[]): EntityOptions | undefined => {\n  const value = tokenValue(tokens, 'rootEntityType');\n  return ROOT_ENTITY_TYPE_OPTIONS.find(option => option.entityType === value);\n};\n\nexport const getSelectedStatus = (tokens: TraceFilterToken[]): TraceStatusFilter | undefined => {\n  const value = tokenValue(tokens, 'status');\n  return value && TRACE_STATUS_VALUES.has(value as TraceStatusFilter) ? (value as TraceStatusFilter) : undefined;\n};\n\ntype TracesQueryWindow = { filters: TracesFilters; dateFrom?: Date; dateTo?: Date };\n\n/** The trace query for the (sanitized) filters and the resolved date window. */\nexport const buildTracesQueryRequest = ({\n  filters,\n  dateFrom,\n  dateTo,\n  withRootDuration,\n  now,\n}: TracesQueryWindow & { withRootDuration: boolean; now: Date }) =>\n  buildTraceQueryRequest({\n    rootEntityType: getSelectedEntityOption(filters.tokens)?.entityType,\n    status: getSelectedStatus(filters.tokens),\n    dateFrom,\n    dateTo,\n    tokens: filters.tokens,\n    groups: filters.groups,\n    excludedFieldIds: serverUnqueryableFieldIds(withRootDuration),\n    now,\n  });\n\n/** The `listTracesLight` filters for servers without the trace query API (no groups there). */\nexport const buildTracesLegacyFilters = ({ filters, dateFrom, dateTo }: TracesQueryWindow) =>\n  buildTraceListFilters({\n    rootEntityType: getSelectedEntityOption(filters.tokens)?.entityType,\n    status: getSelectedStatus(filters.tokens),\n    dateFrom,\n    dateTo,\n    tokens: filters.tokens,\n  });\n\n/** Rolling presets start `PRESET_MS` before now and stay open-ended; `all` is open on both ends. */\nexport const resolveTracesDateWindow = (\n  datePreset: TraceDatePreset,\n  dateFrom: Date | undefined,\n  dateTo: Date | undefined,\n): { dateFrom?: Date; dateTo?: Date } => {\n  if (datePreset === 'custom') return { dateFrom, dateTo };\n  const ms = PRESET_MS[datePreset];\n  return { dateFrom: ms ? new Date(Date.now() - ms) : undefined, dateTo: undefined };\n};\n"],"mappings":"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"}
+{"version":3,"file":"traces-explorer-actions.cjs.js","names":["TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS","traceQueryUnqueryableFieldIds","ROOT_ENTITY_TYPE_OPTIONS","TRACE_STATUS_VALUES","buildTraceQueryRequest","buildTraceListFilters"],"sources":["../../../../../src/domains/traces/components/traces-explorer/traces-explorer-actions.ts"],"sourcesContent":["import {\n  buildTraceListFilters,\n  ROOT_ENTITY_TYPE_OPTIONS,\n  TRACE_STATUS_VALUES,\n  traceQueryUnqueryableFieldIds,\n} from '../../trace-filters';\nimport type {\n  EntityOptions,\n  TraceFilterGroup,\n  TraceFilterToken,\n  TraceQueryFieldSupport,\n  TraceStatusFilter,\n} from '../../trace-filters';\nimport { buildTraceQueryRequest, TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS } from '../../trace-query-filters';\nimport type { SpanTab, TraceDatePreset } from '../../types';\nimport type { TraceSpanView } from '../trace-data-panel-view';\n\nexport type TracesSelection = {\n  traceId?: string;\n  spanId?: string;\n  spanTab?: SpanTab;\n  spanView: TraceSpanView;\n  scoreId?: string;\n  highlightSpanIds: string[];\n};\n\n/** `rootEntityType` and `status` are tokens too (`fieldId: 'rootEntityType' | 'status'`), like every other filter. */\nexport type TracesFilters = {\n  datePreset: TraceDatePreset;\n  /** Only read when `datePreset` is `custom`. */\n  dateFrom?: Date;\n  /** Only read when `datePreset` is `custom`. */\n  dateTo?: Date;\n  tokens: TraceFilterToken[];\n  groups: TraceFilterGroup[];\n};\n\nexport type TracesSortDirection = 'asc' | 'desc';\n\n/** Fields the traces list can be sorted by, named like the trace query's `orderBy` fields. */\nexport const TRACES_SORT_FIELDS = ['startedAt', 'timeToFirstChunkMs', 'timeToFirstTokenMs'] as const;\nexport type TracesSortField = (typeof TRACES_SORT_FIELDS)[number];\n\nexport type TracesSort = { field: TracesSortField; direction: TracesSortDirection };\n\nexport const DEFAULT_TRACES_SORT: TracesSort = { field: 'startedAt', direction: 'desc' };\n\n/** What the explorer emits on every change: filters and selection move together (a filter edit clears the selection). */\nexport type TracesExplorerState = { selection: TracesSelection; filters: TracesFilters };\n\nexport const EMPTY_TRACES_SELECTION: TracesSelection = { spanView: 'tree', highlightSpanIds: [] };\n\nexport const DEFAULT_TRACES_FILTERS: TracesFilters = { datePreset: 'last-7d', tokens: [], groups: [] };\n\nconst DAY_MS = 24 * 60 * 60 * 1000;\nconst PRESET_MS: Partial<Record<TraceDatePreset, number>> = {\n  'last-24h': DAY_MS,\n  'last-3d': 3 * DAY_MS,\n  'last-7d': 7 * DAY_MS,\n  'last-14d': 14 * DAY_MS,\n  'last-30d': 30 * DAY_MS,\n};\n\nexport const isSelectionEmpty = (selection: TracesSelection) =>\n  !selection.traceId &&\n  !selection.spanId &&\n  !selection.spanTab &&\n  !selection.scoreId &&\n  selection.highlightSpanIds.length === 0;\n\n/** Keeps the span view: it is a display preference, not part of what is selected. */\nexport const clearSelection = (selection: TracesSelection): TracesSelection => ({\n  spanView: selection.spanView,\n  highlightSpanIds: [],\n});\n\nexport const selectTrace = (selection: TracesSelection, traceId: string | null): TracesSelection =>\n  traceId ? { traceId, spanView: selection.spanView, highlightSpanIds: [] } : clearSelection(selection);\n\n/**\n * The open tab stays, so stepping through spans compares the same tab; the score belongs to the\n * previous span and is dropped with it.\n */\nexport const selectSpan = (selection: TracesSelection, spanId: string | null): TracesSelection => {\n  if ((spanId ?? undefined) === selection.spanId) return selection;\n  return { ...selection, spanId: spanId ?? undefined, scoreId: undefined };\n};\n\nexport const setSpanTab = (selection: TracesSelection, tab: SpanTab): TracesSelection => {\n  if (tab === selection.spanTab) return selection;\n  return { ...selection, spanTab: tab === 'details' ? undefined : tab, scoreId: undefined };\n};\n\nexport const setSpanView = (selection: TracesSelection, spanView: TraceSpanView): TracesSelection =>\n  spanView === selection.spanView ? selection : { ...selection, spanView };\n\nexport const selectScore = (selection: TracesSelection, scoreId: string | null): TracesSelection =>\n  (scoreId ?? undefined) === selection.scoreId ? selection : { ...selection, scoreId: scoreId ?? undefined };\n\nexport const highlightSpans = (selection: TracesSelection, spanIds: string[]): TracesSelection => {\n  const unchanged =\n    spanIds.length === selection.highlightSpanIds.length &&\n    spanIds.every((id, index) => id === selection.highlightSpanIds[index]);\n  return unchanged ? selection : { ...selection, highlightSpanIds: spanIds };\n};\n\nexport const applyFilterTokens = (\n  filters: TracesFilters,\n  tokens: TraceFilterToken[],\n  groups: TraceFilterGroup[],\n): TracesFilters => ({ ...filters, tokens, groups });\n\n/** Switching to `custom` keeps the current dates so the picker opens on them; any other preset drops them. */\nexport const applyDatePreset = (filters: TracesFilters, datePreset: TraceDatePreset): TracesFilters =>\n  datePreset === 'custom' ? { ...filters, datePreset } : { datePreset, tokens: filters.tokens, groups: filters.groups };\n\n// The picker can report a date right after switching away from `custom`; those are ignored.\nexport const applyDate = (filters: TracesFilters, date: Date | undefined, end: 'from' | 'to'): TracesFilters => {\n  if (filters.datePreset !== 'custom') return filters;\n  return end === 'from' ? { ...filters, dateFrom: date } : { ...filters, dateTo: date };\n};\n\nexport const applyDateRange = (\n  filters: TracesFilters,\n  dateFrom: Date | undefined,\n  dateTo: Date | undefined,\n): TracesFilters => (filters.datePreset === 'custom' ? { ...filters, dateFrom, dateTo } : filters);\n\nconst isQueryableToken = (token: TraceFilterToken, unqueryableFieldIds: ReadonlySet<string>) => {\n  if (token.fieldId === 'status' && token.value === 'running') return false;\n  if (TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS.has(token.fieldId)) return false;\n  return !unqueryableFieldIds.has(token.fieldId);\n};\n\n/**\n * Drops the top-level tokens the trace query can't run, so no chip advertises a filter with no effect.\n * Groups pass through and stay visible in the bar: `buildTracesQueryRequest` leaves their unqueryable\n * conditions out of the query. Returns the same object when nothing is dropped.\n */\nexport const sanitizeTracesFilters = (filters: TracesFilters, support: TraceQueryFieldSupport): TracesFilters => {\n  const unqueryableFieldIds = traceQueryUnqueryableFieldIds(support);\n  const tokens = filters.tokens.filter(token => isQueryableToken(token, unqueryableFieldIds));\n  return tokens.length === filters.tokens.length ? filters : { ...filters, tokens };\n};\n\nconst selectsRunning = (node: TraceFilterGroup | TraceFilterToken): boolean => {\n  if ('nodes' in node) return node.nodes.some(selectsRunning);\n  if (node.fieldId !== 'status') return false;\n  return Array.isArray(node.value) ? node.value.includes('running') : node.value === 'running';\n};\n\n/** Whether a status filter asks for `running`, which the trace query can't express and drops. */\nexport const selectsRunningStatus = (filters: TracesFilters): boolean =>\n  filters.tokens.some(selectsRunning) || filters.groups.some(selectsRunning);\n\nconst tokenValue = (tokens: TraceFilterToken[], fieldId: string) => {\n  const value = tokens.find(token => token.fieldId === fieldId)?.value;\n  return typeof value === 'string' ? value : undefined;\n};\n\nexport const getSelectedEntityOption = (tokens: TraceFilterToken[]): EntityOptions | undefined => {\n  const value = tokenValue(tokens, 'rootEntityType');\n  return ROOT_ENTITY_TYPE_OPTIONS.find(option => option.entityType === value);\n};\n\nexport const getSelectedStatus = (tokens: TraceFilterToken[]): TraceStatusFilter | undefined => {\n  const value = tokenValue(tokens, 'status');\n  return value && TRACE_STATUS_VALUES.has(value as TraceStatusFilter) ? (value as TraceStatusFilter) : undefined;\n};\n\ntype TracesQueryWindow = { filters: TracesFilters; dateFrom?: Date; dateTo?: Date };\n\n/** The trace query for the (sanitized) filters and the resolved date window. */\nexport const buildTracesQueryRequest = ({\n  filters,\n  dateFrom,\n  dateTo,\n  now,\n  ...support\n}: TracesQueryWindow & TraceQueryFieldSupport & { now: Date }) =>\n  buildTraceQueryRequest({\n    rootEntityType: getSelectedEntityOption(filters.tokens)?.entityType,\n    status: getSelectedStatus(filters.tokens),\n    dateFrom,\n    dateTo,\n    tokens: filters.tokens,\n    groups: filters.groups,\n    excludedFieldIds: traceQueryUnqueryableFieldIds(support),\n    now,\n  });\n\n/** The `listTracesLight` filters for servers without the trace query API (no groups there). */\nexport const buildTracesLegacyFilters = ({ filters, dateFrom, dateTo }: TracesQueryWindow) =>\n  buildTraceListFilters({\n    rootEntityType: getSelectedEntityOption(filters.tokens)?.entityType,\n    status: getSelectedStatus(filters.tokens),\n    dateFrom,\n    dateTo,\n    tokens: filters.tokens,\n  });\n\n/** Rolling presets start `PRESET_MS` before now and stay open-ended; `all` is open on both ends. */\nexport const resolveTracesDateWindow = (\n  datePreset: TraceDatePreset,\n  dateFrom: Date | undefined,\n  dateTo: Date | undefined,\n): { dateFrom?: Date; dateTo?: Date } => {\n  if (datePreset === 'custom') return { dateFrom, dateTo };\n  const ms = PRESET_MS[datePreset];\n  return { dateFrom: ms ? new Date(Date.now() - ms) : undefined, dateTo: undefined };\n};\n"],"mappings":"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"}

package/dist/domains/traces/components/traces-explorer/traces-explorer-actions.es.js

@@ -1,5 +1,11 @@
-import { E as TRACE_STATUS_VALUES, M as buildTraceListFilters, at as buildTraceQueryRequest, it as TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS, r as ROOT_ENTITY_TYPE_OPTIONS } from "../../../../trace-filters-C27yWcan.js";
+import { E as TRACE_STATUS_VALUES, N as buildTraceListFilters, ct as TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS, lt as buildTraceQueryRequest, nt as traceQueryUnqueryableFieldIds, r as ROOT_ENTITY_TYPE_OPTIONS } from "../../../../trace-filters-BJaebsxJ.js";
 // src/domains/traces/components/traces-explorer/traces-explorer-actions.ts
+/** Fields the traces list can be sorted by, named like the trace query's `orderBy` fields. */
+var TRACES_SORT_FIELDS = [
+	"startedAt",
+	"timeToFirstChunkMs",
+	"timeToFirstTokenMs"
+];
 var DEFAULT_TRACES_SORT = {
 	field: "startedAt",
 	direction: "desc"
@@ -95,22 +101,19 @@ var applyDateRange = (filters, dateFrom, dateTo) => filters.datePreset === "cust
 	dateFrom,
 	dateTo
 } : filters;
-var ROOT_DURATION_FIELD_IDS = /* @__PURE__ */ new Set(["durationMs"]);
-var NO_FIELD_IDS = /* @__PURE__ */ new Set();
-/** Fields this server can't query on top of the always-unsupported ones: root duration needs its capability. */
-var serverUnqueryableFieldIds = (withRootDuration) => withRootDuration ? NO_FIELD_IDS : ROOT_DURATION_FIELD_IDS;
-var isQueryableToken = (token, withRootDuration) => {
+var isQueryableToken = (token, unqueryableFieldIds) => {
 	if (token.fieldId === "status" && token.value === "running") return false;
 	if (TRACE_QUERY_UNSUPPORTED_FILTER_FIELDS.has(token.fieldId)) return false;
-	return !serverUnqueryableFieldIds(withRootDuration).has(token.fieldId);
+	return !unqueryableFieldIds.has(token.fieldId);
 };
 /**
 * Drops the top-level tokens the trace query can't run, so no chip advertises a filter with no effect.
 * Groups pass through and stay visible in the bar: `buildTracesQueryRequest` leaves their unqueryable
 * conditions out of the query. Returns the same object when nothing is dropped.
 */
-var sanitizeTracesFilters = (filters, withRootDuration) => {
-	const tokens = filters.tokens.filter((token) => isQueryableToken(token, withRootDuration));
+var sanitizeTracesFilters = (filters, support) => {
+	const unqueryableFieldIds = traceQueryUnqueryableFieldIds(support);
+	const tokens = filters.tokens.filter((token) => isQueryableToken(token, unqueryableFieldIds));
 	return tokens.length === filters.tokens.length ? filters : {
 		...filters,
 		tokens
@@ -136,14 +139,14 @@ var getSelectedStatus = (tokens) => {
 	return value && TRACE_STATUS_VALUES.has(value) ? value : void 0;
 };
 /** The trace query for the (sanitized) filters and the resolved date window. */
-var buildTracesQueryRequest = ({ filters, dateFrom, dateTo, withRootDuration, now }) => buildTraceQueryRequest({
+var buildTracesQueryRequest = ({ filters, dateFrom, dateTo, now, ...support }) => buildTraceQueryRequest({
 	rootEntityType: getSelectedEntityOption(filters.tokens)?.entityType,
 	status: getSelectedStatus(filters.tokens),
 	dateFrom,
 	dateTo,
 	tokens: filters.tokens,
 	groups: filters.groups,
-	excludedFieldIds: serverUnqueryableFieldIds(withRootDuration),
+	excludedFieldIds: traceQueryUnqueryableFieldIds(support),
 	now
 });
 /** The `listTracesLight` filters for servers without the trace query API (no groups there). */
@@ -166,6 +169,6 @@ var resolveTracesDateWindow = (datePreset, dateFrom, dateTo) => {
 		dateTo: void 0
 	};
 };
-export { DEFAULT_TRACES_FILTERS, DEFAULT_TRACES_SORT, EMPTY_TRACES_SELECTION, applyDate, applyDatePreset, applyDateRange, applyFilterTokens, buildTracesLegacyFilters, buildTracesQueryRequest, clearSelection, getSelectedEntityOption, getSelectedStatus, highlightSpans, isSelectionEmpty, resolveTracesDateWindow, sanitizeTracesFilters, selectScore, selectSpan, selectTrace, selectsRunningStatus, setSpanTab, setSpanView };
+export { DEFAULT_TRACES_FILTERS, DEFAULT_TRACES_SORT, EMPTY_TRACES_SELECTION, TRACES_SORT_FIELDS, applyDate, applyDatePreset, applyDateRange, applyFilterTokens, buildTracesLegacyFilters, buildTracesQueryRequest, clearSelection, getSelectedEntityOption, getSelectedStatus, highlightSpans, isSelectionEmpty, resolveTracesDateWindow, sanitizeTracesFilters, selectScore, selectSpan, selectTrace, selectsRunningStatus, setSpanTab, setSpanView };
 
 //# sourceMappingURL=traces-explorer-actions.es.js.map