Chainlit UI 配置

theme: primaryColor: "#2563eb" secondaryColor: "#4f46e5" mode: "dark" fontFamily: "Inter, sans-serif"

**高级组件开发：**
如需实现特殊交互功能，可通过`libs/react-client/`目录下的React组件扩展前端功能。例如，创建自定义数据可视化组件，需实现：
1. 前端React组件（位于`frontend/src/components/Elements/`）
2. Python数据处理逻辑（位于`backend/chainlit/element.py`）
3. 前后端通信协议（参考`backend/chainlit/types.py`中的数据结构定义）

**场景-问题-解决方案案例：**
- **场景**：企业内部知识库问答系统
- **问题**：传统检索式问答无法理解上下文，用户体验差
- **解决方案**：使用Chainlit的会话状态管理结合向量数据库
```python
# 集成向量数据库示例（简化版）
import chainlit as cl
from langchain.vectorstores import Chroma
from langchain.embeddings import OpenAIEmbeddings

@cl.on_chat_start
async def init():
    # 初始化向量存储
    embeddings = OpenAIEmbeddings()
    vector_store = Chroma(persist_directory="./kb", embedding_function=embeddings)
    cl.user_session.set("vector_store", vector_store)
    
@cl.on_message
async def query_kb(message: cl.Message):
    vector_store = cl.user_session.get("vector_store")
    docs = vector_store.similarity_search(message.content, k=3)
    response = f"找到相关信息：\n" + "\n".join([doc.page_content for doc in docs])
    await cl.Message(content=response).send()