@fto-consult/expo-ui 6.16.4 → 6.16.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "6.16.4",
+  "version": "6.16.6",
   "description": "Bibliothèque de composants UI Expo,react-native",
   "main": "index.js",
   "scripts": {
@@ -99,7 +99,7 @@
     "react-native-iphone-x-helper": "^1.3.1",
     "react-native-mime-types": "^2.4.0",
     "react-native-paper": "^5.10.0",
-    "react-native-paper-dates": "^0.18.12",
+    "react-native-paper-dates": "^0.18.13",
     "react-native-reanimated": "~3.3.0",
     "react-native-safe-area-context": "4.6.3",
     "react-native-screens": "~3.22.0",

package/src/components/Date/Time.js

@@ -7,6 +7,7 @@ import PropTypes from "prop-types";
 import theme,{styles} from "$theme";
 import { locale } from "./utils";
 import { TouchableRipple } from "react-native-paper";
+import View from "$ecomponents/View";
 export const getDate = (hours,minutes,seconds)=>{
     return new Date(2000, 1, 1, defaultDecimal(hours), defaultDecimal(minutes),defaultDecimal(seconds))
 }
@@ -72,7 +73,7 @@ export default function TimePickerComponent (props){
     let right = null;
     if(withModal){
       right = (props)=>{
-          return <>
+          return <View testID="RN_DatePickerRightContainer" style={[{pointerEvents:isEditable && !disabled ?"auto":"none"},styles.row,styles.justifyContentStart,styles.alignItemsCenter]}>
               <Icon title={label}  {...anchorProps} 
               icon="clock-outline" onPress={(e)=>{
                   React.stopEventPropagation(e);
@@ -82,7 +83,7 @@ export default function TimePickerComponent (props){
               style = {[props.style,anchorProps.style]}
               />
            {typeof customRight =='function'? customRight(props): customRight}  
-          </>
+          </View>
       }
    } else right = customRight;
     React.useEffect(()=>{
@@ -111,15 +112,16 @@ export default function TimePickerComponent (props){
     if(!disabled){
       containerProps.style = [containerProps.style,{opacity:1}]
     }
+    const tCursor = disabled || readOnly ?  styles.cursorNotAllowed:styles.cursorPointer;
     const iContainerProps = defaultObj(inputProps.containerProps);
     return <>
       <TouchableRipple {...containerProps} 
         disabled = {!isEditable}
-        style = {[containerProps.style,styles.cursorPointer]}
+        style = {[containerProps.style,tCursor]}
         onPress = {isEditable?openModal:undefined}
         rippleColor={containerProps.rippleColor}
       >
-          <TextField
+        <TextField
           mode = {mode||theme.textFieldMode}
           {...rest}
           {...inputProps}
@@ -128,12 +130,12 @@ export default function TimePickerComponent (props){
           right = {right}
           disabled = {disabled}
           readOnly = {true}
-          handleOpacity = {false}
-          style = {[rest.style,!disabled && {opacity:1,color:theme.colors.text}]}
+          useReadOnlyOpacity = {!disabled && !readOnly ? false : true}
+          style = {[rest.style,tCursor,!disabled && {color:theme.colors.text}]}
           contentContainerProps = {{...defaultObj(rest.contentContainerProps),pointerEvents:'auto'}}
           defaultValue = {state.value}
           placeholder = {formatLabel}
-        />
+       />
       </TouchableRipple>
       {withModal && <TimePickerModal
           {...dialogProps}

package/src/components/Date/TimePickerModal/index.js

@@ -1,3 +1,9 @@
-import {TimePickerModal} from 'react-native-paper-dates'
+import {TimePickerModal} from 'react-native-paper-dates';
+import {PaperProvider} from 'react-native-paper';
+import theme from "$theme";
 
-export default TimePickerModal;
+export default function TimePickerModalComponent(props){
+    return <PaperProvider theme={theme}>
+        <TimePickerModal {...props}/>
+    </PaperProvider>
+}

package/src/components/Dropdown/index.js

@@ -894,7 +894,7 @@ class DropdownComponent extends AppComponent {
                     {<TextField
                         defaultValue={selectedText}
                         autoHeight = {renderTag}
-                        useReadOnlyOpacity = {false}
+                        useReadOnlyOpacity = {!disabled && !readOnly ? false : true}
                         {...inputProps}
                         {...textInputProps}
                         mode = {mode}

package/src/components/SimpleSelect/index.js

@@ -240,7 +240,7 @@ const  SimpleSelect = React.forwardRef((props,ref)=>{
     }) : 
         <TextField
             autoHeight = {false}
-            useReadOnlyOpacity = {false}
+            useReadOnlyOpacity = {!disabled && !readOnly ? false : true}
             affix = {false}
             mode = {mode}
             {...rest}

package/src/components/Table/index.js

@@ -254,7 +254,10 @@ const TableComponent = React.forwardRef(({containerProps,sortedColumn,listContai
         if(onRender){
             onRender(a,b,c);
         }
-        if(hasChangedDataRef.current){
+        //au paravant il était possible de faire scroller le composant Table lorsque les données sont raffraichies, ce qui n'avait pas un bon impact sur le rendu de la table de données
+        if(false && hasChangedDataRef.current){
+            //permet de restaurer la position scrollé où scroll initial à chaque fois que le composant est re render
+            //ce qui n'est pas très interessant
             if(headerScrollViewRef.current && headerScrollViewRef.current.scrollTo){
                 headerScrollViewRef.current.scrollTo({
                     x : 0,

package/src/components/TextField/index.js

@@ -221,7 +221,7 @@ const TextFieldComponent = React.forwardRef((componentProps,inputRef)=>{
     const pointerEvents = isEditable?"auto":'none';
     const upperStyle =  text && (upper || lower) && !isAndroid ? {textTransform:upper?'uppercase':'lowercase'} : null;
     const opacity = disabled ? DISABLED_OPACITY : (useReadOnlyOpacity !== false && !error && (readOnly)) ? READONLY_OPACITY : undefined;
-    const disabledStyle = handleOpacity != false && opacity ? {opacity} : undefined;
+    const disabledStyle = typeof opacity =="number" ? {opacity} : undefined;
     if((readOnly === true || disabled === true) ){
         selection = defaultObj(selection);
         if(!isNumber(selection.start)){
@@ -354,6 +354,7 @@ const TextFieldComponent = React.forwardRef((componentProps,inputRef)=>{
             isWeb && { outline: 'none'},
             disabledStyle,
             {height},
+            readOnly || disabled && theme.styles.cursorNotAllowed,
             inputStyle2,
             isNormalMode && styles.inputNormalMode,
             isShadowMode && styles.inputShadowMode,
@@ -751,7 +752,7 @@ TextFieldComponent.propTypes = {
     ]),
     ///le style à afficher sur l'affix
     affixStyle : PropTypes.object,
-    handleOpacity : PropTypes.bool,///si l'opacité sera géré automatiquement en fonction du status disabled de la textField
+    //handleOpacity : PropTypes.bool,///si l'opacité sera géré automatiquement en fonction du status disabled de la textField
     toCase : PropTypes.func,
 };