@beppla/tapas-ui 1.5.2 → 1.5.7

package/commonjs/Theme/README.md

@@ -0,0 +1,161 @@
+# ThemeProvider
+
+主题提供组件，基于 `@rneui/themed` 的 ThemeProvider 封装，为整个应用提供统一的设计令牌（Design Tokens）。包含颜色、间距、圆角、字体、阴影等完整的主题配置，为换肤功能做好预备。
+
+## 功能特性
+
+- ✅ 统一主题注入：colors、spacing、radius、fonts、elevation
+- ✅ 支持 light / dark 模式切换（预留）
+- ✅ 80+ 颜色令牌：涵盖文本、表面、边框、图标、状态、图表等
+- ✅ 12 级间距系统（4px ~ 112px）
+- ✅ 3 级圆角系统（mini: 4 / rounded: 12 / full: 360）
+- ✅ 完整字体配置：5 级字号、5 级字重、行高、字间距
+- ✅ 4 级阴影/elevation 系统
+- ✅ Figma Design Token 对齐
+- ✅ 中文字体支持（MiSans VF / PingFang SC）
+- ✅ 组件级别主题覆盖（components.Button）
+
+## 安装使用
+
+```tsx
+import { TapasThemeProvider } from '@beppla/tapas-ui';
+// 或
+import ThemeProvider from '@beppla/tapas-ui/components/Theme/ThemeProvider';
+```
+
+## ThemeProvider Props
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| mode | `'light' \| 'dark'` | `'dark'` | 主题模式 |
+| children | `React.ReactNode` | - | 子组件 |
+| testID | `string` | - | 测试标识 |
+
+## defaultTheme 函数
+
+```tsx
+import { defaultTheme } from '@beppla/tapas-ui';
+
+const theme = defaultTheme({ mode: 'dark' });
+```
+
+### ThemeOptions
+
+```tsx
+interface ThemeOptions {
+  mode?: 'light' | 'dark';
+}
+```
+
+## 主题令牌一览
+
+### 颜色（theme.colors）
+
+| 分类 | 主要令牌 | 示例 |
+|------|---------|------|
+| 基础色 | primary, secondary, background, white, black | `rgba(0,0,0,0.87)` |
+| 灰阶 | grey0 ~ grey5, greyOutline | `rgba(0,0,0,0.04)` ~ `rgba(0,0,0,0.87)` |
+| 语义色 | success, warning, error, info | `#57B07B`, `#B81F1E`, `#007AFF` |
+| 文本色 | colorTextPrimary, colorTextSecondary, colorTextBrand, colorTextAccent | `#895F38`, `#F55523` |
+| 表面色 | colorSurface ~ colorSurface11 | `#F9F2E8` ~ `rgba(255,255,255,0.30)` |
+| 边框色 | colorPrimaryBorder, colorBorder1, colorBorder2, colorErrorBorder, colorActiveBorder | `rgba(0,0,0,0.12)` |
+| 图标色 | colorNormalIcon, colorActiveIcon, colorDisabledIcon, colorAccentIcon | `#F55523` |
+| 状态色 | colorStatusAvailable, colorStatusOccupied, colorStatusReserved 等 | `#57B07B`, `#B81F1E` |
+| 图表色 | colorChartCategoryTeal, colorChartProductBrown 等 | `#1FBCAD`, `#895F38` |
+
+### 间距（theme.spacing）
+
+| 令牌 | 值 | Figma 别名 |
+|------|------|-----------|
+| tp2xs | 4 | spacing2xs |
+| tpXs | 8 | spacingXs |
+| tpSm | 12 | spacingSm |
+| tpRg | 16 | spacingRg |
+| tpMd | 24 | spacingMd |
+| tpLg | 32 | spacingLg |
+| tpXl | 48 | spacingXl |
+| tp2xl | 88 | spacingBlg |
+| tp3xl | 112 | spacingBlgger |
+
+### 圆角（theme.radius）
+
+| 令牌 | 值 | 用途 |
+|------|------|------|
+| mini | 4 | 卡片、标签 |
+| rounded | 12 | 按钮、输入框 |
+| full | 360 | 圆形头像、胶囊按钮 |
+
+### 字体（theme.fonts）
+
+| 令牌 | 值 | 说明 |
+|------|------|------|
+| fontFamily | `BricolageGrotesque-Regular` | 英文主字体 |
+| fontFamilyCN | `MiSans VF` | 中文主字体 |
+| h1 ~ h4 | 44 / 32 / 24 / 21 | 标题字号 |
+| sizeL / sizeM / sizeS / sizeXs | 16 / 14 / 12 / 10 | 正文字号 |
+| weightL / weightM / weightS / weightR | 700 / 600 / 500 / 400 | 字重 |
+
+### 阴影（theme.elevation）
+
+| 令牌 | shadowRadius | elevation | 场景 |
+|------|-------------|-----------|------|
+| e1 | 3 | 2 | 卡片 |
+| e2 | 6 | 4 | 浮动按钮 |
+| e3 | 12 | 8 | 弹窗 |
+| e4 | 24 | 16 | 对话框 |
+
+## 使用示例
+
+### 应用根节点
+
+```tsx
+import { TapasThemeProvider } from '@beppla/tapas-ui';
+
+export default function App() {
+  return (
+    <TapasThemeProvider mode="dark">
+      <MainNavigator />
+    </TapasThemeProvider>
+  );
+}
+```
+
+### 在组件中使用主题
+
+```tsx
+import { useTheme, makeStyles } from '@rneui/themed';
+
+const MyComponent = () => {
+  const { theme } = useTheme();
+  return <View style={{ backgroundColor: theme.colors.background }} />;
+};
+
+// 或使用 makeStyles
+const useStyles = makeStyles((theme) => ({
+  container: {
+    padding: theme.spacing.tpRg,
+    borderRadius: theme.radius.rounded,
+  },
+}));
+```
+
+### Storybook 中使用
+
+```tsx
+export const decorators = [
+  (Story) => (
+    <TapasThemeProvider mode="dark">
+      <Story />
+    </TapasThemeProvider>
+  ),
+];
+```
+
+## 注意事项
+
+- 当前 `light` 和 `dark` 模式使用相同的颜色值（darkColors = colors），待设计师确认后更新
+- 所有 tapas-ui 组件都需要在 ThemeProvider 内使用
+- 主题对象通过 `@rneui/themed` 的 `useTheme` / `makeStyles` / `withTheme` 消费
+- `defaultTheme` 返回的是完整配置对象，不是 React 组件
+- 字体文件需要在应用层加载（expo-font 或原生配置）
+- 组件级覆盖目前仅配置了 Button 的默认样式

package/commonjs/Theme/makeStyles.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.makeStyles = exports.default = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _ThemeProvider = require("@rneui/themed/dist/config/ThemeProvider");
+/**
+ * React 19 compatible makeStyles
+ *
+ * Drop-in replacement for @rneui/themed's makeStyles.
+ * Uses useContext hook (safe in React 19) instead of relying on
+ * ThemeConsumer (Context.Consumer pattern).
+ */
+
+const makeStyles = styles => {
+  return (props = {}) => {
+    const context = (0, _react.useContext)(_ThemeProvider.ThemeContext);
+    const theme = context?.theme;
+    return (0, _react.useMemo)(() => {
+      const css = typeof styles === 'function' ? styles(theme, props) : styles;
+      return _reactNative.StyleSheet.create(css);
+    }, [props, theme]);
+  };
+};
+exports.makeStyles = makeStyles;
+var _default = exports.default = makeStyles;
+//# sourceMappingURL=makeStyles.js.map

package/commonjs/Theme/makeStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_ThemeProvider","makeStyles","styles","props","context","useContext","ThemeContext","theme","useMemo","css","StyleSheet","create","exports","_default","default"],"sourceRoot":"../../../components","sources":["Theme/makeStyles.ts"],"mappings":";;;;;;AAOA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,cAAA,GAAAF,OAAA;AATA;AACA;AACA;AACA;AACA;AACA;AACA;;AAQO,MAAMG,UAAU,GACrBC,MAA0C,IACvC;EACH,OAAO,CAACC,KAAQ,GAAG,CAAC,CAAM,KAAK;IAC7B,MAAMC,OAAO,GAAG,IAAAC,iBAAU,EAACC,2BAAY,CAAC;IACxC,MAAMC,KAAK,GAAIH,OAAO,EAAUG,KAAU;IAE1C,OAAO,IAAAC,cAAO,EAAC,MAAM;MACnB,MAAMC,GAAG,GAAG,OAAOP,MAAM,KAAK,UAAU,GACnCA,MAAM,CAAyBK,KAAK,EAAEJ,KAAK,CAAC,GAC7CD,MAAM;MACV,OAAOQ,uBAAU,CAACC,MAAM,CAACF,GAAG,CAAC;IAC/B,CAAC,EAAE,CAACN,KAAK,EAAEI,KAAK,CAAC,CAAC;EACpB,CAAC;AACH,CAAC;AAACK,OAAA,CAAAX,UAAA,GAAAA,UAAA;AAAA,IAAAY,QAAA,GAAAD,OAAA,CAAAE,OAAA,GAEab,UAAU","ignoreList":[]}

package/commonjs/Theme/withTheme.js

@@ -0,0 +1,91 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+exports.withTheme = withTheme;
+var _react = _interopRequireWildcard(require("react"));
+var _deepmerge = _interopRequireDefault(require("deepmerge"));
+var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
+var _ThemeProvider = require("@rneui/themed/dist/config/ThemeProvider");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+/**
+ * React 19 compatible withTheme HOC
+ *
+ * Replaces @rneui/themed's withTheme which uses Context.Consumer (render props pattern)
+ * that crashes in React 19. This version uses useContext hook instead.
+ */
+
+// @ts-ignore -- hoist-non-react-statics has no type declarations in this project
+
+const isClassComponent = Component => Boolean(Component?.prototype?.isReactComponent);
+const combineByStyles = (propName = '') => {
+  if (propName.endsWith('Style') || propName.endsWith('style')) {
+    return (prop1, prop2) => [prop1, prop2].flat();
+  }
+  return undefined;
+};
+const ThemedComponent = (WrappedComponent, themeKey, displayName) => {
+  const Component = (props, forwardedRef) => {
+    const {
+      children,
+      ...rest
+    } = props;
+    const context = (0, _react.useContext)(_ThemeProvider.ThemeContext);
+    const {
+      theme,
+      updateTheme,
+      replaceTheme
+    } = context;
+    if (!theme) {
+      const newProps = {
+        ...rest,
+        theme: {
+          colors: {},
+          spacing: {}
+        },
+        children
+      };
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedComponent, {
+        ref: forwardedRef,
+        ...newProps
+      });
+    }
+    const themeObj = theme;
+    const {
+      components: comps,
+      ...restTheme
+    } = themeObj;
+    const themedProps = typeof comps?.[themeKey] === 'function' ? comps[themeKey](rest, restTheme) : comps?.[themeKey];
+    const merged = (0, _deepmerge.default)(themedProps || {}, rest, {
+      customMerge: combineByStyles,
+      clone: false
+    });
+    const newProps = {
+      theme: restTheme,
+      updateTheme,
+      replaceTheme,
+      ...merged,
+      children
+    };
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedComponent, {
+      ref: forwardedRef,
+      ...newProps
+    });
+  };
+  Component.displayName = displayName;
+  return Component;
+};
+function withTheme(WrappedComponent, themeKey) {
+  const name = themeKey ? `Themed.${themeKey}` : `Themed.${WrappedComponent.displayName || WrappedComponent.name || 'Component'}`;
+  const Component = ThemedComponent(WrappedComponent, themeKey, name);
+  if (isClassComponent(WrappedComponent)) {
+    return (0, _hoistNonReactStatics.default)(/*#__PURE__*/(0, _react.forwardRef)(Component), WrappedComponent);
+  }
+  return /*#__PURE__*/(0, _react.forwardRef)(Component);
+}
+var _default = exports.default = withTheme;
+//# sourceMappingURL=withTheme.js.map

package/commonjs/Theme/withTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_deepmerge","_interopRequireDefault","_hoistNonReactStatics","_ThemeProvider","_jsxRuntime","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","isClassComponent","Component","Boolean","prototype","isReactComponent","combineByStyles","propName","endsWith","prop1","prop2","flat","undefined","ThemedComponent","WrappedComponent","themeKey","displayName","props","forwardedRef","children","rest","context","useContext","ThemeContext","theme","updateTheme","replaceTheme","newProps","colors","spacing","jsx","ref","themeObj","components","comps","restTheme","themedProps","merged","deepmerge","customMerge","clone","withTheme","name","hoistNonReactStatics","forwardRef","_default","exports"],"sourceRoot":"../../../components","sources":["Theme/withTheme.tsx"],"mappings":";;;;;;;AAMA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,qBAAA,GAAAD,sBAAA,CAAAF,OAAA;AACA,IAAAI,cAAA,GAAAJ,OAAA;AAAuE,IAAAK,WAAA,GAAAL,OAAA;AAAA,SAAAE,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAP,wBAAAO,CAAA,EAAAG,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAX,uBAAA,YAAAA,CAAAO,CAAA,EAAAG,CAAA,SAAAA,CAAA,IAAAH,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,MAAAO,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAR,OAAA,EAAAF,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAS,CAAA,MAAAF,CAAA,GAAAJ,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAE,CAAA,CAAAI,GAAA,CAAAX,CAAA,UAAAO,CAAA,CAAAK,GAAA,CAAAZ,CAAA,GAAAO,CAAA,CAAAM,GAAA,CAAAb,CAAA,EAAAS,CAAA,gBAAAN,CAAA,IAAAH,CAAA,gBAAAG,CAAA,OAAAW,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAG,CAAA,OAAAK,CAAA,IAAAD,CAAA,GAAAS,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAG,CAAA,OAAAK,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAN,CAAA,EAAAK,CAAA,IAAAC,CAAA,CAAAN,CAAA,IAAAH,CAAA,CAAAG,CAAA,WAAAM,CAAA,KAAAT,CAAA,EAAAG,CAAA;AAVvE;AACA;AACA;AACA;AACA;AACA;;AAGA;;AAIA,MAAMgB,gBAAgB,GAAIC,SAAc,IACtCC,OAAO,CAACD,SAAS,EAAEE,SAAS,EAAEC,gBAAgB,CAAC;AAEjD,MAAMC,eAAe,GAAGA,CAACC,QAAQ,GAAG,EAAE,KAAK;EACzC,IAAIA,QAAQ,CAACC,QAAQ,CAAC,OAAO,CAAC,IAAID,QAAQ,CAACC,QAAQ,CAAC,OAAO,CAAC,EAAE;IAC5D,OAAO,CAACC,KAAU,EAAEC,KAAU,KAAK,CAACD,KAAK,EAAEC,KAAK,CAAC,CAACC,IAAI,CAAC,CAAC;EAC1D;EACA,OAAOC,SAAS;AAClB,CAAC;AAED,MAAMC,eAAe,GAAGA,CACtBC,gBAA0C,EAC1CC,QAAiB,EACjBC,WAAoB,KACjB;EACH,MAAMd,SAAS,GAAGA,CAACe,KAAU,EAAEC,YAAiB,KAAK;IACnD,MAAM;MAAEC,QAAQ;MAAE,GAAGC;IAAK,CAAC,GAAGH,KAAK;IACnC,MAAMI,OAAO,GAAG,IAAAC,iBAAU,EAACC,2BAAY,CAAC;IACxC,MAAM;MAAEC,KAAK;MAAEC,WAAW;MAAEC;IAAa,CAAC,GAAGL,OAAc;IAE3D,IAAI,CAACG,KAAK,EAAE;MACV,MAAMG,QAAQ,GAAG;QACf,GAAGP,IAAI;QACPI,KAAK,EAAE;UAAEI,MAAM,EAAE,CAAC,CAAC;UAAEC,OAAO,EAAE,CAAC;QAAE,CAAC;QAClCV;MACF,CAAC;MACD,oBAAO,IAAAtC,WAAA,CAAAiD,GAAA,EAAChB,gBAAgB;QAACiB,GAAG,EAAEb,YAAa;QAAA,GAAKS;MAAQ,CAAG,CAAC;IAC9D;IAEA,MAAMK,QAAQ,GAAGR,KAA4B;IAC7C,MAAM;MAAES,UAAU,EAAEC,KAAK;MAAE,GAAGC;IAAU,CAAC,GAAGH,QAAQ;IACpD,MAAMI,WAAW,GACf,OAAOF,KAAK,GAAGnB,QAAQ,CAAW,KAAK,UAAU,GAC7CmB,KAAK,CAACnB,QAAQ,CAAW,CAACK,IAAI,EAAEe,SAAS,CAAC,GAC1CD,KAAK,GAAGnB,QAAQ,CAAW;IAEjC,MAAMsB,MAAM,GAAG,IAAAC,kBAAS,EAACF,WAAW,IAAI,CAAC,CAAC,EAAEhB,IAAI,EAAyB;MACvEmB,WAAW,EAAEjC,eAAe;MAC5BkC,KAAK,EAAE;IACT,CAAC,CAAwB;IAEzB,MAAMb,QAAQ,GAAG;MACfH,KAAK,EAAEW,SAAS;MAChBV,WAAW;MACXC,YAAY;MACZ,GAAIW,MAA8B;MAClClB;IACF,CAAC;IAED,oBAAO,IAAAtC,WAAA,CAAAiD,GAAA,EAAChB,gBAAgB;MAACiB,GAAG,EAAEb,YAAa;MAAA,GAAKS;IAAQ,CAAG,CAAC;EAC9D,CAAC;EAEDzB,SAAS,CAACc,WAAW,GAAGA,WAAW;EACnC,OAAOd,SAAS;AAClB,CAAC;AAEM,SAASuC,SAASA,CACvB3B,gBAA0D,EAC1DC,QAAiB,EACqE;EACtF,MAAM2B,IAAI,GAAG3B,QAAQ,GACjB,UAAUA,QAAQ,EAAE,GACpB,UAAWD,gBAAgB,CAASE,WAAW,IAAKF,gBAAgB,CAAS4B,IAAI,IAAI,WAAW,EAAE;EAEtG,MAAMxC,SAAS,GAAGW,eAAe,CAACC,gBAAgB,EAASC,QAAQ,EAAE2B,IAAI,CAAC;EAE1E,IAAIzC,gBAAgB,CAACa,gBAAgB,CAAC,EAAE;IACtC,OAAO,IAAA6B,6BAAoB,eACzB,IAAAC,iBAAU,EAAC1C,SAAS,CAAC,EACrBY,gBACF,CAAC;EACH;EAEA,oBAAO,IAAA8B,iBAAU,EAAC1C,SAAS,CAAC;AAC9B;AAAC,IAAA2C,QAAA,GAAAC,OAAA,CAAA9D,OAAA,GAEcyD,SAAS","ignoreList":[]}

package/commonjs/Timeline/README.md

@@ -0,0 +1,111 @@
+# Timeline
+
+时间线组件，用于展示按时间排列的事件或活动列表。每个事件节点包含时间和描述，支持多种状态（选中、禁用、错误），并提供 Hover 交互效果和点击回调。
+
+## 功能特性
+
+- ✅ 纵向时间线布局，节点 + 连接线
+- ✅ 四种节点状态：默认、selected（选中）、disabled（禁用）、error（错误）
+- ✅ 状态对应不同的颜色和线条样式（实线/虚线）
+- ✅ 错误状态显示警告图标
+- ✅ Hover 高亮效果（Hoverable 组件）
+- ✅ 支持点击事件回调
+- ✅ 标题 + 滚动内容区域
+- ✅ 自定义容器和内容区域样式
+- ✅ 主题色适配
+
+## 安装使用
+
+```tsx
+import { Timeline } from '@beppla/tapas-ui';
+```
+
+## Props
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| data | `IData` | - | 时间线数据（必填） |
+| itemContainerStyle | `StyleProp<ViewStyle>` | - | 事件列表容器样式（必填） |
+| onPress | `(item: Item) => void` | - | 事件项点击回调 |
+| selected | `boolean` | `false` | 全局选中状态（预留） |
+| disabled | `boolean` | - | 全局禁用状态（预留） |
+| containerStyle | `StyleProp<ViewStyle>` | - | 最外层容器样式 |
+| testID | `string` | - | 测试标识 |
+
+### IData
+
+```tsx
+interface IData {
+  title: string;
+  items: Item[];
+}
+```
+
+### Item
+
+```tsx
+interface Item {
+  id: string;
+  time: string;
+  description: string;
+  selected?: boolean;
+  disabled?: boolean;
+  error?: boolean;
+}
+```
+
+## 使用示例
+
+### 基础用法
+
+```tsx
+const data = {
+  title: 'Order History',
+  items: [
+    { id: '1', time: '09:00', description: 'Order placed', selected: true },
+    { id: '2', time: '10:30', description: 'Payment confirmed' },
+    { id: '3', time: '14:00', description: 'Shipped' },
+  ],
+};
+
+<Timeline
+  data={data}
+  itemContainerStyle={{ minHeight: 200 }}
+  onPress={(item) => console.log('Clicked:', item.id)}
+/>
+```
+
+### 错误状态
+
+```tsx
+const data = {
+  title: 'Delivery Status',
+  items: [
+    { id: '1', time: '08:00', description: 'Dispatched', selected: true },
+    { id: '2', time: '12:00', description: 'Delivery failed', error: true },
+    { id: '3', time: '15:00', description: 'Rescheduled', disabled: true },
+  ],
+};
+
+<Timeline data={data} itemContainerStyle={{ minHeight: 300 }} />
+```
+
+### 自定义样式
+
+```tsx
+<Timeline
+  data={data}
+  itemContainerStyle={{ minHeight: 400 }}
+  containerStyle={{ width: 300, backgroundColor: '#FFF' }}
+  onPress={handleItemPress}
+/>
+```
+
+## 注意事项
+
+- 容器默认宽度 192px，可通过 `containerStyle` 覆盖
+- 事件列表在 ScrollView 内，支持滚动
+- Hover 效果基于 Hoverable 组件实现，仅在 Web 端生效
+- 连接线在 `disabled` 状态下为虚线样式
+- 节点状态在 item 级别控制（item.selected / item.disabled / item.error）
+- 需在 `ThemeProvider` 内使用

package/commonjs/Toast/README.md

@@ -0,0 +1,96 @@
+# Toast
+
+轻量级消息提示组件，用于显示临时通知。支持自动消失、多种状态类型、描述文本和操作按钮，适合操作反馈场景。
+
+## 功能特性
+
+- ✅ 支持 Success、Error、Warning、Info 四种类型
+- ✅ 自动消失机制，可自定义持续时间（duration）
+- ✅ 支持副标题/描述文本（description）
+- ✅ 支持操作按钮（actionText + onActionPress）
+- ✅ 不同状态自动匹配对应图标和颜色
+- ✅ Web/移动端自适应最大宽度
+- ✅ 通过 visible 控制显示/隐藏
+- ✅ 主题色适配
+
+## 安装使用
+
+```tsx
+import { Toast } from '@beppla/tapas-ui';
+```
+
+## Props
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| visible | `boolean` | `false` | 是否显示（必填） |
+| message | `string` | - | 消息文本（必填） |
+| duration | `number` | `2000` | 自动消失时间（毫秒） |
+| type | `'Error' \| 'Warning' \| 'Success' \| 'Info'` | `'Info'` | 消息类型 |
+| description | `string` | - | 描述/副标题文本 |
+| actionText | `string` | - | 操作按钮文本 |
+| onActionPress | `() => void` | - | 操作按钮点击回调 |
+| hideToast | `() => void` | - | 隐藏 Toast 的回调 |
+| style | `any` | - | 自定义外层样式 |
+
+## 使用示例
+
+### 基础用法
+
+```tsx
+const [visible, setVisible] = useState(false);
+
+<Toast
+  visible={visible}
+  message="Operation successful"
+  type="Success"
+  hideToast={() => setVisible(false)}
+/>
+```
+
+### 带描述文本
+
+```tsx
+<Toast
+  visible={true}
+  message="Order created"
+  description="Order #12345 has been placed"
+  type="Info"
+  duration={3000}
+  hideToast={() => setVisible(false)}
+/>
+```
+
+### 带操作按钮
+
+```tsx
+<Toast
+  visible={true}
+  message="Item deleted"
+  type="Warning"
+  actionText="Undo"
+  onActionPress={() => handleUndo()}
+  hideToast={() => setVisible(false)}
+/>
+```
+
+### 错误提示
+
+```tsx
+<Toast
+  visible={true}
+  message="Network error"
+  description="Please check your connection"
+  type="Error"
+  duration={5000}
+  hideToast={() => setVisible(false)}
+/>
+```
+
+## 注意事项
+
+- `visible` 变为 `true` 时启动定时器，到时自动调用 `hideToast`
+- 外部需自行管理 `visible` 状态，组件本身不维护显隐
+- 类型名称首字母大写：`'Success'`、`'Error'`、`'Warning'`、`'Info'`
+- Web 端最大宽度 450px，移动端最大宽度 375px
+- 有 `actionText` 时容器会自动拉伸（flex: 1）

package/commonjs/Upload/Upload.js

@@ -0,0 +1,126 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _themed = require("@rneui/themed");
+var _TapasIcon = _interopRequireDefault(require("../Icons/TapasIcon"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const TapasUpload = ({
+  onFileSelect,
+  attachSelectedFile,
+  btnText = 'Upload',
+  width,
+  height,
+  accept,
+  disabled = false,
+  testID,
+  containerStyle
+}) => {
+  const styles = useStyles();
+  const uniqueId = `fileInput-${Math.random().toString(36).substr(2, 9)}`;
+  const handleFile = onFileSelect ?? attachSelectedFile;
+  const handleSelectFile = () => {
+    if (disabled) return;
+    if (_reactNative.Platform.OS === 'web') {
+      document.getElementById(uniqueId)?.click();
+    }
+  };
+  const handleFileInputChange = event => {
+    const selectedFile = event.target.files[0];
+    if (selectedFile && handleFile) {
+      handleFile(selectedFile);
+    }
+  };
+  const handleDrop = event => {
+    event.preventDefault();
+    if (disabled) return;
+    const files = event.dataTransfer.files;
+    if (files?.length > 0 && handleFile) {
+      handleFile(files[0]);
+    }
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+    testID: testID,
+    onPress: handleSelectFile,
+    style: [styles.container, width != null && {
+      width
+    }, height != null && {
+      height
+    }, disabled && styles.disabled, containerStyle],
+    children: _reactNative.Platform.OS === 'web' ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      style: {
+        display: 'flex',
+        flexDirection: 'row',
+        justifyContent: 'center',
+        alignItems: 'center',
+        width: '100%',
+        height: '100%',
+        gap: 8
+      },
+      onDragEnter: e => e.preventDefault(),
+      onDragOver: e => e.preventDefault(),
+      onDragLeave: e => e.preventDefault(),
+      onDrop: handleDrop,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+        type: "file",
+        id: uniqueId,
+        accept: accept,
+        style: {
+          display: 'none'
+        },
+        onChange: handleFileInputChange
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TapasIcon.default, {
+        size: 20,
+        color: styles.icon.color,
+        name: "upload"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.text,
+        children: btnText
+      })]
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TapasIcon.default, {
+        size: 20,
+        color: styles.icon.color,
+        name: "upload"
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.text,
+        children: btnText
+      })]
+    })
+  });
+};
+const useStyles = (0, _themed.makeStyles)(theme => ({
+  container: {
+    display: 'flex',
+    flexDirection: 'row',
+    height: 48,
+    borderStyle: 'dashed',
+    borderWidth: 1,
+    borderColor: theme.colors.grey2,
+    borderRadius: 12,
+    flexGrow: 1,
+    overflow: 'hidden',
+    justifyContent: 'center',
+    alignItems: 'center',
+    gap: 8,
+    paddingHorizontal: 16
+  },
+  disabled: {
+    opacity: 0.5
+  },
+  icon: {
+    color: theme.colors.grey2
+  },
+  text: {
+    fontSize: 12,
+    fontWeight: '400',
+    color: theme.colors.secondary
+  }
+}));
+var _default = exports.default = (0, _themed.withTheme)(/*#__PURE__*/_react.default.memo(TapasUpload));
+//# sourceMappingURL=Upload.js.map

package/commonjs/Upload/Upload.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_themed","_TapasIcon","_jsxRuntime","e","__esModule","default","TapasUpload","onFileSelect","attachSelectedFile","btnText","width","height","accept","disabled","testID","containerStyle","styles","useStyles","uniqueId","Math","random","toString","substr","handleFile","handleSelectFile","Platform","OS","document","getElementById","click","handleFileInputChange","event","selectedFile","target","files","handleDrop","preventDefault","dataTransfer","length","jsx","Pressable","onPress","style","container","children","jsxs","display","flexDirection","justifyContent","alignItems","gap","onDragEnter","onDragOver","onDragLeave","onDrop","type","id","onChange","size","color","icon","name","Text","text","Fragment","makeStyles","theme","borderStyle","borderWidth","borderColor","colors","grey2","borderRadius","flexGrow","overflow","paddingHorizontal","opacity","fontSize","fontWeight","secondary","_default","exports","withTheme","React","memo"],"sourceRoot":"../../../components","sources":["Upload/Upload.tsx"],"mappings":"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","ignoreList":[]}