etendo-ui-library 1.0.21 → 1.0.23

package/components/button/Button.stories.tsx

@@ -28,7 +28,7 @@ primary.args =
     },
     typeStyle: 'primary',
     image: { 
-        imgRoute: require('../asset/CheckWhite.png'),
+        imgRoute: require('../../assets/images/icons/check.png'),
         imgHeight: 10,
         imgWidth: 12,
         imgMarginRight: 10 
@@ -44,7 +44,7 @@ secondary.args =
     onPress: ()=> {console.log('Press Button')},
     typeStyle: 'secondary',
     image: {
-        imgRoute: require('../asset/Check.png'),
+        imgRoute: require('../../assets/images/icons/check.png'),
         imgHeight:  10,
         imgWidth: 12,
         imgMarginRight: 10
@@ -61,7 +61,7 @@ terciary.args =
     },
     typeStyle: 'terciary',
     image: {
-        imgRoute: require('../asset/Check.png'),
+        imgRoute: require('../../assets/images/icons/check.png'),
         imgHeight: 10,
         imgWidth: 12,
         imgMarginRight: 10
@@ -79,7 +79,7 @@ whiteBorder.args =
     },
     typeStyle: 'whiteBorder',
     image: {
-        imgRoute:require('../asset/Check.png'),
+        imgRoute:require('../../assets/images/icons/check.png'),
         imgHeight:10, 
         imgWidth: 12, 
         imgMarginRight: 10
@@ -97,7 +97,7 @@ white.args =
     },
     typeStyle: 'white',
     image: { 
-        imgRoute:require('../asset/Check.png'),
+        imgRoute:require('../../assets/images/icons/check.png'),
         imgHeight:10, 
         imgWidth: 12, 
         imgMarginRight: 10

package/components/button/Button.styles.tsx

@@ -25,6 +25,9 @@ export const ButtonStyleVariant:buttonStyleVariant = {
             color: WHITE,
             fontWeight: 'bold',
         },
+        imageColor: {
+            tintColor: WHITE
+        }
     },
     secondary: {
         container: {
@@ -49,6 +52,9 @@ export const ButtonStyleVariant:buttonStyleVariant = {
             color: GREY_BLUE_50,
             fontWeight: 'bold',
         },
+        imageColor: {
+            tintColor: BLUE
+        }
     },
     terciary: {
         container: {
@@ -73,6 +79,9 @@ export const ButtonStyleVariant:buttonStyleVariant = {
             color: GREY_BLUE_50,
             fontWeight: 'bold',
         },
+        imageColor: {
+            tintColor: BLUE
+        }
     },
     whiteBorder: {
         container: {
@@ -101,6 +110,9 @@ export const ButtonStyleVariant:buttonStyleVariant = {
             color: GREY_BLUE_50,
             fontWeight: 'bold',
         },
+        imageColor: {
+            tintColor: BLUE
+        }
     },
     white: {
         container: {
@@ -125,6 +137,9 @@ export const ButtonStyleVariant:buttonStyleVariant = {
             color: GREY_BLUE_50,
             fontWeight: 'bold',
         },
+        imageColor: {
+            tintColor: BLUE
+        }
     }
 }
 

package/components/button/Button.test.tsx

@@ -11,7 +11,7 @@ describe('Running Test for Input', () => {
         onPress={() => { } } 
         typeStyle={'primary'}
         image={{
-          imgRoute:require('../asset/CheckWhite.png'),
+          imgRoute:require('../../assets/images/icons/check.png'),
           imgHeight:12,
           imgWidth:16,
           imgMarginRight:10

package/components/button/Button.tsx

@@ -27,7 +27,7 @@ const Button = ({ text, onPress, typeStyle, image, disabled, typeSize }: ButtonP
             onPress= { onPress }>
                             {
                                 image?.imgRoute && <Image source={image.imgRoute} 
-                                style= {[addImageStyle(image), { opacity:disabled? 0.2 : 1 }]}></Image> 
+                                style= {[addImageStyle(image), { opacity:disabled? 0.2 : 1 }, ButtonStyleVariant[typeStyle].imageColor]}></Image> 
                             }
                 <Text style= {[ stateStyleText(), ButtonSizeVariant[typeSize].buttonSize ]}> { text } </Text>
             </TouchableOpacity>

package/components/button/Button.types.tsx

@@ -1,4 +1,4 @@
-import {ImageSourcePropType, TextStyle, ViewStyle} from 'react-native'
+import {ImageSourcePropType, ImageStyle, TextStyle, ViewStyle} from 'react-native'
 
 export type ButtonStyleType = 'primary' | 'secondary' |'terciary' |'whiteBorder' | 'white' ;
 
@@ -10,6 +10,7 @@ ButtonStyleType, {
     text: TextStyle,
     containerDisabled: ViewStyle,
     textDisabled: TextStyle,
+    imageColor: ImageStyle,
 }> 
 
 export type buttonSizeVariant = Record<

package/components/button/__snapshots__/Button.test.tsx.snap

@@ -29,7 +29,7 @@ exports[`Running Test for Input Check Button disabled 1`] = `
     <Image
       source={
         Object {
-          "testUri": "../../../components/asset/CheckWhite.png",
+          "testUri": "../../../assets/images/icons/check.png",
         }
       }
       style={
@@ -48,6 +48,9 @@ exports[`Running Test for Input Check Button disabled 1`] = `
           Object {
             "opacity": 0.2,
           },
+          Object {
+            "tintColor": "#FFFFFF",
+          },
         ]
       }
     />

package/components/navbar/Navbar.stories.tsx

@@ -19,31 +19,31 @@ const datasetNavbarH = [
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/more.png'),
+    routeImage: require('../../assets/images/icons/hamburger.png'),
     routeNav: '',
     key: 'dataset1',
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/binoculars.png'),
+    routeImage: require('../../assets/images/icons/binoculars.png'),
     routeNav: '',
     key: 'dataset2',
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/video.png'),
+    routeImage: require('../../assets/images/icons/video.png'),
     routeNav: '',
     key: 'dataset3',
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/chat.png'),
+    routeImage: require('../../assets/images/icons/chat.png'),
     routeNav: '',
     key: 'dataset4',
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/user.png'),
+    routeImage: require('../../assets/images/icons/userNoBorder.png'),
     routeNav: '',
     key: 'dataset5',
     name: 'FirstName LastName',
@@ -52,19 +52,19 @@ const datasetNavbarH = [
 
 const datasetNavbarV = [
   {
-    routeImage: require('../../assets/images/way.png'),
+    routeImage: require('../../assets/images/icons/way.png'),
     routeNav: '',
     key: 'dataset0',
     name: 'Routes',
   },
   {
-    routeImage: require('../../assets/images/tracing.png'),
+    routeImage: require('../../assets/images/icons/tracing.png'),
     routeNav: '',
     key: 'dataset1',
     name: 'Tracing',
   },
   {
-    routeImage: require('../../assets/images/reports.png'),
+    routeImage: require('../../assets/images/icons/reports.png'),
     routeNav: '',
     key: 'dataset2',
     name: 'Reports',

package/components/navbar/Navbar.test.tsx

@@ -11,31 +11,31 @@ const datasetNavbarH = [
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/more.png'),
+    routeImage: require('../../assets/images/icons/hamburger.png'),
     routeNav: '',
     key: 'dataset1',
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/binoculars.png'),
+    routeImage: require('../../assets/images/icons/binoculars.png'),
     routeNav: '',
     key: 'dataset2',
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/video.png'),
+    routeImage: require('../../assets/images/icons/video.png'),
     routeNav: '',
     key: 'dataset3',
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/chat.png'),
+    routeImage: require('../../assets/images/icons/chat.png'),
     routeNav: '',
     key: 'dataset4',
     name: 'FirstName LastName',
   },
   {
-    routeImage: require('../../assets/images/user.png'),
+    routeImage: require('../../assets/images/icons/userNoBorder.png'),
     routeNav: '',
     key: 'dataset5',
     name: 'FirstName LastName',

package/components/navbar/__snapshots__/Navbar.test.tsx.snap

@@ -73,7 +73,7 @@ exports[`Running Test for Navbar Check Navbar Disabled 1`] = `
           <Image
             source={
               Object {
-                "testUri": "../../../assets/images/binoculars.png",
+                "testUri": "../../../assets/images/icons/binoculars.png",
               }
             }
             style={
@@ -105,7 +105,7 @@ exports[`Running Test for Navbar Check Navbar Disabled 1`] = `
           <Image
             source={
               Object {
-                "testUri": "../../../assets/images/video.png",
+                "testUri": "../../../assets/images/icons/video.png",
               }
             }
             style={
@@ -137,7 +137,7 @@ exports[`Running Test for Navbar Check Navbar Disabled 1`] = `
           <Image
             source={
               Object {
-                "testUri": "../../../assets/images/chat.png",
+                "testUri": "../../../assets/images/icons/chat.png",
               }
             }
             style={
@@ -169,7 +169,7 @@ exports[`Running Test for Navbar Check Navbar Disabled 1`] = `
           <Image
             source={
               Object {
-                "testUri": "../../../assets/images/user.png",
+                "testUri": "../../../assets/images/icons/userNoBorder.png",
               }
             }
             style={

package/components/pagination/Pagination.styles.tsx

@@ -13,7 +13,7 @@ export const PaginationStyleVariant: PaginationStyleRecord = {
       flexDirection: 'row',
     },
     icon: {
-      width: 20,
+      width: 22,
       height: 22,
       marginRight: 17,
     },

package/components/pagination/Pagination.tsx

@@ -56,7 +56,7 @@ export const Pagination = ({
         >
           <Image
             style={PaginationStyleVariant.primary.icon}
-            source={require('../../assets/images/back-double-button.png')}
+            source={require('../../assets/images/icons/back-double-button.png')}
           />
         </TouchableOpacity>
 
@@ -73,7 +73,7 @@ export const Pagination = ({
         >
           <Image
             style={PaginationStyleVariant.primary.icon}
-            source={require('../../assets/images/back-button.png')}
+            source={require('../../assets/images/icons/back-button.png')}
           />
         </TouchableOpacity>
 
@@ -97,7 +97,7 @@ export const Pagination = ({
         >
           <Image
             style={PaginationStyleVariant.primary.icon}
-            source={require('../../assets/images/next-button.png')}
+            source={require('../../assets/images/icons/next-button.png')}
           />
         </TouchableOpacity>
 
@@ -114,7 +114,7 @@ export const Pagination = ({
         >
           <Image
             style={PaginationStyleVariant.primary.icon}
-            source={require('../../assets/images/next-double-button.png')}
+            source={require('../../assets/images/icons/next-double-button.png')}
           />
         </TouchableOpacity>
       </View>

package/components/pagination/__snapshots__/Pagination.test.tsx.snap

@@ -46,14 +46,14 @@ exports[`Running Test for Pagination Check Pagination Disabled 1`] = `
       <Image
         source={
           Object {
-            "testUri": "../../../assets/images/back-double-button.png",
+            "testUri": "../../../assets/images/icons/back-double-button.png",
           }
         }
         style={
           Object {
             "height": 22,
             "marginRight": 17,
-            "width": 20,
+            "width": 22,
           }
         }
       />
@@ -83,14 +83,14 @@ exports[`Running Test for Pagination Check Pagination Disabled 1`] = `
       <Image
         source={
           Object {
-            "testUri": "../../../assets/images/back-button.png",
+            "testUri": "../../../assets/images/icons/back-button.png",
           }
         }
         style={
           Object {
             "height": 22,
             "marginRight": 17,
-            "width": 20,
+            "width": 22,
           }
         }
       />
@@ -144,14 +144,14 @@ exports[`Running Test for Pagination Check Pagination Disabled 1`] = `
       <Image
         source={
           Object {
-            "testUri": "../../../assets/images/next-button.png",
+            "testUri": "../../../assets/images/icons/next-button.png",
           }
         }
         style={
           Object {
             "height": 22,
             "marginRight": 17,
-            "width": 20,
+            "width": 22,
           }
         }
       />
@@ -181,14 +181,14 @@ exports[`Running Test for Pagination Check Pagination Disabled 1`] = `
       <Image
         source={
           Object {
-            "testUri": "../../../assets/images/next-double-button.png",
+            "testUri": "../../../assets/images/icons/next-double-button.png",
           }
         }
         style={
           Object {
             "height": 22,
             "marginRight": 17,
-            "width": 20,
+            "width": 22,
           }
         }
       />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "etendo-ui-library",
-  "version": "1.0.21",
+  "version": "1.0.23",
   "private": false,
   "scripts": {
     "android": "react-native run-android",