@pagopa/io-app-design-system 4.3.0 → 4.4.1

package/lib/commonjs/components/listitems/__test__/__snapshots__/listitem.test.tsx.snap

@@ -59,6 +59,9 @@ exports[`Test List Item Components - Experimental Enabled  ListItemAction Snapsh
             "flexDirection": "row",
             "justifyContent": "space-between",
           },
+          {
+            "columnGap": 12,
+          },
           {
             "transform": [
               {
@@ -79,7 +82,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemAction Snapsh
       >
         <Text
           allowFontScaling={true}
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -166,7 +169,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemIDP Snapshot
   >
     <Text
       allowFontScaling={true}
-      maxFontSizeMultiplier={1.25}
+      maxFontSizeMultiplier={1.5}
       style={
         [
           {
@@ -215,11 +218,16 @@ exports[`Test List Item Components - Experimental Enabled  ListItemInfo Snapshot
 >
   <View
     style={
-      {
-        "alignItems": "center",
-        "flexDirection": "row",
-        "justifyContent": "space-between",
-      }
+      [
+        {
+          "alignItems": "center",
+          "flexDirection": "row",
+          "justifyContent": "space-between",
+        },
+        {
+          "columnGap": 12,
+        },
+      ]
     }
   >
     <View
@@ -235,7 +243,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemInfo Snapshot
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="footnote"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -255,7 +263,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemInfo Snapshot
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           numberOfLines={2}
           style={
             [
@@ -338,6 +346,9 @@ exports[`Test List Item Components - Experimental Enabled  ListItemInfoCopy Snap
             "flexDirection": "row",
             "justifyContent": "space-between",
           },
+          {
+            "columnGap": 12,
+          },
           {
             "transform": [
               {
@@ -358,7 +369,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemInfoCopy Snap
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="footnote"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -378,7 +389,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemInfoCopy Snap
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           numberOfLines={2}
           style={
             [
@@ -397,74 +408,66 @@ exports[`Test List Item Components - Experimental Enabled  ListItemInfoCopy Snap
           testValue
         </Text>
       </View>
-      <View
+      <RNSVGSvgView
+        accessibilityElementsHidden={true}
+        accessibilityLabel=""
+        accessible={false}
+        align="xMidYMid"
+        bbHeight={24}
+        bbWidth={24}
+        focusable={false}
+        height={24}
+        importantForAccessibility="no-hide-descendants"
+        meetOrSlice={0}
+        minX={0}
+        minY={0}
         style={
-          {
-            "marginLeft": 12,
-          }
+          [
+            {
+              "backgroundColor": "transparent",
+              "borderWidth": 0,
+            },
+            {
+              "color": "#0B3EE3",
+            },
+            {
+              "flex": 0,
+              "height": 24,
+              "width": 24,
+            },
+          ]
         }
+        tintColor="#0B3EE3"
+        vbHeight={24}
+        vbWidth={24}
+        width={24}
       >
-        <RNSVGSvgView
-          accessibilityElementsHidden={true}
-          accessibilityLabel=""
-          accessible={false}
-          align="xMidYMid"
-          bbHeight={24}
-          bbWidth={24}
-          focusable={false}
-          height={24}
-          importantForAccessibility="no-hide-descendants"
-          meetOrSlice={0}
-          minX={0}
-          minY={0}
-          style={
-            [
-              {
-                "backgroundColor": "transparent",
-                "borderWidth": 0,
-              },
-              {
-                "color": "#0B3EE3",
-              },
-              {
-                "flex": 0,
-                "height": 24,
-                "width": 24,
-              },
-            ]
+        <RNSVGGroup
+          fill={
+            {
+              "payload": 4278190080,
+              "type": 0,
+            }
           }
-          tintColor="#0B3EE3"
-          vbHeight={24}
-          vbWidth={24}
-          width={24}
         >
-          <RNSVGGroup
+          <RNSVGPath
+            clipRule={0}
+            d="M12 18h8a2 2 0 0 0 2-2V9h-4a3 3 0 0 1-3-3V2h-3a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2Zm9.332-11.987a2 2 0 0 1 .603.987H18a1 1 0 0 1-1-1V2.227a2 2 0 0 1 .406.281l3.926 3.505ZM14 20h-2a4 4 0 0 1-4-4V6H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2Zm2 0h4a4 4 0 0 0 4-4V7.505a4 4 0 0 0-1.336-2.984l-3.926-3.505A4 4 0 0 0 16.074 0H12a4 4 0 0 0-4 4H4a4 4 0 0 0-4 4v12a4 4 0 0 0 4 4h8a4 4 0 0 0 4-4Z"
             fill={
               {
-                "payload": 4278190080,
-                "type": 0,
+                "type": 2,
               }
             }
-          >
-            <RNSVGPath
-              clipRule={0}
-              d="M12 18h8a2 2 0 0 0 2-2V9h-4a3 3 0 0 1-3-3V2h-3a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2Zm9.332-11.987a2 2 0 0 1 .603.987H18a1 1 0 0 1-1-1V2.227a2 2 0 0 1 .406.281l3.926 3.505ZM14 20h-2a4 4 0 0 1-4-4V6H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2Zm2 0h4a4 4 0 0 0 4-4V7.505a4 4 0 0 0-1.336-2.984l-3.926-3.505A4 4 0 0 0 16.074 0H12a4 4 0 0 0-4 4H4a4 4 0 0 0-4 4v12a4 4 0 0 0 4 4h8a4 4 0 0 0 4-4Z"
-              fill={
-                {
-                  "type": 2,
-                }
-              }
-              fillRule={0}
-              propList={
-                [
-                  "fill",
-                  "fillRule",
-                ]
-              }
-            />
-          </RNSVGGroup>
-        </RNSVGSvgView>
-      </View>
+            fillRule={0}
+            propList={
+              [
+                "fill",
+                "fillRule",
+              ]
+            }
+          />
+        </RNSVGGroup>
+      </RNSVGSvgView>
     </View>
   </View>
 </View>
@@ -527,6 +530,9 @@ exports[`Test List Item Components - Experimental Enabled  ListItemNav Snapshot
             "flexDirection": "row",
             "justifyContent": "space-between",
           },
+          {
+            "columnGap": 12,
+          },
           {
             "transform": [
               {
@@ -547,7 +553,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemNav Snapshot
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -689,6 +695,9 @@ exports[`Test List Item Components - Experimental Enabled  ListItemNavAlert Snap
             "flexDirection": "row",
             "justifyContent": "space-between",
           },
+          {
+            "columnGap": 12,
+          },
           {
             "transform": [
               {
@@ -699,74 +708,66 @@ exports[`Test List Item Components - Experimental Enabled  ListItemNavAlert Snap
         ]
       }
     >
-      <View
+      <RNSVGSvgView
+        accessibilityElementsHidden={true}
+        accessibilityLabel=""
+        accessible={false}
+        align="xMidYMid"
+        bbHeight={24}
+        bbWidth={24}
+        focusable={false}
+        height={24}
+        importantForAccessibility="no-hide-descendants"
+        meetOrSlice={0}
+        minX={0}
+        minY={0}
         style={
-          {
-            "marginRight": 12,
-          }
+          [
+            {
+              "backgroundColor": "transparent",
+              "borderWidth": 0,
+            },
+            {
+              "color": "#D13333",
+            },
+            {
+              "flex": 0,
+              "height": 24,
+              "width": 24,
+            },
+          ]
         }
+        tintColor="#D13333"
+        vbHeight={24}
+        vbWidth={24}
+        width={24}
       >
-        <RNSVGSvgView
-          accessibilityElementsHidden={true}
-          accessibilityLabel=""
-          accessible={false}
-          align="xMidYMid"
-          bbHeight={24}
-          bbWidth={24}
-          focusable={false}
-          height={24}
-          importantForAccessibility="no-hide-descendants"
-          meetOrSlice={0}
-          minX={0}
-          minY={0}
-          style={
-            [
-              {
-                "backgroundColor": "transparent",
-                "borderWidth": 0,
-              },
-              {
-                "color": "#D13333",
-              },
-              {
-                "flex": 0,
-                "height": 24,
-                "width": 24,
-              },
-            ]
+        <RNSVGGroup
+          fill={
+            {
+              "payload": 4278190080,
+              "type": 0,
+            }
           }
-          tintColor="#D13333"
-          vbHeight={24}
-          vbWidth={24}
-          width={24}
         >
-          <RNSVGGroup
+          <RNSVGPath
+            clipRule={0}
+            d="M7.00702 1c-.73494 0-1.41405.39209-1.78152 1.02856L.2756 11.0274c-.36747.6365-.36747 1.4206 0 2.0571l4.9499 8.8783c.36747.6365 1.04658 1.0286 1.78152 1.0286h9.94288c.7349 0 1.414-.3921 1.7815-1.0286l4.993-8.8783c.3675-.6365.3675-1.4206 0-2.0571l-4.993-8.99884C18.3639 1.39209 17.6848 1 16.9499 1H7.00702Zm5.02608 13.5549c.5676 0 1.0283-.4601 1.0283-1.0277V5.52583c0-.56758-.4601-1.02769-1.0277-1.02769-.5676 0-1.0282.46011-1.0282 1.02769v8.00137c0 .5676.4601 1.0277 1.0276 1.0277Zm0 1.9431c.8436 0 1.5275.6839 1.5275 1.5275 0 .8436-.6839 1.5275-1.5275 1.5275-.8436 0-1.5274-.6839-1.5274-1.5275 0-.8436.6838-1.5275 1.5274-1.5275Z"
             fill={
               {
-                "payload": 4278190080,
-                "type": 0,
+                "type": 2,
               }
             }
-          >
-            <RNSVGPath
-              clipRule={0}
-              d="M7.00702 1c-.73494 0-1.41405.39209-1.78152 1.02856L.2756 11.0274c-.36747.6365-.36747 1.4206 0 2.0571l4.9499 8.8783c.36747.6365 1.04658 1.0286 1.78152 1.0286h9.94288c.7349 0 1.414-.3921 1.7815-1.0286l4.993-8.8783c.3675-.6365.3675-1.4206 0-2.0571l-4.993-8.99884C18.3639 1.39209 17.6848 1 16.9499 1H7.00702Zm5.02608 13.5549c.5676 0 1.0283-.4601 1.0283-1.0277V5.52583c0-.56758-.4601-1.02769-1.0277-1.02769-.5676 0-1.0282.46011-1.0282 1.02769v8.00137c0 .5676.4601 1.0277 1.0276 1.0277Zm0 1.9431c.8436 0 1.5275.6839 1.5275 1.5275 0 .8436-.6839 1.5275-1.5275 1.5275-.8436 0-1.5274-.6839-1.5274-1.5275 0-.8436.6838-1.5275 1.5274-1.5275Z"
-              fill={
-                {
-                  "type": 2,
-                }
-              }
-              fillRule={0}
-              propList={
-                [
-                  "fill",
-                  "fillRule",
-                ]
-              }
-            />
-          </RNSVGGroup>
-        </RNSVGSvgView>
-      </View>
+            fillRule={0}
+            propList={
+              [
+                "fill",
+                "fillRule",
+              ]
+            }
+          />
+        </RNSVGGroup>
+      </RNSVGSvgView>
       <View
         style={
           {
@@ -777,7 +778,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemNavAlert Snap
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -795,74 +796,66 @@ exports[`Test List Item Components - Experimental Enabled  ListItemNavAlert Snap
           testValue
         </Text>
       </View>
-      <View
+      <RNSVGSvgView
+        accessibilityElementsHidden={true}
+        accessibilityLabel=""
+        accessible={false}
+        align="xMidYMid"
+        bbHeight={24}
+        bbWidth={24}
+        focusable={false}
+        height={24}
+        importantForAccessibility="no-hide-descendants"
+        meetOrSlice={0}
+        minX={0}
+        minY={0}
         style={
-          {
-            "marginLeft": 12,
-          }
+          [
+            {
+              "backgroundColor": "transparent",
+              "borderWidth": 0,
+            },
+            {
+              "color": "#0B3EE3",
+            },
+            {
+              "flex": 0,
+              "height": 24,
+              "width": 24,
+            },
+          ]
         }
+        tintColor="#0B3EE3"
+        vbHeight={24}
+        vbWidth={24}
+        width={24}
       >
-        <RNSVGSvgView
-          accessibilityElementsHidden={true}
-          accessibilityLabel=""
-          accessible={false}
-          align="xMidYMid"
-          bbHeight={24}
-          bbWidth={24}
-          focusable={false}
-          height={24}
-          importantForAccessibility="no-hide-descendants"
-          meetOrSlice={0}
-          minX={0}
-          minY={0}
-          style={
-            [
-              {
-                "backgroundColor": "transparent",
-                "borderWidth": 0,
-              },
-              {
-                "color": "#0B3EE3",
-              },
-              {
-                "flex": 0,
-                "height": 24,
-                "width": 24,
-              },
-            ]
+        <RNSVGGroup
+          fill={
+            {
+              "payload": 4278190080,
+              "type": 0,
+            }
           }
-          tintColor="#0B3EE3"
-          vbHeight={24}
-          vbWidth={24}
-          width={24}
         >
-          <RNSVGGroup
+          <RNSVGPath
+            clipRule={0}
+            d="M16.2929 5.29289c.3905-.39052 1.0237-.39052 1.4142 0l6 6.00001c.3905.3905.3905 1.0237 0 1.4142l-6 6c-.3905.3905-1.0237.3905-1.4142 0-.3905-.3905-.3905-1.0237 0-1.4142L21.5858 12l-5.2929-5.29289c-.3905-.39053-.3905-1.02369 0-1.41422Z"
             fill={
               {
-                "payload": 4278190080,
-                "type": 0,
+                "type": 2,
               }
             }
-          >
-            <RNSVGPath
-              clipRule={0}
-              d="M16.2929 5.29289c.3905-.39052 1.0237-.39052 1.4142 0l6 6.00001c.3905.3905.3905 1.0237 0 1.4142l-6 6c-.3905.3905-1.0237.3905-1.4142 0-.3905-.3905-.3905-1.0237 0-1.4142L21.5858 12l-5.2929-5.29289c-.3905-.39053-.3905-1.02369 0-1.41422Z"
-              fill={
-                {
-                  "type": 2,
-                }
-              }
-              fillRule={0}
-              propList={
-                [
-                  "fill",
-                  "fillRule",
-                ]
-              }
-            />
-          </RNSVGGroup>
-        </RNSVGSvgView>
-      </View>
+            fillRule={0}
+            propList={
+              [
+                "fill",
+                "fillRule",
+              ]
+            }
+          />
+        </RNSVGGroup>
+      </RNSVGSvgView>
     </View>
   </View>
 </View>
@@ -947,7 +940,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           numberOfLines={1}
           style={
             [
@@ -1035,7 +1028,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
           <Text
             allowFontScaling={true}
             dynamicTypeRamp="footnote"
-            maxFontSizeMultiplier={1.25}
+            maxFontSizeMultiplier={1.5}
             style={
               [
                 {},
@@ -1069,7 +1062,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -1128,12 +1121,14 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
             style={
               [
                 {
-                  "borderRadius": 12,
                   "borderWidth": 2,
-                  "height": 24,
                   "left": 0,
                   "position": "absolute",
                   "top": 0,
+                },
+                {
+                  "borderRadius": 12,
+                  "height": 24,
                   "width": 24,
                 },
                 {
@@ -1146,15 +1141,17 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
             style={
               [
                 {
-                  "borderRadius": 12,
-                  "height": 24,
                   "left": 0,
                   "position": "absolute",
                   "top": 0,
-                  "width": 24,
                 },
                 {
-                  "backgroundColor": "#0B3EE3",
+                  "borderRadius": 12,
+                  "height": 24,
+                  "width": 24,
+                },
+                {
+                  "backgroundColor": "#0B3EE3",
                 },
                 {
                   "opacity": 1,
@@ -1170,9 +1167,10 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
           <View>
             <RNSVGSvgView
               align="xMidYMid"
-              bbHeight="100%"
-              bbWidth="100%"
+              bbHeight={24}
+              bbWidth={24}
               focusable={false}
+              height={24}
               meetOrSlice={0}
               minX={0}
               minY={0}
@@ -1184,13 +1182,14 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
                   },
                   {
                     "flex": 0,
-                    "height": "100%",
-                    "width": "100%",
+                    "height": 24,
+                    "width": 24,
                   },
                 ]
               }
               vbHeight={24}
               vbWidth={24}
+              width={24}
             >
               <RNSVGGroup
                 fill={
@@ -1314,7 +1313,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           numberOfLines={1}
           style={
             [
@@ -1348,7 +1347,7 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
         <Text
           allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -1407,12 +1406,14 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
             style={
               [
                 {
-                  "borderRadius": 12,
                   "borderWidth": 2,
-                  "height": 24,
                   "left": 0,
                   "position": "absolute",
                   "top": 0,
+                },
+                {
+                  "borderRadius": 12,
+                  "height": 24,
                   "width": 24,
                 },
                 {
@@ -1425,11 +1426,13 @@ exports[`Test List Item Components - Experimental Enabled  ListItemRadioWithAmou
             style={
               [
                 {
-                  "borderRadius": 12,
-                  "height": 24,
                   "left": 0,
                   "position": "absolute",
                   "top": 0,
+                },
+                {
+                  "borderRadius": 12,
+                  "height": 24,
                   "width": 24,
                 },
                 {
@@ -1728,6 +1731,9 @@ exports[`Test List Item Components ListItemAction Snapshot 1`] = `
             "flexDirection": "row",
             "justifyContent": "space-between",
           },
+          {
+            "columnGap": 12,
+          },
           {
             "transform": [
               {
@@ -1747,8 +1753,8 @@ exports[`Test List Item Components ListItemAction Snapshot 1`] = `
         }
       >
         <Text
-          allowFontScaling={false}
-          maxFontSizeMultiplier={1.25}
+          allowFontScaling={true}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -1834,8 +1840,8 @@ exports[`Test List Item Components ListItemIDP Snapshot 1`] = `
     }
   >
     <Text
-      allowFontScaling={false}
-      maxFontSizeMultiplier={1.25}
+      allowFontScaling={true}
+      maxFontSizeMultiplier={1.5}
       style={
         [
           {
@@ -1884,11 +1890,16 @@ exports[`Test List Item Components ListItemInfo Snapshot 1`] = `
 >
   <View
     style={
-      {
-        "alignItems": "center",
-        "flexDirection": "row",
-        "justifyContent": "space-between",
-      }
+      [
+        {
+          "alignItems": "center",
+          "flexDirection": "row",
+          "justifyContent": "space-between",
+        },
+        {
+          "columnGap": 12,
+        },
+      ]
     }
   >
     <View
@@ -1902,9 +1913,9 @@ exports[`Test List Item Components ListItemInfo Snapshot 1`] = `
         accessible={true}
       >
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="footnote"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -1922,9 +1933,9 @@ exports[`Test List Item Components ListItemInfo Snapshot 1`] = `
           label
         </Text>
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           numberOfLines={2}
           style={
             [
@@ -2007,6 +2018,9 @@ exports[`Test List Item Components ListItemInfoCopy Snapshot 1`] = `
             "flexDirection": "row",
             "justifyContent": "space-between",
           },
+          {
+            "columnGap": 12,
+          },
           {
             "transform": [
               {
@@ -2025,9 +2039,9 @@ exports[`Test List Item Components ListItemInfoCopy Snapshot 1`] = `
         }
       >
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="footnote"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -2045,9 +2059,9 @@ exports[`Test List Item Components ListItemInfoCopy Snapshot 1`] = `
           label
         </Text>
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           numberOfLines={2}
           style={
             [
@@ -2066,74 +2080,66 @@ exports[`Test List Item Components ListItemInfoCopy Snapshot 1`] = `
           testValue
         </Text>
       </View>
-      <View
+      <RNSVGSvgView
+        accessibilityElementsHidden={true}
+        accessibilityLabel=""
+        accessible={false}
+        align="xMidYMid"
+        bbHeight={24}
+        bbWidth={24}
+        focusable={false}
+        height={24}
+        importantForAccessibility="no-hide-descendants"
+        meetOrSlice={0}
+        minX={0}
+        minY={0}
         style={
-          {
-            "marginLeft": 12,
-          }
+          [
+            {
+              "backgroundColor": "transparent",
+              "borderWidth": 0,
+            },
+            {
+              "color": "#0B3EE3",
+            },
+            {
+              "flex": 0,
+              "height": 24,
+              "width": 24,
+            },
+          ]
         }
+        tintColor="#0B3EE3"
+        vbHeight={24}
+        vbWidth={24}
+        width={24}
       >
-        <RNSVGSvgView
-          accessibilityElementsHidden={true}
-          accessibilityLabel=""
-          accessible={false}
-          align="xMidYMid"
-          bbHeight={24}
-          bbWidth={24}
-          focusable={false}
-          height={24}
-          importantForAccessibility="no-hide-descendants"
-          meetOrSlice={0}
-          minX={0}
-          minY={0}
-          style={
-            [
-              {
-                "backgroundColor": "transparent",
-                "borderWidth": 0,
-              },
-              {
-                "color": "#0B3EE3",
-              },
-              {
-                "flex": 0,
-                "height": 24,
-                "width": 24,
-              },
-            ]
+        <RNSVGGroup
+          fill={
+            {
+              "payload": 4278190080,
+              "type": 0,
+            }
           }
-          tintColor="#0B3EE3"
-          vbHeight={24}
-          vbWidth={24}
-          width={24}
         >
-          <RNSVGGroup
+          <RNSVGPath
+            clipRule={0}
+            d="M12 18h8a2 2 0 0 0 2-2V9h-4a3 3 0 0 1-3-3V2h-3a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2Zm9.332-11.987a2 2 0 0 1 .603.987H18a1 1 0 0 1-1-1V2.227a2 2 0 0 1 .406.281l3.926 3.505ZM14 20h-2a4 4 0 0 1-4-4V6H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2Zm2 0h4a4 4 0 0 0 4-4V7.505a4 4 0 0 0-1.336-2.984l-3.926-3.505A4 4 0 0 0 16.074 0H12a4 4 0 0 0-4 4H4a4 4 0 0 0-4 4v12a4 4 0 0 0 4 4h8a4 4 0 0 0 4-4Z"
             fill={
               {
-                "payload": 4278190080,
-                "type": 0,
+                "type": 2,
               }
             }
-          >
-            <RNSVGPath
-              clipRule={0}
-              d="M12 18h8a2 2 0 0 0 2-2V9h-4a3 3 0 0 1-3-3V2h-3a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2Zm9.332-11.987a2 2 0 0 1 .603.987H18a1 1 0 0 1-1-1V2.227a2 2 0 0 1 .406.281l3.926 3.505ZM14 20h-2a4 4 0 0 1-4-4V6H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2Zm2 0h4a4 4 0 0 0 4-4V7.505a4 4 0 0 0-1.336-2.984l-3.926-3.505A4 4 0 0 0 16.074 0H12a4 4 0 0 0-4 4H4a4 4 0 0 0-4 4v12a4 4 0 0 0 4 4h8a4 4 0 0 0 4-4Z"
-              fill={
-                {
-                  "type": 2,
-                }
-              }
-              fillRule={0}
-              propList={
-                [
-                  "fill",
-                  "fillRule",
-                ]
-              }
-            />
-          </RNSVGGroup>
-        </RNSVGSvgView>
-      </View>
+            fillRule={0}
+            propList={
+              [
+                "fill",
+                "fillRule",
+              ]
+            }
+          />
+        </RNSVGGroup>
+      </RNSVGSvgView>
     </View>
   </View>
 </View>
@@ -2196,6 +2202,9 @@ exports[`Test List Item Components ListItemNav Snapshot 1`] = `
             "flexDirection": "row",
             "justifyContent": "space-between",
           },
+          {
+            "columnGap": 12,
+          },
           {
             "transform": [
               {
@@ -2214,9 +2223,9 @@ exports[`Test List Item Components ListItemNav Snapshot 1`] = `
         }
       >
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -2358,6 +2367,9 @@ exports[`Test List Item Components ListItemNavAlert Snapshot 1`] = `
             "flexDirection": "row",
             "justifyContent": "space-between",
           },
+          {
+            "columnGap": 12,
+          },
           {
             "transform": [
               {
@@ -2368,74 +2380,66 @@ exports[`Test List Item Components ListItemNavAlert Snapshot 1`] = `
         ]
       }
     >
-      <View
+      <RNSVGSvgView
+        accessibilityElementsHidden={true}
+        accessibilityLabel=""
+        accessible={false}
+        align="xMidYMid"
+        bbHeight={24}
+        bbWidth={24}
+        focusable={false}
+        height={24}
+        importantForAccessibility="no-hide-descendants"
+        meetOrSlice={0}
+        minX={0}
+        minY={0}
         style={
-          {
-            "marginRight": 12,
-          }
+          [
+            {
+              "backgroundColor": "transparent",
+              "borderWidth": 0,
+            },
+            {
+              "color": "#D13333",
+            },
+            {
+              "flex": 0,
+              "height": 24,
+              "width": 24,
+            },
+          ]
         }
+        tintColor="#D13333"
+        vbHeight={24}
+        vbWidth={24}
+        width={24}
       >
-        <RNSVGSvgView
-          accessibilityElementsHidden={true}
-          accessibilityLabel=""
-          accessible={false}
-          align="xMidYMid"
-          bbHeight={24}
-          bbWidth={24}
-          focusable={false}
-          height={24}
-          importantForAccessibility="no-hide-descendants"
-          meetOrSlice={0}
-          minX={0}
-          minY={0}
-          style={
-            [
-              {
-                "backgroundColor": "transparent",
-                "borderWidth": 0,
-              },
-              {
-                "color": "#D13333",
-              },
-              {
-                "flex": 0,
-                "height": 24,
-                "width": 24,
-              },
-            ]
+        <RNSVGGroup
+          fill={
+            {
+              "payload": 4278190080,
+              "type": 0,
+            }
           }
-          tintColor="#D13333"
-          vbHeight={24}
-          vbWidth={24}
-          width={24}
         >
-          <RNSVGGroup
+          <RNSVGPath
+            clipRule={0}
+            d="M7.00702 1c-.73494 0-1.41405.39209-1.78152 1.02856L.2756 11.0274c-.36747.6365-.36747 1.4206 0 2.0571l4.9499 8.8783c.36747.6365 1.04658 1.0286 1.78152 1.0286h9.94288c.7349 0 1.414-.3921 1.7815-1.0286l4.993-8.8783c.3675-.6365.3675-1.4206 0-2.0571l-4.993-8.99884C18.3639 1.39209 17.6848 1 16.9499 1H7.00702Zm5.02608 13.5549c.5676 0 1.0283-.4601 1.0283-1.0277V5.52583c0-.56758-.4601-1.02769-1.0277-1.02769-.5676 0-1.0282.46011-1.0282 1.02769v8.00137c0 .5676.4601 1.0277 1.0276 1.0277Zm0 1.9431c.8436 0 1.5275.6839 1.5275 1.5275 0 .8436-.6839 1.5275-1.5275 1.5275-.8436 0-1.5274-.6839-1.5274-1.5275 0-.8436.6838-1.5275 1.5274-1.5275Z"
             fill={
               {
-                "payload": 4278190080,
-                "type": 0,
+                "type": 2,
               }
             }
-          >
-            <RNSVGPath
-              clipRule={0}
-              d="M7.00702 1c-.73494 0-1.41405.39209-1.78152 1.02856L.2756 11.0274c-.36747.6365-.36747 1.4206 0 2.0571l4.9499 8.8783c.36747.6365 1.04658 1.0286 1.78152 1.0286h9.94288c.7349 0 1.414-.3921 1.7815-1.0286l4.993-8.8783c.3675-.6365.3675-1.4206 0-2.0571l-4.993-8.99884C18.3639 1.39209 17.6848 1 16.9499 1H7.00702Zm5.02608 13.5549c.5676 0 1.0283-.4601 1.0283-1.0277V5.52583c0-.56758-.4601-1.02769-1.0277-1.02769-.5676 0-1.0282.46011-1.0282 1.02769v8.00137c0 .5676.4601 1.0277 1.0276 1.0277Zm0 1.9431c.8436 0 1.5275.6839 1.5275 1.5275 0 .8436-.6839 1.5275-1.5275 1.5275-.8436 0-1.5274-.6839-1.5274-1.5275 0-.8436.6838-1.5275 1.5274-1.5275Z"
-              fill={
-                {
-                  "type": 2,
-                }
-              }
-              fillRule={0}
-              propList={
-                [
-                  "fill",
-                  "fillRule",
-                ]
-              }
-            />
-          </RNSVGGroup>
-        </RNSVGSvgView>
-      </View>
+            fillRule={0}
+            propList={
+              [
+                "fill",
+                "fillRule",
+              ]
+            }
+          />
+        </RNSVGGroup>
+      </RNSVGSvgView>
       <View
         style={
           {
@@ -2444,9 +2448,9 @@ exports[`Test List Item Components ListItemNavAlert Snapshot 1`] = `
         }
       >
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -2464,74 +2468,66 @@ exports[`Test List Item Components ListItemNavAlert Snapshot 1`] = `
           testValue
         </Text>
       </View>
-      <View
+      <RNSVGSvgView
+        accessibilityElementsHidden={true}
+        accessibilityLabel=""
+        accessible={false}
+        align="xMidYMid"
+        bbHeight={24}
+        bbWidth={24}
+        focusable={false}
+        height={24}
+        importantForAccessibility="no-hide-descendants"
+        meetOrSlice={0}
+        minX={0}
+        minY={0}
         style={
-          {
-            "marginLeft": 12,
-          }
+          [
+            {
+              "backgroundColor": "transparent",
+              "borderWidth": 0,
+            },
+            {
+              "color": "#0073E6",
+            },
+            {
+              "flex": 0,
+              "height": 24,
+              "width": 24,
+            },
+          ]
         }
+        tintColor="#0073E6"
+        vbHeight={24}
+        vbWidth={24}
+        width={24}
       >
-        <RNSVGSvgView
-          accessibilityElementsHidden={true}
-          accessibilityLabel=""
-          accessible={false}
-          align="xMidYMid"
-          bbHeight={24}
-          bbWidth={24}
-          focusable={false}
-          height={24}
-          importantForAccessibility="no-hide-descendants"
-          meetOrSlice={0}
-          minX={0}
-          minY={0}
-          style={
-            [
-              {
-                "backgroundColor": "transparent",
-                "borderWidth": 0,
-              },
-              {
-                "color": "#0B3EE3",
-              },
-              {
-                "flex": 0,
-                "height": 24,
-                "width": 24,
-              },
-            ]
+        <RNSVGGroup
+          fill={
+            {
+              "payload": 4278190080,
+              "type": 0,
+            }
           }
-          tintColor="#0B3EE3"
-          vbHeight={24}
-          vbWidth={24}
-          width={24}
         >
-          <RNSVGGroup
+          <RNSVGPath
+            clipRule={0}
+            d="M16.2929 5.29289c.3905-.39052 1.0237-.39052 1.4142 0l6 6.00001c.3905.3905.3905 1.0237 0 1.4142l-6 6c-.3905.3905-1.0237.3905-1.4142 0-.3905-.3905-.3905-1.0237 0-1.4142L21.5858 12l-5.2929-5.29289c-.3905-.39053-.3905-1.02369 0-1.41422Z"
             fill={
               {
-                "payload": 4278190080,
-                "type": 0,
+                "type": 2,
               }
             }
-          >
-            <RNSVGPath
-              clipRule={0}
-              d="M16.2929 5.29289c.3905-.39052 1.0237-.39052 1.4142 0l6 6.00001c.3905.3905.3905 1.0237 0 1.4142l-6 6c-.3905.3905-1.0237.3905-1.4142 0-.3905-.3905-.3905-1.0237 0-1.4142L21.5858 12l-5.2929-5.29289c-.3905-.39053-.3905-1.02369 0-1.41422Z"
-              fill={
-                {
-                  "type": 2,
-                }
-              }
-              fillRule={0}
-              propList={
-                [
-                  "fill",
-                  "fillRule",
-                ]
-              }
-            />
-          </RNSVGGroup>
-        </RNSVGSvgView>
-      </View>
+            fillRule={0}
+            propList={
+              [
+                "fill",
+                "fillRule",
+              ]
+            }
+          />
+        </RNSVGGroup>
+      </RNSVGSvgView>
     </View>
   </View>
 </View>
@@ -2614,9 +2610,9 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 1`] = `
         }
       >
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           numberOfLines={1}
           style={
             [
@@ -2702,9 +2698,9 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 1`] = `
             </RNSVGGroup>
           </RNSVGSvgView>
           <Text
-            allowFontScaling={false}
+            allowFontScaling={true}
             dynamicTypeRamp="footnote"
-            maxFontSizeMultiplier={1.25}
+            maxFontSizeMultiplier={1.5}
             style={
               [
                 {},
@@ -2736,9 +2732,9 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 1`] = `
         }
       >
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -2797,12 +2793,14 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 1`] = `
             style={
               [
                 {
-                  "borderRadius": 12,
                   "borderWidth": 2,
-                  "height": 24,
                   "left": 0,
                   "position": "absolute",
                   "top": 0,
+                },
+                {
+                  "borderRadius": 12,
+                  "height": 24,
                   "width": 24,
                 },
                 {
@@ -2815,11 +2813,13 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 1`] = `
             style={
               [
                 {
-                  "borderRadius": 12,
-                  "height": 24,
                   "left": 0,
                   "position": "absolute",
                   "top": 0,
+                },
+                {
+                  "borderRadius": 12,
+                  "height": 24,
                   "width": 24,
                 },
                 {
@@ -2839,9 +2839,10 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 1`] = `
           <View>
             <RNSVGSvgView
               align="xMidYMid"
-              bbHeight="100%"
-              bbWidth="100%"
+              bbHeight={24}
+              bbWidth={24}
               focusable={false}
+              height={24}
               meetOrSlice={0}
               minX={0}
               minY={0}
@@ -2853,13 +2854,14 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 1`] = `
                   },
                   {
                     "flex": 0,
-                    "height": "100%",
-                    "width": "100%",
+                    "height": 24,
+                    "width": 24,
                   },
                 ]
               }
               vbHeight={24}
               vbWidth={24}
+              width={24}
             >
               <RNSVGGroup
                 fill={
@@ -2981,9 +2983,9 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 2`] = `
         }
       >
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           numberOfLines={1}
           style={
             [
@@ -3015,9 +3017,9 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 2`] = `
         }
       >
         <Text
-          allowFontScaling={false}
+          allowFontScaling={true}
           dynamicTypeRamp="headline"
-          maxFontSizeMultiplier={1.25}
+          maxFontSizeMultiplier={1.5}
           style={
             [
               {},
@@ -3076,12 +3078,14 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 2`] = `
             style={
               [
                 {
-                  "borderRadius": 12,
                   "borderWidth": 2,
-                  "height": 24,
                   "left": 0,
                   "position": "absolute",
                   "top": 0,
+                },
+                {
+                  "borderRadius": 12,
+                  "height": 24,
                   "width": 24,
                 },
                 {
@@ -3094,11 +3098,13 @@ exports[`Test List Item Components ListItemRadioWithAmount Snapshot 2`] = `
             style={
               [
                 {
-                  "borderRadius": 12,
-                  "height": 24,
                   "left": 0,
                   "position": "absolute",
                   "top": 0,
+                },
+                {
+                  "borderRadius": 12,
+                  "height": 24,
                   "width": 24,
                 },
                 {