Repository: callstack/react-native-paper
Pull request #1321 (2019-09-01 15:48:26)

feat: button labelStyle
Resolve: #1165, Resolve: #1273  and partialy #1317 

I've added optional labelStyle prop to button.

### Motivation
Currently, we are not able to change button text style to for example make it bold or change the font size

<img width="366" alt="Screenshot 2019-09-01 at 17 34 43" src="https://user-images.githubusercontent.com/3886886/64078852-6de55f00-cce0-11e9-9e5b-301071d80a95.png">



callstack-bot: Hey @pan-pawel, thank you for your pull request 🤗. The documentation from this branch can be viewed [here](https://12558-71323749-gh.circle-artifacts.com/0/docs/index.html).

Patch:
diff --git a/example/src/Examples/ButtonExample.tsx b/example/src/Examples/ButtonExample.tsx
index 0ce4d7d12..4b0d98cd3 100644
--- a/example/src/Examples/ButtonExample.tsx
+++ b/example/src/Examples/ButtonExample.tsx
@@ -80,6 +80,17 @@ class ButtonExample extends React.Component<Props, State> {
             >
               Loading
             </Button>
+            <Button
+              mode="outlined"
+              onPress={() => {}}
+              style={styles.button}
+              labelStyle={{
+                fontWeight: '800',
+                fontSize: 18,
+              }}
+            >
+              Custom Font
+            </Button>
           </View>
         </List.Section>
         <List.Section title="Contained button">
diff --git a/src/components/Button.tsx b/src/components/Button.tsx
index 3770c3abc..218b270ea 100644
--- a/src/components/Button.tsx
+++ b/src/components/Button.tsx
@@ -1,5 +1,12 @@
 import * as React from 'react';
-import { Animated, View, ViewStyle, StyleSheet, StyleProp } from 'react-native';
+import {
+  Animated,
+  View,
+  ViewStyle,
+  StyleSheet,
+  StyleProp,
+  TextStyle,
+} from 'react-native';
 import color from 'color';
 
 import ActivityIndicator from './ActivityIndicator';
@@ -66,6 +73,10 @@ type Props = React.ComponentProps<typeof Surface> & {
    */
   contentStyle?: StyleProp<ViewStyle>;
   style?: StyleProp<ViewStyle>;
+  /**
+   * Style for the button text.
+   */
+  labelStyle?: StyleProp<TextStyle>;
   /**
    * @optional
    */
@@ -152,6 +163,7 @@ class Button extends React.Component<Props, State> {
       style,
       theme,
       contentStyle,
+      labelStyle,
       ...rest
     } = this.props;
     const { colors, roundness } = theme;
@@ -271,6 +283,7 @@ class Button extends React.Component<Props, State> {
                 uppercase && styles.uppercaseLabel,
                 textStyle,
                 font,
+                labelStyle,
               ]}
             >
               {children}


Test patch:
diff --git a/src/components/__tests__/__snapshots__/Banner.test.js.snap b/src/components/__tests__/__snapshots__/Banner.test.js.snap
index fb100ea8f..4c2a17d79 100644
--- a/src/components/__tests__/__snapshots__/Banner.test.js.snap
+++ b/src/components/__tests__/__snapshots__/Banner.test.js.snap
@@ -279,6 +279,7 @@ exports[`renders visible banner, with action buttons and with image 1`] = `
                         "fontFamily": "System",
                         "fontWeight": "500",
                       },
+                      undefined,
                     ],
                   ]
                 }
@@ -455,6 +456,7 @@ exports[`renders visible banner, with action buttons and without image 1`] = `
                         "fontFamily": "System",
                         "fontWeight": "500",
                       },
+                      undefined,
                     ],
                   ]
                 }
@@ -545,6 +547,7 @@ exports[`renders visible banner, with action buttons and without image 1`] = `
                         "fontFamily": "System",
                         "fontWeight": "500",
                       },
+                      undefined,
                     ],
                   ]
                 }
diff --git a/src/components/__tests__/__snapshots__/Button.test.js.snap b/src/components/__tests__/__snapshots__/Button.test.js.snap
index 82e5f5a16..2296f0751 100644
--- a/src/components/__tests__/__snapshots__/Button.test.js.snap
+++ b/src/components/__tests__/__snapshots__/Button.test.js.snap
@@ -79,6 +79,7 @@ exports[`renders button with color 1`] = `
                 "fontFamily": "System",
                 "fontWeight": "500",
               },
+              undefined,
             ],
           ]
         }
@@ -213,6 +214,7 @@ exports[`renders button with icon 1`] = `
                 "fontFamily": "System",
                 "fontWeight": "500",
               },
+              undefined,
             ],
           ]
         }
@@ -310,6 +312,7 @@ exports[`renders contained contained with mode 1`] = `
                 "fontFamily": "System",
                 "fontWeight": "500",
               },
+              undefined,
             ],
           ]
         }
@@ -404,6 +407,7 @@ exports[`renders disabled button 1`] = `
                 "fontFamily": "System",
                 "fontWeight": "500",
               },
+              undefined,
             ],
           ]
         }
@@ -677,6 +681,7 @@ exports[`renders loading button 1`] = `
                 "fontFamily": "System",
                 "fontWeight": "500",
               },
+              undefined,
             ],
           ]
         }
@@ -767,6 +772,7 @@ exports[`renders outlined button with mode 1`] = `
                 "fontFamily": "System",
                 "fontWeight": "500",
               },
+              undefined,
             ],
           ]
         }
@@ -857,6 +863,7 @@ exports[`renders text button by default 1`] = `
                 "fontFamily": "System",
                 "fontWeight": "500",
               },
+              undefined,
             ],
           ]
         }
@@ -947,6 +954,7 @@ exports[`renders text button with mode 1`] = `
                 "fontFamily": "System",
                 "fontWeight": "500",
               },
+              undefined,
             ],
           ]
         }
diff --git a/src/components/__tests__/__snapshots__/Menu.test.js.snap b/src/components/__tests__/__snapshots__/Menu.test.js.snap
index b09e5280c..df2ae0511 100644
--- a/src/components/__tests__/__snapshots__/Menu.test.js.snap
+++ b/src/components/__tests__/__snapshots__/Menu.test.js.snap
@@ -82,6 +82,7 @@ exports[`renders menu with content styles 1`] = `
                   "fontFamily": "System",
                   "fontWeight": "500",
                 },
+                undefined,
               ],
             ]
           }
@@ -176,6 +177,7 @@ exports[`renders not visible menu 1`] = `
                   "fontFamily": "System",
                   "fontWeight": "500",
                 },
+                undefined,
               ],
             ]
           }
@@ -270,6 +272,7 @@ exports[`renders visible menu 1`] = `
                   "fontFamily": "System",
                   "fontWeight": "500",
                 },
+                undefined,
               ],
             ]
           }
diff --git a/src/components/__tests__/__snapshots__/Snackbar.test.js.snap b/src/components/__tests__/__snapshots__/Snackbar.test.js.snap
index 986c5f641..11951c3a0 100644
--- a/src/components/__tests__/__snapshots__/Snackbar.test.js.snap
+++ b/src/components/__tests__/__snapshots__/Snackbar.test.js.snap
@@ -224,6 +224,7 @@ exports[`renders snackbar with action button 1`] = `
                     "fontFamily": "System",
                     "fontWeight": "500",
                   },
+                  undefined,
                 ],
               ]
             }