@fto-consult/expo-ui 2.10.5 → 2.11.1

package/src/components/Countries/resources/countries.sql

@@ -0,0 +1,244 @@
+INSERT INTO countries(code,name,dialCode) 
+	VALUES 
+		('AF','Afghanistan (‫افغانستان‬‎)','93'),
+		('AL','Albania (Shqipëri)','355'),
+		('DZ','Algeria (‫الجزائر‬‎)','213'),
+		('AS','American Samoa','1684'),
+		('AD','Andorra','376'),
+		('AO','Angola','244'),
+		('AI','Anguilla','1264'),
+		('AG','Antigua and Barbuda','1268'),
+		('AR','Argentina','54'),
+		('AM','Armenia (Հայաստան)','374'),
+		('AW','Aruba','297'),
+		('AU','Australia','61'),
+		('AT','Austria (Österreich)','43'),
+		('AZ','Azerbaijan (Azərbaycan)','994'),
+		('BS','Bahamas','1242'),
+		('BH','Bahrain (‫البحرين‬‎)','973'),
+		('BD','Bangladesh (বাংলাদেশ)','880'),
+		('BB','Barbados','1246'),
+		('BY','Belarus (Беларусь)','375'),
+		('BE','Belgium (België)','32'),
+		('BZ','Belize','501'),
+		('BJ','Benin (Bénin)','229'),
+		('BM','Bermuda','1441'),
+		('BT','Bhutan (འབྲུག)','975'),
+		('BO','Bolivia','591'),
+		('BA','Bosnia and Herzegovina (Босна и Херцеговина)','387'),
+		('BW','Botswana','267'),
+		('BR','Brazil (Brasil)','55'),
+		('IO','British Indian Ocean Territory','246'),
+		('VG','British Virgin Islands','1284'),
+		('BN','Brunei','673'),
+		('BG','Bulgaria (България)','359'),
+		('BF','Burkina Faso','226'),
+		('BI','Burundi (Uburundi)','257'),
+		('KH','Cambodia (កម្ពុជា)','855'),
+		('CM','Cameroon (Cameroun)','237'),
+		('CA','Canada','1'),
+		('CV','Cape Verde (Kabu Verdi)','238'),
+		('BQ','Caribbean Netherlands','599'),
+		('KY','Cayman Islands','1345'),
+		('CF','Central African Republic (République centrafricaine)','236'),
+		('TD','Chad (Tchad)','235'),
+		('CL','Chile','56'),
+		('CN','China (中国)','86'),
+		('CX','Christmas Island','61'),
+		('CC','Cocos (Keeling) Islands','61'),
+		('CO','Colombia','57'),
+		('KM','Comoros (‫جزر القمر‬‎)','269'),
+		('CD','Congo (DRC) (Jamhuri ya Kidemokrasia ya Kongo)','243'),
+		('CG','Congo (Republic) (Congo-Brazzaville)','242'),
+		('CK','Cook Islands','682'),
+		('CR','Costa Rica','506'),
+		('CI','Côte d’Ivoire','225'),
+		('HR','Croatia (Hrvatska)','385'),
+		('CU','Cuba','53'),
+		('CW','Curaçao','599'),
+		('CY','Cyprus (Κύπρος)','357'),
+		('CZ','Czech Republic (Česká republika)','420'),
+		('DK','Denmark (Danmark)','45'),
+		('DJ','Djibouti','253'),
+		('DM','Dominica','1767'),
+		('DO','Dominican Republic (República Dominicana)','1'),
+		('EC','Ecuador','593'),
+		('EG','Egypt (‫مصر‬‎)','20'),
+		('SV','El Salvador','503'),
+		('GQ','Equatorial Guinea (Guinea Ecuatorial)','240'),
+		('ER','Eritrea','291'),
+		('EE','Estonia (Eesti)','372'),
+		('ET','Ethiopia','251'),
+		('FK','Falkland Islands (Islas Malvinas)','500'),
+		('FO','Faroe Islands (Føroyar)','298'),
+		('FJ','Fiji','679'),
+		('FI','Finland (Suomi)','358'),
+		('FR','France','33'),
+		('GF','French Guiana (Guyane française)','594'),
+		('PF','French Polynesia (Polynésie française)','689'),
+		('GA','Gabon','241'),
+		('GM','Gambia','220'),
+		('GE','Georgia (საქართველო)','995'),
+		('DE','Germany (Deutschland)','49'),
+		('GH','Ghana (Gaana)','233'),
+		('GI','Gibraltar','350'),
+		('GR','Greece (Ελλάδα)','30'),
+		('GL','Greenland (Kalaallit Nunaat)','299'),
+		('GD','Grenada','1473'),
+		('GP','Guadeloupe','590'),
+		('GU','Guam','1671'),
+		('GT','Guatemala','502'),
+		('GG','Guernsey','44'),
+		('GN','Guinea (Guinée)','224'),
+		('GW','Guinea-Bissau (Guiné Bissau)','245'),
+		('GY','Guyana','592'),
+		('HT','Haiti','509'),
+		('HN','Honduras','504'),
+		('HK','Hong Kong (香港)','852'),
+		('HU','Hungary (Magyarország)','36'),
+		('IS','Iceland (Ísland)','354'),
+		('IN','India (भारत)','91'),
+		('ID','Indonesia','62'),
+		('IR','Iran (‫ایران‬‎)','98'),
+		('IQ','Iraq (‫العراق‬‎)','964'),
+		('IE','Ireland','353'),
+		('IM','Isle of Man','44'),
+		('IL','Israel (‫ישראל‬‎)','972'),
+		('IT','Italy (Italia)','39'),
+		('JM','Jamaica','1876'),
+		('JP','Japan (日本)','81'),
+		('JE','Jersey','44'),
+		('JO','Jordan (‫الأردن‬‎)','962'),
+		('KZ','Kazakhstan (Казахстан)','77'),
+		('KE','Kenya','254'),
+		('KI','Kiribati','686'),
+		('KW','Kuwait (‫الكويت‬‎)','965'),
+		('KG','Kyrgyzstan (Кыргызстан)','996'),
+		('LA','Laos (ລາວ)','856'),
+		('LV','Latvia (Latvija)','371'),
+		('LB','Lebanon (‫لبنان‬‎)','961'),
+		('LS','Lesotho','266'),
+		('LR','Liberia','231'),
+		('LY','Libya (‫ليبيا‬‎)','218'),
+		('LI','Liechtenstein','423'),
+		('LT','Lithuania (Lietuva)','370'),
+		('LU','Luxembourg','352'),
+		('MO','Macau (澳門)','853'),
+		('MK','Macedonia (FYROM) (Македонија)','389'),
+		('MG','Madagascar (Madagasikara)','261'),
+		('MW','Malawi','265'),
+		('MY','Malaysia','60'),
+		('MV','Maldives','960'),
+		('ML','Mali','223'),
+		('MT','Malta','356'),
+		('MH','Marshall Islands','692'),
+		('MQ','Martinique','596'),
+		('MR','Mauritania (‫موريتانيا‬‎)','222'),
+		('MU','Mauritius (Moris)','230'),
+		('YT','Mayotte','262'),
+		('MX','Mexico (México)','52'),
+		('FM','Micronesia','691'),
+		('MD','Moldova (Republica Moldova)','373'),
+		('MC','Monaco','377'),
+		('MN','Mongolia (Монгол)','976'),
+		('ME','Montenegro (Crna Gora)','382'),
+		('MS','Montserrat','1664'),
+		('MA','Morocco (‫المغرب‬‎)','212'),
+		('MZ','Mozambique (Moçambique)','258'),
+		('MM','Myanmar (Burma)','95'),
+		('NA','Namibia (Namibië)','264'),
+		('NR','Nauru','674'),
+		('NP','Nepal (नेपाल)','977'),
+		('NL','Netherlands (Nederland)','31'),
+		('NC','New Caledonia (Nouvelle-Calédonie)','687'),
+		('NZ','New Zealand','64'),
+		('NI','Nicaragua','505'),
+		('NE','Niger (Nijar)','227'),
+		('NG','Nigeria','234'),
+		('NU','Niue','683'),
+		('NF','Norfolk Island','672'),
+		('KP','North Korea (조선 민주주의 인민 공화국)','850'),
+		('MP','Northern Mariana Islands','1670'),
+		('NO','Norway (Norge)','47'),
+		('OM','Oman (‫عُمان‬‎)','968'),
+		('PK','Pakistan (‫پاکستان‬‎)','92'),
+		('PW','Palau','680'),
+		('PS','Palestine (‫فلسطين‬‎)','970'),
+		('PA','Panama (Panamá)','507'),
+		('PG','Papua New Guinea','675'),
+		('PY','Paraguay','595'),
+		('PE','Peru (Perú)','51'),
+		('PH','Philippines','63'),
+		('PL','Poland (Polska)','48'),
+		('PT','Portugal','351'),
+		('PR','Puerto Rico','1'),
+		('QA','Qatar (‫قطر‬‎)','974'),
+		('RE','Réunion (La Réunion)','262'),
+		('RO','Romania (România)','40'),
+		('RU','Russia (Россия)','7'),
+		('RW','Rwanda','250'),
+		('BL','Saint Barthélemy (Saint-Barthélemy)','590'),
+		('SH','Saint Helena','290'),
+		('KN','Saint Kitts and Nevis','1869'),
+		('LC','Saint Lucia','1758'),
+		('MF','Saint Martin (Saint-Martin (partie française))','590'),
+		('PM','Saint Pierre and Miquelon (Saint-Pierre-et-Miquelon)','508'),
+		('VC','Saint Vincent and the Grenadines','1784'),
+		('WS','Samoa','685'),
+		('SM','San Marino','378'),
+		('ST','São Tomé and Príncipe (São Tomé e Príncipe)','239'),
+		('SA','Saudi Arabia (‫المملكة العربية السعودية‬‎)','966'),
+		('SN','Senegal (Sénégal)','221'),
+		('RS','Serbia (Србија)','381'),
+		('SC','Seychelles','248'),
+		('SL','Sierra Leone','232'),
+		('SG','Singapore','65'),
+		('SX','Sint Maarten','1721'),
+		('SK','Slovakia (Slovensko)','421'),
+		('SI','Slovenia (Slovenija)','386'),
+		('SB','Solomon Islands','677'),
+		('SO','Somalia (Soomaaliya)','252'),
+		('ZA','South Africa','27'),
+		('KR','South Korea (대한민국)','82'),
+		('SS','South Sudan (‫جنوب السودان‬‎)','211'),
+		('ES','Spain (España)','34'),
+		('LK','Sri Lanka (ශ්‍රී ලංකාව)','94'),
+		('SD','Sudan (‫السودان‬‎)','249'),
+		('SR','Suriname','597'),
+		('SJ','Svalbard and Jan Mayen','47'),
+		('SZ','Swaziland','268'),
+		('SE','Sweden (Sverige)','46'),
+		('CH','Switzerland (Schweiz)','41'),
+		('SY','Syria (‫سوريا‬‎)','963'),
+		('TW','Taiwan (台灣)','886'),
+		('TJ','Tajikistan','992'),
+		('TZ','Tanzania','255'),
+		('TH','Thailand (ไทย)','66'),
+		('TL','Timor-Leste','670'),
+		('TG','Togo','228'),
+		('TK','Tokelau','690'),
+		('TO','Tonga','676'),
+		('TT','Trinidad and Tobago','1868'),
+		('TN','Tunisia (‫تونس‬‎)','216'),
+		('TR','Turkey (Türkiye)','90'),
+		('TM','Turkmenistan','993'),
+		('TC','Turks and Caicos Islands','1649'),
+		('TV','Tuvalu','688'),
+		('VI','U.S. Virgin Islands','1340'),
+		('UG','Uganda','256'),
+		('UA','Ukraine (Україна)','380'),
+		('AE','United Arab Emirates (‫الإمارات العربية المتحدة‬‎)','971'),
+		('GB','United Kingdom','44'),
+		('US','United States','1'),
+		('UY','Uruguay','598'),
+		('UZ','Uzbekistan (Oʻzbekiston)','998'),
+		('VU','Vanuatu','678'),
+		('VA','Vatican City (Città del Vaticano)','39'),
+		('VE','Venezuela','58'),
+		('VN','Vietnam (Việt Nam)','84'),
+		('WF','Wallis and Futuna','681'),
+		('EH','Western Sahara (‫الصحراء الغربية‬‎)','212'),
+		('YE','Yemen (‫اليمن‬‎)','967'),
+		('ZM','Zambia','260'),
+		('ZW','Zimbabwe','263'),
+		('AX','Åland Islands','358')

package/src/components/Countries/utils.js

@@ -1,28 +1,51 @@
 import allCountries from "./resources/countries.json";
 import {get as getFlag} from "./resources/flags";
 import {orderBy} from 'lodash';
+import { StyleSheet } from "react-native";
+
+export const COUNTRIES = {};
 
 export const getAll = (options)=>{
     return orderBy(
         allCountries, // eslint-disable-line global-require
         ['name'],
         ['asc'],
-    ).map((country, index) => ({
-        key: index,
-        image: getFlag(country.iso2),
-        label: country.name,
-        dialCode: `+${country.dialCode}`,
-        iso2: country.iso2,
-        code : country.iso2,
-        isoCode : country.iso2,
-    }));
+    ).map((country, index) => {
+        const c = {
+            key: index,
+            image: getFlag(country.iso2),
+            label: country.name,
+            dialCode: `+${country.dialCode}`,
+            iso2: country.iso2,
+            code : country.iso2,
+            isoCode : country.iso2,
+        };
+        COUNTRIES[country.iso2.toUpperCase().trim()] = c;
+        return c;
+    });
 }
 
 export const countries = getAll();
 
+
 export {getFlag};
 
 export const getCountry = (code)=>{
     if(!code || typeof code !=='string') return null;
-    return countries.find((c) => c.code === code)
-}
+    code = code.toUpperCase().trim();
+    return COUNTRIES[code] || null;
+}
+
+export const styles = StyleSheet.create({
+    renderedImage : {
+        flexDirection : "row",
+        alignItems : 'center',
+        justifyContent : 'flex-start',
+        flex : 1,
+    },
+    flagImage : {
+        borderWidth:0,
+        width : 30,
+        height : 20,
+    },
+})

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

@@ -33,6 +33,8 @@ import TableLink from "$TableLink";
 import appConfig from "$capp/config";
 import stableHash from "stable-hash";
 import DatagridProgressBar from "./ProgressBar";
+import {Flag} from "$ecomponents/Countries"
+import View from "$ecomponents/View";
 
 export const arrayValueSeparator = ", ";
 
@@ -954,6 +956,8 @@ export default class CommonDatagridComponent extends AppComponent {
                 width = Math.max(width,DATE_COLUMN_WIDTH-30);
             } else if(type == "tel"){
                 width = Math.max(width,DATE_COLUMN_WIDTH)
+            } else if(type =="select_country" || type =='selectcountry'){
+                width = Math.max(width,90);
             }
             totalWidths +=width;
             widths[header.field] = width;
@@ -1505,7 +1509,12 @@ export default class CommonDatagridComponent extends AppComponent {
         return false;
     }
     UNSAFE_componentWillReceiveProps(nextProps){
-        if(!isObjOrArray(nextProps.data) || nextProps.data == this.props.data || stableHash(nextProps.data) == stableHash(this.props.data)) return;
+        if(!isObjOrArray(nextProps.data) || nextProps.data == this.props.data || stableHash(nextProps.data) == stableHash(this.props.data)) {
+            if(nextProps.isLoading !== this.props.isLoading && typeof nextProps.isLoading =='boolean'){
+                this.setIsLoading(nextProps.isLoading)
+            }
+            return;
+        }
         this.prepareData({...nextProps,force:true},(state)=>{
             this.setState(state)
         });
@@ -1650,6 +1659,9 @@ export default class CommonDatagridComponent extends AppComponent {
                      _render = checkedLabel;
                  } else _render = uncheckedLabel;
              }
+             else if(_type =='select_country' || _type =='selectcountry'){
+                _render = <Flag withCode {...columnDef} length={undefined} width={undefined} height={undefined} code={defaultValue}/>
+             }
              ///le lien vers le table data se fait via une colonne de type selecttabledata ou select_tabledata ou potant l'une des propriétés foreignKeyTable ou linkToTable de type chaine de caractère non nulle
              else if(arrayValueExists(['piece','selecttabledata','id'],_type) || isNonNullString(columnDef.linkToTable) || isNonNullString(columnDef.foreignKeyTable)){
                 let tableName = defaultStr(columnDef.linkToTable && columnDef.linkToTable,columnDef.foreignKeyTable && columnDef.foreignKeyTable,columnDef.tableName,columnDef.table).toUpperCase();

package/src/components/Filter/index.js

@@ -66,7 +66,8 @@ export default class Filter extends AppComponent {
       },
       previousRef : {
         value : {current : null}
-      }
+      },
+      manualRunRef : {value : {current : 0}},
     })
     extendObj(this.state,{
         ...this.initFiltersOp(),
@@ -84,7 +85,11 @@ export default class Filter extends AppComponent {
         };
      })
   }
+  setSessionManualRunValue(value){
+      this.manualRunRef.current = value;
+  }
   getSessionManualRunValue(){
+    return this.manualRunRef.current;
     return getSessionData(manualRunKey) ? true : false
   }
   willRunManually (){
@@ -92,7 +97,7 @@ export default class Filter extends AppComponent {
   }
   toggleManualRun(){
     this.setState({manualRun:!this.state.manualRun},()=>{
-       setSessionData(manualRunKey,this.state.manualRun?0:1);
+       this.setSessionManualRunValue(this.state.manualRun?0:1);
        if(!this.willRunManually()){
          this.fireValueChanged(true);
        }

package/src/components/Form/FormData/componentsTypes.js

@@ -76,6 +76,9 @@ export const getFilterComponentProps = (_props)=>{
         props.inputProps.placeholder = defaultStr(props.inputProps.placeholder,i18n.lang("search.."))
         props.label = label;
         component = Fields.SelectField;
+        if(type =='select_country' || type =='selectcountry'){
+            component = Fields.SelectCountry;
+        }
         /*if(type !== 'select'){
             if(type === 'selectstructdata') {
                 dbName = 'structData';

package/src/components/Image/index.js

@@ -1,8 +1,7 @@
 import {Image,View} from "react-native";
 import Menu from "$ecomponents/Menu";
 import Avatar from "$ecomponents/Avatar";
-import {TouchableOpacity,Pressable} from "react-native";
-import {isDecimal,setQueryParams,isValidURL,defaultStr as defaultString,isDataURL,isPromise,defaultBool,isObj,isNonNullString} from "$utils";
+import {isDecimal,setQueryParams,isValidURL,defaultDecimal,defaultStr as defaultString,isDataURL,isPromise,defaultBool,isObj,isNonNullString} from "$utils";
 import {notify} from "$ecomponents/Dialog";
 let maxWidthDiff = 150, maxHeightDiff = 150;
 import {StyleSheet} from "react-native";
@@ -58,7 +57,7 @@ export default function ImageComponent(props){
     let {disabled,onMount,defaultSource,onUnmount,label,text,labelProps,readOnly,beforeRemove,
         onChange,draw,round,drawText,drawLabel,rounded,editable,defaultSrc,
         createSignatureOnly,pickImageProps,width,height,cropProps,size,resizeProps,containerProps,
-        menuProps,pickUri,drawProps,imageProps,testID,...rest} = props;
+        menuProps,pickUri,drawProps,imageProps,length,testID,...rest} = props;
     rest = defaultObj(rest);
     pickImageProps = defaultObj(pickImageProps);
     cropProps = defaultObj(cropProps);
@@ -71,7 +70,7 @@ export default function ImageComponent(props){
     round = defaultBool(round,rounded,true);
     containerProps = defaultObj(containerProps);
     drawProps = defaultObj(drawProps);
-    let content = null;
+    const flattenStyle = StyleSheet.flatten(props.style) || {};
     defaultSrc = defaultVal(defaultSrc);
     editable = defaultBool(editable,true);
     if(disabled){
@@ -82,16 +81,25 @@ export default function ImageComponent(props){
         setSrc(props.src);
     },[props.src])
     
+    if(!isDecimal(width) && isDecimal(flattenStyle.width)){
+        width = flattenStyle.width;
+    }
+    if(!isDecimal(height) && isDecimal(flattenStyle.height)){
+        height = flattenStyle.height;
+    }
     if(isDecimal(width) && width > 0){
         rest.width = width;
     } 
+    
     if(isDecimal(height) && height > 0){
         rest.height = height;
     } 
+    
     if(isDecimal(size) && size > 10){
         rest.size = Math.trunc(size);
     } else {
-        rest.size = 50;
+        const sZize = Math.min(defaultDecimal(width),defaultDecimal(height));
+        rest.size = sZize >= 10 ? sZize : 50;
     }
 
     let imageWidth, imageHeight;
@@ -251,7 +259,7 @@ export default function ImageComponent(props){
                 {...menuProps}
                 disabled = {isDisabled}
                 anchor = {(props)=>{
-                    return <View pointerEvents={pointerEvents} accessibilityLabel = {_label} testID={testID+"_Container"} {...containerProps} pointerEvents={disabled|| readOnly? "none":"auto"} style={[label?styles.align:null,containerProps.style,label?styles.container:null]}>
+                    return <View accessibilityLabel = {_label} testID={testID+"_Container"} {...containerProps} pointerEvents={disabled|| readOnly? "none":"auto"} style={[label?styles.align:null,containerProps.style,label?styles.container:null]}>
                         {<Label testID={testID+"_Label"} {...labelProps} disabled={disabled} style={[styles.label,labelProps.style]}>{label}</Label>}
                         {<Avatar
                             resizeMethod = {"auto"}

package/src/components/Menu/Menu.js

@@ -20,7 +20,7 @@ import {defaultDecimal,extendObj} from "$utils";
 import theme,{StylePropTypes} from "$theme";
 import APP from "$app/instance";
 import MenuItem from "./Item";
-import {isWeb} from "$platform";
+import { MIN_WIDTH } from './utils';
 
 const RESIZE_PAGE = APP.EVENTS.RESIZE_PAGE;
 
@@ -516,7 +516,8 @@ class _Menu extends AppComponent {
                       shadowMenuContainerStyle,
                       contentStyle,
                       {backgroundColor : theme.colors.surface},
-                      sameWidth && anchorLayout.width ? {width:Math.max(anchorLayout.width,minWidth)} : undefined,
+                      minWidth && {minWidth : Math.max(minWidth,MIN_WIDTH)},
+                      sameWidth && anchorLayout.width ? {width:Math.max(anchorLayout.width,minWidth,MIN_WIDTH)} : undefined,
                     ]
                   }
                 >

package/src/components/Menu/utils.js

@@ -7,6 +7,7 @@ import Expandable from "$ecomponents/Expandable";
 import {cursorPointer} from "$theme";
 import Item from "./Item";
 
+export const MIN_WIDTH = 150;
 
 export const renderItems = (props)=>{
     let _items = [];

package/src/components/Table/AbsoluteScrollView.js

@@ -20,6 +20,7 @@ const AbsoluteScrollView = React.forwardRef(({testID,contentProps,listRef,contai
         styles : {},
         visible : true,
     })
+    const [layoutVisible,_setLayoutVisible] = React.useState(true);
     const {styles,visible} = state,setStyles = (s)=>{
         if(isObj(s)){
             setState({...state,styles:{...styles,...s}});
@@ -31,9 +32,19 @@ const AbsoluteScrollView = React.forwardRef(({testID,contentProps,listRef,contai
                 setState({...state,visible});
             }
         }
-    }
+    },setVisible = (visible)=>{
+        if(typeof visible =='boolean' && visible !== state.visible){
+            setState({...state,visible});
+        }
+    },setLayoutVisible = (layoutVisible)=>{
+        if(typeof layoutVisible =='boolean' && layoutVisible !== state.layoutVisible){
+            _setLayoutVisible(layoutVisible);
+        }
+    }   
     React.setRef(ref,{
         setStyles,
+        setVisible,
+        setLayoutVisible,
         checkVisibility : (args)=>{
             args = defaultObj(args);
             if(isObj(args.contentOffset) && isObj(args.contentSize)){
@@ -56,7 +67,7 @@ const AbsoluteScrollView = React.forwardRef(({testID,contentProps,listRef,contai
         toggleVisible();
     },[styles])
     return <Portal>
-        {<View testID={testID+"_Containter"} {...containerProps} style={[mainStyles.container,containerProps.style,styles.container,{left:win.width-10},!visible &&{display:'none',width:0,opacity:0}]}>
+        {<View testID={testID+"_Containter"} {...containerProps} style={[mainStyles.container,containerProps.style,styles.container,{left:win.width-10},(!visible || !layoutVisible) &&{display:'none',width:0,opacity:0}]}>
             <ScrollView
                 {...props}
                 ref = {scrollViewRef}

package/src/components/Table/index.js

@@ -5,7 +5,7 @@ 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,Dimensions} from "react-native";
+import { StyleSheet,View as RNView,ScrollView,NativeModules,Dimensions} from "react-native";
 import { getRowStyle } from "$ecomponents/Datagrid/utils";
 import {isMobileNative} from "$cplatform";
 import theme from "$theme";
@@ -213,6 +213,16 @@ const TableComponent = React.forwardRef(({containerProps,renderEmpty,isRowSelect
     React.setRef(tableRef,context);
     const cStyle = {width:listWidth}
     const absoluteScrollViewRef = React.useRef(null);
+    const scrollViewLayoutRef = React.useRef({});
+    const toggleAbsoluteScrollVisible = ()=>{
+        const ref = scrollViewLayoutRef.current;
+        if(isObj(ref.layout) && isObj(ref.content)){
+            const layoutVisible  = Math.abs(ref.content.width - ref.layout.width)<=50 ? false : true;
+            if(absoluteScrollViewRef.current && absoluteScrollViewRef.current.setLayoutVisible){
+                absoluteScrollViewRef.current.setLayoutVisible(layoutVisible);
+            }
+        }
+    }
     return <View testID= {testID+"_Container"} {...containerProps} style={[styles.container,{alignItems:'stretch'},containerProps.style]}>
             <RNView style={[cStyle]} testID={testID+"_Headers_ScrollViewContainer"}>
                 <ScrollView
@@ -234,12 +244,23 @@ const TableComponent = React.forwardRef(({containerProps,renderEmpty,isRowSelect
             {hasEmptyData ? <View testID={testID+"_Empty"} style={styles.hasNotData}>
                     {emptyData}
             </View> : <ScrollView {...scrollViewProps} scrollEventThrottle = {scrollEventThrottle} horizontal contentContainerStyle={[scrollContentContainerStyle,scrollViewProps.contentContainerStyle]} showsVerticalScrollIndicator={false}  
-            onScroll = {getOnScrollCb([headerScrollViewRef,footerScrollViewRef],null,(args)=>{
-                const nativeEvent = args.nativeEvent;
-                if(absoluteScrollViewRef.current && absoluteScrollViewRef.current.checkVisibility){
-                    absoluteScrollViewRef.current.checkVisibility(nativeEvent);
-                }
-            })} ref={scrollViewRef}  testID={testID+"_ScrollView"}>  
+                onScroll = {getOnScrollCb([headerScrollViewRef,footerScrollViewRef],null,(args)=>{
+                    const nativeEvent = args.nativeEvent;
+                    if(absoluteScrollViewRef.current && absoluteScrollViewRef.current.checkVisibility){
+                        absoluteScrollViewRef.current.checkVisibility(nativeEvent);
+                    }
+                })} 
+                onLayout={({nativeEvent:{layout}}) => {
+                    scrollViewLayoutRef.current.layout = layout;
+                    toggleAbsoluteScrollVisible();
+                }}
+                ref={scrollViewRef} 
+                testID={testID+"_ScrollView"}
+                onContentSizeChange = {(width,height)=>{
+                    scrollViewLayoutRef.current.content = {width,height};
+                    toggleAbsoluteScrollVisible();
+                }}
+            >  
                 <FlashList
                     containerProps = {{style:[cStyle]}}
                     //prepareItems = {Array.isArray(items)? false : undefined}
@@ -353,7 +374,7 @@ const styles = StyleSheet.create({
         minHeight : 300,
         paddingBottom : 50,
         paddingLeft : 10,
-        paddingRight : 10,
+        paddingRight : 0,
         flex : 1,
         position : 'relative',
     },