@smart-link/rn-im 1.0.23 → 1.0.24

package/dist/components/NetworkUnconnected.js

@@ -1,55 +1,27 @@
-"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 __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const rn_ui_1 = require("@smart-link/rn-ui");
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const useTranslation_1 = __importDefault(require("../hooks/useTranslation"));
-const NetworkUnconnected = (0, react_1.memo)(() => {
-    const { t } = (0, useTranslation_1.default)();
-    return (<react_native_1.View style={styles.network}>
-            <react_native_1.Text style={styles.text} numberOfLines={1}>
+import { dp } from '@smart-link/rn-ui';
+import React, { memo } from 'react';
+import { StyleSheet, Text, View } from 'react-native';
+import useTranslation from '../hooks/useTranslation';
+const NetworkUnconnected = memo(() => {
+    const { t } = useTranslation();
+    return (<View style={styles.network}>
+            <Text style={styles.text} numberOfLines={1}>
                 {t('checkNetwork')}
-            </react_native_1.Text>
-        </react_native_1.View>);
+            </Text>
+        </View>);
 });
-const styles = react_native_1.StyleSheet.create({
+const styles = StyleSheet.create({
     network: {
         flexDirection: 'row',
-        paddingVertical: (0, rn_ui_1.dp)(10),
+        paddingVertical: dp(10),
         backgroundColor: '#feebeb',
         justifyContent: 'center',
     },
     text: {
         color: '#666',
-        lineHeight: (0, rn_ui_1.dp)(21),
+        lineHeight: dp(21),
         alignItems: 'center',
         justifyContent: 'center',
     },
 });
-exports.default = NetworkUnconnected;
+export default NetworkUnconnected;

package/dist/components/PopoverWrapper.js

@@ -1,48 +1,23 @@
-"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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const popover_1 = require("@smart-link/rn-ui/dist/components/popover");
-const rn_ui_1 = require("@smart-link/rn-ui");
-const elements_1 = require("@react-navigation/elements");
+import React, { memo, useCallback, useEffect, useState } from 'react';
+import { Dimensions, NativeModules, StatusBar, StyleSheet, View, } from 'react-native';
+import { PopoverBase } from '@smart-link/rn-ui/dist/components/popover';
+import { dp } from '@smart-link/rn-ui';
+import { useHeaderHeight } from '@react-navigation/elements';
 const PopoverWrapper = ({ showArrow = true, measureTarget = true, visible, fullscreen, nativeEvent, children, onClose }) => {
     var _a, _b;
-    const { height, width } = react_native_1.Dimensions.get('window');
-    const headerHeight = (0, elements_1.useHeaderHeight)();
-    const [contentHeight, setContentHeight] = (0, react_1.useState)(0);
-    const [fromRect, setFromRect] = (0, react_1.useState)({ x: (_a = nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.pageX) !== null && _a !== void 0 ? _a : 0,
+    const { height, width } = Dimensions.get('window');
+    const headerHeight = useHeaderHeight();
+    const [contentHeight, setContentHeight] = useState(0);
+    const [fromRect, setFromRect] = useState({ x: (_a = nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.pageX) !== null && _a !== void 0 ? _a : 0,
         y: (_b = nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.pageY) !== null && _b !== void 0 ? _b : 0,
         width: 0,
         height: 0, });
-    const onLayout = (0, react_1.useCallback)((event) => {
+    const onLayout = useCallback((event) => {
         setContentHeight(event.nativeEvent.layout.height);
     }, []);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (!measureTarget && (nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.pageX)) {
-            setFromRect(prev => { var _a, _b; return (Object.assign(Object.assign({}, prev), { x: (_a = nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.pageX) !== null && _a !== void 0 ? _a : 0, y: ((_b = nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.pageY) !== null && _b !== void 0 ? _b : 0) - react_native_1.StatusBar.currentHeight })); });
+            setFromRect(prev => { var _a, _b; return (Object.assign(Object.assign({}, prev), { x: (_a = nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.pageX) !== null && _a !== void 0 ? _a : 0, y: ((_b = nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.pageY) !== null && _b !== void 0 ? _b : 0) - StatusBar.currentHeight })); });
         }
         if (!measureTarget || !(nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.target))
             return;
@@ -54,25 +29,25 @@ const PopoverWrapper = ({ showArrow = true, measureTarget = true, visible, fulls
                 height,
             });
         };
-        react_native_1.NativeModules.UIManager.measure(nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.target, callback);
+        NativeModules.UIManager.measure(nativeEvent === null || nativeEvent === void 0 ? void 0 : nativeEvent.target, callback);
     }, [visible, measureTarget, nativeEvent]);
-    const padding = (0, rn_ui_1.dp)(12);
-    const viewHeight = height - react_native_1.StatusBar.currentHeight - 46 - 48 - padding * 2;
-    return (<popover_1.PopoverBase calculateStatusBar useNativeDriver showArrow={showArrow} duration={100} contentStyle={styles.content} backgroundStyle={styles.bg} visible={visible} fromRect={fromRect} placement={fromRect.y + contentHeight > viewHeight ? 'top' : 'bottom'} displayArea={measureTarget ? {
+    const padding = dp(12);
+    const viewHeight = height - StatusBar.currentHeight - 46 - 48 - padding * 2;
+    return (<PopoverBase calculateStatusBar useNativeDriver showArrow={showArrow} duration={100} contentStyle={styles.content} backgroundStyle={styles.bg} visible={visible} fromRect={fromRect} placement={fromRect.y + contentHeight > viewHeight ? 'top' : 'bottom'} displayArea={measureTarget ? {
             x: padding,
             y: headerHeight,
             width: width - padding * 2,
-            height: height - react_native_1.StatusBar.currentHeight - 46 - headerHeight - padding * 2,
+            height: height - StatusBar.currentHeight - 46 - headerHeight - padding * 2,
         } : undefined} onClose={onClose}>
-            <react_native_1.View onLayout={onLayout}>{children}</react_native_1.View>
-        </popover_1.PopoverBase>);
+            <View onLayout={onLayout}>{children}</View>
+        </PopoverBase>);
 };
-const styles = react_native_1.StyleSheet.create({
+const styles = StyleSheet.create({
     bg: {
         backgroundColor: 'transparent',
     },
     content: {
-        borderRadius: (0, rn_ui_1.dp)(6),
+        borderRadius: dp(6),
     },
 });
-exports.default = (0, react_1.memo)(PopoverWrapper);
+export default memo(PopoverWrapper);

package/dist/components/VideoPlayer.js

@@ -1,70 +1,39 @@
-"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 __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 react_native_video_1 = __importDefault(require("react-native-video"));
-const MaterialIcons_1 = __importDefault(require("react-native-vector-icons/MaterialIcons"));
-const AntDesign_1 = __importDefault(require("react-native-vector-icons/AntDesign"));
-const FontAwesome_1 = __importDefault(require("react-native-vector-icons/FontAwesome"));
-const Progress = __importStar(require("react-native-progress"));
-const slider_1 = __importDefault(require("@react-native-community/slider"));
-const rn_ui_1 = require("@smart-link/rn-ui");
-const file_1 = require("../utils/file");
-const im_base_1 = require("@smart-link/im-base");
-const useTranslation_1 = __importDefault(require("../hooks/useTranslation"));
-const useImSelector_1 = require("../hooks/useImSelector");
-const video_slice_1 = require("../slice/video/video.slice");
-const react_redux_1 = require("react-redux");
-const { width: screenWidth } = react_native_1.Dimensions.get('screen');
-const VideoPlayer = (0, react_1.memo)(() => {
-    const { showVideoPlay = false, videoLocalPath, videoImagePath, videoImageHeight, videoImageWidth, videoDownloadError, videoDownloadProgress = 0, } = (0, useImSelector_1.useVideo)();
+import React, { memo, useEffect, useState } from 'react';
+import { Modal, StyleSheet, Text, TouchableOpacity, View, ImageBackground, StatusBar, Platform, Dimensions, } from 'react-native';
+import Video from 'react-native-video';
+import MaterialIcons from "react-native-vector-icons/MaterialIcons";
+import AntDesign from "react-native-vector-icons/AntDesign";
+import FontAwesome from "react-native-vector-icons/FontAwesome";
+import * as Progress from "react-native-progress";
+import Slider from '@react-native-community/slider';
+import { dp } from '@smart-link/rn-ui';
+import { toAbsolutePath } from '../utils/file';
+import { numberToTime } from '@smart-link/im-base';
+import useTranslation from '../hooks/useTranslation';
+import { useVideo } from '../hooks/useImSelector';
+import { stopVideoPlayer } from "../slice/video/video.action";
+import { getImManager } from "../init";
+const { width: screenWidth } = Dimensions.get('screen');
+const VideoPlayer = memo(() => {
+    const { showVideoPlay = false, videoLocalPath, videoImagePath, videoImageHeight, videoImageWidth, videoDownloadError, videoDownloadProgress = 0, } = useVideo();
     // @ts-ignore
-    const player = react_1.default.useRef(null);
-    const dispatch = (0, react_redux_1.useDispatch)();
-    const { t } = (0, useTranslation_1.default)();
+    const player = React.useRef(null);
+    const { t } = useTranslation();
     const videoImageSize = {
         width: screenWidth,
-        height: (videoImageHeight > 500 ? (0, rn_ui_1.dp)(500) : videoImageHeight * videoImageWidth / screenWidth)
-    };
-    const [isError, setIsError] = (0, react_1.useState)(false);
-    const [duration, setDuration] = (0, react_1.useState)(0);
-    const [currentTime, setCurrentTime] = (0, react_1.useState)(0);
-    const [paused, setPaused] = (0, react_1.useState)(false);
-    const [pageX, setPageX] = (0, react_1.useState)(0);
-    const [pageXTime, setPageXTime] = (0, react_1.useState)(0);
-    const onBuffer = () => {
+        height: (videoImageHeight > 500 ? dp(500) : videoImageHeight * videoImageWidth / screenWidth)
     };
+    const [isError, setIsError] = useState(false);
+    const [duration, setDuration] = useState(0);
+    const [currentTime, setCurrentTime] = useState(0);
+    const [paused, setPaused] = useState(false);
+    const [pageX, setPageX] = useState(0);
+    const [pageXTime, setPageXTime] = useState(0);
     const onLoad = (data) => {
-        console.log('onLoad: ', data);
         setDuration(data.duration);
     };
-    const videoError = () => {
+    const videoError = (e) => {
+        console.log(e);
         setIsError(true);
     };
     const onProgress = (data) => {
@@ -84,7 +53,7 @@ const VideoPlayer = (0, react_1.memo)(() => {
         setPaused(false);
     };
     const onPressSeek = (evt) => {
-        if (react_native_1.Platform.OS === 'ios') {
+        if (Platform.OS === 'ios') {
             let { nativeEvent } = evt;
             setPageX(nativeEvent.pageX);
             setPageXTime(currentTime);
@@ -96,9 +65,9 @@ const VideoPlayer = (0, react_1.memo)(() => {
         setPaused(true);
     };
     const onMoveSeek = (evt) => {
-        if (react_native_1.Platform.OS === 'ios') {
+        if (Platform.OS === 'ios') {
             let { nativeEvent } = evt;
-            let time = (nativeEvent.pageX - pageX) / (0, rn_ui_1.dp)(200) * duration + pageXTime;
+            let time = (nativeEvent.pageX - pageX) / dp(200) * duration + pageXTime;
             if (time < 0) {
                 time = 0;
             }
@@ -116,7 +85,7 @@ const VideoPlayer = (0, react_1.memo)(() => {
         setPageXTime(0);
         setPaused(false);
     };
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         var _a;
         if (showVideoPlay) {
             (_a = player.current) === null || _a === void 0 ? void 0 : _a.seek(0);
@@ -124,73 +93,77 @@ const VideoPlayer = (0, react_1.memo)(() => {
             setPaused(false);
             setPageX(0);
             setPageXTime(0);
+            setIsError(false);
         }
     }, [showVideoPlay]);
+    const stop = () => {
+        getImManager().store.dispatch(stopVideoPlayer());
+        setIsError(false);
+    };
     if (!videoLocalPath && !videoImagePath) {
         return null;
     }
-    return (<react_native_1.Modal animationType="fade" transparent={false} visible={showVideoPlay} onRequestClose={() => {
-        }}>
-            {react_native_1.Platform.OS === 'android' &&
-            <react_native_1.StatusBar backgroundColor={'#000'}/>}
-            <react_native_1.View style={styles.video}>
+    return (<Modal animationType="fade" transparent={false} visible={showVideoPlay} onRequestClose={stop}>
+            {Platform.OS === 'android' &&
+            <StatusBar backgroundColor={'#000'}/>}
+            <View style={styles.video}>
 
                 {!videoLocalPath && videoImagePath &&
-            <react_native_1.ImageBackground style={[styles.videoImage, videoImageSize]} source={{ uri: (0, file_1.toAbsolutePath)(videoImagePath) }}>
-                        <Progress.Pie progress={videoDownloadProgress} size={(0, rn_ui_1.dp)(60)} borderWidth={(0, rn_ui_1.dp)(3)} color={'#fff'}/>
-                    </react_native_1.ImageBackground>}
+            <ImageBackground style={[styles.videoImage, videoImageSize]} source={{ uri: toAbsolutePath(videoImagePath) }}>
+                        <Progress.Pie progress={videoDownloadProgress} size={64} borderWidth={3} color={'#fff'}/>
+                    </ImageBackground>}
 
                 {(isError || videoDownloadError) &&
-            <react_native_1.View style={styles.error}>
-                        <MaterialIcons_1.default name={'error'} size={(0, rn_ui_1.dp)(50)} color={'#fff'}/>
-                        <react_native_1.Text style={styles.errorText}>{t('videoLoadingError')}</react_native_1.Text>
-                    </react_native_1.View>}
+            <View style={styles.error}>
+                        <MaterialIcons name={'error'} size={dp(50)} color={'#fff'}/>
+                        <Text style={styles.errorText}>{t('videoLoadingError')}</Text>
+                    </View>}
                 {!isError && videoLocalPath &&
-            <react_native_video_1.default ref={player} source={{ uri: (0, file_1.toAbsolutePath)(videoLocalPath) }} paused={paused} resizeMode={'contain'} progressUpdateInterval={100} onLoad={onLoad} onProgress={onProgress} onEnd={onEnd} onBuffer={onBuffer} onError={videoError} style={styles.player}/>}
-                <react_native_1.TouchableOpacity style={styles.cancel} onPress={() => dispatch((0, video_slice_1.cancelVideoPlayer)())}>
-                    <AntDesign_1.default name='close' size={(0, rn_ui_1.dp)(25)} color={'#fff'}/>
-                </react_native_1.TouchableOpacity>
+            <Video ref={player} source={{ uri: toAbsolutePath(videoLocalPath) }} paused={paused} resizeMode={'contain'} progressUpdateInterval={100} onLoad={onLoad} onProgress={onProgress} onEnd={onEnd} onError={videoError} style={styles.player}/>}
+                <TouchableOpacity activeOpacity={0.75} style={styles.cancel} onPress={stop}>
+                    <AntDesign name='close' size={dp(25)} color={'#fff'}/>
+                </TouchableOpacity>
                 <PlayBar paused={paused} currentTime={currentTime} duration={duration} onPause={onPause} onResume={onResume} onPressSeek={onPressSeek} onMoveSeek={onMoveSeek} onReleaseSeek={onReleaseSeek}/>
-            </react_native_1.View>
-        </react_native_1.Modal>);
+            </View>
+        </Modal>);
 });
-const PlayBar = (0, react_1.memo)(props => {
+const PlayBar = memo(props => {
     const { paused = false, currentTime, duration, onPause, onResume, onPressSeek, onMoveSeek, onReleaseSeek, } = props;
     let percentWidth = 0;
     if (duration !== 0) {
-        percentWidth = (0, rn_ui_1.dp)(200) * currentTime / duration;
+        percentWidth = dp(200) * currentTime / duration;
     }
-    return (<react_native_1.View style={styles.playBar}>
+    return (<View style={styles.playBar}>
             {paused &&
-            <react_native_1.TouchableOpacity style={styles.pauseResume} onPress={onResume}>
-                    <FontAwesome_1.default name='play' size={(0, rn_ui_1.dp)(13)} color={'#fff'}/>
-                </react_native_1.TouchableOpacity>}
+            <TouchableOpacity style={styles.pauseResume} onPress={onResume}>
+                    <FontAwesome name='play' size={dp(13)} color={'#fff'}/>
+                </TouchableOpacity>}
             {!paused &&
-            <react_native_1.TouchableOpacity style={styles.pauseResume} onPress={onPause}>
-                    <FontAwesome_1.default name='pause' size={(0, rn_ui_1.dp)(13)} color={'#fff'}/>
-                </react_native_1.TouchableOpacity>}
-            <react_native_1.View style={{ width: (0, rn_ui_1.dp)(5) }}/>
-            <react_native_1.Text style={styles.time}>{(0, im_base_1.numberToTime)(currentTime)}</react_native_1.Text>
-            <react_native_1.View style={{ width: (0, rn_ui_1.dp)(10) }}/>
-            {react_native_1.Platform.OS === 'ios' ? <react_native_1.View style={styles.progress}>
-                    <react_native_1.View style={[styles.percent, { width: percentWidth }]}>
+            <TouchableOpacity style={styles.pauseResume} onPress={onPause}>
+                    <FontAwesome name='pause' size={dp(13)} color={'#fff'}/>
+                </TouchableOpacity>}
+            <View style={{ width: dp(5) }}/>
+            <Text style={styles.time}>{numberToTime(currentTime)}</Text>
+            <View style={{ width: dp(10) }}/>
+            {Platform.OS === 'ios' ? <View style={styles.progress}>
+                    <View style={[styles.percent, { width: percentWidth }]}>
                         <SeekBottom onPressSeek={onPressSeek} onMoveSeek={onMoveSeek} onReleaseSeek={onReleaseSeek}/>
-                    </react_native_1.View>
-                </react_native_1.View> :
-            <slider_1.default style={{ width: (0, rn_ui_1.dp)(200), height: (0, rn_ui_1.dp)(30) }} disabled={duration === 0} value={currentTime} minimumValue={0} maximumValue={duration} minimumTrackTintColor="#fff" thumbTintColor="#fff" onSlidingStart={onPressSeek} onValueChange={onMoveSeek} onSlidingComplete={onReleaseSeek}/>}
-            <react_native_1.View style={{ width: (0, rn_ui_1.dp)(10) }}/>
-            <react_native_1.Text style={styles.time}>{(0, im_base_1.numberToTime)(duration)}</react_native_1.Text>
-        </react_native_1.View>);
+                    </View>
+                </View> :
+            <Slider style={{ width: dp(200), height: dp(30) }} disabled={duration === 0} value={currentTime} minimumValue={0} maximumValue={duration} minimumTrackTintColor="#fff" thumbTintColor="#fff" onSlidingStart={onPressSeek} onValueChange={onMoveSeek} onSlidingComplete={onReleaseSeek}/>}
+            <View style={{ width: dp(10) }}/>
+            <Text style={styles.time}>{numberToTime(duration)}</Text>
+        </View>);
 });
-const SeekBottom = (0, react_1.memo)(props => {
+const SeekBottom = memo(props => {
     const { onPressSeek, onMoveSeek, onReleaseSeek, } = props;
     return (<>
-            <react_native_1.View style={styles.seekRange} onStartShouldSetResponder={() => true} onMoveShouldSetResponder={() => true} onResponderGrant={onPressSeek} onResponderMove={onMoveSeek} onResponderRelease={onReleaseSeek} onResponderTerminationRequest={() => false}>
-            </react_native_1.View>
-            <react_native_1.View style={styles.seek}/>
+            <View style={styles.seekRange} onStartShouldSetResponder={() => true} onMoveShouldSetResponder={() => true} onResponderGrant={onPressSeek} onResponderMove={onMoveSeek} onResponderRelease={onReleaseSeek} onResponderTerminationRequest={() => false}>
+            </View>
+            <View style={styles.seek}/>
         </>);
 });
-const styles = react_native_1.StyleSheet.create({
+const styles = StyleSheet.create({
     video: {
         flex: 1,
         backgroundColor: '#000',
@@ -206,9 +179,9 @@ const styles = react_native_1.StyleSheet.create({
         alignItems: 'center',
     },
     errorText: {
-        fontSize: (0, rn_ui_1.dp)(18),
+        fontSize: dp(18),
         color: '#fff',
-        lineHeight: (0, rn_ui_1.dp)(40),
+        lineHeight: dp(40),
     },
     player: {
         position: 'absolute',
@@ -218,71 +191,71 @@ const styles = react_native_1.StyleSheet.create({
         right: 0,
     },
     cancel: {
-        height: (0, rn_ui_1.dp)(40),
-        width: (0, rn_ui_1.dp)(40),
-        borderRadius: (0, rn_ui_1.dp)(5),
-        backgroundColor: '#333',
+        height: dp(40),
+        width: dp(40),
+        borderRadius: dp(5),
+        backgroundColor: '#999',
         position: 'absolute',
-        top: (0, rn_ui_1.dp)(70),
-        right: (0, rn_ui_1.dp)(30),
+        top: dp(70),
+        right: dp(30),
         justifyContent: 'center',
         alignItems: 'center',
         opacity: 0.7,
     },
     playBar: {
         position: 'absolute',
-        bottom: (0, rn_ui_1.dp)(80),
+        bottom: dp(80),
         backgroundColor: 'rgba(51,51,51,0.7)',
         flexDirection: 'row',
-        paddingVertical: react_native_1.Platform.select({
-            ios: (0, rn_ui_1.dp)(10),
-            default: (0, rn_ui_1.dp)(5)
+        paddingVertical: Platform.select({
+            ios: dp(10),
+            default: dp(5)
         }),
-        paddingHorizontal: (0, rn_ui_1.dp)(10),
-        borderRadius: (0, rn_ui_1.dp)(5),
+        paddingHorizontal: dp(10),
+        borderRadius: dp(5),
         justifyContent: 'center',
         alignItems: 'center',
     },
     pauseResume: {
         justifyContent: 'center',
         alignItems: 'center',
-        width: (0, rn_ui_1.dp)(20),
+        width: dp(20),
     },
     progress: {
         flexDirection: 'row',
-        height: (0, rn_ui_1.dp)(2),
-        width: (0, rn_ui_1.dp)(200),
-        borderRadius: (0, rn_ui_1.dp)(1),
+        height: dp(2),
+        width: dp(200),
+        borderRadius: dp(1),
         backgroundColor: '#666',
     },
     percent: {
         height: (2),
-        width: (0, rn_ui_1.dp)(100),
+        width: dp(100),
         backgroundColor: '#fff'
     },
     time: {
-        fontSize: (0, rn_ui_1.dp)(12),
+        fontSize: dp(12),
         color: '#fff'
     },
     seekRange: {
-        height: (0, rn_ui_1.dp)(50),
-        width: (0, rn_ui_1.dp)(50),
-        borderRadius: (0, rn_ui_1.dp)(25),
+        height: dp(50),
+        width: dp(50),
+        borderRadius: dp(25),
         position: 'absolute',
-        top: (0, rn_ui_1.dp)(-23),
-        right: (0, rn_ui_1.dp)(-25),
+        top: dp(-23),
+        right: dp(-25),
         opacity: 0,
         zIndex: 999,
     },
     seek: {
         backgroundColor: '#fff',
-        height: (0, rn_ui_1.dp)(12),
-        width: (0, rn_ui_1.dp)(12),
-        borderRadius: (0, rn_ui_1.dp)(6),
-        top: (0, rn_ui_1.dp)(-5),
-        right: (0, rn_ui_1.dp)(-6),
+        height: dp(12),
+        width: dp(12),
+        borderRadius: dp(6),
+        top: dp(-5),
+        right: dp(-6),
         position: 'absolute',
         zIndex: 1,
     }
 });
-exports.default = VideoPlayer;
+export default VideoPlayer;

package/dist/components/styles.js

@@ -1,23 +1,20 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.plain = exports.borderStyle = exports.shadowStyle = void 0;
-const rn_ui_1 = require("@smart-link/rn-ui");
-exports.shadowStyle = {
+import { dp } from '@smart-link/rn-ui';
+export const shadowStyle = {
     shadowColor: 'rgba(0, 0, 0, 0.08)',
     shadowOffset: {
         width: 0,
-        height: (0, rn_ui_1.dp)(3),
+        height: dp(3),
     },
-    shadowRadius: (0, rn_ui_1.dp)(3),
+    shadowRadius: dp(3),
     shadowOpacity: 1,
     elevation: 1.5,
 };
-exports.borderStyle = {
-    borderRadius: (0, rn_ui_1.dp)(5),
+export const borderStyle = {
+    borderRadius: dp(5),
 };
-exports.plain = {
+export const plain = {
     color: '#000',
-    fontSize: (0, rn_ui_1.dp)(14),
-    paddingHorizontal: (0, rn_ui_1.dp)(12),
-    paddingVertical: (0, rn_ui_1.dp)(10),
+    fontSize: dp(14),
+    paddingHorizontal: dp(12),
+    paddingVertical: dp(10),
 };

package/dist/default-assets.d.ts

@@ -16,3 +16,4 @@ export declare const messageBackupImg: {
     cloud: any;
     cloud_begin: any;
 };
+export declare const noMessageImg: any;

package/dist/default-assets.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.messageBackupImg = exports.receiptStatus = exports.defaultAvatars = void 0;
-const im_base_1 = require("@smart-link/im-base");
-exports.defaultAvatars = {
+import { MessageStatus } from "@smart-link/im-base";
+export const defaultAvatars = {
     MAN: require('../assets/avatars-man.jpg'),
     WOMAN: require('../assets/avatars-woman.jpg'),
     EMPTY: require('../assets/avatars-empty.png'),
@@ -11,12 +8,13 @@ exports.defaultAvatars = {
     GROUP_OWNER: require('../assets/group-owner.png'),
     GROUP_MGR: require('../assets/group-mgr.png'),
 };
-exports.receiptStatus = {
-    [im_base_1.MessageStatus.READ]: require('../assets/hook-blue-double.png'),
-    [im_base_1.MessageStatus.ARRIVED]: require('../assets/hook-black-double.png'),
-    [im_base_1.MessageStatus.EMITTED]: require('../assets/hook-black.png'),
+export const receiptStatus = {
+    [MessageStatus.READ]: require('../assets/hook-blue-double.png'),
+    [MessageStatus.ARRIVED]: require('../assets/hook-black-double.png'),
+    [MessageStatus.EMITTED]: require('../assets/hook-black.png'),
 };
-exports.messageBackupImg = {
+export const messageBackupImg = {
     cloud: require('../assets/cloud-backup.png'),
     cloud_begin: require('../assets/cloud-backup-begin.png'),
 };
+export const noMessageImg = require('../assets/no_message.png');