@fto-consult/expo-ui 2.48.0 → 2.48.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fto-consult/expo-ui",
-  "version": "2.48.0",
+  "version": "2.48.3",
   "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.12.2",
+    "@fto-consult/common": "^2.13.1",
     "@gorhom/portal": "^1.0.14",
     "@react-native-async-storage/async-storage": "~1.17.3",
     "@react-native-community/datetimepicker": "6.5.2",

package/src/auth/Login.js

@@ -150,7 +150,11 @@ export default function LoginComponent(props){
             nextButtonRef.current?.enable();
         }
         if(step > 1){
-            if(canSubmit(args) && beforeSubmit(args) !== false){
+            const cS = canSubmit(args);
+            if(typeof cS === 'string' && cS){
+                return notifyUser(cS);
+            }
+            if(cS && beforeSubmit(args) !== false){
                 ///pour modifier automatiquement la données à mettre à jour
                 if(typeof mutateData =='function'){
                     mutateData(data);

package/src/components/AppBar/index.js

@@ -93,7 +93,7 @@ const AppBarComponent = React.forwardRef((props,ref)=> {
     const [context] = React.useState({});
     actions = typeof actions =='function'? actions(getCallAgs()) : actions;
     const dimensions = Dimensions.get("window");
-    const [layout,setLayout] = React.useStateIfMounted({
+    const [layout,setLayout] = React.useState({
        width : dimensions.width,
        height : dimensions.height,
     })

package/src/components/AppBar/utils.js

@@ -155,9 +155,9 @@ export const splitActions = (args)=>{
                     return false;
                 }
                 if(menus.length && countActions > 1){
-                    menus.push({...action,isMenuItem:true});
+                    menus.push({...action,isCancelButton:true,isMenuItem:true});
                 } else {
-                    _actions.push(<Button testID={'RN_AppBarCancelButton'} {...action} key={action.key}/>)
+                    _actions.push(<Button isCancelButton testID={'RN_AppBarCancelButton'} {...action} key={action.key}/>)
                 }
             }
         }

package/src/components/BottomSheet/Menu.js

@@ -12,7 +12,7 @@ const BottomSheetMenuComponent = React.forwardRef((props,ref)=>{
     rest = defaultObj(rest);
     const isControlled = controlled ? true : false;
     const visibleRef = React.useRef(null);
-    const [state,setState] = React.useStateIfMounted({
+    const [state,setState] = React.useState({
         visible : false,
         height : undefined,
     });

package/src/components/Button/index.js

@@ -27,6 +27,8 @@ const ButtonComponent = React.forwardRef(({
   children,
   text,
   label,
+  isCancelButton,
+  error,
   upperCase = true,
   accessibilityLabel,
   onPress,
@@ -59,6 +61,7 @@ const ButtonComponent = React.forwardRef(({
   borderRadius,
   ...rest
 },ref) => {
+  isCancelButton = isCancelButton || error && true || false;
   children = defaultVal(children,label,text);
   testID = defaultStr(testID,'RN_ButtonComponent');
   upperCase = upperCase ? true : false;
@@ -137,10 +140,10 @@ const ButtonComponent = React.forwardRef(({
   };
   contentContainerProps = defaultObj(contentContainerProps);
   containerProps = defaultObj(containerProps);
-  style = StyleSheet.flatten(style) || {};
+  style = Object.assign(StyleSheet.flatten(style) || {});
   labelStyle = StyleSheet.flatten([labelStyle]);
   const disabled = isDisabled || isLoading;
-  let textColor = Colors.isValid(buttonColor)?buttonColor : Colors.isValid(labelStyle.color) ? labelStyle.color : Colors.isValid(style.color)? style.color  : theme.colors.primary,
+  let textColor = Colors.isValid(buttonColor)?buttonColor : Colors.isValid(labelStyle.color) ? labelStyle.color : Colors.isValid(style.color)? style.color : isCancelButton? theme.colors.errorText  : theme.colors.primary,
     borderWidth;
     const restButtonStyle = {
       opacity : disabled ? DISABLED_OPACITY : undefined
@@ -149,10 +152,13 @@ const ButtonComponent = React.forwardRef(({
   iconProps = defaultObj(iconProps);
   labelProps = defaultObj(labelProps);
   contentProps = defaultObj(contentProps);
-  
+  if(isCancelButton){
+    style.backgroundColor = theme.colors.error;
+    style.color = theme.styles.errorText ;
+  }
   if (!disabled && hasElevation) {
-    backgroundColor = Colors.isValid(backgroundColor)? backgroundColor : Colors.isValid(style.backgroundColor)?style.backgroundColor : undefined;
-    borderColor = Colors.isValid(borderColor)? borderColor : Colors.isValid(style.borderColor)? style.borderColor : undefined;
+    backgroundColor = Colors.isValid(backgroundColor)? backgroundColor : Colors.isValid(style.backgroundColor)?style.backgroundColor  : undefined;
+    borderColor = Colors.isValid(borderColor)? borderColor : Colors.isValid(style.borderColor)? style.borderColor : isCancelButton ? theme.styles.errorText : undefined;
   }
   if(theme.isDark() && !hasElevation){
     textColor = white;

package/src/components/Checkbox/index.js

@@ -58,7 +58,7 @@ const CheckboxComponent = React.forwardRef((props,ref)=>{
     } 
     delete p.checked;
     defaultValue = defaultVal(defaultValue,value,0);
-    const [status,setStatus] = React.useStateIfMounted(defaultValue == checkedValue ? checkedStatus : uncheckedStatus)
+    const [status,setStatus] = React.useState(defaultValue == checkedValue ? checkedStatus : uncheckedStatus)
     const previousStatus = React.usePrevious(status);
     const checked = status===checkedStatus?true:false;
     if(checked){

package/src/components/Color/index.js

@@ -19,7 +19,7 @@ const ColorPickerComponent = React.forwardRef ((props,ref)=>{
     const isMob = isMobileOrTabletMedia();
     const _label = defaultStr(label,text);
     const pickerRef = React.useRef(null);
-    const [state,setState] = React.useStateIfMounted({
+    const [state,setState] = React.useState({
         color : Colors.isValid(defaultValue)? defaultValue : undefined,
         visible : false,
     })