fix: list item flex properties (#4058)

lukewalczak · web-flow · commit cf7a0914bd7f · 2023-09-04T16:29:54.000+02:00
diff --git a/src/components/List/ListItem.tsx b/src/components/List/ListItem.tsx
@@ -270,7 +270,8 @@ const styles = StyleSheet.create({
     paddingLeft: 16,
   },
   content: {
-    flex: 1,
+    flexShrink: 1,
+    flexGrow: 1,
     justifyContent: 'center',
   },
 });
diff --git a/src/components/__tests__/__snapshots__/ListAccordion.test.tsx.snap b/src/components/__tests__/__snapshots__/ListAccordion.test.tsx.snap
@@ -219,7 +219,8 @@ exports[`renders expanded accordion 1`] = `
               "paddingLeft": 16,
             },
             {
-              "flex": 1,
+              "flexGrow": 1,
+              "flexShrink": 1,
               "justifyContent": "center",
             },
           ]
diff --git a/src/components/__tests__/__snapshots__/ListItem.test.tsx.snap b/src/components/__tests__/__snapshots__/ListItem.test.tsx.snap
@@ -60,7 +60,8 @@ exports[`renders list item with custom description 1`] = `
             "paddingLeft": 16,
           },
           {
-            "flex": 1,
+            "flexGrow": 1,
+            "flexShrink": 1,
             "justifyContent": "center",
           },
         ]
@@ -383,7 +384,8 @@ exports[`renders list item with custom title and description styles 1`] = `
             "paddingLeft": 16,
           },
           {
-            "flex": 1,
+            "flexGrow": 1,
+            "flexShrink": 1,
             "justifyContent": "center",
           },
         ]
@@ -524,7 +526,8 @@ exports[`renders list item with left and right items 1`] = `
             "paddingLeft": 16,
           },
           {
-            "flex": 1,
+            "flexGrow": 1,
+            "flexShrink": 1,
             "justifyContent": "center",
           },
         ]
@@ -765,7 +768,8 @@ exports[`renders list item with left item 1`] = `
             "paddingLeft": 16,
           },
           {
-            "flex": 1,
+            "flexGrow": 1,
+            "flexShrink": 1,
             "justifyContent": "center",
           },
         ]
@@ -867,7 +871,8 @@ exports[`renders list item with right item 1`] = `
             "paddingLeft": 16,
           },
           {
-            "flex": 1,
+            "flexGrow": 1,
+            "flexShrink": 1,
             "justifyContent": "center",
           },
         ]
@@ -972,7 +977,8 @@ exports[`renders list item with title and description 1`] = `
             "paddingLeft": 16,
           },
           {
-            "flex": 1,
+            "flexGrow": 1,
+            "flexShrink": 1,
             "justifyContent": "center",
           },
         ]
@@ -1106,7 +1112,8 @@ exports[`renders with a description with typeof number 1`] = `
             "paddingLeft": 16,
           },
           {
-            "flex": 1,
+            "flexGrow": 1,
+            "flexShrink": 1,
             "justifyContent": "center",
           },
         ]
diff --git a/src/components/__tests__/__snapshots__/ListSection.test.tsx.snap b/src/components/__tests__/__snapshots__/ListSection.test.tsx.snap
@@ -331,7 +331,8 @@ exports[`renders list section with custom title style 1`] = `
               "paddingLeft": 16,
             },
             {
-              "flex": 1,
+              "flexGrow": 1,
+              "flexShrink": 1,
               "justifyContent": "center",
             },
           ]
@@ -484,7 +485,8 @@ exports[`renders list section with custom title style 1`] = `
               "paddingLeft": 16,
             },
             {
-              "flex": 1,
+              "flexGrow": 1,
+              "flexShrink": 1,
               "justifyContent": "center",
             },
           ]
@@ -856,7 +858,8 @@ exports[`renders list section with subheader 1`] = `
               "paddingLeft": 16,
             },
             {
-              "flex": 1,
+              "flexGrow": 1,
+              "flexShrink": 1,
               "justifyContent": "center",
             },
           ]
@@ -1009,7 +1012,8 @@ exports[`renders list section with subheader 1`] = `
               "paddingLeft": 16,
             },
             {
-              "flex": 1,
+              "flexGrow": 1,
+              "flexShrink": 1,
               "justifyContent": "center",
             },
           ]
@@ -1341,7 +1345,8 @@ exports[`renders list section without subheader 1`] = `
               "paddingLeft": 16,
             },
             {
-              "flex": 1,
+              "flexGrow": 1,
+              "flexShrink": 1,
               "justifyContent": "center",
             },
           ]
@@ -1494,7 +1499,8 @@ exports[`renders list section without subheader 1`] = `
               "paddingLeft": 16,
             },
             {
-              "flex": 1,
+              "flexGrow": 1,
+              "flexShrink": 1,
               "justifyContent": "center",
             },
           ]

Original file line number	Diff line number	Diff line change
@@ -219,7 +219,8 @@ exports[`renders expanded accordion 1`] = `
`219`	`219`	`"paddingLeft": 16,`
`220`	`220`	`},`
`221`	`221`	`{`
`222`		`- "flex": 1,`
	`222`	`+ "flexGrow": 1,`
	`223`	`+ "flexShrink": 1,`
`223`	`224`	`"justifyContent": "center",`
`224`	`225`	`},`
`225`	`226`	`]`
Original file line number	Diff line number	Diff line change
@@ -60,7 +60,8 @@ exports[`renders list item with custom description 1`] = `
`60`	`60`	`"paddingLeft": 16,`
`61`	`61`	`},`
`62`	`62`	`{`
`63`		`- "flex": 1,`
	`63`	`+ "flexGrow": 1,`
	`64`	`+ "flexShrink": 1,`
`64`	`65`	`"justifyContent": "center",`
`65`	`66`	`},`
`66`	`67`	`]`
@@ -383,7 +384,8 @@ exports[`renders list item with custom title and description styles 1`] = `
`383`	`384`	`"paddingLeft": 16,`
`384`	`385`	`},`
`385`	`386`	`{`
`386`		`- "flex": 1,`
	`387`	`+ "flexGrow": 1,`
	`388`	`+ "flexShrink": 1,`
`387`	`389`	`"justifyContent": "center",`
`388`	`390`	`},`
`389`	`391`	`]`
@@ -524,7 +526,8 @@ exports[`renders list item with left and right items 1`] = `
`524`	`526`	`"paddingLeft": 16,`
`525`	`527`	`},`
`526`	`528`	`{`
`527`		`- "flex": 1,`
	`529`	`+ "flexGrow": 1,`
	`530`	`+ "flexShrink": 1,`
`528`	`531`	`"justifyContent": "center",`
`529`	`532`	`},`
`530`	`533`	`]`
@@ -765,7 +768,8 @@ exports[`renders list item with left item 1`] = `
`765`	`768`	`"paddingLeft": 16,`
`766`	`769`	`},`
`767`	`770`	`{`
`768`		`- "flex": 1,`
	`771`	`+ "flexGrow": 1,`
	`772`	`+ "flexShrink": 1,`
`769`	`773`	`"justifyContent": "center",`
`770`	`774`	`},`
`771`	`775`	`]`
@@ -867,7 +871,8 @@ exports[`renders list item with right item 1`] = `
`867`	`871`	`"paddingLeft": 16,`
`868`	`872`	`},`
`869`	`873`	`{`
`870`		`- "flex": 1,`
	`874`	`+ "flexGrow": 1,`
	`875`	`+ "flexShrink": 1,`
`871`	`876`	`"justifyContent": "center",`
`872`	`877`	`},`
`873`	`878`	`]`
@@ -972,7 +977,8 @@ exports[`renders list item with title and description 1`] = `
`972`	`977`	`"paddingLeft": 16,`
`973`	`978`	`},`
`974`	`979`	`{`
`975`		`- "flex": 1,`
	`980`	`+ "flexGrow": 1,`
	`981`	`+ "flexShrink": 1,`
`976`	`982`	`"justifyContent": "center",`
`977`	`983`	`},`
`978`	`984`	`]`
@@ -1106,7 +1112,8 @@ exports[`renders with a description with typeof number 1`] = `
`1106`	`1112`	`"paddingLeft": 16,`
`1107`	`1113`	`},`
`1108`	`1114`	`{`
`1109`		`- "flex": 1,`
	`1115`	`+ "flexGrow": 1,`
	`1116`	`+ "flexShrink": 1,`
`1110`	`1117`	`"justifyContent": "center",`
`1111`	`1118`	`},`
`1112`	`1119`	`]`
Original file line number	Diff line number	Diff line change
@@ -331,7 +331,8 @@ exports[`renders list section with custom title style 1`] = `
`331`	`331`	`"paddingLeft": 16,`
`332`	`332`	`},`
`333`	`333`	`{`
`334`		`- "flex": 1,`
	`334`	`+ "flexGrow": 1,`
	`335`	`+ "flexShrink": 1,`
`335`	`336`	`"justifyContent": "center",`
`336`	`337`	`},`
`337`	`338`	`]`
@@ -484,7 +485,8 @@ exports[`renders list section with custom title style 1`] = `
`484`	`485`	`"paddingLeft": 16,`
`485`	`486`	`},`
`486`	`487`	`{`
`487`		`- "flex": 1,`
	`488`	`+ "flexGrow": 1,`
	`489`	`+ "flexShrink": 1,`
`488`	`490`	`"justifyContent": "center",`
`489`	`491`	`},`
`490`	`492`	`]`
@@ -856,7 +858,8 @@ exports[`renders list section with subheader 1`] = `
`856`	`858`	`"paddingLeft": 16,`
`857`	`859`	`},`
`858`	`860`	`{`
`859`		`- "flex": 1,`
	`861`	`+ "flexGrow": 1,`
	`862`	`+ "flexShrink": 1,`
`860`	`863`	`"justifyContent": "center",`
`861`	`864`	`},`
`862`	`865`	`]`
@@ -1009,7 +1012,8 @@ exports[`renders list section with subheader 1`] = `
`1009`	`1012`	`"paddingLeft": 16,`
`1010`	`1013`	`},`
`1011`	`1014`	`{`
`1012`		`- "flex": 1,`
	`1015`	`+ "flexGrow": 1,`
	`1016`	`+ "flexShrink": 1,`
`1013`	`1017`	`"justifyContent": "center",`
`1014`	`1018`	`},`
`1015`	`1019`	`]`
@@ -1341,7 +1345,8 @@ exports[`renders list section without subheader 1`] = `
`1341`	`1345`	`"paddingLeft": 16,`
`1342`	`1346`	`},`
`1343`	`1347`	`{`
`1344`		`- "flex": 1,`
	`1348`	`+ "flexGrow": 1,`
	`1349`	`+ "flexShrink": 1,`
`1345`	`1350`	`"justifyContent": "center",`
`1346`	`1351`	`},`
`1347`	`1352`	`]`
@@ -1494,7 +1499,8 @@ exports[`renders list section without subheader 1`] = `
`1494`	`1499`	`"paddingLeft": 16,`
`1495`	`1500`	`},`
`1496`	`1501`	`{`
`1497`		`- "flex": 1,`
	`1502`	`+ "flexGrow": 1,`
	`1503`	`+ "flexShrink": 1,`
`1498`	`1504`	`"justifyContent": "center",`
`1499`	`1505`	`},`
`1500`	`1506`	`]`