@beppla/tapas-ui 1.5.14 → 1.5.15

package/package/module/Tag/README.md

@@ -0,0 +1,93 @@
+# Tag
+
+标签组件，用于标记和分类信息。支持关闭按钮、多种尺寸和禁用状态。
+
+## 功能特性
+
+- ✅ 支持三种尺寸：small（32px）、middle（36px）、large（40px）
+- ✅ 可选的关闭按钮，支持点击关闭回调
+- ✅ 支持禁用状态，禁用时关闭按钮不可点击
+- ✅ 文字超出宽度自动省略（可设置最大宽度）
+- ✅ 胶囊形圆角样式
+- ✅ 灰色背景，主题色文字
+- ✅ 使用 React.memo 优化渲染性能
+- ✅ 支持无障碍标签（accessibilityRole="button"）
+
+## 安装使用
+
+```tsx
+import Tag from '@beppla/tapas-ui/components/Tag/Tag';
+```
+
+## Props
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| children | `React.ReactNode` | - | 标签内容 |
+| closable | `boolean` | `true` | 是否显示关闭按钮 |
+| onClose | `() => void` | - | 关闭按钮点击回调 |
+| style | `StyleProp<ViewStyle>` | - | 自定义容器样式 |
+| size | `'small' \| 'middle' \| 'large'` | `'large'` | 标签尺寸 |
+| textMaxWidth | `number` | `226` | 文字最大宽度 |
+| disabled | `boolean` | `false` | 是否禁用 |
+
+## 使用示例
+
+### 基础用法
+
+```tsx
+<Tag>标签文字</Tag>
+```
+
+### 可关闭标签
+
+```tsx
+<Tag closable onClose={() => console.log('closed')}>
+  可关闭
+</Tag>
+```
+
+### 不同尺寸
+
+```tsx
+<Tag size="small">Small</Tag>
+<Tag size="middle">Middle</Tag>
+<Tag size="large">Large</Tag>
+```
+
+### 禁用状态
+
+```tsx
+<Tag disabled>禁用标签</Tag>
+```
+
+### 标签列表（可删除）
+
+```tsx
+const [list, setList] = useState([
+  { name: '标签1', value: '1' },
+  { name: '标签2', value: '2' },
+]);
+
+<View style={{ flexDirection: 'row' }}>
+  {list.map((item, idx) => (
+    <Tag
+      key={item.value}
+      onClose={() => {
+        const newList = [...list];
+        newList.splice(idx, 1);
+        setList(newList);
+      }}
+    >
+      {item.name}
+    </Tag>
+  ))}
+</View>
+```
+
+## 注意事项
+
+- 默认 `closable` 为 `true`，如不需要关闭按钮请显式设置为 `false`
+- 禁用状态下关闭图标仍然显示，但不可点击
+- `textMaxWidth` 默认为 226，超出文字会被裁剪（overflow: hidden）
+- 标签之间默认有 `marginRight: 8` 和 `marginBottom: 8` 的间距

package/package/module/Tag/Tag.js

@@ -0,0 +1,100 @@
+"use strict";
+
+import React, { Fragment } from "react";
+import { View, TouchableOpacity } from "react-native";
+import { makeStyles, withTheme, Text as RNText } from "@rneui/themed";
+import Icon from '../Icons/TapasIcon';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const useStyles = makeStyles((theme, ...props) => {
+  const {
+    size,
+    textMaxWidth,
+    disabled
+  } = props[0];
+  let height = 36,
+    fontSize = theme.fonts.sizeM,
+    iconSize = 20;
+  switch (size) {
+    case 'small':
+      height = 32;
+      fontSize = theme.fonts.sizeS;
+      iconSize = 16;
+      break;
+    case 'middle':
+      height = 36;
+      break;
+    default:
+      height = 40;
+      break;
+  }
+  return {
+    tagWrap: {
+      marginRight: 8,
+      display: 'flex',
+      flexDirection: 'row',
+      justifyContent: 'center',
+      alignItems: 'center',
+      borderRadius: height,
+      paddingHorizontal: 12,
+      paddingVertical: 2,
+      marginBottom: 8,
+      height: height,
+      backgroundColor: theme.colors.grey4
+    },
+    textItem: {
+      fontFamily: theme?.fonts?.fontFamily,
+      fontSize: fontSize || theme.fonts.sizeM,
+      fontWeight: theme?.fonts.weightR,
+      color: theme.colors.colorTextPrimary,
+      // textOverflow: 'ellipsis', // Not supported in React Native
+      // whiteSpace: 'nowrap', // Not supported in React Native
+      overflow: "hidden",
+      maxWidth: textMaxWidth || 226
+    },
+    closeIcon: {
+      marginLeft: 8,
+      fontSize: iconSize,
+      color: disabled ? theme.colors.colorTextPlaceholder : theme.colors.colorTextPrimary
+    },
+    disabled: {
+      color: theme.colors.colorTextPlaceholder
+    }
+  };
+});
+const Tag = ({
+  // @ts-expect-error theme injected by withTheme HOC
+  theme,
+  ...props
+}) => {
+  const styles = useStyles(props);
+  const {
+    disabled = false,
+    closable = true
+  } = props;
+  return /*#__PURE__*/_jsxs(View, {
+    style: [styles.tagWrap, props.style],
+    testID: "tag",
+    children: [/*#__PURE__*/_jsx(RNText, {
+      style: [styles.textItem, disabled && styles.disabled],
+      children: props.children
+    }), closable && /*#__PURE__*/_jsx(Fragment, {
+      children: !disabled ? /*#__PURE__*/_jsx(TouchableOpacity, {
+        onPress: e => {
+          e.stopPropagation();
+          props.onClose && props.onClose();
+        },
+        accessibilityRole: "button",
+        accessibilityLabel: `Remove ${typeof props.children === 'string' ? props.children : 'tag'}`,
+        children: /*#__PURE__*/_jsx(Icon, {
+          name: "close",
+          style: styles.closeIcon
+        })
+      }) : /*#__PURE__*/_jsx(Icon, {
+        name: "close",
+        style: styles.closeIcon
+      })
+    })]
+  });
+};
+export default withTheme(/*#__PURE__*/React.memo(Tag));
+//# sourceMappingURL=Tag.js.map

package/package/module/Tag/Tag.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Fragment","View","TouchableOpacity","makeStyles","withTheme","Text","RNText","Icon","jsx","_jsx","jsxs","_jsxs","useStyles","theme","props","size","textMaxWidth","disabled","height","fontSize","fonts","sizeM","iconSize","sizeS","tagWrap","marginRight","display","flexDirection","justifyContent","alignItems","borderRadius","paddingHorizontal","paddingVertical","marginBottom","backgroundColor","colors","grey4","textItem","fontFamily","fontWeight","weightR","color","colorTextPrimary","overflow","maxWidth","closeIcon","marginLeft","colorTextPlaceholder","Tag","styles","closable","style","testID","children","onPress","e","stopPropagation","onClose","accessibilityRole","accessibilityLabel","name","memo"],"sourceRoot":"../../../components","sources":["Tag/Tag.tsx"],"mappings":"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","ignoreList":[]}

package/package/module/Task/README.md

@@ -0,0 +1,110 @@
+# Task
+
+任务卡片组件（TaskCard），用于在甘特图或看板中展示任务的详细信息。包含标题、描述、状态标签、完成进度和时间范围，四种状态（Waiting / Ongoing / Delay / Completed）各有对应的颜色和样式。
+
+## 功能特性
+
+- ✅ 四种任务状态：Waiting（等待）、Ongoing（进行中）、Delay（延迟）、Completed（已完成）
+- ✅ 状态自动匹配颜色和背景（绿色/红色/蓝色/灰色）
+- ✅ 进度条背景色覆盖（左侧彩色边框 + 背景填充）
+- ✅ 多条描述文本展示（description 数组）
+- ✅ 完成百分比显示
+- ✅ 时间范围展示（开始时间 - 结束时间）
+- ✅ Completed 状态自动隐藏时间范围和状态标签
+- ✅ 支持自定义状态文本（statusText）和完成文本（completedText）
+- ✅ 卡片阴影效果
+- ✅ 主题色适配
+
+## 安装使用
+
+```tsx
+import { TaskCard } from '@beppla/tapas-ui';
+```
+
+## Props
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| title | `string` | - | 任务标题（必填） |
+| description | `string[]` | - | 描述文本数组（必填） |
+| state | `keyof typeof TaskStatus` | - | 任务状态（必填） |
+| timeRange | `string[]` | - | 时间范围 [start, end]（必填） |
+| completion | `number` | - | 完成比例（0-1） |
+| statusText | `Record<keyof typeof TaskStatus, string>` | - | 自定义状态文本映射 |
+| completedText | `string` | - | 完成状态显示文本 |
+| style | `CSSProperties` | `{}` | 自定义外层样式 |
+
+### TaskStatus 枚举
+
+```tsx
+enum TaskStatus {
+  Waiting = 'Waiting',
+  Ongoing = 'Ongoing',
+  Delay = 'Delay',
+  Completed = 'Completed',
+}
+```
+
+## 使用示例
+
+### 进行中的任务
+
+```tsx
+<TaskCard
+  title="Kitchen preparation"
+  description={['Table 5', 'Main course']}
+  state="Ongoing"
+  timeRange={['09:00', '10:30']}
+  completion={0.6}
+/>
+```
+
+### 延迟任务
+
+```tsx
+<TaskCard
+  title="Delivery order #123"
+  description={['Customer: John', 'Priority: High']}
+  state="Delay"
+  timeRange={['14:00', '15:00']}
+  completion={0.3}
+/>
+```
+
+### 已完成任务
+
+```tsx
+<TaskCard
+  title="Inventory check"
+  description={['Warehouse A']}
+  state="Completed"
+  timeRange={['08:00', '09:00']}
+  completedText="Done"
+/>
+```
+
+### 自定义状态文本
+
+```tsx
+<TaskCard
+  title="Task"
+  description={['Info']}
+  state="Waiting"
+  timeRange={['10:00', '11:00']}
+  statusText={{
+    Waiting: 'Pending',
+    Ongoing: 'In Progress',
+    Delay: 'Overdue',
+    Completed: 'Finished',
+  }}
+/>
+```
+
+## 注意事项
+
+- 组件使用 HTML div + span 元素，仅适用于 Web 平台
+- `completion` 值范围 0-1，Completed 状态自动设为 1，Waiting 状态自动设为 0
+- 进度背景宽度通过 CSS calc 计算：`calc(completion * 100% + 28px)`
+- 描述文本超长会自动省略（text-overflow: ellipsis）
+- 卡片使用 @rneui/themed 的 Card 组件，带有 boxShadow 效果
+- 需在 `ThemeProvider` 内使用

package/package/module/Task/Task.js

@@ -0,0 +1,256 @@
+"use strict";
+
+import React from "react";
+import { Card, Divider, Text, withTheme } from "@rneui/themed";
+import { View, StyleSheet } from "react-native";
+import CustomIcon from "../Icons/TapasIcon";
+import { TaskStatus } from "./type";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const TaskCard = ({
+  title,
+  description,
+  state,
+  completion,
+  theme,
+  timeRange,
+  statusText,
+  completedText,
+  style = {}
+}) => {
+  let stateColor = "";
+  let stateBg = "";
+  let completionVal = completion;
+  switch (state) {
+    case TaskStatus.Ongoing:
+      stateColor = theme?.colorStatusAvailable ?? "#57B07B";
+      stateBg = theme?.colorStatusAvailableBg ?? "#EEF7F2";
+      break;
+    case TaskStatus.Delay:
+      stateColor = theme.colorStatusError ?? "#B81F1E";
+      stateBg = theme?.colorStatusErrorBg ?? "#FFEBEA";
+      break;
+    case TaskStatus.Completed:
+      stateColor = theme.colorPrimaryBorder ?? "rgba(0, 0, 0, 0.12)";
+      stateBg = theme.grey5 ?? "rgba(0, 0, 0, 0.04)";
+      completionVal = 1;
+      break;
+    default:
+      stateColor = theme.colorStatusReserved ?? "#3E6DA4";
+      completionVal = 0;
+      break;
+  }
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      ...style,
+      marginTop: theme?.spacing.tp2xs,
+      marginBottom: theme?.spacing.tp2xs,
+      marginLeft: 0,
+      marginRight: 0,
+      borderRadius: theme?.radius.mini,
+      boxShadow: "0px 2px 4px 0px rgba(0, 0, 0, 0.08), 0px 4px 16px 0px rgba(0, 0, 0, 0.12)",
+      display: "flex",
+      flexDirection: "column",
+      overflow: "hidden"
+    },
+    children: /*#__PURE__*/_jsxs(Card, {
+      containerStyle: {
+        ...styles.container,
+        paddingLeft: theme?.spacing.tpRg,
+        paddingRight: theme?.spacing.tpRg,
+        paddingTop: theme?.spacing.tpSm,
+        paddingBottom: theme?.spacing.tpSm,
+        borderRadius: theme?.radius.mini,
+        borderTopColor: state === TaskStatus.Waiting ? theme?.grey4 : stateColor,
+        borderLeftColor: state === TaskStatus.Waiting ? theme?.grey4 : stateColor,
+        borderRightColor: state === TaskStatus.Waiting ? theme?.grey4 : stateColor,
+        borderBottomColor: state === TaskStatus.Waiting ? theme?.grey4 : stateColor,
+        height: undefined,
+        minWidth: undefined
+      },
+      children: [/*#__PURE__*/_jsx("div", {
+        style: {
+          ...styles.process,
+          borderRadius: theme?.radius.mini,
+          width: `calc(${(completionVal ?? (state === TaskStatus.Completed ? 1 : 0)) * 100}% + ${!completionVal && state !== TaskStatus.Completed ? 0 : 28}px)`,
+          borderLeftStyle: "solid",
+          borderColor: stateColor,
+          backgroundColor: stateBg
+        }
+      }), /*#__PURE__*/_jsx(Card.Title, {
+        testID: "task",
+        style: {
+          ...styles.title,
+          fontSize: theme?.fonts.sizeS,
+          color: state === TaskStatus.Completed ? theme?.grey2 ?? "rgba(0, 0, 0, 0.26)" : theme?.colorTextPrimary ?? "rgba(0, 0, 0, 0.87)",
+          display: "flex",
+          width: "100%",
+          maxHeight: 16,
+          overflow: "hidden"
+        },
+        children: title
+      }), /*#__PURE__*/_jsx(View, {
+        style: {
+          ...styles.vertical,
+          height: 14
+        },
+        children: (description || []).map((str, index) => /*#__PURE__*/_jsxs(View, {
+          style: {
+            ...styles.vertical,
+            height: 14
+          },
+          children: [index > 0 && /*#__PURE__*/_jsx(Divider, {
+            orientation: "vertical",
+            color: theme?.colorSurface6,
+            style: styles.divider
+          }), /*#__PURE__*/_jsx("span", {
+            style: {
+              ...styles.text,
+              fontSize: theme.fonts.sizeS,
+              color: state === TaskStatus.Completed ? theme?.grey2 ?? "rgba(0, 0, 0, 0.26)" : theme?.colorTextSecondary ?? "rgba(0, 0, 0, 0.54)",
+              whiteSpace: "nowrap",
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              lineHeight: "14px"
+            },
+            children: str
+          })]
+        }, `tapas-card-desc-${index}`))
+      }), /*#__PURE__*/_jsxs(View, {
+        style: styles.vertical,
+        children: [state !== TaskStatus.Completed && /*#__PURE__*/_jsx(Text, {
+          style: {
+            ...styles.status,
+            color: stateColor,
+            fontSize: theme.fonts.sizeM,
+            borderRadius: theme?.radius.mini,
+            borderTopColor: stateColor,
+            borderLeftColor: stateColor,
+            borderRightColor: stateColor,
+            borderBottomColor: stateColor
+          },
+          children: statusText?.[state] ?? state
+        }), /*#__PURE__*/_jsx(Text, {
+          style: {
+            ...styles.greyContainer,
+            marginLeft: state === TaskStatus.Completed ? 0 : 4,
+            backgroundColor: theme?.grey5 ?? "rgba(0, 0, 0, 0.04)"
+          },
+          children: /*#__PURE__*/_jsxs(View, {
+            style: styles.flexRow,
+            children: [/*#__PURE__*/_jsx(CustomIcon, {
+              color: state === TaskStatus.Completed ? theme?.grey2 ?? "rgba(0, 0, 0, 0.26)" : theme?.colorTextSecondary ?? "rgba(0, 0, 0, 0.54)",
+              style: {
+                fontSize: theme.fonts.sizeL,
+                marginRight: 4
+              },
+              name: "check"
+            }), /*#__PURE__*/_jsx("span", {
+              style: {
+                fontSize: theme.fonts.sizeS,
+                color: state === TaskStatus.Completed ? theme?.grey2 ?? "rgba(0, 0, 0, 0.26)" : theme?.colorTextSecondary ?? "rgba(0, 0, 0, 0.54)",
+                fontWeight: "400",
+                lineHeight: 24
+              },
+              children: state === TaskStatus.Completed ? completedText ?? state : `${(completionVal ?? 0) * 100}%`
+            })]
+          })
+        }), timeRange && Array.isArray(timeRange) && timeRange.length > 0 && state !== TaskStatus.Completed && /*#__PURE__*/_jsx(Text, {
+          style: {
+            ...styles.greyContainer,
+            backgroundColor: theme?.grey5 ?? "rgba(0, 0, 0, 0.04)",
+            overflow: "hidden"
+          },
+          children: /*#__PURE__*/_jsxs(View, {
+            style: styles.flexRow,
+            children: [/*#__PURE__*/_jsx(CustomIcon, {
+              color: theme?.colorTextSecondary ?? "rgba(0, 0, 0, 0.54)",
+              style: {
+                fontSize: theme.fonts.sizeL,
+                marginRight: 4
+              },
+              name: "schedule"
+            }), /*#__PURE__*/_jsxs("span", {
+              style: {
+                fontSize: theme.fonts.sizeS,
+                color: theme?.colorTextSecondary ?? "rgba(0, 0, 0, 0.54)",
+                fontWeight: "400",
+                whiteSpace: "nowrap",
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+                lineHeight: 24
+              },
+              children: [timeRange?.[0], timeRange?.[0] && timeRange?.[1] && " - ", timeRange?.[1]]
+            })]
+          })
+        })]
+      })]
+    })
+  });
+};
+const styles = StyleSheet.create({
+  process: {
+    position: "absolute",
+    bottom: -8,
+    top: -12,
+    left: -16,
+    borderLeftWidth: 4
+  },
+  vertical: {
+    display: "flex",
+    maxWidth: '100%',
+    overflow: 'hidden',
+    flexDirection: "row"
+  },
+  flexRow: {
+    display: "flex",
+    flexDirection: "row"
+  },
+  divider: {
+    marginLeft: 6,
+    marginRight: 6,
+    maxHeight: 8,
+    marginTop: 4
+  },
+  text: {
+    fontWeight: "400"
+  },
+  title: {
+    textAlign: "left",
+    margin: 0,
+    fontWeight: "bold"
+  },
+  container: {
+    height: 80,
+    minWidth: 50,
+    margin: 0,
+    borderWidth: 1,
+    borderStyle: "solid",
+    position: "relative",
+    display: "flex",
+    flexDirection: "column",
+    flexGrow: 1,
+    overflow: "hidden"
+  },
+  status: {
+    borderWidth: 1,
+    borderStyle: "solid",
+    paddingLeft: 6,
+    paddingRight: 6,
+    height: 24,
+    marginTop: 4,
+    fontWeight: "400"
+  },
+  greyContainer: {
+    height: 24,
+    marginTop: 4,
+    fontWeight: "400",
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    marginLeft: 4,
+    paddingLeft: 4,
+    paddingRight: 4
+  }
+});
+export default withTheme(TaskCard);
+//# sourceMappingURL=Task.js.map

package/package/module/Task/Task.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Card","Divider","Text","withTheme","View","StyleSheet","CustomIcon","TaskStatus","jsx","_jsx","jsxs","_jsxs","TaskCard","title","description","state","completion","theme","timeRange","statusText","completedText","style","stateColor","stateBg","completionVal","Ongoing","colorStatusAvailable","colorStatusAvailableBg","Delay","colorStatusError","colorStatusErrorBg","Completed","colorPrimaryBorder","grey5","colorStatusReserved","marginTop","spacing","tp2xs","marginBottom","marginLeft","marginRight","borderRadius","radius","mini","boxShadow","display","flexDirection","overflow","children","containerStyle","styles","container","paddingLeft","tpRg","paddingRight","paddingTop","tpSm","paddingBottom","borderTopColor","Waiting","grey4","borderLeftColor","borderRightColor","borderBottomColor","height","undefined","minWidth","process","width","borderLeftStyle","borderColor","backgroundColor","Title","testID","fontSize","fonts","sizeS","color","grey2","colorTextPrimary","maxHeight","vertical","map","str","index","orientation","colorSurface6","divider","text","colorTextSecondary","whiteSpace","textOverflow","lineHeight","status","sizeM","greyContainer","flexRow","sizeL","name","fontWeight","Array","isArray","length","create","position","bottom","top","left","borderLeftWidth","maxWidth","textAlign","margin","borderWidth","borderStyle","flexGrow","justifyContent"],"sourceRoot":"../../../components","sources":["Task/Task.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAyB,OAAO;AAC5C,SAASC,IAAI,EAAEC,OAAO,EAAEC,IAAI,EAAEC,SAAS,QAAQ,eAAe;AAC9D,SAASC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AAC/C,OAAOC,UAAU,MAAM,oBAAoB;AAC3C,SAASC,UAAU,QAAQ,QAAQ;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAcpC,MAAMC,QAAiC,GAAGA,CAAC;EACzCC,KAAK;EACLC,WAAW;EACXC,KAAK;EACLC,UAAU;EACVC,KAAK;EACLC,SAAS;EACTC,UAAU;EACVC,aAAa;EACbC,KAAK,GAAG,CAAC;AACX,CAAC,KAAK;EACJ,IAAIC,UAAU,GAAG,EAAE;EACnB,IAAIC,OAAO,GAAG,EAAE;EAChB,IAAIC,aAAa,GAAGR,UAAU;EAC9B,QAAQD,KAAK;IACX,KAAKR,UAAU,CAACkB,OAAO;MACrBH,UAAU,GAAGL,KAAK,EAAES,oBAAoB,IAAI,SAAS;MACrDH,OAAO,GAAGN,KAAK,EAAEU,sBAAsB,IAAI,SAAS;MACpD;IACF,KAAKpB,UAAU,CAACqB,KAAK;MACnBN,UAAU,GAAGL,KAAK,CAACY,gBAAgB,IAAI,SAAS;MAChDN,OAAO,GAAGN,KAAK,EAAEa,kBAAkB,IAAI,SAAS;MAChD;IACF,KAAKvB,UAAU,CAACwB,SAAS;MACvBT,UAAU,GAAGL,KAAK,CAACe,kBAAkB,IAAI,qBAAqB;MAC9DT,OAAO,GAAGN,KAAK,CAACgB,KAAK,IAAI,qBAAqB;MAC9CT,aAAa,GAAG,CAAC;MACjB;IACF;MACEF,UAAU,GAAGL,KAAK,CAACiB,mBAAmB,IAAI,SAAS;MACnDV,aAAa,GAAG,CAAC;MACjB;EACJ;EAEA,oBACEf,IAAA;IACEY,KAAK,EAAE;MACL,GAAGA,KAAK;MACRc,SAAS,EAAElB,KAAK,EAAEmB,OAAO,CAACC,KAAK;MAC/BC,YAAY,EAAErB,KAAK,EAAEmB,OAAO,CAACC,KAAK;MAClCE,UAAU,EAAE,CAAC;MACbC,WAAW,EAAE,CAAC;MACdC,YAAY,EAAExB,KAAK,EAAEyB,MAAM,CAACC,IAAI;MAChCC,SAAS,EACP,2EAA2E;MAC7EC,OAAO,EAAE,MAAM;MACfC,aAAa,EAAE,QAAQ;MACvBC,QAAQ,EAAE;IACZ,CAAE;IAAAC,QAAA,eAEFrC,KAAA,CAACX,IAAI;MACHiD,cAAc,EAAE;QACd,GAAGC,MAAM,CAACC,SAAS;QACnBC,WAAW,EAAEnC,KAAK,EAAEmB,OAAO,CAACiB,IAAI;QAChCC,YAAY,EAAErC,KAAK,EAAEmB,OAAO,CAACiB,IAAI;QACjCE,UAAU,EAAEtC,KAAK,EAAEmB,OAAO,CAACoB,IAAI;QAC/BC,aAAa,EAAExC,KAAK,EAAEmB,OAAO,CAACoB,IAAI;QAClCf,YAAY,EAAExB,KAAK,EAAEyB,MAAM,CAACC,IAAI;QAChCe,cAAc,EACZ3C,KAAK,KAAKR,UAAU,CAACoD,OAAO,GAAG1C,KAAK,EAAE2C,KAAK,GAAGtC,UAAU;QAC1DuC,eAAe,EACb9C,KAAK,KAAKR,UAAU,CAACoD,OAAO,GAAG1C,KAAK,EAAE2C,KAAK,GAAGtC,UAAU;QAC1DwC,gBAAgB,EACd/C,KAAK,KAAKR,UAAU,CAACoD,OAAO,GAAG1C,KAAK,EAAE2C,KAAK,GAAGtC,UAAU;QAC1DyC,iBAAiB,EACfhD,KAAK,KAAKR,UAAU,CAACoD,OAAO,GAAG1C,KAAK,EAAE2C,KAAK,GAAGtC,UAAU;QAE1D0C,MAAM,EAAEC,SAAS;QACjBC,QAAQ,EAAED;MACZ,CAAE;MAAAjB,QAAA,gBAEFvC,IAAA;QACEY,KAAK,EAAE;UACL,GAAG6B,MAAM,CAACiB,OAAO;UACjB1B,YAAY,EAAExB,KAAK,EAAEyB,MAAM,CAACC,IAAI;UAChCyB,KAAK,EAAE,QACL,CAAC5C,aAAa,KAAKT,KAAK,KAAKR,UAAU,CAACwB,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,OAEjE,CAACP,aAAa,IAAIT,KAAK,KAAKR,UAAU,CAACwB,SAAS,GAAG,CAAC,GAAG,EAAE,KACtD;UACLsC,eAAe,EAAE,OAAO;UACxBC,WAAW,EAAEhD,UAAU;UACvBiD,eAAe,EAAEhD;QACnB;MAAE,CACE,CAAC,eAEPd,IAAA,CAACT,IAAI,CAACwE,KAAK;QACTC,MAAM,EAAC,MAAM;QACbpD,KAAK,EAAE;UACL,GAAG6B,MAAM,CAACrC,KAAK;UACf6D,QAAQ,EAAEzD,KAAK,EAAE0D,KAAK,CAACC,KAAK;UAC5BC,KAAK,EACH9D,KAAK,KAAKR,UAAU,CAACwB,SAAS,GAC1Bd,KAAK,EAAE6D,KAAK,IAAI,qBAAqB,GACrC7D,KAAK,EAAE8D,gBAAgB,IAAI,qBAAqB;UACtDlC,OAAO,EAAE,MAAM;UACfuB,KAAK,EAAE,MAAM;UACbY,SAAS,EAAE,EAAE;UACbjC,QAAQ,EAAE;QACZ,CAAE;QAAAC,QAAA,EAEDnC;MAAK,CACI,CAAC,eACbJ,IAAA,CAACL,IAAI;QAACiB,KAAK,EAAE;UAAE,GAAG6B,MAAM,CAAC+B,QAAQ;UAAEjB,MAAM,EAAE;QAAG,CAAE;QAAAhB,QAAA,EAC7C,CAAClC,WAAW,IAAI,EAAE,EAAEoE,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,kBAClCzE,KAAA,CAACP,IAAI;UAACiB,KAAK,EAAE;YAAC,GAAG6B,MAAM,CAAC+B,QAAQ;YAAEjB,MAAM,EAAE;UAAE,CAAE;UAAAhB,QAAA,GAC3CoC,KAAK,GAAG,CAAC,iBACR3E,IAAA,CAACR,OAAO;YACNoF,WAAW,EAAC,UAAU;YACtBR,KAAK,EAAE5D,KAAK,EAAEqE,aAAc;YAC5BjE,KAAK,EAAE6B,MAAM,CAACqC;UAAQ,CACvB,CACF,eACD9E,IAAA;YACEY,KAAK,EAAE;cACL,GAAG6B,MAAM,CAACsC,IAAI;cACdd,QAAQ,EAAEzD,KAAK,CAAC0D,KAAK,CAACC,KAAK;cAC3BC,KAAK,EACH9D,KAAK,KAAKR,UAAU,CAACwB,SAAS,GAC1Bd,KAAK,EAAE6D,KAAK,IAAI,qBAAqB,GACrC7D,KAAK,EAAEwE,kBAAkB,IAAI,qBAAqB;cACxDC,UAAU,EAAE,QAAQ;cACpB3C,QAAQ,EAAE,QAAQ;cAClB4C,YAAY,EAAE,UAAU;cACxBC,UAAU,EAAE;YACd,CAAE;YAAA5C,QAAA,EAEDmC;UAAG,CACA,CAAC;QAAA,GAvB2C,mBAAmBC,KAAK,EAwBtE,CACP;MAAC,CACE,CAAC,eACPzE,KAAA,CAACP,IAAI;QAACiB,KAAK,EAAE6B,MAAM,CAAC+B,QAAS;QAAAjC,QAAA,GAC1BjC,KAAK,KAAKR,UAAU,CAACwB,SAAS,iBAC7BtB,IAAA,CAACP,IAAI;UACHmB,KAAK,EAAE;YACL,GAAG6B,MAAM,CAAC2C,MAAM;YAChBhB,KAAK,EAAEvD,UAAU;YACjBoD,QAAQ,EAAEzD,KAAK,CAAC0D,KAAK,CAACmB,KAAK;YAC3BrD,YAAY,EAAExB,KAAK,EAAEyB,MAAM,CAACC,IAAI;YAChCe,cAAc,EAAEpC,UAAU;YAC1BuC,eAAe,EAAEvC,UAAU;YAC3BwC,gBAAgB,EAAExC,UAAU;YAC5ByC,iBAAiB,EAAEzC;UACrB,CAAE;UAAA0B,QAAA,EAED7B,UAAU,GAAGJ,KAAK,CAAC,IAAIA;QAAK,CACzB,CACP,eACDN,IAAA,CAACP,IAAI;UACHmB,KAAK,EAAE;YACL,GAAG6B,MAAM,CAAC6C,aAAa;YACvBxD,UAAU,EAAExB,KAAK,KAAKR,UAAU,CAACwB,SAAS,GAAG,CAAC,GAAG,CAAC;YAClDwC,eAAe,EAAEtD,KAAK,EAAEgB,KAAK,IAAI;UACnC,CAAE;UAAAe,QAAA,eAEFrC,KAAA,CAACP,IAAI;YAACiB,KAAK,EAAE6B,MAAM,CAAC8C,OAAQ;YAAAhD,QAAA,gBAC1BvC,IAAA,CAACH,UAAU;cACTuE,KAAK,EACH9D,KAAK,KAAKR,UAAU,CAACwB,SAAS,GAC1Bd,KAAK,EAAE6D,KAAK,IAAI,qBAAqB,GACrC7D,KAAK,EAAEwE,kBAAkB,IAAI,qBAClC;cACDpE,KAAK,EAAE;gBAAEqD,QAAQ,EAAEzD,KAAK,CAAC0D,KAAK,CAACsB,KAAK;gBAAEzD,WAAW,EAAE;cAAE,CAAE;cACvD0D,IAAI,EAAC;YAAO,CACb,CAAC,eACFzF,IAAA;cACEY,KAAK,EAAE;gBACLqD,QAAQ,EAAEzD,KAAK,CAAC0D,KAAK,CAACC,KAAK;gBAC3BC,KAAK,EACH9D,KAAK,KAAKR,UAAU,CAACwB,SAAS,GAC1Bd,KAAK,EAAE6D,KAAK,IAAI,qBAAqB,GACrC7D,KAAK,EAAEwE,kBAAkB,IAAI,qBAAqB;gBACxDU,UAAU,EAAE,KAAK;gBACjBP,UAAU,EAAE;cACd,CAAE;cAAA5C,QAAA,EAEDjC,KAAK,KAAKR,UAAU,CAACwB,SAAS,GAC3BX,aAAa,IAAIL,KAAK,GACtB,GAAG,CAACS,aAAa,IAAI,CAAC,IAAI,GAAG;YAAG,CAChC,CAAC;UAAA,CACH;QAAC,CACH,CAAC,EACNN,SAAS,IACRkF,KAAK,CAACC,OAAO,CAACnF,SAAS,CAAC,IACxBA,SAAS,CAACoF,MAAM,GAAG,CAAC,IACpBvF,KAAK,KAAKR,UAAU,CAACwB,SAAS,iBAC5BtB,IAAA,CAACP,IAAI;UACHmB,KAAK,EAAE;YACL,GAAG6B,MAAM,CAAC6C,aAAa;YACvBxB,eAAe,EAAEtD,KAAK,EAAEgB,KAAK,IAAI,qBAAqB;YACtDc,QAAQ,EAAE;UACZ,CAAE;UAAAC,QAAA,eAEFrC,KAAA,CAACP,IAAI;YAACiB,KAAK,EAAE6B,MAAM,CAAC8C,OAAQ;YAAAhD,QAAA,gBAC1BvC,IAAA,CAACH,UAAU;cACTuE,KAAK,EAAE5D,KAAK,EAAEwE,kBAAkB,IAAI,qBAAsB;cAC1DpE,KAAK,EAAE;gBAAEqD,QAAQ,EAAEzD,KAAK,CAAC0D,KAAK,CAACsB,KAAK;gBAAEzD,WAAW,EAAE;cAAE,CAAE;cACvD0D,IAAI,EAAC;YAAU,CAChB,CAAC,eACFvF,KAAA;cACEU,KAAK,EAAE;gBACLqD,QAAQ,EAAEzD,KAAK,CAAC0D,KAAK,CAACC,KAAK;gBAC3BC,KAAK,EAAE5D,KAAK,EAAEwE,kBAAkB,IAAI,qBAAqB;gBACzDU,UAAU,EAAE,KAAK;gBACjBT,UAAU,EAAE,QAAQ;gBACpB3C,QAAQ,EAAE,QAAQ;gBAClB4C,YAAY,EAAE,UAAU;gBACxBC,UAAU,EAAE;cACd,CAAE;cAAA5C,QAAA,GAED9B,SAAS,GAAG,CAAC,CAAC,EACdA,SAAS,GAAG,CAAC,CAAC,IAAIA,SAAS,GAAG,CAAC,CAAC,IAAI,KAAK,EACzCA,SAAS,GAAG,CAAC,CAAC;YAAA,CACX,CAAC;UAAA,CACH;QAAC,CACH,CACP;MAAA,CACC,CAAC;IAAA,CACH;EAAC,CACJ,CAAC;AAEV,CAAC;AAED,MAAMgC,MAAM,GAAG7C,UAAU,CAACkG,MAAM,CAAC;EAC/BpC,OAAO,EAAE;IACPqC,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE,CAAC,CAAC;IACVC,GAAG,EAAE,CAAC,EAAE;IACRC,IAAI,EAAE,CAAC,EAAE;IACTC,eAAe,EAAE;EACnB,CAAC;EACD3B,QAAQ,EAAE;IACRpC,OAAO,EAAE,MAAM;IACfgE,QAAQ,EAAE,MAAM;IAChB9D,QAAQ,EAAE,QAAQ;IAClBD,aAAa,EAAE;EACjB,CAAC;EACDkD,OAAO,EAAE;IACPnD,OAAO,EAAE,MAAM;IACfC,aAAa,EAAE;EACjB,CAAC;EACDyC,OAAO,EAAE;IACPhD,UAAU,EAAE,CAAC;IACbC,WAAW,EAAE,CAAC;IACdwC,SAAS,EAAE,CAAC;IACZ7C,SAAS,EAAE;EACb,CAAC;EACDqD,IAAI,EAAE;IACJW,UAAU,EAAE;EACd,CAAC;EACDtF,KAAK,EAAE;IACLiG,SAAS,EAAE,MAAM;IACjBC,MAAM,EAAE,CAAC;IACTZ,UAAU,EAAE;EACd,CAAC;EACDhD,SAAS,EAAE;IACTa,MAAM,EAAE,EAAE;IACVE,QAAQ,EAAE,EAAE;IACZ6C,MAAM,EAAE,CAAC;IACTC,WAAW,EAAE,CAAC;IACdC,WAAW,EAAE,OAAO;IACpBT,QAAQ,EAAE,UAAU;IACpB3D,OAAO,EAAE,MAAM;IACfC,aAAa,EAAE,QAAQ;IACvBoE,QAAQ,EAAE,CAAC;IACXnE,QAAQ,EAAE;EACZ,CAAC;EACD8C,MAAM,EAAE;IACNmB,WAAW,EAAE,CAAC;IACdC,WAAW,EAAE,OAAO;IACpB7D,WAAW,EAAE,CAAC;IACdE,YAAY,EAAE,CAAC;IACfU,MAAM,EAAE,EAAE;IACV7B,SAAS,EAAE,CAAC;IACZgE,UAAU,EAAE;EACd,CAAC;EACDJ,aAAa,EAAE;IACb/B,MAAM,EAAE,EAAE;IACV7B,SAAS,EAAE,CAAC;IACZgE,UAAU,EAAE,KAAK;IACjBtD,OAAO,EAAE,MAAM;IACfC,aAAa,EAAE,QAAQ;IACvBqE,cAAc,EAAE,QAAQ;IACxB5E,UAAU,EAAE,CAAC;IACba,WAAW,EAAE,CAAC;IACdE,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AAEF,eAAenD,SAAS,CAACS,QAAQ,CAAC","ignoreList":[]}

package/package/module/Text/README.md

@@ -0,0 +1,97 @@
+# Text
+
+可交互的文本标签组件，支持选中状态、悬停效果、多种尺寸和两种视觉类型。适用于筛选标签、价格区间选择、分类标签等场景，非通用 Text 组件。
+
+## 功能特性
+
+- ✅ 两种视觉类型：primary（填充灰色背景）和 secondary（边框样式）
+- ✅ 三种尺寸模式：standard (40px) / medium (36px) / small (32px)
+- ✅ 选中状态：primary 变为主题色背景+白字，secondary 显示主题色边框
+- ✅ 鼠标悬停效果（仅 Web 端，Hoverable 实现）
+- ✅ 禁用状态，颜色置灰，渲染为不可交互的 Text
+- ✅ 支持点击事件
+- ✅ 文本单行截断（numberOfLines=1）
+- ✅ 继承 @rneui/themed TextProps
+- ✅ 圆角样式（theme.radius.rounded）
+
+## 安装使用
+
+```tsx
+import Text from '@beppla/tapas-ui/components/Text/Text';
+```
+
+## Props
+
+| 属性 | 类型 | 默认值 | 说明 |
+|------|------|--------|------|
+| children | `React.ReactNode` | - | 文本内容 |
+| mode | `'standard' \| 'medium' \| 'small'` | - | 尺寸模式，影响高度和字号 |
+| type | `'primary' \| 'secondary'` | `'primary'` | 视觉类型 |
+| selected | `boolean` | `false` | 是否选中 |
+| disabled | `boolean` | - | 是否禁用 |
+| onPress | `() => void` | - | 点击回调 |
+| hoverStyle | `StyleProp<ViewStyle>` | - | 自定义悬停样式 |
+| style | 继承自 TextProps | - | 自定义样式 |
+
+## 使用示例
+
+### 基础用法
+
+```tsx
+<Text mode="standard">Hello World</Text>
+```
+
+### 不同尺寸
+
+```tsx
+<Text mode="standard" style={{ width: 200 }}>Standard (40px)</Text>
+<Text mode="medium" style={{ width: 160 }}>Medium (36px)</Text>
+<Text mode="small" style={{ width: 100 }}>Small (32px)</Text>
+```
+
+### Secondary 类型
+
+```tsx
+<Text mode="standard" type="secondary">边框样式</Text>
+<Text mode="medium" type="secondary" selected>选中状态</Text>
+```
+
+### 选中与禁用
+
+```tsx
+<Text mode="small" selected>已选中（Primary）</Text>
+<Text mode="medium" disabled>已禁用</Text>
+<Text mode="small" type="secondary" disabled>禁用边框</Text>
+```
+
+### 带点击事件
+
+```tsx
+<Text mode="standard" onPress={() => console.log('Clicked')}>
+  可点击标签
+</Text>
+```
+
+### 动态选择
+
+```tsx
+const [selected, setSelected] = useState(false);
+
+<Text
+  mode="standard"
+  selected={selected}
+  onPress={() => setSelected(!selected)}
+>
+  切换选择状态
+</Text>
+```
+
+## 注意事项
+
+- 该组件是专用的**标签/筛选按钮组件**，非通用文本渲染组件
+- 禁用状态下不渲染 TouchableOpacity，直接渲染为普通 RNText
+- Web 端通过 Hoverable 实现悬停效果，Native 端无悬停
+- `selected` 状态受外部控制，内部通过 `useEffect` 同步
+- `mode` 属性决定高度和字号：standard=40px、medium=36px、small=32px（small 字号也更小）
+- primary 类型选中时背景变为主色+白字，secondary 类型选中时添加主色边框
+- 组件使用 `@rneui/themed` 主题系统，需在 ThemeProvider 内使用