secullum-react-native-ui 4.3.7 → 4.3.8-beta.2

package/lib/components/ImageButton.js

@@ -1,32 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
-const theme_1 = require("../modules/theme");
-const react_native_1 = require("react-native");
-class ImageButton extends React.Component {
-    render() {
-        const { icon, style, iconColor, onPress, iconSize, hitBoxSize, nativeID } = this.props;
-        return (React.createElement(react_native_1.TouchableOpacity, { onPress: onPress, activeOpacity: 0.5, style: [styles.container, style], hitSlop: hitBoxSize
-                ? {
-                    top: hitBoxSize,
-                    bottom: hitBoxSize,
-                    left: hitBoxSize,
-                    right: hitBoxSize
-                }
-                : undefined },
-            React.createElement(FontAwesome_1.default, { nativeID: nativeID, name: icon, size: iconSize || 20, color: iconColor || theme.textColor1 })));
-    }
-}
-exports.ImageButton = ImageButton;
-const theme = theme_1.getTheme();
-const styles = react_native_1.StyleSheet.create({
-    container: {
-        borderWidth: 1,
-        borderColor: theme.borderColor1,
-        alignItems: 'center',
-        justifyContent: 'center',
-        width: 40,
-        height: 40
-    }
-});

package/lib/components/KeyboardAvoidingView.d.ts

@@ -1,33 +0,0 @@
-import * as React from 'react';
-import { EmitterSubscription, KeyboardEvent, NativeScrollEvent, RefreshControlProps, ScrollView } from 'react-native';
-export interface KeyboardAvoidingViewProperties {
-    extraFieldHeight: number;
-    extraWindowHeight: number;
-    refreshControl?: React.ReactElement<RefreshControlProps>;
-    children: (options: {
-        availableHeight: number;
-    }) => JSX.Element;
-    scrollEnabled?: boolean;
-    onScroll?: (event: NativeScrollEvent) => void;
-}
-export interface KeyboardAvoidingViewState {
-    keyboardHeight: number;
-}
-export declare class KeyboardAvoidingView extends React.Component<KeyboardAvoidingViewProperties, KeyboardAvoidingViewState> {
-    static defaultProps: {
-        extraFieldHeight: number;
-        extraWindowHeight: number;
-        scrollEnabled: boolean;
-    };
-    keyboardDidShowSubscription?: EmitterSubscription;
-    keyboardDidHideSubscription?: EmitterSubscription;
-    scrollViewRef: React.RefObject<ScrollView>;
-    state: KeyboardAvoidingViewState;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    handleKeyboardShow: (event: KeyboardEvent) => void;
-    handleKeyboardHide: () => void;
-    scrollTo: (x: number, y: number) => void;
-    scrollToEnd: () => void;
-    render(): JSX.Element;
-}

package/lib/components/KeyboardAvoidingView.js

@@ -1,91 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const react_native_1 = require("react-native");
-class KeyboardAvoidingView extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.scrollViewRef = React.createRef();
-        this.state = {
-            keyboardHeight: 0
-        };
-        this.handleKeyboardShow = (event) => {
-            const keyboardHeight = event.endCoordinates.height;
-            const keyboardPosition = event.endCoordinates.screenY;
-            this.setState({
-                keyboardHeight
-            });
-            const scrollView = this.scrollViewRef.current;
-            if (!scrollView) {
-                return;
-            }
-            //@ts-ignore
-            const currentlyFocusedInput = react_native_1.TextInput.State.currentlyFocusedInput();
-            if (!currentlyFocusedInput) {
-                return;
-            }
-            const { extraFieldHeight, extraWindowHeight } = this.props;
-            const currentlyFocusedInputNode = react_native_1.findNodeHandle(currentlyFocusedInput);
-            // @ts-ignore: no types :(
-            react_native_1.UIManager.viewIsDescendantOf(currentlyFocusedInputNode, react_native_1.findNodeHandle(scrollView), (isDescendant) => {
-                if (!isDescendant) {
-                    return;
-                }
-                currentlyFocusedInput.measure((x, y, width, height, pageX, pageY) => {
-                    const fieldPosition = pageY + height + extraFieldHeight;
-                    if (fieldPosition <= keyboardPosition) {
-                        return;
-                    }
-                    scrollView.scrollResponderScrollNativeHandleToKeyboard(currentlyFocusedInputNode, extraWindowHeight + extraFieldHeight, true);
-                });
-            });
-        };
-        this.handleKeyboardHide = () => {
-            this.setState({
-                keyboardHeight: 0
-            });
-        };
-        this.scrollTo = (x, y) => {
-            if (!this.scrollViewRef.current) {
-                return;
-            }
-            this.scrollViewRef.current.scrollTo({ x, y });
-        };
-        this.scrollToEnd = () => {
-            if (!this.scrollViewRef.current) {
-                return;
-            }
-            this.scrollViewRef.current.scrollToEnd();
-        };
-    }
-    componentDidMount() {
-        // Android doesn't have 'will' events, but we can use 'did' there without any problem
-        // iOS on the other hand needs to use the 'will' events otherwise the screen would show some empty spaces during keyboard events
-        this.keyboardDidShowSubscription = react_native_1.Keyboard.addListener(react_native_1.Platform.OS === 'ios' ? 'keyboardWillShow' : 'keyboardDidShow', this.handleKeyboardShow);
-        this.keyboardDidHideSubscription = react_native_1.Keyboard.addListener(react_native_1.Platform.OS === 'ios' ? 'keyboardWillHide' : 'keyboardDidHide', this.handleKeyboardHide);
-    }
-    componentWillUnmount() {
-        this.keyboardDidShowSubscription.remove();
-        this.keyboardDidHideSubscription.remove();
-    }
-    render() {
-        // Android devices with notch will report less `availableHeight` than it should
-        // That's because of this: https://github.com/facebook/react-native/issues/23693
-        // If I change it to 'screen', Android devices with virtual buttons will report more than it should
-        const availableHeight = react_native_1.Dimensions.get('window').height -
-            this.state.keyboardHeight -
-            this.props.extraWindowHeight;
-        return (React.createElement(react_native_1.View, { style: { height: availableHeight } },
-            React.createElement(react_native_1.ScrollView, { ref: this.scrollViewRef, refreshControl: this.props.refreshControl, scrollEnabled: this.props.scrollEnabled, onScroll: (e) => {
-                    if (this.props.onScroll) {
-                        this.props.onScroll(e.nativeEvent);
-                    }
-                } }, this.props.children({ availableHeight }))));
-    }
-}
-KeyboardAvoidingView.defaultProps = {
-    extraFieldHeight: 0,
-    extraWindowHeight: 0,
-    scrollEnabled: true
-};
-exports.KeyboardAvoidingView = KeyboardAvoidingView;

package/lib/components/Link.d.ts

@@ -1,17 +0,0 @@
-import * as React from 'react';
-import { StyleProp, TextStyle } from 'react-native';
-export interface LinkProperties {
-    text: string;
-    style?: StyleProp<TextStyle>;
-    onPress: () => void;
-}
-export declare class Link extends React.Component<LinkProperties> {
-    getStyles: () => {
-        link: {
-            fontFamily: string;
-            fontSize: number;
-            color: string;
-        };
-    };
-    render(): JSX.Element;
-}

package/lib/components/Link.js

@@ -1,28 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const theme_1 = require("../modules/theme");
-const react_native_1 = require("react-native");
-class Link extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.getStyles = () => {
-            const theme = theme_1.getTheme();
-            const styles = react_native_1.StyleSheet.create({
-                link: {
-                    fontFamily: theme.fontFamily2,
-                    fontSize: 14,
-                    color: theme.textColor2
-                }
-            });
-            return styles;
-        };
-    }
-    render() {
-        const { text, style, onPress } = this.props;
-        const styles = this.getStyles();
-        return (React.createElement(react_native_1.TouchableOpacity, { activeOpacity: 0.7, onPress: onPress },
-            React.createElement(react_native_1.Text, { style: [styles.link, style] }, text)));
-    }
-}
-exports.Link = Link;

package/lib/components/Loading.d.ts

@@ -1,4 +0,0 @@
-import * as React from 'react';
-export declare class Loading extends React.Component {
-    render(): JSX.Element;
-}

package/lib/components/Loading.js

@@ -1,37 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const react_native_1 = require("react-native");
-class Loading extends React.Component {
-    render() {
-        return (React.createElement(React.Fragment, null,
-            React.createElement(react_native_1.View, { style: styles.backgroundView }),
-            React.createElement(react_native_1.ActivityIndicator, { style: styles.indicator, size: "large", color: "#aaa" })));
-    }
-}
-exports.Loading = Loading;
-const styles = react_native_1.StyleSheet.create({
-    backgroundView: {
-        zIndex: 9998,
-        position: 'absolute',
-        width: '100%',
-        height: '100%',
-        opacity: 0.6,
-        backgroundColor: '#ccc',
-        top: 0,
-        bottom: 0,
-        left: 0,
-        right: 0 // IE fix
-    },
-    indicator: {
-        zIndex: 9999,
-        position: 'absolute',
-        width: '100%',
-        height: '100%',
-        justifyContent: 'space-around',
-        top: 0,
-        bottom: 0,
-        left: 0,
-        right: 0 // IE fix
-    }
-});

package/lib/components/Menu.d.ts

@@ -1,42 +0,0 @@
-import * as React from 'react';
-import { StyleProp, TextStyle } from 'react-native';
-export interface MenuItemData {
-    path?: string;
-    text: string;
-    textStyle?: StyleProp<TextStyle>;
-    subText?: string;
-    subTextStyle?: StyleProp<TextStyle>;
-    disabled?: boolean;
-    nativeID?: string;
-}
-export interface MenuItemProperties {
-    menuItem: MenuItemData;
-    icon?: string;
-    textStyle?: StyleProp<TextStyle>;
-    onPress: () => void;
-    isCurrentMenuPath?: (path: string) => boolean;
-}
-export declare function MenuItem(props: MenuItemProperties): JSX.Element;
-export interface MenuProperties {
-    menu: Array<MenuItemData & {
-        submenu?: Array<MenuItemData>;
-    }>;
-    onMenuPress: (path: string) => void;
-    isCurrentMenuPath?: (path: string) => boolean;
-}
-export interface MenuState {
-    indexMenuOpened: number;
-}
-export declare class Menu extends React.Component<MenuProperties, MenuState> {
-    state: MenuState;
-    componentDidMount(): void;
-    handleParentMenuPress: (index: number) => void;
-    handleMenuPress: (path?: string | undefined) => void;
-    getStyles: () => {
-        submenuText: {
-            paddingLeft: number;
-            paddingVertical: number;
-        };
-    };
-    render(): JSX.Element;
-}

package/lib/components/Menu.js

@@ -1,112 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
-const theme_1 = require("../modules/theme");
-const layout_1 = require("../modules/layout");
-const react_native_1 = require("react-native");
-function MenuItem(props) {
-    const theme = theme_1.getTheme();
-    const styles = react_native_1.StyleSheet.create({
-        container: {
-            flexDirection: 'row',
-            justifyContent: 'space-between',
-            width: '100%',
-            paddingRight: 10
-        },
-        text: {
-            color: theme.textColor1,
-            fontFamily: theme.fontFamily1,
-            fontSize: layout_1.isTablet() ? 20 : 16,
-            paddingVertical: layout_1.isTablet() ? 15 : 14
-        },
-        textDisabled: {
-            color: theme.borderColor1
-        },
-        textSelected: {
-            color: theme.textColor2
-        },
-        subText: {
-            fontSize: 12,
-            marginLeft: 5
-        },
-        icon: {
-            paddingTop: 12,
-            paddingRight: 10,
-            color: theme.textColor1
-        }
-    });
-    const { menuItem, icon, textStyle, onPress, isCurrentMenuPath } = props;
-    const selected = isCurrentMenuPath != undefined &&
-        menuItem.path != undefined &&
-        isCurrentMenuPath(menuItem.path);
-    return (React.createElement(react_native_1.TouchableOpacity, { disabled: menuItem.disabled, style: styles.container, onPress: onPress },
-        React.createElement(react_native_1.Text, { nativeID: menuItem.nativeID, style: [
-                styles.text,
-                menuItem.disabled && styles.textDisabled,
-                selected && styles.textSelected,
-                textStyle,
-                menuItem.textStyle
-            ] },
-            menuItem.text,
-            menuItem.subText && (React.createElement(react_native_1.Text, { style: [styles.subText, menuItem.subTextStyle] }, menuItem.subText))),
-        icon && React.createElement(FontAwesome_1.default, { name: icon, style: styles.icon, size: 20 })));
-}
-exports.MenuItem = MenuItem;
-class Menu extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.state = {
-            indexMenuOpened: -1
-        };
-        this.handleParentMenuPress = (index) => {
-            this.setState({
-                indexMenuOpened: this.state.indexMenuOpened === index ? -1 : index
-            });
-        };
-        this.handleMenuPress = (path) => {
-            if (path != undefined) {
-                this.props.onMenuPress(path);
-            }
-        };
-        this.getStyles = () => {
-            const styles = react_native_1.StyleSheet.create({
-                submenuText: {
-                    paddingLeft: 20,
-                    paddingVertical: layout_1.isTablet() ? 10 : 8
-                }
-            });
-            return styles;
-        };
-    }
-    componentDidMount() {
-        const { menu, isCurrentMenuPath } = this.props;
-        const indexMenuOpened = menu.findIndex(menuItem => menuItem.submenu != undefined &&
-            menuItem.submenu.some(submenuItem => isCurrentMenuPath != undefined &&
-                submenuItem.path != undefined &&
-                isCurrentMenuPath(submenuItem.path)));
-        this.setState({ indexMenuOpened });
-    }
-    render() {
-        const { menu, isCurrentMenuPath } = this.props;
-        const styles = this.getStyles();
-        return (React.createElement(React.Fragment, null, menu.map((menuItem, menuItemIndex) => {
-            const menuItemIsOpen = this.state.indexMenuOpened === menuItemIndex;
-            const menuItemIcon = menuItem.submenu
-                ? menuItemIsOpen
-                    ? 'caret-up'
-                    : 'caret-down'
-                : undefined;
-            const menuItemOnPress = () => menuItem.submenu
-                ? this.handleParentMenuPress(menuItemIndex)
-                : this.handleMenuPress(menuItem.path);
-            return (React.createElement(react_native_1.View, { key: menuItemIndex },
-                React.createElement(MenuItem, { menuItem: menuItem, icon: menuItemIcon, onPress: menuItemOnPress, isCurrentMenuPath: isCurrentMenuPath }),
-                menuItem.submenu && (React.createElement(react_native_1.View, { style: {
-                        height: menuItemIsOpen ? 'auto' : 0,
-                        overflow: 'hidden'
-                    } }, menuItem.submenu.map((submenuItem, submenuItemIndex) => (React.createElement(MenuItem, { key: submenuItemIndex, menuItem: submenuItem, textStyle: styles.submenuText, onPress: () => this.handleMenuPress(submenuItem.path), isCurrentMenuPath: isCurrentMenuPath })))))));
-        })));
-    }
-}
-exports.Menu = Menu;

package/lib/components/MenuDesktop.d.ts

@@ -1,24 +0,0 @@
-import * as React from 'react';
-import { MenuProperties } from './Menu';
-export declare type MenuDesktopProperties = MenuProperties & {
-    headerHeight: number;
-    renderUserData?: () => React.ReactNode;
-};
-export declare class MenuDesktop extends React.Component<MenuDesktopProperties> {
-    static defaultProps: {
-        headerHeight: number;
-    };
-    getStyles: () => {
-        container: {
-            backgroundColor: string;
-            height: number;
-            width: number;
-            paddingHorizontal: number;
-            paddingVertical: number;
-            shadowOpacity: number;
-            shadowRadius: number;
-            shadowColor: string;
-        };
-    };
-    render(): JSX.Element;
-}

package/lib/components/MenuDesktop.js

@@ -1,38 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const react_native_1 = require("react-native");
-const theme_1 = require("../modules/theme");
-const Menu_1 = require("./Menu");
-class MenuDesktop extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.getStyles = () => {
-            const theme = theme_1.getTheme();
-            const styles = react_native_1.StyleSheet.create({
-                container: {
-                    backgroundColor: theme.backgroundColor1,
-                    height: react_native_1.Dimensions.get('window').height - this.props.headerHeight,
-                    width: 250,
-                    paddingHorizontal: 15,
-                    paddingVertical: 15,
-                    shadowOpacity: 0.31,
-                    shadowRadius: 20,
-                    shadowColor: theme.shadowColor1
-                }
-            });
-            return styles;
-        };
-    }
-    render() {
-        const { menu, onMenuPress, isCurrentMenuPath, renderUserData } = this.props;
-        const styles = this.getStyles();
-        return (React.createElement(react_native_1.View, { style: styles.container },
-            renderUserData ? React.createElement(react_native_1.View, null, renderUserData()) : null,
-            React.createElement(Menu_1.Menu, { menu: menu, isCurrentMenuPath: isCurrentMenuPath, onMenuPress: onMenuPress })));
-    }
-}
-MenuDesktop.defaultProps = {
-    headerHeight: 0
-};
-exports.MenuDesktop = MenuDesktop;

package/lib/components/MenuMobile.d.ts

@@ -1,47 +0,0 @@
-import * as React from 'react';
-import DrawerLayout from 'react-native-drawer-layout';
-import { MenuProperties } from './Menu';
-export declare type MenuMobileProperties = MenuProperties & {
-    children: React.ReactNode;
-    drawerLockMode?: 'unlocked' | 'locked-closed' | 'locked-open';
-    renderLogo: () => React.ReactNode;
-    renderUserData?: () => React.ReactNode;
-};
-export interface MenuMobileState {
-    opened: boolean;
-}
-export declare class MenuMobile extends React.Component<MenuMobileProperties, MenuMobileState> {
-    state: MenuMobileState;
-    drawer: DrawerLayout | null;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    handleBackButton: () => boolean;
-    handleMenuPress: (path: string) => void;
-    open: () => void;
-    close: () => void;
-    getStyles: () => {
-        container: {
-            flex: number;
-        };
-        logoContainer: {
-            paddingVertical: number;
-            paddingLeft: number;
-            borderBottomColor: string;
-            borderBottomWidth: number;
-            flexDirection: "row";
-        };
-        userContainer: {
-            paddingVertical: number;
-            paddingLeft: number;
-            paddingRight: number;
-            borderBottomColor: string;
-            borderBottomWidth: number;
-        };
-        menuContainer: {
-            paddingLeft: number;
-            flex: number;
-        };
-    };
-    renderNavigationView: () => JSX.Element;
-    render(): JSX.Element;
-}

package/lib/components/MenuMobile.js

@@ -1,85 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const React = require("react");
-const react_native_1 = require("react-native");
-const react_native_drawer_layout_1 = require("react-native-drawer-layout");
-const theme_1 = require("../modules/theme");
-const layout_1 = require("../modules/layout");
-const Menu_1 = require("./Menu");
-class MenuMobile extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.state = {
-            opened: false
-        };
-        this.drawer = null;
-        this.handleBackButton = () => {
-            if (this.state.opened) {
-                this.close();
-                return true;
-            }
-            return false;
-        };
-        this.handleMenuPress = (path) => {
-            this.close();
-            this.props.onMenuPress(path);
-        };
-        this.open = () => {
-            if (this.drawer) {
-                this.drawer.openDrawer();
-            }
-        };
-        this.close = () => {
-            if (this.drawer) {
-                this.drawer.closeDrawer();
-            }
-        };
-        this.getStyles = () => {
-            const theme = theme_1.getTheme();
-            const styles = react_native_1.StyleSheet.create({
-                container: {
-                    flex: 1
-                },
-                logoContainer: {
-                    paddingVertical: 5,
-                    paddingLeft: 10,
-                    borderBottomColor: theme.borderColor1,
-                    borderBottomWidth: 1,
-                    flexDirection: 'row'
-                },
-                userContainer: {
-                    paddingVertical: 10,
-                    paddingLeft: 20,
-                    paddingRight: 10,
-                    borderBottomColor: theme.borderColor1,
-                    borderBottomWidth: 1
-                },
-                menuContainer: {
-                    paddingLeft: 20,
-                    flex: 1
-                }
-            });
-            return styles;
-        };
-        this.renderNavigationView = () => {
-            const { renderLogo, renderUserData, menu, isCurrentMenuPath } = this.props;
-            const styles = this.getStyles();
-            return (React.createElement(react_native_1.View, { style: styles.container },
-                React.createElement(react_native_1.View, { style: styles.logoContainer }, renderLogo()),
-                renderUserData && (React.createElement(react_native_1.View, { style: styles.userContainer }, renderUserData())),
-                React.createElement(react_native_1.ScrollView, { style: styles.menuContainer },
-                    React.createElement(Menu_1.Menu, { menu: menu, isCurrentMenuPath: isCurrentMenuPath, onMenuPress: this.handleMenuPress }))));
-        };
-    }
-    componentDidMount() {
-        react_native_1.BackHandler.addEventListener('hardwareBackPress', this.handleBackButton);
-    }
-    componentWillUnmount() {
-        react_native_1.BackHandler.removeEventListener('hardwareBackPress', this.handleBackButton);
-    }
-    render() {
-        const theme = theme_1.getTheme();
-        return (React.createElement(react_native_drawer_layout_1.default, { ref: drawer => (this.drawer = drawer), drawerLockMode: this.props.drawerLockMode, drawerBackgroundColor: theme.backgroundColor1, drawerWidth: layout_1.isTablet() ? 450 : 300, drawerPosition: react_native_drawer_layout_1.default.positions.Left, renderNavigationView: this.renderNavigationView, onDrawerOpen: () => this.setState({ opened: true }), onDrawerClose: () => this.setState({ opened: false }) }, this.props.children));
-    }
-}
-exports.MenuMobile = MenuMobile;

package/lib/components/Message.d.ts

@@ -1,37 +0,0 @@
-import * as React from 'react';
-import { StyleProp, TextStyle } from 'react-native';
-export interface MessageProperties {
-    message: string;
-    visible: boolean;
-    type?: 'info' | 'warning';
-    onRequestClose?: () => void;
-    nativeID?: string;
-    textStyle?: StyleProp<TextStyle>;
-}
-export declare class Message extends React.Component<MessageProperties> {
-    static defaultProps: {
-        type: string;
-    };
-    getStyles: () => {
-        overlay: {
-            alignItems: "center";
-        };
-        container: {
-            backgroundColor: string;
-            borderRadius: number;
-            padding: number;
-            width: number;
-            marginTop: number;
-            alignItems: "center";
-        };
-        text: {
-            color: string;
-            fontFamily: string;
-            fontSize: number;
-            textAlign: "center";
-            marginTop: number;
-            width: string;
-        };
-    };
-    render(): JSX.Element;
-}