fix(FAB): add small size style (#3322)

react-native-elements · Jan 31, 2022 · a3b8021 · a3b8021
1 parent 508f115
commit a3b8021
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 4 deletions.
diff --git a/src/FAB/FAB.tsx b/src/FAB/FAB.tsx
@@ -73,7 +73,9 @@ export const FAB: RneFunctionComponent<FABProps> = ({
       <Button
         buttonStyle={StyleSheet.flatten([
           rest.title
-            ? styles.extendedLabel
+            ? size === 'small'
+              ? styles.smallExtendedLabel
+              : styles.extendedLabel
             : size === 'small'
             ? styles.smallFAB
             : styles.largeFAB,
@@ -140,6 +142,10 @@ const styles = StyleSheet.create({
     height: 48,
     paddingHorizontal: 16,
   },
+  smallExtendedLabel: {
+    height: 40,
+    paddingHorizontal: 12,
+  },
   disabled: {
     elevation: 0,
   },

diff --git a/src/FAB/__tests__/FAB.test.tsx b/src/FAB/__tests__/FAB.test.tsx
@@ -22,7 +22,7 @@ describe('FAB Component', () => {
     );
     expect(queryByText('test')).toBeTruthy();
     expect(wrapper.findAllByType(View)[1].props.style).toMatchObject({
-      height: 48,
+      height: 40,
     });
   });
 

diff --git a/src/FAB/__tests__/__snapshots__/FAB.test.tsx.snap b/src/FAB/__tests__/__snapshots__/FAB.test.tsx.snap
@@ -68,10 +68,10 @@ exports[`FAB Component should match snapshot 1`] = `
               "borderRadius": 3,
               "borderWidth": 0,
               "flexDirection": "row",
-              "height": 48,
+              "height": 40,
               "justifyContent": "center",
               "padding": 8,
-              "paddingHorizontal": 16,
+              "paddingHorizontal": 12,
             }
           }
         >