flare-chat-core 0.2.1 → 0.2.3

package/src/adapters/sse-client.js

@@ -0,0 +1,244 @@
+const API_BASE_URL = import.meta.env.DEV ? '' : import.meta.env.VITE_API_URL || '';
+const DEFAULT_ENDPOINT = '/api/v1/chat/stream';
+
+function joinUrl(baseUrl, endpoint) {
+  if (!baseUrl) {
+    return endpoint;
+  }
+
+  if (!endpoint) {
+    return baseUrl;
+  }
+
+  return `${baseUrl.replace(/\/+$/, '')}/${endpoint.replace(/^\/+/, '')}`;
+}
+
+function buildClientRequestId() {
+  const random = Math.random().toString(36).slice(2, 10);
+  return `req_${Date.now()}_${random}`;
+}
+
+export class SSEClient {
+  constructor({ endpoint = DEFAULT_ENDPOINT, baseUrl = API_BASE_URL } = {}) {
+    this.abortController = null;
+    this.endpoint = endpoint;
+    this.baseUrl = baseUrl;
+    this.activeRequestId = '';
+    this.authReadyPromise = null;
+    this.authReadyAtMs = 0;
+  }
+
+  async sendMessage(sessionOrParams, contentArg, onEventArg, onCompleteArg, onErrorArg, optionsArg = {}) {
+    const isObjectCall = typeof sessionOrParams === 'object' && sessionOrParams !== null;
+    const params = isObjectCall
+      ? sessionOrParams
+      : {
+          sessionId: sessionOrParams,
+          content: contentArg,
+          enabledCapabilities: optionsArg.enabledCapabilities || [],
+        };
+
+    const sessionId = params.sessionId;
+    const content = params.content;
+    const enabledCapabilities = Array.isArray(params.enabledCapabilities) ? params.enabledCapabilities : [];
+    const modeKey = typeof params.modeKey === 'string' ? params.modeKey.trim() : '';
+    const manualModeKey = typeof params.manualModeKey === 'string' ? params.manualModeKey.trim() : '';
+    const payloadExtra = (
+      params.payloadExtra
+      && typeof params.payloadExtra === 'object'
+      && !Array.isArray(params.payloadExtra)
+    )
+      ? params.payloadExtra
+      : {};
+    const onEvent = isObjectCall ? contentArg : onEventArg;
+    const onComplete = isObjectCall ? onEventArg : onCompleteArg;
+    const onError = isObjectCall ? onCompleteArg : onErrorArg;
+    const url = params.url || joinUrl(params.baseUrl ?? this.baseUrl, params.endpoint || this.endpoint);
+    const command = typeof params.command === 'string' && params.command.trim()
+      ? params.command.trim()
+      : (typeof payloadExtra.command === 'string' && payloadExtra.command.trim() ? payloadExtra.command.trim() : 'send_message');
+    const clientRequestId = typeof params.clientRequestId === 'string' && params.clientRequestId.trim()
+      ? params.clientRequestId.trim()
+      : buildClientRequestId();
+    const contractVersion = typeof params.contractVersion === 'string' && params.contractVersion.trim()
+      ? params.contractVersion.trim()
+      : 'flare.v1';
+    const lastTurnId = typeof params.lastTurnId === 'string' ? params.lastTurnId.trim() : '';
+    const token = typeof params.token === 'string' ? params.token.trim() : '';
+    const onTiming = typeof params.onTiming === 'function' ? params.onTiming : null;
+    const authProvider = (
+      params.auth
+      && typeof params.auth === 'object'
+      && !Array.isArray(params.auth)
+    ) ? params.auth : null;
+
+    const nowMs = Date.now();
+    onTiming?.({
+      point: 't_submit',
+      at_ms: nowMs,
+      request_id: clientRequestId,
+      session_id: String(sessionId || '').trim(),
+    });
+
+    const waitAuthReady = async () => {
+      if (!authProvider || typeof authProvider.ensureReady !== 'function') {
+        return {
+          authorizationToken: token,
+          authReadyAtMs: nowMs,
+        };
+      }
+      if (!this.authReadyPromise) {
+        this.authReadyPromise = Promise.resolve()
+          .then(() => authProvider.ensureReady())
+          .then((resolved) => {
+            this.authReadyAtMs = Date.now();
+            return resolved || null;
+          })
+          .finally(() => {
+            this.authReadyPromise = null;
+          });
+      }
+      const authResult = await this.authReadyPromise;
+      const tokenFromAuthResult = typeof authResult?.token === 'string' ? authResult.token.trim() : '';
+      const tokenFromProvider = typeof authProvider.getToken === 'function'
+        ? String(authProvider.getToken() || '').trim()
+        : '';
+      return {
+        authorizationToken: tokenFromAuthResult || tokenFromProvider || token,
+        authReadyAtMs: this.authReadyAtMs || Date.now(),
+      };
+    };
+
+    const currentRequestId = clientRequestId;
+    if (this.abortController) {
+      this.abortController.abort();
+      this.abortController = null;
+    }
+    this.abortController = new AbortController();
+    this.activeRequestId = currentRequestId;
+
+    try {
+      const authResolved = await waitAuthReady();
+      onTiming?.({
+        point: 't_auth_ready',
+        at_ms: authResolved.authReadyAtMs || Date.now(),
+        request_id: currentRequestId,
+        session_id: String(sessionId || '').trim(),
+      });
+      if (this.activeRequestId !== currentRequestId) {
+        return;
+      }
+      const response = await fetch(url, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          ...(authResolved.authorizationToken ? { Authorization: `Bearer ${authResolved.authorizationToken}` } : {}),
+        },
+        body: JSON.stringify({
+          contract_version: contractVersion,
+          client_request_id: clientRequestId,
+          command,
+          last_turn_id: lastTurnId || null,
+          message: content,
+          session_id: sessionId,
+          enabled_capabilities: enabledCapabilities,
+          ...(modeKey ? { mode: modeKey } : {}),
+          ...(manualModeKey ? { manual_mode: manualModeKey } : {}),
+          payload: {
+            message: content,
+            ...(modeKey ? { mode: modeKey } : {}),
+            ...(manualModeKey ? { manual_mode: manualModeKey } : {}),
+            ...payloadExtra,
+          },
+        }),
+        signal: this.abortController.signal,
+      });
+      onTiming?.({
+        point: 't_stream_connected',
+        at_ms: Date.now(),
+        request_id: currentRequestId,
+        session_id: String(sessionId || '').trim(),
+      });
+
+      if (!response.ok) {
+        throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+      }
+
+      const reader = response.body.getReader();
+      const decoder = new TextDecoder();
+      let buffer = '';
+      let currentEvent = '';
+
+      while (true) {
+        const { done, value } = await reader.read();
+        if (done) break;
+
+        buffer += decoder.decode(value, { stream: true });
+        const lines = buffer.split('\n');
+        buffer = lines.pop() || '';
+
+        for (const line of lines) {
+          if (line.startsWith('event:')) {
+            currentEvent = line.substring(6).trim();
+            continue;
+          }
+
+          if (!line.startsWith('data:')) {
+            continue;
+          }
+
+          const data = line.substring(5).trim();
+          if (!data || !currentEvent) {
+            continue;
+          }
+
+          try {
+            const eventData = JSON.parse(data);
+            if (this.activeRequestId !== currentRequestId) {
+              return;
+            }
+            onEvent?.({
+              type: currentEvent,
+              data: eventData,
+            });
+
+            if (currentEvent === 'complete' || currentEvent === 'done') {
+              await onComplete?.();
+              if (this.activeRequestId === currentRequestId) {
+                this.abortController = null;
+                this.activeRequestId = '';
+              }
+              return;
+            }
+          } catch (error) {
+            console.error('SSE 数据解析失败:', error, 'data:', data);
+          }
+        }
+      }
+
+      await onComplete?.();
+      if (this.activeRequestId === currentRequestId) {
+        this.abortController = null;
+        this.activeRequestId = '';
+      }
+    } catch (error) {
+      if (error?.name === 'AbortError') {
+        return;
+      }
+
+      onError?.(error instanceof Error ? error.message : '发送消息失败');
+      if (this.activeRequestId === currentRequestId) {
+        this.abortController = null;
+        this.activeRequestId = '';
+      }
+    }
+  }
+
+  abort() {
+    if (this.abortController) {
+      this.abortController.abort();
+      this.abortController = null;
+    }
+    this.activeRequestId = '';
+  }
+}

package/src/adapters/sse-event-dispatcher.js

@@ -0,0 +1,121 @@
+import {
+  parseAck,
+  parseAgentStatus,
+  parseThinkingTrace,
+  parseExecutionTrace,
+  parseContent,
+  parseDone,
+  parsePatch,
+  parsePhaseEvent,
+  parseTextDelta,
+  parseTextReplace,
+  parseTrace,
+  parseFieldProgress,
+  parseDoc,
+  parseRequirementDraft,
+  parseNextActions,
+  parseSourcingCandidates,
+  parseRiskSummary,
+  parseShortlistUpdated,
+  parseEvaluationReportReady,
+  parseWorkspaceActivation,
+  parseUICards,
+  parseKnowledgeBaseState,
+  parseCategoryIdentified,
+  parseCapabilitySuggestion,
+  parseFieldsUpdated,
+  parseInstanceProfile,
+  parseModeRuntime,
+  parseAgentRuntime,
+  parseSkillRuntime,
+  parseModeSwitchReason,
+  parseKnowledgeSearch,
+  parseKnowledgeCitation,
+  parseOrchestrationStatus,
+  parseCanvasState,
+  parseCanvasRevision,
+  parsePlanBlock,
+  parsePatchEvent,
+  parseSSEError,
+} from '../contracts/sse-events.js';
+
+function handlePatchEvent(event, context) {
+  const parsedPatchEvent = parsePatchEvent(event.data);
+  const patchSessionId = String(parsedPatchEvent?.session?.session_id || '').trim();
+  if (patchSessionId) {
+    context.setLatestSessionId(patchSessionId);
+  }
+  context.handlers.onPatchEvent?.(parsedPatchEvent);
+}
+
+export function dispatchSSEEvent(event, context) {
+  const handlersByType = {
+    ack: () => context.handlers.onAck?.(parseAck(event.data)),
+    'phase.start': () => context.handlers.onPhaseStart?.(parsePhaseEvent(event.data)),
+    'phase.update': () => context.handlers.onPhaseUpdate?.(parsePhaseEvent(event.data)),
+    'phase.end': () => context.handlers.onPhaseEnd?.(parsePhaseEvent(event.data)),
+    patch: () => context.handlers.onPatch?.(parsePatch(event.data)),
+    agent_status: () => context.handlers.onAgentStatus?.(parseAgentStatus(event.data)),
+    thinking_trace: () => context.handlers.onThinkingTrace?.(parseThinkingTrace(event.data)),
+    execution_trace: () => context.handlers.onExecutionTrace?.(parseExecutionTrace(event.data)),
+    step_started: () => context.handlers.onExecutionTrace?.(parseExecutionTrace(event.data)),
+    step_updated: () => context.handlers.onExecutionTrace?.(parseExecutionTrace(event.data)),
+    step_completed: () => context.handlers.onExecutionTrace?.(parseExecutionTrace(event.data)),
+    step_failed: () => context.handlers.onExecutionTrace?.(parseExecutionTrace(event.data)),
+    content: () => {
+      const { chunk } = parseContent(event.data);
+      context.appendChunk(chunk);
+      context.handlers.onContent?.(chunk);
+    },
+    'text.delta': () => {
+      const parsed = parseTextDelta(event.data);
+      if (parsed.channel === 'assistant' && parsed.delta) {
+        context.appendChunk(parsed.delta);
+        context.handlers.onContent?.(parsed.delta);
+      }
+    },
+    'text.replace': () => {
+      const parsed = parseTextReplace(event.data);
+      if (parsed.channel === 'assistant') {
+        context.replaceChunk(parsed.content);
+        context.handlers.onTextReplace?.(parsed.content);
+      }
+    },
+    done: () => context.handlers.onDone?.(parseDone(event.data)),
+    trace: () => context.handlers.onTrace?.(parseTrace(event.data)),
+    workspace_activation: () => context.handlers.onWorkspaceActivation?.(parseWorkspaceActivation(event.data)),
+    ui_cards: () => context.handlers.onUICards?.(parseUICards(event.data)),
+    knowledge_base_state: () => context.handlers.onKnowledgeBaseState?.(parseKnowledgeBaseState(event.data)),
+    field_progress: () => context.handlers.onFieldProgress?.(parseFieldProgress(event.data)),
+    requirement_draft: () => context.handlers.onRequirementDraft?.(parseRequirementDraft(event.data)),
+    next_actions: () => context.handlers.onNextActions?.(parseNextActions(event.data)),
+    sourcing_candidates: () => context.handlers.onSourcingCandidates?.(parseSourcingCandidates(event.data)),
+    risk_summary: () => context.handlers.onRiskSummary?.(parseRiskSummary(event.data)),
+    shortlist_updated: () => context.handlers.onShortlistUpdated?.(parseShortlistUpdated(event.data)),
+    evaluation_report_ready: () => context.handlers.onEvaluationReportReady?.(parseEvaluationReportReady(event.data)),
+    category_identified: () => context.handlers.onCategoryIdentified?.(parseCategoryIdentified(event.data)),
+    fields_updated: () => context.handlers.onFieldsUpdated?.(parseFieldsUpdated(event.data)),
+    instance_profile: () => context.handlers.onInstanceProfile?.(parseInstanceProfile(event.data)),
+    mode_runtime: () => context.handlers.onModeRuntime?.(parseModeRuntime(event.data)),
+    agent_runtime: () => context.handlers.onAgentRuntime?.(parseAgentRuntime(event.data)),
+    skill_runtime: () => context.handlers.onSkillRuntime?.(parseSkillRuntime(event.data)),
+    mode_switch_reason: () => context.handlers.onModeSwitchReason?.(parseModeSwitchReason(event.data)),
+    knowledge_search: () => context.handlers.onKnowledgeSearch?.(parseKnowledgeSearch(event.data)),
+    knowledge_citation: () => context.handlers.onKnowledgeCitation?.(parseKnowledgeCitation(event.data)),
+    orchestration_status: () => context.handlers.onOrchestrationStatus?.(parseOrchestrationStatus(event.data)),
+    canvas_state: () => context.handlers.onCanvasState?.(parseCanvasState(event.data)),
+    canvas_revision: () => context.handlers.onCanvasRevision?.(parseCanvasRevision(event.data)),
+    plan_block: () => context.handlers.onPlanBlock?.(parsePlanBlock(event.data)),
+    doc: () => context.handlers.onDoc?.(parseDoc(event.data)),
+    capability_suggestion: () => context.handlers.onCapabilitySuggestion?.(parseCapabilitySuggestion(event.data)),
+    patch_event: () => handlePatchEvent(event, context),
+    error: () => context.handlers.onError?.(parseSSEError(event.data)),
+  };
+
+  const handler = handlersByType[event.type];
+  if (!handler) {
+    console.warn('[SSE] unknown event type:', event.type);
+    return;
+  }
+  handler();
+}

package/src/app/App.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import AppProviders from './AppProviders.jsx';
+import ChatWorkspaceScreen from './ChatWorkspaceScreen.jsx';
+
+export default function App(props = {}) {
+  return (
+    <AppProviders>
+      <ChatWorkspaceScreen {...props} />
+    </AppProviders>
+  );
+}

package/src/app/AppProviders.jsx

@@ -0,0 +1,12 @@
+import React from 'react';
+import { App as AntdApp, ConfigProvider } from 'antd';
+
+export default function AppProviders({ children }) {
+  return (
+    <ConfigProvider>
+      <AntdApp>
+        {children}
+      </AntdApp>
+    </ConfigProvider>
+  );
+}

package/src/app/ChatWorkspaceScreen.jsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import { useWorkspaceController } from './core-chat-entry/useWorkspaceController.jsx';
+import WorkspaceLayout from './WorkspaceLayout.jsx';
+
+export default function ChatWorkspaceScreen({
+  functionType = 'chat_component_debug',
+  defaultSessionTitle = '调试会话',
+  projectId = 'project_demo_001',
+  userId = 'user_demo_001',
+  backendMode = 'real',
+  kernelBaseUrl = 'http://127.0.0.1:18002',
+  apiBaseUrl = '',
+  apiToken = '',
+  defaultProjectName = '本地演示项目',
+  sessionAPI,
+  messageAPI,
+} = {}) {
+  const workspace = useWorkspaceController({
+    functionType,
+    defaultSessionTitle,
+    projectId,
+    userId,
+    backendMode,
+    kernelBaseUrl,
+    apiBaseUrl,
+    apiToken,
+    defaultProjectName,
+    sessionAPI,
+    messageAPI,
+  });
+
+  return <WorkspaceLayout {...workspace} />;
+}

package/src/app/WorkspaceLayout.jsx

@@ -0,0 +1,190 @@
+import React from 'react';
+import { Drawer } from 'antd';
+import {
+  WORKSPACE_CONTENT_MAX_WIDTH,
+  RESOLVED_UI_LABELS,
+  createWorkspaceStyle,
+} from './core-chat-entry/constants.js';
+import WorkspaceSessionPane from './components/WorkspaceSessionPane.jsx';
+import WorkspaceMainPane from './components/WorkspaceMainPane.jsx';
+
+const COMPACT_LAYOUT_QUERY = '(max-width: 767px)';
+
+export default function WorkspaceLayout({
+  themeTokens,
+  viewModel,
+  actionGuards,
+  apiReadinessGate,
+  hasProject,
+  projectItems,
+  projectSlot,
+  activeSession,
+  sessions,
+  projectNameEditing,
+  projectNameDraft,
+  setProjectNameDraft,
+  handleProjectNameSave,
+  handleProjectNameCancel,
+  projectDisplayName,
+  handleProjectNameStartEdit,
+  activeWorkspaceTab,
+  setActiveWorkspaceTab,
+  knowledgeHubPopoverContent,
+  knowledgeHubPopoverOpen,
+  setKnowledgeHubPopoverOpen,
+  handleOpenKnowledgeHub,
+  showCanvasPanel,
+  handleToggleWorkspacePanel,
+  composerNode,
+  handleOpenSourcePicker,
+  handleRemoveSource,
+  handleRetrySource,
+  handleViewSourceDetail,
+  sourceActionError,
+  sourceItems,
+  sourceRemovingId,
+  sourceSyncLoading,
+  sourceUploadLoading,
+  canvasPanelNode,
+  renderedTimelineItems,
+  handleUICardAction,
+  generativeRegistry,
+  showAllScenarios,
+  setShowAllScenarios,
+  visibleScenarios,
+  sourceFileInputRef,
+  handleSourceFileChange,
+}) {
+  const [isCompactLayout, setIsCompactLayout] = React.useState(false);
+  const [sidebarDrawerOpen, setSidebarDrawerOpen] = React.useState(false);
+
+  React.useEffect(() => {
+    if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') {
+      return undefined;
+    }
+
+    const mediaQuery = window.matchMedia(COMPACT_LAYOUT_QUERY);
+    const handleChange = (event) => {
+      const nextCompact = Boolean(event.matches);
+      setIsCompactLayout(nextCompact);
+      if (!nextCompact) {
+        setSidebarDrawerOpen(false);
+      }
+    };
+
+    setIsCompactLayout(mediaQuery.matches);
+
+    if (typeof mediaQuery.addEventListener === 'function') {
+      mediaQuery.addEventListener('change', handleChange);
+      return () => mediaQuery.removeEventListener('change', handleChange);
+    }
+
+    mediaQuery.addListener(handleChange);
+    return () => mediaQuery.removeListener(handleChange);
+  }, []);
+
+  const showInlineSidebar = !isCompactLayout;
+  const workspaceStyle = {
+    ...createWorkspaceStyle(themeTokens),
+    gridTemplateColumns: showInlineSidebar ? '300px minmax(0, 1fr)' : 'minmax(0, 1fr)',
+  };
+
+  return (
+    <div
+      className="flare-chat-workspace"
+      style={workspaceStyle}
+    >
+      {showInlineSidebar ? (
+        <WorkspaceSessionPane
+          themeTokens={themeTokens}
+          viewModel={viewModel}
+          actionGuards={actionGuards}
+          apiReadinessGate={apiReadinessGate}
+          hasProject={hasProject}
+          projectItems={projectItems}
+          projectSlot={projectSlot}
+          sessions={sessions}
+          resolvedUILabels={RESOLVED_UI_LABELS}
+        />
+      ) : null}
+
+      <WorkspaceMainPane
+        themeTokens={themeTokens}
+        hasProject={hasProject}
+        viewModel={viewModel}
+        projectSlot={projectSlot}
+        projectNameEditing={projectNameEditing}
+        projectNameDraft={projectNameDraft}
+        setProjectNameDraft={setProjectNameDraft}
+        handleProjectNameSave={handleProjectNameSave}
+        handleProjectNameCancel={handleProjectNameCancel}
+        projectDisplayName={projectDisplayName}
+        handleProjectNameStartEdit={handleProjectNameStartEdit}
+        activeWorkspaceTab={activeWorkspaceTab}
+        setActiveWorkspaceTab={setActiveWorkspaceTab}
+        resolvedUILabels={RESOLVED_UI_LABELS}
+        activeSession={activeSession}
+        knowledgeHubPopoverContent={knowledgeHubPopoverContent}
+        knowledgeHubPopoverOpen={knowledgeHubPopoverOpen}
+        setKnowledgeHubPopoverOpen={setKnowledgeHubPopoverOpen}
+        handleOpenKnowledgeHub={handleOpenKnowledgeHub}
+        showCanvasPanel={showCanvasPanel}
+        handleToggleWorkspacePanel={handleToggleWorkspacePanel}
+        projectItems={projectItems}
+        actionGuards={actionGuards}
+        composerNode={composerNode}
+        contentMaxWidth={WORKSPACE_CONTENT_MAX_WIDTH}
+        handleOpenSourcePicker={handleOpenSourcePicker}
+        handleRemoveSource={handleRemoveSource}
+        handleRetrySource={handleRetrySource}
+        handleViewSourceDetail={handleViewSourceDetail}
+        sourceActionError={sourceActionError}
+        sourceItems={sourceItems}
+        sourceRemovingId={sourceRemovingId}
+        sourceSyncLoading={sourceSyncLoading}
+        sourceUploadLoading={sourceUploadLoading}
+        canvasPanelNode={canvasPanelNode}
+        renderedTimelineItems={renderedTimelineItems}
+        handleUICardAction={handleUICardAction}
+        generativeRegistry={generativeRegistry}
+        showAllScenarios={showAllScenarios}
+        setShowAllScenarios={setShowAllScenarios}
+        visibleScenarios={visibleScenarios}
+        isCompactLayout={isCompactLayout}
+        showSidebarMenuButton={isCompactLayout}
+        handleOpenSidebarMenu={() => setSidebarDrawerOpen(true)}
+      />
+
+      <Drawer
+        onClose={() => setSidebarDrawerOpen(false)}
+        open={isCompactLayout && sidebarDrawerOpen}
+        placement="left"
+        styles={{
+          body: { padding: 0 },
+          wrapper: { width: '86vw' },
+        }}
+      >
+        <WorkspaceSessionPane
+          themeTokens={themeTokens}
+          viewModel={viewModel}
+          actionGuards={actionGuards}
+          apiReadinessGate={apiReadinessGate}
+          hasProject={hasProject}
+          projectItems={projectItems}
+          projectSlot={projectSlot}
+          sessions={sessions}
+          resolvedUILabels={RESOLVED_UI_LABELS}
+          onAfterSidebarAction={() => setSidebarDrawerOpen(false)}
+        />
+      </Drawer>
+
+      <input
+        ref={sourceFileInputRef}
+        type="file"
+        multiple
+        style={{ display: 'none' }}
+        onChange={handleSourceFileChange}
+      />
+    </div>
+  );
+}

package/src/app/components/AppCanvasPanel.jsx

@@ -0,0 +1,64 @@
+import React from 'react';
+import { ChatWorkspaceCanvasSection } from 'flare-chat-ui';
+
+export default function AppCanvasPanel({
+  canvasActiveTabKey,
+  showCanvasPanel,
+  resolvedUILabels,
+  canvasFullscreenOpen,
+  canvasTabs,
+  resolvedCanvasEvidenceTabKey,
+  canvasEvidenceSummary,
+  canvasEvidenceItems,
+  canvasFocusEvidenceAnchorId,
+  canvasSourcingHasMore,
+  canvasSourcingLoadingMore,
+  onCanvasSourcingLoadMore,
+  canvasReportTemplate,
+  inputState,
+  setCanvasActiveTabKey,
+  setCanvasFullscreenOpen,
+  setShowCanvasPanel,
+  themeTokens,
+}) {
+  return (
+    <ChatWorkspaceCanvasSection
+      canvasPanelErrorFallback={null}
+      handleCanvasRenderError={() => {}}
+      canvasActiveTabKey={canvasActiveTabKey}
+      showCanvasPanel={showCanvasPanel}
+      canvasCollectedCount={0}
+      canvasDisplayLines={[]}
+      canvasDraftEditing={false}
+      canvasDraftEditorValue=""
+      resolvedUILabels={resolvedUILabels}
+      canvasFieldRows={[]}
+      canvasFullscreenOpen={canvasFullscreenOpen}
+      canvasManualControlsEnabled={false}
+      canvasProgressPercent={0}
+      canvasTabs={canvasTabs}
+      canvasEvidenceTabKey={resolvedCanvasEvidenceTabKey}
+      canvasEvidenceSummary={canvasEvidenceSummary}
+      canvasEvidenceItems={canvasEvidenceItems}
+      canvasFocusEvidenceAnchorId={canvasFocusEvidenceAnchorId}
+      canvasSourcingLoading={false}
+      canvasSourcingHasMore={canvasSourcingHasMore}
+      canvasSourcingLoadingMore={canvasSourcingLoadingMore}
+      onCanvasSourcingLoadMore={onCanvasSourcingLoadMore}
+      canvasReportTemplate={canvasReportTemplate}
+      resolvedCanvasAnalysisPayload={null}
+      inputState={inputState}
+      canvasWorkspaceFullscreenMode={false}
+      isCompactLayout={false}
+      handleCanvasApplyRevision={() => {}}
+      setCanvasActiveTabKey={setCanvasActiveTabKey}
+      setCanvasDraftEditorValue={() => {}}
+      handleCanvasCancelEdit={() => {}}
+      setCanvasFullscreenOpen={setCanvasFullscreenOpen}
+      setCanvasPanelOpen={setShowCanvasPanel}
+      handleCanvasSaveEdit={() => {}}
+      handleCanvasStartEdit={() => {}}
+      themeTokens={themeTokens}
+    />
+  );
+}