@smart-link/rn-im 1.0.23 → 1.0.26

package/dist/pages/message/components/MessageOption.js

@@ -1,27 +1,3 @@
-"use strict";
-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 (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -31,38 +7,34 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const clipboard_1 = __importDefault(require("@react-native-clipboard/clipboard"));
-const im_base_1 = require("@smart-link/im-base");
-const AntDesign_1 = __importDefault(require("react-native-vector-icons/AntDesign"));
-const FontAwesome5_1 = __importDefault(require("react-native-vector-icons/FontAwesome5"));
-const MaterialCommunityIcons_1 = __importDefault(require("react-native-vector-icons/MaterialCommunityIcons"));
-const FontAwesome_1 = __importDefault(require("react-native-vector-icons/FontAwesome"));
-const MaterialIcons_1 = __importDefault(require("react-native-vector-icons/MaterialIcons"));
-const rn_ui_1 = require("@smart-link/rn-ui");
-const useTranslation_1 = __importDefault(require("../../../hooks/useTranslation"));
-const common_action_sheet_1 = require("../../../utils/common-action-sheet");
-const init_1 = require("../../../init");
-const elements_1 = require("@react-navigation/elements");
-const useImSelector_1 = require("../../../hooks/useImSelector");
-const file_1 = require("../../../utils/file");
-const ReceiptBack_1 = require("../../../pages/message/components/ReceiptBack");
+import React, { memo, useRef } from 'react';
+import { Animated, Text, StyleSheet, TouchableOpacity, View, TouchableWithoutFeedback, Dimensions, StatusBar, Modal, } from 'react-native';
+import Clipboard from '@react-native-clipboard/clipboard';
+import { getMessageActionKeys, MessageActions, MessagePanelActions, MessageStatus, PayloadType, ConversationType, } from '@smart-link/im-base';
+import AntDesign from 'react-native-vector-icons/AntDesign';
+import FontAwesome5 from 'react-native-vector-icons/FontAwesome5';
+import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
+import FontAwesome from 'react-native-vector-icons/FontAwesome';
+import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
+import { dp, Toast, useNavigation, Modal as Dialog } from '@smart-link/rn-ui';
+import useTranslation from '../../../hooks/useTranslation';
+import { ConfirmActionSheet } from '../../../utils/common-action-sheet';
+import { getImManager } from '../../../init';
+import { useHeaderHeight } from '@react-navigation/elements';
+import { usePanel } from '../../../hooks/useImSelector';
+import { saveToAlbum } from '../../../utils/file';
+import { ReceiptBack } from "../../../pages/message/components/ReceiptBack";
 const getMessageAction = (t, message, navigation, setLoading) => {
     if (!message)
         return [];
-    const actions = (0, im_base_1.getMessageActionKeys)(message.payloadType);
+    const actions = getMessageActionKeys(message.payloadType);
     const items = [
         {
             key: 'copy',
             title: t('copy'),
-            icon: <AntDesign_1.default name="copy1" size={(0, rn_ui_1.dp)(20)} color={'#333'}/>,
+            icon: <AntDesign name="copy1" size={dp(20)} color={'#333'}/>,
             onPress: () => {
-                clipboard_1.default.setString(message.payload.text);
+                Clipboard.setString(message.payload.text);
             },
         },
         // {
@@ -76,28 +48,28 @@ const getMessageAction = (t, message, navigation, setLoading) => {
         {
             key: 'forward',
             title: t('forward'),
-            icon: <FontAwesome5_1.default name="reply" size={(0, rn_ui_1.dp)(19)} color={'#333'}/>,
+            icon: <FontAwesome5 name="reply" size={dp(19)} color={'#333'}/>,
             onPress: () => {
-                (0, init_1.getImManager)().store.dispatch(im_base_1.MessageActions.setForwardMessage(message));
+                getImManager().store.dispatch(MessageActions.setForwardMessage(message));
                 navigation.navigate('ForwardToConversation');
             },
         },
         {
             key: 'delete',
             title: t('delete'),
-            icon: <MaterialCommunityIcons_1.default name="delete-forever" size={(0, rn_ui_1.dp)(23)} color={'#333'}/>,
+            icon: <MaterialCommunityIcons name="delete-forever" size={dp(23)} color={'#333'}/>,
             onPress: () => {
-                (0, common_action_sheet_1.ConfirmActionSheet)(t('confirmDeleteMessage'), () => __awaiter(void 0, void 0, void 0, function* () {
-                    yield (0, init_1.getImManager)().deleteMessage(message);
+                ConfirmActionSheet(t('confirmDeleteMessage'), () => __awaiter(void 0, void 0, void 0, function* () {
+                    yield getImManager().deleteMessage(message);
                 }), t);
             },
         },
         {
             key: 'reply',
             title: t('reply'),
-            icon: <MaterialCommunityIcons_1.default name="message-processing" size={(0, rn_ui_1.dp)(20)} color={'#333'}/>,
+            icon: <MaterialCommunityIcons name="message-processing" size={dp(20)} color={'#333'}/>,
             onPress: () => {
-                const imManager = (0, init_1.getImManager)();
+                const imManager = getImManager();
                 imManager.replyMessage(message);
                 setTimeout(() => {
                     var _a, _b;
@@ -116,17 +88,17 @@ const getMessageAction = (t, message, navigation, setLoading) => {
         {
             key: 'undo',
             title: t('undo'),
-            icon: <FontAwesome_1.default name="undo" size={(0, rn_ui_1.dp)(20)} color={'#333'}/>,
+            icon: <FontAwesome name="undo" size={dp(20)} color={'#333'}/>,
             onPress: () => __awaiter(void 0, void 0, void 0, function* () {
-                (0, common_action_sheet_1.ConfirmActionSheet)(t('confirmUndoMessage'), () => __awaiter(void 0, void 0, void 0, function* () {
+                ConfirmActionSheet(t('confirmUndoMessage'), () => __awaiter(void 0, void 0, void 0, function* () {
                     try {
                         setLoading(true);
-                        yield (0, init_1.getImManager)().undoMessage(message);
+                        yield getImManager().undoMessage(message);
                         setLoading(false);
                     }
                     catch (e) {
                         setLoading(false);
-                        rn_ui_1.Toast.error(t('undoFail'));
+                        Toast.error(t('undoFail'));
                     }
                 }), t);
             }),
@@ -134,10 +106,10 @@ const getMessageAction = (t, message, navigation, setLoading) => {
         {
             key: 'feedback',
             title: t('feedback'),
-            icon: <MaterialIcons_1.default name="feedback" size={(0, rn_ui_1.dp)(20)} color={'#333'}/>,
+            icon: <MaterialIcons name="feedback" size={dp(20)} color={'#333'}/>,
             onPress: () => __awaiter(void 0, void 0, void 0, function* () {
-                rn_ui_1.Modal.open({
-                    content: <ReceiptBack_1.ReceiptBack message={message}/>,
+                Dialog.open({
+                    content: <ReceiptBack message={message}/>,
                     maskClosable: true,
                     footer: {
                         cancelButton: false,
@@ -149,34 +121,38 @@ const getMessageAction = (t, message, navigation, setLoading) => {
         {
             key: 'collect',
             title: t('collect'),
-            icon: <FontAwesome_1.default name="star" size={(0, rn_ui_1.dp)(20)} color={'#333'}/>,
+            icon: <FontAwesome name="star" size={dp(20)} color={'#333'}/>,
             onPress: () => {
-                (0, init_1.getImManager)().collectMessage(message);
+                getImManager().collectMessage(message);
             },
         },
         {
             key: 'saveToAlbum',
             title: t('savePicture'),
-            icon: <AntDesign_1.default name="save" size={(0, rn_ui_1.dp)(20)} color={'#333'}/>,
+            icon: <AntDesign name="save" size={dp(20)} color={'#333'}/>,
             onPress: () => __awaiter(void 0, void 0, void 0, function* () {
-                yield (0, file_1.saveToAlbum)((0, init_1.getImManager)(), localPath);
+                yield saveToAlbum(getImManager(), localPath);
             }),
         },
         {
             key: 'download',
             title: t('download'),
-            icon: <AntDesign_1.default name="download" size={(0, rn_ui_1.dp)(20)} color={'#333'}/>,
+            icon: <AntDesign name="download" size={dp(20)} color={'#333'}/>,
             onPress: () => __awaiter(void 0, void 0, void 0, function* () {
-                const imManager = (0, init_1.getImManager)();
-                imManager.store.dispatch(im_base_1.MessagePanelActions.downloadFile(imManager, message));
+                const imManager = getImManager();
+                imManager.store.dispatch(MessagePanelActions.downloadFile(imManager, message, () => {
+                    Toast.success(t('downloaded'));
+                }, () => {
+                    Toast.error(t('downloadError'));
+                }));
             }),
         },
         {
             key: 'multiple',
             title: t('multiple'),
-            icon: <MaterialCommunityIcons_1.default name="playlist-check" size={(0, rn_ui_1.dp)(22)} color={'#333'}/>,
+            icon: <MaterialCommunityIcons name="playlist-check" size={dp(22)} color={'#333'}/>,
             onPress: () => {
-                (0, init_1.getImManager)().store.dispatch(im_base_1.MessagePanelActions.startMultipleSelect(message));
+                getImManager().store.dispatch(MessagePanelActions.startMultipleSelect(message));
             },
         },
     ];
@@ -186,72 +162,72 @@ const getMessageAction = (t, message, navigation, setLoading) => {
     // avatars,
     // text,
     localPath, }, conversationId, conversationType, } = message;
-    const imManager = (0, init_1.getImManager)();
+    const imManager = getImManager();
     return items.filter(item => {
         const { key } = item;
         //if (isMyMessage && key === 'reply') return false;
-        if (messageStatus === im_base_1.MessageStatus.EMITTING) {
+        if (messageStatus === MessageStatus.EMITTING) {
             return false;
         }
         if ((!isMyMessage ||
-            messageStatus === im_base_1.MessageStatus.EMIT_ERROR ||
+            messageStatus === MessageStatus.EMIT_ERROR ||
             new Date().getTime() - messageTime > imManager.undoLimitTime) &&
             key === 'undo')
             return false;
-        if (payloadType === im_base_1.PayloadType.FILE && localPath && key === 'download') {
+        if (payloadType === PayloadType.FILE && localPath && key === 'download') {
             return false;
         }
-        if ((!isMyMessage || conversationType !== im_base_1.ConversationType.C2C) && key === 'feedback') {
+        if ((!isMyMessage || conversationType !== ConversationType.C2C) && key === 'feedback') {
             return false;
         }
         return actions.includes(item.key);
     });
 };
 const renderOperations = (items, close) => {
-    return (<react_native_1.View style={styles.operationWrap}>
+    return (<View style={styles.operationWrap}>
             {items.map((item, index) => {
-            return (<react_native_1.TouchableOpacity key={index} onPress={() => {
+            return (<TouchableOpacity key={index} onPress={() => {
                     item.onPress && item.onPress();
                     close && close();
                 }}>
-                        <react_native_1.View style={styles.operationItem}>
+                        <View style={styles.operationItem}>
                             {item.icon}
-                            <react_native_1.Text style={styles.operationText}>{item.title}</react_native_1.Text>
-                        </react_native_1.View>
-                    </react_native_1.TouchableOpacity>);
+                            <Text style={styles.operationText}>{item.title}</Text>
+                        </View>
+                    </TouchableOpacity>);
         })}
-        </react_native_1.View>);
+        </View>);
 };
-const MessageOption = ({ visible, message, nativeEvent, onClose, setLoading }) => {
+const MessageOption = ({ visible, message, nativeEventLayout, touchPoint, onClose, setLoading }) => {
     var _a;
-    const { t } = (0, useTranslation_1.default)();
-    const headerHeight = (0, elements_1.useHeaderHeight)();
-    const { messageBarHeight } = (0, useImSelector_1.usePanel)();
-    const navigation = (0, rn_ui_1.useNavigation)();
+    const { t } = useTranslation();
+    const headerHeight = useHeaderHeight();
+    const { messageBarHeight } = usePanel();
+    const navigation = useNavigation();
     const items = getMessageAction(t, message, navigation, setLoading);
-    const translateX = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
-    const translateY = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
-    const scale = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
-    const opacity = (0, react_1.useRef)(new react_native_1.Animated.Value(0)).current;
-    const { width: screenWidth, height: screenHeight } = react_native_1.Dimensions.get('window');
-    const padding = (0, rn_ui_1.dp)(12);
+    const translateX = useRef(new Animated.Value(0)).current;
+    const translateY = useRef(new Animated.Value(0)).current;
+    const scale = useRef(new Animated.Value(0)).current;
+    const opacity = useRef(new Animated.Value(0)).current;
+    const { width: screenWidth, height: screenHeight } = Dimensions.get('window');
+    const padding = dp(12);
     // 视窗范围
     const displayArea = {
         x: padding,
         y: padding,
         width: screenWidth - padding * 2,
-        height: screenHeight - headerHeight - messageBarHeight - ((_a = react_native_1.StatusBar.currentHeight) !== null && _a !== void 0 ? _a : 0) - padding * 2,
+        height: screenHeight - headerHeight - messageBarHeight - ((_a = StatusBar.currentHeight) !== null && _a !== void 0 ? _a : 0) - padding * 2,
     };
     const showAnimation = (x, y) => {
         translateX.setValue(x);
         translateY.setValue(y);
-        react_native_1.Animated.parallel([
-            react_native_1.Animated.timing(scale, {
+        Animated.parallel([
+            Animated.timing(scale, {
                 toValue: 1,
                 duration: 150,
                 useNativeDriver: true,
             }),
-            react_native_1.Animated.timing(opacity, {
+            Animated.timing(opacity, {
                 toValue: 1,
                 duration: 150,
                 useNativeDriver: true,
@@ -259,13 +235,13 @@ const MessageOption = ({ visible, message, nativeEvent, onClose, setLoading }) =
         ]).start();
     };
     const hideAnimation = () => {
-        react_native_1.Animated.parallel([
-            react_native_1.Animated.timing(scale, {
+        Animated.parallel([
+            Animated.timing(scale, {
                 toValue: 0,
                 duration: 150,
                 useNativeDriver: true,
             }),
-            react_native_1.Animated.timing(opacity, {
+            Animated.timing(opacity, {
                 toValue: 0,
                 duration: 150,
                 useNativeDriver: true,
@@ -282,20 +258,17 @@ const MessageOption = ({ visible, message, nativeEvent, onClose, setLoading }) =
         const { width: contentWidth, height: contentHeight } = e.nativeEvent.layout;
         // 计算操作项的显示位置
         // 判断点击位置是否存在
-        if (nativeEvent) {
-            // 测量点击位置的元素
-            // @ts-ignore
-            react_native_1.UIManager.measure(nativeEvent.target, (x, y, width, height, pageX, pageY) => {
-                console.log('measure', x, y, width, height, pageX, pageY);
-                let targetY = 0;
-                if (pageY + height + contentHeight > displayArea.height) {
-                    targetY = pageY - contentHeight;
-                }
-                else {
-                    targetY = pageY + height;
-                }
-                showAnimation(displayArea.x + displayArea.width - contentWidth, targetY);
-            });
+        if (nativeEventLayout && touchPoint) {
+            const { height } = nativeEventLayout;
+            const { x, y } = touchPoint;
+            let safePageY = !isNaN(y) ? y : displayArea.y;
+            let targetY = safePageY + height + contentHeight > displayArea.height
+                ? safePageY - contentHeight
+                : safePageY + height;
+            let targetX = x + contentWidth > displayArea.width
+                ? displayArea.width - contentWidth
+                : x;
+            showAnimation(targetX, targetY);
         }
         else {
             showAnimation(displayArea.x + displayArea.width - contentWidth, displayArea.y + displayArea.height / 2 - contentHeight / 2);
@@ -306,11 +279,11 @@ const MessageOption = ({ visible, message, nativeEvent, onClose, setLoading }) =
     };
     if (!items.length)
         return null;
-    return (<react_native_1.Modal visible={visible} transparent onRequestClose={onHide}>
-            <react_native_1.TouchableWithoutFeedback onPress={onHide}>
-                <react_native_1.View style={react_native_1.StyleSheet.absoluteFill}/>
-            </react_native_1.TouchableWithoutFeedback>
-            <react_native_1.Animated.View style={[
+    return (<Modal visible={visible} transparent onRequestClose={onHide}>
+            <TouchableWithoutFeedback onPress={onHide}>
+                <View style={StyleSheet.absoluteFill}/>
+            </TouchableWithoutFeedback>
+            <Animated.View style={[
             styles.popWrap,
             {
                 transform: [
@@ -328,19 +301,19 @@ const MessageOption = ({ visible, message, nativeEvent, onClose, setLoading }) =
             },
         ]} onLayout={onLayout}>
                 {renderOperations(items, onClose)}
-            </react_native_1.Animated.View>
-        </react_native_1.Modal>);
+            </Animated.View>
+        </Modal>);
 };
-const styles = react_native_1.StyleSheet.create({
+const styles = StyleSheet.create({
     popWrap: {
-        maxWidth: (0, rn_ui_1.dp)(280),
-        borderRadius: (0, rn_ui_1.dp)(5),
-        paddingTop: (0, rn_ui_1.dp)(10),
+        maxWidth: dp(280),
+        borderRadius: dp(5),
+        paddingTop: dp(10),
         backgroundColor: '#fff',
         shadowOffset: { width: 1, height: 2 },
         shadowColor: 'rgba(0, 0, 0, 0.1)',
         shadowOpacity: 1,
-        shadowRadius: (0, rn_ui_1.dp)(5),
+        shadowRadius: dp(5),
         elevation: 10,
     },
     operationWrap: {
@@ -348,16 +321,16 @@ const styles = react_native_1.StyleSheet.create({
         flexWrap: 'wrap',
     },
     operationItem: {
-        width: (0, rn_ui_1.dp)(272 / 4),
-        height: (0, rn_ui_1.dp)(40),
-        paddingHorizontal: (0, rn_ui_1.dp)(2),
+        width: dp(272 / 4),
+        height: dp(40),
+        paddingHorizontal: dp(2),
         justifyContent: 'space-between',
         alignItems: 'center',
-        marginBottom: (0, rn_ui_1.dp)(10),
+        marginBottom: dp(10),
     },
     operationText: {
-        fontSize: (0, rn_ui_1.dp)(12),
-        lineHeight: (0, rn_ui_1.dp)(15),
+        fontSize: dp(12),
+        lineHeight: dp(15),
     },
 });
-exports.default = (0, react_1.memo)(MessageOption);
+export default memo(MessageOption);

package/dist/pages/message/components/MessagePayload.d.ts

@@ -3,13 +3,14 @@ import { IMessage } from '@smart-link/im-base';
 import { StyleProp } from 'react-native';
 import { ViewStyle } from 'react-native/Libraries/StyleSheet/StyleSheetTypes';
 import { GestureResponderEvent } from 'react-native/Libraries/Types/CoreEventTypes';
+import { NativeEventLayout } from "../../types";
 export interface MessagePayloadProps extends IMessage {
     style?: StyleProp<ViewStyle>;
     direction?: 'left' | 'right';
     showArrow?: boolean;
     isRecord?: boolean;
     onPress?: (e: GestureResponderEvent) => void;
-    onLongPress?: (e: GestureResponderEvent) => void;
+    onLongPress?: (e: GestureResponderEvent, layout: NativeEventLayout) => void;
     onLoad?: (localPath: string) => void;
 }
 declare const _default: React.NamedExoticComponent<MessagePayloadProps>;

package/dist/pages/message/components/MessagePayload.js

@@ -1,27 +1,3 @@
-"use strict";
-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 (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __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)
@@ -33,64 +9,60 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
-const im_base_1 = require("@smart-link/im-base");
-const react_native_1 = require("react-native");
-const PayloadContact_1 = __importDefault(require("./Payload/PayloadContact"));
-const PayloadFile_1 = __importDefault(require("./Payload/PayloadFile"));
-const PayloadPicture_1 = __importDefault(require("./Payload/PayloadPicture"));
-const PayloadVoice_1 = __importDefault(require("./Payload/PayloadVoice"));
-const PayloadVideo_1 = __importDefault(require("./Payload/PayloadVideo"));
-const PayloadText_1 = __importDefault(require("./Payload/PayloadText"));
-const styles_1 = require("../../../components/styles");
-const useTranslation_1 = __importDefault(require("../../../hooks/useTranslation"));
-const PayloadMultiple_1 = __importDefault(require("./Payload/PayloadMultiple"));
-const PayloadWrapper_1 = __importDefault(require("./Payload/PayloadWrapper"));
-const PayloadShare_1 = __importDefault(require("../../../pages/message/components/Payload/PayloadShare"));
+import React, { memo } from 'react';
+import { PayloadType } from '@smart-link/im-base';
+import { Text } from 'react-native';
+import PayloadContact from './Payload/PayloadContact';
+import PayloadFile from './Payload/PayloadFile';
+import PayloadPicture from './Payload/PayloadPicture';
+import PayloadVoice from './Payload/PayloadVoice';
+import PayloadVideo from './Payload/PayloadVideo';
+import PayloadText from './Payload/PayloadText';
+import { plain } from '../../../components/styles';
+import useTranslation from '../../../hooks/useTranslation';
+import PayloadMultiple from './Payload/PayloadMultiple';
+import PayloadWrapper from './Payload/PayloadWrapper';
+import PayloadShare from "../../../pages/message/components/Payload/PayloadShare";
 const MessagePayload = props => {
     const { style: outStyle } = props, retProps = __rest(props, ["style"]);
-    const { t } = (0, useTranslation_1.default)();
+    const { t } = useTranslation();
     const payloadType = props.payloadType;
-    const noStylePayloadType = [im_base_1.PayloadType.PICTURE, im_base_1.PayloadType.VIDEO];
+    const noStylePayloadType = [PayloadType.PICTURE, PayloadType.VIDEO];
     const style = !noStylePayloadType.includes(payloadType) ? outStyle : [];
     const mergeProps = Object.assign(Object.assign({}, retProps), { style });
     let content;
     switch (payloadType) {
-        case im_base_1.PayloadType.TEXT:
-            content = <PayloadText_1.default {...mergeProps}/>;
+        case PayloadType.TEXT:
+            content = <PayloadText {...mergeProps}/>;
             break;
-        case im_base_1.PayloadType.PICTURE:
-            content = <PayloadPicture_1.default {...mergeProps}/>;
+        case PayloadType.PICTURE:
+            content = <PayloadPicture {...mergeProps}/>;
             break;
-        case im_base_1.PayloadType.VOICE:
-            content = <PayloadVoice_1.default {...mergeProps}/>;
+        case PayloadType.VOICE:
+            content = <PayloadVoice {...mergeProps}/>;
             break;
-        case im_base_1.PayloadType.VIDEO:
-            content = <PayloadVideo_1.default {...mergeProps}/>;
+        case PayloadType.VIDEO:
+            content = <PayloadVideo {...mergeProps}/>;
             break;
-        case im_base_1.PayloadType.FILE:
-            content = <PayloadFile_1.default {...mergeProps}/>;
+        case PayloadType.FILE:
+            content = <PayloadFile {...mergeProps}/>;
             break;
-        case im_base_1.PayloadType.CONTACT:
-            content = <PayloadContact_1.default {...mergeProps}/>;
+        case PayloadType.CONTACT:
+            content = <PayloadContact {...mergeProps}/>;
             break;
-        case im_base_1.PayloadType.MULTIPLE:
-            content = <PayloadMultiple_1.default {...mergeProps}/>;
+        case PayloadType.MULTIPLE:
+            content = <PayloadMultiple {...mergeProps}/>;
             break;
-        case im_base_1.PayloadType.SHARE:
-            content = <PayloadShare_1.default {...mergeProps}/>;
+        case PayloadType.SHARE:
+            content = <PayloadShare {...mergeProps}/>;
             break;
         default:
             console.log('暂不支持的消息类型：', payloadType);
-            content = (<PayloadWrapper_1.default style={style} direction={mergeProps.direction}>
-                    <react_native_1.Text style={styles_1.plain}>[{t('msgTypeNotSupported')}]</react_native_1.Text>
-                </PayloadWrapper_1.default>);
+            content = (<PayloadWrapper style={style} direction={mergeProps.direction}>
+                    <Text style={plain}>[{t('msgTypeNotSupported')}]</Text>
+                </PayloadWrapper>);
             break;
     }
     return content;
 };
-exports.default = (0, react_1.memo)(MessagePayload);
+export default memo(MessagePayload);