"use strict";
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Chat = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const box_1 = __importDefault(require("../box"));
const core_1 = require("../core");
const tag_1 = require("../tag");
const utils_1 = require("../utils");
const chat_types_1 = require("./chat.types");
const chatInput_1 = __importDefault(require("./chatInput"));
const chatMessage_1 = __importDefault(require("./chatMessage"));
/**
 * Displays a chat interface with messages and actions.
 */
exports.Chat = (0, core_1.vui)((props, ref) => {
    const _a = (0, core_1.omitThemingProps)(props), { className, children, inputStatus = chat_types_1.ChatInputStatus.Default, messages, helpText, maxTextareaHeight = 120, processingMessage, suggestions, onNewTopicClick, onSuggestionClick, onSend, onStop } = _a, rest = __rest(_a, ["className", "children", "inputStatus", "messages", "helpText", "maxTextareaHeight", "processingMessage", "suggestions", "onNewTopicClick", "onSuggestionClick", "onSend", "onStop"]);
    const styles = (0, core_1.useStyleConfig)('Chat', props);
    const messagesEndRef = (0, react_1.useRef)(null);
    const scrollDown = () => { var _a; return (_a = messagesEndRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: 'smooth' }); };
    (0, react_1.useEffect)(scrollDown, [messages, children]);
    return ((0, jsx_runtime_1.jsxs)(box_1.default, Object.assign({ className: (0, utils_1.cs)('vui-chat', className), ref: ref }, styles.chat, { h: "100%", justifyContent: "space-between" }, rest, { children: [(0, jsx_runtime_1.jsxs)(box_1.default, Object.assign({ className: (0, utils_1.cs)('vui-chat-messages') }, styles === null || styles === void 0 ? void 0 : styles.messages, { children: [(messages === null || messages === void 0 ? void 0 : messages.length) ? messages.map((message, key) => (0, jsx_runtime_1.jsx)(chatMessage_1.default, Object.assign({}, message), key)) : children, (0, jsx_runtime_1.jsx)("div", { ref: messagesEndRef })] })), (0, jsx_runtime_1.jsxs)(box_1.default, { column: true, children: [!!(suggestions === null || suggestions === void 0 ? void 0 : suggestions.length) && ((0, jsx_runtime_1.jsx)(box_1.default, Object.assign({ className: (0, utils_1.cs)('vui-chat-suggestions') }, styles === null || styles === void 0 ? void 0 : styles.suggestions, { mb: "24px", mt: "8px", children: suggestions === null || suggestions === void 0 ? void 0 : suggestions.map(suggestion => ((0, jsx_runtime_1.jsx)(tag_1.Tag, { cursor: inputStatus === chat_types_1.ChatInputStatus.Default ? 'pointer' : undefined, disabled: inputStatus !== chat_types_1.ChatInputStatus.Default, mb: "6px", ml: "6px", onClick: () => onSuggestionClick === null || onSuggestionClick === void 0 ? void 0 : onSuggestionClick(suggestion), children: suggestion }, suggestion))) }))), (0, jsx_runtime_1.jsx)(chatInput_1.default, { helpText: helpText, maxTextareaHeight: maxTextareaHeight, onNewTopicClick: onNewTopicClick, onSend: onSend, onStop: onStop, processingMessage: processingMessage, status: inputStatus })] })] })));
});
exports.Chat.Message = chatMessage_1.default;
exports.Chat.Input = chatInput_1.default;
exports.Chat.displayName = 'Chat';
exports.default = exports.Chat;
//# sourceMappingURL=chat.js.map