secullum-react-native-ui 4.16.2-beta.7 → 4.16.2-beta.8

package/lib/components/DropDown.d.ts

@@ -1,52 +0,0 @@
-import * as React from 'react';
-import { IconProps } from 'react-native-vector-icons/Icon';
-import { StyleProp, ViewStyle, TextStyle } from 'react-native';
-declare type DropDownItemData = {
-    label: string;
-    value: any;
-    icon?: string;
-    nativeID?: string;
-};
-export interface DropDownProperties {
-    label?: string;
-    items: DropDownItemData[];
-    value: any | null;
-    onChange: (value: any) => void;
-    onPress?: () => void | boolean | Promise<void> | Promise<boolean>;
-    emptyMessage: string;
-    disabled?: boolean;
-    style?: StyleProp<ViewStyle>;
-    disabledStyle?: StyleProp<ViewStyle>;
-    labelStyle?: StyleProp<TextStyle>;
-    inputStyle?: StyleProp<TextStyle>;
-    iconComponent?: React.ComponentClass<IconProps>;
-    nativeID?: string;
-    icon?: string | undefined;
-    arrowColor?: string | undefined;
-    searchable?: SearchableProps;
-    virtualized?: true | VirtualizedProps | null;
-}
-export interface SearchableProps {
-    placeHolder: string;
-    minItemsToSearch?: number;
-}
-export interface VirtualizedProps {
-    initialNumToRender?: number;
-    maxToRenderPerBatch?: number;
-    windowSize?: number;
-}
-export interface DropDownState {
-    modalOpen: boolean;
-    searchText: string;
-}
-export declare class DropDown extends React.Component<DropDownProperties, DropDownState> {
-    state: DropDownState;
-    handleItemPress: (value: any) => void;
-    filterItems: () => DropDownItemData[];
-    shouldDisplaySearchField: () => boolean | undefined;
-    renderClosedDropDown: (item: any, inputStyle: any) => JSX.Element | null;
-    getStyles: () => any;
-    renderItemsList: (filteredItems: DropDownItemData[]) => JSX.Element;
-    render(): JSX.Element;
-}
-export {};

package/lib/components/DropDown.js

@@ -1,351 +0,0 @@
-"use strict";
-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) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DropDown = void 0;
-const React = require("react");
-const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
-const Modal_1 = require("./Modal");
-const layout_1 = require("../modules/layout");
-const theme_1 = require("../modules/theme");
-const test_1 = require("../modules/test");
-const react_native_1 = require("react-native");
-class DropDownItem extends React.PureComponent {
-    constructor() {
-        super(...arguments);
-        this.getStyles = () => {
-            const theme = (0, theme_1.getTheme)();
-            const styles = react_native_1.StyleSheet.create({
-                modalItem: {
-                    paddingHorizontal: 16,
-                    paddingVertical: 16,
-                    fontFamily: theme.fontFamily1,
-                    fontSize: 16,
-                    color: theme.dropDownTextColor
-                },
-                icon: {
-                    fontSize: 26
-                },
-                rowView: {
-                    flexDirection: 'row'
-                },
-                iconView: {
-                    width: 100,
-                    alignItems: 'center',
-                    justifyContent: 'center'
-                },
-                iconOnlyView: {
-                    width: 200,
-                    alignItems: 'center',
-                    justifyContent: 'center'
-                },
-                iconOnly: {
-                    paddingHorizontal: 16,
-                    paddingVertical: 16,
-                    fontSize: 60
-                }
-            });
-            return styles;
-        };
-        this.renderOpenDropDownItem = () => {
-            const { label, icon, iconComponent, nativeID } = this.props;
-            const theme = (0, theme_1.getTheme)();
-            const styles = this.getStyles();
-            if (label && icon) {
-                return (React.createElement(react_native_1.View, { nativeID: nativeID, style: styles.rowView },
-                    React.createElement(react_native_1.View, { style: styles.iconView }, iconComponent ? (React.createElement(iconComponent, {
-                        name: icon,
-                        style: styles.icon,
-                        color: theme.textColor1
-                    })) : (React.createElement(FontAwesome_1.default, { name: icon, color: theme.textColor1, style: styles.icon }))),
-                    React.createElement(react_native_1.View, null,
-                        React.createElement(react_native_1.Text, { style: styles.modalItem }, label))));
-            }
-            else if (label && !icon) {
-                return (React.createElement(react_native_1.View, { nativeID: nativeID, style: styles.rowView },
-                    React.createElement(react_native_1.Text, { style: styles.modalItem }, label)));
-            }
-            else if (!label && icon) {
-                return (React.createElement(react_native_1.View, { nativeID: nativeID, style: styles.iconOnlyView }, iconComponent ? (React.createElement(iconComponent, {
-                    name: icon,
-                    style: styles.iconOnly,
-                    color: theme.textColor1
-                })) : (React.createElement(FontAwesome_1.default, { name: icon, color: theme.textColor1, style: styles.iconOnly }))));
-            }
-            return null;
-        };
-    }
-    render() {
-        const { first, last, value, onPress, nativeID } = this.props;
-        const theme = (0, theme_1.getTheme)();
-        return (React.createElement(react_native_1.TouchableHighlight, { onPress: () => onPress(value), testID: (0, test_1.getTestID)(nativeID), underlayColor: theme.backgroundColor2, style: {
-                borderTopLeftRadius: first ? 5 : 0,
-                borderTopRightRadius: first ? 5 : 0,
-                borderBottomLeftRadius: last ? 5 : 0,
-                borderBottomRightRadius: last ? 5 : 0
-            } }, this.renderOpenDropDownItem()));
-    }
-}
-const DEFAULT_VIRTUALIZED = {
-    initialNumToRender: 20,
-    maxToRenderPerBatch: 30,
-    windowSize: 10
-};
-class DropDown extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.state = {
-            modalOpen: false,
-            searchText: ''
-        };
-        this.handleItemPress = (value) => {
-            const { onChange } = this.props;
-            this.setState({ modalOpen: false });
-            onChange(value);
-        };
-        this.filterItems = () => {
-            const { items } = this.props;
-            const { searchText } = this.state;
-            return items.filter(item => item.label.toLowerCase().includes(searchText.toLowerCase()));
-        };
-        this.shouldDisplaySearchField = () => {
-            const { items, searchable } = this.props;
-            const defaultQuantityToSearch = 10;
-            return (searchable &&
-                items.length >= (searchable.minItemsToSearch || defaultQuantityToSearch));
-        };
-        this.renderClosedDropDown = (item, inputStyle) => {
-            const { iconComponent } = this.props;
-            const theme = (0, theme_1.getTheme)();
-            const styles = this.getStyles();
-            if (!item) {
-                return (React.createElement(React.Fragment, null,
-                    React.createElement(react_native_1.Text, { style: [styles.text, inputStyle] }, "-"),
-                    React.createElement(FontAwesome_1.default, { name: "caret-down", style: styles.seta })));
-            }
-            else if (item.label && item.icon) {
-                return (React.createElement(React.Fragment, null,
-                    React.createElement(react_native_1.View, { style: styles.rowView },
-                        React.createElement(react_native_1.View, { style: styles.iconView }, iconComponent ? (React.createElement(iconComponent, {
-                            name: item.icon,
-                            style: styles.icon,
-                            color: theme.textColor1
-                        })) : (React.createElement(FontAwesome_1.default, { name: item.icon, color: theme.textColor1, style: styles.icon }))),
-                        React.createElement(react_native_1.Text, { style: [styles.textIcon, inputStyle] }, item.label)),
-                    React.createElement(FontAwesome_1.default, { name: "caret-down", style: styles.seta })));
-            }
-            else if (item.label && !item.icon) {
-                return (React.createElement(React.Fragment, null,
-                    React.createElement(react_native_1.Text, { style: [styles.text, inputStyle] }, item.label),
-                    React.createElement(FontAwesome_1.default, { name: "caret-down", style: styles.seta })));
-            }
-            else if (!item.label && item.icon) {
-                return (React.createElement(React.Fragment, null,
-                    iconComponent ? (React.createElement(iconComponent, {
-                        name: item.icon,
-                        style: styles.iconOnly,
-                        color: theme.textColor1
-                    })) : (React.createElement(FontAwesome_1.default, { name: item.icon, color: theme.textColor1, style: styles.iconOnly })),
-                    React.createElement(FontAwesome_1.default, { name: "caret-down", style: styles.setaIcone })));
-            }
-            return null;
-        };
-        this.getStyles = () => {
-            const theme = (0, theme_1.getTheme)();
-            const { icon, arrowColor } = this.props;
-            const styles = react_native_1.StyleSheet.create({
-                container: Object.assign({ paddingHorizontal: 16, paddingVertical: 8, borderWidth: 1, borderColor: theme.borderColor1, borderRadius: 3 }, (icon
-                    ? {
-                        flexDirection: 'row',
-                        minHeight: react_native_1.Platform.OS === 'web' || react_native_1.Platform.OS === 'ios' ? 40 : 46
-                    }
-                    : {})),
-                label: {
-                    color: theme.textColor2,
-                    fontFamily: theme.fontFamily3,
-                    fontSize: (0, layout_1.isTablet)() ? 15 : 12,
-                    lineHeight: 16
-                },
-                text: {
-                    lineHeight: (0, layout_1.isTablet)() ? 28 : 22,
-                    minHeight: (0, layout_1.isTablet)() ? 28 : 22,
-                    textAlignVertical: 'center',
-                    color: theme.textColor1,
-                    fontFamily: theme.fontFamily1,
-                    fontSize: 16
-                },
-                textIcon: {
-                    height: 27,
-                    alignSelf: 'center',
-                    color: theme.textColor1,
-                    fontFamily: theme.fontFamily1,
-                    fontSize: 16
-                },
-                seta: {
-                    color: arrowColor ? arrowColor : theme.textColor1,
-                    fontSize: 16,
-                    position: 'absolute',
-                    bottom: 10,
-                    right: 16
-                },
-                setaIcone: {
-                    color: arrowColor ? arrowColor : theme.textColor1,
-                    fontSize: 16,
-                    position: 'absolute',
-                    bottom: 25,
-                    right: 16
-                },
-                modalOverlay: {
-                    justifyContent: this.shouldDisplaySearchField()
-                        ? 'flex-start'
-                        : 'center',
-                    paddingTop: this.shouldDisplaySearchField() && react_native_1.Platform.OS === 'ios' ? 44 : 0
-                },
-                modalContainer: {
-                    maxHeight: '95%',
-                    borderRadius: 5,
-                    backgroundColor: theme.backgroundColor1,
-                    margin: 16
-                },
-                modalItem: {
-                    paddingHorizontal: 16,
-                    paddingVertical: 16,
-                    fontFamily: theme.fontFamily1,
-                    fontSize: 16
-                },
-                emptyMessageContainer: {
-                    flexDirection: 'row',
-                    alignItems: 'center',
-                    paddingHorizontal: 16
-                },
-                readonly: {
-                    backgroundColor: theme.disabledColor
-                },
-                icon: {
-                    fontSize: 26
-                },
-                rowView: {
-                    flexDirection: 'row'
-                },
-                iconView: {
-                    width: 50,
-                    alignItems: 'center'
-                },
-                iconOnlyView: {
-                    width: 200,
-                    alignItems: 'center',
-                    justifyContent: 'center'
-                },
-                iconOnly: {
-                    paddingHorizontal: 16,
-                    paddingVertical: 8,
-                    fontSize: 26
-                },
-                iconOnLine: {
-                    color: theme.textColor2,
-                    fontSize: (0, layout_1.isTablet)() ? 21 : 19,
-                    marginRight: 10,
-                    minWidth: 25,
-                    textAlignVertical: 'center',
-                    flex: 0
-                },
-                searchContainer: {
-                    flexDirection: 'row',
-                    alignItems: 'center',
-                    justifyContent: 'space-between',
-                    marginBottom: 10,
-                    marginTop: 8,
-                    marginRight: 16
-                },
-                searchLabel: {
-                    fontSize: 16,
-                    marginLeft: 16,
-                    fontFamily: theme.fontFamily1
-                },
-                inputWrapper: {
-                    flexDirection: 'row',
-                    alignItems: 'center',
-                    borderWidth: 1,
-                    borderColor: '#ccc',
-                    paddingHorizontal: 10,
-                    backgroundColor: 'white',
-                    flex: 1,
-                    maxWidth: '100%',
-                    minWidth: 150,
-                    overflow: 'hidden',
-                    marginLeft: 16
-                },
-                searchInput: {
-                    flex: 1,
-                    height: 40
-                },
-                searchIcon: {
-                    marginLeft: 10
-                }
-            });
-            return styles;
-        };
-        this.renderItemsList = (filteredItems) => {
-            const { iconComponent, virtualized } = this.props;
-            const renderItem = ({ item, index }) => (React.createElement(DropDownItem, { nativeID: item.nativeID, first: index === 0, last: index === filteredItems.length - 1, label: item.label, value: item.value, onPress: this.handleItemPress, icon: item.icon, iconComponent: iconComponent }));
-            if (virtualized == null) {
-                return (React.createElement(react_native_1.FlatList, { data: filteredItems, initialNumToRender: filteredItems.length, keyExtractor: item => item.value.toString(), renderItem: renderItem }));
-            }
-            const virtualizedProps = virtualized === true
-                ? Object.assign({}, DEFAULT_VIRTUALIZED) : Object.assign(Object.assign({}, DEFAULT_VIRTUALIZED), virtualized);
-            return (React.createElement(react_native_1.VirtualizedList, { getItem: (_, index) => filteredItems[index], getItemCount: () => filteredItems.length, keyExtractor: item => item.value.toString(), renderItem: renderItem, initialNumToRender: virtualizedProps.initialNumToRender, maxToRenderPerBatch: virtualizedProps.maxToRenderPerBatch, windowSize: virtualizedProps.windowSize }));
-        };
-    }
-    render() {
-        const { modalOpen, searchText } = this.state;
-        const { label, items, value, emptyMessage, style, disabledStyle, disabled, labelStyle, inputStyle, nativeID, onPress, icon, searchable } = this.props;
-        const selectedItem = items.find(x => x.value === value);
-        const styles = this.getStyles();
-        const theme = (0, theme_1.getTheme)();
-        const filteredItems = searchable ? this.filterItems() : items;
-        return (React.createElement(react_native_1.TouchableWithoutFeedback, { onPress: () => __awaiter(this, void 0, void 0, function* () {
-                if (onPress) {
-                    const result = yield onPress();
-                    if (result === false) {
-                        return;
-                    }
-                }
-                this.setState({ modalOpen: true, searchText: '' });
-            }), disabled: disabled },
-            React.createElement(react_native_1.View, { nativeID: nativeID, testID: (0, test_1.getTestID)(nativeID), style: [
-                    styles.container,
-                    style,
-                    disabled ? [styles.readonly, disabledStyle] : null
-                ] },
-                icon ? (React.createElement(FontAwesome_1.default, { name: icon, style: styles.iconOnLine })) : (React.createElement(react_native_1.Text, { style: [styles.label, labelStyle] }, label)),
-                this.renderClosedDropDown(selectedItem, inputStyle),
-                React.createElement(Modal_1.Modal, { visible: modalOpen, onRequestClose: () => this.setState({ modalOpen: false }), overlayStyle: styles.modalOverlay },
-                    React.createElement(react_native_1.TouchableWithoutFeedback, { onPress: react_native_1.Keyboard.dismiss },
-                        React.createElement(react_native_1.View, { style: [
-                                styles.modalContainer,
-                                react_native_1.Platform.OS === 'web' && {
-                                    marginVertical: '10px',
-                                    marginHorizontal: 'auto',
-                                    width: '90%',
-                                    maxWidth: 450,
-                                    maxHeight: 300,
-                                    justifyContent: 'center'
-                                }
-                            ] },
-                            this.shouldDisplaySearchField() && (React.createElement(react_native_1.View, { style: styles.searchContainer },
-                                React.createElement(react_native_1.View, { style: styles.inputWrapper },
-                                    React.createElement(react_native_1.TextInput, { nativeID: nativeID + '-text-search', style: styles.searchInput, value: searchText, placeholder: searchable && searchable.placeHolder, onChangeText: text => this.setState({ searchText: text }) }),
-                                    React.createElement(FontAwesome_1.default, { name: "search", size: 16, color: "gray", style: styles.searchIcon })))),
-                            filteredItems.length > 0 ? (this.renderItemsList(filteredItems)) : (React.createElement(react_native_1.View, { style: styles.emptyMessageContainer },
-                                React.createElement(FontAwesome_1.default, { name: "warning", color: theme.warningColor, size: 24 }),
-                                React.createElement(react_native_1.Text, { style: styles.modalItem }, emptyMessage)))))))));
-    }
-}
-exports.DropDown = DropDown;

package/lib/components/ErrorMessage.d.ts

@@ -1,16 +0,0 @@
-import * as React from 'react';
-import { StyleProp, TextStyle } from 'react-native';
-export interface Props {
-    message?: string | null;
-    style?: StyleProp<TextStyle>;
-    nativeID?: string;
-}
-export declare class ErrorMessage extends React.Component<Props> {
-    getStyles: () => {
-        errorMessage: {
-            fontFamily: string;
-            color: string;
-        };
-    };
-    render(): JSX.Element | null;
-}

package/lib/components/ErrorMessage.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ErrorMessage = void 0;
-const React = require("react");
-const react_native_1 = require("react-native");
-const theme_1 = require("../modules/theme");
-const test_1 = require("../modules/test");
-class ErrorMessage extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.getStyles = () => {
-            const theme = (0, theme_1.getTheme)();
-            const styles = react_native_1.StyleSheet.create({
-                errorMessage: {
-                    fontFamily: theme.fontFamily3,
-                    color: theme.errorColor
-                }
-            });
-            return styles;
-        };
-    }
-    render() {
-        const { message, style, nativeID } = this.props;
-        const styles = this.getStyles();
-        if (!message) {
-            return null;
-        }
-        return (React.createElement(react_native_1.Text, { nativeID: nativeID, testID: (0, test_1.getTestID)(nativeID), style: [styles.errorMessage, style] }, message));
-    }
-}
-exports.ErrorMessage = ErrorMessage;

package/lib/components/FilePicker.d.ts

@@ -1,29 +0,0 @@
-import * as React from 'react';
-export interface FilePickerProperties {
-    label: string;
-    onPress: () => void;
-    icon: string;
-    nativeID?: string;
-}
-export declare class FilePicker extends React.Component<FilePickerProperties> {
-    static defaultProps: {
-        icon: string;
-    };
-    getStyles: () => {
-        container: {
-            borderRadius: number;
-            backgroundColor: string;
-            height: number;
-            alignItems: "center";
-            justifyContent: "center";
-        };
-        text: {
-            fontFamily: string;
-            fontSize: number;
-            color: string;
-            width: number;
-            textAlign: "center";
-        };
-    };
-    render(): JSX.Element;
-}

package/lib/components/FilePicker.js

@@ -1,46 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FilePicker = void 0;
-const React = require("react");
-const react_native_1 = require("react-native");
-const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
-const theme_1 = require("../modules/theme");
-const layout_1 = require("../modules/layout");
-const test_1 = require("../modules/test");
-class FilePicker extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.getStyles = () => {
-            const theme = (0, theme_1.getTheme)();
-            const styles = react_native_1.StyleSheet.create({
-                container: {
-                    borderRadius: 3,
-                    backgroundColor: theme.backgroundColor2,
-                    height: 100,
-                    alignItems: 'center',
-                    justifyContent: 'center'
-                },
-                text: {
-                    fontFamily: theme.fontFamily1,
-                    fontSize: (0, layout_1.isTablet)() ? 15 : 12,
-                    color: theme.textColor3,
-                    width: 200,
-                    textAlign: 'center'
-                }
-            });
-            return styles;
-        };
-    }
-    render() {
-        const { label, onPress, icon, nativeID } = this.props;
-        const theme = (0, theme_1.getTheme)();
-        const styles = this.getStyles();
-        return (React.createElement(react_native_1.TouchableOpacity, { activeOpacity: 0.5, style: styles.container, onPress: onPress },
-            React.createElement(FontAwesome_1.default, { name: icon, color: theme.textColor3, size: 30 }),
-            React.createElement(react_native_1.Text, { nativeID: nativeID, testID: (0, test_1.getTestID)(nativeID), style: styles.text }, label)));
-    }
-}
-exports.FilePicker = FilePicker;
-FilePicker.defaultProps = {
-    icon: 'cloud-upload'
-};

package/lib/components/Header.d.ts

@@ -1,58 +0,0 @@
-import * as React from 'react';
-import { StyleProp, TextStyle } from 'react-native';
-export interface HeaderButton {
-    icon: string;
-    disabled?: boolean;
-    counter?: number;
-    onPress: () => void;
-    nativeID?: string;
-    buttonStyle?: StyleProp<TextStyle>;
-}
-export interface HeaderProperties {
-    title: string;
-    leftButton?: HeaderButton;
-    rightButton?: HeaderButton;
-    nativeID?: string;
-}
-export declare class Header extends React.Component<HeaderProperties> {
-    static defaultProps: {
-        leftButtonType: string;
-    };
-    static height: number;
-    getStyles: () => {
-        header: {
-            backgroundColor: string;
-            height: number;
-            flexDirection: "row";
-            alignItems: "center";
-            justifyContent: "center";
-        };
-        title: {
-            color: string;
-            fontFamily: string;
-            fontSize: number;
-            marginHorizontal: number;
-            flexShrink: number;
-        };
-        button: {
-            padding: number;
-        };
-        counterContainer: {
-            position: "absolute";
-            backgroundColor: string;
-            height: number;
-            width: number;
-            top: number;
-            left: number;
-            borderRadius: number;
-        };
-        counterText: {
-            textAlign: "center";
-            color: string;
-            fontSize: number;
-        };
-    };
-    renderButton: (button: HeaderButton, type: 'left' | 'right') => JSX.Element;
-    renderButtonInvisible: (type: 'left' | 'right') => JSX.Element;
-    render(): JSX.Element;
-}

package/lib/components/Header.js

@@ -1,94 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Header = void 0;
-const React = require("react");
-const react_native_1 = require("react-native");
-const FontAwesome_1 = require("react-native-vector-icons/FontAwesome");
-const theme_1 = require("../modules/theme");
-const layout_1 = require("../modules/layout");
-const test_1 = require("../modules/test");
-class Header extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.getStyles = () => {
-            const theme = (0, theme_1.getTheme)();
-            const styles = react_native_1.StyleSheet.create({
-                header: {
-                    backgroundColor: theme.backgroundColor3,
-                    height: (0, layout_1.isTablet)() ? 65 : 50,
-                    flexDirection: 'row',
-                    alignItems: 'center',
-                    justifyContent: 'center'
-                },
-                title: {
-                    color: theme.textColor4,
-                    fontFamily: theme.fontFamily1,
-                    fontSize: (0, layout_1.isTablet)() ? 22 : 18,
-                    marginHorizontal: 10,
-                    flexShrink: 1
-                },
-                button: {
-                    padding: (0, layout_1.isTablet)() ? 14 : 10
-                },
-                counterContainer: {
-                    position: 'absolute',
-                    backgroundColor: theme.counterBackgroundColor,
-                    height: (0, layout_1.isTablet)() ? 20 : 15,
-                    width: (0, layout_1.isTablet)() ? 20 : 15,
-                    top: 5,
-                    left: 18,
-                    borderRadius: 50
-                },
-                counterText: {
-                    textAlign: 'center',
-                    color: theme.counterTextColor,
-                    fontSize: (0, layout_1.isTablet)() ? 15 : 10
-                }
-            });
-            return styles;
-        };
-        this.renderButton = (button, type) => {
-            const styles = this.getStyles();
-            const theme = (0, theme_1.getTheme)();
-            const icon = (React.createElement(React.Fragment, null,
-                React.createElement(FontAwesome_1.default, { nativeID: button.nativeID, testID: (0, test_1.getTestID)(button.nativeID), name: button.icon, size: (0, layout_1.isTablet)() ? 30 : 20, color: button.disabled ? theme.textColor1 : theme.textColor4, 
-                    // @ts-ignore : The component uses a different version of typing
-                    style: button.buttonStyle }),
-                button.counter ? (React.createElement(react_native_1.View, { style: styles.counterContainer },
-                    React.createElement(react_native_1.Text, { style: styles.counterText }, button.counter))) : null));
-            const style = [
-                styles.button,
-                type === 'left' ? { marginRight: 'auto' } : { marginLeft: 'auto' }
-            ];
-            if (button.disabled) {
-                return React.createElement(react_native_1.View, { style: style }, icon);
-            }
-            return (React.createElement(react_native_1.TouchableOpacity, { onPress: button.onPress, style: style }, icon));
-        };
-        this.renderButtonInvisible = (type) => {
-            const styles = this.getStyles();
-            const style = [
-                styles.button,
-                type === 'left' ? { marginRight: 'auto' } : { marginLeft: 'auto' }
-            ];
-            return React.createElement(react_native_1.View, { style: style });
-        };
-    }
-    render() {
-        const { title, leftButton, rightButton, nativeID } = this.props;
-        const styles = this.getStyles();
-        return (React.createElement(react_native_1.View, { style: styles.header },
-            leftButton
-                ? this.renderButton(leftButton, 'left')
-                : this.renderButtonInvisible('left'),
-            React.createElement(react_native_1.Text, { nativeID: nativeID, testID: (0, test_1.getTestID)(nativeID), style: styles.title }, title),
-            rightButton
-                ? this.renderButton(rightButton, 'right')
-                : this.renderButtonInvisible('right')));
-    }
-}
-exports.Header = Header;
-Header.defaultProps = {
-    leftButtonType: 'menu'
-};
-Header.height = (0, layout_1.isTablet)() ? 65 : 50;