@fto-consult/expo-ui 2.43.2 → 2.44.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "2.43.2",
+  "version": "2.44.0",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "index.js",
   "scripts": {
@@ -61,7 +61,7 @@
     "@emotion/native": "^11.10.0",
     "@expo/html-elements": "^0.2.0",
     "@expo/vector-icons": "^13.0.0",
-    "@fto-consult/common": "^2.4.4",
+    "@fto-consult/common": "^2.5.2",
     "@gorhom/portal": "^1.0.14",
     "@react-native-async-storage/async-storage": "~1.17.3",
     "@react-native-community/datetimepicker": "6.5.2",

package/src/components/ContentLoader/index.js

@@ -1,7 +1,7 @@
 /**** see : https://github.com/danilowoz/react-content-loader */
 import {defaultObj} from "$utils";
 import View from "$ecomponents/View";
-import {StyleSheet,Dimensions,useWindowDimensions} from "react-native";
+import {StyleSheet,Dimensions} from "react-native";
 import React from "react";
 import ContentLoaderF, {Facebook as CLFacebook,Instagram as CLInstagram} from './Loader';
 import PropTypes from "prop-types";

package/src/components/Datagrid/Common/Common.js

@@ -26,7 +26,6 @@ import { evalSingleValue,Footer,getFooterColumnValue,isValidAggregator,extendAgg
 import { makePhoneCall,canMakePhoneCall as canMakeCall} from "$makePhoneCall";
 import copyToClipboard from "$capp/clipboard";
 import { Pressable } from "react-native";
-import stableHash from "stable-hash";
 import DatagridProgressBar from "$ecomponents/Table/ProgressBar";
 import View from "$ecomponents/View";
 import {Menu} from "$ecomponents/BottomSheet";
@@ -3383,7 +3382,7 @@ export default class CommonDatagridComponent extends AppComponent {
         return false;
     }
     UNSAFE_componentWillReceiveProps(nextProps){
-        if((stableHash(nextProps.data) === stableHash(this.props.data))) {
+        if(React.areEquals(nextProps.data,(this.props.data))) {
             return false;
         }
         this.setIsLoading(true,true);

package/src/components/Expandable/index.js

@@ -1,8 +1,8 @@
 import {Colors} from "$theme";
 import React from 'react';
 import View from "$ecomponents/View";
-import {StyleSheet,TouchableWithoutFeedback,ScrollView} from 'react-native';
-import {withTheme,TouchableRipple} from "react-native-paper"
+import {StyleSheet,TouchableWithoutFeedback} from 'react-native';
+import ScrollView from "$ecomponents/ScrollView";
 import Label from "$ecomponents/Label";
 import Icon from "$ecomponents/Icon"
 import {defaultObj,isNonNullString,defaultStr} from "$utils";

package/src/components/ScrollView/index.js

@@ -4,20 +4,26 @@ import PropTypes from "prop-types";
 import View from "$ecomponents/View";
 import theme from "$theme";
 import {defaultStr,defaultObj} from "$utils";
+import stableHash from "stable-hash";
 import APP from "$capp/instance";
-const ScrollViewComponent = React.forwardRef(({virtualized,contentProps,containerProps,mediaQueryUpdateNativeProps,testID:customTestID,children,screenIndent:sIndent,...rest},ref) => {
+const ScrollViewComponent = React.forwardRef(({virtualized,contentProps,containerProps,mediaQueryUpdateNativeProps,testID:customTestID,children:cChildren,screenIndent:sIndent,...rest},ref) => {
   const isKeyboardOpenRef = React.useRef(false);
   const testID = defaultStr(customTestID,'RN_ScrollViewComponent');
   containerProps = defaultObj(containerProps)
   const [layout,setLayout] = React.useState(Dimensions.get("window"));
   const {height} = layout;
+  const [children,setChildren] = React.useState(cChildren);
+  const hash = stableHash(cChildren);
+  React.useEffect(()=>{
+    setChildren(children);
+  },[hash]);
   React.useEffect(()=>{
     const onKeyboardToggle = ({visible})=>{
       isKeyboardOpenRef.current = visible;
      };
     const onResizePage = ()=>{
       setTimeout(()=>{
-         //if(isKeyboardOpenRef.current) return;
+         if(isKeyboardOpenRef.current) return;
          setLayout(Dimensions.get("window"))
       },300);
     }

package/src/components/SimpleSelect/index.js

@@ -14,7 +14,6 @@ import Icon from "$ecomponents/Icon";
 import {isDesktopMedia} from "$cplatform/dimensions";
 import { matchOperators,getSearchTimeout,canAutoFocusSearchField} from "$ecomponents/Dropdown/utils";
 import Dialog from "$ecomponents/Dialog";
-import stableHash from "stable-hash";
 
 const  SimpleSelect = React.forwardRef((props,ref)=>{
     let {style : customStyle,onMount,mode,showSearch,anchorContainerProps,renderText,contentContainerProps,withCheckedIcon,testID,selectionColor,dialogProps,onShow,anchor,onUnmont,controlled,onDismiss,visible:controlledVisible,selectedColor,inputProps,itemProps,itemContainerProps,label,listProps,editable,readOnly,text,filter,renderItem,itemValue,getItemValue,defaultValue,items:menuItems,onPress,onChange,disabled,...rest} = props;
@@ -53,8 +52,7 @@ const  SimpleSelect = React.forwardRef((props,ref)=>{
     renderText = typeof renderText ==='function'? renderText : ({item,content,index})=>{
         return React.getTextContent(content);
     }
-    const menuItemsHash = stableHash(menuItems);
-    const items = React.useMemo(()=>{
+    const items = React.useStableMemo(()=>{
         const items = [];
         selectedRef.current = null;
         //let currentSelectedValue = value;
@@ -92,7 +90,7 @@ const  SimpleSelect = React.forwardRef((props,ref)=>{
         });
         return items;
         //return ({...state,value:currentSelectedValue,items});
-    },[menuItemsHash])
+    },[menuItems])
     React.useEffect(()=>{
         if(compare(defaultValue == value)) return;
         selectValue(defaultValue);

package/src/components/Table/index.js

@@ -1,11 +1,10 @@
-import {FlashList,BigList,FlatList} from "$ecomponents/List";
 import View from "$ecomponents/View";
 import {defaultObj,defaultStr,debounce,defaultNumber,defaultVal} from "$utils";
 import PropTypes from "prop-types";
 export const DEFAULT_COLUMN_WIDTH = 60;
 import React from "$react";
 import Label from "$ecomponents/Label";
-import { StyleSheet,View as RNView,ScrollView,NativeModules,Dimensions} from "react-native";
+import { StyleSheet,View as RNView,ScrollView,Dimensions} from "react-native";
 import { getRowStyle } from "$ecomponents/Datagrid/utils";
 import {isMobileNative} from "$cplatform";
 import theme from "$theme";
@@ -13,7 +12,6 @@ import AbsoluteScrollView from "./AbsoluteScrollView";
 import Cell from "./Cell";
 import Row from "./Row";
 import List from "./List";
-import ProgressBar from "./ProgressBar";
 const isSCrollingRef = React.createRef();
 const scrollLists = (opts,refs)=>{
     refs.map((ref)=>{
@@ -60,7 +58,7 @@ const TableComponent = React.forwardRef(({containerProps,sortedColumn,listContai
     const hasEmptyData = emptyData && React.isValidElement(emptyData);
     const layoutRef = React.useRef({});
     React.useOnRender(onRender);
-    const preparedColumns = React.useMemo(()=>{
+    const preparedColumns = React.useStableMemo(()=>{
         const cols = {},headers = {},footers = {},filters = {},vColumnsMapping = [],visibleColumns = [],columnsNames = [];
         let hasFooters = false;
         columnProps = defaultObj(columnProps);

package/src/layouts/Screen/ScreenWithOrWithoutAuthContainer.js

@@ -12,8 +12,7 @@ import ErrorBoundary from "$ecomponents/ErrorBoundary";
 import Portal from "$ecomponents/Portal";
 import theme,{StyleProp} from "$theme";
 import StatusBar from "$ecomponents/StatusBar";
-import { ScrollView } from 'react-native';
-
+import ScrollView from "$ecomponents/ScrollView";
 const getDefaultTitle = (nTitle,returnStr)=>{
   let titleStr = React.getTextContent(nTitle);
   if(!titleStr){

package/src/layouts/Screen/TableData.js

@@ -1,5 +1,4 @@
 import {defaultStr,isNumber,isPromise,defaultVal,extendObj,defaultObj,uniqid,isObj,isObjOrArray} from "$utils";
-import stableHash from "stable-hash";
 import {FormData} from "$ecomponents/Form";
 import FormDataScreen from "./FormData";
 import ScreenContainer from "./Screen";
@@ -418,7 +417,7 @@ export default class TableDataScreenComponent extends FormDataScreen{
                 mainContent = ct;
             } else {
                 mainContent = <View  {...contentProps} testID={testID+"_ContentContainer"} style={[styles.container,styles.noPadding]}>
-                    <ScrollView virtualized testID={testID+"_MainContentScrollView"} contentProps={{style:theme.styles.p1}}>
+                    <ScrollView testID={testID+"_MainContentScrollView"} contentProps={{style:theme.styles.p1}}>
                         <Surface elevation={elevation} testID={testID+"_ContentHeader"} style={[styles.screenContent,theme.styles.p1,header?styles.screenContentWithHeader:null]}>
                             {header}
                             {content}
@@ -431,7 +430,7 @@ export default class TableDataScreenComponent extends FormDataScreen{
             }
         } else {
             mainContent = <Surface  {...contentProps} testID={testID+"_MainContentContainer"} elevation={elevation} style={[styles.container,styles.noPadding,{paddingTop:0,marginTop:0}]}>
-                <ScrollView virtualized testID={testID+"_MainContentScrollViewWithoutTab"}>
+                <ScrollView testID={testID+"_MainContentScrollViewWithoutTab"}>
                     <View testID={testID+"_MainContent"} style={[styles.screenContent,!isMobOrTab && theme.styles.p1,header?styles.screenContentWithHeader:null]}>
                         {header}
                         {content}
@@ -567,7 +566,7 @@ export default class TableDataScreenComponent extends FormDataScreen{
     }
     UNSAFE_componentWillReceiveProps(nextProps){
         const {data,datas}= nextProps;
-        if(stableHash({data,datas}) != stableHash({data:this.state.data,datas:this.state.datas})){
+        if(!React.areEquals({data,datas},{data:this.state.data,datas:this.state.datas})){
             this.setState(this.prepareStateData(nextProps));
         }
         return;