@shareai-lab/kode 1.0.71 → 1.0.73

package/src/components/ModelStatusDisplay.tsx

@@ -185,7 +185,7 @@ export function ModelStatusDisplay({ onClose }: Props): React.ReactNode {
         </Text>
         <Text color={theme.secondaryText}>
           {' '}
-          DefaultModelId: {config.defaultModelId || 'not set'}
+          DefaultModelId: {(config as any).defaultModelId || 'not set'}
         </Text>
         {config.modelPointers && (
           <>
@@ -195,10 +195,12 @@ export function ModelStatusDisplay({ onClose }: Props): React.ReactNode {
               {Object.keys(config.modelPointers).length > 0 ? 'Yes' : 'No'}
             </Text>
             {Object.entries(config.modelPointers).map(([pointer, modelId]) => (
-              <Text key={pointer} color={theme.secondaryText}>
-                {' '}
-                {pointer}: {modelId || 'not set'}
-              </Text>
+              <React.Fragment key={pointer}>
+                <Text color={theme.secondaryText}>
+                  {' '}
+                  {pointer}: {modelId || 'not set'}
+                </Text>
+              </React.Fragment>
             ))}
           </>
         )}

package/src/components/PromptInput.tsx

@@ -5,7 +5,7 @@ import * as React from 'react'
 import { type Message } from '../query'
 import { processUserInput } from '../utils/messages'
 import { useArrowKeyHistory } from '../hooks/useArrowKeyHistory'
-import { useSlashCommandTypeahead } from '../hooks/useSlashCommandTypeahead'
+import { useUnifiedCompletion } from '../hooks/useUnifiedCompletion'
 import { addToHistory } from '../history'
 import TextInput from './TextInput'
 import { memo, useCallback, useEffect, useMemo, useState } from 'react'
@@ -96,7 +96,6 @@ type Props = {
   ) => void
   readFileTimestamps: { [filename: string]: number }
   abortController: AbortController | null
-  setAbortController: (abortController: AbortController | null) => void
   onModelChange?: () => void
 }
 
@@ -166,19 +165,53 @@ function PromptInput({
     [commands],
   )
 
+  // Unified completion system - one hook to rule them all (now with terminal behavior)
   const {
     suggestions,
-    selectedSuggestion,
-    updateSuggestions,
-    clearSuggestions,
-  } = useSlashCommandTypeahead({
-    commands,
+    selectedIndex,
+    isActive: completionActive,
+    emptyDirMessage,
+  } = useUnifiedCompletion({
+    input,
+    cursorOffset,
     onInputChange,
-    onSubmit,
     setCursorOffset,
-    currentInput: input,
+    commands,
+    onSubmit,
   })
 
+  // Get theme early for memoized rendering
+  const theme = getTheme()
+
+  // Memoized completion suggestions rendering - after useUnifiedCompletion
+  const renderedSuggestions = useMemo(() => {
+    if (suggestions.length === 0) return null
+
+    return suggestions.map((suggestion, index) => {
+      const isSelected = index === selectedIndex
+      const isAgent = suggestion.type === 'agent'
+      
+      // Simple color logic without complex lookups
+      const displayColor = isSelected 
+        ? theme.suggestion 
+        : (isAgent && suggestion.metadata?.color)
+          ? suggestion.metadata.color
+          : undefined
+      
+      return (
+        <Box key={`${suggestion.type}-${suggestion.value}-${index}`} flexDirection="row">
+          <Text
+            color={displayColor}
+            dimColor={!isSelected && !displayColor}
+          >
+            {isSelected ? '◆ ' : '  '}
+            {suggestion.displayValue}
+          </Text>
+        </Box>
+      )
+    })
+  }, [suggestions, selectedIndex, theme.suggestion])
+
   const onChange = useCallback(
     (value: string) => {
       if (value.startsWith('!')) {
@@ -189,10 +222,9 @@ function PromptInput({
         onModeChange('koding')
         return
       }
-      updateSuggestions(value)
       onInputChange(value)
     },
-    [onModeChange, onInputChange, updateSuggestions],
+    [onModeChange, onInputChange],
   )
 
   // Handle Tab key model switching with simple context check
@@ -238,15 +270,15 @@ function PromptInput({
     input,
   )
 
-  // Only use history navigation when there are 0 or 1 slash command suggestions
+  // Only use history navigation when there are no suggestions
   const handleHistoryUp = () => {
-    if (suggestions.length <= 1) {
+    if (!completionActive) {
       onHistoryUp()
     }
   }
 
   const handleHistoryDown = () => {
-    if (suggestions.length <= 1) {
+    if (!completionActive) {
       onHistoryDown()
     }
   }
@@ -270,7 +302,7 @@ function PromptInput({
 
         // Create additional context to inform Claude this is for KODING.md
         const kodingContext =
-          'The user is using Koding mode. Format your response as a comprehensive, well-structured document suitable for adding to KODE.md. Use proper markdown formatting with headings, lists, code blocks, etc. The response should be complete and ready to add to KODE.md documentation.'
+          'The user is using Koding mode. Format your response as a comprehensive, well-structured document suitable for adding to AGENTS.md. Use proper markdown formatting with headings, lists, code blocks, etc. The response should be complete and ready to add to AGENTS.md documentation.'
 
         // Switch to prompt mode but tag the submission for later capture
         onModeChange('prompt')
@@ -326,7 +358,7 @@ function PromptInput({
       }
     }
 
-    // If in koding mode or input starts with '#', interpret it using AI before appending to KODE.md
+    // If in koding mode or input starts with '#', interpret it using AI before appending to AGENTS.md
     else if (mode === 'koding' || input.startsWith('#')) {
       try {
         // Strip the # if we're in koding mode and the user didn't type it (since it's implied)
@@ -354,7 +386,12 @@ function PromptInput({
     if (isLoading) {
       return
     }
-    if (suggestions.length > 0 && !isSubmittingSlashCommand) {
+    
+    // Handle Enter key when completions are active
+    // If there are suggestions showing, Enter should complete the selection, not send the message
+    if (suggestions.length > 0 && completionActive) {
+      // The completion is handled by useUnifiedCompletion hook
+      // Just return to prevent message sending
       return
     }
 
@@ -373,7 +410,7 @@ function PromptInput({
     }
     onInputChange('')
     onModeChange('prompt')
-    clearSuggestions()
+    // Suggestions are now handled by unified completion
     setPastedImage(null)
     setPastedText(null)
     onSubmitCountChange(_ => _ + 1)
@@ -446,8 +483,29 @@ function PromptInput({
     setPastedText(text)
   }
 
-  useInput((input, key) => {
-    if (input === '' && (key.escape || key.backspace || key.delete)) {
+  useInput((inputChar, key) => {
+    // For bash mode, only exit when deleting the last character (which would be the '!' character)
+    if (mode === 'bash' && (key.backspace || key.delete)) {
+      // Check the current input state, not the inputChar parameter
+      // If current input is empty, we're about to delete the '!' character, so exit bash mode
+      if (input === '') {
+        onModeChange('prompt')
+      }
+      return
+    }
+    
+    // For koding mode, only exit when deleting the last character (which would be the '#' character)
+    if (mode === 'koding' && (key.backspace || key.delete)) {
+      // Check the current input state, not the inputChar parameter
+      // If current input is empty, we're about to delete the '#' character, so exit koding mode
+      if (input === '') {
+        onModeChange('prompt')
+      }
+      return
+    }
+    
+    // For other modes, keep the original behavior
+    if (inputChar === '' && (key.escape || key.backspace || key.delete)) {
       onModeChange('prompt')
     }
     // esc is a little overloaded:
@@ -464,22 +522,15 @@ function PromptInput({
       return true // Explicitly handled
     }
 
-    // Tab key for model switching (simple and non-conflicting)
-    if (key.tab && !key.shift) {
-      handleQuickModelSwitch()
-      return true // Explicitly handled
-    }
-
     return false // Not handled, allow other hooks
   })
 
   const textInputColumns = useTerminalSize().columns - 6
   const tokenUsage = useMemo(() => countTokens(messages), [messages])
-  const theme = getTheme()
 
   // 🔧 Fix: Track model ID changes to detect external config updates
   const modelManager = getModelManager()
-  const currentModelId = modelManager.getModel('main')?.id || null
+  const currentModelId = (modelManager.getModel('main') as any)?.id || null
 
   const modelInfo = useMemo(() => {
     // Force fresh ModelManager instance to detect config changes
@@ -491,7 +542,7 @@ function PromptInput({
 
     return {
       name: currentModel.modelName, // 🔧 Fix: Use actual model name, not display name
-      id: currentModel.id, // 添加模型ID用于调试
+      id: (currentModel as any).id, // 添加模型ID用于调试
       provider: currentModel.provider, // 添加提供商信息
       contextLength: currentModel.contextLength,
       currentTokens: tokenUsage,
@@ -559,14 +610,22 @@ function PromptInput({
             onImagePaste={onImagePaste}
             columns={textInputColumns}
             isDimmed={isDisabled || isLoading}
-            disableCursorMovementForUpDownKeys={suggestions.length > 0}
+            disableCursorMovementForUpDownKeys={completionActive}
             cursorOffset={cursorOffset}
             onChangeCursorOffset={setCursorOffset}
             onPaste={onTextPaste}
+            onSpecialKey={(input, key) => {
+              // Handle Shift+M for model switching
+              if (key.shift && (input === 'M' || input === 'm')) {
+                handleQuickModelSwitch()
+                return true // Prevent the 'M' from being typed
+              }
+              return false
+            }}
           />
         </Box>
       </Box>
-      {suggestions.length === 0 && (
+      {!completionActive && suggestions.length === 0 && (
         <Box
           flexDirection="row"
           justifyContent="space-between"
@@ -592,15 +651,15 @@ function PromptInput({
                   color={mode === 'koding' ? theme.koding : undefined}
                   dimColor={mode !== 'koding'}
                 >
-                  · # for KODE.md
+                  · # for AGENTS.md
                 </Text>
                 <Text dimColor>
-                  · / for commands · tab to switch model · esc to undo
+                  · / for commands · shift+m to switch model · esc to undo
                 </Text>
               </>
             )}
           </Box>
-          <SentryErrorBoundary>
+          <SentryErrorBoundary children={
             <Box justifyContent="flex-end" gap={1}>
               {!autoUpdaterResult &&
                 !isAutoUpdating &&
@@ -622,9 +681,10 @@ function PromptInput({
                 onChangeIsUpdating={setIsAutoUpdating}
               /> */}
             </Box>
-          </SentryErrorBoundary>
+          } />
         </Box>
       )}
+      {/* Unified completion suggestions - optimized rendering */}
       {suggestions.length > 0 && (
         <Box
           flexDirection="row"
@@ -633,58 +693,28 @@ function PromptInput({
           paddingY={0}
         >
           <Box flexDirection="column">
-            {suggestions.map((suggestion, index) => {
-              const command = commands.find(
-                cmd => cmd.userFacingName() === suggestion.replace('/', ''),
-              )
-              return (
-                <Box
-                  key={suggestion}
-                  flexDirection={columns < 80 ? 'column' : 'row'}
-                >
-                  <Box width={columns < 80 ? undefined : commandWidth}>
-                    <Text
-                      color={
-                        index === selectedSuggestion
-                          ? theme.suggestion
-                          : undefined
-                      }
-                      dimColor={index !== selectedSuggestion}
-                    >
-                      /{suggestion}
-                      {command?.aliases && command.aliases.length > 0 && (
-                        <Text dimColor> ({command.aliases.join(', ')})</Text>
-                      )}
-                    </Text>
-                  </Box>
-                  {command && (
-                    <Box
-                      width={columns - (columns < 80 ? 4 : commandWidth + 4)}
-                      paddingLeft={columns < 80 ? 4 : 0}
-                    >
-                      <Text
-                        color={
-                          index === selectedSuggestion
-                            ? theme.suggestion
-                            : undefined
-                        }
-                        dimColor={index !== selectedSuggestion}
-                        wrap="wrap"
-                      >
-                        <Text dimColor={index !== selectedSuggestion}>
-                          {command.description}
-                          {command.type === 'prompt' && command.argNames?.length
-                            ? ` (arguments: ${command.argNames.join(', ')})`
-                            : null}
-                        </Text>
-                      </Text>
-                    </Box>
-                  )}
-                </Box>
-              )
-            })}
+            {renderedSuggestions}
+            
+            {/* 简洁操作提示框 */}
+            <Box marginTop={1} paddingX={3} borderStyle="round" borderColor="gray">
+              <Text dimColor={!emptyDirMessage} color={emptyDirMessage ? "yellow" : undefined}>
+                {emptyDirMessage || (() => {
+                  const selected = suggestions[selectedIndex]
+                  if (!selected) {
+                    return '↑↓ navigate • → accept • Tab cycle • Esc close'
+                  }
+                  if (selected?.value.endsWith('/')) {
+                    return '→ enter directory • ↑↓ navigate • Tab cycle • Esc close'
+                  } else if (selected?.type === 'agent') {
+                    return '→ select agent • ↑↓ navigate • Tab cycle • Esc close'
+                  } else {
+                    return '→ insert reference • ↑↓ navigate • Tab cycle • Esc close'
+                  }
+                })()}
+              </Text>
+            </Box>
           </Box>
-          <SentryErrorBoundary>
+          <SentryErrorBoundary children={
             <Box justifyContent="flex-end" gap={1}>
               <TokenWarning tokenUsage={countTokens(messages)} />
               <AutoUpdater
@@ -695,7 +725,7 @@ function PromptInput({
                 onChangeIsUpdating={setIsAutoUpdating}
               />
             </Box>
-          </SentryErrorBoundary>
+          } />
         </Box>
       )}
     </Box>

package/src/components/SentryErrorBoundary.ts

@@ -12,7 +12,7 @@ interface State {
 export class SentryErrorBoundary extends React.Component<Props, State> {
   constructor(props: Props) {
     super(props)
-    this.state = { hasError: false }
+    ;(this as any).state = { hasError: false }
   }
 
   static getDerivedStateFromError(): State {
@@ -24,10 +24,10 @@ export class SentryErrorBoundary extends React.Component<Props, State> {
   }
 
   render(): React.ReactNode {
-    if (this.state.hasError) {
+    if ((this as any).state.hasError) {
       return null
     }
 
-    return this.props.children
+    return (this as any).props.children
   }
 }

package/src/components/StickerRequestForm.tsx

@@ -0,0 +1,16 @@
+import React from 'react'
+
+export interface FormData {
+  // Define form data structure as needed
+  [key: string]: any
+}
+
+export interface StickerRequestFormProps {
+  // Define props as needed
+  onSubmit?: (data: FormData) => void
+}
+
+export const StickerRequestForm: React.FC<StickerRequestFormProps> = () => {
+  // Minimal component implementation
+  return null
+}

package/src/components/StructuredDiff.tsx

@@ -10,6 +10,7 @@ type Props = {
   dim: boolean
   width: number
   overrideTheme?: ThemeNames // custom theme for previews
+  key?: React.Key
 }
 
 export function StructuredDiff({
@@ -66,43 +67,48 @@ function formatDiff(
       switch (type) {
         case 'add':
           return (
-            <Text key={key}>
-              <LineNumber
-                i={lineIndex === 0 ? i : undefined}
-                width={maxWidth}
-              />
-              <Text
-                color={overrideTheme ? theme.text : undefined}
-                backgroundColor={
-                  dim ? theme.diff.addedDimmed : theme.diff.added
-                }
-                dimColor={dim}
-              >
-                {line}
+            <React.Fragment key={key}>
+              <Text>
+                <LineNumber
+                  i={lineIndex === 0 ? i : undefined}
+                  width={maxWidth}
+                />
+                <Text
+                  color={overrideTheme ? theme.text : undefined}
+                  backgroundColor={
+                    dim ? theme.diff.addedDimmed : theme.diff.added
+                  }
+                  dimColor={dim}
+                >
+                  {line}
+                </Text>
               </Text>
-            </Text>
+            </React.Fragment>
           )
         case 'remove':
           return (
-            <Text key={key}>
-              <LineNumber
-                i={lineIndex === 0 ? i : undefined}
-                width={maxWidth}
-              />
-              <Text
-                color={overrideTheme ? theme.text : undefined}
-                backgroundColor={
-                  dim ? theme.diff.removedDimmed : theme.diff.removed
-                }
-                dimColor={dim}
-              >
-                {line}
+            <React.Fragment key={key}>
+              <Text>
+                <LineNumber
+                  i={lineIndex === 0 ? i : undefined}
+                  width={maxWidth}
+                />
+                <Text
+                  color={overrideTheme ? theme.text : undefined}
+                  backgroundColor={
+                    dim ? theme.diff.removedDimmed : theme.diff.removed
+                  }
+                  dimColor={dim}
+                >
+                  {line}
+                </Text>
               </Text>
-            </Text>
+            </React.Fragment>
           )
         case 'nochange':
           return (
-            <Text key={key}>
+            <React.Fragment key={key}>
+              <Text>
               <LineNumber
                 i={lineIndex === 0 ? i : undefined}
                 width={maxWidth}
@@ -114,6 +120,7 @@ function formatDiff(
                 {line}
               </Text>
             </Text>
+            </React.Fragment>
           )
       }
     })

package/src/components/TextInput.tsx

@@ -106,6 +106,12 @@ export type Props = {
    * Whether to disable cursor movement for up/down arrow keys
    */
   readonly disableCursorMovementForUpDownKeys?: boolean
+  
+  /**
+   * Optional callback to handle special key combinations before input processing
+   * Return true to prevent default handling
+   */
+  readonly onSpecialKey?: (input: string, key: Key) => boolean
 
   readonly cursorOffset: number
 
@@ -136,6 +142,7 @@ export default function TextInput({
   onPaste,
   isDimmed = false,
   disableCursorMovementForUpDownKeys = false,
+  onSpecialKey,
   cursorOffset,
   onChangeCursorOffset,
 }: Props) {
@@ -186,6 +193,12 @@ export default function TextInput({
   }
 
   const wrappedOnInput = (input: string, key: Key): void => {
+    // Check for special key combinations first
+    if (onSpecialKey && onSpecialKey(input, key)) {
+      // Special key was handled, don't process further
+      return
+    }
+    
     // Special handling for backspace or delete
     if (
       key.backspace ||

package/src/components/TodoItem.tsx

@@ -0,0 +1,11 @@
+import React from 'react'
+
+export interface TodoItemProps {
+  // Define props as needed
+  children?: React.ReactNode
+}
+
+export const TodoItem: React.FC<TodoItemProps> = ({ children }) => {
+  // Minimal component implementation  
+  return <>{children}</>
+}

package/src/components/TrustDialog.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Box, Text, useInput } from 'ink'
 import { getTheme } from '../utils/theme'
-import { Select } from '@inkjs/ui'
+import { Select } from './CustomSelect/select'
 import {
   saveCurrentProjectConfig,
   getCurrentProjectConfig,

package/src/components/messages/AssistantLocalCommandOutputMessage.tsx

@@ -20,7 +20,11 @@ export function AssistantLocalCommandOutputMessage({
   ].filter(Boolean)
 
   if (insides.length === 0) {
-    insides = [<Text key="0">(No output)</Text>]
+    insides = [
+      <React.Fragment key="0">
+        <Text>(No output)</Text>
+      </React.Fragment>
+    ]
   }
 
   return [

package/src/components/messages/AssistantToolUseMessage.tsx

@@ -9,6 +9,7 @@ import { getTheme } from '../../utils/theme'
 import { BLACK_CIRCLE } from '../../constants/figures'
 import { ThinkTool } from '../../tools/ThinkTool/ThinkTool'
 import { AssistantThinkingMessage } from './AssistantThinkingMessage'
+import { TaskToolMessage } from './TaskToolMessage'
 
 type Props = {
   param: ToolUseBlockParam
@@ -61,7 +62,7 @@ export function AssistantToolUseMessage({
     )
   }
 
-  const userFacingToolName = tool.userFacingName(param.input as never)
+  const userFacingToolName = tool.userFacingName ? tool.userFacingName(param.input) : tool.name
   return (
     <Box
       flexDirection="row"
@@ -86,9 +87,18 @@ export function AssistantToolUseMessage({
                 isError={erroredToolUseIDs.has(param.id)}
               />
             ))}
-          <Text color={color} bold={!isQueued}>
-            {userFacingToolName}
-          </Text>
+          {tool.name === 'Task' && param.input ? (
+            <TaskToolMessage
+              agentType={(param.input as any).subagent_type || 'general-purpose'}
+              bold={!isQueued}
+            >
+              {userFacingToolName}
+            </TaskToolMessage>
+          ) : (
+            <Text color={color} bold={!isQueued}>
+              {userFacingToolName}
+            </Text>
+          )}
         </Box>
         <Box flexWrap="nowrap">
           {Object.keys(param.input as { [key: string]: unknown }).length > 0 &&

package/src/components/messages/TaskProgressMessage.tsx

@@ -0,0 +1,32 @@
+import React from 'react'
+import { Box, Text } from 'ink'
+import { getTheme } from '../../utils/theme'
+
+interface Props {
+  agentType: string
+  status: string
+  toolCount?: number
+}
+
+export function TaskProgressMessage({ agentType, status, toolCount }: Props) {
+  const theme = getTheme()
+  
+  return (
+    <Box flexDirection="column" marginTop={1}>
+      <Box flexDirection="row">
+        <Text color={theme.claude}>⎯ </Text>
+        <Text color={theme.text} bold>
+          [{agentType}]
+        </Text>
+        <Text color={theme.secondaryText}> {status}</Text>
+      </Box>
+      {toolCount && toolCount > 0 && (
+        <Box marginLeft={3}>
+          <Text color={theme.secondaryText}>
+            Tools used: {toolCount}
+          </Text>
+        </Box>
+      )}
+    </Box>
+  )
+}