hotel-ai-widget
Version:
A customizable hotel chat widget for React and vanilla HTML
9 lines (8 loc) • 1.19 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Send } from "lucide-react";
export const ChatInput = ({ inputValue, setInputValue, isStreaming, handleSendMessage, handleKeyDown, textareaRef, }) => (_jsx("div", { className: "p-3", children: _jsxs("div", { className: "py-2 px-3 border-2 border-black rounded-2xl flex gap-1 w-full", children: [_jsx("form", { onSubmit: (e) => {
e.preventDefault();
handleSendMessage();
}, className: "w-full", children: _jsx("textarea", { ref: textareaRef, value: inputValue, onChange: (e) => setInputValue(e.target.value), onKeyDown: handleKeyDown, className: "w-full focus:outline-none placeholder:text-gray-400 resize-none min-h-[20px] max-h-[80px] overflow-y-auto text-xs", placeholder: "Ask about rooms, itineraries, images...", disabled: isStreaming, rows: 1 }) }), _jsx("div", { className: "flex justify-between items-center", children: _jsx(Send, { className: `w-4 h-4 text-gray-700 cursor-pointer ${isStreaming || !inputValue.trim()
? "opacity-50 pointer-events-none"
: ""}`, onClick: handleSendMessage }) })] }) }));