secullum-react-native-ui 4.15.2-beta.1 → 4.15.2-beta.11

package/lib/components/Header.d.ts

@@ -32,6 +32,7 @@ export declare class Header extends React.Component<HeaderProperties> {
             fontFamily: string;
             fontSize: number;
             marginHorizontal: number;
+            flexShrink: number;
         };
         button: {
             padding: number;

package/lib/components/Header.js

@@ -24,7 +24,8 @@ class Header extends React.Component {
                     color: theme.textColor4,
                     fontFamily: theme.fontFamily1,
                     fontSize: (0, layout_1.isTablet)() ? 22 : 18,
-                    marginHorizontal: 35
+                    marginHorizontal: 10,
+                    flexShrink: 1
                 },
                 button: {
                     padding: (0, layout_1.isTablet)() ? 14 : 10

package/lib/components/KeyboardAvoidingView.js

@@ -70,15 +70,26 @@ class KeyboardAvoidingView extends React.Component {
         this.keyboardDidHideSubscription.remove();
     }
     render() {
-        const { refreshControl, scrollEnabled, onScroll, children, keyBoardShow } = this.props;
+        const { refreshControl, scrollEnabled, onScroll, children, keyBoardShow, extraWindowHeight } = this.props;
+        const { keyboardHeight } = this.state;
         // 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;
+        const availableHeight = react_native_1.Dimensions.get('window').height - keyboardHeight - extraWindowHeight;
         return (React.createElement(react_native_1.View, { style: [{ height: availableHeight }, !keyBoardShow && { flex: 1 }] },
-            React.createElement(react_native_1.ScrollView, { ref: this.scrollViewRef, 
+            React.createElement(react_native_1.ScrollView
+            // On Android 15 (API 35) devices, when the keyboard appears,
+            // the ScrollView does not resize correctly and may hide focused input fields.
+            // Related issue on GitLab: 11635
+            , { 
+                // On Android 15 (API 35) devices, when the keyboard appears,
+                // the ScrollView does not resize correctly and may hide focused input fields.
+                // Related issue on GitLab: 11635
+                contentContainerStyle: react_native_1.Platform.OS === 'android' &&
+                    react_native_1.Platform.Version === 35 &&
+                    keyboardHeight > 0
+                    ? { paddingBottom: keyboardHeight }
+                    : undefined, ref: this.scrollViewRef, 
                 // @ts-ignore: O react-native não tem auto, mas o react-native-web aceita
                 refreshControl: refreshControl, scrollEnabled: scrollEnabled, onScroll: (e) => {
                     if (onScroll) {

package/lib/components/MenuMobile.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { NativeEventSubscription } from 'react-native';
 import DrawerLayout from 'react-native-drawer-layout';
 import { MenuProperties } from './Menu';
 export declare type MenuMobileProperties = MenuProperties & {
@@ -12,6 +13,7 @@ export interface MenuMobileState {
 }
 export declare class MenuMobile extends React.Component<MenuMobileProperties, MenuMobileState> {
     state: MenuMobileState;
+    backButtonHandlerSubscription: NativeEventSubscription | null;
     drawer: DrawerLayout | null;
     componentDidMount(): void;
     componentWillUnmount(): void;

package/lib/components/MenuMobile.js

@@ -13,6 +13,7 @@ class MenuMobile extends React.Component {
         this.state = {
             opened: false
         };
+        this.backButtonHandlerSubscription = null;
         this.drawer = null;
         this.handleBackButton = () => {
             if (this.state.opened) {
@@ -73,14 +74,21 @@ class MenuMobile extends React.Component {
         };
     }
     componentDidMount() {
-        react_native_1.BackHandler.addEventListener('hardwareBackPress', this.handleBackButton);
+        this.backButtonHandlerSubscription = react_native_1.BackHandler.addEventListener('hardwareBackPress', this.handleBackButton);
     }
     componentWillUnmount() {
-        react_native_1.BackHandler.removeEventListener('hardwareBackPress', this.handleBackButton);
+        if (this.backButtonHandlerSubscription) {
+            this.backButtonHandlerSubscription.remove();
+        }
     }
     render() {
         const theme = (0, 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: (0, 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));
+        return (React.createElement(react_native_drawer_layout_1.default, { ref: drawer => (this.drawer = drawer), drawerLockMode: this.props.drawerLockMode, drawerBackgroundColor: theme.backgroundColor1, drawerWidth: (0, layout_1.isTablet)() ? 450 : 300, drawerPosition: react_native_drawer_layout_1.default.positions.Left, renderNavigationView: this.renderNavigationView, onDrawerOpen: () => this.setState({ opened: true }), 
+            // When closing the app, we encountered the error 'useInsertionEffect must not schedule updates',
+            // because we were trying to update the state during the component render cycle. To avoid this,
+            // a setTimeout was introduced with a small delay (enough time to complete the render) before executing other functions.
+            // Related issue on GitLab: 11635
+            onDrawerClose: () => setTimeout(() => this.setState({ opened: false }), 1) }, this.props.children));
     }
 }
 exports.MenuMobile = MenuMobile;

package/lib/components/Modal.d.ts

@@ -6,6 +6,13 @@ export interface ModalProperties {
     overlayStyle?: StyleProp<ViewStyle>;
     onRequestClose?: () => void;
 }
+interface ModalState {
+    isMounted: boolean;
+}
 export declare class Modal extends React.Component<ModalProperties> {
+    state: ModalState;
+    componentDidUpdate(prevProps: ModalProperties): void;
+    handleShow: () => void;
     render(): JSX.Element;
 }
+export {};

package/lib/components/Modal.js

@@ -4,11 +4,26 @@ exports.Modal = void 0;
 const React = require("react");
 const react_native_1 = require("react-native");
 class Modal extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.state = {
+            isMounted: false
+        };
+        this.handleShow = () => {
+            this.setState({ isMounted: true });
+        };
+    }
+    componentDidUpdate(prevProps) {
+        if (prevProps.visible && !this.props.visible) {
+            this.setState({ isMounted: false });
+        }
+    }
     render() {
         const { children, visible, overlayStyle, onRequestClose } = this.props;
-        return (React.createElement(react_native_1.Modal, { animationType: "fade", transparent: true, visible: visible, supportedOrientations: ['landscape', 'portrait'], onRequestClose: onRequestClose },
+        const { isMounted } = this.state;
+        return (React.createElement(react_native_1.Modal, { animationType: "fade", transparent: true, visible: visible, supportedOrientations: ['landscape', 'portrait'], onRequestClose: onRequestClose, onShow: this.handleShow },
             React.createElement(react_native_1.TouchableWithoutFeedback, { onPress: onRequestClose },
-                React.createElement(react_native_1.View, { style: [styles.overlay, overlayStyle] }, children))));
+                React.createElement(react_native_1.View, { style: [styles.overlay, overlayStyle] }, isMounted ? children : React.createElement(react_native_1.View, null)))));
     }
 }
 exports.Modal = Modal;

package/lib/components/RangeDatePicker.js

@@ -111,9 +111,9 @@ class RangeDatePicker extends React.Component {
         const styles = this.getStyles();
         return (React.createElement(react_native_1.TouchableWithoutFeedback, { onPress: this.handleDatePickerPress },
             React.createElement(react_native_1.View, { nativeID: nativeID, testID: (0, test_1.getTestID)(nativeID), style: [styles.container, style] },
-                React.createElement(react_native_1.View, null,
+                React.createElement(react_native_1.View, { style: { flex: 1 } },
                     React.createElement(react_native_1.Text, { style: styles.label }, label),
-                    React.createElement(react_native_1.Text, { style: styles.value }, displayText)),
+                    React.createElement(react_native_1.Text, { numberOfLines: 1, style: styles.value }, displayText)),
                 React.createElement(FontAwesome_1.default, { name: "calendar", style: styles.icon }),
                 react_native_1.Platform.OS !== 'web' &&
                     (showStartDateModal ? (React.createElement(react_native_modal_datetime_picker_1.default, { date: startDate, isVisible: true, onConfirm: this.handleStartDateConfirm, onCancel: this.handleStartDateCancel, isDarkModeEnabled: isDarkModeEnabled, 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "secullum-react-native-ui",
-  "version": "4.15.2-beta.1",
+  "version": "4.15.2-beta.11",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
   "files": [