from nicegui import ui
from niceguiex.components import ChatInput


@ui.page('/')
async def main_page():
    ui.label('Chat Input Demo').classes('text-h4 mb-4')

    output = ui.column().classes('w-full p-4 bg-gray-100 rounded mb-4')

    async def handle_message(message: str):
        with output:
            ui.label(f'Sent: {message}').classes('mb-2')

    chat = ChatInput(
        placeholder='Type your message... (Enter to send, Shift+Enter for new line)',
        on_enter=handle_message
    ).classes('w-full')

    ui.label('Try typing a message and press Enter to send, or Shift+Enter to add a new line').classes('text-caption text-gray-600')


if __name__ in {"__main__", "__mp_main__"}:
    ui.run(
        title='Chat Input Demo',
        favicon='💬',
        show=False,
        dark=False,
        port=8082
    )