@fattureincloud-mobile/fic-mobile-ds 1.2.1 → 1.2.2

package/src/components/buttons/FicButton/themes/dark.ts

@@ -10,7 +10,7 @@ const defaultContainerProps: GenericViewStyle = {
   justifyContent: 'center',
   alignContent: 'center',
   alignItems: 'center',
-  borderRadius: BORDER_RADIUS.SM
+  borderRadius: BORDER_RADIUS.SM,
 };
 
 const { alignContent, ...defaultIconContainerProps } = defaultContainerProps;
@@ -18,7 +18,7 @@ const { alignContent, ...defaultIconContainerProps } = defaultContainerProps;
 const iconContainerProps = {
   ...defaultIconContainerProps,
   borderRadius: 1000,
-  alignSelf: 'center' as FlexAlignType
+  alignSelf: 'center' as FlexAlignType,
 };
 
 const ficButtonDarkTheme: FicButtonTheme = {
@@ -26,63 +26,63 @@ const ficButtonDarkTheme: FicButtonTheme = {
     default: {
       container: {
         ...defaultContainerProps,
-        backgroundColor: Colors.AZURE_K
+        backgroundColor: Colors.AZURE_K,
       },
       text: {
-        color: Colors.ELEVATION_1
+        color: Colors.ELEVATION_1,
       },
       icon: {
-        color: Colors.ELEVATION_1
+        color: Colors.ELEVATION_1,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
-          backgroundColor: Colors.AZURE_K_D1
+          backgroundColor: Colors.AZURE_K_D1,
         },
         text: {
-          color: Colors.ELEVATION_1
+          color: Colors.ELEVATION_1,
         },
         icon: {
-          color: Colors.ELEVATION_1
-        }
-      }
+          color: Colors.ELEVATION_1,
+        },
+      },
     },
     disabled: {
       container: {
         ...defaultContainerProps,
-        backgroundColor: Colors.ELEVATION_4
+        backgroundColor: Colors.ELEVATION_4,
       },
       text: {
-        color: Colors.ELEVATION_2
+        color: Colors.ELEVATION_2,
       },
       icon: {
-        color: Colors.ELEVATION_2
-      }
+        color: Colors.ELEVATION_2,
+      },
     },
     error: {
       container: {
         ...defaultContainerProps,
-        backgroundColor: Colors.RED
+        backgroundColor: Colors.RED,
       },
       text: {
-        color: Colors.WHITE
+        color: Colors.WHITE,
       },
       icon: {
-        color: Colors.WHITE
+        color: Colors.WHITE,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
-          backgroundColor: Colors.RED_D1
+          backgroundColor: Colors.RED_D1,
         },
         text: {
-          color: Colors.WHITE
+          color: Colors.WHITE,
         },
         icon: {
-          color: Colors.WHITE
-        }
-      }
-    }
+          color: Colors.WHITE,
+        },
+      },
+    },
   },
   secondary: {
     default: {
@@ -90,71 +90,71 @@ const ficButtonDarkTheme: FicButtonTheme = {
         ...defaultContainerProps,
         backgroundColor: Colors.ELEVATION_1,
         borderWidth: 1,
-        borderColor: Colors.AZURE_K
+        borderColor: Colors.AZURE_K,
       },
       text: {
-        color: Colors.AZURE_K
+        color: Colors.AZURE_K,
       },
       icon: {
-        color: Colors.AZURE_K
+        color: Colors.AZURE_K,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
           backgroundColor: Colors.ELEVATION_2,
           borderWidth: 1,
-          borderColor: Colors.AZURE_K
+          borderColor: Colors.AZURE_K,
         },
         text: {
-          color: Colors.AZURE_K
+          color: Colors.AZURE_K,
         },
         icon: {
-          color: Colors.AZURE_K
-        }
-      }
+          color: Colors.AZURE_K,
+        },
+      },
     },
     disabled: {
       container: {
         ...defaultContainerProps,
         backgroundColor: Colors.ELEVATION_1,
         borderWidth: 1,
-        borderColor: Colors.ELEVATION_4
+        borderColor: Colors.ELEVATION_4,
       },
       text: {
-        color: Colors.ELEVATION_4
+        color: Colors.ELEVATION_4,
       },
       icon: {
-        color: Colors.ELEVATION_4
-      }
+        color: Colors.ELEVATION_4,
+      },
     },
     error: {
       container: {
         ...defaultContainerProps,
         backgroundColor: Colors.ELEVATION_1,
         borderWidth: 1,
-        borderColor: Colors.RED_K_D1
+        borderColor: Colors.RED_K_D1,
       },
       text: {
-        color: Colors.RED_K_D1
+        color: Colors.RED_K_D1,
       },
       icon: {
-        color: Colors.RED_K_D1
+        color: Colors.RED_K_D1,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
           backgroundColor: Colors.ELEVATION_2,
           borderWidth: 1,
-          borderColor: Colors.RED_K_D1
+          borderColor: Colors.RED_K_D1,
         },
         text: {
-          color: Colors.RED_K_D1
+          color: Colors.RED_K_D1,
         },
         icon: {
-          color: Colors.RED_K_D1
-        }
-      }
-    }
+          color: Colors.RED_K_D1,
+        },
+      },
+    },
   },
   tertiary: {
     default: {
@@ -162,96 +162,96 @@ const ficButtonDarkTheme: FicButtonTheme = {
       text: {
         textDecorationLine: 'underline',
         fontSize: FONT_SIZE,
-        color: Colors.AZURE_K
+        color: Colors.AZURE_K,
       },
       icon: {
-        color: Colors.AZURE_K
+        color: Colors.AZURE_K,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
           alignSelf: 'center',
-          backgroundColor: Colors.ELEVATION_4
+          backgroundColor: Colors.ELEVATION_4,
         },
         text: {
           textDecorationLine: 'underline',
           fontSize: FONT_SIZE,
-          color: Colors.AZURE_K
+          color: Colors.AZURE_K,
         },
         icon: {
-          color: Colors.AZURE_K
-        }
-      }
+          color: Colors.AZURE_K,
+        },
+      },
     },
     disabled: {
-      container: { ...defaultContainerProps },
+      container: { ...defaultContainerProps, alignSelf: 'center' },
       text: {
         textDecorationLine: 'underline',
         fontSize: FONT_SIZE,
-        color: Colors.ELEVATION_4
+        color: Colors.ELEVATION_4,
       },
       icon: {
-        color: Colors.ELEVATION_4
-      }
+        color: Colors.ELEVATION_4,
+      },
     },
     error: {
       container: { ...defaultContainerProps, alignSelf: 'center' },
       text: {
         textDecorationLine: 'underline',
         fontSize: FONT_SIZE,
-        color: Colors.RED_K_D1
+        color: Colors.RED_K_D1,
       },
       icon: {
-        color: Colors.RED_K_D1
+        color: Colors.RED_K_D1,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
           alignSelf: 'center',
-          backgroundColor: Colors.ELEVATION_4
+          backgroundColor: Colors.ELEVATION_4,
         },
         text: {
           textDecorationLine: 'underline',
           fontSize: FONT_SIZE,
-          color: Colors.RED_K_D1
+          color: Colors.RED_K_D1,
         },
         icon: {
-          color: Colors.RED_K_D1
-        }
-      }
-    }
+          color: Colors.RED_K_D1,
+        },
+      },
+    },
   },
   icon: {
     default: {
       container: { ...iconContainerProps, alignSelf: 'flex-start' },
       text: {},
       icon: {
-        color: Colors.WHITE_80
+        color: Colors.WHITE_80,
       },
       pressedStyle: {
         container: {
           backgroundColor: Colors.ELEVATION_4,
           justifyContent: 'center',
-          alignItems: 'center'
+          alignItems: 'center',
         },
         text: {},
         icon: {
-          color: Colors.WHITE_80
-        }
-      }
+          color: Colors.WHITE_80,
+        },
+      },
     },
     disabled: {
       container: { ...iconContainerProps },
       text: {},
       icon: {
-        color: Colors.ELEVATION_4
-      }
+        color: Colors.ELEVATION_4,
+      },
     },
     error: {
       container: { ...iconContainerProps },
       text: {},
       icon: {
-        color: Colors.RED_K_D1
+        color: Colors.RED_K_D1,
       },
       pressedStyle: {
         container: {
@@ -259,15 +259,15 @@ const ficButtonDarkTheme: FicButtonTheme = {
           justifyContent: 'center',
           alignItems: 'center',
           borderRadius: 1000,
-          backgroundColor: Colors.ELEVATION_4
+          backgroundColor: Colors.ELEVATION_4,
         },
         text: {},
         icon: {
-          color: Colors.RED_K_D1
-        }
-      }
-    }
-  }
+          color: Colors.RED_K_D1,
+        },
+      },
+    },
+  },
 };
 
 export default ficButtonDarkTheme;

package/src/components/buttons/FicButton/themes/index.ts

@@ -1,3 +1,4 @@
+import ficButtonDarkTheme from './dark';
 import ficButtonLightTheme from './light';
 
-export { ficButtonLightTheme };
+export { ficButtonDarkTheme, ficButtonLightTheme };

package/src/components/buttons/FicButton/themes/light.ts

@@ -10,7 +10,7 @@ const defaultContainerProps: GenericViewStyle = {
   justifyContent: 'center',
   alignContent: 'center',
   alignItems: 'center',
-  borderRadius: BORDER_RADIUS.SM
+  borderRadius: BORDER_RADIUS.SM,
 };
 
 const { alignContent, ...defaultIconContainerProps } = defaultContainerProps;
@@ -18,7 +18,7 @@ const { alignContent, ...defaultIconContainerProps } = defaultContainerProps;
 const iconContainerProps = {
   ...defaultIconContainerProps,
   borderRadius: 1000,
-  alignSelf: 'center' as FlexAlignType
+  alignSelf: 'center' as FlexAlignType,
 };
 
 const ficButtonLightTheme: FicButtonTheme = {
@@ -26,68 +26,68 @@ const ficButtonLightTheme: FicButtonTheme = {
     default: {
       container: {
         ...defaultContainerProps,
-        backgroundColor: Colors.AZURE
+        backgroundColor: Colors.AZURE,
       },
       text: {
         fontSize: FONT_SIZE,
-        color: Colors.WHITE
+        color: Colors.WHITE,
       },
       icon: {
-        color: Colors.WHITE
+        color: Colors.WHITE,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
-          backgroundColor: Colors.AZURE_D1
+          backgroundColor: Colors.AZURE_D1,
         },
         text: {
           fontSize: FONT_SIZE,
-          color: Colors.WHITE
+          color: Colors.WHITE,
         },
         icon: {
-          color: Colors.WHITE
-        }
-      }
+          color: Colors.WHITE,
+        },
+      },
     },
     disabled: {
       container: {
         ...defaultContainerProps,
-        backgroundColor: Colors.GREY_2
+        backgroundColor: Colors.GREY_2,
       },
       text: {
         fontSize: FONT_SIZE,
-        color: Colors.GREY_3
+        color: Colors.GREY_3,
       },
       icon: {
-        color: Colors.GREY_3
-      }
+        color: Colors.GREY_3,
+      },
     },
     error: {
       container: {
         ...defaultContainerProps,
-        backgroundColor: Colors.RED
+        backgroundColor: Colors.RED,
       },
       text: {
         fontSize: FONT_SIZE,
-        color: Colors.WHITE
+        color: Colors.WHITE,
       },
       icon: {
-        color: Colors.WHITE
+        color: Colors.WHITE,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
-          backgroundColor: Colors.RED_D2
+          backgroundColor: Colors.RED_D2,
         },
         text: {
           fontSize: FONT_SIZE,
-          color: Colors.WHITE
+          color: Colors.WHITE,
         },
         icon: {
-          color: Colors.WHITE
-        }
-      }
-    }
+          color: Colors.WHITE,
+        },
+      },
+    },
   },
   secondary: {
     default: {
@@ -95,76 +95,76 @@ const ficButtonLightTheme: FicButtonTheme = {
         ...defaultContainerProps,
         backgroundColor: Colors.WHITE,
         borderWidth: 1,
-        borderColor: Colors.AZURE
+        borderColor: Colors.AZURE,
       },
       text: {
         fontSize: FONT_SIZE,
-        color: Colors.AZURE
+        color: Colors.AZURE,
       },
       icon: {
-        color: Colors.AZURE
+        color: Colors.AZURE,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
           backgroundColor: Colors.GREY_2,
           borderWidth: 1,
-          borderColor: Colors.AZURE
+          borderColor: Colors.AZURE,
         },
         text: {
           fontSize: FONT_SIZE,
-          color: Colors.AZURE
+          color: Colors.AZURE,
         },
         icon: {
-          color: Colors.AZURE
-        }
-      }
+          color: Colors.AZURE,
+        },
+      },
     },
     disabled: {
       container: {
         ...defaultContainerProps,
         backgroundColor: Colors.WHITE,
         borderWidth: 1,
-        borderColor: Colors.GREY_3
+        borderColor: Colors.GREY_3,
       },
       text: {
         fontSize: FONT_SIZE,
-        color: Colors.GREY_3
+        color: Colors.GREY_3,
       },
       icon: {
-        color: Colors.GREY_3
-      }
+        color: Colors.GREY_3,
+      },
     },
     error: {
       container: {
         ...defaultContainerProps,
         backgroundColor: Colors.WHITE,
         borderWidth: 1,
-        borderColor: Colors.RED
+        borderColor: Colors.RED,
       },
       text: {
         fontSize: FONT_SIZE,
-        color: Colors.RED
+        color: Colors.RED,
       },
       icon: {
-        color: Colors.RED
+        color: Colors.RED,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
           backgroundColor: Colors.RED_L1,
           borderWidth: 1,
-          borderColor: Colors.RED
+          borderColor: Colors.RED,
         },
         text: {
           fontSize: FONT_SIZE,
-          color: Colors.RED
+          color: Colors.RED,
         },
         icon: {
-          color: Colors.RED
-        }
-      }
-    }
+          color: Colors.RED,
+        },
+      },
+    },
   },
   tertiary: {
     default: {
@@ -173,41 +173,41 @@ const ficButtonLightTheme: FicButtonTheme = {
         textDecorationLine: 'underline',
         fontSize: FONT_SIZE,
         color: Colors.AZURE,
-        colorContrastForLightTheme: Colors.WHITE
+        colorContrastForLightTheme: Colors.WHITE,
       },
       icon: {
         color: Colors.AZURE,
-        colorContrastForLightTheme: Colors.WHITE
+        colorContrastForLightTheme: Colors.WHITE,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
           alignSelf: 'center',
-          backgroundColor: Colors.BLACK_08
+          backgroundColor: Colors.BLACK_08,
         },
         text: {
           textDecorationLine: 'underline',
           fontSize: FONT_SIZE,
           color: Colors.AZURE,
-          colorContrastForLightTheme: Colors.WHITE
+          colorContrastForLightTheme: Colors.WHITE,
         },
         icon: {
           color: Colors.AZURE,
-          colorContrastForLightTheme: Colors.WHITE
-        }
-      }
+          colorContrastForLightTheme: Colors.WHITE,
+        },
+      },
     },
     disabled: {
-      container: { ...defaultContainerProps },
+      container: { ...defaultContainerProps, alignSelf: 'center' },
       text: {
         textDecorationLine: 'underline',
         fontSize: FONT_SIZE,
-        color: Colors.GREY_3
+        color: Colors.GREY_3,
       },
       icon: {
         color: Colors.GREY_3,
-        colorContrastForLightTheme: Colors.WHITE_80
-      }
+        colorContrastForLightTheme: Colors.WHITE_80,
+      },
     },
     error: {
       container: { ...defaultContainerProps, alignSelf: 'center' },
@@ -215,29 +215,29 @@ const ficButtonLightTheme: FicButtonTheme = {
         textDecorationLine: 'underline',
         fontSize: FONT_SIZE,
         color: Colors.RED,
-        colorContrastForLightTheme: Colors.RED_L2
+        colorContrastForLightTheme: Colors.RED_L2,
       },
       icon: {
-        color: Colors.RED
+        color: Colors.RED,
       },
       pressedStyle: {
         container: {
           ...defaultContainerProps,
           alignSelf: 'center',
-          backgroundColor: Colors.RED_L1
+          backgroundColor: Colors.RED_L1,
         },
         text: {
           textDecorationLine: 'underline',
           fontSize: FONT_SIZE,
           color: Colors.RED,
-          colorContrastForLightTheme: Colors.RED_L2
+          colorContrastForLightTheme: Colors.RED_L2,
         },
         icon: {
           color: Colors.RED,
-          colorContrastForLightTheme: Colors.RED_L2
-        }
-      }
-    }
+          colorContrastForLightTheme: Colors.RED_L2,
+        },
+      },
+    },
   },
   icon: {
     default: {
@@ -245,49 +245,49 @@ const ficButtonLightTheme: FicButtonTheme = {
       text: {},
       icon: {
         color: Colors.AZURE,
-        colorContrastForLightTheme: Colors.WHITE
+        colorContrastForLightTheme: Colors.WHITE,
       },
       pressedStyle: {
         container: {
           backgroundColor: Colors.BLACK_08,
           justifyContent: 'center',
-          alignItems: 'center'
+          alignItems: 'center',
         },
         text: {},
         icon: {
           color: Colors.AZURE,
-          colorContrastForLightTheme: Colors.WHITE
-        }
-      }
+          colorContrastForLightTheme: Colors.WHITE,
+        },
+      },
     },
     disabled: {
       container: { ...iconContainerProps },
       text: {},
       icon: {
         color: Colors.GREY_3,
-        colorContrastForLightTheme: Colors.WHITE_80
-      }
+        colorContrastForLightTheme: Colors.WHITE_80,
+      },
     },
     error: {
       container: { ...iconContainerProps },
       text: {},
       icon: {
-        color: Colors.RED
+        color: Colors.RED,
       },
       pressedStyle: {
         container: {
           justifyContent: 'center',
           alignItems: 'center',
-          backgroundColor: Colors.RED_L1
+          backgroundColor: Colors.RED_L1,
         },
         text: {},
         icon: {
           color: Colors.RED,
-          colorContrastForLightTheme: Colors.RED_L2
-        }
-      }
-    }
-  }
+          colorContrastForLightTheme: Colors.RED_L2,
+        },
+      },
+    },
+  },
 };
 
 export default ficButtonLightTheme;