@unif/react-native-chat 0.1.0 → 0.1.2

package/lib/commonjs/welcome/Welcome.js

@@ -0,0 +1,152 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _tokens = require("../theme/tokens");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+/**
+ * Welcome — 欢迎页
+ * 渐变背景 + 装饰性光晕 + 2x2 快捷入口卡片网格
+ */
+
+const Welcome = ({
+  title = '你好，我是小U',
+  subtitle = '智能助手，有什么可以帮你？',
+  quickStarts = [],
+  onQuickStart,
+  gradientColors = [_tokens.chatTokens.colorBgWelcomeStart, _tokens.chatTokens.colorBgWelcomeMid, _tokens.chatTokens.colorBgWelcomeEnd],
+  style,
+  styles: semanticStyles,
+  testID = 'welcome',
+  renderIcon,
+  renderGradient
+}) => {
+  const content = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: defaultStyles.glowTopRight
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: defaultStyles.glowBottomLeft
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: defaultStyles.content,
+      children: [renderIcon?.('sparkles', 48, _tokens.chatTokens.colorPrimary), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: [defaultStyles.title, semanticStyles?.title],
+        children: title
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: [defaultStyles.subtitle, semanticStyles?.subtitle],
+        children: subtitle
+      }), quickStarts.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: defaultStyles.grid,
+        children: quickStarts.map((item, index) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
+          style: [defaultStyles.card, semanticStyles?.card],
+          onPress: () => onQuickStart?.(item.key),
+          activeOpacity: 0.7,
+          testID: `${testID}-quick-${index}`,
+          children: [renderIcon?.(item.icon, 24, _tokens.chatTokens.colorPrimary), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: [defaultStyles.cardTitle, semanticStyles?.cardTitle],
+            children: item.title
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: [defaultStyles.cardDescription, semanticStyles?.cardDescription],
+            children: item.description
+          })]
+        }, item.key))
+      })]
+    })]
+  });
+
+  // 如果提供了 renderGradient，使用自定义渐变
+  if (renderGradient) {
+    return renderGradient({
+      colors: gradientColors,
+      children: content,
+      style: {
+        ...defaultStyles.container,
+        ...semanticStyles?.root,
+        ...style
+      }
+    });
+  }
+
+  // 无渐变 fallback（纯色背景）
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: [defaultStyles.container, {
+      backgroundColor: gradientColors[0]
+    }, semanticStyles?.root, style],
+    testID: testID,
+    children: content
+  });
+};
+const defaultStyles = _reactNative.StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  content: {
+    flex: 1,
+    justifyContent: 'flex-start',
+    alignItems: 'center',
+    paddingHorizontal: 20,
+    paddingTop: 56
+  },
+  glowTopRight: {
+    position: 'absolute',
+    top: -40,
+    right: -40,
+    width: 200,
+    height: 200,
+    borderRadius: 100,
+    backgroundColor: 'rgba(235,110,0,0.06)'
+  },
+  glowBottomLeft: {
+    position: 'absolute',
+    bottom: 40,
+    left: -40,
+    width: 160,
+    height: 160,
+    borderRadius: 80,
+    backgroundColor: 'rgba(0,122,255,0.04)'
+  },
+  title: {
+    marginTop: 16,
+    fontSize: 20,
+    fontWeight: '600',
+    color: _tokens.chatTokens.colorText
+  },
+  subtitle: {
+    marginTop: 6,
+    textAlign: 'center',
+    fontSize: 15,
+    color: _tokens.chatTokens.colorTextSecondary
+  },
+  grid: {
+    marginTop: 32,
+    width: '100%',
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    justifyContent: 'space-between',
+    gap: 12
+  },
+  card: {
+    width: '47%',
+    backgroundColor: _tokens.chatTokens.colorBgElevated,
+    borderRadius: 16,
+    padding: 16,
+    ..._tokens.chatTokens.shadowSm
+  },
+  cardTitle: {
+    marginTop: 8,
+    fontSize: 14,
+    fontWeight: '500',
+    color: _tokens.chatTokens.colorText
+  },
+  cardDescription: {
+    marginTop: 2,
+    fontSize: 11,
+    color: _tokens.chatTokens.colorTextSecondary
+  }
+});
+var _default = exports.default = /*#__PURE__*/_react.default.memo(Welcome);
+//# sourceMappingURL=Welcome.js.map

package/lib/commonjs/welcome/Welcome.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_tokens","_jsxRuntime","e","__esModule","default","Welcome","title","subtitle","quickStarts","onQuickStart","gradientColors","chatTokens","colorBgWelcomeStart","colorBgWelcomeMid","colorBgWelcomeEnd","style","styles","semanticStyles","testID","renderIcon","renderGradient","content","jsxs","Fragment","children","jsx","View","defaultStyles","glowTopRight","glowBottomLeft","colorPrimary","Text","length","grid","map","item","index","TouchableOpacity","card","onPress","key","activeOpacity","icon","cardTitle","cardDescription","description","colors","container","root","backgroundColor","StyleSheet","create","flex","justifyContent","alignItems","paddingHorizontal","paddingTop","position","top","right","width","height","borderRadius","bottom","left","marginTop","fontSize","fontWeight","color","colorText","textAlign","colorTextSecondary","flexDirection","flexWrap","gap","colorBgElevated","padding","shadowSm","_default","exports","React","memo"],"sourceRoot":"../../../src","sources":["welcome/Welcome.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/welcome/index.md

@@ -0,0 +1,95 @@
+---
+title: Welcome 欢迎页
+nav:
+  title: 组件
+  path: /components
+---
+
+# Welcome 欢迎页
+
+聊天欢迎页组件，渐变背景 + 装饰性光晕 + 快捷入口卡片网格。
+
+## 何时使用
+
+- 聊天界面无消息时的空状态
+- 引导用户通过快捷入口开始对话
+
+## 代码示例
+
+### 基本用法
+
+```tsx
+import { Welcome } from '@unif/react-native-chat';
+
+<Welcome
+  title="你好，我是小U"
+  subtitle="智能助手，有什么可以帮你？"
+/>
+```
+
+### 带快捷入口
+
+```tsx
+<Welcome
+  quickStarts={[
+    { key: 'balance', icon: 'wallet', title: '余额查询', description: '查看账户余额' },
+    { key: 'transfer', icon: 'send', title: '转账汇款', description: '快速转账' },
+    { key: 'invest', icon: 'trending-up', title: '理财推荐', description: '个性化推荐' },
+    { key: 'service', icon: 'chatbubbles', title: '客户服务', description: '在线客服' },
+  ]}
+  onQuickStart={(key) => console.log('选择:', key)}
+  renderIcon={(name, size, color) => <Icon name={name} size={size} color={color} />}
+/>
+```
+
+### 自定义渐变
+
+```tsx
+import LinearGradient from 'react-native-linear-gradient';
+
+<Welcome
+  gradientColors={['#E8F4FD', '#F0E6FF', '#F5F5F5']}
+  renderGradient={({ colors, children, style }) => (
+    <LinearGradient colors={colors} style={style}>
+      {children}
+    </LinearGradient>
+  )}
+/>
+```
+
+## API
+
+### WelcomeProps
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| title | 主标题 | `string` | `'你好，我是小U'` |
+| subtitle | 副标题 | `string` | `'智能助手，有什么可以帮你？'` |
+| quickStarts | 快捷入口配置 | `WelcomeQuickStart[]` | `[]` |
+| onQuickStart | 快捷入口点击回调 | `(key: string) => void` | - |
+| gradientColors | 背景渐变色 | `string[]` | 内置渐变 |
+| style | 容器样式 | `ViewStyle` | - |
+| styles | 语义样式 | `Partial<WelcomeSemanticStyles>` | - |
+| testID | 测试标识 | `string` | `'welcome'` |
+| renderIcon | 图标渲染函数 | `(name, size, color) => ReactNode` | - |
+| renderGradient | 渐变背景渲染函数 | `(props) => ReactNode` | - |
+
+### WelcomeQuickStart
+
+| 属性 | 说明 | 类型 |
+|------|------|------|
+| key | 唯一标识 | `string` |
+| icon | 图标名称 | `string` |
+| title | 标题 | `string` |
+| description | 描述 | `string` |
+
+### WelcomeSemanticStyles
+
+| 属性 | 说明 | 类型 |
+|------|------|------|
+| root | 外层容器 | `ViewStyle` |
+| title | 标题文字 | `TextStyle` |
+| subtitle | 副标题文字 | `TextStyle` |
+| card | 快捷入口卡片 | `ViewStyle` |
+| cardTitle | 卡片标题 | `TextStyle` |
+| cardDescription | 卡片描述 | `TextStyle` |

package/lib/module/bubble/Bubble.js

@@ -0,0 +1,126 @@
+"use strict";
+
+/**
+ * Bubble — 消息气泡容器
+ *
+ * 根据 role 自动镜像布局：
+ * - user → 右对齐浅色气泡 + 不对称圆角
+ * - assistant → 左侧 Avatar + 名称 + 内容
+ */
+
+import React from 'react';
+import { View, Text, StyleSheet } from 'react-native';
+import { chatTokens } from "../theme/tokens.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const Bubble = ({
+  role,
+  avatar,
+  name,
+  children,
+  footer,
+  style,
+  styles: semanticStyles,
+  testID
+}) => {
+  if (role === 'user') {
+    return /*#__PURE__*/_jsxs(View, {
+      style: [defaultStyles.userRow, semanticStyles?.root, style],
+      testID: testID ?? 'bubble-user',
+      children: [/*#__PURE__*/_jsx(View, {
+        style: defaultStyles.userBubble,
+        children: typeof children === 'string' ? /*#__PURE__*/_jsx(Text, {
+          style: defaultStyles.userText,
+          children: children
+        }) : children
+      }), footer && /*#__PURE__*/_jsx(View, {
+        style: [defaultStyles.footer, semanticStyles?.footer],
+        children: footer
+      })]
+    });
+  }
+
+  // assistant / system
+  return /*#__PURE__*/_jsxs(View, {
+    style: [defaultStyles.assistantRow, semanticStyles?.root, style],
+    testID: testID ?? 'bubble-assistant',
+    children: [/*#__PURE__*/_jsxs(View, {
+      style: defaultStyles.headerRow,
+      children: [avatar && /*#__PURE__*/_jsx(View, {
+        style: [defaultStyles.avatarContainer, semanticStyles?.avatar],
+        children: avatar
+      }), name && /*#__PURE__*/_jsx(Text, {
+        style: [defaultStyles.assistantName, semanticStyles?.name],
+        children: name
+      })]
+    }), /*#__PURE__*/_jsx(View, {
+      style: [defaultStyles.contentArea, semanticStyles?.content],
+      children: children
+    }), footer && /*#__PURE__*/_jsx(View, {
+      style: [defaultStyles.footer, semanticStyles?.footer],
+      children: footer
+    }), /*#__PURE__*/_jsx(View, {
+      style: defaultStyles.separator
+    })]
+  });
+};
+const defaultStyles = StyleSheet.create({
+  // Assistant
+  assistantRow: {
+    paddingHorizontal: chatTokens.spaceMd,
+    paddingVertical: chatTokens.spaceSm,
+    marginBottom: 12
+  },
+  headerRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginBottom: 6
+  },
+  avatarContainer: {
+    marginRight: 8
+  },
+  assistantName: {
+    fontSize: 13,
+    fontWeight: '500',
+    color: chatTokens.colorTextSecondary
+  },
+  contentArea: {
+    paddingLeft: 36
+  },
+  separator: {
+    marginTop: 12,
+    marginLeft: 36,
+    height: StyleSheet.hairlineWidth,
+    backgroundColor: chatTokens.colorBorder,
+    opacity: 0.5
+  },
+  footer: {
+    paddingLeft: 36,
+    marginTop: 4
+  },
+  // User
+  userRow: {
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+    flexWrap: 'wrap',
+    paddingHorizontal: chatTokens.spaceMd,
+    paddingVertical: chatTokens.spaceSm,
+    marginBottom: chatTokens.spaceSm
+  },
+  userBubble: {
+    backgroundColor: chatTokens.colorBgUserMsg,
+    borderTopLeftRadius: 20,
+    borderTopRightRadius: 20,
+    borderBottomLeftRadius: 20,
+    borderBottomRightRadius: 6,
+    paddingHorizontal: chatTokens.spaceMd,
+    paddingVertical: chatTokens.space,
+    maxWidth: '75%'
+  },
+  userText: {
+    fontSize: chatTokens.fontSize,
+    color: chatTokens.colorText,
+    lineHeight: chatTokens.lineHeight
+  }
+});
+export default /*#__PURE__*/React.memo(Bubble);
+//# sourceMappingURL=Bubble.js.map

package/lib/module/bubble/Bubble.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","StyleSheet","chatTokens","jsx","_jsx","jsxs","_jsxs","Bubble","role","avatar","name","children","footer","style","styles","semanticStyles","testID","defaultStyles","userRow","root","userBubble","userText","assistantRow","headerRow","avatarContainer","assistantName","contentArea","content","separator","create","paddingHorizontal","spaceMd","paddingVertical","spaceSm","marginBottom","flexDirection","alignItems","marginRight","fontSize","fontWeight","color","colorTextSecondary","paddingLeft","marginTop","marginLeft","height","hairlineWidth","backgroundColor","colorBorder","opacity","justifyContent","flexWrap","colorBgUserMsg","borderTopLeftRadius","borderTopRightRadius","borderBottomLeftRadius","borderBottomRightRadius","space","maxWidth","colorText","lineHeight","memo"],"sourceRoot":"../../../src","sources":["bubble/Bubble.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/bubble/BubbleList.js

@@ -0,0 +1,68 @@
+"use strict";
+
+/**
+ * Bubble.List — 消息列表
+ * 封装 inverted FlatList，自动滚动到底部
+ */
+
+import React, { useCallback } from 'react';
+import { FlatList, View, StyleSheet } from 'react-native';
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+function BubbleListInner(props) {
+  const {
+    items,
+    renderBubble,
+    keyExtractor,
+    onEndReached,
+    header,
+    footer,
+    style,
+    testID = 'bubble-list'
+  } = props;
+  const renderItem = useCallback(({
+    item
+  }) => /*#__PURE__*/_jsx(_Fragment, {
+    children: renderBubble(item)
+  }), [renderBubble]);
+  const defaultKeyExtractor = useCallback((item, index) => {
+    if (keyExtractor) return keyExtractor(item);
+    const record = item;
+    return record['id'] ?? String(index);
+  }, [keyExtractor]);
+  if (items.length === 0 && header) {
+    return /*#__PURE__*/_jsx(View, {
+      style: [defaultStyles.container, style],
+      testID: testID,
+      children: header
+    });
+  }
+  return /*#__PURE__*/_jsx(FlatList, {
+    data: items,
+    renderItem: renderItem,
+    keyExtractor: defaultKeyExtractor,
+    inverted: true,
+    style: [defaultStyles.list, style],
+    contentContainerStyle: defaultStyles.contentContainer,
+    onEndReached: onEndReached,
+    onEndReachedThreshold: 0.3,
+    ListFooterComponent: footer ? /*#__PURE__*/_jsx(_Fragment, {
+      children: footer
+    }) : null,
+    showsVerticalScrollIndicator: false,
+    testID: testID
+  });
+}
+const defaultStyles = StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  list: {
+    flex: 1
+  },
+  contentContainer: {
+    paddingVertical: 8
+  }
+});
+const BubbleList = /*#__PURE__*/React.memo(BubbleListInner);
+export default BubbleList;
+//# sourceMappingURL=BubbleList.js.map

package/lib/module/bubble/BubbleList.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","FlatList","View","StyleSheet","Fragment","_Fragment","jsx","_jsx","BubbleListInner","props","items","renderBubble","keyExtractor","onEndReached","header","footer","style","testID","renderItem","item","children","defaultKeyExtractor","index","record","String","length","defaultStyles","container","data","inverted","list","contentContainerStyle","contentContainer","onEndReachedThreshold","ListFooterComponent","showsVerticalScrollIndicator","create","flex","paddingVertical","BubbleList","memo"],"sourceRoot":"../../../src","sources":["bubble/BubbleList.tsx"],"mappings":";;AAAA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,IAAGC,WAAW,QAAO,OAAO;AACxC,SAAQC,QAAQ,EAAEC,IAAI,EAAEC,UAAU,QAAuB,cAAc;AAAC,SAAAC,QAAA,IAAAC,SAAA,EAAAC,GAAA,IAAAC,IAAA;AAaxE,SAASC,eAAeA,CAAIC,KAAyB,EAAE;EACrD,MAAM;IACJC,KAAK;IACLC,YAAY;IACZC,YAAY;IACZC,YAAY;IACZC,MAAM;IACNC,MAAM;IACNC,KAAK;IACLC,MAAM,GAAG;EACX,CAAC,GAAGR,KAAK;EAET,MAAMS,UAAU,GAAGlB,WAAW,CAC5B,CAAC;IAACmB;EAAe,CAAC,kBAAKZ,IAAA,CAAAF,SAAA;IAAAe,QAAA,EAAGT,YAAY,CAACQ,IAAI;EAAC,CAAG,CAAC,EAChD,CAACR,YAAY,CACf,CAAC;EAED,MAAMU,mBAAmB,GAAGrB,WAAW,CACrC,CAACmB,IAAO,EAAEG,KAAa,KAAK;IAC1B,IAAIV,YAAY,EAAE,OAAOA,YAAY,CAACO,IAAI,CAAC;IAC3C,MAAMI,MAAM,GAAGJ,IAA+B;IAC9C,OAAQI,MAAM,CAAC,IAAI,CAAC,IAAeC,MAAM,CAACF,KAAK,CAAC;EAClD,CAAC,EACD,CAACV,YAAY,CACf,CAAC;EAED,IAAIF,KAAK,CAACe,MAAM,KAAK,CAAC,IAAIX,MAAM,EAAE;IAChC,oBACEP,IAAA,CAACL,IAAI;MAACc,KAAK,EAAE,CAACU,aAAa,CAACC,SAAS,EAAEX,KAAK,CAAE;MAACC,MAAM,EAAEA,MAAO;MAAAG,QAAA,EAC3DN;IAAM,CACH,CAAC;EAEX;EAEA,oBACEP,IAAA,CAACN,QAAQ;IACP2B,IAAI,EAAElB,KAAM;IACZQ,UAAU,EAAEA,UAAW;IACvBN,YAAY,EAAES,mBAAoB;IAClCQ,QAAQ;IACRb,KAAK,EAAE,CAACU,aAAa,CAACI,IAAI,EAAEd,KAAK,CAAE;IACnCe,qBAAqB,EAAEL,aAAa,CAACM,gBAAiB;IACtDnB,YAAY,EAAEA,YAAa;IAC3BoB,qBAAqB,EAAE,GAAI;IAC3BC,mBAAmB,EAAEnB,MAAM,gBAAGR,IAAA,CAAAF,SAAA;MAAAe,QAAA,EAAGL;IAAM,CAAG,CAAC,GAAG,IAAK;IACnDoB,4BAA4B,EAAE,KAAM;IACpClB,MAAM,EAAEA;EAAO,CAChB,CAAC;AAEN;AAEA,MAAMS,aAAa,GAAGvB,UAAU,CAACiC,MAAM,CAAC;EACtCT,SAAS,EAAE;IACTU,IAAI,EAAE;EACR,CAAC;EACDP,IAAI,EAAE;IACJO,IAAI,EAAE;EACR,CAAC;EACDL,gBAAgB,EAAE;IAChBM,eAAe,EAAE;EACnB;AACF,CAAC,CAAC;AAEF,MAAMC,UAAU,gBAAGxC,KAAK,CAACyC,IAAI,CAAChC,eAAe,CAA2B;AACxE,eAAe+B,UAAU","ignoreList":[]}

package/lib/module/bubble/index.md

@@ -0,0 +1,111 @@
+---
+title: Bubble 消息气泡
+nav:
+  title: 组件
+  path: /components
+---
+
+# Bubble 消息气泡
+
+消息气泡容器，根据 `role` 自动镜像布局。
+
+## 何时使用
+
+- 展示聊天消息（用户消息、AI 回复、系统消息）
+- 需要根据角色自动区分左右布局
+
+## 代码示例
+
+### 基本用法
+
+```tsx
+import { Bubble } from '@unif/react-native-chat';
+
+// 用户消息（右对齐）
+<Bubble role="user">你好，请帮我查询订单</Bubble>
+
+// AI 回复（左对齐）
+<Bubble role="assistant" name="小U" avatar={<Avatar name="AI" />}>
+  好的，正在为您查询...
+</Bubble>
+```
+
+### 自定义底部区域
+
+```tsx
+<Bubble role="assistant" footer={<Text>14:30</Text>}>
+  这是消息内容
+</Bubble>
+```
+
+### 语义样式覆盖
+
+```tsx
+<Bubble
+  role="user"
+  styles={{
+    root: { paddingHorizontal: 20 },
+    content: { backgroundColor: '#E8F0FE' },
+  }}
+>
+  自定义样式的消息
+</Bubble>
+```
+
+## API
+
+### BubbleProps
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| role | 消息角色 | `'user' \| 'assistant' \| 'system'` | - |
+| avatar | 头像（assistant/system 角色显示） | `ReactNode` | - |
+| name | 发送者名称 | `string` | - |
+| children | 消息内容 | `ReactNode` | - |
+| footer | 底部区域（时间戳、操作等） | `ReactNode` | - |
+| style | 外层容器样式 | `ViewStyle` | - |
+| styles | 语义样式覆盖 | `Partial<BubbleSemanticStyles>` | - |
+| testID | 测试标识 | `string` | - |
+
+### BubbleSemanticStyles
+
+| 属性 | 说明 | 类型 |
+|------|------|------|
+| root | 外层容器 | `ViewStyle` |
+| avatar | 头像容器 | `ViewStyle` |
+| name | 名称文字 | `TextStyle` |
+| content | 内容区域 | `ViewStyle` |
+| footer | 底部区域 | `ViewStyle` |
+
+## Bubble.List 消息列表
+
+封装 inverted FlatList，消息从底部向上排列，支持泛型。
+
+### 基本用法
+
+```tsx
+import { Bubble } from '@unif/react-native-chat';
+
+<Bubble.List
+  items={messages}
+  header={<Welcome />}
+  renderBubble={(msg) => (
+    <Bubble role={msg.message.role}>
+      {msg.message.text}
+    </Bubble>
+  )}
+/>
+```
+
+### BubbleListProps
+
+| 属性 | 说明 | 类型 | 默认值 |
+|------|------|------|--------|
+| items | 消息数据 | `T[]` | - |
+| renderBubble | 渲染单条消息 | `(item: T) => ReactNode` | - |
+| keyExtractor | 自定义 key 提取 | `(item: T) => string` | 使用 `item.id` |
+| onEndReached | 滚动到底部回调（加载更多） | `() => void` | - |
+| header | 列表为空时的顶部占位 | `ReactNode` | - |
+| footer | 列表底部内容 | `ReactNode` | - |
+| style | 容器样式 | `ViewStyle` | - |
+| testID | 测试标识 | `string` | `'bubble-list'` |

package/lib/module/card-wrapper/CardWrapper.js

@@ -0,0 +1,60 @@
+"use strict";
+
+/**
+ * CardWrapper — 通用卡片路由容器
+ * registry 通过 props 注入（而非全局 import），更灵活
+ */
+
+import React from 'react';
+import { View, Text, StyleSheet } from 'react-native';
+import { chatTokens } from "../theme/tokens.js";
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+const CardWrapper = ({
+  cardType,
+  data,
+  actions,
+  registry = {},
+  fallback,
+  style,
+  testID
+}) => {
+  const CardComponent = registry[cardType];
+  if (!CardComponent) {
+    return /*#__PURE__*/_jsx(View, {
+      style: [defaultStyles.container, style],
+      testID: testID,
+      children: fallback ?? /*#__PURE__*/_jsxs(Text, {
+        style: defaultStyles.fallback,
+        children: ["\u4E0D\u652F\u6301\u7684\u5361\u7247\u7C7B\u578B: ", cardType]
+      })
+    });
+  }
+  return /*#__PURE__*/_jsx(View, {
+    style: [defaultStyles.container, style],
+    testID: testID ?? `card-${cardType}`,
+    children: /*#__PURE__*/_jsx(CardComponent, {
+      data: data,
+      actions: actions
+    })
+  });
+};
+const defaultStyles = StyleSheet.create({
+  container: {
+    backgroundColor: chatTokens.colorBgElevated,
+    borderRadius: 12,
+    borderWidth: 1,
+    borderColor: chatTokens.colorBorder,
+    marginLeft: 8,
+    marginRight: 40,
+    marginBottom: 4,
+    overflow: 'hidden',
+    maxWidth: '85%'
+  },
+  fallback: {
+    padding: 12,
+    fontSize: 13,
+    color: chatTokens.colorTextSecondary
+  }
+});
+export default /*#__PURE__*/React.memo(CardWrapper);
+//# sourceMappingURL=CardWrapper.js.map

package/lib/module/card-wrapper/CardWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Text","StyleSheet","chatTokens","jsxs","_jsxs","jsx","_jsx","CardWrapper","cardType","data","actions","registry","fallback","style","testID","CardComponent","defaultStyles","container","children","create","backgroundColor","colorBgElevated","borderRadius","borderWidth","borderColor","colorBorder","marginLeft","marginRight","marginBottom","overflow","maxWidth","padding","fontSize","color","colorTextSecondary","memo"],"sourceRoot":"../../../src","sources":["card-wrapper/CardWrapper.tsx"],"mappings":";;AAAA;AACA;AACA;AACA;;AAEA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAAQC,IAAI,EAAEC,IAAI,EAAEC,UAAU,QAAuB,cAAc;AACnE,SAAQC,UAAU,QAAO,oBAAiB;AAAC,SAAAC,IAAA,IAAAC,KAAA,EAAAC,GAAA,IAAAC,IAAA;AAiB3C,MAAMC,WAAuC,GAAGA,CAAC;EAC/CC,QAAQ;EACRC,IAAI;EACJC,OAAO;EACPC,QAAQ,GAAG,CAAC,CAAC;EACbC,QAAQ;EACRC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,MAAMC,aAAa,GAAGJ,QAAQ,CAACH,QAAQ,CAAC;EAExC,IAAI,CAACO,aAAa,EAAE;IAClB,oBACET,IAAA,CAACP,IAAI;MAACc,KAAK,EAAE,CAACG,aAAa,CAACC,SAAS,EAAEJ,KAAK,CAAE;MAACC,MAAM,EAAEA,MAAO;MAAAI,QAAA,EAC3DN,QAAQ,iBACPR,KAAA,CAACJ,IAAI;QAACa,KAAK,EAAEG,aAAa,CAACJ,QAAS;QAAAM,QAAA,GAAC,oDACzB,EAACV,QAAQ;MAAA,CACf;IACP,CACG,CAAC;EAEX;EAEA,oBACEF,IAAA,CAACP,IAAI;IACHc,KAAK,EAAE,CAACG,aAAa,CAACC,SAAS,EAAEJ,KAAK,CAAE;IACxCC,MAAM,EAAEA,MAAM,IAAI,QAAQN,QAAQ,EAAG;IAAAU,QAAA,eACrCZ,IAAA,CAACS,aAAa;MAACN,IAAI,EAAEA,IAAK;MAACC,OAAO,EAAEA;IAAQ,CAAE;EAAC,CAC3C,CAAC;AAEX,CAAC;AAED,MAAMM,aAAa,GAAGf,UAAU,CAACkB,MAAM,CAAC;EACtCF,SAAS,EAAE;IACTG,eAAe,EAAElB,UAAU,CAACmB,eAAe;IAC3CC,YAAY,EAAE,EAAE;IAChBC,WAAW,EAAE,CAAC;IACdC,WAAW,EAAEtB,UAAU,CAACuB,WAAW;IACnCC,UAAU,EAAE,CAAC;IACbC,WAAW,EAAE,EAAE;IACfC,YAAY,EAAE,CAAC;IACfC,QAAQ,EAAE,QAAQ;IAClBC,QAAQ,EAAE;EACZ,CAAC;EACDlB,QAAQ,EAAE;IACRmB,OAAO,EAAE,EAAE;IACXC,QAAQ,EAAE,EAAE;IACZC,KAAK,EAAE/B,UAAU,CAACgC;EACpB;AACF,CAAC,CAAC;AAEF,4BAAepC,KAAK,CAACqC,IAAI,CAAC5B,WAAW,CAAC","ignoreList":[]}