// 直接使用 Ink 的 TextInput 组件
import TextInput from '#ui-ink/components/TextInput'

<TextInput 
  value={input}
  onChange={onChange}
  // ... 各种 props
/>

// 实现自定义的 TextBuffer 管理输入状态
// 直接控制终端渲染，不依赖 Ink 的 TextInput

export class TextBuffer {
  private lines: string[] = ['']
  private cursorLine: number = 0
  private cursorCol: number = 0
  // ... 完全自主的状态管理
}

/**
 * TextBuffer 完全接管输入状态管理
 * - 多行编辑支持
 * - Unicode 字符正确处理（中文、emoji、组合字符）
 * - 精确的光标位置计算
 * - 独立于渲染层
 */
export class TextBuffer {
  // 使用 Code Points 而非字符串索引
  private toCodePoints(text: string): string[]
  
  // 处理 Unicode 脚本边界（中文、日文、韩文等）
  isDifferentScript(char1: string, char2: string): boolean
  
  // 支持组合字符（带音标的字母等）
  isCombiningMark(char: string): boolean
  
  // 精确的视觉宽度计算
  getCachedStringWidth(text: string): number
}

// PromptInput.tsx - 混合了太多职责
function PromptInput() {
  const [input, setInput] = useState('')
  const [cursorOffset, setCursorOffset] = useState(0)
  // ... 补全逻辑
  // ... 历史记录
  // ... 按键处理
  // ... 渲染逻辑
  
  return <TextInput /> // 所有逻辑耦合在一起
}

// InputPrompt.tsx - 只负责协调
export const InputPrompt = ({ buffer, ... }) => {
  // buffer 是独立的 TextBuffer 实例
  // 使用 hooks 管理各种功能
  const completion = useCommandCompletion(buffer, ...)
  const history = useInputHistory(buffer)
  const vim = useVimMode(buffer)
  
  // 渲染逻辑非常简单
  return (
    <Box>
      {renderInputLines(buffer)}
      {completion.suggestions && <SuggestionsDisplay />}
    </Box>
  )
}

// utils/input.ts
export const SGR_MOUSE_REGEX = /^\x1b\[<(\d+);(\d+);(\d+)([mM])/
export const X11_MOUSE_REGEX = /^\x1b\[M([\s\S]{3})/

// 检测鼠标事件
export function couldBeMouseSequence(buffer: string): boolean {
  // 支持 SGR 和 X11 两种鼠标协议
}

// hooks/useKittyKeyboardProtocol.ts
export function useKittyKeyboardProtocol() {
  useEffect(() => {
    // 启用 Kitty 协议
    process.stdout.write('\x1b[>1u')
    
    return () => {
      // 清理
      process.stdout.write('\x1b[<1u')
    }
  }, [])
}

// 检测连续快速输入（可能是 IME）
const timeSinceLastInput = now - lastInputTime
const isPossiblyIMEInput = timeSinceLastInput > 0 && timeSinceLastInput < 150

// 暂停自动补全
if (isPossiblyIMEInput && !completionActive) {
  return // 不触发补全
}

// 使用 Code Points 处理 Unicode
const chars = toCodePoints(line)
for (const char of chars) {
  // 正确处理每个 Unicode 字符
}

// 检测脚本边界（中文 vs 英文等）
if (isDifferentScript(currentChar, nextChar)) {
  // 单词边界
}

// 当前代码使用 Ink 的 useInput hook
import { useInput } from 'ink'

export default function TextInput({ value, onChange, ... }) {
  useInput((input, key) => {
    // Ink 的 useInput 有以下问题：
    // 1. 不能精确控制 IME 输入
    // 2. 中文字符宽度计算不准确
    // 3. 性能问题（每次按键都重渲染）
    // 4. 难以实现高级功能（vim 模式等）
  })
}

// 太多 state 在一个组件中
const [input, setInput] = useState('')
const [cursorOffset, setCursorOffset] = useState(0)
const [exitMessage, setExitMessage] = useState({})
const [message, setMessage] = useState({})
const [modelSwitchMessage, setModelSwitchMessage] = useState({})
// ... 还有更多

// 导致：
// - 每次按键都可能触发多次重渲染
// - 状态更新顺序难以控制
// - 难以调试和维护

// 当前使用字符索引作为 cursorOffset
const cursor = Cursor.fromText(originalValue, columns, offset)

// 问题：
// - offset 是字符串索引，不是视觉位置
// - 中文字符占 2 个视觉宽度，但索引只是 1
// - 导致光标显示位置错误

// packages/core/src/input/TextBuffer.ts

export class TextBuffer {
  private lines: string[] = ['']
  private cursorLine: number = 0
  private cursorCol: number = 0
  private selection: Selection | null = null
  
  // 核心 API
  getText(): string
  setText(text: string): void
  getCursorPosition(): [number, number]
  setCursorPosition(line: number, col: number): void
  
  // 编辑操作
  insertText(text: string): void
  deleteRange(start: Position, end: Position): void
  
  // 移动光标
  moveCursor(direction: Direction): void
  moveToWordBoundary(direction: 'start' | 'end'): void
  
  // Unicode 支持
  toCodePoints(text: string): string[]
  getVisualWidth(text: string): number
  
  // 历史记录
  undo(): void
  redo(): void
}

// apps/cli/src/ui/components/PromptInput/PromptInput.tsx

export function PromptInput() {
  // 使用 useTextBuffer hook 管理 TextBuffer 实例
  const buffer = useTextBuffer()
  
  // 各种功能通过 hooks 组合
  const completion = useCommandCompletion(buffer)
  const history = useInputHistory(buffer)
  const keyboard = useKeyboardHandler(buffer)
  
  // 渲染逻辑简化
  return (
    <Box>
      <InputDisplay buffer={buffer} />
      {completion.visible && (
        <CompletionPanel 
          suggestions={completion.suggestions}
          selectedIndex={completion.selectedIndex}
        />
      )}
    </Box>
  )
}

// 1. 使用 React.memo 减少重渲染
const InputDisplay = React.memo(({ buffer }) => {
  // 只在 buffer 实际改变时重渲染
}, (prev, next) => prev.buffer.version === next.buffer.version)

// 2. 实现细粒度更新
const CompletionPanel = React.memo(({ suggestions, selectedIndex }) => {
  // 只在建议列表或选中项改变时重渲染
})

// 3. 添加防抖/节流
const debouncedCompletion = useDebouncedCallback(
  () => updateCompletions(buffer),
  150 // 对中文输入友好
)

// Vim 模式
const useVimMode = (buffer: TextBuffer) => {
  const [mode, setMode] = useState<'normal' | 'insert'>('insert')
  // 实现 vim 按键映射
}

// 鼠标支持
const useMouse = (buffer: TextBuffer) => {
  // 处理鼠标点击、拖拽
  // 使用 SGR mouse protocol
}

// 语法高亮
const useSyntaxHighlight = (buffer: TextBuffer, language: string) => {
  // 实时语法高亮
  // 使用 highlight.js 或 shiki
}

describe('TextBuffer', () => {
  it('should handle Chinese input correctly', () => {
    const buffer = new TextBuffer()
    buffer.insertText('你好世界')
    expect(buffer.getText()).toBe('你好世界')
    expect(buffer.getCursorPosition()).toEqual([0, 4]) // 4 个字符
    expect(buffer.getVisualWidth()).toBe(8) // 8 个视觉宽度
  })
  
  it('should handle emoji correctly', () => {
    const buffer = new TextBuffer()
    buffer.insertText('Hello 👨‍👩‍👧‍👦 World')
    // 测试组合 emoji 的正确处理
  })
  
  it('should handle IME composition', () => {
    // 模拟 IME 输入序列
    // 验证不会触发过早的补全
  })
})

describe('InputPrompt', () => {
  it('should not show completion during Chinese input', async () => {
    // 模拟快速连续输入（< 150ms）
    // 验证补全面板不闪烁
  })
  
  it('should close completion when deleting trigger character', () => {
    // 输入 "/"
    // 验证补全面板打开
    // 删除 "/"
    // 验证补全面板关闭
  })
})

describe('Performance', () => {
  it('should handle 10000 character input', () => {
    const buffer = new TextBuffer()
    const start = Date.now()
    buffer.insertText('a'.repeat(10000))
    const end = Date.now()
    expect(end - start).toBeLessThan(100) // 应该 < 100ms
  })
  
  it('should not re-render on every keystroke', () => {
    let renderCount = 0
    // 使用 react-testing-library 计数渲染次数
    // 验证优化是否生效
  })
})

// 保留旧的 PromptInput
// 创建新的 PromptInputV2 使用 TextBuffer
// 通过环境变量切换
const PromptInput = process.env.USE_NEW_INPUT 
  ? PromptInputV2 
  : PromptInputV1

// 随机给用户分配新旧版本
// 收集性能数据和用户反馈

// 删除旧实现
// TextBuffer 成为唯一方案