styles-update

dist/ChatInterface/ChatInterface.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const ChatInterface: React.FC;
+export default ChatInterface;

dist/ChatInterface/ChatInterface.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import Message from '../Message';
+import Input from '../Input';
+import Button from '../Button';
+export const ChatInterface = () => {
+    const [message, setMessage] = useState('');
+    const [messages, setMessages] = useState([
+        { id: 1, text: '¡Hola! ¿En qué puedo ayudarte?', isOwn: false, timestamp: '10:00' },
+        { id: 2, text: 'Me gustaría información sobre mis inversiones', isOwn: true, timestamp: '10:01' },
+    ]);
+    const sendMessage = () => {
+        if (message.trim()) {
+            setMessages([
+                ...messages,
+                {
+                    id: messages.length + 1,
+                    text: message,
+                    isOwn: true,
+                    timestamp: new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })
+                }
+            ]);
+            setMessage('');
+        }
+    };
+    return (_jsxs("div", { className: "flex flex-col h-full bg-maya-background rounded-lg border border-gray-200", children: [_jsx("div", { className: "bg-white px-4 py-3 border-b border-gray-200 rounded-t-lg", children: _jsxs("div", { className: "flex items-center space-x-3", children: [_jsx("div", { className: "w-3 h-3 bg-maya-primary rounded-full" }), _jsx("h3", { className: "font-semibold text-gray-800", children: "Soporte Banorte" }), _jsx("div", { className: "w-2 h-2 bg-maya-success rounded-full" })] }) }), _jsx("div", { className: "flex-1 p-4 overflow-y-auto", children: messages.map((msg) => (_jsx(Message, { text: msg.text, isOwn: msg.isOwn, timestamp: msg.timestamp }, msg.id))) }), _jsx("div", { className: "bg-white p-4 border-t border-gray-200 rounded-b-lg", children: _jsxs("div", { className: "flex space-x-2", children: [_jsx(Input, { value: message, onChange: (e) => setMessage(e.target.value), placeholder: "Escribe tu mensaje...", className: "flex-1", onKeyPress: (e) => e.key === 'Enter' && sendMessage() }), _jsx(Button, { onClick: sendMessage, variant: "primary", children: "Enviar" })] }) })] }));
+};
+export default ChatInterface;

dist/ChatInterface/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './ChatInterface';
+export type { ChatInterface } from './ChatInterface';

dist/ChatInterface/index.js

@@ -0,0 +1 @@
+export { default } from './ChatInterface';