Chat

Overview

Chat component is a quick way to create a simple chat interface. Chat is part of Mesop Labs.

Examples

import random
import time

import mesop as me
import mesop.labs as mel


def on_load(e: me.LoadEvent):
  me.set_theme_mode("system")


@me.page(
  security_policy=me.SecurityPolicy(
    allowed_iframe_parents=["https://google.github.io"]
  ),
  path="/chat",
  title="Mesop Demo Chat",
  on_load=on_load,
)
def page():
  mel.chat(transform, title="Mesop Demo Chat", bot_user="Mesop Bot")


def transform(input: str, history: list[mel.ChatMessage]):
  for line in random.sample(LINES, random.randint(3, len(LINES) - 1)):
    time.sleep(0.3)
    yield line + " "


LINES = [
  "Mesop is a Python-based UI framework designed to simplify web UI development for engineers without frontend experience.",
  "It leverages the power of the Angular web framework and Angular Material components, allowing rapid construction of web demos and internal tools.",
  "With Mesop, developers can enjoy a fast build-edit-refresh loop thanks to its hot reload feature, making UI tweaks and component integration seamless.",
  "Deployment is straightforward, utilizing standard HTTP technologies.",
  "Mesop's component library aims for comprehensive Angular Material component coverage, enhancing UI flexibility and composability.",
  "It supports custom components for specific use cases, ensuring developers can extend its capabilities to fit their unique requirements.",
  "Mesop's roadmap includes expanding its component library and simplifying the onboarding processs.",
]

API

chat

Creates a simple chat UI which takes in a prompt and chat history and returns a response to the prompt.

This function creates event handlers for text input and output operations using the provided function transform to process the input and generate the output.

PARAMETER	DESCRIPTION
transform	Function that takes in a prompt and chat history and returns a response to the prompt. TYPE: Callable[[str, list[ChatMessage]], Generator[str, None, None] | str]
title	Headline text to display at the top of the UI. TYPE: str | None DEFAULT: None
bot_user	Name of your bot / assistant. TYPE: str DEFAULT: _BOT_USER_DEFAULT