@aks-dev/easyui 1.0.163 → 1.1.2

package/lib/Hud/AlertSheetView/AlertSheetView.tsx

@@ -1,179 +0,0 @@
-import * as React from 'react'
-import { Dimensions, Platform, StatusBar, StyleSheet, Text, TouchableOpacity, View } from 'react-native'
-import Modal from 'react-native-modal'
-import { AlertSheetViewOptions } from '.'
-import { px2dp } from '../../../screen/px2dp'
-import { px2sp } from '../../../screen/px2sp'
-
-
-
-
-
-type State = {
-    visible: boolean;
-} & AlertSheetViewOptions
-
-
-
-
-
-export default React.forwardRef<AlertSheetViewOptions.RefAttributes, {}>((_, ref) => {
-
-
-    const defaultState: Partial<State> = {
-        visible: false,
-        actions: []
-    }
-    const [state, setState] = React.useState<Partial<State>>(defaultState)
-
-    React.useImperativeHandle<unknown, AlertSheetViewOptions.RefAttributes>(ref, () => ({
-        show: async (options: Partial<AlertSheetViewOptions>) => {
-            setState(Object.assign({}, defaultState, { visible: true }, options))
-        },
-        hide
-    }), [])
-
-
-    const hide = async () => {
-        setState(defaultState)
-    }
-
-
-    React.useEffect(() => {
-        if (Platform.OS == 'android') {
-            if (state.visible) {
-                StatusBar.setBackgroundColor('black')
-                StatusBar.setBarStyle('light-content')
-            } else {
-                StatusBar.setBackgroundColor('transparent')
-                StatusBar.setBarStyle('dark-content')
-            }
-        }
-
-    }, [state.visible])
-    return (
-        <Modal
-            hideModalContentWhileAnimating={true}//通过隐藏模态内容直到动画完成来增强性能
-            useNativeDriver={true}//定义动画是否应使用本机驱动程序
-            animationIn='slideInUp'
-            animationOut='slideOutDown'
-            onBackButtonPress={() => {
-                //按下Android后退按钮时调用
-                hide()
-            }}
-            onBackdropPress={() => {
-                //按下背景时调用
-                hide()
-            }}
-            isVisible={state.visible}
-            deviceHeight={Dimensions.get('screen').height}
-            style={{ margin: 0}}
-        >
-            <View style={styles.container}>
-                <View style={[styles.wrapper]}>
-                    <View style={styles.itemContainer}>
-                        {state.actions?.map((i, idx) =>
-                            <TouchableOpacity
-                                
-                                key={`sg-action-${idx}`}
-                                style={[styles.item]}
-                                activeOpacity={1}
-                                onPress={() => {
-                                    hide()
-                                    i.onClick && i.onClick()
-                                }}>
-                                <Text style={[styles.itemText,{color:i.color}]} numberOfLines={2}>{i.text}</Text>
-                            </TouchableOpacity>
-                        )}
-                    </View>
-
-
-
-                    <TouchableOpacity
-                        style={[styles.cancel]}
-                        activeOpacity={1}
-                        onPress={() => {
-                            hide()
-                        }}>
-                        <Text style={[styles.cancelText]}>取消</Text>
-                    </TouchableOpacity>
-                </View>
-
-            </View>
-        </Modal>
-    )
-})
-
-
-
-export const alertSheetViewRef = React.createRef<AlertSheetViewOptions.RefAttributes>();
-
-
-
-export const showAlertSheetModal = (props: Partial<AlertSheetViewOptions>) => {
-    alertSheetViewRef.current?.show(props)
-}
-
-
-
-
-
-
-const styles = StyleSheet.create({
-    container: {
-        display: 'flex',
-        flexGrow: 1,
-        justifyContent: 'flex-end',
-        alignItems: 'center',
-
-    },
-
-    wrapper: {
-        flexGrow: 0,
-        flexShrink: 0,
-        width: '100%',
-        // backgroundColor: 'pink',
-        overflow: 'hidden',
-        borderTopLeftRadius: px2dp(10),
-        borderTopRightRadius: px2dp(10),
-        display: 'flex',
-        padding: px2dp(15),
-    },
-
-    cancel: {
-        height: px2dp(50),
-        display: 'flex',
-        justifyContent: 'center',
-        alignItems: 'center',
-        borderRadius: px2dp(10),
-        backgroundColor: 'white',
-        marginTop: px2dp(15),
-    },
-    cancelText: {
-        fontSize: px2sp(15),
-        color: '#2763FF',
-
-    },
-
-    itemContainer: {
-        display: 'flex',
-        borderRadius: px2dp(10),
-        overflow: 'hidden',
-        backgroundColor:'#f1f1f1'
-    },
-    item: {
-        height: px2dp(50),
-        display: 'flex',
-        justifyContent: 'center',
-        alignItems: 'center',
-
-        backgroundColor: 'white',
-        marginTop: px2dp(0.75)
-    },
-    itemText: {
-        fontSize: px2sp(12),
-        color: '#666666',
-
-    },
-
-})

package/lib/Hud/AlertSheetView/index.d.ts

@@ -1,35 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-22 17:30:32
- * @LastEditors: shiguo
- * @LastEditTime: 2022-09-09 10:51:19
- * @FilePath: /@aks-dev/easyui/lib/Hud/AlertSheetView/index.d.ts
- */
-import * as React from 'react';
-import { ColorValue } from 'react-native';
-
-
-
-type ActionSheet = {
-    text: string;
-    color?: ColorValue | undefined;
-    onClick?: () => void;
-}
-export declare type AlertSheetViewOptions = {
-    actions:ActionSheet[];
-}
-
-
-export declare const showAlertSheetModal: (props: Partial<AlertSheetViewOptions>) => void;
-
-
-declare namespace AlertSheetViewOptions {
-    type RefAttributes = {
-        show: (options: Partial<AlertSheetViewOptions>) => void;
-        hide: () => void;
-    }
-}
-
-export declare const AlertSheetView: React.ForwardRefExoticComponent<React.PropsWithoutRef<{}> & React.RefAttributes<AlertSheetViewOptions.RefAttributes>>;
-
-export declare const AlertSheetViewRef: React.RefObject<AlertSheetViewOptions.RefAttributes>

package/lib/Hud/AlertView/AlertView.tsx

@@ -1,234 +0,0 @@
-import * as React from 'react'
-import { View, Text, StyleSheet, Platform, Modal, StatusBar, TouchableOpacity, Animated, Easing } from 'react-native'
-
-
-import { px2dp, deviceWidth } from '../../../screen/px2dp'
-import { px2sp } from '../../../screen/px2sp'
-
-import { AlertViewOptions } from '.'
-
-
-
-type State = {
-    visible: boolean;
-
-} & Omit<AlertViewOptions, 'cancel' | 'confirm'>
-
-
-
-
-
-export default React.forwardRef<AlertViewOptions.RefAttributes, {}>((_, ref) => {
-
-
-    const defaultState: Partial<State> = {
-        visible: false,
-        cancelText: '取消',
-        confirmText: '确定',
-    }
-    const [state, setState] = React.useState<Partial<State>>(defaultState)
-    const cancelCallbackRef = React.useRef<Function>();
-    const confirmCallbackRef = React.useRef<Function>();
-
-
-    
-    React.useImperativeHandle<unknown, AlertViewOptions.RefAttributes>(ref, () => ({
-        show: async (options: Partial<AlertViewOptions>) => {
-
-            setState(Object.assign({}, defaultState, { visible: true }, options))
-            cancelCallbackRef.current = options.cancel;
-            confirmCallbackRef.current = options.confirm;
-            // await sleep(50)
-            startAnimate(1)
-        },
-        hide
-    }), [])
-
-
-    const hide = async () => {
-        startAnimate(0.3)
-        // await sleep(50)
-        setState(defaultState)
-
-    }
-
-    let scale_anim = React.useRef(new Animated.Value(0.3)).current
-    const startAnimate = (x: number) => {
-        Animated.timing(scale_anim, {
-            toValue: x,
-            useNativeDriver: true,
-            duration: 150,
-            easing: Easing.ease
-        }).start()
-    }
-    React.useEffect(() => {
-        if (Platform.OS == 'android') {
-            if (state.visible) {
-                StatusBar.setBackgroundColor('black')
-                StatusBar.setBarStyle('light-content')
-            } else {
-                StatusBar.setBackgroundColor('transparent')
-                StatusBar.setBarStyle('dark-content')
-            }
-        }
-
-    }, [state.visible])
-    return (
-        <Modal
-            visible={state.visible}
-            transparent animationType="fade"
-            onRequestClose={() => {
-                // hide()
-            }}
-        // style={{
-        //     margin: 0,
-        // }}
-        >
-            <View style={styles.container}>
-                <Animated.View style={[styles.wrapper, state.wrapperStyle, { transform: [{ scale: scale_anim }] }]}>
-                    {state.title && <Text style={styles.titleText}>{state.title}</Text>}
-                    {(() => {
-                        if (typeof state.content == 'string') return <Text style={styles.contentText}>{state.content}</Text>
-                        if (React.isValidElement(state.content)) return state.content;
-                        return <View />
-                    })()}
-
-                    {
-                        (state.cancelText || state.confirmText) &&
-                        <View style={styles.action}>
-                            {state.cancelText &&
-                                <TouchableOpacity
-                                    style={[styles.cancel, { marginRight: state.confirmText ? px2dp(15) : 0 }, state.cancelContainerStyle]}
-                                    activeOpacity={0.8}
-                                    disabled={state.cancelDisabled}
-                                    onPress={() => {
-                                        hide()
-                                        cancelCallbackRef.current && cancelCallbackRef.current()
-                                        cancelCallbackRef.current = undefined;
-
-                                    }}>
-                                    <Text style={[styles.cancelText, state.cancelTextStyle]}>{state.cancelText}</Text>
-                                </TouchableOpacity>
-                            }
-
-                            {state.confirmText &&
-                                <TouchableOpacity
-                                    style={[styles.confirm, { marginLeft: state.cancelText ? px2dp(15) : 0 }, state.confirmContainerStyle]}
-                                    activeOpacity={0.8}
-                                    onPress={() => {
-                                        hide()
-                                        confirmCallbackRef.current && confirmCallbackRef.current()
-                                        confirmCallbackRef.current = undefined;
-                                    }}>
-                                    <Text style={[styles.confirmText, state.confirmTextStyle]}>{state.confirmText}</Text>
-                                </TouchableOpacity>
-                            }
-                        </View>
-                    }
-
-                </Animated.View>
-
-            </View>
-        </Modal>
-    )
-})
-
-
-
-export const alertViewRef = React.createRef<AlertViewOptions.RefAttributes>();
-
-
-
-export const showAlertModal = (props: Partial<AlertViewOptions>) => {
-    alertViewRef.current?.show(props)
-}
-
-
-
-// const sleep = (msec?: number) => {
-//     return new Promise(resolve => {
-//         setTimeout(resolve, msec || 350);
-//     });
-// }
-
-
-
-const styles = StyleSheet.create({
-    container: {
-        display: 'flex',
-        flexGrow: 1,
-        backgroundColor: '#00000088',
-        justifyContent: 'center',
-        alignItems: 'center',
-
-    },
-
-    wrapper: {
-        flexGrow: 0,
-        flexShrink: 0,
-        // minWidth: '70%',
-        minWidth: deviceWidth - px2dp(60),
-        backgroundColor: 'white',
-        overflow: 'hidden',
-        borderRadius: px2dp(10),
-        display: 'flex',
-        padding: px2dp(15),
-    },
-    titleText: {
-        maxWidth: deviceWidth - px2dp(90),
-        fontSize: px2sp(18),
-        marginBottom: px2dp(20),
-        // backgroundColor: 'red',
-        textAlign: 'center',
-        fontWeight: 'bold',
-        color: '#1A1A1A'
-    },
-    contentText: {
-        maxWidth: deviceWidth - px2dp(90),
-        marginBottom: px2dp(20),
-        minHeight: px2dp(40),
-        flexGrow: 0,
-        flexShrink: 1,
-        width: undefined,
-        fontSize: px2sp(15),
-        // backgroundColor: 'red',
-        color: '#1A1A1A',
-        textAlign: 'center'
-    },
-    action: {
-        display: 'flex',
-        flexDirection: 'row',
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        // backgroundColor:"red"
-    },
-    cancel: {
-        width: '40%',
-        height: px2dp(44),
-        display: 'flex',
-        justifyContent: 'center',
-        alignItems: 'center',
-        borderRadius: px2dp(10),
-        borderWidth: px2dp(1),
-        borderColor: '#A3A9CC'
-    },
-
-    confirm: {
-        width: '40%',
-        height: px2dp(44),
-        display: 'flex',
-        justifyContent: 'center',
-        alignItems: 'center',
-        backgroundColor: '#2763FF',
-        borderRadius: px2dp(10)
-    },
-    cancelText: {
-        fontSize: px2sp(15),
-        color: '#A3A9CC',
-
-    },
-    confirmText: {
-        fontSize: px2sp(15),
-        color: 'white'
-    },
-})

package/lib/Hud/AlertView/index.d.ts

@@ -1,46 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-22 17:30:32
- * @LastEditors: shiguo
- * @LastEditTime: 2023-03-10 12:21:30
- * @FilePath: /@aks-dev/easyui/lib/Hud/AlertView/index.d.ts
- */
-import * as React from 'react'
-
-
-import { StyleProp, ViewStyle, TextStyle } from 'react-native'
-
-
-export declare type AlertViewOptions = {
-    title: string;
-    content: string | React.ReactElement;
-    wrapperStyle: StyleProp<ViewStyle>;
-    cancelText: string;
-    cancelContainerStyle: StyleProp<ViewStyle>;
-    cancelTextStyle: StyleProp<TextStyle>;
-    cancel: () => void;
-    cancelDisabled:boolean;
-    confirmText: string;
-    confirmContainerStyle: StyleProp<ViewStyle>;
-    confirmTextStyle: StyleProp<TextStyle>;
-    confirm: () => void;
-}
-
-
-export declare const showAlertModal: (props: Partial<AlertViewOptions>) => void;
-
-
-
-declare namespace AlertViewOptions {
-    type RefAttributes = {
-        show: (options: Partial<AlertViewOptions>) => void;
-        hide: () => void;
-    }
-}
-
-
-
-
-export declare const AlertView: React.ForwardRefExoticComponent<React.PropsWithoutRef<{}> & React.RefAttributes<AlertViewOptions.RefAttributes>>;
-
-export declare const alertViewRef: React.RefObject<AlertViewOptions.RefAttributes>

package/lib/Hud/Hud.tsx

@@ -1,67 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-24 14:10:04
- * @LastEditors: shiguo
- * @LastEditTime: 2023-03-23 11:13:55
- * @FilePath: /aks-fire-app/node_modules/@aks-dev/easyui/lib/Hud/Hud.tsx
- */
-import * as React from 'react'
-// import { StyleSheet } from 'react-native'
-import {
-    alertViewRef, default as AlertView, showAlertModal
-} from './AlertView/AlertView'
-
-import {
-    alertBottomViewRef, default as AlertBottomView, showAlertBottomModal
-} from './AlertBottomView/AlertBottomView'
-import {
-    alertSheetViewRef, default as AlertSheetView, showAlertSheetModal
-} from './AlertSheetView/AlertSheetView'
-
-import {
-    hideLoading, Loading, loadingRef, showLoading
-} from './Loading/Loading'
-
-
-import {
-    showToast, Toast, toastRef
-} from './Toast/Toast'
-
-
-import { showPopoverView, hidePopoverView, popoverViewRef, PopoverView } from './PopoverView/PopoverView'
-
-
-import {
-    showScanner, hideScanner, scannerRef, Scanner
-} from './Scanner/Scanner'
-
-
-
-
-export const Hud: React.FC<{}> = () => React.cloneElement(
-    <></>,
-    {
-        // ...StyleSheet.absoluteFillObject,
-        // display: 'flex',
-    },
-    [
-        <Loading key="hud-0" ref={loadingRef} />,
-        <Toast key="hud-1" ref={toastRef} />,
-        <AlertView key="hud-2" ref={alertViewRef} />,
-        <AlertBottomView key="hud-3-0" ref={alertBottomViewRef} />,
-        <AlertSheetView key="hud-3-1" ref={alertSheetViewRef} />,
-        <PopoverView key="hud-4" ref={popoverViewRef} />,
-        <Scanner key="hud-5" ref={scannerRef} />,
-    ]
-)
-
-
-export {
-    showAlertModal,
-    showToast,
-    showLoading, hideLoading,
-    showAlertBottomModal,
-    showAlertSheetModal,
-    showPopoverView, hidePopoverView,
-    showScanner,hideScanner,
-}

package/lib/Hud/Loading/Loading.tsx

@@ -1,87 +0,0 @@
-/*
- * @Author: shiguo
- * @Date: 2022-04-24 14:27:02
- * @LastEditors: shiguo
- * @LastEditTime: 2022-09-09 10:55:48
- * @FilePath: /@aks-dev/easyui/lib/Hud/Loading/Loading.tsx
- */
-import React, { useImperativeHandle, useState } from 'react';
-import { View, ActivityIndicator, StyleSheet, Text, Dimensions, TouchableOpacity, BackHandler } from 'react-native';
-
-import { LoadingOptions } from '.'
-
-
-
-
-
-export const Loading = React.forwardRef<LoadingOptions.RefAttributes, {}>((_, ref) => {
-    const [show, setShow] = useState(false);
-    const [tipText, setTipText] = useState('加载中');
-
-
-    React.useEffect(() => {
-        const onBackPress = () => show;
-        BackHandler.addEventListener('hardwareBackPress', onBackPress);
-        return () => BackHandler.removeEventListener('hardwareBackPress', onBackPress);
-    }, [show])
-
-
-    useImperativeHandle<unknown, LoadingOptions.RefAttributes>(ref, () => ({
-        showLoading: (content?: string) => {
-            setShow(true);
-            setTipText(content || '加载中')
-        },
-        hideLoading: () => {
-            setShow(false);
-        }
-    }), [show])
-
-    if (!show)
-        return null;
-
-    return (
-        <TouchableOpacity disabled style={styles.container}>
-            <View style={styles.warpper}>
-                <ActivityIndicator color="white" size='large' />
-                <Text numberOfLines={5} style={styles.title}>{tipText}
-                </Text>
-            </View>
-        </TouchableOpacity>
-    )
-})
-
-export const loadingRef = React.createRef<LoadingOptions.RefAttributes>();
-export const showLoading = (content?: string) => loadingRef.current?.showLoading(content)
-export const hideLoading = () => loadingRef.current?.hideLoading()
-
-
-
-const SCREEN_WIDTH = Dimensions.get('window').width;
-const styles = StyleSheet.create({
-    container: {
-        ...StyleSheet.absoluteFillObject,
-        display: 'flex',
-        justifyContent: 'center',
-        alignItems: 'center',
-        // backgroundColor:'red'
-    },
-
-    warpper: {
-        backgroundColor: '#00000088',
-        padding: 40,
-        paddingVertical: 20,
-        borderRadius: 10,
-        justifyContent: 'center',
-        alignItems: 'center',
-        minWidth: 90
-    },
-    title: {
-        marginTop: 5,
-        fontSize: 13,
-        lineHeight: 16,
-        color: 'white',
-        maxWidth: SCREEN_WIDTH * 0.5,
-
-    }
-
-})

package/lib/Hud/Loading/index.d.ts

@@ -1,38 +0,0 @@
-
-/*
- * @Author: shiguo
- * @Date: 2022-04-24 14:27:02
- * @LastEditors: shiguo
- * @LastEditTime: 2022-09-09 10:55:28
- * @FilePath: /@aks-dev/easyui/lib/Hud/Loading/index.ts
- */
-import * as React from 'react'
-
-
-
-
-
-
-
-
-
-
-declare namespace LoadingOptions {
-    type RefAttributes = {
-        showLoading: (content?: string) => void;
-        hideLoading: () => void;
-    }
-}
-
-
-
-export declare const showLoading: (content?: string) => void;
-
-
-export declare const hideLoading: () => void;
-
-
-export declare const loadingRef: React.RefObject<LoadingOptions.RefAttributes>;
-
-export declare const Loading: React.ForwardRefExoticComponent<React.PropsWithoutRef<{}> & React.RefAttributes<LoadingOptions.RefAttributes>>
-