SuperAPI AI Directory

component-bubble

Frontend & websites

View repository

Updated 10-15 19:56

About this skill

Bubble Component Development

Development and extension of chat bubble-related components, including AI message bubbles, user message bubbles, and bubble lists.

Source Code Location

  • Main entry and exports:src/Bubble/index.tsx
  • AI bubble:src/Bubble/AIBubble
  • User bubble:src/Bubble/UserBubble
  • Common container:src/Bubble/Bubble.tsx
  • List:src/Bubble/List
  • Types:src/Bubble/type.ts、src/Bubble/types/

Main Exports

AIBubble, UserBubble, Bubble, runRender
PureAIBubble, PureUserBubble, PureBubble, PureBubbleList
BubbleConfigProvide 及相关 context

Development Standards

  • Styles use @ant-design/cssinjs from createStyles, and colors/spacing use tokens.
  • Event callbacks use the on prefix (such as onClick、onCopy)。
  • Supports classNames、styles for Semantic style extension.
  • Refer to the naming and API standards of AGENTS.md in the project root directory.

Common Capabilities

  • AIBubble: streaming content, chain-of-thought collapsing, status (success/error/loading), tool call display.
  • UserBubble: user avatar, multimodal content, action buttons.
  • List: bubble list, auto-scroll, empty state.

When developing or modifying bubble-related features, refer first to the above source code and AGENTS.md, and maintain compatibility with the existing API.