@roj-ai/debug 0.1.5 → 0.1.6

package/src/components/debug/communication/hooks/useDiagramData.ts

@@ -1,8 +1,8 @@
 import type { AgentTreeNode } from '@roj-ai/shared'
 import type { BuiltinEvent, DomainEvent } from '@roj-ai/sdk'
 import { useMemo } from 'react'
-import type { DiagramData, DiagramLLMBlock, DiagramMessage, DiagramParticipant, DiagramToolBlock, ParticipantRole, ParticipantStatus } from '../types'
-import { useTimeCompression } from './useTimeCompression'
+import type { DiagramData, DiagramLLMBlock, DiagramMessage, DiagramParticipant, DiagramToolBlock, ParticipantRole, ParticipantStatus } from '../types.js'
+import { useTimeCompression } from './useTimeCompression.js'
 
 interface UseDiagramDataProps {
 	events: DomainEvent[]

package/src/components/debug/communication/hooks/useTimeCompression.ts

@@ -1,5 +1,5 @@
 import { useMemo } from 'react'
-import type { TimeCompressionConfig, TimeSegment } from '../types'
+import type { TimeCompressionConfig, TimeSegment } from '../types.js'
 
 const DEFAULT_CONFIG: TimeCompressionConfig = {
 	pixelsPerSecond: 50,

package/src/components/debug/communication/hooks/useZoomPan.ts

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useRef, useState } from 'react'
-import type { ZoomPanState } from '../types'
+import type { ZoomPanState } from '../types.js'
 
 const MIN_ZOOM = 0.25
 const MAX_ZOOM = 4

package/src/components/debug/communication/popovers/ElementPopover.tsx

@@ -1,4 +1,4 @@
-import type { DiagramLLMBlock, DiagramMessage, DiagramToolBlock, PopoverElement, TimeSegment } from '../types'
+import type { DiagramLLMBlock, DiagramMessage, DiagramToolBlock, PopoverElement, TimeSegment } from '../types.js'
 
 interface ElementPopoverProps {
 	element: PopoverElement

package/src/components/debug/index.ts

@@ -5,16 +5,16 @@
  */
 
 // Context (host app must provide this)
-export { DebugContext, useDebugContext, type DebugContextValue } from './DebugContext'
+export { DebugContext, useDebugContext, type DebugContextValue } from './DebugContext.js'
 
 // Navigation utilities
-export { DebugLink, useDebugNavigate, useDebugParams, useDebugSessionId } from './DebugNavigation'
+export { DebugLink, useDebugNavigate, useDebugParams, useDebugSessionId } from './DebugNavigation.js'
 
 // Shell (layout without router dependency)
-export { BackIcon, DebugShell, getNavItemClassName, navItems, type NavItem } from './DebugShell'
+export { BackIcon, DebugShell, getNavItemClassName, navItems, type NavItem } from './DebugShell.js'
 
 // Detail components
-export { LLMCallDetail } from './LLMCallDetail'
+export { LLMCallDetail } from './LLMCallDetail.js'
 
 // Pages
 export {
@@ -31,7 +31,7 @@ export {
 	ServicesPage,
 	TimelinePage,
 	UserChatPage,
-} from './pages'
+} from './pages/index.js'
 
 // Communication diagram components
-export { CommunicationDiagram } from './communication/CommunicationDiagram'
+export { CommunicationDiagram } from './communication/CommunicationDiagram.js'

package/src/components/debug/pages/AgentDetailPage.tsx

@@ -7,13 +7,13 @@ import type {
 import { AgentId } from "@roj-ai/shared";
 import { type FormEvent, useCallback, useMemo, useState } from "react";
 import { api, unwrap } from "@roj-ai/client";
-import { useAgentDetail, useEventStore } from "../../../stores/event-store";
-import { formatDuration } from "../../../utils/format";
+import { useAgentDetail, useEventStore } from "../../../stores/event-store.js";
+import { formatDuration } from "../../../utils/format.js";
 import {
 	DebugLink,
 	useDebugParams,
 	useDebugSessionId,
-} from "../DebugNavigation";
+} from "../DebugNavigation.js";
 
 function formatTime(ts: number | undefined): string | null {
 	if (ts === undefined) return null;

package/src/components/debug/pages/AgentsPage.tsx

@@ -4,10 +4,10 @@ import { AgentId } from '@roj-ai/shared'
 import type { RpcOutput } from '@roj-ai/shared/rpc'
 import { useCallback, useEffect, useState } from 'react'
 import { api, unwrap } from '@roj-ai/client'
-import { useAgentTree, useEventStore } from '../../../stores/event-store'
-import { useDebugContext } from '../DebugContext'
-import { DebugLink, useDebugSessionId } from '../DebugNavigation'
-import { AgentDetailPage } from './AgentDetailPage'
+import { useAgentTree, useEventStore } from '../../../stores/event-store.js'
+import { useDebugContext } from '../DebugContext.js'
+import { DebugLink, useDebugSessionId } from '../DebugNavigation.js'
+import { AgentDetailPage } from './AgentDetailPage.js'
 
 export function AgentsPage() {
 	const sessionId = useDebugSessionId()

package/src/components/debug/pages/CommunicationPage.tsx

@@ -1,6 +1,6 @@
-import { useAgentTree, useEvents, useEventStore } from '../../../stores/event-store'
-import { CommunicationDiagram } from '../communication/CommunicationDiagram'
-import { useDiagramData } from '../communication/hooks/useDiagramData'
+import { useAgentTree, useEvents, useEventStore } from '../../../stores/event-store.js'
+import { CommunicationDiagram } from '../communication/CommunicationDiagram.js'
+import { useDiagramData } from '../communication/hooks/useDiagramData.js'
 
 export function CommunicationPage() {
 	// Get events and agents from event store (already loaded by DebugLayout)

package/src/components/debug/pages/DashboardPage.tsx

@@ -7,10 +7,10 @@ import {
 	useMetrics,
 	useSessionInfo,
 	useTimeline,
-} from "../../../stores/event-store";
-import { formatDuration } from "../../../utils/format";
-import { useDebugNavigate } from "../DebugNavigation";
-import { TimelineDetailInspector } from "../TimelineDetailInspector";
+} from "../../../stores/event-store.js";
+import { formatDuration } from "../../../utils/format.js";
+import { useDebugNavigate } from "../DebugNavigation.js";
+import { TimelineDetailInspector } from "../TimelineDetailInspector.js";
 
 export function DashboardPage() {
 	const sessionInfo = useSessionInfo();

package/src/components/debug/pages/EventsPage.tsx

@@ -1,8 +1,8 @@
 import type { BuiltinEvent, DomainEvent, InferenceCompletedEvent, InferenceFailedEvent } from '@roj-ai/sdk'
 import { useCallback, useMemo, useState } from 'react'
-import { DebugLink, useDebugSessionId } from '../DebugNavigation'
+import { DebugLink, useDebugSessionId } from '../DebugNavigation.js'
 import { api, unwrap } from '@roj-ai/client'
-import { useEvents, useEventStore } from '../../../stores/event-store'
+import { useEvents, useEventStore } from '../../../stores/event-store.js'
 
 const EVENT_TYPES = [
 	'all',

package/src/components/debug/pages/FilesPage.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useState } from 'react'
 import { api, getApiBaseUrl } from '@roj-ai/client'
-import { useDebugSessionId } from '../DebugNavigation'
+import { useDebugSessionId } from '../DebugNavigation.js'
 
 type Root = 'session' | 'workspace'
 

package/src/components/debug/pages/LLMCallPage.tsx

@@ -1,5 +1,5 @@
-import { DebugLink, useDebugParams, useDebugSessionId } from '../DebugNavigation'
-import { LLMCallDetail } from '../LLMCallDetail'
+import { DebugLink, useDebugParams, useDebugSessionId } from '../DebugNavigation.js'
+import { LLMCallDetail } from '../LLMCallDetail.js'
 
 export function LLMCallPage() {
 	const sessionId = useDebugSessionId()

package/src/components/debug/pages/LLMCallsPage.tsx

@@ -2,8 +2,8 @@ import type { LLMCallLogEntry } from '@roj-ai/sdk'
 import type { AgentId } from '@roj-ai/shared'
 import { useCallback, useEffect, useMemo, useState } from 'react'
 import { api, unwrap } from '@roj-ai/client'
-import { useEventStore } from '../../../stores/event-store'
-import { DebugLink, useDebugSessionId } from '../DebugNavigation'
+import { useEventStore } from '../../../stores/event-store.js'
+import { DebugLink, useDebugSessionId } from '../DebugNavigation.js'
 
 function isLLMCallLogEntry(data: unknown): data is LLMCallLogEntry {
 	return typeof data === 'object' && data !== null && 'id' in data && 'status' in data && 'request' in data

package/src/components/debug/pages/LogsPage.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { api } from "@roj-ai/client";
-import { useDebugSessionId } from "../DebugNavigation";
+import { useDebugSessionId } from "../DebugNavigation.js";
 
 type LogLevel = "debug" | "info" | "warn" | "error";
 

package/src/components/debug/pages/MailboxPage.tsx

@@ -1,7 +1,7 @@
 import type { GlobalMailboxMessage } from '@roj-ai/shared'
 import { useState } from 'react'
-import { useEventStore, useGlobalMailbox } from '../../../stores/event-store'
-import { DebugLink } from '../DebugNavigation'
+import { useEventStore, useGlobalMailbox } from '../../../stores/event-store.js'
+import { DebugLink } from '../DebugNavigation.js'
 
 export function MailboxPage() {
 	// Get mailbox from event store (already loaded by DebugLayout)

package/src/components/debug/pages/ServicesPage.tsx

@@ -1,8 +1,8 @@
 import { useCallback, useState } from 'react'
 import type { ServiceEntry, ServiceStatus } from '@roj-ai/shared'
 import { api } from '@roj-ai/client'
-import { useDebugSessionId } from '../DebugNavigation'
-import { useEventStore } from '../../../stores/event-store'
+import { useDebugSessionId } from '../DebugNavigation.js'
+import { useEventStore } from '../../../stores/event-store.js'
 
 const statusColors: Record<ServiceStatus, string> = {
 	stopped: 'bg-slate-100 text-slate-700',

package/src/components/debug/pages/TimelinePage.tsx

@@ -1,8 +1,8 @@
 import type { TimelineItem } from '@roj-ai/shared'
 import { useState } from 'react'
-import { DebugLink, useDebugSessionId } from '../DebugNavigation'
-import { useEventStore, useTimeline } from '../../../stores/event-store'
-import { LLMCallDetail } from '../LLMCallDetail'
+import { DebugLink, useDebugSessionId } from '../DebugNavigation.js'
+import { useEventStore, useTimeline } from '../../../stores/event-store.js'
+import { LLMCallDetail } from '../LLMCallDetail.js'
 
 export function TimelinePage() {
 	const sessionId = useDebugSessionId()

package/src/components/debug/pages/UserChatPage.tsx

@@ -1,7 +1,7 @@
 import type { DebugChatMessage } from '@roj-ai/shared'
 import { useState } from 'react'
-import { DebugLink } from '../DebugNavigation'
-import { useChatDebug, useEventStore } from '../../../stores/event-store'
+import { DebugLink } from '../DebugNavigation.js'
+import { useChatDebug, useEventStore } from '../../../stores/event-store.js'
 
 export function UserChatPage() {
 

package/src/components/debug/pages/index.ts

@@ -1,13 +1,13 @@
-export { AgentDetailPage } from './AgentDetailPage'
-export { DashboardPage } from './DashboardPage'
-export { AgentsPage } from './AgentsPage'
-export { CommunicationPage } from './CommunicationPage'
-export { EventsPage } from './EventsPage'
-export { LLMCallPage } from './LLMCallPage'
-export { LLMCallsPage } from './LLMCallsPage'
-export { MailboxPage } from './MailboxPage'
-export { TimelinePage } from './TimelinePage'
-export { UserChatPage } from './UserChatPage'
-export { FilesPage } from './FilesPage'
-export { LogsPage } from './LogsPage'
-export { ServicesPage } from './ServicesPage'
+export { AgentDetailPage } from './AgentDetailPage.js'
+export { DashboardPage } from './DashboardPage.js'
+export { AgentsPage } from './AgentsPage.js'
+export { CommunicationPage } from './CommunicationPage.js'
+export { EventsPage } from './EventsPage.js'
+export { LLMCallPage } from './LLMCallPage.js'
+export { LLMCallsPage } from './LLMCallsPage.js'
+export { MailboxPage } from './MailboxPage.js'
+export { TimelinePage } from './TimelinePage.js'
+export { UserChatPage } from './UserChatPage.js'
+export { FilesPage } from './FilesPage.js'
+export { LogsPage } from './LogsPage.js'
+export { ServicesPage } from './ServicesPage.js'

package/src/index.ts

@@ -19,10 +19,10 @@ export {
 	useMetrics,
 	useSessionInfo,
 	useTimeline,
-} from './stores/event-store'
+} from './stores/event-store.js'
 
 // Event polling provider
-export { EventPollingProvider, useEventPolling } from './providers/EventPollingProvider'
+export { EventPollingProvider, useEventPolling } from './providers/EventPollingProvider.js'
 
 // Debug components (context, navigation, shell, pages, diagrams)
 export {
@@ -51,5 +51,5 @@ export {
 	useDebugParams,
 	useDebugSessionId,
 	UserChatPage,
-} from './components/debug'
-export type { DebugContextValue, NavItem } from './components/debug'
+} from './components/debug/index.js'
+export type { DebugContextValue, NavItem } from './components/debug/index.js'

package/src/providers/EventPollingProvider.tsx

@@ -1,5 +1,5 @@
 import { useEffect } from 'react'
-import { useEventStore } from '../stores/event-store'
+import { useEventStore } from '../stores/event-store.js'
 
 interface EventPollingProviderProps {
 	sessionId: string