@within-7/minto 0.2.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/commands/agents/AgentsCommand.js +22 -24
- package/dist/commands/agents/AgentsCommand.js.map +2 -2
- package/dist/commands/context.js +2 -1
- package/dist/commands/context.js.map +2 -2
- package/dist/commands/export.js +2 -1
- package/dist/commands/export.js.map +2 -2
- package/dist/commands/mcp-interactive.js +7 -6
- package/dist/commands/mcp-interactive.js.map +2 -2
- package/dist/commands/model.js +3 -2
- package/dist/commands/model.js.map +2 -2
- package/dist/commands/permissions.js +4 -3
- package/dist/commands/permissions.js.map +2 -2
- package/dist/commands/plugin/AddMarketplaceForm.js +3 -2
- package/dist/commands/plugin/AddMarketplaceForm.js.map +2 -2
- package/dist/commands/plugin/ConfirmDialog.js +2 -1
- package/dist/commands/plugin/ConfirmDialog.js.map +2 -2
- package/dist/commands/plugin/ErrorView.js +2 -1
- package/dist/commands/plugin/ErrorView.js.map +2 -2
- package/dist/commands/plugin/InstalledPluginsByMarketplace.js +5 -4
- package/dist/commands/plugin/InstalledPluginsByMarketplace.js.map +2 -2
- package/dist/commands/plugin/InstalledPluginsManager.js +5 -4
- package/dist/commands/plugin/InstalledPluginsManager.js.map +2 -2
- package/dist/commands/plugin/MainMenu.js +2 -1
- package/dist/commands/plugin/MainMenu.js.map +2 -2
- package/dist/commands/plugin/MarketplaceManager.js +5 -4
- package/dist/commands/plugin/MarketplaceManager.js.map +2 -2
- package/dist/commands/plugin/MarketplaceSelector.js +4 -3
- package/dist/commands/plugin/MarketplaceSelector.js.map +2 -2
- package/dist/commands/plugin/PlaceholderScreen.js +3 -2
- package/dist/commands/plugin/PlaceholderScreen.js.map +2 -2
- package/dist/commands/plugin/PluginBrowser.js +6 -5
- package/dist/commands/plugin/PluginBrowser.js.map +2 -2
- package/dist/commands/plugin/PluginDetailsInstall.js +5 -4
- package/dist/commands/plugin/PluginDetailsInstall.js.map +2 -2
- package/dist/commands/plugin/PluginDetailsManage.js +4 -3
- package/dist/commands/plugin/PluginDetailsManage.js.map +2 -2
- package/dist/commands/plugin.js +16 -15
- package/dist/commands/plugin.js.map +2 -2
- package/dist/commands/sandbox.js +4 -3
- package/dist/commands/sandbox.js.map +2 -2
- package/dist/commands/setup.js +2 -1
- package/dist/commands/setup.js.map +2 -2
- package/dist/commands/status.js +2 -1
- package/dist/commands/status.js.map +2 -2
- package/dist/commands/undo.js +245 -0
- package/dist/commands/undo.js.map +7 -0
- package/dist/commands.js +2 -0
- package/dist/commands.js.map +2 -2
- package/dist/components/AgentThinkingBlock.js +1 -1
- package/dist/components/AgentThinkingBlock.js.map +2 -2
- package/dist/components/AsciiLogo.js +7 -8
- package/dist/components/AsciiLogo.js.map +2 -2
- package/dist/components/AskUserQuestionDialog/AskUserQuestionDialog.js +3 -2
- package/dist/components/AskUserQuestionDialog/AskUserQuestionDialog.js.map +2 -2
- package/dist/components/AskUserQuestionDialog/QuestionView.js +2 -1
- package/dist/components/AskUserQuestionDialog/QuestionView.js.map +2 -2
- package/dist/components/CollapsibleHint.js +2 -1
- package/dist/components/CollapsibleHint.js.map +2 -2
- package/dist/components/Config.js +3 -2
- package/dist/components/Config.js.map +2 -2
- package/dist/components/ConsoleOAuthFlow.js +2 -1
- package/dist/components/ConsoleOAuthFlow.js.map +2 -2
- package/dist/components/Cost.js +2 -1
- package/dist/components/Cost.js.map +2 -2
- package/dist/components/HeaderBar.js +13 -8
- package/dist/components/HeaderBar.js.map +2 -2
- package/dist/components/HistorySearchOverlay.js +4 -3
- package/dist/components/HistorySearchOverlay.js.map +2 -2
- package/dist/components/HotkeyHelpPanel.js +8 -11
- package/dist/components/HotkeyHelpPanel.js.map +2 -2
- package/dist/components/InvalidConfigDialog.js +2 -1
- package/dist/components/InvalidConfigDialog.js.map +2 -2
- package/dist/components/Logo.js +23 -67
- package/dist/components/Logo.js.map +2 -2
- package/dist/components/MCPServerApprovalDialog.js +2 -1
- package/dist/components/MCPServerApprovalDialog.js.map +2 -2
- package/dist/components/MCPServerDialogCopy.js +2 -1
- package/dist/components/MCPServerDialogCopy.js.map +2 -2
- package/dist/components/MCPServerMultiselectDialog.js +2 -1
- package/dist/components/MCPServerMultiselectDialog.js.map +2 -2
- package/dist/components/MessageSelector.js +4 -3
- package/dist/components/MessageSelector.js.map +2 -2
- package/dist/components/ModeIndicator.js +2 -1
- package/dist/components/ModeIndicator.js.map +2 -2
- package/dist/components/ModelConfig.js +4 -3
- package/dist/components/ModelConfig.js.map +2 -2
- package/dist/components/ModelListManager.js +4 -3
- package/dist/components/ModelListManager.js.map +2 -2
- package/dist/components/ModelSelector/ModelSelector.js +26 -13
- package/dist/components/ModelSelector/ModelSelector.js.map +2 -2
- package/dist/components/Onboarding.js +3 -2
- package/dist/components/Onboarding.js.map +2 -2
- package/dist/components/OperationSummary.js +130 -0
- package/dist/components/OperationSummary.js.map +7 -0
- package/dist/components/PromptInput.js +88 -75
- package/dist/components/PromptInput.js.map +2 -2
- package/dist/components/SensitiveFileWarning.js +31 -0
- package/dist/components/SensitiveFileWarning.js.map +7 -0
- package/dist/components/Spinner.js +71 -22
- package/dist/components/Spinner.js.map +2 -2
- package/dist/components/StructuredDiff.js +6 -8
- package/dist/components/StructuredDiff.js.map +2 -2
- package/dist/components/SubagentBlock.js +4 -2
- package/dist/components/SubagentBlock.js.map +2 -2
- package/dist/components/SubagentProgress.js +7 -4
- package/dist/components/SubagentProgress.js.map +2 -2
- package/dist/components/TaskCard.js +14 -11
- package/dist/components/TaskCard.js.map +2 -2
- package/dist/components/TextInput.js +9 -1
- package/dist/components/TextInput.js.map +2 -2
- package/dist/components/TodoPanel.js +44 -26
- package/dist/components/TodoPanel.js.map +2 -2
- package/dist/components/ToolUseLoader.js +2 -2
- package/dist/components/ToolUseLoader.js.map +2 -2
- package/dist/components/TreeConnector.js +4 -3
- package/dist/components/TreeConnector.js.map +2 -2
- package/dist/components/TrustDialog.js +2 -1
- package/dist/components/TrustDialog.js.map +2 -2
- package/dist/components/binary-feedback/BinaryFeedbackView.js +2 -1
- package/dist/components/binary-feedback/BinaryFeedbackView.js.map +2 -2
- package/dist/components/messages/AssistantTextMessage.js +17 -9
- package/dist/components/messages/AssistantTextMessage.js.map +2 -2
- package/dist/components/messages/AssistantToolUseMessage.js +8 -4
- package/dist/components/messages/AssistantToolUseMessage.js.map +2 -2
- package/dist/components/messages/GroupRenderer.js +2 -1
- package/dist/components/messages/GroupRenderer.js.map +2 -2
- package/dist/components/messages/NestedTasksPreview.js +13 -1
- package/dist/components/messages/NestedTasksPreview.js.map +2 -2
- package/dist/components/messages/ParallelTasksGroupView.js +4 -3
- package/dist/components/messages/ParallelTasksGroupView.js.map +2 -2
- package/dist/components/messages/TaskInModuleView.js +35 -15
- package/dist/components/messages/TaskInModuleView.js.map +2 -2
- package/dist/components/messages/TaskOutputContent.js +9 -6
- package/dist/components/messages/TaskOutputContent.js.map +2 -2
- package/dist/components/messages/UserPromptMessage.js +2 -2
- package/dist/components/messages/UserPromptMessage.js.map +2 -2
- package/dist/constants/colors.js +90 -72
- package/dist/constants/colors.js.map +2 -2
- package/dist/constants/toolInputExamples.js +84 -0
- package/dist/constants/toolInputExamples.js.map +7 -0
- package/dist/core/backupManager.js +321 -0
- package/dist/core/backupManager.js.map +7 -0
- package/dist/core/costTracker.js +9 -18
- package/dist/core/costTracker.js.map +2 -2
- package/dist/core/gitAutoCommit.js +287 -0
- package/dist/core/gitAutoCommit.js.map +7 -0
- package/dist/core/index.js +3 -0
- package/dist/core/index.js.map +2 -2
- package/dist/core/operationTracker.js +212 -0
- package/dist/core/operationTracker.js.map +7 -0
- package/dist/core/permissions/rules/allowedToolsRule.js +1 -1
- package/dist/core/permissions/rules/allowedToolsRule.js.map +2 -2
- package/dist/core/permissions/rules/autoEscalationRule.js +5 -0
- package/dist/core/permissions/rules/autoEscalationRule.js.map +2 -2
- package/dist/core/permissions/rules/projectBoundaryRule.js +5 -0
- package/dist/core/permissions/rules/projectBoundaryRule.js.map +2 -2
- package/dist/core/permissions/rules/sensitivePathsRule.js +5 -0
- package/dist/core/permissions/rules/sensitivePathsRule.js.map +2 -2
- package/dist/core/tokenStats.js +9 -0
- package/dist/core/tokenStats.js.map +7 -0
- package/dist/core/tokenStatsManager.js +331 -0
- package/dist/core/tokenStatsManager.js.map +7 -0
- package/dist/entrypoints/cli.js +115 -87
- package/dist/entrypoints/cli.js.map +2 -2
- package/dist/hooks/useAgentTokenStats.js +72 -0
- package/dist/hooks/useAgentTokenStats.js.map +7 -0
- package/dist/hooks/useAgentTranscripts.js +30 -6
- package/dist/hooks/useAgentTranscripts.js.map +2 -2
- package/dist/hooks/useLogMessages.js +12 -1
- package/dist/hooks/useLogMessages.js.map +2 -2
- package/dist/i18n/locales/en.js +6 -5
- package/dist/i18n/locales/en.js.map +2 -2
- package/dist/i18n/locales/zh-CN.js +6 -5
- package/dist/i18n/locales/zh-CN.js.map +2 -2
- package/dist/i18n/types.js.map +1 -1
- package/dist/permissions.js +28 -1
- package/dist/permissions.js.map +2 -2
- package/dist/query.js +78 -4
- package/dist/query.js.map +3 -3
- package/dist/screens/REPL.js +23 -3
- package/dist/screens/REPL.js.map +2 -2
- package/dist/services/claude.js +54 -3
- package/dist/services/claude.js.map +2 -2
- package/dist/services/intelligentCompactor.js +1 -1
- package/dist/services/intelligentCompactor.js.map +2 -2
- package/dist/services/mcpClient.js +81 -25
- package/dist/services/mcpClient.js.map +2 -2
- package/dist/services/sandbox/filesystemBoundary.js +58 -17
- package/dist/services/sandbox/filesystemBoundary.js.map +2 -2
- package/dist/tools/AskExpertModelTool/AskExpertModelTool.js +3 -2
- package/dist/tools/AskExpertModelTool/AskExpertModelTool.js.map +2 -2
- package/dist/tools/AskUserQuestionTool/AskUserQuestionTool.js +2 -1
- package/dist/tools/AskUserQuestionTool/AskUserQuestionTool.js.map +2 -2
- package/dist/tools/BashTool/BashTool.js +22 -3
- package/dist/tools/BashTool/BashTool.js.map +2 -2
- package/dist/tools/BashTool/prompt.js +178 -34
- package/dist/tools/BashTool/prompt.js.map +2 -2
- package/dist/tools/FileEditTool/prompt.js +6 -3
- package/dist/tools/FileEditTool/prompt.js.map +2 -2
- package/dist/tools/FileWriteTool/prompt.js +4 -2
- package/dist/tools/FileWriteTool/prompt.js.map +2 -2
- package/dist/tools/MultiEditTool/prompt.js +5 -3
- package/dist/tools/MultiEditTool/prompt.js.map +2 -2
- package/dist/tools/NotebookEditTool/NotebookEditTool.js +2 -1
- package/dist/tools/NotebookEditTool/NotebookEditTool.js.map +2 -2
- package/dist/tools/PlanModeTool/EnterPlanModeTool.js +3 -2
- package/dist/tools/PlanModeTool/EnterPlanModeTool.js.map +2 -2
- package/dist/tools/PlanModeTool/ExitPlanModeTool.js +3 -2
- package/dist/tools/PlanModeTool/ExitPlanModeTool.js.map +2 -2
- package/dist/tools/PlanModeTool/prompt.js +1 -1
- package/dist/tools/PlanModeTool/prompt.js.map +1 -1
- package/dist/tools/SkillTool/SkillTool.js +4 -3
- package/dist/tools/SkillTool/SkillTool.js.map +2 -2
- package/dist/tools/SkillTool/prompt.js +1 -1
- package/dist/tools/SkillTool/prompt.js.map +1 -1
- package/dist/tools/TaskOutputTool/TaskOutputTool.js +3 -2
- package/dist/tools/TaskOutputTool/TaskOutputTool.js.map +2 -2
- package/dist/tools/TaskTool/TaskTool.js +8 -0
- package/dist/tools/TaskTool/TaskTool.js.map +2 -2
- package/dist/utils/CircuitBreaker.js +242 -0
- package/dist/utils/CircuitBreaker.js.map +7 -0
- package/dist/utils/ask.js +2 -0
- package/dist/utils/ask.js.map +2 -2
- package/dist/utils/config.js +47 -5
- package/dist/utils/config.js.map +2 -2
- package/dist/utils/credentials/CredentialStore.js +1 -0
- package/dist/utils/credentials/CredentialStore.js.map +7 -0
- package/dist/utils/credentials/EncryptedFileStore.js +157 -0
- package/dist/utils/credentials/EncryptedFileStore.js.map +7 -0
- package/dist/utils/credentials/index.js +37 -0
- package/dist/utils/credentials/index.js.map +7 -0
- package/dist/utils/credentials/migration.js +82 -0
- package/dist/utils/credentials/migration.js.map +7 -0
- package/dist/utils/markdown.js +13 -1
- package/dist/utils/markdown.js.map +2 -2
- package/dist/utils/permissions/filesystem.js +5 -1
- package/dist/utils/permissions/filesystem.js.map +2 -2
- package/dist/utils/safePath.js +132 -0
- package/dist/utils/safePath.js.map +7 -0
- package/dist/utils/sensitiveFiles.js +125 -0
- package/dist/utils/sensitiveFiles.js.map +7 -0
- package/dist/utils/taskDisplayUtils.js +9 -9
- package/dist/utils/taskDisplayUtils.js.map +2 -2
- package/dist/utils/theme.js +6 -6
- package/dist/utils/theme.js.map +1 -1
- package/dist/utils/toolRiskClassification.js +207 -0
- package/dist/utils/toolRiskClassification.js.map +7 -0
- package/dist/utils/tooling/safeRender.js +5 -4
- package/dist/utils/tooling/safeRender.js.map +2 -2
- package/dist/version.js +2 -2
- package/dist/version.js.map +1 -1
- package/package.json +9 -7
- package/dist/hooks/useCancelRequest.js +0 -31
- package/dist/hooks/useCancelRequest.js.map +0 -7
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/components/TaskCard.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * TaskCard - Claude Code CLI \u98CE\u683C\u7684\u4EFB\u52A1\u5361\u7247\u7EC4\u4EF6\n *\n * \u6838\u5FC3\u7279\u6027\uFF1A\n * 1. **\u5361\u7247\u5F0F\u8BBE\u8BA1** - \u72EC\u7ACB\u7684\u89C6\u89C9\u5355\u5143\uFF0C\u4E0E\u4E3B\u5BF9\u8BDD\u6D41\u533A\u5206\n * 2. **\u72B6\u6001\u6E05\u6670** - \u901A\u8FC7\u56FE\u6807\u548C\u989C\u8272\u660E\u786E\u4F20\u8FBE\u4EFB\u52A1\u72B6\u6001\n * 3. **\u53EF\u6298\u53E0** - \u8BE6\u7EC6\u65E5\u5FD7\u53EF\u6298\u53E0\uFF0C\u8282\u7701\u7A7A\u95F4\n * 4. **\u8FDB\u5EA6\u53EF\u89C6\u5316** - \u663E\u793A\u4EFB\u52A1\u8FDB\u5EA6\u767E\u5206\u6BD4\u548C\u6307\u6807\n * 5. **\u5E76\u53D1\u53CB\u597D** - \u591A\u4E2A\u5361\u7247\u5E76\u5217\u663E\u793A\u4E0D\u6DF7\u4E71\n *\n * \u57FA\u4E8E Claude Code CLI \u7684 TaskCardBlock \u89C4\u8303\n * \u4F7F\u7528\u7EDF\u4E00\u52A8\u753B\u7BA1\u7406\u5668\u4EE3\u66FF setInterval\uFF0C\u51CF\u5C11\u5C4F\u5E55\u95EA\u70C1\n */\n\nimport React, { useRef } from 'react'\nimport { Box, Text } from 'ink'\nimport { getTheme } from '@utils/theme'\nimport { formatNumber, formatDuration } from '@utils/format'\nimport { getAgentColor } from '@constants/colors'\nimport type { SubagentState } from '@minto-types/subagent'\nimport type { Tool } from '@tool'\nimport { useUnifiedAnimation } from '@utils/animationManager'\n\ninterface TaskCardProps {\n /** \u5B50\u4EFB\u52A1\u72B6\u6001 */\n subagent: SubagentState\n\n /** \u662F\u5426\u5C55\u5F00\u8BE6\u7EC6\u65E5\u5FD7 */\n isExpanded?: boolean\n\n /** \u662F\u5426\u9AD8\u4EAE\uFF08\u9700\u8981\u7528\u6237\u5173\u6CE8\uFF09 */\n isHighlighted?: boolean\n\n /** \u5DE5\u5177\u5217\u8868 */\n tools?: Tool[]\n\n /** \u662F\u5426\u663E\u793A\u8BE6\u7EC6\u4FE1\u606F */\n verbose?: boolean\n\n /** \u8C03\u8BD5\u6A21\u5F0F */\n debug?: boolean\n\n /** \u6298\u53E0/\u5C55\u5F00\u56DE\u8C03 */\n onToggleExpand?: () => void\n}\n\n/**\n * TaskCard - \u5355\u4E2A\u5B50\u4EFB\u52A1\u7684\u52A8\u6001\u5C55\u793A\uFF08\u65E0\u8FB9\u6846\uFF09\n *\n * \u8FD0\u884C\u4E2D\u5E03\u5C40\uFF08\u81EA\u52A8\u5C55\u5F00\uFF09:\n * ```\n * \u280B Feature Implementation \u00B7 backend-architect\n * \u251C\u2500 Running \u00B7 3 tools \u00B7 5.2k tokens \u00B7 12s\n * \u2514\u2500 Analyzing code structure...\n * \u2192 Tool call output message...\n * \u2190 Assistant response...\n * ```\n *\n * \u5B8C\u6210\u540E\u5E03\u5C40\uFF08\u81EA\u52A8\u6298\u53E0\uFF09:\n * ```\n * \u2713 Feature Implementation \u00B7 backend-architect\n * \u2514\u2500 Done \u00B7 5 tools \u00B7 8.3k tokens \u00B7 24s (Ctrl+O to expand)\n * ```\n *\n * \u5B8C\u6210\u540E\u5C55\u5F00\uFF08Ctrl+O\uFF09:\n * ```\n * \u2713 Feature Implementation \u00B7 backend-architect\n * \u2514\u2500 Done \u00B7 5 tools \u00B7 8.3k tokens \u00B7 24s (Ctrl+O to expand)\n * [\u8BE6\u7EC6\u7684\u6267\u884C\u8FC7\u7A0B\u65E5\u5FD7]\n * ```\n */\nexport function TaskCard({\n subagent,\n isExpanded = false,\n isHighlighted = false,\n tools = [],\n verbose = false,\n debug = false,\n onToggleExpand,\n}: TaskCardProps): React.ReactNode {\n const theme = getTheme()\n const { metrics, taskName, status, messages, agentType, agentColor } =\n subagent\n\n // \u83B7\u53D6 agent \u989C\u8272\n const color = getAgentColor(agentColor, theme)\n\n // \u5224\u65AD\u662F\u5426\u6B63\u5728\u8FD0\u884C\n const isRunning =\n status === 'initializing' || status === 'running' || status === 'queued'\n\n // Use unified animation manager for periodic time updates\n const startTimeRef = useRef(metrics.startTime)\n const { elapsedTime } = useUnifiedAnimation({\n enabled: isRunning,\n startTime: startTimeRef.current,\n spinnerFrameCount: 1,\n componentId: `task-card-${subagent.id}`,\n })\n\n // \u8BA1\u7B97\u6301\u7EED\u65F6\u95F4\n const duration = metrics.endTime\n ? metrics.endTime - metrics.startTime\n : Date.now() - metrics.startTime\n\n // \u72B6\u6001\u56FE\u6807\u548C\u6587\u672C\n const statusIcon = getStatusIcon(status, isRunning)\n const statusText = getStatusText(status)\n const statusColor = getStatusColor(status, theme)\n\n // \u83B7\u53D6\u6700\u65B0\u7684\u72B6\u6001\u6D88\u606F\n const latestMessage = getLatestMessage(messages)\n\n // \u5361\u7247\u80CC\u666F\u8272\uFF08\u6839\u636E\u72B6\u6001\u548C\u9AD8\u4EAE\uFF09\n const cardBgColor = isHighlighted\n ? theme.selectionBg // #3C3C3C\n : '#6A7B8E' // Task Card BG\n\n // \u5224\u65AD\u662F\u5426\u5DF2\u5B8C\u6210\uFF08completed \u6216 error\uFF09\n const isCompleted = status === 'completed' || status === 'error'\n\n return (\n <Box flexDirection=\"column\" marginY={0}>\n {/* \u8FD0\u884C\u4E2D\uFF1A\u5C55\u5F00\u663E\u793A\u6240\u6709\u5185\u5BB9 */}\n {!isCompleted && (\n <>\n {/* TaskHeader - \u4EFB\u52A1\u540D\u79F0\u548C Agent \u7C7B\u578B */}\n <Box flexDirection=\"row\">\n <Text color={color}>{statusIcon} </Text>\n <Text bold>{taskName}</Text>\n <Text color={theme.dimmedText}> \u00B7 {agentType}</Text>\n </Box>\n\n {/* TaskProgress - \u72B6\u6001\u548C\u6307\u6807 */}\n <Box flexDirection=\"row\" marginLeft={2}>\n <Text color={theme.dimmedText}>\u251C\u2500 </Text>\n <Text color={statusColor}>{statusText}</Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>\n {metrics.toolUseCount} tool{metrics.toolUseCount !== 1 ? 's' : ''}\n </Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>\n {formatNumber(metrics.tokenCount)} tokens\n </Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>{formatDuration(duration)}</Text>\n </Box>\n\n {/* TaskStatusMessage - \u5F53\u524D\u6B63\u5728\u505A\u4EC0\u4E48 */}\n {latestMessage && (\n <Box flexDirection=\"row\" marginLeft={2}>\n <Text color={theme.dimmedText}>\u2514\u2500 </Text>\n <Text color={theme.dimmedText}>{latestMessage}</Text>\n </Box>\n )}\n\n {/* Output messages - \u76F4\u63A5\u663E\u793A\u4E3A\u5B50\u5C42\u7EA7\uFF0C\u65E0 \"Output Log\" \u6807\u9898 */}\n {messages.length > 0 &&\n messages\n .map((msg, idx) => {\n // Extract text content based on message type\n let content = ''\n let prefix = '\u2190 '\n\n if (msg.type === 'assistant') {\n prefix = '\u2192 '\n const blocks = msg.message.content\n content = blocks\n .filter((block: any) => block.type === 'text')\n .map((block: any) => block.text)\n .join(' ')\n } else if (msg.type === 'user') {\n const msgParam = msg.message as any\n if (typeof msgParam.content === 'string') {\n content = msgParam.content\n } else if (Array.isArray(msgParam.content)) {\n content = msgParam.content\n .filter((block: any) => block.type === 'text')\n .map((block: any) => block.text)\n .join(' ')\n }\n } else if (msg.type === 'progress') {\n prefix = '\u2699 '\n // Handle both AssistantMessage and StreamingProgressContent\n if (\n 'type' in msg.content &&\n msg.content.type === 'streaming'\n ) {\n // StreamingProgressContent - show stdout/stderr preview\n content =\n msg.content.stdout ||\n msg.content.stderr ||\n '(streaming...)'\n } else if ('message' in msg.content) {\n // AssistantMessage\n const blocks = (msg.content as any).message.content\n content = blocks\n .filter((block: any) => block.type === 'text')\n .map((block: any) => block.text)\n .join(' ')\n }\n }\n\n if (!content || content.trim().length === 0) {\n return null\n }\n\n return (\n <Box key={idx} flexDirection=\"row\" marginLeft={4}>\n <Text color={theme.dimmedText}>{prefix}</Text>\n <Text color={theme.mutedText}>\n {content.substring(0, 80)}\n {content.length > 80 ? '...' : ''}\n </Text>\n </Box>\n )\n })\n .filter(Boolean)}\n </>\n )}\n\n {/* \u5DF2\u5B8C\u6210\uFF1A\u6298\u53E0\u6210\u4E00\u884C\uFF0C\u5E26\u5C55\u5F00\u63D0\u793A */}\n {isCompleted && (\n <>\n <Box flexDirection=\"row\">\n <Text color={color}>{statusIcon} </Text>\n <Text bold>{taskName}</Text>\n <Text color={theme.dimmedText}> \u00B7 {agentType}</Text>\n </Box>\n\n <Box flexDirection=\"row\" marginLeft={2}>\n <Text color={theme.dimmedText}>\u2514\u2500 </Text>\n <Text color={statusColor}>{statusText}</Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>\n {metrics.toolUseCount} tool{metrics.toolUseCount !== 1 ? 's' : ''}\n </Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>\n {formatNumber(metrics.tokenCount)} tokens\n </Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>{formatDuration(duration)}</Text>\n <Text color={theme.dimmedText}> (Ctrl+O to expand)</Text>\n </Box>\n\n {/* \u5C55\u5F00\u65F6\u663E\u793A\u8BE6\u7EC6\u8FC7\u7A0B */}\n {isExpanded && messages.length > 0 && (\n <Box flexDirection=\"column\" marginLeft={4} marginTop={1}>\n {renderTaskOutputLog(subagent, theme, tools, verbose)}\n </Box>\n )}\n </>\n )}\n\n {/* TaskActionButtons - \u64CD\u4F5C\u6309\u94AE (\u672A\u6765\u6269\u5C55) */}\n {debug && (\n <Box flexDirection=\"row\" marginTop={1}>\n <Text color={theme.info}>[View Details]</Text>\n <Text> </Text>\n {isRunning && <Text color={theme.error}>[Cancel]</Text>}\n </Box>\n )}\n </Box>\n )\n}\n\n/**\n * \u83B7\u53D6\u72B6\u6001\u56FE\u6807\n */\nfunction getStatusIcon(\n status: SubagentState['status'],\n isRunning: boolean,\n): string {\n if (isRunning) {\n // \u4F7F\u7528 Spinner \u5B57\u7B26\u8F6E\u8F6C (\u7B80\u5316\u7248)\n const spinnerFrames = ['\u280B', '\u2819', '\u2839', '\u2838', '\u283C', '\u2834', '\u2826', '\u2827', '\u2807', '\u280F']\n const frame = Math.floor(Date.now() / 120) % spinnerFrames.length\n return spinnerFrames[frame] || '\u280B'\n }\n\n switch (status) {\n case 'completed':\n return '\u2713'\n case 'error':\n return '\u2715'\n case 'queued':\n return '\u2026'\n default:\n return '\u25E6'\n }\n}\n\n/**\n * \u83B7\u53D6\u72B6\u6001\u6587\u672C\n */\nfunction getStatusText(status: SubagentState['status']): string {\n switch (status) {\n case 'initializing':\n return 'Initializing'\n case 'queued':\n return 'Queued'\n case 'running':\n return 'Running'\n case 'completed':\n return 'Done'\n case 'error':\n return 'Error'\n }\n}\n\n/**\n * \u83B7\u53D6\u72B6\u6001\u989C\u8272 (\u4F7F\u7528 Claude Code CLI \u914D\u8272)\n */\nfunction getStatusColor(\n status: SubagentState['status'],\n theme: ReturnType<typeof getTheme>,\n): string {\n switch (status) {\n case 'initializing':\n case 'queued':\n return '#ADD8E6' // Pending Task (\u6D45\u84DD)\n case 'running':\n return theme.brand // #D4BBFF (\u54C1\u724C\u8272\uFF0C\u8868\u793A\u6D3B\u8DC3)\n case 'completed':\n return theme.success // #3DDC84 (\u9C9C\u7EFF)\n case 'error':\n return theme.error // #FF5555 (\u9C9C\u7EA2)\n }\n}\n\n/**\n * \u83B7\u53D6\u6700\u65B0\u7684\u72B6\u6001\u6D88\u606F\n */\nfunction getLatestMessage(messages: SubagentState['messages']): string | null {\n if (messages.length === 0) return null\n\n // \u5012\u5E8F\u67E5\u627E\u6700\u65B0\u7684\u6587\u672C\u6D88\u606F\n for (let i = messages.length - 1; i >= 0; i--) {\n const msg = messages[i]\n if (msg?.type === 'assistant' && msg.message?.content) {\n for (const content of msg.message.content) {\n if (content.type === 'text' && content.text.trim()) {\n // \u622A\u53D6\u524D 60 \u4E2A\u5B57\u7B26\n const text = content.text.trim()\n return text.length > 60 ? text.substring(0, 60) + '...' : text\n }\n if (content.type === 'tool_use') {\n return `Using ${content.name}...`\n }\n }\n }\n }\n\n return null\n}\n\n/**\n * \u6E32\u67D3\u8BE6\u7EC6\u7684\u8F93\u51FA\u65E5\u5FD7\n */\nfunction renderTaskOutputLog(\n subagent: SubagentState,\n theme: ReturnType<typeof getTheme>,\n tools: Tool[],\n verbose: boolean,\n): React.ReactNode {\n const { messages } = subagent\n\n return (\n <Box flexDirection=\"column\">\n {messages.map((msg, idx) => {\n if (msg.type === 'assistant') {\n return msg.message.content.map((content, contentIdx) => {\n if (content.type === 'tool_use') {\n const tool = tools.find(t => t.name === content.name)\n const toolName = tool?.userFacingName\n ? typeof tool.userFacingName === 'function'\n ? tool.userFacingName()\n : tool.userFacingName\n : content.name\n\n return (\n <Box key={`${idx}-${contentIdx}`} flexDirection=\"row\">\n <Text color={theme.info}>\uD83D\uDD27 {toolName}</Text>\n </Box>\n )\n } else if (content.type === 'text' && content.text.trim()) {\n const lines = content.text.trim().split('\\n')\n return (\n <Box key={`${idx}-${contentIdx}`} flexDirection=\"column\">\n {lines.map((line, lineIdx) => (\n <Text color={theme.secondaryText}>{line}</Text>\n ))}\n </Box>\n )\n }\n return null\n })\n } else if (msg.type === 'user') {\n return msg.message.content.map((content, contentIdx) => {\n if (content.type === 'tool_result') {\n const resultContent = Array.isArray(content.content)\n ? content.content.find(c => c.type === 'text')?.text\n : typeof content.content === 'string'\n ? content.content\n : ''\n\n if (resultContent && resultContent.trim()) {\n const lines = resultContent.trim().split('\\n')\n const preview =\n lines.length > 5\n ? lines.slice(0, 5).join('\\n') + '\\n...'\n : resultContent.trim()\n\n return (\n <Box key={`${idx}-${contentIdx}`} flexDirection=\"column\">\n {preview.split('\\n').map((line, lineIdx) => (\n <Text color={theme.mutedText}>{line}</Text>\n ))}\n </Box>\n )\n }\n }\n return null\n })\n }\n return null\n })}\n </Box>\n )\n}\n\n/**\n * \u7D27\u51D1\u7248 TaskCard (\u7528\u4E8E\u7A7A\u95F4\u53D7\u9650\u7684\u573A\u666F)\n */\nexport function CompactTaskCard({\n subagent,\n}: {\n subagent: SubagentState\n}): React.ReactNode {\n const theme = getTheme()\n const { taskName, status, agentColor } = subagent\n\n const color = getAgentColor(agentColor, theme)\n const isRunning =\n status === 'initializing' || status === 'running' || status === 'queued'\n const statusIcon = getStatusIcon(status, isRunning)\n\n return (\n <Box flexDirection=\"row\">\n <Text color={color}>\n {statusIcon} {taskName}\n </Text>\n <Text color={theme.dimmedText}> \u00B7 {getStatusText(status)}</Text>\n </Box>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAcA,OAAO,SAAS,cAAc;AAC9B,SAAS,KAAK,YAAY;AAC1B,SAAS,gBAAgB;AACzB,
|
|
4
|
+
"sourcesContent": ["/**\n * TaskCard - Claude Code CLI \u98CE\u683C\u7684\u4EFB\u52A1\u5361\u7247\u7EC4\u4EF6\n *\n * \u6838\u5FC3\u7279\u6027\uFF1A\n * 1. **\u5361\u7247\u5F0F\u8BBE\u8BA1** - \u72EC\u7ACB\u7684\u89C6\u89C9\u5355\u5143\uFF0C\u4E0E\u4E3B\u5BF9\u8BDD\u6D41\u533A\u5206\n * 2. **\u72B6\u6001\u6E05\u6670** - \u901A\u8FC7\u56FE\u6807\u548C\u989C\u8272\u660E\u786E\u4F20\u8FBE\u4EFB\u52A1\u72B6\u6001\n * 3. **\u53EF\u6298\u53E0** - \u8BE6\u7EC6\u65E5\u5FD7\u53EF\u6298\u53E0\uFF0C\u8282\u7701\u7A7A\u95F4\n * 4. **\u8FDB\u5EA6\u53EF\u89C6\u5316** - \u663E\u793A\u4EFB\u52A1\u8FDB\u5EA6\u767E\u5206\u6BD4\u548C\u6307\u6807\n * 5. **\u5E76\u53D1\u53CB\u597D** - \u591A\u4E2A\u5361\u7247\u5E76\u5217\u663E\u793A\u4E0D\u6DF7\u4E71\n *\n * \u57FA\u4E8E Claude Code CLI \u7684 TaskCardBlock \u89C4\u8303\n * \u4F7F\u7528\u7EDF\u4E00\u52A8\u753B\u7BA1\u7406\u5668\u4EE3\u66FF setInterval\uFF0C\u51CF\u5C11\u5C4F\u5E55\u95EA\u70C1\n */\n\nimport React, { useRef } from 'react'\nimport { Box, Text } from 'ink'\nimport { getTheme } from '@utils/theme'\nimport { formatNumber, formatDuration } from '@utils/format'\nimport { getAgentColor, SYMBOL_COLORS } from '@constants/colors'\nimport type { SubagentState } from '@minto-types/subagent'\nimport type { Tool } from '@tool'\nimport { useUnifiedAnimation } from '@utils/animationManager'\nimport { useAgentTokenStats, formatTokenCount } from '@hooks/useAgentTokenStats'\n\ninterface TaskCardProps {\n /** \u5B50\u4EFB\u52A1\u72B6\u6001 */\n subagent: SubagentState\n\n /** \u662F\u5426\u5C55\u5F00\u8BE6\u7EC6\u65E5\u5FD7 */\n isExpanded?: boolean\n\n /** \u662F\u5426\u9AD8\u4EAE\uFF08\u9700\u8981\u7528\u6237\u5173\u6CE8\uFF09 */\n isHighlighted?: boolean\n\n /** \u5DE5\u5177\u5217\u8868 */\n tools?: Tool[]\n\n /** \u662F\u5426\u663E\u793A\u8BE6\u7EC6\u4FE1\u606F */\n verbose?: boolean\n\n /** \u8C03\u8BD5\u6A21\u5F0F */\n debug?: boolean\n\n /** \u6298\u53E0/\u5C55\u5F00\u56DE\u8C03 */\n onToggleExpand?: () => void\n}\n\n/**\n * TaskCard - \u5355\u4E2A\u5B50\u4EFB\u52A1\u7684\u52A8\u6001\u5C55\u793A\uFF08\u65E0\u8FB9\u6846\uFF09\n *\n * \u8FD0\u884C\u4E2D\u5E03\u5C40\uFF08\u81EA\u52A8\u5C55\u5F00\uFF09:\n * ```\n * \u280B Feature Implementation \u00B7 backend-architect\n * \u251C\u2500 Running \u00B7 3 tools \u00B7 5.2k tokens \u00B7 12s\n * \u2514\u2500 Analyzing code structure...\n * \u2192 Tool call output message...\n * \u2190 Assistant response...\n * ```\n *\n * \u5B8C\u6210\u540E\u5E03\u5C40\uFF08\u81EA\u52A8\u6298\u53E0\uFF09:\n * ```\n * \u2713 Feature Implementation \u00B7 backend-architect\n * \u2514\u2500 Done \u00B7 5 tools \u00B7 8.3k tokens \u00B7 24s (Ctrl+O to expand)\n * ```\n *\n * \u5B8C\u6210\u540E\u5C55\u5F00\uFF08Ctrl+O\uFF09:\n * ```\n * \u2713 Feature Implementation \u00B7 backend-architect\n * \u2514\u2500 Done \u00B7 5 tools \u00B7 8.3k tokens \u00B7 24s (Ctrl+O to expand)\n * [\u8BE6\u7EC6\u7684\u6267\u884C\u8FC7\u7A0B\u65E5\u5FD7]\n * ```\n */\nexport function TaskCard({\n subagent,\n isExpanded = false,\n isHighlighted = false,\n tools = [],\n verbose = false,\n debug = false,\n onToggleExpand,\n}: TaskCardProps): React.ReactNode {\n const theme = getTheme()\n const { metrics, taskName, status, messages, agentType, agentColor } =\n subagent\n\n // Get real-time token stats from unified TokenStatsManager\n const tokenStats = useAgentTokenStats(subagent.id)\n const tokenCount = tokenStats?.grandTotalTokens ?? 0\n\n // \u83B7\u53D6 agent \u989C\u8272\n const color = getAgentColor(agentColor, theme)\n\n // \u5224\u65AD\u662F\u5426\u6B63\u5728\u8FD0\u884C\n const isRunning =\n status === 'initializing' || status === 'running' || status === 'queued'\n\n // Use unified animation manager for periodic time updates\n const startTimeRef = useRef(metrics.startTime)\n const { elapsedTime } = useUnifiedAnimation({\n enabled: isRunning,\n startTime: startTimeRef.current,\n spinnerFrameCount: 1,\n componentId: `task-card-${subagent.id}`,\n })\n\n // \u8BA1\u7B97\u6301\u7EED\u65F6\u95F4\n const duration = metrics.endTime\n ? metrics.endTime - metrics.startTime\n : Date.now() - metrics.startTime\n\n // \u72B6\u6001\u56FE\u6807\u548C\u6587\u672C\n const statusIcon = getStatusIcon(status, isRunning)\n const statusText = getStatusText(status)\n const statusColor = getStatusColor(status, theme)\n\n // \u83B7\u53D6\u6700\u65B0\u7684\u72B6\u6001\u6D88\u606F\n const latestMessage = getLatestMessage(messages)\n\n // \u5361\u7247\u80CC\u666F\u8272\uFF08\u6839\u636E\u72B6\u6001\u548C\u9AD8\u4EAE\uFF09\n const cardBgColor = isHighlighted\n ? theme.selectionBg // #3C3C3C\n : '#6A7B8E' // Task Card BG\n\n // \u5224\u65AD\u662F\u5426\u5DF2\u5B8C\u6210\uFF08completed \u6216 error\uFF09\n const isCompleted = status === 'completed' || status === 'error'\n\n return (\n <Box flexDirection=\"column\" marginY={0}>\n {/* \u8FD0\u884C\u4E2D\uFF1A\u5C55\u5F00\u663E\u793A\u6240\u6709\u5185\u5BB9 */}\n {!isCompleted && (\n <>\n {/* TaskHeader - \u4EFB\u52A1\u540D\u79F0\u548C Agent \u7C7B\u578B */}\n <Box flexDirection=\"row\">\n <Text color={color}>{statusIcon} </Text>\n <Text bold>{taskName}</Text>\n <Text color={theme.dimmedText}> \u00B7 {agentType}</Text>\n </Box>\n\n {/* TaskProgress - \u72B6\u6001\u548C\u6307\u6807 */}\n <Box flexDirection=\"row\" marginLeft={2}>\n <Text color={theme.dimmedText}>\u251C\u2500 </Text>\n <Text color={statusColor}>{statusText}</Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>\n {metrics.toolUseCount} tool{metrics.toolUseCount !== 1 ? 's' : ''}\n </Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>\n {formatTokenCount(tokenCount)} tokens\n </Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>{formatDuration(duration)}</Text>\n </Box>\n\n {/* TaskStatusMessage - \u5F53\u524D\u6B63\u5728\u505A\u4EC0\u4E48 */}\n {latestMessage && (\n <Box flexDirection=\"row\" marginLeft={2}>\n <Text color={theme.dimmedText}>\u2514\u2500 </Text>\n <Text color={theme.dimmedText}>{latestMessage}</Text>\n </Box>\n )}\n\n {/* Output messages - \u76F4\u63A5\u663E\u793A\u4E3A\u5B50\u5C42\u7EA7\uFF0C\u65E0 \"Output Log\" \u6807\u9898 */}\n {messages.length > 0 &&\n messages\n .map((msg, idx) => {\n // Extract text content based on message type\n let content = ''\n let prefix = '\u2190 '\n\n if (msg.type === 'assistant') {\n prefix = '\u2192 '\n const blocks = msg.message.content\n content = blocks\n .filter((block: any) => block.type === 'text')\n .map((block: any) => block.text)\n .join(' ')\n } else if (msg.type === 'user') {\n const msgParam = msg.message as any\n if (typeof msgParam.content === 'string') {\n content = msgParam.content\n } else if (Array.isArray(msgParam.content)) {\n content = msgParam.content\n .filter((block: any) => block.type === 'text')\n .map((block: any) => block.text)\n .join(' ')\n }\n } else if (msg.type === 'progress') {\n prefix = '\u2699 '\n // Handle both AssistantMessage and StreamingProgressContent\n if (\n 'type' in msg.content &&\n msg.content.type === 'streaming'\n ) {\n // StreamingProgressContent - show stdout/stderr preview\n content =\n msg.content.stdout ||\n msg.content.stderr ||\n '(streaming...)'\n } else if ('message' in msg.content) {\n // AssistantMessage\n const blocks = (msg.content as any).message.content\n content = blocks\n .filter((block: any) => block.type === 'text')\n .map((block: any) => block.text)\n .join(' ')\n }\n }\n\n if (!content || content.trim().length === 0) {\n return null\n }\n\n return (\n <Box key={idx} flexDirection=\"row\" marginLeft={4}>\n <Text color={theme.dimmedText}>{prefix}</Text>\n <Text color={theme.mutedText}>\n {content.substring(0, 80)}\n {content.length > 80 ? '...' : ''}\n </Text>\n </Box>\n )\n })\n .filter(Boolean)}\n </>\n )}\n\n {/* \u5DF2\u5B8C\u6210\uFF1A\u6298\u53E0\u6210\u4E00\u884C\uFF0C\u5E26\u5C55\u5F00\u63D0\u793A */}\n {isCompleted && (\n <>\n <Box flexDirection=\"row\">\n <Text color={color}>{statusIcon} </Text>\n <Text bold>{taskName}</Text>\n <Text color={theme.dimmedText}> \u00B7 {agentType}</Text>\n </Box>\n\n <Box flexDirection=\"row\" marginLeft={2}>\n <Text color={theme.dimmedText}>\u2514\u2500 </Text>\n <Text color={statusColor}>{statusText}</Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>\n {metrics.toolUseCount} tool{metrics.toolUseCount !== 1 ? 's' : ''}\n </Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>\n {formatTokenCount(tokenCount)} tokens\n </Text>\n <Text color={theme.mutedText}> \u00B7 </Text>\n <Text color={theme.mutedText}>{formatDuration(duration)}</Text>\n <Text color={theme.dimmedText}> (Ctrl+O to expand)</Text>\n </Box>\n\n {/* \u5C55\u5F00\u65F6\u663E\u793A\u8BE6\u7EC6\u8FC7\u7A0B */}\n {isExpanded && messages.length > 0 && (\n <Box flexDirection=\"column\" marginLeft={4} marginTop={1}>\n {renderTaskOutputLog(subagent, theme, tools, verbose)}\n </Box>\n )}\n </>\n )}\n\n {/* TaskActionButtons - \u64CD\u4F5C\u6309\u94AE (\u672A\u6765\u6269\u5C55) */}\n {debug && (\n <Box flexDirection=\"row\" marginTop={1}>\n <Text color={theme.info}>[View Details]</Text>\n <Text> </Text>\n {isRunning && <Text color={SYMBOL_COLORS.error}>[Cancel]</Text>}\n </Box>\n )}\n </Box>\n )\n}\n\n/**\n * \u83B7\u53D6\u72B6\u6001\u56FE\u6807\n */\nfunction getStatusIcon(\n status: SubagentState['status'],\n isRunning: boolean,\n): string {\n if (isRunning) {\n // \u4F7F\u7528 Spinner \u5B57\u7B26\u8F6E\u8F6C (\u7B80\u5316\u7248)\n const spinnerFrames = ['\u280B', '\u2819', '\u2839', '\u2838', '\u283C', '\u2834', '\u2826', '\u2827', '\u2807', '\u280F']\n const frame = Math.floor(Date.now() / 120) % spinnerFrames.length\n return spinnerFrames[frame] || '\u280B'\n }\n\n switch (status) {\n case 'completed':\n return '\u2713'\n case 'error':\n return '\u2715'\n case 'queued':\n return '\u2026'\n default:\n return '\u25E6'\n }\n}\n\n/**\n * \u83B7\u53D6\u72B6\u6001\u6587\u672C\n */\nfunction getStatusText(status: SubagentState['status']): string {\n switch (status) {\n case 'initializing':\n return 'Initializing'\n case 'queued':\n return 'Queued'\n case 'running':\n return 'Running'\n case 'completed':\n return 'Done'\n case 'error':\n return 'Error'\n }\n}\n\n/**\n * \u83B7\u53D6\u72B6\u6001\u989C\u8272 - \u4F7F\u7528 SYMBOL_COLORS \u4E0E Logo \u54C1\u724C\u914D\u8272\u4FDD\u6301\u4E00\u81F4\n */\nfunction getStatusColor(\n status: SubagentState['status'],\n theme: ReturnType<typeof getTheme>,\n): string {\n switch (status) {\n case 'initializing':\n case 'queued':\n return SYMBOL_COLORS.pending // \u7070\u8272 - \u7B49\u5F85\n case 'running':\n return SYMBOL_COLORS.running // \u7C89\u7D2B - \u8FDB\u884C\u4E2D\n case 'completed':\n return SYMBOL_COLORS.success // \u7D2B\u84DD - \u5B8C\u6210\n case 'error':\n return SYMBOL_COLORS.error // \u73CA\u745A\u7EA2 - \u9519\u8BEF\n }\n}\n\n/**\n * \u83B7\u53D6\u6700\u65B0\u7684\u72B6\u6001\u6D88\u606F\n */\nfunction getLatestMessage(messages: SubagentState['messages']): string | null {\n if (messages.length === 0) return null\n\n // \u5012\u5E8F\u67E5\u627E\u6700\u65B0\u7684\u6587\u672C\u6D88\u606F\n for (let i = messages.length - 1; i >= 0; i--) {\n const msg = messages[i]\n if (msg?.type === 'assistant' && msg.message?.content) {\n for (const content of msg.message.content) {\n if (content.type === 'text' && content.text.trim()) {\n // \u622A\u53D6\u524D 60 \u4E2A\u5B57\u7B26\n const text = content.text.trim()\n return text.length > 60 ? text.substring(0, 60) + '...' : text\n }\n if (content.type === 'tool_use') {\n return `Using ${content.name}...`\n }\n }\n }\n }\n\n return null\n}\n\n/**\n * \u6E32\u67D3\u8BE6\u7EC6\u7684\u8F93\u51FA\u65E5\u5FD7\n */\nfunction renderTaskOutputLog(\n subagent: SubagentState,\n theme: ReturnType<typeof getTheme>,\n tools: Tool[],\n verbose: boolean,\n): React.ReactNode {\n const { messages } = subagent\n\n return (\n <Box flexDirection=\"column\">\n {messages.map((msg, idx) => {\n if (msg.type === 'assistant') {\n return msg.message.content.map((content, contentIdx) => {\n if (content.type === 'tool_use') {\n const tool = tools.find(t => t.name === content.name)\n const toolName = tool?.userFacingName\n ? typeof tool.userFacingName === 'function'\n ? tool.userFacingName()\n : tool.userFacingName\n : content.name\n\n return (\n <Box key={`${idx}-${contentIdx}`} flexDirection=\"row\">\n <Text color={theme.info}>\uD83D\uDD27 {toolName}</Text>\n </Box>\n )\n } else if (content.type === 'text' && content.text.trim()) {\n const lines = content.text.trim().split('\\n')\n return (\n <Box key={`${idx}-${contentIdx}`} flexDirection=\"column\">\n {lines.map((line, lineIdx) => (\n <Text color={theme.secondaryText}>{line}</Text>\n ))}\n </Box>\n )\n }\n return null\n })\n } else if (msg.type === 'user') {\n return msg.message.content.map((content, contentIdx) => {\n if (content.type === 'tool_result') {\n const resultContent = Array.isArray(content.content)\n ? content.content.find(c => c.type === 'text')?.text\n : typeof content.content === 'string'\n ? content.content\n : ''\n\n if (resultContent && resultContent.trim()) {\n const lines = resultContent.trim().split('\\n')\n const preview =\n lines.length > 5\n ? lines.slice(0, 5).join('\\n') + '\\n...'\n : resultContent.trim()\n\n return (\n <Box key={`${idx}-${contentIdx}`} flexDirection=\"column\">\n {preview.split('\\n').map((line, lineIdx) => (\n <Text color={theme.mutedText}>{line}</Text>\n ))}\n </Box>\n )\n }\n }\n return null\n })\n }\n return null\n })}\n </Box>\n )\n}\n\n/**\n * \u7D27\u51D1\u7248 TaskCard (\u7528\u4E8E\u7A7A\u95F4\u53D7\u9650\u7684\u573A\u666F)\n */\nexport function CompactTaskCard({\n subagent,\n}: {\n subagent: SubagentState\n}): React.ReactNode {\n const theme = getTheme()\n const { taskName, status, agentColor } = subagent\n\n const color = getAgentColor(agentColor, theme)\n const isRunning =\n status === 'initializing' || status === 'running' || status === 'queued'\n const statusIcon = getStatusIcon(status, isRunning)\n\n return (\n <Box flexDirection=\"row\">\n <Text color={color}>\n {statusIcon} {taskName}\n </Text>\n <Text color={theme.dimmedText}> \u00B7 {getStatusText(status)}</Text>\n </Box>\n )\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -3,6 +3,7 @@ import { Text, useInput } from "ink";
|
|
|
3
3
|
import chalk from "chalk";
|
|
4
4
|
import { useTextInput } from "../hooks/useTextInput.js";
|
|
5
5
|
import { getTheme } from "../utils/theme.js";
|
|
6
|
+
import { SEMANTIC_COLORS } from "../constants/colors.js";
|
|
6
7
|
function TextInput({
|
|
7
8
|
value: originalValue,
|
|
8
9
|
placeholder = "",
|
|
@@ -92,7 +93,14 @@ function TextInput({
|
|
|
92
93
|
renderedPlaceholder = placeholder.length > 0 ? chalk.inverse(placeholder[0]) + chalk.hex(getTheme().secondaryText)(placeholder.slice(1)) : chalk.inverse(" ");
|
|
93
94
|
}
|
|
94
95
|
const showPlaceholder = originalValue.length == 0 && placeholder;
|
|
95
|
-
return /* @__PURE__ */ React.createElement(
|
|
96
|
+
return /* @__PURE__ */ React.createElement(
|
|
97
|
+
Text,
|
|
98
|
+
{
|
|
99
|
+
wrap: "truncate-end",
|
|
100
|
+
color: isDimmed ? SEMANTIC_COLORS.dim : void 0
|
|
101
|
+
},
|
|
102
|
+
showPlaceholder ? renderedPlaceholder : renderedValue
|
|
103
|
+
);
|
|
96
104
|
}
|
|
97
105
|
export {
|
|
98
106
|
TextInput as default
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/components/TextInput.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react'\nimport { Text, useInput } from 'ink'\nimport chalk from 'chalk'\nimport { useTextInput } from '@hooks/useTextInput'\nimport { getTheme } from '@utils/theme'\nimport { type Key } from 'ink'\n\nexport type Props = {\n /**\n * Optional callback for handling history navigation on up arrow at start of input\n */\n readonly onHistoryUp?: () => void\n\n /**\n * Optional callback for handling history navigation on down arrow at end of input\n */\n readonly onHistoryDown?: () => void\n\n /**\n * Text to display when `value` is empty.\n */\n readonly placeholder?: string\n\n /**\n * Allow multi-line input via line ending with backslash (default: `true`)\n */\n readonly multiline?: boolean\n\n /**\n * Listen to user's input. Useful in case there are multiple input components\n * at the same time and input must be \"routed\" to a specific component.\n */\n readonly focus?: boolean\n\n /**\n * Replace all chars and mask the value. Useful for password inputs.\n */\n readonly mask?: string\n\n /**\n * Whether to show cursor and allow navigation inside text input with arrow keys.\n */\n readonly showCursor?: boolean\n\n /**\n * Highlight pasted text\n */\n readonly highlightPastedText?: boolean\n\n /**\n * Value to display in a text input.\n */\n readonly value: string\n\n /**\n * Function to call when value updates.\n */\n readonly onChange: (value: string) => void\n\n /**\n * Function to call when `Enter` is pressed, where first argument is a value of the input.\n */\n readonly onSubmit?: (value: string) => void\n\n /**\n * Function to call when Ctrl+C is pressed to exit.\n */\n readonly onExit?: () => void\n\n /**\n * Optional callback to show exit message\n */\n readonly onExitMessage?: (show: boolean, key?: string) => void\n\n /**\n * Optional callback to show custom message\n */\n readonly onMessage?: (show: boolean, message?: string) => void\n\n /**\n * Optional callback to reset history position\n */\n readonly onHistoryReset?: () => void\n\n /**\n * Number of columns to wrap text at\n */\n readonly columns: number\n\n /**\n * Optional callback when an image is pasted\n */\n readonly onImagePaste?: (base64Image: string) => void\n\n /**\n * Optional callback when a large text (over 800 chars) is pasted\n */\n readonly onPaste?: (text: string) => void\n\n /**\n * Whether the input is dimmed and non-interactive\n */\n readonly isDimmed?: boolean\n\n /**\n * Whether to disable cursor movement for up/down arrow keys\n */\n readonly disableCursorMovementForUpDownKeys?: boolean\n\n /**\n * Optional callback to handle special key combinations before input processing\n * Return true to prevent default handling\n */\n readonly onSpecialKey?: (input: string, key: Key) => boolean\n\n readonly cursorOffset: number\n\n /**\n * Callback to set the offset of the cursor\n */\n onChangeCursorOffset: (offset: number) => void\n}\n\nexport default function TextInput({\n value: originalValue,\n placeholder = '',\n focus = true,\n mask,\n multiline = false,\n highlightPastedText = false,\n showCursor = true,\n onChange,\n onSubmit,\n onExit,\n onHistoryUp,\n onHistoryDown,\n onExitMessage,\n onMessage,\n onHistoryReset,\n columns,\n onImagePaste,\n onPaste,\n isDimmed = false,\n disableCursorMovementForUpDownKeys = false,\n onSpecialKey,\n cursorOffset,\n onChangeCursorOffset,\n}: Props) {\n const { onInput, renderedValue } = useTextInput({\n value: originalValue,\n onChange,\n onSubmit,\n onExit,\n onExitMessage,\n onMessage,\n onHistoryReset,\n onHistoryUp,\n onHistoryDown,\n focus,\n mask,\n multiline,\n cursorChar: showCursor ? ' ' : '',\n highlightPastedText,\n invert: chalk.inverse,\n themeText: (text: string) => chalk.hex(getTheme().text)(text),\n columns,\n onImagePaste,\n disableCursorMovementForUpDownKeys,\n externalOffset: cursorOffset,\n onOffsetChange: onChangeCursorOffset,\n })\n\n // Paste detection state\n const [pasteState, setPasteState] = React.useState<{\n chunks: string[]\n timeoutId: ReturnType<typeof setTimeout> | null\n }>({ chunks: [], timeoutId: null })\n\n const resetPasteTimeout = (\n currentTimeoutId: ReturnType<typeof setTimeout> | null,\n ) => {\n if (currentTimeoutId) {\n clearTimeout(currentTimeoutId)\n }\n return setTimeout(() => {\n setPasteState(({ chunks }) => {\n const pastedText = chunks.join('')\n // Schedule callback after current render to avoid state updates during render\n Promise.resolve().then(() => onPaste!(pastedText))\n return { chunks: [], timeoutId: null }\n })\n }, 100)\n }\n\n const wrappedOnInput = (input: string, key: Key): void => {\n // Check for special key combinations first\n if (onSpecialKey && onSpecialKey(input, key)) {\n // Special key was handled, don't process further\n return\n }\n\n // Special handling for backspace or delete\n if (\n key.backspace ||\n key.delete ||\n input === '\\b' ||\n input === '\\x7f' ||\n input === '\\x08'\n ) {\n // Ensure backspace is handled directly\n onInput(input, {\n ...key,\n backspace: true,\n })\n return\n }\n\n // Handle pastes (>800 chars)\n // Usually we get one or two input characters at a time. If we\n // get a bunch, the user has probably pasted.\n // Unfortunately node batches long pastes, so it's possible\n // that we would see e.g. 1024 characters and then just a few\n // more in the next frame that belong with the original paste.\n // This batching number is not consistent.\n if (onPaste && (input.length > 800 || pasteState.timeoutId)) {\n setPasteState(({ chunks, timeoutId }) => {\n return {\n chunks: [...chunks, input],\n timeoutId: resetPasteTimeout(timeoutId),\n }\n })\n return\n }\n\n onInput(input, key)\n }\n\n useInput(wrappedOnInput, { isActive: focus })\n\n let renderedPlaceholder = placeholder\n ? chalk.hex(getTheme().secondaryText)(placeholder)\n : undefined\n\n // Fake mouse cursor, because we like punishment\n if (showCursor && focus) {\n renderedPlaceholder =\n placeholder.length > 0\n ? chalk.inverse(placeholder[0]) +\n chalk.hex(getTheme().secondaryText)(placeholder.slice(1))\n : chalk.inverse(' ')\n }\n\n const showPlaceholder = originalValue.length == 0 && placeholder\n return (\n <Text
|
|
5
|
-
"mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,MAAM,gBAAgB;AAC/B,OAAO,WAAW;AAClB,SAAS,oBAAoB;AAC7B,SAAS,gBAAgB;
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { Text, useInput } from 'ink'\nimport chalk from 'chalk'\nimport { useTextInput } from '@hooks/useTextInput'\nimport { getTheme } from '@utils/theme'\nimport { type Key } from 'ink'\nimport { SEMANTIC_COLORS } from '@constants/colors'\n\nexport type Props = {\n /**\n * Optional callback for handling history navigation on up arrow at start of input\n */\n readonly onHistoryUp?: () => void\n\n /**\n * Optional callback for handling history navigation on down arrow at end of input\n */\n readonly onHistoryDown?: () => void\n\n /**\n * Text to display when `value` is empty.\n */\n readonly placeholder?: string\n\n /**\n * Allow multi-line input via line ending with backslash (default: `true`)\n */\n readonly multiline?: boolean\n\n /**\n * Listen to user's input. Useful in case there are multiple input components\n * at the same time and input must be \"routed\" to a specific component.\n */\n readonly focus?: boolean\n\n /**\n * Replace all chars and mask the value. Useful for password inputs.\n */\n readonly mask?: string\n\n /**\n * Whether to show cursor and allow navigation inside text input with arrow keys.\n */\n readonly showCursor?: boolean\n\n /**\n * Highlight pasted text\n */\n readonly highlightPastedText?: boolean\n\n /**\n * Value to display in a text input.\n */\n readonly value: string\n\n /**\n * Function to call when value updates.\n */\n readonly onChange: (value: string) => void\n\n /**\n * Function to call when `Enter` is pressed, where first argument is a value of the input.\n */\n readonly onSubmit?: (value: string) => void\n\n /**\n * Function to call when Ctrl+C is pressed to exit.\n */\n readonly onExit?: () => void\n\n /**\n * Optional callback to show exit message\n */\n readonly onExitMessage?: (show: boolean, key?: string) => void\n\n /**\n * Optional callback to show custom message\n */\n readonly onMessage?: (show: boolean, message?: string) => void\n\n /**\n * Optional callback to reset history position\n */\n readonly onHistoryReset?: () => void\n\n /**\n * Number of columns to wrap text at\n */\n readonly columns: number\n\n /**\n * Optional callback when an image is pasted\n */\n readonly onImagePaste?: (base64Image: string) => void\n\n /**\n * Optional callback when a large text (over 800 chars) is pasted\n */\n readonly onPaste?: (text: string) => void\n\n /**\n * Whether the input is dimmed and non-interactive\n */\n readonly isDimmed?: boolean\n\n /**\n * Whether to disable cursor movement for up/down arrow keys\n */\n readonly disableCursorMovementForUpDownKeys?: boolean\n\n /**\n * Optional callback to handle special key combinations before input processing\n * Return true to prevent default handling\n */\n readonly onSpecialKey?: (input: string, key: Key) => boolean\n\n readonly cursorOffset: number\n\n /**\n * Callback to set the offset of the cursor\n */\n onChangeCursorOffset: (offset: number) => void\n}\n\nexport default function TextInput({\n value: originalValue,\n placeholder = '',\n focus = true,\n mask,\n multiline = false,\n highlightPastedText = false,\n showCursor = true,\n onChange,\n onSubmit,\n onExit,\n onHistoryUp,\n onHistoryDown,\n onExitMessage,\n onMessage,\n onHistoryReset,\n columns,\n onImagePaste,\n onPaste,\n isDimmed = false,\n disableCursorMovementForUpDownKeys = false,\n onSpecialKey,\n cursorOffset,\n onChangeCursorOffset,\n}: Props) {\n const { onInput, renderedValue } = useTextInput({\n value: originalValue,\n onChange,\n onSubmit,\n onExit,\n onExitMessage,\n onMessage,\n onHistoryReset,\n onHistoryUp,\n onHistoryDown,\n focus,\n mask,\n multiline,\n cursorChar: showCursor ? ' ' : '',\n highlightPastedText,\n invert: chalk.inverse,\n themeText: (text: string) => chalk.hex(getTheme().text)(text),\n columns,\n onImagePaste,\n disableCursorMovementForUpDownKeys,\n externalOffset: cursorOffset,\n onOffsetChange: onChangeCursorOffset,\n })\n\n // Paste detection state\n const [pasteState, setPasteState] = React.useState<{\n chunks: string[]\n timeoutId: ReturnType<typeof setTimeout> | null\n }>({ chunks: [], timeoutId: null })\n\n const resetPasteTimeout = (\n currentTimeoutId: ReturnType<typeof setTimeout> | null,\n ) => {\n if (currentTimeoutId) {\n clearTimeout(currentTimeoutId)\n }\n return setTimeout(() => {\n setPasteState(({ chunks }) => {\n const pastedText = chunks.join('')\n // Schedule callback after current render to avoid state updates during render\n Promise.resolve().then(() => onPaste!(pastedText))\n return { chunks: [], timeoutId: null }\n })\n }, 100)\n }\n\n const wrappedOnInput = (input: string, key: Key): void => {\n // Check for special key combinations first\n if (onSpecialKey && onSpecialKey(input, key)) {\n // Special key was handled, don't process further\n return\n }\n\n // Special handling for backspace or delete\n if (\n key.backspace ||\n key.delete ||\n input === '\\b' ||\n input === '\\x7f' ||\n input === '\\x08'\n ) {\n // Ensure backspace is handled directly\n onInput(input, {\n ...key,\n backspace: true,\n })\n return\n }\n\n // Handle pastes (>800 chars)\n // Usually we get one or two input characters at a time. If we\n // get a bunch, the user has probably pasted.\n // Unfortunately node batches long pastes, so it's possible\n // that we would see e.g. 1024 characters and then just a few\n // more in the next frame that belong with the original paste.\n // This batching number is not consistent.\n if (onPaste && (input.length > 800 || pasteState.timeoutId)) {\n setPasteState(({ chunks, timeoutId }) => {\n return {\n chunks: [...chunks, input],\n timeoutId: resetPasteTimeout(timeoutId),\n }\n })\n return\n }\n\n onInput(input, key)\n }\n\n useInput(wrappedOnInput, { isActive: focus })\n\n let renderedPlaceholder = placeholder\n ? chalk.hex(getTheme().secondaryText)(placeholder)\n : undefined\n\n // Fake mouse cursor, because we like punishment\n if (showCursor && focus) {\n renderedPlaceholder =\n placeholder.length > 0\n ? chalk.inverse(placeholder[0]) +\n chalk.hex(getTheme().secondaryText)(placeholder.slice(1))\n : chalk.inverse(' ')\n }\n\n const showPlaceholder = originalValue.length == 0 && placeholder\n return (\n <Text\n wrap=\"truncate-end\"\n color={isDimmed ? SEMANTIC_COLORS.dim : undefined}\n >\n {showPlaceholder ? renderedPlaceholder : renderedValue}\n </Text>\n )\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,17 +1,39 @@
|
|
|
1
|
-
import React, {
|
|
2
|
-
useRef,
|
|
3
|
-
useMemo,
|
|
4
|
-
memo
|
|
5
|
-
} from "react";
|
|
1
|
+
import React, { useRef, useMemo, memo } from "react";
|
|
6
2
|
import { Box, Text } from "ink";
|
|
7
3
|
import { getTheme } from "../utils/theme.js";
|
|
8
4
|
import { SYMBOLS, getTodoStatusSymbol } from "../constants/symbols.js";
|
|
9
5
|
import { formatNumber, formatTokenUsage } from "../utils/format.js";
|
|
10
6
|
import { sample } from "lodash-es";
|
|
11
|
-
import {
|
|
7
|
+
import { getMainStreamingState } from "./Spinner.js";
|
|
12
8
|
import { getSessionState } from "../utils/sessionState.js";
|
|
13
9
|
import { useUnifiedAnimation } from "../utils/animationManager.js";
|
|
10
|
+
import {
|
|
11
|
+
SEMANTIC_COLORS,
|
|
12
|
+
BRAND_GRADIENT,
|
|
13
|
+
SYMBOL_COLORS
|
|
14
|
+
} from "../constants/colors.js";
|
|
14
15
|
import { getIndent } from "../constants/formatRules.js";
|
|
16
|
+
const SHIMMER_COLORS = [
|
|
17
|
+
BRAND_GRADIENT.START,
|
|
18
|
+
// #667EEA purple-blue
|
|
19
|
+
"#8673D9",
|
|
20
|
+
// blend
|
|
21
|
+
BRAND_GRADIENT.MIDDLE,
|
|
22
|
+
// #B668C8 pink-purple
|
|
23
|
+
"#D560A0",
|
|
24
|
+
// blend
|
|
25
|
+
BRAND_GRADIENT.END,
|
|
26
|
+
// #F5576C coral
|
|
27
|
+
"#D560A0",
|
|
28
|
+
// blend back
|
|
29
|
+
BRAND_GRADIENT.MIDDLE,
|
|
30
|
+
// #B668C8
|
|
31
|
+
"#8673D9"
|
|
32
|
+
// blend back
|
|
33
|
+
];
|
|
34
|
+
function getShimmerColor(frame) {
|
|
35
|
+
return SHIMMER_COLORS[frame % SHIMMER_COLORS.length];
|
|
36
|
+
}
|
|
15
37
|
const SpinnerLine = memo(function SpinnerLine2({
|
|
16
38
|
currentTaskActiveForm,
|
|
17
39
|
todos,
|
|
@@ -23,10 +45,10 @@ const SpinnerLine = memo(function SpinnerLine2({
|
|
|
23
45
|
const { spinnerFrame, elapsedTime } = useUnifiedAnimation({
|
|
24
46
|
enabled: true,
|
|
25
47
|
startTime: startTimeRef.current,
|
|
26
|
-
spinnerFrameCount:
|
|
48
|
+
spinnerFrameCount: SHIMMER_COLORS.length,
|
|
27
49
|
componentId: "todo-panel-spinner"
|
|
28
50
|
});
|
|
29
|
-
const streamState = useMemo(() =>
|
|
51
|
+
const streamState = useMemo(() => getMainStreamingState(), [spinnerFrame]);
|
|
30
52
|
const getCurrentTaskDisplay = () => {
|
|
31
53
|
if (currentTaskActiveForm) {
|
|
32
54
|
return currentTaskActiveForm;
|
|
@@ -53,31 +75,25 @@ const SpinnerLine = memo(function SpinnerLine2({
|
|
|
53
75
|
const secs = seconds % 60;
|
|
54
76
|
return secs > 0 ? `${mins}m ${secs}s` : `${mins}m`;
|
|
55
77
|
};
|
|
56
|
-
const
|
|
57
|
-
|
|
58
|
-
deep_thinking: theme.minto,
|
|
59
|
-
generating: theme.success,
|
|
60
|
-
tool_use: theme.warning,
|
|
61
|
-
waiting: theme.secondaryText,
|
|
62
|
-
retrying: theme.error,
|
|
63
|
-
permission: theme.info,
|
|
64
|
-
compacting: theme.info,
|
|
65
|
-
concurrent: theme.success
|
|
66
|
-
};
|
|
67
|
-
const spinnerColor = phaseColors[streamState.phase];
|
|
78
|
+
const shimmerColor = getShimmerColor(spinnerFrame);
|
|
79
|
+
const spinnerIconFrame = spinnerFrame % SYMBOLS.THINKING_FRAMES.length;
|
|
68
80
|
const getTokenDisplay = () => {
|
|
69
81
|
if (streamState.inputTokens || streamState.outputTokens) {
|
|
70
82
|
return formatTokenUsage(streamState.inputTokens, streamState.outputTokens);
|
|
71
83
|
}
|
|
72
84
|
if (streamState.receivedChars && streamState.receivedChars > 0) {
|
|
73
|
-
const
|
|
74
|
-
|
|
85
|
+
const approxOutputTokens = Math.round(streamState.receivedChars / 3);
|
|
86
|
+
if (streamState.sentChars && streamState.sentChars > 0) {
|
|
87
|
+
const approxInputTokens = Math.round(streamState.sentChars / 3);
|
|
88
|
+
return `\u2191 ~${formatNumber(approxInputTokens)} \xB7 \u2193 ~${formatNumber(approxOutputTokens)}`;
|
|
89
|
+
}
|
|
90
|
+
return `\u2193 ~${formatNumber(approxOutputTokens)}`;
|
|
75
91
|
}
|
|
76
92
|
return "";
|
|
77
93
|
};
|
|
78
94
|
const tokenUsage = getTokenDisplay();
|
|
79
95
|
const thinkingDuration = streamState.thinkingDurationMs ? Math.floor(streamState.thinkingDurationMs / 1e3) : null;
|
|
80
|
-
return /* @__PURE__ */ React.createElement(Box, { flexDirection: "row" }, /* @__PURE__ */ React.createElement(Text, { color:
|
|
96
|
+
return /* @__PURE__ */ React.createElement(Box, { flexDirection: "row", flexWrap: "nowrap" }, /* @__PURE__ */ React.createElement(Text, { color: shimmerColor }, SYMBOLS.THINKING_FRAMES[spinnerIconFrame], " "), /* @__PURE__ */ React.createElement(Text, { color: shimmerColor, bold: true }, getCurrentTaskDisplay()), /* @__PURE__ */ React.createElement(Text, { color: shimmerColor }, "\u2026 "), /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.START }, "(", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, "esc esc"), " to cancel \xB7", " ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, formatTime(elapsedTime)), tokenUsage && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, " \xB7 ", tokenUsage), thinkingDuration !== null && thinkingDuration > 0 && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, " ", "\xB7 thinking ", thinkingDuration, "s"), shouldShowTodos && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, " ", "\xB7 ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, "ctrl+t"), " to hide"), ")"), getSessionState("currentError") && /* @__PURE__ */ React.createElement(Text, { color: SYMBOL_COLORS.error }, " ", "\xB7 ", getSessionState("currentError")));
|
|
81
97
|
});
|
|
82
98
|
const SPINNER_MESSAGES = [
|
|
83
99
|
"Thinking",
|
|
@@ -104,7 +120,7 @@ const TodoPanel = memo(function TodoPanel2({
|
|
|
104
120
|
const shouldShowTodos = hasTodos && hasIncompleteTasks && isVisible && showTodoList;
|
|
105
121
|
if (!isLoading) {
|
|
106
122
|
if (shouldShowTodos) {
|
|
107
|
-
return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", marginTop: 1 }, /* @__PURE__ */ React.createElement(Box, { flexDirection: "row" }, /* @__PURE__ */ React.createElement(Text, { color:
|
|
123
|
+
return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", marginTop: 1 }, /* @__PURE__ */ React.createElement(Box, { flexDirection: "row" }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "\u25CB "), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, hasIncompleteTasks ? `${todos.filter((t) => t.status !== "completed").length} tasks remaining` : "All done")), /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, todos.map((todo, idx) => /* @__PURE__ */ React.createElement(React.Fragment, { key: `todo-${idx}-${todo.content.slice(0, 20)}` }, /* @__PURE__ */ React.createElement(
|
|
108
124
|
TodoItemClaudeStyle,
|
|
109
125
|
{
|
|
110
126
|
todo,
|
|
@@ -134,10 +150,12 @@ const TodoItemClaudeStyle = memo(function TodoItemClaudeStyle2({
|
|
|
134
150
|
isFirst
|
|
135
151
|
}) {
|
|
136
152
|
const isCompleted = todo.status === "completed";
|
|
153
|
+
const isInProgress = todo.status === "in_progress";
|
|
137
154
|
const symbol = getTodoStatusSymbol(todo.status);
|
|
138
|
-
const
|
|
155
|
+
const symbolColor = isCompleted ? SEMANTIC_COLORS.dim : isInProgress ? BRAND_GRADIENT.MIDDLE : BRAND_GRADIENT.START;
|
|
156
|
+
const textColor = isCompleted ? SEMANTIC_COLORS.dim : SEMANTIC_COLORS.secondary;
|
|
139
157
|
const indent = isFirst ? `${getIndent("L1")}${SYMBOLS.CHILD_OUTPUT} ` : `${getIndent("L1")} `;
|
|
140
|
-
return /* @__PURE__ */ React.createElement(Box, { flexDirection: "row" }, /* @__PURE__ */ React.createElement(Text, { color:
|
|
158
|
+
return /* @__PURE__ */ React.createElement(Box, { flexDirection: "row" }, /* @__PURE__ */ React.createElement(Text, { color: SYMBOL_COLORS.child }, indent), /* @__PURE__ */ React.createElement(Text, { color: symbolColor }, symbol, " "), /* @__PURE__ */ React.createElement(Text, { color: textColor, strikethrough: isCompleted }, todo.content));
|
|
141
159
|
});
|
|
142
160
|
export {
|
|
143
161
|
TodoPanel
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/components/TodoPanel.tsx"],
|
|
4
|
-
"sourcesContent": ["import React, {\n useState,\n useEffect,\n useRef,\n useMemo,\n memo,\n useCallback,\n} from 'react'\nimport { Box, Text } from 'ink'\nimport { TodoItem } from './TodoItem'\nimport { getTheme } from '@utils/theme'\nimport { SYMBOLS, getTodoStatusSymbol } from '@constants/symbols'\nimport { formatNumber, formatTokenUsage } from '@utils/format'\nimport type { TodoItem as TodoItemType } from '@utils/todoStorage'\nimport { sample } from 'lodash-es'\nimport { getStreamingState, type StreamingPhase } from './Spinner'\nimport { getSessionState } from '@utils/sessionState'\nimport { useUnifiedAnimation } from '@utils/animationManager'\nimport { SEMANTIC_COLORS, STATUS_COLORS } from '@constants/colors'\nimport { INDENT_LEVELS, getIndent } from '@constants/formatRules'\n\n/**\n * Isolated Spinner component to prevent animation updates from re-rendering the entire panel\n * This component handles all animation state internally\n */\ninterface SpinnerLineProps {\n currentTaskActiveForm?: string\n todos: TodoItemType[]\n shouldShowTodos: boolean\n fallbackMessage: string\n}\n\nconst SpinnerLine = memo(function SpinnerLine({\n currentTaskActiveForm,\n todos,\n shouldShowTodos,\n fallbackMessage,\n}: SpinnerLineProps) {\n const theme = getTheme()\n const startTimeRef = useRef(Date.now())\n\n // Animation state is isolated in this component\n const { spinnerFrame, elapsedTime } = useUnifiedAnimation({\n enabled: true,\n startTime: startTimeRef.current,\n spinnerFrameCount: SYMBOLS.THINKING_FRAMES.length,\n componentId: 'todo-panel-spinner',\n })\n\n // Get streaming state - only updates when this component re-renders\n const streamState = useMemo(() => getStreamingState(), [spinnerFrame])\n\n // Get current task display\n const getCurrentTaskDisplay = (): string => {\n if (currentTaskActiveForm) {\n return currentTaskActiveForm\n }\n const inProgressTodo = todos.find(t => t.status === 'in_progress')\n if (inProgressTodo?.activeForm) {\n return inProgressTodo.activeForm\n }\n switch (streamState.phase) {\n case 'tool_use':\n return streamState.toolName\n ? `Using ${streamState.toolName}`\n : 'Executing tool'\n case 'generating':\n return 'Generating response'\n case 'waiting':\n return 'Waiting for response'\n case 'thinking':\n default:\n return fallbackMessage || 'Thinking'\n }\n }\n\n // Format time display\n const formatTime = (seconds: number): string => {\n if (seconds < 60) return `${seconds}s`\n const mins = Math.floor(seconds / 60)\n const secs = seconds % 60\n return secs > 0 ? `${mins}m ${secs}s` : `${mins}m`\n }\n\n // Phase colors\n const phaseColors: Record<StreamingPhase, string> = {\n thinking: theme.minto,\n deep_thinking: theme.minto,\n generating: theme.success,\n tool_use: theme.warning,\n waiting: theme.secondaryText,\n retrying: theme.error,\n permission: theme.info,\n compacting: theme.info,\n concurrent: theme.success,\n }\n\n const spinnerColor = phaseColors[streamState.phase]\n\n // Get token usage from streaming state (API values or approximate from chars)\n const getTokenDisplay = () => {\n // Prefer API-provided token counts\n if (streamState.inputTokens || streamState.outputTokens) {\n return formatTokenUsage(streamState.inputTokens, streamState.outputTokens)\n }\n // Fallback: approximate from received characters (~3 chars per token for mixed content)\n if (streamState.receivedChars && streamState.receivedChars > 0) {\n const approxTokens = Math.round(streamState.receivedChars / 3)\n return `\u2193 ~${formatNumber(approxTokens)}`\n }\n return ''\n }\n\n const tokenUsage = getTokenDisplay()\n\n // Get thinking duration if available\n const thinkingDuration = streamState.thinkingDurationMs\n ? Math.floor(streamState.thinkingDurationMs / 1000)\n : null\n\n return (\n <Box flexDirection=\"row\">\n <Text color={spinnerColor}>{SYMBOLS.THINKING_FRAMES[spinnerFrame]} </Text>\n <Text color={spinnerColor}>{getCurrentTaskDisplay()}</Text>\n <Text color={spinnerColor}>\u2026 </Text>\n <Text color={theme.secondaryText}>\n (<Text bold>esc</Text> to interrupt \u00B7 {formatTime(elapsedTime)}\n {tokenUsage && <Text> \u00B7 {tokenUsage} tokens</Text>}\n {thinkingDuration !== null && thinkingDuration > 0 && (\n <Text> \u00B7 thought for {thinkingDuration}s</Text>\n )}\n {shouldShowTodos && (\n <Text>\n {' '}\n \u00B7 <Text bold>ctrl+t</Text> to hide todos\n </Text>\n )}\n )\n </Text>\n {getSessionState('currentError') && (\n <Text color={theme.error}> \u00B7 {getSessionState('currentError')}</Text>\n )}\n </Box>\n )\n})\n\n// Spinner messages for fallback when no todos\nconst SPINNER_MESSAGES = [\n 'Thinking',\n 'Processing',\n 'Working',\n 'Computing',\n 'Analyzing',\n 'Generating',\n 'Executing',\n 'Preparing',\n]\n\ninterface TodoPanelProps {\n /** TODO \u5217\u8868 */\n todos: TodoItemType[]\n /** \u662F\u5426\u663E\u793A\u9762\u677F\uFF08\u7531 Ctrl+T \u63A7\u5236\uFF09 */\n isVisible: boolean\n /** \u5F53\u524D\u4E3B\u4EFB\u52A1\u7684 activeForm\uFF08\u8FDB\u884C\u4E2D\u7684\u4EFB\u52A1\u63CF\u8FF0\uFF09 */\n currentTaskActiveForm?: string\n /** \u8FD0\u884C\u65F6\u95F4\uFF08\u79D2\uFF09 */\n elapsedTime?: number\n /** \u662F\u5426\u6B63\u5728\u52A0\u8F7D\uFF08\u63A7\u5236\u52A8\u753B\uFF09 */\n isLoading?: boolean\n /** \u662F\u5426\u663E\u793A\u4EFB\u52A1\u5217\u8868\u8BE6\u60C5 */\n showTodoList?: boolean\n}\n\n/**\n * \u7EDF\u4E00\u7684 Spinner + TODO \u9762\u677F\u7EC4\u4EF6 - Claude Code CLI \u98CE\u683C\n *\n * \u5F53\u6709 TODO \u65F6\u663E\u793A\uFF1A\n * ```\n * \u273D Fixing async tool description bug\u2026 (esc to interrupt \u00B7 ctrl+t to hide todos \u00B7 2m 52s \u00B7 \u2191 5.1k tokens)\n * \u23BF \u2610 Phase 1.1: Fix async tool description bug\n * \u2610 Phase 1.2: Add memory safety fixes\n * ```\n *\n * \u65E0 TODO \u65F6\u663E\u793A\u666E\u901A Spinner\uFF1A\n * ```\n * \u273D Thinking\u2026 (3s \u00B7 esc to interrupt)\n * ```\n *\n * Performance optimization: Animation is isolated in SpinnerLine component\n * to prevent the entire panel from re-rendering on each animation frame.\n */\nexport const TodoPanel = memo(function TodoPanel({\n todos,\n isVisible,\n currentTaskActiveForm,\n elapsedTime: initialElapsedTime = 0,\n isLoading = true,\n showTodoList = true,\n}: TodoPanelProps) {\n const theme = getTheme()\n const fallbackMessage = useRef(sample(SPINNER_MESSAGES) || 'Thinking')\n\n // \u5224\u65AD\u662F\u5426\u6709\u5F85\u529E\u4E8B\u9879\n const hasTodos = todos.length > 0\n const hasIncompleteTasks = todos.some(t => t.status !== 'completed')\n const shouldShowTodos =\n hasTodos && hasIncompleteTasks && isVisible && showTodoList\n\n // \u5982\u679C\u4E0D\u5728\u52A0\u8F7D\u72B6\u6001\uFF0C\u53EA\u663E\u793A todo \u5217\u8868\uFF08\u5982\u679C\u6709\u672A\u5B8C\u6210\u4EFB\u52A1\uFF09\n if (!isLoading) {\n // \u5373\u4F7F\u4E0D\u5728\u52A0\u8F7D\u4E2D\uFF0C\u5982\u679C\u6709\u672A\u5B8C\u6210\u7684\u4EFB\u52A1\u4E5F\u663E\u793A\u5217\u8868\n if (shouldShowTodos) {\n return (\n <Box flexDirection=\"column\" marginTop={1}>\n {/* \u9759\u6001\u6807\u9898 - \u663E\u793A\u8FD8\u6709\u672A\u5B8C\u6210\u4EFB\u52A1 */}\n <Box flexDirection=\"row\">\n <Text color={theme.secondaryText}>\u25CB </Text>\n <Text color={theme.secondaryText}>\n {hasIncompleteTasks\n ? `${todos.filter(t => t.status !== 'completed').length} task(s) remaining`\n : 'All tasks finished'}\n </Text>\n </Box>\n {/* TODO \u5217\u8868 */}\n <Box flexDirection=\"column\">\n {todos.map((todo, idx) => (\n <React.Fragment key={`todo-${idx}-${todo.content.slice(0, 20)}`}>\n <TodoItemClaudeStyle\n todo={todo}\n theme={theme}\n isFirst={idx === 0}\n />\n </React.Fragment>\n ))}\n </Box>\n </Box>\n )\n }\n return null\n }\n\n return (\n <Box flexDirection=\"column\" marginTop={1}>\n {/* \u7B2C\u4E00\u884C\uFF1A\u52A8\u753B + \u5F53\u524D\u4EFB\u52A1 + \u7EDF\u8BA1\u4FE1\u606F - \u9694\u79BB\u5728 SpinnerLine \u7EC4\u4EF6\u4E2D */}\n <SpinnerLine\n currentTaskActiveForm={currentTaskActiveForm}\n todos={todos}\n shouldShowTodos={shouldShowTodos}\n fallbackMessage={fallbackMessage.current}\n />\n\n {/* TODO \u5217\u8868 - \u4EC5\u5F53\u53EF\u89C1\u4E14\u6709\u672A\u5B8C\u6210\u4EFB\u52A1\u65F6\u663E\u793A */}\n {shouldShowTodos && <TodoList todos={todos} theme={theme} />}\n </Box>\n )\n})\n\n/**\n * Memoized TODO list to prevent re-rendering when only the spinner updates\n */\ninterface TodoListProps {\n todos: TodoItemType[]\n theme: ReturnType<typeof getTheme>\n}\n\nconst TodoList = memo(function TodoList({ todos, theme }: TodoListProps) {\n return (\n <Box flexDirection=\"column\">\n {todos.map((todo, idx) => (\n <React.Fragment key={`todo-${idx}-${todo.content.slice(0, 20)}`}>\n <TodoItemClaudeStyle todo={todo} theme={theme} isFirst={idx === 0} />\n </React.Fragment>\n ))}\n </Box>\n )\n})\n\n/**\n * Claude Code \u98CE\u683C\u7684 TODO \u9879\n *\n * \u683C\u5F0F\uFF1A\n * ```\n * \u23BF \u2612 \u5DF2\u5B8C\u6210\u4EFB\u52A1 (\u7070\u8272 + \u5220\u9664\u7EBF)\n * \u2610 \u5F85\u5B8C\u6210\u4EFB\u52A1\n * ```\n */\ninterface TodoItemClaudeStyleProps {\n todo: TodoItemType\n theme: ReturnType<typeof getTheme>\n isFirst: boolean\n}\n\n/**\n * Memoized TODO item component\n */\nconst TodoItemClaudeStyle = memo(function TodoItemClaudeStyle({\n todo,\n theme,\n isFirst,\n}: TodoItemClaudeStyleProps) {\n const isCompleted = todo.status === 'completed'\n\n // \u7B26\u53F7\uFF1A\u2610 \u672A\u5B8C\u6210 / \u2612 \u5DF2\u5B8C\u6210\n const symbol = getTodoStatusSymbol(todo.status)\n\n // \u989C\u8272\uFF1A\u5DF2\u5B8C\u6210\u7528\u7070\u8272\uFF0C\u5176\u4ED6\u6B63\u5E38\n const color = isCompleted ? theme.dim : undefined\n\n // \u4F7F\u7528 REPL \u89C4\u8303\u5B9A\u4E49\u7684\u7ED3\u6784\u7B26\u53F7\uFF1A\u7B2C\u4E00\u4E2A\u7528 \" \u23BF \"\uFF0C\u5176\u4ED6\u7528\u7F29\u8FDB\u5BF9\u9F50\n const indent = isFirst\n ? `${getIndent('L1')}${SYMBOLS.CHILD_OUTPUT} `\n : `${getIndent('L1')} `\n\n return (\n <Box flexDirection=\"row\">\n {/* \u7F29\u8FDB */}\n <Text color={theme.dim}>{indent}</Text>\n\n {/* \u72B6\u6001\u7B26\u53F7 */}\n <Text color={color}>{symbol} </Text>\n\n {/* \u4EFB\u52A1\u63CF\u8FF0 */}\n <Text color={color} strikethrough={isCompleted}>\n {todo.content}\n </Text>\n </Box>\n )\n})\n"],
|
|
5
|
-
"mappings": "AAAA,OAAO
|
|
4
|
+
"sourcesContent": ["import React, { useRef, useMemo, memo } from 'react'\nimport { Box, Text } from 'ink'\nimport { getTheme } from '@utils/theme'\nimport { SYMBOLS, getTodoStatusSymbol } from '@constants/symbols'\nimport { formatNumber, formatTokenUsage } from '@utils/format'\nimport type { TodoItem as TodoItemType } from '@utils/todoStorage'\nimport { sample } from 'lodash-es'\nimport { getMainStreamingState } from './Spinner'\nimport { getSessionState } from '@utils/sessionState'\nimport { useUnifiedAnimation } from '@utils/animationManager'\nimport {\n SEMANTIC_COLORS,\n BRAND_GRADIENT,\n SYMBOL_COLORS,\n} from '@constants/colors'\nimport { getIndent } from '@constants/formatRules'\n\n/**\n * Isolated Spinner component to prevent animation updates from re-rendering the entire panel\n * This component handles all animation state internally\n */\ninterface SpinnerLineProps {\n currentTaskActiveForm?: string\n todos: TodoItemType[]\n shouldShowTodos: boolean\n fallbackMessage: string\n}\n\n/**\n * Shimmer effect colors - creates a light sweep animation across text\n * Uses brand gradient colors cycling through: purple-blue \u2192 pink-purple \u2192 coral \u2192 pink-purple \u2192 purple-blue\n */\nconst SHIMMER_COLORS = [\n BRAND_GRADIENT.START, // #667EEA purple-blue\n '#8673D9', // blend\n BRAND_GRADIENT.MIDDLE, // #B668C8 pink-purple\n '#D560A0', // blend\n BRAND_GRADIENT.END, // #F5576C coral\n '#D560A0', // blend back\n BRAND_GRADIENT.MIDDLE, // #B668C8\n '#8673D9', // blend back\n] as const\n\n/**\n * Get shimmer color based on animation frame\n * Creates a smooth color transition effect\n */\nfunction getShimmerColor(frame: number): string {\n return SHIMMER_COLORS[frame % SHIMMER_COLORS.length]!\n}\n\nconst SpinnerLine = memo(function SpinnerLine({\n currentTaskActiveForm,\n todos,\n shouldShowTodos,\n fallbackMessage,\n}: SpinnerLineProps) {\n const theme = getTheme()\n const startTimeRef = useRef(Date.now())\n\n // Animation state is isolated in this component\n // Use 8 frames for shimmer effect (matching SHIMMER_COLORS length)\n const { spinnerFrame, elapsedTime } = useUnifiedAnimation({\n enabled: true,\n startTime: startTimeRef.current,\n spinnerFrameCount: SHIMMER_COLORS.length,\n componentId: 'todo-panel-spinner',\n })\n\n // Get streaming state - only updates when this component re-renders\n // Use main streaming state to avoid subagent interference\n const streamState = useMemo(() => getMainStreamingState(), [spinnerFrame])\n\n // Get current task display\n const getCurrentTaskDisplay = (): string => {\n if (currentTaskActiveForm) {\n return currentTaskActiveForm\n }\n const inProgressTodo = todos.find(t => t.status === 'in_progress')\n if (inProgressTodo?.activeForm) {\n return inProgressTodo.activeForm\n }\n switch (streamState.phase) {\n case 'tool_use':\n return streamState.toolName\n ? `Using ${streamState.toolName}`\n : 'Executing tool'\n case 'generating':\n return 'Generating response'\n case 'waiting':\n return 'Waiting for response'\n case 'thinking':\n default:\n return fallbackMessage || 'Thinking'\n }\n }\n\n // Format time display\n const formatTime = (seconds: number): string => {\n if (seconds < 60) return `${seconds}s`\n const mins = Math.floor(seconds / 60)\n const secs = seconds % 60\n return secs > 0 ? `${mins}m ${secs}s` : `${mins}m`\n }\n\n // Get shimmer color for the main text (light sweep effect)\n const shimmerColor = getShimmerColor(spinnerFrame)\n\n // Spinner icon uses thinking frames\n const spinnerIconFrame = spinnerFrame % SYMBOLS.THINKING_FRAMES.length\n\n // Get token usage from streaming state (API values or approximate from chars)\n const getTokenDisplay = () => {\n // Prefer API-provided token counts - always show bidirectional if available\n if (streamState.inputTokens || streamState.outputTokens) {\n return formatTokenUsage(streamState.inputTokens, streamState.outputTokens)\n }\n // Fallback: approximate from received characters (~3 chars per token for mixed content)\n // Only show output approximation since we don't have input char count in this path\n if (streamState.receivedChars && streamState.receivedChars > 0) {\n const approxOutputTokens = Math.round(streamState.receivedChars / 3)\n // If we have sentChars, show both directions\n if (streamState.sentChars && streamState.sentChars > 0) {\n const approxInputTokens = Math.round(streamState.sentChars / 3)\n return `\u2191 ~${formatNumber(approxInputTokens)} \u00B7 \u2193 ~${formatNumber(approxOutputTokens)}`\n }\n return `\u2193 ~${formatNumber(approxOutputTokens)}`\n }\n return ''\n }\n\n const tokenUsage = getTokenDisplay()\n\n // Get thinking duration if available\n const thinkingDuration = streamState.thinkingDurationMs\n ? Math.floor(streamState.thinkingDurationMs / 1000)\n : null\n\n return (\n <Box flexDirection=\"row\" flexWrap=\"nowrap\">\n {/* Spinner icon with shimmer effect */}\n <Text color={shimmerColor}>\n {SYMBOLS.THINKING_FRAMES[spinnerIconFrame]}{' '}\n </Text>\n {/* Main task description with shimmer effect */}\n <Text color={shimmerColor} bold>\n {getCurrentTaskDisplay()}\n </Text>\n <Text color={shimmerColor}>\u2026 </Text>\n {/* Meta info with brand gradient accent */}\n <Text color={BRAND_GRADIENT.START}>\n (<Text color={SEMANTIC_COLORS.secondary}>esc esc</Text> to cancel \u00B7{' '}\n <Text color={SEMANTIC_COLORS.secondary}>{formatTime(elapsedTime)}</Text>\n {tokenUsage && (\n <Text color={SEMANTIC_COLORS.secondary}> \u00B7 {tokenUsage}</Text>\n )}\n {thinkingDuration !== null && thinkingDuration > 0 && (\n <Text color={SEMANTIC_COLORS.secondary}>\n {' '}\n \u00B7 thinking {thinkingDuration}s\n </Text>\n )}\n {shouldShowTodos && (\n <Text color={SEMANTIC_COLORS.secondary}>\n {' '}\n \u00B7 <Text color={SEMANTIC_COLORS.secondary}>ctrl+t</Text> to hide\n </Text>\n )}\n )\n </Text>\n {getSessionState('currentError') && (\n <Text color={SYMBOL_COLORS.error}>\n {' '}\n \u00B7 {getSessionState('currentError')}\n </Text>\n )}\n </Box>\n )\n})\n\n// Spinner messages for fallback when no todos\nconst SPINNER_MESSAGES = [\n 'Thinking',\n 'Processing',\n 'Working',\n 'Computing',\n 'Analyzing',\n 'Generating',\n 'Executing',\n 'Preparing',\n]\n\ninterface TodoPanelProps {\n /** TODO \u5217\u8868 */\n todos: TodoItemType[]\n /** \u662F\u5426\u663E\u793A\u9762\u677F\uFF08\u7531 Ctrl+T \u63A7\u5236\uFF09 */\n isVisible: boolean\n /** \u5F53\u524D\u4E3B\u4EFB\u52A1\u7684 activeForm\uFF08\u8FDB\u884C\u4E2D\u7684\u4EFB\u52A1\u63CF\u8FF0\uFF09 */\n currentTaskActiveForm?: string\n /** \u8FD0\u884C\u65F6\u95F4\uFF08\u79D2\uFF09 */\n elapsedTime?: number\n /** \u662F\u5426\u6B63\u5728\u52A0\u8F7D\uFF08\u63A7\u5236\u52A8\u753B\uFF09 */\n isLoading?: boolean\n /** \u662F\u5426\u663E\u793A\u4EFB\u52A1\u5217\u8868\u8BE6\u60C5 */\n showTodoList?: boolean\n}\n\n/**\n * \u7EDF\u4E00\u7684 Spinner + TODO \u9762\u677F\u7EC4\u4EF6 - Claude Code CLI \u98CE\u683C\n *\n * \u5F53\u6709 TODO \u65F6\u663E\u793A\uFF1A\n * ```\n * \u273D Fixing async tool description bug\u2026 (esc to interrupt \u00B7 ctrl+t to hide todos \u00B7 2m 52s \u00B7 \u2191 5.1k tokens)\n * \u23BF \u2610 Phase 1.1: Fix async tool description bug\n * \u2610 Phase 1.2: Add memory safety fixes\n * ```\n *\n * \u65E0 TODO \u65F6\u663E\u793A\u666E\u901A Spinner\uFF1A\n * ```\n * \u273D Thinking\u2026 (3s \u00B7 esc to interrupt)\n * ```\n *\n * Performance optimization: Animation is isolated in SpinnerLine component\n * to prevent the entire panel from re-rendering on each animation frame.\n */\nexport const TodoPanel = memo(function TodoPanel({\n todos,\n isVisible,\n currentTaskActiveForm,\n elapsedTime: initialElapsedTime = 0,\n isLoading = true,\n showTodoList = true,\n}: TodoPanelProps) {\n const theme = getTheme()\n const fallbackMessage = useRef(sample(SPINNER_MESSAGES) || 'Thinking')\n\n // \u5224\u65AD\u662F\u5426\u6709\u5F85\u529E\u4E8B\u9879\n const hasTodos = todos.length > 0\n const hasIncompleteTasks = todos.some(t => t.status !== 'completed')\n const shouldShowTodos =\n hasTodos && hasIncompleteTasks && isVisible && showTodoList\n\n // \u5982\u679C\u4E0D\u5728\u52A0\u8F7D\u72B6\u6001\uFF0C\u53EA\u663E\u793A todo \u5217\u8868\uFF08\u5982\u679C\u6709\u672A\u5B8C\u6210\u4EFB\u52A1\uFF09\n if (!isLoading) {\n // \u5373\u4F7F\u4E0D\u5728\u52A0\u8F7D\u4E2D\uFF0C\u5982\u679C\u6709\u672A\u5B8C\u6210\u7684\u4EFB\u52A1\u4E5F\u663E\u793A\u5217\u8868\n if (shouldShowTodos) {\n return (\n <Box flexDirection=\"column\" marginTop={1}>\n {/* \u9759\u6001\u6807\u9898 - \u663E\u793A\u8FD8\u6709\u672A\u5B8C\u6210\u4EFB\u52A1 */}\n <Box flexDirection=\"row\">\n <Text color={SEMANTIC_COLORS.dim}>\u25CB </Text>\n <Text color={SEMANTIC_COLORS.dim}>\n {hasIncompleteTasks\n ? `${todos.filter(t => t.status !== 'completed').length} tasks remaining`\n : 'All done'}\n </Text>\n </Box>\n {/* TODO \u5217\u8868 */}\n <Box flexDirection=\"column\">\n {todos.map((todo, idx) => (\n <React.Fragment key={`todo-${idx}-${todo.content.slice(0, 20)}`}>\n <TodoItemClaudeStyle\n todo={todo}\n theme={theme}\n isFirst={idx === 0}\n />\n </React.Fragment>\n ))}\n </Box>\n </Box>\n )\n }\n return null\n }\n\n return (\n <Box flexDirection=\"column\" marginTop={1}>\n {/* \u7B2C\u4E00\u884C\uFF1A\u52A8\u753B + \u5F53\u524D\u4EFB\u52A1 + \u7EDF\u8BA1\u4FE1\u606F - \u9694\u79BB\u5728 SpinnerLine \u7EC4\u4EF6\u4E2D */}\n <SpinnerLine\n currentTaskActiveForm={currentTaskActiveForm}\n todos={todos}\n shouldShowTodos={shouldShowTodos}\n fallbackMessage={fallbackMessage.current}\n />\n\n {/* TODO \u5217\u8868 - \u4EC5\u5F53\u53EF\u89C1\u4E14\u6709\u672A\u5B8C\u6210\u4EFB\u52A1\u65F6\u663E\u793A */}\n {shouldShowTodos && <TodoList todos={todos} theme={theme} />}\n </Box>\n )\n})\n\n/**\n * Memoized TODO list to prevent re-rendering when only the spinner updates\n */\ninterface TodoListProps {\n todos: TodoItemType[]\n theme: ReturnType<typeof getTheme>\n}\n\nconst TodoList = memo(function TodoList({ todos, theme }: TodoListProps) {\n return (\n <Box flexDirection=\"column\">\n {todos.map((todo, idx) => (\n <React.Fragment key={`todo-${idx}-${todo.content.slice(0, 20)}`}>\n <TodoItemClaudeStyle todo={todo} theme={theme} isFirst={idx === 0} />\n </React.Fragment>\n ))}\n </Box>\n )\n})\n\n/**\n * Claude Code \u98CE\u683C\u7684 TODO \u9879\n *\n * \u683C\u5F0F\uFF1A\n * ```\n * \u23BF \u2612 \u5DF2\u5B8C\u6210\u4EFB\u52A1 (\u7070\u8272 + \u5220\u9664\u7EBF)\n * \u2610 \u5F85\u5B8C\u6210\u4EFB\u52A1\n * ```\n */\ninterface TodoItemClaudeStyleProps {\n todo: TodoItemType\n theme: ReturnType<typeof getTheme>\n isFirst: boolean\n}\n\n/**\n * Memoized TODO item component with brand-consistent colors\n */\nconst TodoItemClaudeStyle = memo(function TodoItemClaudeStyle({\n todo,\n theme,\n isFirst,\n}: TodoItemClaudeStyleProps) {\n const isCompleted = todo.status === 'completed'\n const isInProgress = todo.status === 'in_progress'\n\n // \u7B26\u53F7\uFF1A\u2610 \u672A\u5B8C\u6210 / \u2612 \u5DF2\u5B8C\u6210\n const symbol = getTodoStatusSymbol(todo.status)\n\n // \u4F7F\u7528\u54C1\u724C\u914D\u8272\uFF1A\n // - \u5DF2\u5B8C\u6210\uFF1Adim \u7070\u8272\n // - \u8FDB\u884C\u4E2D\uFF1A\u54C1\u724C\u4E2D\u95F4\u8272\uFF08\u7C89\u7D2B\uFF09\n // - \u5F85\u5904\u7406\uFF1A\u54C1\u724C\u8D77\u59CB\u8272\uFF08\u7D2B\u84DD\uFF09\n const symbolColor = isCompleted\n ? SEMANTIC_COLORS.dim\n : isInProgress\n ? BRAND_GRADIENT.MIDDLE\n : BRAND_GRADIENT.START\n\n const textColor = isCompleted\n ? SEMANTIC_COLORS.dim\n : SEMANTIC_COLORS.secondary\n\n // \u4F7F\u7528 REPL \u89C4\u8303\u5B9A\u4E49\u7684\u7ED3\u6784\u7B26\u53F7\uFF1A\u7B2C\u4E00\u4E2A\u7528 \" \u23BF \"\uFF0C\u5176\u4ED6\u7528\u7F29\u8FDB\u5BF9\u9F50\n const indent = isFirst\n ? `${getIndent('L1')}${SYMBOLS.CHILD_OUTPUT} `\n : `${getIndent('L1')} `\n\n return (\n <Box flexDirection=\"row\">\n {/* \u7F29\u8FDB - \u4F7F\u7528\u54C1\u724C\u8272 */}\n <Text color={SYMBOL_COLORS.child}>{indent}</Text>\n\n {/* \u72B6\u6001\u7B26\u53F7 - \u4F7F\u7528\u54C1\u724C\u914D\u8272 */}\n <Text color={symbolColor}>{symbol} </Text>\n\n {/* \u4EFB\u52A1\u63CF\u8FF0 */}\n <Text color={textColor} strikethrough={isCompleted}>\n {todo.content}\n </Text>\n </Box>\n )\n})\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["SpinnerLine", "TodoPanel", "TodoList", "TodoItemClaudeStyle"]
|
|
7
7
|
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { Box, Text } from "ink";
|
|
2
2
|
import React from "react";
|
|
3
3
|
import { useInterval } from "../hooks/useInterval.js";
|
|
4
|
-
import { getTheme } from "../utils/theme.js";
|
|
5
4
|
import { BLACK_CIRCLE } from "../constants/figures.js";
|
|
5
|
+
import { SYMBOL_COLORS } from "../constants/colors.js";
|
|
6
6
|
function ToolUseLoader({
|
|
7
7
|
isError,
|
|
8
8
|
isUnresolved,
|
|
@@ -15,7 +15,7 @@ function ToolUseLoader({
|
|
|
15
15
|
}
|
|
16
16
|
setIsVisible((_) => !_);
|
|
17
17
|
}, 600);
|
|
18
|
-
const color = isUnresolved ?
|
|
18
|
+
const color = isUnresolved ? SYMBOL_COLORS.running : isError ? SYMBOL_COLORS.error : SYMBOL_COLORS.success;
|
|
19
19
|
return /* @__PURE__ */ React.createElement(Box, { minWidth: 2 }, /* @__PURE__ */ React.createElement(Text, { color }, isVisible ? BLACK_CIRCLE : " "));
|
|
20
20
|
}
|
|
21
21
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/components/ToolUseLoader.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Box, Text } from 'ink'\nimport React from 'react'\nimport { useInterval } from '@hooks/useInterval'\nimport {
|
|
5
|
-
"mappings": "AAAA,SAAS,KAAK,YAAY;AAC1B,OAAO,WAAW;AAClB,SAAS,mBAAmB;AAC5B,SAAS,
|
|
4
|
+
"sourcesContent": ["import { Box, Text } from 'ink'\nimport React from 'react'\nimport { useInterval } from '@hooks/useInterval'\nimport { BLACK_CIRCLE } from '@constants/figures'\nimport { SYMBOL_COLORS } from '@constants/colors'\n\ntype Props = {\n isError: boolean\n isUnresolved: boolean\n shouldAnimate: boolean\n}\n\nexport function ToolUseLoader({\n isError,\n isUnresolved,\n shouldAnimate,\n}: Props): React.ReactNode {\n const [isVisible, setIsVisible] = React.useState(true)\n\n useInterval(() => {\n if (!shouldAnimate) {\n return\n }\n // To avoid flickering when the tool use confirm is visible, we set the loader to be visible\n // when the tool use confirm is visible.\n setIsVisible(_ => !_)\n }, 600)\n\n // \u4F7F\u7528 SYMBOL_COLORS \u4E0E Logo \u54C1\u724C\u914D\u8272\u4FDD\u6301\u4E00\u81F4\n const color = isUnresolved\n ? SYMBOL_COLORS.running\n : isError\n ? SYMBOL_COLORS.error\n : SYMBOL_COLORS.success\n\n return (\n <Box minWidth={2}>\n <Text color={color}>{isVisible ? BLACK_CIRCLE : ' '}</Text>\n </Box>\n )\n}\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,KAAK,YAAY;AAC1B,OAAO,WAAW;AAClB,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAC7B,SAAS,qBAAqB;AAQvB,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AACF,GAA2B;AACzB,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,IAAI;AAErD,cAAY,MAAM;AAChB,QAAI,CAAC,eAAe;AAClB;AAAA,IACF;AAGA,iBAAa,OAAK,CAAC,CAAC;AAAA,EACtB,GAAG,GAAG;AAGN,QAAM,QAAQ,eACV,cAAc,UACd,UACE,cAAc,QACd,cAAc;AAEpB,SACE,oCAAC,OAAI,UAAU,KACb,oCAAC,QAAK,SAAe,YAAY,eAAe,IAAK,CACvD;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,22 +1,23 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { Box, Text } from "ink";
|
|
3
3
|
import { SYMBOLS } from "../constants/symbols.js";
|
|
4
|
+
import { SEMANTIC_COLORS } from "../constants/colors.js";
|
|
4
5
|
function TreeConnector({
|
|
5
6
|
isLast,
|
|
6
7
|
variant = "default"
|
|
7
8
|
}) {
|
|
8
9
|
const branch = isLast ? `${SYMBOLS.TREE_LAST} ` : `${SYMBOLS.TREE_BRANCH} `;
|
|
9
10
|
if (variant === "compact") {
|
|
10
|
-
return /* @__PURE__ */ React.createElement(Text, {
|
|
11
|
+
return /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, isLast ? "\u2514 " : "\u251C ");
|
|
11
12
|
}
|
|
12
|
-
return /* @__PURE__ */ React.createElement(Box, { minWidth: 3 }, /* @__PURE__ */ React.createElement(Text, {
|
|
13
|
+
return /* @__PURE__ */ React.createElement(Box, { minWidth: 3 }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, branch));
|
|
13
14
|
}
|
|
14
15
|
function TreeContinuation({
|
|
15
16
|
parentIsLast,
|
|
16
17
|
width = 3
|
|
17
18
|
}) {
|
|
18
19
|
const line = parentIsLast ? `${SYMBOLS.TREE_SPACE} ` : `${SYMBOLS.TREE_VERTICAL} `;
|
|
19
|
-
return /* @__PURE__ */ React.createElement(Box, { minWidth: width }, /* @__PURE__ */ React.createElement(Text, {
|
|
20
|
+
return /* @__PURE__ */ React.createElement(Box, { minWidth: width }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, line));
|
|
20
21
|
}
|
|
21
22
|
export {
|
|
22
23
|
TreeConnector,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/components/TreeConnector.tsx"],
|
|
4
|
-
"sourcesContent": ["/**\n * Tree Connector Component\n *\n * Renders tree-style connection lines for hierarchical display.\n * Uses REPL \u663E\u793A\u89C4\u8303\u5B9A\u4E49\u7684\u7ED3\u6784\u7B26\u53F7\n */\n\nimport React from 'react'\nimport { Box, Text } from 'ink'\nimport { SYMBOLS } from '@constants/symbols'\n\ninterface Props {\n /** Whether this is the last child in the parent */\n isLast: boolean\n /** Connector style variant */\n variant?: 'default' | 'compact'\n}\n\nexport function TreeConnector({\n isLast,\n variant = 'default',\n}: Props): React.ReactNode {\n // \u4F7F\u7528 REPL \u89C4\u8303\u5B9A\u4E49\u7684\u7ED3\u6784\u7B26\u53F7\n const branch = isLast ? `${SYMBOLS.TREE_LAST} ` : `${SYMBOLS.TREE_BRANCH} `\n\n if (variant === 'compact') {\n return <Text
|
|
5
|
-
"mappings": "AAOA,OAAO,WAAW;AAClB,SAAS,KAAK,YAAY;AAC1B,SAAS,eAAe;
|
|
4
|
+
"sourcesContent": ["/**\n * Tree Connector Component\n *\n * Renders tree-style connection lines for hierarchical display.\n * Uses REPL \u663E\u793A\u89C4\u8303\u5B9A\u4E49\u7684\u7ED3\u6784\u7B26\u53F7\n */\n\nimport React from 'react'\nimport { Box, Text } from 'ink'\nimport { SYMBOLS } from '@constants/symbols'\nimport { SEMANTIC_COLORS } from '@constants/colors'\n\ninterface Props {\n /** Whether this is the last child in the parent */\n isLast: boolean\n /** Connector style variant */\n variant?: 'default' | 'compact'\n}\n\nexport function TreeConnector({\n isLast,\n variant = 'default',\n}: Props): React.ReactNode {\n // \u4F7F\u7528 REPL \u89C4\u8303\u5B9A\u4E49\u7684\u7ED3\u6784\u7B26\u53F7\n const branch = isLast ? `${SYMBOLS.TREE_LAST} ` : `${SYMBOLS.TREE_BRANCH} `\n\n if (variant === 'compact') {\n return <Text color={SEMANTIC_COLORS.dim}>{isLast ? '\u2514 ' : '\u251C '}</Text>\n }\n\n return (\n <Box minWidth={3}>\n <Text color={SEMANTIC_COLORS.dim}>{branch}</Text>\n </Box>\n )\n}\n\n/**\n * Continuation line for nested content under a tree item\n * \u4F7F\u7528 REPL \u89C4\u8303\u5B9A\u4E49\u7684\u5782\u76F4\u8FDE\u63A5\u7B26\u53F7\n */\ninterface ContinuationProps {\n /** Whether parent was the last child */\n parentIsLast: boolean\n /** Width of the continuation line area */\n width?: number\n}\n\nexport function TreeContinuation({\n parentIsLast,\n width = 3,\n}: ContinuationProps): React.ReactNode {\n // \u6700\u540E\u4E00\u9879\u540E\u4F7F\u7528\u7A7A\u767D\uFF0C\u975E\u6700\u540E\u9879\u4F7F\u7528\u5782\u76F4\u7EBF\n const line = parentIsLast\n ? `${SYMBOLS.TREE_SPACE} `\n : `${SYMBOLS.TREE_VERTICAL} `\n\n return (\n <Box minWidth={width}>\n <Text color={SEMANTIC_COLORS.dim}>{line}</Text>\n </Box>\n )\n}\n"],
|
|
5
|
+
"mappings": "AAOA,OAAO,WAAW;AAClB,SAAS,KAAK,YAAY;AAC1B,SAAS,eAAe;AACxB,SAAS,uBAAuB;AASzB,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA,UAAU;AACZ,GAA2B;AAEzB,QAAM,SAAS,SAAS,GAAG,QAAQ,SAAS,MAAM,GAAG,QAAQ,WAAW;AAExE,MAAI,YAAY,WAAW;AACzB,WAAO,oCAAC,QAAK,OAAO,gBAAgB,OAAM,SAAS,YAAO,SAAK;AAAA,EACjE;AAEA,SACE,oCAAC,OAAI,UAAU,KACb,oCAAC,QAAK,OAAO,gBAAgB,OAAM,MAAO,CAC5C;AAEJ;AAaO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA,QAAQ;AACV,GAAuC;AAErC,QAAM,OAAO,eACT,GAAG,QAAQ,UAAU,MACrB,GAAG,QAAQ,aAAa;AAE5B,SACE,oCAAC,OAAI,UAAU,SACb,oCAAC,QAAK,OAAO,gBAAgB,OAAM,IAAK,CAC1C;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -10,6 +10,7 @@ import { PRODUCT_NAME } from "../constants/product.js";
|
|
|
10
10
|
import { useExitOnCtrlCD } from "../hooks/useExitOnCtrlCD.js";
|
|
11
11
|
import { homedir } from "os";
|
|
12
12
|
import { getCwd } from "../utils/state.js";
|
|
13
|
+
import { SEMANTIC_COLORS } from "../constants/colors.js";
|
|
13
14
|
function TrustDialog({ onDone }) {
|
|
14
15
|
const theme = getTheme();
|
|
15
16
|
React.useEffect(() => {
|
|
@@ -63,7 +64,7 @@ function TrustDialog({ onDone }) {
|
|
|
63
64
|
onChange: (value) => onChange(value)
|
|
64
65
|
}
|
|
65
66
|
)
|
|
66
|
-
), /* @__PURE__ */ React.createElement(Box, { marginLeft: 3 }, /* @__PURE__ */ React.createElement(Text, {
|
|
67
|
+
), /* @__PURE__ */ React.createElement(Box, { marginLeft: 3 }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, exitState.pending ? /* @__PURE__ */ React.createElement(React.Fragment, null, "Press ", exitState.keyName, " again to exit") : /* @__PURE__ */ React.createElement(React.Fragment, null, "Enter to confirm \xB7 Esc to exit"))));
|
|
67
68
|
}
|
|
68
69
|
export {
|
|
69
70
|
TrustDialog
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/components/TrustDialog.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from 'react'\nimport { Box, Text, useInput } from 'ink'\nimport { getTheme } from '@utils/theme'\nimport { Select } from './CustomSelect/select'\nimport {\n saveCurrentProjectConfig,\n getCurrentProjectConfig,\n} from '@utils/config'\nimport { PRODUCT_NAME } from '@constants/product'\nimport { useExitOnCtrlCD } from '@hooks/useExitOnCtrlCD'\nimport { homedir } from 'os'\nimport { getCwd } from '@utils/state'\nimport Link from './Link'\n\ntype Props = {\n onDone(): void\n}\n\nexport function TrustDialog({ onDone }: Props): React.ReactNode {\n const theme = getTheme()\n React.useEffect(() => {}, [])\n\n function onChange(value: 'yes' | 'no') {\n const config = getCurrentProjectConfig()\n switch (value) {\n case 'yes': {\n const isHomeDir = homedir() === getCwd()\n\n if (!isHomeDir) {\n saveCurrentProjectConfig({\n ...config,\n hasTrustDialogAccepted: true,\n })\n }\n onDone()\n break\n }\n case 'no': {\n process.exit(1)\n break\n }\n }\n }\n\n const exitState = useExitOnCtrlCD(() => process.exit(0))\n\n useInput((_input, key) => {\n if (key.escape) {\n process.exit(0)\n return\n }\n })\n\n return (\n <>\n <Box\n flexDirection=\"column\"\n gap={1}\n padding={1}\n borderStyle=\"round\"\n borderColor={theme.warning}\n >\n <Text bold color={theme.warning}>\n Do you trust the files in this folder?\n </Text>\n <Text bold>{process.cwd()}</Text>\n\n <Box flexDirection=\"column\" gap={1}>\n <Text>\n {PRODUCT_NAME} may read files in this folder. Reading untrusted\n files may lead to {PRODUCT_NAME} to behave in an unexpected ways.\n </Text>\n <Text>\n With your permission {PRODUCT_NAME} may execute files in this\n folder. Executing untrusted code is unsafe.\n </Text>\n </Box>\n\n <Select\n options={[\n { label: 'Yes, proceed', value: 'yes' },\n { label: 'No, exit', value: 'no' },\n ]}\n onChange={value => onChange(value as 'yes' | 'no')}\n />\n </Box>\n <Box marginLeft={3}>\n <Text
|
|
5
|
-
"mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,KAAK,MAAM,gBAAgB;AACpC,SAAS,gBAAgB;AACzB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,SAAS,eAAe;AACxB,SAAS,cAAc;
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { Box, Text, useInput } from 'ink'\nimport { getTheme } from '@utils/theme'\nimport { Select } from './CustomSelect/select'\nimport {\n saveCurrentProjectConfig,\n getCurrentProjectConfig,\n} from '@utils/config'\nimport { PRODUCT_NAME } from '@constants/product'\nimport { useExitOnCtrlCD } from '@hooks/useExitOnCtrlCD'\nimport { homedir } from 'os'\nimport { getCwd } from '@utils/state'\nimport Link from './Link'\nimport { SEMANTIC_COLORS } from '@constants/colors'\n\ntype Props = {\n onDone(): void\n}\n\nexport function TrustDialog({ onDone }: Props): React.ReactNode {\n const theme = getTheme()\n React.useEffect(() => {}, [])\n\n function onChange(value: 'yes' | 'no') {\n const config = getCurrentProjectConfig()\n switch (value) {\n case 'yes': {\n const isHomeDir = homedir() === getCwd()\n\n if (!isHomeDir) {\n saveCurrentProjectConfig({\n ...config,\n hasTrustDialogAccepted: true,\n })\n }\n onDone()\n break\n }\n case 'no': {\n process.exit(1)\n break\n }\n }\n }\n\n const exitState = useExitOnCtrlCD(() => process.exit(0))\n\n useInput((_input, key) => {\n if (key.escape) {\n process.exit(0)\n return\n }\n })\n\n return (\n <>\n <Box\n flexDirection=\"column\"\n gap={1}\n padding={1}\n borderStyle=\"round\"\n borderColor={theme.warning}\n >\n <Text bold color={theme.warning}>\n Do you trust the files in this folder?\n </Text>\n <Text bold>{process.cwd()}</Text>\n\n <Box flexDirection=\"column\" gap={1}>\n <Text>\n {PRODUCT_NAME} may read files in this folder. Reading untrusted\n files may lead to {PRODUCT_NAME} to behave in an unexpected ways.\n </Text>\n <Text>\n With your permission {PRODUCT_NAME} may execute files in this\n folder. Executing untrusted code is unsafe.\n </Text>\n </Box>\n\n <Select\n options={[\n { label: 'Yes, proceed', value: 'yes' },\n { label: 'No, exit', value: 'no' },\n ]}\n onChange={value => onChange(value as 'yes' | 'no')}\n />\n </Box>\n <Box marginLeft={3}>\n <Text color={SEMANTIC_COLORS.dim}>\n {exitState.pending ? (\n <>Press {exitState.keyName} again to exit</>\n ) : (\n <>Enter to confirm \u00B7 Esc to exit</>\n )}\n </Text>\n </Box>\n </>\n )\n}\n"],
|
|
5
|
+
"mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,KAAK,MAAM,gBAAgB;AACpC,SAAS,gBAAgB;AACzB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,SAAS,eAAe;AACxB,SAAS,cAAc;AAEvB,SAAS,uBAAuB;AAMzB,SAAS,YAAY,EAAE,OAAO,GAA2B;AAC9D,QAAM,QAAQ,SAAS;AACvB,QAAM,UAAU,MAAM;AAAA,EAAC,GAAG,CAAC,CAAC;AAE5B,WAAS,SAAS,OAAqB;AACrC,UAAM,SAAS,wBAAwB;AACvC,YAAQ,OAAO;AAAA,MACb,KAAK,OAAO;AACV,cAAM,YAAY,QAAQ,MAAM,OAAO;AAEvC,YAAI,CAAC,WAAW;AACd,mCAAyB;AAAA,YACvB,GAAG;AAAA,YACH,wBAAwB;AAAA,UAC1B,CAAC;AAAA,QACH;AACA,eAAO;AACP;AAAA,MACF;AAAA,MACA,KAAK,MAAM;AACT,gBAAQ,KAAK,CAAC;AACd;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,QAAM,YAAY,gBAAgB,MAAM,QAAQ,KAAK,CAAC,CAAC;AAEvD,WAAS,CAAC,QAAQ,QAAQ;AACxB,QAAI,IAAI,QAAQ;AACd,cAAQ,KAAK,CAAC;AACd;AAAA,IACF;AAAA,EACF,CAAC;AAED,SACE,0DACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAc;AAAA,MACd,KAAK;AAAA,MACL,SAAS;AAAA,MACT,aAAY;AAAA,MACZ,aAAa,MAAM;AAAA;AAAA,IAEnB,oCAAC,QAAK,MAAI,MAAC,OAAO,MAAM,WAAS,wCAEjC;AAAA,IACA,oCAAC,QAAK,MAAI,QAAE,QAAQ,IAAI,CAAE;AAAA,IAE1B,oCAAC,OAAI,eAAc,UAAS,KAAK,KAC/B,oCAAC,YACE,cAAa,wEACK,cAAa,mCAClC,GACA,oCAAC,YAAK,yBACkB,cAAa,wEAErC,CACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,SAAS;AAAA,UACP,EAAE,OAAO,gBAAgB,OAAO,MAAM;AAAA,UACtC,EAAE,OAAO,YAAY,OAAO,KAAK;AAAA,QACnC;AAAA,QACA,UAAU,WAAS,SAAS,KAAqB;AAAA;AAAA,IACnD;AAAA,EACF,GACA,oCAAC,OAAI,YAAY,KACf,oCAAC,QAAK,OAAO,gBAAgB,OAC1B,UAAU,UACT,0DAAE,UAAO,UAAU,SAAQ,gBAAc,IAEzC,0DAAE,mCAA8B,CAEpC,CACF,CACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -7,6 +7,7 @@ import { Select } from "../CustomSelect/select.js";
|
|
|
7
7
|
import { BinaryFeedbackOption } from "./BinaryFeedbackOption.js";
|
|
8
8
|
import { useExitOnCtrlCD } from "../../hooks/useExitOnCtrlCD.js";
|
|
9
9
|
import { PRODUCT_NAME } from "../../constants/product.js";
|
|
10
|
+
import { SEMANTIC_COLORS } from "../../constants/colors.js";
|
|
10
11
|
const HELP_URL = "https://go/cli-feedback";
|
|
11
12
|
function getOptions() {
|
|
12
13
|
return [
|
|
@@ -127,7 +128,7 @@ function BinaryFeedbackView({
|
|
|
127
128
|
onChange: onChoose
|
|
128
129
|
}
|
|
129
130
|
))
|
|
130
|
-
), exitState.pending ? /* @__PURE__ */ React.createElement(Box, { marginLeft: 3 }, /* @__PURE__ */ React.createElement(Text, {
|
|
131
|
+
), exitState.pending ? /* @__PURE__ */ React.createElement(Box, { marginLeft: 3 }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "Press ", exitState.keyName, " again to exit")) : (
|
|
131
132
|
// Render a blank line so that the UI doesn't reflow when the exit message is shown
|
|
132
133
|
/* @__PURE__ */ React.createElement(Text, null, " ")
|
|
133
134
|
));
|