From 1c4bd6813bc6f5151fd2d99a0245331ff5631c38 Mon Sep 17 00:00:00 2001 From: pedrobern Date: Wed, 2 Sep 2020 11:22:31 -0300 Subject: [PATCH] fix: add flex: 1 to DrawerItem style (#8701) # Summary In the [DrawerItem](https://github.com/react-navigation/react-navigation/blob/main/packages/drawer/src/views/DrawerItem.tsx), It's not possible to provide style for the [label wrapper](https://github.com/react-navigation/react-navigation/blob/main/packages/drawer/src/views/DrawerItem.tsx#L167), only for the label, so the label wrapper must at least be `flex: 1` in order to be more flexible for custom components, like in the pictures below. In the below examples, providing `flex: 1` inside the custom component view is not enough, because the wrapper does not grow. This PR will fix it. An alternative would be creating a new prop `labelStyleWrapper`, but I don't see any motivation for doing so, as this PR would fix it. ## Before ![before](https://user-images.githubusercontent.com/39778068/89813734-81b45a80-db18-11ea-8d53-0ddcfdbb04c1.jpeg) ## After ![after](https://user-images.githubusercontent.com/39778068/89813748-8711a500-db18-11ea-92b4-3db982c1eba5.jpeg) --- packages/drawer/src/views/DrawerItem.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/drawer/src/views/DrawerItem.tsx b/packages/drawer/src/views/DrawerItem.tsx index 52828063..a7fbaf95 100644 --- a/packages/drawer/src/views/DrawerItem.tsx +++ b/packages/drawer/src/views/DrawerItem.tsx @@ -205,6 +205,7 @@ const styles = StyleSheet.create({ }, label: { marginRight: 32, + flex: 1, }, button: { display: 'flex',