@mastra/playground-ui 55.0.0 → 56.0.0-alpha.5

package/dist/domains/traces/components.es.js

@@ -1,7 +1,6 @@
 export { formatHierarchicalSpans } from './components/format-hierarchical-spans.es.js';
 export { getSpanTypeUi, spanTypePrefixes } from './components/shared.es.js';
 export { SpanTokenUsage } from './components/span-token-usage.es.js';
-export { TimelineExpandCol } from './components/timeline-expand-col.es.js';
 export { TimelineNameCol } from './components/timeline-name-col.es.js';
 export { TimelineStructureSign } from './components/timeline-structure-sign.es.js';
 export { TimelineTimingCol } from './components/timeline-timing-col.es.js';
@@ -10,23 +9,26 @@ export { TraceTimelineSpan } from './components/trace-timeline-span.es.js';
 export { TraceTimeline } from './components/trace-timeline.es.js';
 export { SpanRows } from './components/span-rows.es.js';
 export { SpanTreeRow } from './components/span-tree-row.es.js';
-export { SpanTimelineCol } from './components/span-timeline-col.es.js';
-export { SpanDurationCol } from './components/span-duration-col.es.js';
+export { SpanTimelineRow } from './components/span-timeline-row.es.js';
 export { SpanTimingHoverCard } from './components/span-timing-hover-card.es.js';
 export { SpanTypeLegend } from './components/span-type-legend.es.js';
 export { TraceSpanTree } from './components/trace-span-tree.es.js';
 export { TraceSpanTimeline } from './components/trace-span-timeline.es.js';
-export { TracesToolbar } from './components/traces-toolbar.es.js';
 export { TraceDataPanelView } from './components/trace-data-panel-view.es.js';
 export { SpanDataPanelView } from './components/span-data-panel-view.es.js';
 export { SpanDetailsView } from './components/span-details-view.es.js';
 export { TraceDetailsView } from './components/trace-details-view.es.js';
-export { TracesLayout } from './components/traces-layout.es.js';
 export { TracesListView } from './components/traces-list-view.es.js';
 export { TracesListModeToggle } from './components/traces-list-mode-toggle.es.js';
 export { TracesErrorContent } from './components/traces-error-content.es.js';
 export { NoTracesInfo } from './components/no-traces-info.es.js';
 export { ThreadTrace } from './components/thread-trace.es.js';
+export { SpanInputRenderer } from './components/span-payload/span-input-renderers.es.js';
+export { SpanOutputRenderer } from './components/span-payload/span-output-renderers.es.js';
+export { SpanErrorRenderer } from './components/span-payload/span-error-renderer.es.js';
+export { SpanPayloadSection } from './components/span-payload/span-payload-section.es.js';
+export { SpanPayloadMessages } from './components/span-payload/span-payload-messages.es.js';
+export { SpanPayloadJson } from './components/span-payload/span-payload-json.es.js';
 export { THREAD_TRACE_SPANS_TAB } from './components/thread-trace/thread-trace-row.es.js';
 export { useThreadTrace } from './components/thread-trace/thread-trace-context.es.js';
 export { useThreadTraceRow } from './components/thread-trace/thread-trace-row-context.es.js';

package/dist/domains/traces/components.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"components.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"components.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/domains/traces/hooks/use-download-trace-json.cjs.js

@@ -6,7 +6,7 @@ const react = require('@mastra/react');
 const reactQuery = require('@tanstack/react-query');
 const React = require('react');
 const domains_traces_hooks_useTraceSpans = require('./use-trace-spans.cjs.js');
-const toast = require('../../../toast-FypW736q.cjs');
+const toast = require('../../../toast-DF-uDV6R.cjs');
 const downloadJson = require('../../../downloadJson-PWUDbzkB.cjs');
 
 function useDownloadTraceJson() {

package/dist/domains/traces/hooks/use-download-trace-json.es.js

@@ -2,7 +2,7 @@ import { useMastraClient } from '@mastra/react';
 import { useQueryClient } from '@tanstack/react-query';
 import { useState } from 'react';
 import { traceSpansQueryOptions } from './use-trace-spans.es.js';
-import { t as toast } from '../../../toast-Xv8jgrMR.js';
+import { t as toast } from '../../../toast-BfIhbri4.js';
 import { d as downloadJson } from '../../../downloadJson-DuPoMa_6.js';
 
 function useDownloadTraceJson() {

package/dist/domains/traces/hooks/use-span-detail.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-span-detail.cjs.js","sources":["../../../../src/domains/traces/hooks/use-span-detail.ts"],"sourcesContent":["import type { LightSpanRecord } from '@mastra/core/storage';\nimport { useMastraClient } from '@mastra/react';\nimport { useQuery } from '@tanstack/react-query';\nimport type { UseQueryResult } from '@tanstack/react-query';\n\nconst IMMUTABLE_CACHE_TIME = 1000 * 60 * 60 * 24 * 30; // 30 days, massive cache, span data is immutable\n\nexport function useSpanDetail(\n  traceId: string | null | undefined,\n  spanId: string | null | undefined,\n): UseQueryResult<{ span: LightSpanRecord & { output?: unknown; result?: unknown } } | null> {\n  const client = useMastraClient();\n\n  return useQuery({\n    queryKey: ['span-detail', traceId, spanId],\n    queryFn: async () => {\n      if (!traceId || !spanId) {\n        throw new Error('Trace ID and Span ID are required');\n      }\n      return client.getSpan(traceId, spanId);\n    },\n    enabled: !!traceId && !!spanId,\n    staleTime: query => {\n      const data = query.state.data;\n\n      if (data?.span?.endedAt) {\n        return IMMUTABLE_CACHE_TIME;\n      }\n\n      return 0;\n    },\n  });\n}\n"],"names":["useMastraClient","useQuery"],"mappings":";;;;;;;AAKA,MAAM,oBAAA,GAAuB,GAAA,GAAO,EAAA,GAAK,EAAA,GAAK,EAAA,GAAK,EAAA;AAE5C,SAAS,aAAA,CACd,SACA,MAAA,EAC2F;AAC3F,EAAA,MAAM,SAASA,qBAAA,EAAgB;AAE/B,EAAA,OAAOC,mBAAA,CAAS;AAAA,IACd,QAAA,EAAU,CAAC,aAAA,EAAe,OAAA,EAAS,MAAM,CAAA;AAAA,IACzC,SAAS,YAAY;AACnB,MAAA,IAAI,CAAC,OAAA,IAAW,CAAC,MAAA,EAAQ;AACvB,QAAA,MAAM,IAAI,MAAM,mCAAmC,CAAA;AAAA,MACrD;AACA,MAAA,OAAO,MAAA,CAAO,OAAA,CAAQ,OAAA,EAAS,MAAM,CAAA;AAAA,IACvC,CAAA;AAAA,IACA,OAAA,EAAS,CAAC,CAAC,OAAA,IAAW,CAAC,CAAC,MAAA;AAAA,IACxB,WAAW,CAAA,KAAA,KAAS;AAClB,MAAA,MAAM,IAAA,GAAO,MAAM,KAAA,CAAM,IAAA;AAEzB,MAAA,IAAI,IAAA,EAAM,MAAM,OAAA,EAAS;AACvB,QAAA,OAAO,oBAAA;AAAA,MACT;AAEA,MAAA,OAAO,CAAA;AAAA,IACT;AAAA,GACD,CAAA;AACH;;;;"}
+{"version":3,"file":"use-span-detail.cjs.js","sources":["../../../../src/domains/traces/hooks/use-span-detail.ts"],"sourcesContent":["import type { MastraClient } from '@mastra/client-js';\nimport { useMastraClient } from '@mastra/react';\nimport { useQuery } from '@tanstack/react-query';\nimport type { UseQueryResult } from '@tanstack/react-query';\n\nconst IMMUTABLE_CACHE_TIME = 1000 * 60 * 60 * 24 * 30; // 30 days, massive cache, span data is immutable\n\ntype SpanDetailResponse = Awaited<ReturnType<MastraClient['getSpan']>>;\n\nexport function useSpanDetail(\n  traceId: string | null | undefined,\n  spanId: string | null | undefined,\n): UseQueryResult<SpanDetailResponse | null> {\n  const client = useMastraClient();\n\n  return useQuery({\n    queryKey: ['span-detail', traceId, spanId],\n    queryFn: async () => {\n      if (!traceId || !spanId) {\n        throw new Error('Trace ID and Span ID are required');\n      }\n      return client.getSpan(traceId, spanId);\n    },\n    enabled: !!traceId && !!spanId,\n    staleTime: query => {\n      const data = query.state.data;\n\n      if (data?.span?.endedAt) {\n        return IMMUTABLE_CACHE_TIME;\n      }\n\n      return 0;\n    },\n  });\n}\n"],"names":["useMastraClient","useQuery"],"mappings":";;;;;;;AAKA,MAAM,oBAAA,GAAuB,GAAA,GAAO,EAAA,GAAK,EAAA,GAAK,EAAA,GAAK,EAAA;AAI5C,SAAS,aAAA,CACd,SACA,MAAA,EAC2C;AAC3C,EAAA,MAAM,SAASA,qBAAA,EAAgB;AAE/B,EAAA,OAAOC,mBAAA,CAAS;AAAA,IACd,QAAA,EAAU,CAAC,aAAA,EAAe,OAAA,EAAS,MAAM,CAAA;AAAA,IACzC,SAAS,YAAY;AACnB,MAAA,IAAI,CAAC,OAAA,IAAW,CAAC,MAAA,EAAQ;AACvB,QAAA,MAAM,IAAI,MAAM,mCAAmC,CAAA;AAAA,MACrD;AACA,MAAA,OAAO,MAAA,CAAO,OAAA,CAAQ,OAAA,EAAS,MAAM,CAAA;AAAA,IACvC,CAAA;AAAA,IACA,OAAA,EAAS,CAAC,CAAC,OAAA,IAAW,CAAC,CAAC,MAAA;AAAA,IACxB,WAAW,CAAA,KAAA,KAAS;AAClB,MAAA,MAAM,IAAA,GAAO,MAAM,KAAA,CAAM,IAAA;AAEzB,MAAA,IAAI,IAAA,EAAM,MAAM,OAAA,EAAS;AACvB,QAAA,OAAO,oBAAA;AAAA,MACT;AAEA,MAAA,OAAO,CAAA;AAAA,IACT;AAAA,GACD,CAAA;AACH;;;;"}

package/dist/domains/traces/hooks/use-span-detail.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-span-detail.es.js","sources":["../../../../src/domains/traces/hooks/use-span-detail.ts"],"sourcesContent":["import type { LightSpanRecord } from '@mastra/core/storage';\nimport { useMastraClient } from '@mastra/react';\nimport { useQuery } from '@tanstack/react-query';\nimport type { UseQueryResult } from '@tanstack/react-query';\n\nconst IMMUTABLE_CACHE_TIME = 1000 * 60 * 60 * 24 * 30; // 30 days, massive cache, span data is immutable\n\nexport function useSpanDetail(\n  traceId: string | null | undefined,\n  spanId: string | null | undefined,\n): UseQueryResult<{ span: LightSpanRecord & { output?: unknown; result?: unknown } } | null> {\n  const client = useMastraClient();\n\n  return useQuery({\n    queryKey: ['span-detail', traceId, spanId],\n    queryFn: async () => {\n      if (!traceId || !spanId) {\n        throw new Error('Trace ID and Span ID are required');\n      }\n      return client.getSpan(traceId, spanId);\n    },\n    enabled: !!traceId && !!spanId,\n    staleTime: query => {\n      const data = query.state.data;\n\n      if (data?.span?.endedAt) {\n        return IMMUTABLE_CACHE_TIME;\n      }\n\n      return 0;\n    },\n  });\n}\n"],"names":[],"mappings":";;;AAKA,MAAM,oBAAA,GAAuB,GAAA,GAAO,EAAA,GAAK,EAAA,GAAK,EAAA,GAAK,EAAA;AAE5C,SAAS,aAAA,CACd,SACA,MAAA,EAC2F;AAC3F,EAAA,MAAM,SAAS,eAAA,EAAgB;AAE/B,EAAA,OAAO,QAAA,CAAS;AAAA,IACd,QAAA,EAAU,CAAC,aAAA,EAAe,OAAA,EAAS,MAAM,CAAA;AAAA,IACzC,SAAS,YAAY;AACnB,MAAA,IAAI,CAAC,OAAA,IAAW,CAAC,MAAA,EAAQ;AACvB,QAAA,MAAM,IAAI,MAAM,mCAAmC,CAAA;AAAA,MACrD;AACA,MAAA,OAAO,MAAA,CAAO,OAAA,CAAQ,OAAA,EAAS,MAAM,CAAA;AAAA,IACvC,CAAA;AAAA,IACA,OAAA,EAAS,CAAC,CAAC,OAAA,IAAW,CAAC,CAAC,MAAA;AAAA,IACxB,WAAW,CAAA,KAAA,KAAS;AAClB,MAAA,MAAM,IAAA,GAAO,MAAM,KAAA,CAAM,IAAA;AAEzB,MAAA,IAAI,IAAA,EAAM,MAAM,OAAA,EAAS;AACvB,QAAA,OAAO,oBAAA;AAAA,MACT;AAEA,MAAA,OAAO,CAAA;AAAA,IACT;AAAA,GACD,CAAA;AACH;;;;"}
+{"version":3,"file":"use-span-detail.es.js","sources":["../../../../src/domains/traces/hooks/use-span-detail.ts"],"sourcesContent":["import type { MastraClient } from '@mastra/client-js';\nimport { useMastraClient } from '@mastra/react';\nimport { useQuery } from '@tanstack/react-query';\nimport type { UseQueryResult } from '@tanstack/react-query';\n\nconst IMMUTABLE_CACHE_TIME = 1000 * 60 * 60 * 24 * 30; // 30 days, massive cache, span data is immutable\n\ntype SpanDetailResponse = Awaited<ReturnType<MastraClient['getSpan']>>;\n\nexport function useSpanDetail(\n  traceId: string | null | undefined,\n  spanId: string | null | undefined,\n): UseQueryResult<SpanDetailResponse | null> {\n  const client = useMastraClient();\n\n  return useQuery({\n    queryKey: ['span-detail', traceId, spanId],\n    queryFn: async () => {\n      if (!traceId || !spanId) {\n        throw new Error('Trace ID and Span ID are required');\n      }\n      return client.getSpan(traceId, spanId);\n    },\n    enabled: !!traceId && !!spanId,\n    staleTime: query => {\n      const data = query.state.data;\n\n      if (data?.span?.endedAt) {\n        return IMMUTABLE_CACHE_TIME;\n      }\n\n      return 0;\n    },\n  });\n}\n"],"names":[],"mappings":";;;AAKA,MAAM,oBAAA,GAAuB,GAAA,GAAO,EAAA,GAAK,EAAA,GAAK,EAAA,GAAK,EAAA;AAI5C,SAAS,aAAA,CACd,SACA,MAAA,EAC2C;AAC3C,EAAA,MAAM,SAAS,eAAA,EAAgB;AAE/B,EAAA,OAAO,QAAA,CAAS;AAAA,IACd,QAAA,EAAU,CAAC,aAAA,EAAe,OAAA,EAAS,MAAM,CAAA;AAAA,IACzC,SAAS,YAAY;AACnB,MAAA,IAAI,CAAC,OAAA,IAAW,CAAC,MAAA,EAAQ;AACvB,QAAA,MAAM,IAAI,MAAM,mCAAmC,CAAA;AAAA,MACrD;AACA,MAAA,OAAO,MAAA,CAAO,OAAA,CAAQ,OAAA,EAAS,MAAM,CAAA;AAAA,IACvC,CAAA;AAAA,IACA,OAAA,EAAS,CAAC,CAAC,OAAA,IAAW,CAAC,CAAC,MAAA;AAAA,IACxB,WAAW,CAAA,KAAA,KAAS;AAClB,MAAA,MAAM,IAAA,GAAO,MAAM,KAAA,CAAM,IAAA;AAEzB,MAAA,IAAI,IAAA,EAAM,MAAM,OAAA,EAAS;AACvB,QAAA,OAAO,oBAAA;AAAA,MACT;AAEA,MAAA,OAAO,CAAA;AAAA,IACT;AAAA,GACD,CAAA;AACH;;;;"}

package/dist/domains/traces/hooks/use-trace-query.cjs.js

@@ -0,0 +1,90 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const clientJs = require('@mastra/client-js');
+const react = require('@mastra/react');
+const reactQuery = require('@tanstack/react-query');
+const React = require('react');
+const hooks_useInView = require('../../../hooks/use-in-view.cjs.js');
+
+const TRACE_QUERY_PER_PAGE = 25;
+function getTraceQueryNextPageParam(lastPage) {
+  return lastPage?.page.next ?? void 0;
+}
+function selectTraceQueryTraces(data) {
+  const seen = /* @__PURE__ */ new Set();
+  return data.pages.flatMap(
+    (page) => page.traces.filter((trace) => {
+      if (seen.has(trace.traceId)) return false;
+      seen.add(trace.traceId);
+      return true;
+    })
+  );
+}
+function useTraceQuery({
+  query,
+  limit = TRACE_QUERY_PER_PAGE,
+  enabled = true,
+  refetchInterval,
+  refetchOnWindowFocus
+}) {
+  const client = react.useMastraClient();
+  const { inView, setRef: setEndOfListElement } = hooks_useInView.useInView();
+  const result = reactQuery.useInfiniteQuery({
+    queryKey: ["trace-query", query, limit],
+    queryFn: query ? async ({ pageParam }) => {
+      const queryClient = new clientJs.MastraClient({ ...client.options, retries: 0 });
+      const response = await queryClient.queryTraces({ ...query, page: { limit, after: pageParam ?? null } });
+      if ("page" in response) return response;
+      throw new Error("Expected a cursor-paginated trace query response");
+    } : reactQuery.skipToken,
+    initialPageParam: void 0,
+    getNextPageParam: getTraceQueryNextPageParam,
+    select: selectTraceQueryTraces,
+    retry: false,
+    placeholderData: reactQuery.keepPreviousData,
+    refetchInterval,
+    refetchOnWindowFocus,
+    enabled
+  });
+  const {
+    data,
+    hasNextPage,
+    isFetchingNextPage,
+    fetchNextPage,
+    isLoading,
+    isFetching,
+    isRefetching,
+    fetchStatus,
+    isError,
+    error,
+    refetch,
+    isFetchNextPageError
+  } = result;
+  React.useEffect(() => {
+    if (enabled && inView && hasNextPage && !isFetching && !isFetchNextPageError) {
+      void fetchNextPage();
+    }
+  }, [enabled, inView, hasNextPage, isFetching, isFetchNextPageError, fetchNextPage]);
+  return {
+    data,
+    hasNextPage,
+    isFetchingNextPage,
+    fetchNextPage,
+    isLoading,
+    isFetching,
+    isRefetching,
+    fetchStatus,
+    isError,
+    error,
+    refetch,
+    setEndOfListElement
+  };
+}
+
+exports.TRACE_QUERY_PER_PAGE = TRACE_QUERY_PER_PAGE;
+exports.getTraceQueryNextPageParam = getTraceQueryNextPageParam;
+exports.selectTraceQueryTraces = selectTraceQueryTraces;
+exports.useTraceQuery = useTraceQuery;
+//# sourceMappingURL=use-trace-query.cjs.js.map

package/dist/domains/traces/hooks/use-trace-query.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-trace-query.cjs.js","sources":["../../../../src/domains/traces/hooks/use-trace-query.ts"],"sourcesContent":["import { MastraClient } from '@mastra/client-js';\nimport type { QueryTracesInput } from '@mastra/client-js';\nimport { useMastraClient } from '@mastra/react';\nimport { keepPreviousData, skipToken, useInfiniteQuery } from '@tanstack/react-query';\nimport { useEffect } from 'react';\nimport { useInView } from '@/hooks/use-in-view';\n\nexport const TRACE_QUERY_PER_PAGE = 25;\n\ntype TraceQueryResponse = Awaited<ReturnType<MastraClient['queryTraces']>>;\ntype TraceQueryCursorResponse = Extract<TraceQueryResponse, { page: { next: string | null } }>;\ntype TraceQueryTrace = TraceQueryResponse['traces'][number];\n\nexport type TraceQueryArgs = Omit<QueryTracesInput, 'page' | 'pagination'>;\n\nexport interface UseTraceQueryArgs {\n  query: TraceQueryArgs | undefined;\n  limit?: number;\n  enabled?: boolean;\n  refetchInterval?: number | false;\n  refetchOnWindowFocus?: boolean;\n}\n\nexport interface UseTraceQueryReturn {\n  data: TraceQueryTrace[] | undefined;\n  hasNextPage: boolean;\n  isFetchingNextPage: boolean;\n  fetchNextPage: () => void;\n  isLoading: boolean;\n  isFetching: boolean;\n  isRefetching: boolean;\n  fetchStatus: 'idle' | 'fetching' | 'paused';\n  isError: boolean;\n  error: Error | null;\n  refetch: () => void;\n  setEndOfListElement: (node: HTMLDivElement | null) => void;\n}\n\nexport function getTraceQueryNextPageParam(lastPage: TraceQueryCursorResponse | undefined): string | undefined {\n  return lastPage?.page.next ?? undefined;\n}\n\nexport function selectTraceQueryTraces(data: { pages: TraceQueryCursorResponse[] }): TraceQueryTrace[] {\n  const seen = new Set<string>();\n  return data.pages.flatMap(page =>\n    page.traces.filter(trace => {\n      if (seen.has(trace.traceId)) return false;\n      seen.add(trace.traceId);\n      return true;\n    }),\n  );\n}\n\n/** Queries traces with cursor pagination and viewport-driven loading. */\nexport function useTraceQuery({\n  query,\n  limit = TRACE_QUERY_PER_PAGE,\n  enabled = true,\n  refetchInterval,\n  refetchOnWindowFocus,\n}: UseTraceQueryArgs): UseTraceQueryReturn {\n  const client = useMastraClient();\n  const { inView, setRef: setEndOfListElement } = useInView();\n  const result = useInfiniteQuery<\n    TraceQueryCursorResponse,\n    Error,\n    TraceQueryTrace[],\n    readonly unknown[],\n    string | undefined\n  >({\n    queryKey: ['trace-query', query, limit] as const,\n    queryFn: query\n      ? async ({ pageParam }) => {\n          // Capability failures must reach the fallback without the SDK retrying 501 responses.\n          const queryClient = new MastraClient({ ...client.options, retries: 0 });\n          const response = await queryClient.queryTraces({ ...query, page: { limit, after: pageParam ?? null } });\n          if ('page' in response) return response;\n          throw new Error('Expected a cursor-paginated trace query response');\n        }\n      : skipToken,\n    initialPageParam: undefined,\n    getNextPageParam: getTraceQueryNextPageParam,\n    select: selectTraceQueryTraces,\n    retry: false,\n    placeholderData: keepPreviousData,\n    refetchInterval,\n    refetchOnWindowFocus,\n    enabled,\n  });\n  const {\n    data,\n    hasNextPage,\n    isFetchingNextPage,\n    fetchNextPage,\n    isLoading,\n    isFetching,\n    isRefetching,\n    fetchStatus,\n    isError,\n    error,\n    refetch,\n    isFetchNextPageError,\n  } = result;\n\n  useEffect(() => {\n    if (enabled && inView && hasNextPage && !isFetching && !isFetchNextPageError) {\n      void fetchNextPage();\n    }\n  }, [enabled, inView, hasNextPage, isFetching, isFetchNextPageError, fetchNextPage]);\n\n  return {\n    data,\n    hasNextPage,\n    isFetchingNextPage,\n    fetchNextPage,\n    isLoading,\n    isFetching,\n    isRefetching,\n    fetchStatus,\n    isError,\n    error,\n    refetch,\n    setEndOfListElement,\n  };\n}\n"],"names":["useMastraClient","useInView","useInfiniteQuery","MastraClient","skipToken","keepPreviousData","useEffect"],"mappings":";;;;;;;;;;AAOO,MAAM,oBAAA,GAAuB;AA+B7B,SAAS,2BAA2B,QAAA,EAAoE;AAC7G,EAAA,OAAO,QAAA,EAAU,KAAK,IAAA,IAAQ,MAAA;AAChC;AAEO,SAAS,uBAAuB,IAAA,EAAgE;AACrG,EAAA,MAAM,IAAA,uBAAW,GAAA,EAAY;AAC7B,EAAA,OAAO,KAAK,KAAA,CAAM,OAAA;AAAA,IAAQ,CAAA,IAAA,KACxB,IAAA,CAAK,MAAA,CAAO,MAAA,CAAO,CAAA,KAAA,KAAS;AAC1B,MAAA,IAAI,IAAA,CAAK,GAAA,CAAI,KAAA,CAAM,OAAO,GAAG,OAAO,KAAA;AACpC,MAAA,IAAA,CAAK,GAAA,CAAI,MAAM,OAAO,CAAA;AACtB,MAAA,OAAO,IAAA;AAAA,IACT,CAAC;AAAA,GACH;AACF;AAGO,SAAS,aAAA,CAAc;AAAA,EAC5B,KAAA;AAAA,EACA,KAAA,GAAQ,oBAAA;AAAA,EACR,OAAA,GAAU,IAAA;AAAA,EACV,eAAA;AAAA,EACA;AACF,CAAA,EAA2C;AACzC,EAAA,MAAM,SAASA,qBAAA,EAAgB;AAC/B,EAAA,MAAM,EAAE,MAAA,EAAQ,MAAA,EAAQ,mBAAA,KAAwBC,yBAAA,EAAU;AAC1D,EAAA,MAAM,SAASC,2BAAA,CAMb;AAAA,IACA,QAAA,EAAU,CAAC,aAAA,EAAe,KAAA,EAAO,KAAK,CAAA;AAAA,IACtC,OAAA,EAAS,KAAA,GACL,OAAO,EAAE,WAAU,KAAM;AAEvB,MAAA,MAAM,WAAA,GAAc,IAAIC,qBAAA,CAAa,EAAE,GAAG,MAAA,CAAO,OAAA,EAAS,OAAA,EAAS,CAAA,EAAG,CAAA;AACtE,MAAA,MAAM,QAAA,GAAW,MAAM,WAAA,CAAY,WAAA,CAAY,EAAE,GAAG,KAAA,EAAO,IAAA,EAAM,EAAE,KAAA,EAAO,KAAA,EAAO,SAAA,IAAa,IAAA,IAAQ,CAAA;AACtG,MAAA,IAAI,MAAA,IAAU,UAAU,OAAO,QAAA;AAC/B,MAAA,MAAM,IAAI,MAAM,kDAAkD,CAAA;AAAA,IACpE,CAAA,GACAC,oBAAA;AAAA,IACJ,gBAAA,EAAkB,MAAA;AAAA,IAClB,gBAAA,EAAkB,0BAAA;AAAA,IAClB,MAAA,EAAQ,sBAAA;AAAA,IACR,KAAA,EAAO,KAAA;AAAA,IACP,eAAA,EAAiBC,2BAAA;AAAA,IACjB,eAAA;AAAA,IACA,oBAAA;AAAA,IACA;AAAA,GACD,CAAA;AACD,EAAA,MAAM;AAAA,IACJ,IAAA;AAAA,IACA,WAAA;AAAA,IACA,kBAAA;AAAA,IACA,aAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA;AAAA,GACF,GAAI,MAAA;AAEJ,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,WAAW,MAAA,IAAU,WAAA,IAAe,CAAC,UAAA,IAAc,CAAC,oBAAA,EAAsB;AAC5E,MAAA,KAAK,aAAA,EAAc;AAAA,IACrB;AAAA,EACF,CAAA,EAAG,CAAC,OAAA,EAAS,MAAA,EAAQ,aAAa,UAAA,EAAY,oBAAA,EAAsB,aAAa,CAAC,CAAA;AAElF,EAAA,OAAO;AAAA,IACL,IAAA;AAAA,IACA,WAAA;AAAA,IACA,kBAAA;AAAA,IACA,aAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA;AAAA,GACF;AACF;;;;;;;"}

package/dist/domains/traces/hooks/use-trace-query.d.ts

@@ -0,0 +1,2 @@
+export * from '../../../src/domains/traces/hooks/use-trace-query'
+export {}

package/dist/domains/traces/hooks/use-trace-query.es.js

@@ -0,0 +1,83 @@
+import { MastraClient } from '@mastra/client-js';
+import { useMastraClient } from '@mastra/react';
+import { useInfiniteQuery, keepPreviousData, skipToken } from '@tanstack/react-query';
+import { useEffect } from 'react';
+import { useInView } from '../../../hooks/use-in-view.es.js';
+
+const TRACE_QUERY_PER_PAGE = 25;
+function getTraceQueryNextPageParam(lastPage) {
+  return lastPage?.page.next ?? void 0;
+}
+function selectTraceQueryTraces(data) {
+  const seen = /* @__PURE__ */ new Set();
+  return data.pages.flatMap(
+    (page) => page.traces.filter((trace) => {
+      if (seen.has(trace.traceId)) return false;
+      seen.add(trace.traceId);
+      return true;
+    })
+  );
+}
+function useTraceQuery({
+  query,
+  limit = TRACE_QUERY_PER_PAGE,
+  enabled = true,
+  refetchInterval,
+  refetchOnWindowFocus
+}) {
+  const client = useMastraClient();
+  const { inView, setRef: setEndOfListElement } = useInView();
+  const result = useInfiniteQuery({
+    queryKey: ["trace-query", query, limit],
+    queryFn: query ? async ({ pageParam }) => {
+      const queryClient = new MastraClient({ ...client.options, retries: 0 });
+      const response = await queryClient.queryTraces({ ...query, page: { limit, after: pageParam ?? null } });
+      if ("page" in response) return response;
+      throw new Error("Expected a cursor-paginated trace query response");
+    } : skipToken,
+    initialPageParam: void 0,
+    getNextPageParam: getTraceQueryNextPageParam,
+    select: selectTraceQueryTraces,
+    retry: false,
+    placeholderData: keepPreviousData,
+    refetchInterval,
+    refetchOnWindowFocus,
+    enabled
+  });
+  const {
+    data,
+    hasNextPage,
+    isFetchingNextPage,
+    fetchNextPage,
+    isLoading,
+    isFetching,
+    isRefetching,
+    fetchStatus,
+    isError,
+    error,
+    refetch,
+    isFetchNextPageError
+  } = result;
+  useEffect(() => {
+    if (enabled && inView && hasNextPage && !isFetching && !isFetchNextPageError) {
+      void fetchNextPage();
+    }
+  }, [enabled, inView, hasNextPage, isFetching, isFetchNextPageError, fetchNextPage]);
+  return {
+    data,
+    hasNextPage,
+    isFetchingNextPage,
+    fetchNextPage,
+    isLoading,
+    isFetching,
+    isRefetching,
+    fetchStatus,
+    isError,
+    error,
+    refetch,
+    setEndOfListElement
+  };
+}
+
+export { TRACE_QUERY_PER_PAGE, getTraceQueryNextPageParam, selectTraceQueryTraces, useTraceQuery };
+//# sourceMappingURL=use-trace-query.es.js.map

package/dist/domains/traces/hooks/use-trace-query.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-trace-query.es.js","sources":["../../../../src/domains/traces/hooks/use-trace-query.ts"],"sourcesContent":["import { MastraClient } from '@mastra/client-js';\nimport type { QueryTracesInput } from '@mastra/client-js';\nimport { useMastraClient } from '@mastra/react';\nimport { keepPreviousData, skipToken, useInfiniteQuery } from '@tanstack/react-query';\nimport { useEffect } from 'react';\nimport { useInView } from '@/hooks/use-in-view';\n\nexport const TRACE_QUERY_PER_PAGE = 25;\n\ntype TraceQueryResponse = Awaited<ReturnType<MastraClient['queryTraces']>>;\ntype TraceQueryCursorResponse = Extract<TraceQueryResponse, { page: { next: string | null } }>;\ntype TraceQueryTrace = TraceQueryResponse['traces'][number];\n\nexport type TraceQueryArgs = Omit<QueryTracesInput, 'page' | 'pagination'>;\n\nexport interface UseTraceQueryArgs {\n  query: TraceQueryArgs | undefined;\n  limit?: number;\n  enabled?: boolean;\n  refetchInterval?: number | false;\n  refetchOnWindowFocus?: boolean;\n}\n\nexport interface UseTraceQueryReturn {\n  data: TraceQueryTrace[] | undefined;\n  hasNextPage: boolean;\n  isFetchingNextPage: boolean;\n  fetchNextPage: () => void;\n  isLoading: boolean;\n  isFetching: boolean;\n  isRefetching: boolean;\n  fetchStatus: 'idle' | 'fetching' | 'paused';\n  isError: boolean;\n  error: Error | null;\n  refetch: () => void;\n  setEndOfListElement: (node: HTMLDivElement | null) => void;\n}\n\nexport function getTraceQueryNextPageParam(lastPage: TraceQueryCursorResponse | undefined): string | undefined {\n  return lastPage?.page.next ?? undefined;\n}\n\nexport function selectTraceQueryTraces(data: { pages: TraceQueryCursorResponse[] }): TraceQueryTrace[] {\n  const seen = new Set<string>();\n  return data.pages.flatMap(page =>\n    page.traces.filter(trace => {\n      if (seen.has(trace.traceId)) return false;\n      seen.add(trace.traceId);\n      return true;\n    }),\n  );\n}\n\n/** Queries traces with cursor pagination and viewport-driven loading. */\nexport function useTraceQuery({\n  query,\n  limit = TRACE_QUERY_PER_PAGE,\n  enabled = true,\n  refetchInterval,\n  refetchOnWindowFocus,\n}: UseTraceQueryArgs): UseTraceQueryReturn {\n  const client = useMastraClient();\n  const { inView, setRef: setEndOfListElement } = useInView();\n  const result = useInfiniteQuery<\n    TraceQueryCursorResponse,\n    Error,\n    TraceQueryTrace[],\n    readonly unknown[],\n    string | undefined\n  >({\n    queryKey: ['trace-query', query, limit] as const,\n    queryFn: query\n      ? async ({ pageParam }) => {\n          // Capability failures must reach the fallback without the SDK retrying 501 responses.\n          const queryClient = new MastraClient({ ...client.options, retries: 0 });\n          const response = await queryClient.queryTraces({ ...query, page: { limit, after: pageParam ?? null } });\n          if ('page' in response) return response;\n          throw new Error('Expected a cursor-paginated trace query response');\n        }\n      : skipToken,\n    initialPageParam: undefined,\n    getNextPageParam: getTraceQueryNextPageParam,\n    select: selectTraceQueryTraces,\n    retry: false,\n    placeholderData: keepPreviousData,\n    refetchInterval,\n    refetchOnWindowFocus,\n    enabled,\n  });\n  const {\n    data,\n    hasNextPage,\n    isFetchingNextPage,\n    fetchNextPage,\n    isLoading,\n    isFetching,\n    isRefetching,\n    fetchStatus,\n    isError,\n    error,\n    refetch,\n    isFetchNextPageError,\n  } = result;\n\n  useEffect(() => {\n    if (enabled && inView && hasNextPage && !isFetching && !isFetchNextPageError) {\n      void fetchNextPage();\n    }\n  }, [enabled, inView, hasNextPage, isFetching, isFetchNextPageError, fetchNextPage]);\n\n  return {\n    data,\n    hasNextPage,\n    isFetchingNextPage,\n    fetchNextPage,\n    isLoading,\n    isFetching,\n    isRefetching,\n    fetchStatus,\n    isError,\n    error,\n    refetch,\n    setEndOfListElement,\n  };\n}\n"],"names":[],"mappings":";;;;;;AAOO,MAAM,oBAAA,GAAuB;AA+B7B,SAAS,2BAA2B,QAAA,EAAoE;AAC7G,EAAA,OAAO,QAAA,EAAU,KAAK,IAAA,IAAQ,MAAA;AAChC;AAEO,SAAS,uBAAuB,IAAA,EAAgE;AACrG,EAAA,MAAM,IAAA,uBAAW,GAAA,EAAY;AAC7B,EAAA,OAAO,KAAK,KAAA,CAAM,OAAA;AAAA,IAAQ,CAAA,IAAA,KACxB,IAAA,CAAK,MAAA,CAAO,MAAA,CAAO,CAAA,KAAA,KAAS;AAC1B,MAAA,IAAI,IAAA,CAAK,GAAA,CAAI,KAAA,CAAM,OAAO,GAAG,OAAO,KAAA;AACpC,MAAA,IAAA,CAAK,GAAA,CAAI,MAAM,OAAO,CAAA;AACtB,MAAA,OAAO,IAAA;AAAA,IACT,CAAC;AAAA,GACH;AACF;AAGO,SAAS,aAAA,CAAc;AAAA,EAC5B,KAAA;AAAA,EACA,KAAA,GAAQ,oBAAA;AAAA,EACR,OAAA,GAAU,IAAA;AAAA,EACV,eAAA;AAAA,EACA;AACF,CAAA,EAA2C;AACzC,EAAA,MAAM,SAAS,eAAA,EAAgB;AAC/B,EAAA,MAAM,EAAE,MAAA,EAAQ,MAAA,EAAQ,mBAAA,KAAwB,SAAA,EAAU;AAC1D,EAAA,MAAM,SAAS,gBAAA,CAMb;AAAA,IACA,QAAA,EAAU,CAAC,aAAA,EAAe,KAAA,EAAO,KAAK,CAAA;AAAA,IACtC,OAAA,EAAS,KAAA,GACL,OAAO,EAAE,WAAU,KAAM;AAEvB,MAAA,MAAM,WAAA,GAAc,IAAI,YAAA,CAAa,EAAE,GAAG,MAAA,CAAO,OAAA,EAAS,OAAA,EAAS,CAAA,EAAG,CAAA;AACtE,MAAA,MAAM,QAAA,GAAW,MAAM,WAAA,CAAY,WAAA,CAAY,EAAE,GAAG,KAAA,EAAO,IAAA,EAAM,EAAE,KAAA,EAAO,KAAA,EAAO,SAAA,IAAa,IAAA,IAAQ,CAAA;AACtG,MAAA,IAAI,MAAA,IAAU,UAAU,OAAO,QAAA;AAC/B,MAAA,MAAM,IAAI,MAAM,kDAAkD,CAAA;AAAA,IACpE,CAAA,GACA,SAAA;AAAA,IACJ,gBAAA,EAAkB,MAAA;AAAA,IAClB,gBAAA,EAAkB,0BAAA;AAAA,IAClB,MAAA,EAAQ,sBAAA;AAAA,IACR,KAAA,EAAO,KAAA;AAAA,IACP,eAAA,EAAiB,gBAAA;AAAA,IACjB,eAAA;AAAA,IACA,oBAAA;AAAA,IACA;AAAA,GACD,CAAA;AACD,EAAA,MAAM;AAAA,IACJ,IAAA;AAAA,IACA,WAAA;AAAA,IACA,kBAAA;AAAA,IACA,aAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA;AAAA,GACF,GAAI,MAAA;AAEJ,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,WAAW,MAAA,IAAU,WAAA,IAAe,CAAC,UAAA,IAAc,CAAC,oBAAA,EAAsB;AAC5E,MAAA,KAAK,aAAA,EAAc;AAAA,IACrB;AAAA,EACF,CAAA,EAAG,CAAC,OAAA,EAAS,MAAA,EAAQ,aAAa,UAAA,EAAY,oBAAA,EAAsB,aAAa,CAAC,CAAA;AAElF,EAAA,OAAO;AAAA,IACL,IAAA;AAAA,IACA,WAAA;AAAA,IACA,kBAAA;AAAA,IACA,aAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}

package/dist/domains/traces/hooks/use-trace-span-navigation.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-trace-span-navigation.cjs.js","sources":["../../../../src/domains/traces/hooks/use-trace-span-navigation.tsx"],"sourcesContent":["import type { LightSpanRecord } from '@mastra/core/storage';\nimport { useMemo } from 'react';\nimport { formatHierarchicalSpans } from '../components/format-hierarchical-spans';\nimport { getAllSpanIds } from './get-all-span-ids';\n\n/**\n * Derives previous/next span navigation handlers from a trace's lightweight spans.\n * Returns undefined for handlers that are out of bounds so the consumer can render disabled UI.\n */\nexport function useTraceSpanNavigation(\n  lightSpans: LightSpanRecord[] | undefined,\n  featuredSpanId: string | null | undefined,\n  onSpanChange: (spanId: string) => void,\n) {\n  const timelineSpanIds = useMemo(() => getAllSpanIds(formatHierarchicalSpans(lightSpans ?? [])), [lightSpans]);\n\n  const featuredSpanIdx = featuredSpanId ? timelineSpanIds.indexOf(featuredSpanId) : -1;\n\n  const handlePreviousSpan =\n    featuredSpanIdx > 0\n      ? () => {\n          const spanId = timelineSpanIds[featuredSpanIdx - 1];\n          if (spanId !== undefined) onSpanChange(spanId);\n        }\n      : undefined;\n\n  const handleNextSpan =\n    featuredSpanIdx >= 0 && featuredSpanIdx < timelineSpanIds.length - 1\n      ? () => {\n          const spanId = timelineSpanIds[featuredSpanIdx + 1];\n          if (spanId !== undefined) onSpanChange(spanId);\n        }\n      : undefined;\n\n  return { handlePreviousSpan, handleNextSpan, timelineSpanIds };\n}\n"],"names":["useMemo","getAllSpanIds","formatHierarchicalSpans"],"mappings":";;;;;;;;AASO,SAAS,sBAAA,CACd,UAAA,EACA,cAAA,EACA,YAAA,EACA;AACA,EAAA,MAAM,eAAA,GAAkBA,aAAA,CAAQ,MAAMC,gDAAA,CAAcC,yEAAA,CAAwB,UAAA,IAAc,EAAE,CAAC,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AAE5G,EAAA,MAAM,eAAA,GAAkB,cAAA,GAAiB,eAAA,CAAgB,OAAA,CAAQ,cAAc,CAAA,GAAI,EAAA;AAEnF,EAAA,MAAM,kBAAA,GACJ,eAAA,GAAkB,CAAA,GACd,MAAM;AACJ,IAAA,MAAM,MAAA,GAAS,eAAA,CAAgB,eAAA,GAAkB,CAAC,CAAA;AAClD,IAAA,IAAI,MAAA,KAAW,MAAA,EAAW,YAAA,CAAa,MAAM,CAAA;AAAA,EAC/C,CAAA,GACA,MAAA;AAEN,EAAA,MAAM,iBACJ,eAAA,IAAmB,CAAA,IAAK,kBAAkB,eAAA,CAAgB,MAAA,GAAS,IAC/D,MAAM;AACJ,IAAA,MAAM,MAAA,GAAS,eAAA,CAAgB,eAAA,GAAkB,CAAC,CAAA;AAClD,IAAA,IAAI,MAAA,KAAW,MAAA,EAAW,YAAA,CAAa,MAAM,CAAA;AAAA,EAC/C,CAAA,GACA,MAAA;AAEN,EAAA,OAAO,EAAE,kBAAA,EAAoB,cAAA,EAAgB,eAAA,EAAgB;AAC/D;;;;"}
+{"version":3,"file":"use-trace-span-navigation.cjs.js","sources":["../../../../src/domains/traces/hooks/use-trace-span-navigation.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { formatHierarchicalSpans } from '../components/format-hierarchical-spans';\nimport type { LightSpanRecord } from '../types';\nimport { getAllSpanIds } from './get-all-span-ids';\n\n/**\n * Derives previous/next span navigation handlers from a trace's lightweight spans.\n * Returns undefined for handlers that are out of bounds so the consumer can render disabled UI.\n */\nexport function useTraceSpanNavigation(\n  lightSpans: LightSpanRecord[] | undefined,\n  featuredSpanId: string | null | undefined,\n  onSpanChange: (spanId: string) => void,\n) {\n  const timelineSpanIds = useMemo(() => getAllSpanIds(formatHierarchicalSpans(lightSpans ?? [])), [lightSpans]);\n\n  const featuredSpanIdx = featuredSpanId ? timelineSpanIds.indexOf(featuredSpanId) : -1;\n\n  const handlePreviousSpan =\n    featuredSpanIdx > 0\n      ? () => {\n          const spanId = timelineSpanIds[featuredSpanIdx - 1];\n          if (spanId !== undefined) onSpanChange(spanId);\n        }\n      : undefined;\n\n  const handleNextSpan =\n    featuredSpanIdx >= 0 && featuredSpanIdx < timelineSpanIds.length - 1\n      ? () => {\n          const spanId = timelineSpanIds[featuredSpanIdx + 1];\n          if (spanId !== undefined) onSpanChange(spanId);\n        }\n      : undefined;\n\n  return { handlePreviousSpan, handleNextSpan, timelineSpanIds };\n}\n"],"names":["useMemo","getAllSpanIds","formatHierarchicalSpans"],"mappings":";;;;;;;;AASO,SAAS,sBAAA,CACd,UAAA,EACA,cAAA,EACA,YAAA,EACA;AACA,EAAA,MAAM,eAAA,GAAkBA,aAAA,CAAQ,MAAMC,gDAAA,CAAcC,yEAAA,CAAwB,UAAA,IAAc,EAAE,CAAC,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AAE5G,EAAA,MAAM,eAAA,GAAkB,cAAA,GAAiB,eAAA,CAAgB,OAAA,CAAQ,cAAc,CAAA,GAAI,EAAA;AAEnF,EAAA,MAAM,kBAAA,GACJ,eAAA,GAAkB,CAAA,GACd,MAAM;AACJ,IAAA,MAAM,MAAA,GAAS,eAAA,CAAgB,eAAA,GAAkB,CAAC,CAAA;AAClD,IAAA,IAAI,MAAA,KAAW,MAAA,EAAW,YAAA,CAAa,MAAM,CAAA;AAAA,EAC/C,CAAA,GACA,MAAA;AAEN,EAAA,MAAM,iBACJ,eAAA,IAAmB,CAAA,IAAK,kBAAkB,eAAA,CAAgB,MAAA,GAAS,IAC/D,MAAM;AACJ,IAAA,MAAM,MAAA,GAAS,eAAA,CAAgB,eAAA,GAAkB,CAAC,CAAA;AAClD,IAAA,IAAI,MAAA,KAAW,MAAA,EAAW,YAAA,CAAa,MAAM,CAAA;AAAA,EAC/C,CAAA,GACA,MAAA;AAEN,EAAA,OAAO,EAAE,kBAAA,EAAoB,cAAA,EAAgB,eAAA,EAAgB;AAC/D;;;;"}

package/dist/domains/traces/hooks/use-trace-span-navigation.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-trace-span-navigation.es.js","sources":["../../../../src/domains/traces/hooks/use-trace-span-navigation.tsx"],"sourcesContent":["import type { LightSpanRecord } from '@mastra/core/storage';\nimport { useMemo } from 'react';\nimport { formatHierarchicalSpans } from '../components/format-hierarchical-spans';\nimport { getAllSpanIds } from './get-all-span-ids';\n\n/**\n * Derives previous/next span navigation handlers from a trace's lightweight spans.\n * Returns undefined for handlers that are out of bounds so the consumer can render disabled UI.\n */\nexport function useTraceSpanNavigation(\n  lightSpans: LightSpanRecord[] | undefined,\n  featuredSpanId: string | null | undefined,\n  onSpanChange: (spanId: string) => void,\n) {\n  const timelineSpanIds = useMemo(() => getAllSpanIds(formatHierarchicalSpans(lightSpans ?? [])), [lightSpans]);\n\n  const featuredSpanIdx = featuredSpanId ? timelineSpanIds.indexOf(featuredSpanId) : -1;\n\n  const handlePreviousSpan =\n    featuredSpanIdx > 0\n      ? () => {\n          const spanId = timelineSpanIds[featuredSpanIdx - 1];\n          if (spanId !== undefined) onSpanChange(spanId);\n        }\n      : undefined;\n\n  const handleNextSpan =\n    featuredSpanIdx >= 0 && featuredSpanIdx < timelineSpanIds.length - 1\n      ? () => {\n          const spanId = timelineSpanIds[featuredSpanIdx + 1];\n          if (spanId !== undefined) onSpanChange(spanId);\n        }\n      : undefined;\n\n  return { handlePreviousSpan, handleNextSpan, timelineSpanIds };\n}\n"],"names":[],"mappings":";;;;AASO,SAAS,sBAAA,CACd,UAAA,EACA,cAAA,EACA,YAAA,EACA;AACA,EAAA,MAAM,eAAA,GAAkB,OAAA,CAAQ,MAAM,aAAA,CAAc,uBAAA,CAAwB,UAAA,IAAc,EAAE,CAAC,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AAE5G,EAAA,MAAM,eAAA,GAAkB,cAAA,GAAiB,eAAA,CAAgB,OAAA,CAAQ,cAAc,CAAA,GAAI,EAAA;AAEnF,EAAA,MAAM,kBAAA,GACJ,eAAA,GAAkB,CAAA,GACd,MAAM;AACJ,IAAA,MAAM,MAAA,GAAS,eAAA,CAAgB,eAAA,GAAkB,CAAC,CAAA;AAClD,IAAA,IAAI,MAAA,KAAW,MAAA,EAAW,YAAA,CAAa,MAAM,CAAA;AAAA,EAC/C,CAAA,GACA,MAAA;AAEN,EAAA,MAAM,iBACJ,eAAA,IAAmB,CAAA,IAAK,kBAAkB,eAAA,CAAgB,MAAA,GAAS,IAC/D,MAAM;AACJ,IAAA,MAAM,MAAA,GAAS,eAAA,CAAgB,eAAA,GAAkB,CAAC,CAAA;AAClD,IAAA,IAAI,MAAA,KAAW,MAAA,EAAW,YAAA,CAAa,MAAM,CAAA;AAAA,EAC/C,CAAA,GACA,MAAA;AAEN,EAAA,OAAO,EAAE,kBAAA,EAAoB,cAAA,EAAgB,eAAA,EAAgB;AAC/D;;;;"}
+{"version":3,"file":"use-trace-span-navigation.es.js","sources":["../../../../src/domains/traces/hooks/use-trace-span-navigation.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { formatHierarchicalSpans } from '../components/format-hierarchical-spans';\nimport type { LightSpanRecord } from '../types';\nimport { getAllSpanIds } from './get-all-span-ids';\n\n/**\n * Derives previous/next span navigation handlers from a trace's lightweight spans.\n * Returns undefined for handlers that are out of bounds so the consumer can render disabled UI.\n */\nexport function useTraceSpanNavigation(\n  lightSpans: LightSpanRecord[] | undefined,\n  featuredSpanId: string | null | undefined,\n  onSpanChange: (spanId: string) => void,\n) {\n  const timelineSpanIds = useMemo(() => getAllSpanIds(formatHierarchicalSpans(lightSpans ?? [])), [lightSpans]);\n\n  const featuredSpanIdx = featuredSpanId ? timelineSpanIds.indexOf(featuredSpanId) : -1;\n\n  const handlePreviousSpan =\n    featuredSpanIdx > 0\n      ? () => {\n          const spanId = timelineSpanIds[featuredSpanIdx - 1];\n          if (spanId !== undefined) onSpanChange(spanId);\n        }\n      : undefined;\n\n  const handleNextSpan =\n    featuredSpanIdx >= 0 && featuredSpanIdx < timelineSpanIds.length - 1\n      ? () => {\n          const spanId = timelineSpanIds[featuredSpanIdx + 1];\n          if (spanId !== undefined) onSpanChange(spanId);\n        }\n      : undefined;\n\n  return { handlePreviousSpan, handleNextSpan, timelineSpanIds };\n}\n"],"names":[],"mappings":";;;;AASO,SAAS,sBAAA,CACd,UAAA,EACA,cAAA,EACA,YAAA,EACA;AACA,EAAA,MAAM,eAAA,GAAkB,OAAA,CAAQ,MAAM,aAAA,CAAc,uBAAA,CAAwB,UAAA,IAAc,EAAE,CAAC,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AAE5G,EAAA,MAAM,eAAA,GAAkB,cAAA,GAAiB,eAAA,CAAgB,OAAA,CAAQ,cAAc,CAAA,GAAI,EAAA;AAEnF,EAAA,MAAM,kBAAA,GACJ,eAAA,GAAkB,CAAA,GACd,MAAM;AACJ,IAAA,MAAM,MAAA,GAAS,eAAA,CAAgB,eAAA,GAAkB,CAAC,CAAA;AAClD,IAAA,IAAI,MAAA,KAAW,MAAA,EAAW,YAAA,CAAa,MAAM,CAAA;AAAA,EAC/C,CAAA,GACA,MAAA;AAEN,EAAA,MAAM,iBACJ,eAAA,IAAmB,CAAA,IAAK,kBAAkB,eAAA,CAAgB,MAAA,GAAS,IAC/D,MAAM;AACJ,IAAA,MAAM,MAAA,GAAS,eAAA,CAAgB,eAAA,GAAkB,CAAC,CAAA;AAClD,IAAA,IAAI,MAAA,KAAW,MAAA,EAAW,YAAA,CAAa,MAAM,CAAA;AAAA,EAC/C,CAAA,GACA,MAAA;AAEN,EAAA,OAAO,EAAE,kBAAA,EAAoB,cAAA,EAAgB,eAAA,EAAgB;AAC/D;;;;"}

package/dist/domains/traces/hooks/use-trace-spans.cjs.js

@@ -20,6 +20,7 @@ const traceSpansQueryOptions = (client, traceId) => reactQuery.queryOptions({
   // Resumed runs and delayed exports can append spans even when every known span has ended.
   staleTime: 0
 });
+const selectSearchableTraceSpans = (data) => data ? { ...data, spans: domains_traces_utils_toSearchableSpans.toSearchableSpans(data.spans) } : null;
 function useTraceSpans(traceId, { passive = false } = {}) {
   const client = react.useMastraClient();
   return reactQuery.useQuery({
@@ -29,7 +30,7 @@ function useTraceSpans(traceId, { passive = false } = {}) {
     refetchOnWindowFocus: !passive,
     refetchOnReconnect: !passive,
     // Builds each span's search haystack once per fetch, cached with the query.
-    select: domains_traces_utils_toSearchableSpans.selectSearchableSpans
+    select: selectSearchableTraceSpans
   });
 }
 function useTraceSpansQueries(traceIds, select, fallback) {

package/dist/domains/traces/hooks/use-trace-spans.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-trace-spans.cjs.js","sources":["../../../../src/domains/traces/hooks/use-trace-spans.ts"],"sourcesContent":["import type { MastraClient } from '@mastra/client-js';\nimport { useMastraClient } from '@mastra/react';\nimport { queryOptions, useQueries, useQuery } from '@tanstack/react-query';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport type { SearchableSpan } from '../types';\nimport { selectSearchableSpans } from '../utils';\n\n/**\n * Key, fetcher and stale policy of the `trace-spans` query. Every observer of this key must\n * share these (rather than only the key) so one observer with a stricter `staleTime` does not\n * refetch data another one considers fresh.\n */\nexport const traceSpansQueryOptions = (client: MastraClient, traceId: string | null | undefined) =>\n  queryOptions({\n    queryKey: ['trace-spans', traceId],\n    queryFn: async () => {\n      if (!traceId) {\n        throw new Error('Trace ID is required');\n      }\n      const res = await client.getTrace(traceId);\n      return res;\n    },\n    enabled: !!traceId,\n    // Resumed runs and delayed exports can append spans even when every known span has ended.\n    staleTime: 0,\n  });\n\n/**\n * Every span of a single trace, with its full payload.\n *\n * The lightweight projection exists to keep blob columns off the read path of a\n * *list*, where the cost is paid once per trace on screen. A trace that is open\n * has already narrowed that to one, and the panel both renders and searches\n * these spans -- `input`, `output` and `attributes` included -- so the\n * projection would only hide content the reader is looking at.\n */\nexport function useTraceSpans(\n  traceId: string | null | undefined,\n  { passive = false }: { passive?: boolean } = {},\n): UseQueryResult<{ traceId: string; spans: SearchableSpan[] } | null> {\n  const client = useMastraClient();\n\n  return useQuery({\n    ...traceSpansQueryOptions(client, traceId),\n    // History rows share updates but leave automatic refreshes to the selected detail.\n    refetchOnMount: !passive,\n    refetchOnWindowFocus: !passive,\n    refetchOnReconnect: !passive,\n    // Builds each span's search haystack once per fetch, cached with the query.\n    select: selectSearchableSpans,\n  });\n}\n\nexport type TraceSpansData = Awaited<ReturnType<MastraClient['getTrace']>>;\n\n/**\n * Observes the `trace-spans` query of several traces at once and projects each one with `select`.\n * Traces still loading (or failed) yield `fallback(traceId)` so the result always lines up with `traceIds`.\n */\nexport function useTraceSpansQueries<T>(\n  traceIds: string[],\n  select: (traceId: string, data: TraceSpansData) => T,\n  fallback: (traceId: string) => T,\n): T[] {\n  const client = useMastraClient();\n\n  return useQueries({\n    queries: traceIds.map(traceId => ({\n      ...traceSpansQueryOptions(client, traceId),\n      refetchOnMount: false,\n      refetchOnWindowFocus: false,\n      refetchOnReconnect: false,\n      select: (data: TraceSpansData) => select(traceId, data),\n    })),\n    combine: results =>\n      results.map((result, index) =>\n        result.data === undefined ? fallback(traceIds[index] ?? '') : (result.data as T),\n      ),\n  });\n}\n"],"names":["queryOptions","useMastraClient","useQuery","selectSearchableSpans","useQueries"],"mappings":";;;;;;;;;AAYO,MAAM,sBAAA,GAAyB,CAAC,MAAA,EAAsB,OAAA,KAC3DA,uBAAA,CAAa;AAAA,EACX,QAAA,EAAU,CAAC,aAAA,EAAe,OAAO,CAAA;AAAA,EACjC,SAAS,YAAY;AACnB,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,MAAM,IAAI,MAAM,sBAAsB,CAAA;AAAA,IACxC;AACA,IAAA,MAAM,GAAA,GAAM,MAAM,MAAA,CAAO,QAAA,CAAS,OAAO,CAAA;AACzC,IAAA,OAAO,GAAA;AAAA,EACT,CAAA;AAAA,EACA,OAAA,EAAS,CAAC,CAAC,OAAA;AAAA;AAAA,EAEX,SAAA,EAAW;AACb,CAAC;AAWI,SAAS,cACd,OAAA,EACA,EAAE,UAAU,KAAA,EAAM,GAA2B,EAAC,EACuB;AACrE,EAAA,MAAM,SAASC,qBAAA,EAAgB;AAE/B,EAAA,OAAOC,mBAAA,CAAS;AAAA,IACd,GAAG,sBAAA,CAAuB,MAAA,EAAQ,OAAO,CAAA;AAAA;AAAA,IAEzC,gBAAgB,CAAC,OAAA;AAAA,IACjB,sBAAsB,CAAC,OAAA;AAAA,IACvB,oBAAoB,CAAC,OAAA;AAAA;AAAA,IAErB,MAAA,EAAQC;AAAA,GACT,CAAA;AACH;AAQO,SAAS,oBAAA,CACd,QAAA,EACA,MAAA,EACA,QAAA,EACK;AACL,EAAA,MAAM,SAASF,qBAAA,EAAgB;AAE/B,EAAA,OAAOG,qBAAA,CAAW;AAAA,IAChB,OAAA,EAAS,QAAA,CAAS,GAAA,CAAI,CAAA,OAAA,MAAY;AAAA,MAChC,GAAG,sBAAA,CAAuB,MAAA,EAAQ,OAAO,CAAA;AAAA,MACzC,cAAA,EAAgB,KAAA;AAAA,MAChB,oBAAA,EAAsB,KAAA;AAAA,MACtB,kBAAA,EAAoB,KAAA;AAAA,MACpB,MAAA,EAAQ,CAAC,IAAA,KAAyB,MAAA,CAAO,SAAS,IAAI;AAAA,KACxD,CAAE,CAAA;AAAA,IACF,OAAA,EAAS,aACP,OAAA,CAAQ,GAAA;AAAA,MAAI,CAAC,MAAA,EAAQ,KAAA,KACnB,MAAA,CAAO,IAAA,KAAS,MAAA,GAAY,QAAA,CAAS,QAAA,CAAS,KAAK,CAAA,IAAK,EAAE,CAAA,GAAK,MAAA,CAAO;AAAA;AACxE,GACH,CAAA;AACH;;;;;;"}
+{"version":3,"file":"use-trace-spans.cjs.js","sources":["../../../../src/domains/traces/hooks/use-trace-spans.ts"],"sourcesContent":["import type { MastraClient } from '@mastra/client-js';\nimport { useMastraClient } from '@mastra/react';\nimport { queryOptions, useQueries, useQuery } from '@tanstack/react-query';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport { toSearchableSpans } from '../utils';\n\n/**\n * Key, fetcher and stale policy of the `trace-spans` query. Every observer of this key must\n * share these (rather than only the key) so one observer with a stricter `staleTime` does not\n * refetch data another one considers fresh.\n */\nexport const traceSpansQueryOptions = (client: MastraClient, traceId: string | null | undefined) =>\n  queryOptions({\n    queryKey: ['trace-spans', traceId],\n    queryFn: async () => {\n      if (!traceId) {\n        throw new Error('Trace ID is required');\n      }\n      const res = await client.getTrace(traceId);\n      return res;\n    },\n    enabled: !!traceId,\n    // Resumed runs and delayed exports can append spans even when every known span has ended.\n    staleTime: 0,\n  });\n\n/**\n * Every span of a single trace, with its full payload.\n *\n * The lightweight projection exists to keep blob columns off the read path of a\n * *list*, where the cost is paid once per trace on screen. A trace that is open\n * has already narrowed that to one, and the panel both renders and searches\n * these spans -- `input`, `output` and `attributes` included -- so the\n * projection would only hide content the reader is looking at.\n */\nexport type TraceSpansData = Awaited<ReturnType<MastraClient['getTrace']>>;\ntype SearchableTraceSpansData = Omit<NonNullable<TraceSpansData>, 'spans'> & {\n  spans: Array<NonNullable<TraceSpansData>['spans'][number] & { searchText: string }>;\n};\n\nconst selectSearchableTraceSpans = (data: TraceSpansData): SearchableTraceSpansData | null =>\n  data ? { ...data, spans: toSearchableSpans(data.spans) } : null;\n\nexport function useTraceSpans(\n  traceId: string | null | undefined,\n  { passive = false }: { passive?: boolean } = {},\n): UseQueryResult<SearchableTraceSpansData | null> {\n  const client = useMastraClient();\n\n  return useQuery({\n    ...traceSpansQueryOptions(client, traceId),\n    // History rows share updates but leave automatic refreshes to the selected detail.\n    refetchOnMount: !passive,\n    refetchOnWindowFocus: !passive,\n    refetchOnReconnect: !passive,\n    // Builds each span's search haystack once per fetch, cached with the query.\n    select: selectSearchableTraceSpans,\n  });\n}\n\n/**\n * Observes the `trace-spans` query of several traces at once and projects each one with `select`.\n * Traces still loading (or failed) yield `fallback(traceId)` so the result always lines up with `traceIds`.\n */\nexport function useTraceSpansQueries<T>(\n  traceIds: string[],\n  select: (traceId: string, data: TraceSpansData) => T,\n  fallback: (traceId: string) => T,\n): T[] {\n  const client = useMastraClient();\n\n  return useQueries({\n    queries: traceIds.map(traceId => ({\n      ...traceSpansQueryOptions(client, traceId),\n      refetchOnMount: false,\n      refetchOnWindowFocus: false,\n      refetchOnReconnect: false,\n      select: (data: TraceSpansData) => select(traceId, data),\n    })),\n    combine: results =>\n      results.map((result, index) =>\n        result.data === undefined ? fallback(traceIds[index] ?? '') : (result.data as T),\n      ),\n  });\n}\n"],"names":["queryOptions","toSearchableSpans","useMastraClient","useQuery","useQueries"],"mappings":";;;;;;;;;AAWO,MAAM,sBAAA,GAAyB,CAAC,MAAA,EAAsB,OAAA,KAC3DA,uBAAA,CAAa;AAAA,EACX,QAAA,EAAU,CAAC,aAAA,EAAe,OAAO,CAAA;AAAA,EACjC,SAAS,YAAY;AACnB,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,MAAM,IAAI,MAAM,sBAAsB,CAAA;AAAA,IACxC;AACA,IAAA,MAAM,GAAA,GAAM,MAAM,MAAA,CAAO,QAAA,CAAS,OAAO,CAAA;AACzC,IAAA,OAAO,GAAA;AAAA,EACT,CAAA;AAAA,EACA,OAAA,EAAS,CAAC,CAAC,OAAA;AAAA;AAAA,EAEX,SAAA,EAAW;AACb,CAAC;AAgBH,MAAM,0BAAA,GAA6B,CAAC,IAAA,KAClC,IAAA,GAAO,EAAE,GAAG,IAAA,EAAM,KAAA,EAAOC,wDAAA,CAAkB,IAAA,CAAK,KAAK,CAAA,EAAE,GAAI,IAAA;AAEtD,SAAS,cACd,OAAA,EACA,EAAE,UAAU,KAAA,EAAM,GAA2B,EAAC,EACG;AACjD,EAAA,MAAM,SAASC,qBAAA,EAAgB;AAE/B,EAAA,OAAOC,mBAAA,CAAS;AAAA,IACd,GAAG,sBAAA,CAAuB,MAAA,EAAQ,OAAO,CAAA;AAAA;AAAA,IAEzC,gBAAgB,CAAC,OAAA;AAAA,IACjB,sBAAsB,CAAC,OAAA;AAAA,IACvB,oBAAoB,CAAC,OAAA;AAAA;AAAA,IAErB,MAAA,EAAQ;AAAA,GACT,CAAA;AACH;AAMO,SAAS,oBAAA,CACd,QAAA,EACA,MAAA,EACA,QAAA,EACK;AACL,EAAA,MAAM,SAASD,qBAAA,EAAgB;AAE/B,EAAA,OAAOE,qBAAA,CAAW;AAAA,IAChB,OAAA,EAAS,QAAA,CAAS,GAAA,CAAI,CAAA,OAAA,MAAY;AAAA,MAChC,GAAG,sBAAA,CAAuB,MAAA,EAAQ,OAAO,CAAA;AAAA,MACzC,cAAA,EAAgB,KAAA;AAAA,MAChB,oBAAA,EAAsB,KAAA;AAAA,MACtB,kBAAA,EAAoB,KAAA;AAAA,MACpB,MAAA,EAAQ,CAAC,IAAA,KAAyB,MAAA,CAAO,SAAS,IAAI;AAAA,KACxD,CAAE,CAAA;AAAA,IACF,OAAA,EAAS,aACP,OAAA,CAAQ,GAAA;AAAA,MAAI,CAAC,MAAA,EAAQ,KAAA,KACnB,MAAA,CAAO,IAAA,KAAS,MAAA,GAAY,QAAA,CAAS,QAAA,CAAS,KAAK,CAAA,IAAK,EAAE,CAAA,GAAK,MAAA,CAAO;AAAA;AACxE,GACH,CAAA;AACH;;;;;;"}

package/dist/domains/traces/hooks/use-trace-spans.es.js

@@ -1,6 +1,6 @@
 import { useMastraClient } from '@mastra/react';
 import { useQuery, queryOptions, useQueries } from '@tanstack/react-query';
-import { selectSearchableSpans } from '../utils/to-searchable-spans.es.js';
+import { toSearchableSpans } from '../utils/to-searchable-spans.es.js';
 import 'date-fns';
 
 const traceSpansQueryOptions = (client, traceId) => queryOptions({
@@ -16,6 +16,7 @@ const traceSpansQueryOptions = (client, traceId) => queryOptions({
   // Resumed runs and delayed exports can append spans even when every known span has ended.
   staleTime: 0
 });
+const selectSearchableTraceSpans = (data) => data ? { ...data, spans: toSearchableSpans(data.spans) } : null;
 function useTraceSpans(traceId, { passive = false } = {}) {
   const client = useMastraClient();
   return useQuery({
@@ -25,7 +26,7 @@ function useTraceSpans(traceId, { passive = false } = {}) {
     refetchOnWindowFocus: !passive,
     refetchOnReconnect: !passive,
     // Builds each span's search haystack once per fetch, cached with the query.
-    select: selectSearchableSpans
+    select: selectSearchableTraceSpans
   });
 }
 function useTraceSpansQueries(traceIds, select, fallback) {

package/dist/domains/traces/hooks/use-trace-spans.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-trace-spans.es.js","sources":["../../../../src/domains/traces/hooks/use-trace-spans.ts"],"sourcesContent":["import type { MastraClient } from '@mastra/client-js';\nimport { useMastraClient } from '@mastra/react';\nimport { queryOptions, useQueries, useQuery } from '@tanstack/react-query';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport type { SearchableSpan } from '../types';\nimport { selectSearchableSpans } from '../utils';\n\n/**\n * Key, fetcher and stale policy of the `trace-spans` query. Every observer of this key must\n * share these (rather than only the key) so one observer with a stricter `staleTime` does not\n * refetch data another one considers fresh.\n */\nexport const traceSpansQueryOptions = (client: MastraClient, traceId: string | null | undefined) =>\n  queryOptions({\n    queryKey: ['trace-spans', traceId],\n    queryFn: async () => {\n      if (!traceId) {\n        throw new Error('Trace ID is required');\n      }\n      const res = await client.getTrace(traceId);\n      return res;\n    },\n    enabled: !!traceId,\n    // Resumed runs and delayed exports can append spans even when every known span has ended.\n    staleTime: 0,\n  });\n\n/**\n * Every span of a single trace, with its full payload.\n *\n * The lightweight projection exists to keep blob columns off the read path of a\n * *list*, where the cost is paid once per trace on screen. A trace that is open\n * has already narrowed that to one, and the panel both renders and searches\n * these spans -- `input`, `output` and `attributes` included -- so the\n * projection would only hide content the reader is looking at.\n */\nexport function useTraceSpans(\n  traceId: string | null | undefined,\n  { passive = false }: { passive?: boolean } = {},\n): UseQueryResult<{ traceId: string; spans: SearchableSpan[] } | null> {\n  const client = useMastraClient();\n\n  return useQuery({\n    ...traceSpansQueryOptions(client, traceId),\n    // History rows share updates but leave automatic refreshes to the selected detail.\n    refetchOnMount: !passive,\n    refetchOnWindowFocus: !passive,\n    refetchOnReconnect: !passive,\n    // Builds each span's search haystack once per fetch, cached with the query.\n    select: selectSearchableSpans,\n  });\n}\n\nexport type TraceSpansData = Awaited<ReturnType<MastraClient['getTrace']>>;\n\n/**\n * Observes the `trace-spans` query of several traces at once and projects each one with `select`.\n * Traces still loading (or failed) yield `fallback(traceId)` so the result always lines up with `traceIds`.\n */\nexport function useTraceSpansQueries<T>(\n  traceIds: string[],\n  select: (traceId: string, data: TraceSpansData) => T,\n  fallback: (traceId: string) => T,\n): T[] {\n  const client = useMastraClient();\n\n  return useQueries({\n    queries: traceIds.map(traceId => ({\n      ...traceSpansQueryOptions(client, traceId),\n      refetchOnMount: false,\n      refetchOnWindowFocus: false,\n      refetchOnReconnect: false,\n      select: (data: TraceSpansData) => select(traceId, data),\n    })),\n    combine: results =>\n      results.map((result, index) =>\n        result.data === undefined ? fallback(traceIds[index] ?? '') : (result.data as T),\n      ),\n  });\n}\n"],"names":[],"mappings":";;;;;AAYO,MAAM,sBAAA,GAAyB,CAAC,MAAA,EAAsB,OAAA,KAC3D,YAAA,CAAa;AAAA,EACX,QAAA,EAAU,CAAC,aAAA,EAAe,OAAO,CAAA;AAAA,EACjC,SAAS,YAAY;AACnB,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,MAAM,IAAI,MAAM,sBAAsB,CAAA;AAAA,IACxC;AACA,IAAA,MAAM,GAAA,GAAM,MAAM,MAAA,CAAO,QAAA,CAAS,OAAO,CAAA;AACzC,IAAA,OAAO,GAAA;AAAA,EACT,CAAA;AAAA,EACA,OAAA,EAAS,CAAC,CAAC,OAAA;AAAA;AAAA,EAEX,SAAA,EAAW;AACb,CAAC;AAWI,SAAS,cACd,OAAA,EACA,EAAE,UAAU,KAAA,EAAM,GAA2B,EAAC,EACuB;AACrE,EAAA,MAAM,SAAS,eAAA,EAAgB;AAE/B,EAAA,OAAO,QAAA,CAAS;AAAA,IACd,GAAG,sBAAA,CAAuB,MAAA,EAAQ,OAAO,CAAA;AAAA;AAAA,IAEzC,gBAAgB,CAAC,OAAA;AAAA,IACjB,sBAAsB,CAAC,OAAA;AAAA,IACvB,oBAAoB,CAAC,OAAA;AAAA;AAAA,IAErB,MAAA,EAAQ;AAAA,GACT,CAAA;AACH;AAQO,SAAS,oBAAA,CACd,QAAA,EACA,MAAA,EACA,QAAA,EACK;AACL,EAAA,MAAM,SAAS,eAAA,EAAgB;AAE/B,EAAA,OAAO,UAAA,CAAW;AAAA,IAChB,OAAA,EAAS,QAAA,CAAS,GAAA,CAAI,CAAA,OAAA,MAAY;AAAA,MAChC,GAAG,sBAAA,CAAuB,MAAA,EAAQ,OAAO,CAAA;AAAA,MACzC,cAAA,EAAgB,KAAA;AAAA,MAChB,oBAAA,EAAsB,KAAA;AAAA,MACtB,kBAAA,EAAoB,KAAA;AAAA,MACpB,MAAA,EAAQ,CAAC,IAAA,KAAyB,MAAA,CAAO,SAAS,IAAI;AAAA,KACxD,CAAE,CAAA;AAAA,IACF,OAAA,EAAS,aACP,OAAA,CAAQ,GAAA;AAAA,MAAI,CAAC,MAAA,EAAQ,KAAA,KACnB,MAAA,CAAO,IAAA,KAAS,MAAA,GAAY,QAAA,CAAS,QAAA,CAAS,KAAK,CAAA,IAAK,EAAE,CAAA,GAAK,MAAA,CAAO;AAAA;AACxE,GACH,CAAA;AACH;;;;"}
+{"version":3,"file":"use-trace-spans.es.js","sources":["../../../../src/domains/traces/hooks/use-trace-spans.ts"],"sourcesContent":["import type { MastraClient } from '@mastra/client-js';\nimport { useMastraClient } from '@mastra/react';\nimport { queryOptions, useQueries, useQuery } from '@tanstack/react-query';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport { toSearchableSpans } from '../utils';\n\n/**\n * Key, fetcher and stale policy of the `trace-spans` query. Every observer of this key must\n * share these (rather than only the key) so one observer with a stricter `staleTime` does not\n * refetch data another one considers fresh.\n */\nexport const traceSpansQueryOptions = (client: MastraClient, traceId: string | null | undefined) =>\n  queryOptions({\n    queryKey: ['trace-spans', traceId],\n    queryFn: async () => {\n      if (!traceId) {\n        throw new Error('Trace ID is required');\n      }\n      const res = await client.getTrace(traceId);\n      return res;\n    },\n    enabled: !!traceId,\n    // Resumed runs and delayed exports can append spans even when every known span has ended.\n    staleTime: 0,\n  });\n\n/**\n * Every span of a single trace, with its full payload.\n *\n * The lightweight projection exists to keep blob columns off the read path of a\n * *list*, where the cost is paid once per trace on screen. A trace that is open\n * has already narrowed that to one, and the panel both renders and searches\n * these spans -- `input`, `output` and `attributes` included -- so the\n * projection would only hide content the reader is looking at.\n */\nexport type TraceSpansData = Awaited<ReturnType<MastraClient['getTrace']>>;\ntype SearchableTraceSpansData = Omit<NonNullable<TraceSpansData>, 'spans'> & {\n  spans: Array<NonNullable<TraceSpansData>['spans'][number] & { searchText: string }>;\n};\n\nconst selectSearchableTraceSpans = (data: TraceSpansData): SearchableTraceSpansData | null =>\n  data ? { ...data, spans: toSearchableSpans(data.spans) } : null;\n\nexport function useTraceSpans(\n  traceId: string | null | undefined,\n  { passive = false }: { passive?: boolean } = {},\n): UseQueryResult<SearchableTraceSpansData | null> {\n  const client = useMastraClient();\n\n  return useQuery({\n    ...traceSpansQueryOptions(client, traceId),\n    // History rows share updates but leave automatic refreshes to the selected detail.\n    refetchOnMount: !passive,\n    refetchOnWindowFocus: !passive,\n    refetchOnReconnect: !passive,\n    // Builds each span's search haystack once per fetch, cached with the query.\n    select: selectSearchableTraceSpans,\n  });\n}\n\n/**\n * Observes the `trace-spans` query of several traces at once and projects each one with `select`.\n * Traces still loading (or failed) yield `fallback(traceId)` so the result always lines up with `traceIds`.\n */\nexport function useTraceSpansQueries<T>(\n  traceIds: string[],\n  select: (traceId: string, data: TraceSpansData) => T,\n  fallback: (traceId: string) => T,\n): T[] {\n  const client = useMastraClient();\n\n  return useQueries({\n    queries: traceIds.map(traceId => ({\n      ...traceSpansQueryOptions(client, traceId),\n      refetchOnMount: false,\n      refetchOnWindowFocus: false,\n      refetchOnReconnect: false,\n      select: (data: TraceSpansData) => select(traceId, data),\n    })),\n    combine: results =>\n      results.map((result, index) =>\n        result.data === undefined ? fallback(traceIds[index] ?? '') : (result.data as T),\n      ),\n  });\n}\n"],"names":[],"mappings":";;;;;AAWO,MAAM,sBAAA,GAAyB,CAAC,MAAA,EAAsB,OAAA,KAC3D,YAAA,CAAa;AAAA,EACX,QAAA,EAAU,CAAC,aAAA,EAAe,OAAO,CAAA;AAAA,EACjC,SAAS,YAAY;AACnB,IAAA,IAAI,CAAC,OAAA,EAAS;AACZ,MAAA,MAAM,IAAI,MAAM,sBAAsB,CAAA;AAAA,IACxC;AACA,IAAA,MAAM,GAAA,GAAM,MAAM,MAAA,CAAO,QAAA,CAAS,OAAO,CAAA;AACzC,IAAA,OAAO,GAAA;AAAA,EACT,CAAA;AAAA,EACA,OAAA,EAAS,CAAC,CAAC,OAAA;AAAA;AAAA,EAEX,SAAA,EAAW;AACb,CAAC;AAgBH,MAAM,0BAAA,GAA6B,CAAC,IAAA,KAClC,IAAA,GAAO,EAAE,GAAG,IAAA,EAAM,KAAA,EAAO,iBAAA,CAAkB,IAAA,CAAK,KAAK,CAAA,EAAE,GAAI,IAAA;AAEtD,SAAS,cACd,OAAA,EACA,EAAE,UAAU,KAAA,EAAM,GAA2B,EAAC,EACG;AACjD,EAAA,MAAM,SAAS,eAAA,EAAgB;AAE/B,EAAA,OAAO,QAAA,CAAS;AAAA,IACd,GAAG,sBAAA,CAAuB,MAAA,EAAQ,OAAO,CAAA;AAAA;AAAA,IAEzC,gBAAgB,CAAC,OAAA;AAAA,IACjB,sBAAsB,CAAC,OAAA;AAAA,IACvB,oBAAoB,CAAC,OAAA;AAAA;AAAA,IAErB,MAAA,EAAQ;AAAA,GACT,CAAA;AACH;AAMO,SAAS,oBAAA,CACd,QAAA,EACA,MAAA,EACA,QAAA,EACK;AACL,EAAA,MAAM,SAAS,eAAA,EAAgB;AAE/B,EAAA,OAAO,UAAA,CAAW;AAAA,IAChB,OAAA,EAAS,QAAA,CAAS,GAAA,CAAI,CAAA,OAAA,MAAY;AAAA,MAChC,GAAG,sBAAA,CAAuB,MAAA,EAAQ,OAAO,CAAA;AAAA,MACzC,cAAA,EAAgB,KAAA;AAAA,MAChB,oBAAA,EAAsB,KAAA;AAAA,MACtB,kBAAA,EAAoB,KAAA;AAAA,MACpB,MAAA,EAAQ,CAAC,IAAA,KAAyB,MAAA,CAAO,SAAS,IAAI;AAAA,KACxD,CAAE,CAAA;AAAA,IACF,OAAA,EAAS,aACP,OAAA,CAAQ,GAAA;AAAA,MAAI,CAAC,MAAA,EAAQ,KAAA,KACnB,MAAA,CAAO,IAAA,KAAS,MAAA,GAAY,QAAA,CAAS,QAAA,CAAS,KAAK,CAAA,IAAK,EAAE,CAAA,GAAK,MAAA,CAAO;AAAA;AACxE,GACH,CAAA;AACH;;;;"}

package/dist/domains/traces/hooks/use-trace-url-state.cjs.js

@@ -30,7 +30,7 @@ function useTraceUrlState(searchParams, setSearchParams, options) {
   const { onRemoveAll } = options ?? {};
   const datePreset = React.useMemo(() => {
     const value = searchParams.get(domains_traces_traceFilters.TRACE_DATE_PRESET_PARAM);
-    return value && domains_traces_traceFilters.TRACE_DATE_PRESET_VALUES.has(value) ? value : "last-24h";
+    return value && value !== "all" && domains_traces_traceFilters.TRACE_DATE_PRESET_VALUES.has(value) ? value : "last-7d";
   }, [searchParams]);
   const dateFromParamRaw = searchParams.get(domains_traces_traceFilters.TRACE_DATE_FROM_PARAM);
   const dateToParamRaw = searchParams.get(domains_traces_traceFilters.TRACE_DATE_TO_PARAM);
@@ -244,13 +244,31 @@ function useTraceUrlState(searchParams, setSearchParams, options) {
     },
     [setSearchParams]
   );
+  const handleDateRangeChange = React.useCallback(
+    (from, to) => {
+      if (datePresetRef.current !== "custom") return;
+      setSearchParams(
+        (prev) => {
+          const next = new URLSearchParams(prev);
+          if (from) next.set(domains_traces_traceFilters.TRACE_DATE_FROM_PARAM, from.toISOString());
+          else next.delete(domains_traces_traceFilters.TRACE_DATE_FROM_PARAM);
+          if (to) next.set(domains_traces_traceFilters.TRACE_DATE_TO_PARAM, to.toISOString());
+          else next.delete(domains_traces_traceFilters.TRACE_DATE_TO_PARAM);
+          clearSelectionParams(next);
+          return next;
+        },
+        { replace: true }
+      );
+    },
+    [setSearchParams]
+  );
   const handleDatePresetChange = React.useCallback(
     (preset) => {
       datePresetRef.current = preset;
       setSearchParams(
         (prev) => {
           const next = new URLSearchParams(prev);
-          if (preset === "last-24h") {
+          if (preset === "last-7d") {
             next.delete(domains_traces_traceFilters.TRACE_DATE_PRESET_PARAM);
             next.delete(domains_traces_traceFilters.TRACE_DATE_FROM_PARAM);
             next.delete(domains_traces_traceFilters.TRACE_DATE_TO_PARAM);
@@ -332,6 +350,7 @@ function useTraceUrlState(searchParams, setSearchParams, options) {
     handleListModeChange,
     handleFilterTokensChange,
     handleDateChange,
+    handleDateRangeChange,
     handleDatePresetChange,
     handleRemoveAll,
     applyFilterTokens