@pagopa/io-app-design-system 5.3.9 → 5.4.0

package/src/components/numberpad/__test__/__snapshots__/NumberPad.test.tsx.snap

@@ -19,17 +19,12 @@ exports[`NumberPad Should match the snapshot 1`] = `
   >
     <View
       style={
-        [
-          {
-            "flexDirection": "row",
-            "justifyContent": "space-between",
-          },
-          {
-            "alignItems": "center",
-            "flexGrow": 1,
-            "justifyContent": "space-between",
-          },
-        ]
+        {
+          "alignItems": "center",
+          "flexDirection": "row",
+          "flexGrow": 1,
+          "justifyContent": "space-between",
+        }
       }
     >
       <View
@@ -69,11 +64,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -152,11 +145,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -235,11 +226,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -284,17 +273,12 @@ exports[`NumberPad Should match the snapshot 1`] = `
     </View>
     <View
       style={
-        [
-          {
-            "flexDirection": "row",
-            "justifyContent": "space-between",
-          },
-          {
-            "alignItems": "center",
-            "flexGrow": 1,
-            "justifyContent": "space-between",
-          },
-        ]
+        {
+          "alignItems": "center",
+          "flexDirection": "row",
+          "flexGrow": 1,
+          "justifyContent": "space-between",
+        }
       }
     >
       <View
@@ -334,11 +318,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -417,11 +399,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -500,11 +480,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -549,17 +527,12 @@ exports[`NumberPad Should match the snapshot 1`] = `
     </View>
     <View
       style={
-        [
-          {
-            "flexDirection": "row",
-            "justifyContent": "space-between",
-          },
-          {
-            "alignItems": "center",
-            "flexGrow": 1,
-            "justifyContent": "space-between",
-          },
-        ]
+        {
+          "alignItems": "center",
+          "flexDirection": "row",
+          "flexGrow": 1,
+          "justifyContent": "space-between",
+        }
       }
     >
       <View
@@ -599,11 +572,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -682,11 +653,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -765,11 +734,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -814,17 +781,12 @@ exports[`NumberPad Should match the snapshot 1`] = `
     </View>
     <View
       style={
-        [
-          {
-            "flexDirection": "row",
-            "justifyContent": "space-between",
-          },
-          {
-            "alignItems": "center",
-            "flexGrow": 1,
-            "justifyContent": "space-between",
-          },
-        ]
+        {
+          "alignItems": "center",
+          "flexDirection": "row",
+          "flexGrow": 1,
+          "justifyContent": "space-between",
+        }
       }
     >
       <View
@@ -836,8 +798,6 @@ exports[`NumberPad Should match the snapshot 1`] = `
             },
             {
               "alignItems": "center",
-            },
-            {
               "justifyContent": "center",
             },
           ]
@@ -907,6 +867,7 @@ exports[`NumberPad Should match the snapshot 1`] = `
               align="xMidYMid"
               bbHeight={24}
               bbWidth={24}
+              color="#FFFFFF"
               focusable={false}
               height={24}
               importantForAccessibility="no-hide-descendants"
@@ -919,9 +880,6 @@ exports[`NumberPad Should match the snapshot 1`] = `
                     "backgroundColor": "transparent",
                     "borderWidth": 0,
                   },
-                  {
-                    "color": "#FFFFFF",
-                  },
                   {
                     "flex": 0,
                     "height": 24,
@@ -934,7 +892,6 @@ exports[`NumberPad Should match the snapshot 1`] = `
               width={24}
             >
               <RNSVGGroup
-                color="#FFFFFF"
                 fill={
                   {
                     "payload": 4278190080,
@@ -1000,11 +957,9 @@ exports[`NumberPad Should match the snapshot 1`] = `
             [
               {
                 "alignItems": "center",
+                "borderRadius": 28,
                 "justifyContent": "center",
               },
-              {
-                "borderRadius": 100,
-              },
               {
                 "height": 56,
                 "width": 56,
@@ -1055,8 +1010,6 @@ exports[`NumberPad Should match the snapshot 1`] = `
             },
             {
               "alignItems": "center",
-            },
-            {
               "justifyContent": "center",
             },
           ]
@@ -1126,6 +1079,7 @@ exports[`NumberPad Should match the snapshot 1`] = `
               align="xMidYMid"
               bbHeight={24}
               bbWidth={24}
+              color="#FFFFFF"
               focusable={false}
               height={24}
               importantForAccessibility="no-hide-descendants"
@@ -1138,9 +1092,6 @@ exports[`NumberPad Should match the snapshot 1`] = `
                     "backgroundColor": "transparent",
                     "borderWidth": 0,
                   },
-                  {
-                    "color": "#FFFFFF",
-                  },
                   {
                     "flex": 0,
                     "height": 24,
@@ -1153,7 +1104,6 @@ exports[`NumberPad Should match the snapshot 1`] = `
               width={24}
             >
               <RNSVGGroup
-                color="#FFFFFF"
                 fill={
                   {
                     "payload": 4278190080,

package/src/components/typography/IOText.tsx

@@ -7,6 +7,7 @@ import {
   TextStyle,
   View
 } from "react-native";
+import Animated from "react-native-reanimated";
 import { IOColors, useIOTheme } from "../../core";
 import { useBoldTextEnabled } from "../../utils/accessibility";
 import {
@@ -154,3 +155,5 @@ export const IOText = forwardRef<View, IOTextProps>(
     );
   }
 );
+
+export const AnimatedIOText = Animated.createAnimatedComponent(IOText);

package/src/core/IOStyles.ts

@@ -113,12 +113,11 @@ export const buttonSolidHeight: number = btnSizeDefault;
 // TODO: Replace the number type with the new IOIconSizeScale
 export const iconBtnSizeSmall: number = 24;
 
-export const numberPadBtnSize: number = 56;
-
 export const IOButtonStyles = StyleSheet.create({
   /* BaseButton, used in the:
   ButtonSolid, ButtonOutline
   */
+  /* DELETE THIS, ONCE WE REMOVE `ButtonSolid`, `ButtonOutline` COMPONENTS */
   button: {
     flexDirection: "row",
     alignItems: "center",
@@ -194,22 +193,6 @@ export const IOIconButtonStyles = StyleSheet.create({
   }
 });
 
-export const IONumberPadButtonStyles = StyleSheet.create({
-  /* IconButton */
-  button: {
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  circularShape: {
-    // Circular shape
-    borderRadius: 100
-  },
-  buttonSize: {
-    width: numberPadBtnSize,
-    height: numberPadBtnSize
-  }
-});
-
 /**
  * LIST ITEM STYLES
  */