@beppla/tapas-ui 1.0.67 → 1.0.69

package/module/Toast/Toast.js

@@ -131,7 +131,7 @@ export const Toast = ({
   return visible && renderMessage();
 };
 export default withTheme(Toast);
-//# sourceMappingURL=Toast.js.maps: {
+
       color: theme.colors.success
     },
     Error: {
@@ -205,4 +205,3 @@ var Toast = function (_a) {
 };
 exports.Toast = Toast;
 exports.default = (0, themed_1.withTheme)(exports.Toast);
-//# sourceMappingURL=Toast.js.map

package/module/UserSwitcher/UserSwitcher.js

@@ -1,119 +1,37 @@
-"use strict";
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React, { useEffect, useRef, useState, useCallback } from "react";
+import { Animated, View, Pressable } from "react-native";
+import { withTheme, makeStyles } from "@rneui/themed";
+import TapasButton from "../Button/Button";
+import TapasIcon from "../Icons/TapasIcon";
+import TapasImage from "../Image/Image";
+const TapasUserSwitcher = ({
+  userList = [],
+  isLoggedIn = false,
+  height = 40,
+  currentUserId,
+  avatarType = "svg",
+  loginButtonText = "Login",
+  onUserSwitcherPress,
+  onLoginPress,
+  onUserListChange,
+  animationDuration = 500,
+  style,
+  testID,
+  ...otherProps
+}) => {
+  const styles = useStyles();
+  const [containerWidth, setContainerWidth] = useState(80);
 
-var __assign = this && this.__assign || function () {
-  __assign = Object.assign || function (t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-    }
-    return t;
-  };
-  return __assign.apply(this, arguments);
-};
-var __createBinding = this && this.__createBinding || (Object.create ? function (o, m, k, k2) {
-  if (k2 === undefined) k2 = k;
-  var desc = Object.getOwnPropertyDescriptor(m, k);
-  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-    desc = {
-      enumerable: true,
-      get: function () {
-        return m[k];
-      }
-    };
-  }
-  Object.defineProperty(o, k2, desc);
-} : function (o, m, k, k2) {
-  if (k2 === undefined) k2 = k;
-  o[k2] = m[k];
-});
-var __setModuleDefault = this && this.__setModuleDefault || (Object.create ? function (o, v) {
-  Object.defineProperty(o, "default", {
-    enumerable: true,
-    value: v
-  });
-} : function (o, v) {
-  o["default"] = v;
-});
-var __importStar = this && this.__importStar || function () {
-  var ownKeys = function (o) {
-    ownKeys = Object.getOwnPropertyNames || function (o) {
-      var ar = [];
-      for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-      return ar;
-    };
-    return ownKeys(o);
-  };
-  return function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-    __setModuleDefault(result, mod);
-    return result;
-  };
-}();
-var __rest = this && this.__rest || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
-};
-var __spreadArray = this && this.__spreadArray || function (to, from, pack) {
-  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-    if (ar || !(i in from)) {
-      if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-      ar[i] = from[i];
-    }
-  }
-  return to.concat(ar || Array.prototype.slice.call(from));
-};
-var __importDefault = this && this.__importDefault || function (mod) {
-  return mod && mod.__esModule ? mod : {
-    "default": mod
-  };
-};
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TapasUserSwitcher = exports.UserSwitcher = void 0;
-var react_1 = __importStar(require("react"));
-var react_native_1 = require("react-native");
-var themed_1 = require("@rneui/themed");
-var Button_1 = __importDefault(require("../Button/Button"));
-var TapasIcon_1 = __importDefault(require("../Icons/TapasIcon"));
-var Image_1 = __importDefault(require("../Image/Image"));
-var TapasUserSwitcher = function (_a) {
-  var _b = _a.userList,
-    userList = _b === void 0 ? [] : _b,
-    _c = _a.isLoggedIn,
-    isLoggedIn = _c === void 0 ? false : _c,
-    _d = _a.height,
-    height = _d === void 0 ? 40 : _d,
-    currentUserId = _a.currentUserId,
-    _e = _a.avatarType,
-    avatarType = _e === void 0 ? "svg" : _e,
-    _f = _a.loginButtonText,
-    loginButtonText = _f === void 0 ? "Login" : _f,
-    onUserSwitcherPress = _a.onUserSwitcherPress,
-    onLoginPress = _a.onLoginPress,
-    onUserListChange = _a.onUserListChange,
-    _g = _a.animationDuration,
-    animationDuration = _g === void 0 ? 500 : _g,
-    style = _a.style,
-    testID = _a.testID,
-    otherProps = __rest(_a, ["userList", "isLoggedIn", "height", "currentUserId", "avatarType", "loginButtonText", "onUserSwitcherPress", "onLoginPress", "onUserListChange", "animationDuration", "style", "testID"]);
-  var styles = useStyles();
-  var _h = (0, react_1.useState)(80),
-    containerWidth = _h[0],
-    setContainerWidth = _h[1];
   // 动画相关
-  var fadeAnim = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
-  var scaleAnim = (0, react_1.useRef)(new react_native_1.Animated.Value(0.9)).current;
+  const fadeAnim = useRef(new Animated.Value(0)).current;
+  const scaleAnim = useRef(new Animated.Value(0.9)).current;
+
   // 头像尺寸配置
-  var avatarSizes = [40, 32, 24];
+  const avatarSizes = [40, 32, 24];
+
   // 根据用户数量计算容器宽度
-  (0, react_1.useEffect)(function () {
+  useEffect(() => {
     if (userList.length >= 3) {
       setContainerWidth(68);
     } else if (userList.length === 2) {
@@ -122,8 +40,9 @@ var TapasUserSwitcher = function (_a) {
       setContainerWidth(40);
     }
   }, [userList.length]);
+
   // 当前用户ID改变时触发动画
-  (0, react_1.useEffect)(function () {
+  useEffect(() => {
     // 在测试环境中跳过动画以避免 act() 警告
     if (process.env.NODE_ENV === 'test') {
       fadeAnim.setValue(1);
@@ -132,43 +51,165 @@ var TapasUserSwitcher = function (_a) {
     }
     fadeAnim.setValue(0);
     scaleAnim.setValue(0.9);
-    react_native_1.Animated.parallel([react_native_1.Animated.timing(fadeAnim, {
+    Animated.parallel([Animated.timing(fadeAnim, {
       toValue: 1,
       duration: animationDuration,
       useNativeDriver: true
-    }), react_native_1.Animated.timing(scaleAnim, {
+    }), Animated.timing(scaleAnim, {
       toValue: 1,
       duration: animationDuration,
       useNativeDriver: true
     })]).start();
   }, [currentUserId, animationDuration]);
+
   // 将当前用户移动到列表前面
-  var moveUserToFront = (0, react_1.useCallback)(function (users, userId) {
-    var currentUserIndex = users.findIndex(function (user) {
-      return user.id === userId;
-    });
+  const moveUserToFront = useCallback((users, userId) => {
+    const currentUserIndex = users.findIndex(user => user.id === userId);
     if (currentUserIndex === -1) return users;
-    var currentUser = users[currentUserIndex];
+    const currentUser = users[currentUserIndex];
     if (!currentUser) return users;
-    var otherUsers = users.filter(function (user) {
-      return user.id !== userId;
-    });
-    return __spreadArray([currentUser], otherUsers, true);
+    const otherUsers = users.filter(user => user.id !== userId);
+    return [currentUser, ...otherUsers];
   }, []);
+
   // 获取要显示的用户列表（最多3个）
-  var getDisplayUsers = (0, react_1.useCallback)(function () {
-    var orderedUsers = currentUserId ? moveUserToFront(userList, currentUserId) : userList;
+  const getDisplayUsers = useCallback(() => {
+    const orderedUsers = currentUserId ? moveUserToFront(userList, currentUserId) : userList;
     return orderedUsers.slice(0, 3);
   }, [userList, currentUserId, moveUserToFront]);
+
   // 处理用户切换器点击
-  var handleUserSwitcherPress = (0, react_1.useCallback)(function () {
-    onUserSwitcherPress === null || onUserSwitcherPress === void 0 ? void 0 : onUserSwitcherPress();
+  const handleUserSwitcherPress = useCallback(() => {
+    onUserSwitcherPress?.();
   }, [onUserSwitcherPress]);
+
   // 处理登录按钮点击
-  var handleLoginPress = (0, react_1.useCallback)(function () {
-    onLoginPress === null || onLoginPress === void 0 ? void 0 : onLoginPress();
+  const handleLoginPress = useCallback(() => {
+    onLoginPress?.();
   }, [onLoginPress]);
+
   // 渲染头像
+  const renderAvatar = useCallback((user, index) => {
+    const size = avatarSizes[index] || 40;
+    const leftPosition = index === 0 ? 0 : index === 1 ? 24 : 44;
+    const zIndex = 10 - index * 2;
+    const opacity = 1 - index * 0.15;
+    const avatarContainerStyle = [styles.avatarContainer, {
+      left: leftPosition,
+      width: size,
+      height: size,
+      borderRadius: size / 2,
+      zIndex,
+      opacity
+    }];
+    if (user.avatar) {
+      return /*#__PURE__*/React.createElement(View, {
+        key: user.id || `user-${index}`,
+        style: avatarContainerStyle
+      }, avatarType === "svg" ? /*#__PURE__*/React.createElement(View, {
+        style: {
+          width: size,
+          height: size,
+          backgroundColor: '#f0f0f0',
+          borderRadius: size / 2
+        },
+        testID: "svg-avatar"
+      }, /*#__PURE__*/React.createElement(TapasIcon, {
+        name: "user",
+        size: size * 0.6,
+        color: "#666"
+      })) : /*#__PURE__*/React.createElement(TapasImage, {
+        width: size,
+        height: size,
+        radius: true,
+        uri: user.avatar
+      }));
+    }
+
+    // 默认头像
+    return /*#__PURE__*/React.createElement(View, {
+      key: user.id || `user-${index}`,
+      style: avatarContainerStyle
+    }, /*#__PURE__*/React.createElement(View, {
+      style: [styles.defaultAvatarBackground, {
+        opacity
+      }]
+    }, /*#__PURE__*/React.createElement(TapasIcon, {
+      style: styles.defaultAvatarIcon,
+      size: size / 2,
+      color: "#999",
+      name: "person"
+    })));
+  }, [avatarType, styles]);
+
+  // 渲染用户列表
+  const renderUserList = useCallback(() => {
+    const displayUsers = getDisplayUsers();
+    return /*#__PURE__*/React.createElement(Pressable, {
+      style: [styles.userListContainer, {
+        height
+      }],
+      onPress: handleUserSwitcherPress,
+      testID: testID
+    }, displayUsers.map((user, index) => renderAvatar(user, index)));
+  }, [getDisplayUsers, height, handleUserSwitcherPress, renderAvatar, styles, testID]);
+  return /*#__PURE__*/React.createElement(View, _extends({}, otherProps, {
+    style: [styles.container, {
+      height,
+      width: isLoggedIn ? containerWidth : "auto"
+    }, style]
+  }), /*#__PURE__*/React.createElement(Animated.View, {
+    style: {
+      opacity: fadeAnim,
+      transform: [{
+        scale: scaleAnim
+      }]
+    }
+  }, isLoggedIn ? renderUserList() : /*#__PURE__*/React.createElement(TapasButton, {
+    onPress: handleLoginPress
+  }, loginButtonText)));
+};
+const useStyles = makeStyles(theme => ({
+  container: {
+    display: "flex",
+    height: 40,
+    alignSelf: "center"
+  },
+  userListContainer: {
+    display: "flex",
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "center",
+    height: 40,
+    position: "relative"
+  },
+  avatarContainer: {
+    display: "flex",
+    position: "absolute",
+    flexDirection: "column",
+    justifyContent: "center",
+    overflow: "hidden",
+    zIndex: 1
+  },
+  defaultAvatarBackground: {
+    display: "flex",
+    flexGrow: 1,
+    borderRadius: 20,
+    justifyContent: "center",
+    flexDirection: "column",
+    backgroundColor: theme.colors.grey2
+  },
+  defaultAvatarIcon: {
+    display: "flex",
+    alignSelf: "center"
+  }
+}));
+export default withTheme(TapasUserSwitcher);
+
+// Export aliases for compatibility
+export const UserSwitcher = withTheme(TapasUserSwitcher);
+export { TapasUserSwitcher };
+
   var renderAvatar = (0, react_1.useCallback)(function (user, index) {
     var size = avatarSizes[index] || 40;
     var leftPosition = index === 0 ? 0 : index === 1 ? 24 : 44;
@@ -290,4 +331,3 @@ var useStyles = (0, themed_1.makeStyles)(function (theme) {
 exports.default = (0, themed_1.withTheme)(TapasUserSwitcher);
 // Export aliases for compatibility
 exports.UserSwitcher = (0, themed_1.withTheme)(TapasUserSwitcher);
-//# sourceMappingURL=UserSwitcher.js.map

package/module/UserSwitcher/index.js

@@ -1,8 +1,6 @@
-"use strict";
+export { default } from './UserSwitcher';
+export { UserSwitcher, TapasUserSwitcher } from './UserSwitcher';
 
-var __importDefault = this && this.__importDefault || function (mod) {
-  return mod && mod.__esModule ? mod : {
-    "default": mod
   };
 };
 Object.defineProperty(exports, "__esModule", {
@@ -29,4 +27,3 @@ Object.defineProperty(exports, "TapasUserSwitcher", {
     return UserSwitcher_2.TapasUserSwitcher;
   }
 });
-//# sourceMappingURL=index.js.map

package/module/common.js

@@ -1,13 +1,13 @@
-import { Platform } from "react-native";
-export const isMobile = Platform.OS !== 'web' || Platform.OS === 'web' && typeof window !== 'undefined' && window?.innerWidth <= 430;
-export const capitalizeFirstLetter = str => {
-  if (!str) return '';
-  return str.charAt(0).toUpperCase() + str.slice(1);
-};
-//# sourceMappingURL=common.js.map|| window === void 0 ? void 0 : window.innerWidth) <= 430;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.capitalizeFirstLetter = exports.isMobile = void 0;
+var react_native_1 = require("react-native");
+exports.isMobile = react_native_1.Platform.OS !== 'web' || react_native_1.Platform.OS === 'web' && typeof window !== 'undefined' && (window === null || window === void 0 ? void 0 : window.innerWidth) <= 430;
 var capitalizeFirstLetter = function (str) {
   if (!str) return '';
   return str.charAt(0).toUpperCase() + str.slice(1);
 };
 exports.capitalizeFirstLetter = capitalizeFirstLetter;
-//# sourceMappingURL=common.js.map