import { MessageInput } from '../message-input'
import type { SendMessagePayload, TaskStatus } from '../types'

export interface ChatInputAreaProps {
  /** 输入框占位符 */
  placeholder?: string
  /** 是否禁用 */
  disabled?: boolean
  /** 任务状态 */
  taskStatus?: TaskStatus
  /** 发送消息回调 */
  onSend: (payload: SendMessagePayload) => void
  /** 是否有工件（决定是否显示面板切换按钮） */
  hasArtifacts: boolean
  /** 面板是否可见 */
  panelVisible: boolean
  /** 面板切换回调 */
  onPanelToggle: () => void
}

export function ChatInputArea({
  placeholder,
  disabled,
  taskStatus,
  onSend,
}: ChatInputAreaProps) {
  return (
    <div className="mt-2 shrink-0 px-6 pb-5">
      <div className="mx-auto flex items-end gap-3">
        <div className="flex-1">
          <MessageInput
            placeholder={placeholder}
            disabled={disabled}
            taskStatus={taskStatus}
            onSend={onSend}
          />
        </div>
      </div>
    </div>
  )
}