@pagopa/io-app-design-system 1.18.0 → 1.20.0

package/src/components/banner/__test__/__snapshots__/banner.test.tsx.snap

@@ -1,5 +1,320 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Test Banner Components - Experimental Enabled Banner Snapshot 1`] = `
+<View
+  accessibilityState={
+    {
+      "busy": undefined,
+      "checked": undefined,
+      "disabled": undefined,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
+    }
+  }
+  accessible={false}
+  collapsable={false}
+  focusable={true}
+  onBlur={[Function]}
+  onClick={[Function]}
+  onFocus={[Function]}
+  onResponderGrant={[Function]}
+  onResponderMove={[Function]}
+  onResponderRelease={[Function]}
+  onResponderTerminate={[Function]}
+  onResponderTerminationRequest={[Function]}
+  onStartShouldSetResponder={[Function]}
+>
+  <View
+    style={
+      [
+        {
+          "alignContent": "center",
+          "alignItems": "flex-start",
+          "borderRadius": 8,
+          "flexDirection": "row",
+        },
+        {
+          "backgroundColor": "#F4F5F8",
+          "paddingHorizontal": 16,
+          "paddingVertical": 16,
+        },
+        {
+          "transform": [
+            {
+              "scale": undefined,
+            },
+          ],
+        },
+      ]
+    }
+  >
+    <View
+      accessibilityRole="button"
+      accessible={true}
+      style={
+        [
+          {
+            "flex": 1,
+          },
+          {
+            "alignSelf": "center",
+          },
+        ]
+      }
+    >
+      <Text
+        allowFontScaling={false}
+        color="blueIO-850"
+        defaultColor="black"
+        defaultWeight="Regular"
+        font="ReadexPro"
+        fontStyle={
+          {
+            "fontSize": 16,
+            "lineHeight": 24,
+          }
+        }
+        style={
+          [
+            {
+              "fontSize": 16,
+              "lineHeight": 24,
+            },
+            {
+              "color": "#031344",
+              "fontFamily": "Readex Pro",
+              "fontStyle": "normal",
+              "fontWeight": "400",
+            },
+          ]
+        }
+        weight="Regular"
+      >
+        Banner title
+      </Text>
+      <View
+        style={
+          {
+            "height": 4,
+          }
+        }
+      />
+      <View
+        pointerEvents="none"
+      >
+        <View
+          style={
+            {
+              "height": 4,
+            }
+          }
+        />
+        <View
+          accessibilityRole="button"
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": false,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
+          accessibilityValue={
+            {
+              "max": undefined,
+              "min": undefined,
+              "now": undefined,
+              "text": undefined,
+            }
+          }
+          accessible={true}
+          collapsable={false}
+          focusable={true}
+          hitSlop={
+            {
+              "bottom": 14,
+              "left": 24,
+              "right": 24,
+              "top": 14,
+            }
+          }
+          onBlur={[Function]}
+          onClick={[Function]}
+          onFocus={[Function]}
+          onResponderGrant={[Function]}
+          onResponderMove={[Function]}
+          onResponderRelease={[Function]}
+          onResponderTerminate={[Function]}
+          onResponderTerminationRequest={[Function]}
+          onStartShouldSetResponder={[Function]}
+          onTouchEnd={[Function]}
+          style={
+            {
+              "alignSelf": "flex-start",
+            }
+          }
+        >
+          <View
+            style={
+              [
+                {
+                  "alignItems": "center",
+                  "elevation": 0,
+                  "flexDirection": "row",
+                  "justifyContent": "center",
+                  "textAlignVertical": "center",
+                },
+                false,
+                {},
+                {
+                  "transform": [
+                    {
+                      "scale": undefined,
+                    },
+                  ],
+                },
+              ]
+            }
+          >
+            <Text
+              allowFontScaling={true}
+              ellipsizeMode="tail"
+              maxFontSizeMultiplier={1.3}
+              numberOfLines={1}
+              style={
+                [
+                  {
+                    "fontFamily": "Readex Pro",
+                    "fontSize": 16,
+                    "fontStyle": "normal",
+                    "fontWeight": "400",
+                  },
+                  {
+                    "color": "#0B3EE3",
+                  },
+                  {
+                    "color": undefined,
+                  },
+                ]
+              }
+            >
+              Action text
+            </Text>
+          </View>
+        </View>
+      </View>
+    </View>
+    <View
+      style={
+        [
+          {
+            "marginRight": -16,
+          },
+          {
+            "alignSelf": "center",
+          },
+        ]
+      }
+    >
+      <RNSVGSvgView
+        align="xMidYMid"
+        bbHeight={80}
+        bbWidth={80}
+        color={4278240714}
+        focusable={false}
+        height={80}
+        meetOrSlice={0}
+        minX={0}
+        minY={0}
+        style={
+          [
+            {
+              "backgroundColor": "transparent",
+              "borderWidth": 0,
+            },
+            {
+              "flex": 0,
+              "height": 80,
+              "width": 80,
+            },
+          ]
+        }
+        tintColor={4278240714}
+        vbHeight={240}
+        vbWidth={240}
+        width={80}
+      >
+        <RNSVGGroup>
+          <RNSVGPath
+            d="M133.46 173.8c-2.88 0-5.61-1.57-7.03-4.28-1.01-1.92-1.2-4.11-.53-6.18.66-2.04 2.07-3.69 3.98-4.64 6.87-3.44 17.93-6.91 24.11-8.73-2.58-2.4-4.34-6.01-4.32-9.54 0-2.68 1.14-9.19 11.43-11.65 16.11-3.86 78.12 18.71 80.75 19.67l-1.37 3.76c-.16-.06-16.14-5.89-33.81-11.18-29.21-8.75-40.4-9.37-44.64-8.36-5.38 1.29-8.35 4.05-8.36 7.77-.01 3.88 3.08 7.55 5.86 8.23.88.22 1.51 1.01 1.52 1.92 0 .91-.6 1.71-1.48 1.95-.18.05-18.53 5.04-27.9 9.73-.94.47-1.64 1.28-1.96 2.29-.33 1.03-.24 2.13.27 3.09.96 1.83 3.13 2.61 5.04 1.82 9.17-3.8 21.12-8.32 26.15-8.25l-.06 4h-.08c-3.38 0-12.29 2.89-24.47 7.94-1.01.42-2.05.62-3.08.62l-.02.02Z"
+            fill={4278927075}
+            propList={
+              [
+                "fill",
+              ]
+            }
+          />
+          <RNSVGPath
+            d="M137.37 190.23c-3.78 0-7.45-2.01-9.39-5.54-2.16-3.92-1.62-8.82 1.33-12.19l1.47-1.68 3.01 2.63-1.47 1.68c-1.84 2.11-2.18 5.17-.83 7.63 1.76 3.21 5.81 4.41 9.02 2.67 12.01-6.5 20.08-9.56 23.94-9.11l-.47 3.97c-2.88-.34-10.93 2.9-21.57 8.66-1.6.87-3.33 1.28-5.04 1.28Z"
+            fill={4278927075}
+            propList={
+              [
+                "fill",
+              ]
+            }
+          />
+          <RNSVGPath
+            d="M240.29 213.7c-39.81-19.17-81.44-13.87-92.88-10.51-2.82.83-5.84.2-8.1-1.68-2.34-1.95-3.52-5.04-3.07-8.05l.77-5.2 3.96.59-.77 5.2c-.25 1.64.4 3.33 1.67 4.39 1.23 1.03 2.88 1.37 4.41.92 11.83-3.48 54.81-8.97 95.75 10.74l-1.73 3.6h-.01ZM169.508 150.199l-.698 3.939 10.348 1.834.698-3.939-10.348-1.834Z"
+            fill={4278927075}
+            propList={
+              [
+                "fill",
+              ]
+            }
+          />
+          <RNSVGPath
+            d="M191.07 170.8c-10.44-5.97-15.77-22.75-15.99-23.46l3.82-1.19c.05.16 5.09 15.99 14.16 21.18l-1.99 3.47ZM163.258 156.644l-3.982.38 2.844 29.854 3.982-.379-2.844-29.855Z"
+            fill={4278927075}
+            propList={
+              [
+                "fill",
+              ]
+            }
+          />
+          <RNSVGPath
+            d="M133.75 39.82c-4.15-4.68-9.41-8.27-15.31-10.44-5.9-2.18-12.26-2.88-18.5099-2.03-3.78.51-7.45 1.58-10.89 3.15-4.49 2.05-7.86 5.81-10.65 9.88l-3.1 4.53c-3.74-2.62-7.92-4.57-12.35-5.72-4.86-1.26-9.92-1.56-14.89-.88-4.97.68-9.77 2.33-14.1 4.86-4.33 2.52-8.13 5.87-11.16 9.85-3.04 3.98-5.25 8.52-6.53 13.35-1.28 4.83-1.59 9.87-.91 14.81.68 4.95 2.34 9.71 4.87 14.02 2.53 4.31 5.9 8.08 9.89 11.09L103.6 145.21l26.72-45.64 10.54-20.04c1.85-4.42 3.76-12.92 1.34-23.34-1.41-6.07-4.32-11.7-8.47-16.38l.02.01Z"
+            fill={4289392367}
+            propList={
+              [
+                "fill",
+              ]
+            }
+          />
+          <RNSVGPath
+            d="M25.2295 81.79c-.79 0-1.45-.62-1.5-1.42-1.37-25.26 18.17-33.75 28.7-34.71.83-.08 1.55.53 1.63 1.36.08.83-.53 1.55-1.35 1.63-1.12.11-27.54 2.92-25.98 31.56.04.83-.59 1.53-1.42 1.58h-.08Z"
+            fill={4278240714}
+            propList={
+              [
+                "fill",
+              ]
+            }
+          />
+        </RNSVGGroup>
+      </RNSVGSvgView>
+    </View>
+  </View>
+</View>
+`;
+
 exports[`Test Banner Components Banner Snapshot 1`] = `
 <View
   accessibilityState={

package/src/components/banner/__test__/banner.test.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import { Alert, View } from "react-native";
 import * as TestRenderer from "react-test-renderer";
+import { TestRendererWithExperimentalEnabledContextProvider } from "../../../utils/testing";
 import { Banner } from "../Banner";
 
 const viewRef = React.createRef<View>();
@@ -24,3 +25,20 @@ describe("Test Banner Components", () => {
     expect(advice).toMatchSnapshot();
   });
 });
+
+describe("Test Banner Components - Experimental Enabled", () => {
+  it("Banner Snapshot", () => {
+    const advice = TestRendererWithExperimentalEnabledContextProvider(
+      <Banner
+        viewRef={viewRef}
+        color="neutral"
+        size="big"
+        title="Banner title"
+        pictogramName="charity"
+        action="Action text"
+        onPress={onLinkPress}
+      />
+    ).toJSON();
+    expect(advice).toMatchSnapshot();
+  });
+});