@pagopa/io-app-design-system 5.6.7 → 5.7.1

package/src/components/avatar/Avatar.tsx

@@ -1,12 +1,12 @@
 import React, { ComponentProps, useRef, useState } from "react";
 import { Image, ImageSourcePropType, StyleSheet, View } from "react-native";
 import { Icon } from "../../components/icons";
+import { useIOTheme } from "../../context";
 import {
   IOColors,
   IOSpacingScale,
   IOVisualCostants,
-  hexToRgba,
-  useIOTheme
+  hexToRgba
 } from "../../core";
 import { addCacheTimestampToUri } from "../../utils/image";
 import avatarSearchPlaceholder from "./placeholder/avatar-placeholder.png";

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

@@ -1,229 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Test Avatar Components - Experimental Enabled Avatar Snapshot 1`] = `
-<View
-  accessibilityIgnoresInvertColors={true}
-  style={
-    [
-      {
-        "borderColor": "rgba(14,15,19,0.1)",
-        "borderCurve": "continuous",
-        "borderWidth": 1,
-        "overflow": "hidden",
-      },
-      {
-        "backgroundColor": "#FFFFFF",
-        "borderRadius": 8,
-        "height": 44,
-        "padding": 6,
-        "width": 44,
-      },
-    ]
-  }
->
-  <View
-    style={
-      [
-        {
-          "backgroundColor": "#FFFFFF",
-          "borderCurve": "continuous",
-          "overflow": "hidden",
-        },
-        {
-          "borderRadius": 2,
-        },
-      ]
-    }
-  >
-    <Image
-      accessibilityIgnoresInvertColors={true}
-      onError={[Function]}
-      source={
-        {
-          "uri": "",
-        }
-      }
-      style={
-        {
-          "height": "100%",
-          "resizeMode": "contain",
-          "width": "100%",
-        }
-      }
-    />
-  </View>
-</View>
-`;
+exports[`Test Avatar Components - Experimental Enabled Avatar Snapshot 1`] = `null`;
 
-exports[`Test Avatar Components - Experimental Enabled AvatarSearch Snapshot 1`] = `
-<View
-  accessibilityIgnoresInvertColors={true}
-  style={
-    [
-      {
-        "borderColor": "rgba(14,15,19,0.1)",
-        "borderCurve": "continuous",
-        "borderWidth": 1,
-        "overflow": "hidden",
-      },
-      {
-        "backgroundColor": "#FFFFFF",
-        "borderRadius": 8,
-        "height": 44,
-        "padding": 6,
-        "width": 44,
-      },
-    ]
-  }
->
-  <View
-    style={
-      [
-        {
-          "backgroundColor": "#FFFFFF",
-          "borderCurve": "continuous",
-          "overflow": "hidden",
-        },
-        {
-          "borderRadius": 2,
-        },
-      ]
-    }
-  >
-    <Image
-      accessibilityIgnoresInvertColors={true}
-      defaultSource={
-        {
-          "testUri": "../../../src/components/avatar/placeholder/avatar-placeholder.png",
-        }
-      }
-      source={
-        {
-          "uri": "",
-        }
-      }
-      style={
-        {
-          "height": "100%",
-          "resizeMode": "contain",
-          "width": "100%",
-        }
-      }
-    />
-  </View>
-</View>
-`;
+exports[`Test Avatar Components - Experimental Enabled AvatarSearch Snapshot 1`] = `null`;
 
-exports[`Test Avatar Components Avatar Snapshot 1`] = `
-<View
-  accessibilityIgnoresInvertColors={true}
-  style={
-    [
-      {
-        "borderColor": "rgba(14,15,19,0.1)",
-        "borderCurve": "continuous",
-        "borderWidth": 1,
-        "overflow": "hidden",
-      },
-      {
-        "backgroundColor": "#FFFFFF",
-        "borderRadius": 8,
-        "height": 44,
-        "padding": 6,
-        "width": 44,
-      },
-    ]
-  }
->
-  <View
-    style={
-      [
-        {
-          "backgroundColor": "#FFFFFF",
-          "borderCurve": "continuous",
-          "overflow": "hidden",
-        },
-        {
-          "borderRadius": 2,
-        },
-      ]
-    }
-  >
-    <Image
-      accessibilityIgnoresInvertColors={true}
-      onError={[Function]}
-      source={
-        {
-          "uri": "",
-        }
-      }
-      style={
-        {
-          "height": "100%",
-          "resizeMode": "contain",
-          "width": "100%",
-        }
-      }
-    />
-  </View>
-</View>
-`;
+exports[`Test Avatar Components Avatar Snapshot 1`] = `null`;
 
-exports[`Test Avatar Components AvatarSearch Snapshot 1`] = `
-<View
-  accessibilityIgnoresInvertColors={true}
-  style={
-    [
-      {
-        "borderColor": "rgba(14,15,19,0.1)",
-        "borderCurve": "continuous",
-        "borderWidth": 1,
-        "overflow": "hidden",
-      },
-      {
-        "backgroundColor": "#FFFFFF",
-        "borderRadius": 8,
-        "height": 44,
-        "padding": 6,
-        "width": 44,
-      },
-    ]
-  }
->
-  <View
-    style={
-      [
-        {
-          "backgroundColor": "#FFFFFF",
-          "borderCurve": "continuous",
-          "overflow": "hidden",
-        },
-        {
-          "borderRadius": 2,
-        },
-      ]
-    }
-  >
-    <Image
-      accessibilityIgnoresInvertColors={true}
-      defaultSource={
-        {
-          "testUri": "../../../src/components/avatar/placeholder/avatar-placeholder.png",
-        }
-      }
-      source={
-        {
-          "uri": "",
-        }
-      }
-      style={
-        {
-          "height": "100%",
-          "resizeMode": "contain",
-          "width": "100%",
-        }
-      }
-    />
-  </View>
-</View>
-`;
+exports[`Test Avatar Components AvatarSearch Snapshot 1`] = `null`;

package/src/components/badge/Badge.tsx

@@ -6,14 +6,13 @@ import {
   View,
   ViewStyle
 } from "react-native";
+import { useIONewTypeface, useIOThemeContext } from "../../context";
 import {
   hexToRgba,
   IOBadgeHSpacing,
   IOBadgeRadius,
   IOBadgeVSpacing,
-  IOColors,
-  useIONewTypeface,
-  useIOThemeContext
+  IOColors
 } from "../../core";
 import { useIOFontDynamicScale } from "../../utils/accessibility";
 import { WithTestID } from "../../utils/types";

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

@@ -1,105 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Test Badge Components - Experimental Enabled Badge Snapshot 1`] = `
-<View
-  accessible={true}
-  style={
-    [
-      {
-        "alignItems": "center",
-        "borderCurve": "continuous",
-        "flexDirection": "row",
-        "justifyContent": "center",
-      },
-      {
-        "borderRadius": 24,
-        "paddingHorizontal": 8,
-        "paddingVertical": 4,
-      },
-      {
-        "backgroundColor": "#E7ECFC",
-      },
-    ]
-  }
->
-  <Text
-    allowFontScaling={true}
-    ellipsizeMode="tail"
-    maxFontSizeMultiplier={1.5}
-    numberOfLines={1}
-    style={
-      [
-        {},
-        {
-          "color": "#031344",
-          "fontFamily": "Titillio",
-          "fontSize": 12,
-          "fontStyle": "normal",
-          "fontWeight": "600",
-          "lineHeight": 16,
-        },
-        {
-          "alignSelf": "center",
-          "flexShrink": 1,
-          "letterSpacing": 0.5,
-          "textTransform": "uppercase",
-        },
-      ]
-    }
-  >
-    text
-  </Text>
-</View>
-`;
+exports[`Test Badge Components - Experimental Enabled Badge Snapshot 1`] = `null`;
 
-exports[`Test Badge Components Badge Snapshot 1`] = `
-<View
-  accessible={true}
-  style={
-    [
-      {
-        "alignItems": "center",
-        "borderCurve": "continuous",
-        "flexDirection": "row",
-        "justifyContent": "center",
-      },
-      {
-        "borderRadius": 24,
-        "paddingHorizontal": 8,
-        "paddingVertical": 4,
-      },
-      {
-        "backgroundColor": "#E7ECFC",
-      },
-    ]
-  }
->
-  <Text
-    allowFontScaling={true}
-    ellipsizeMode="tail"
-    maxFontSizeMultiplier={1.5}
-    numberOfLines={1}
-    style={
-      [
-        {},
-        {
-          "color": "#031344",
-          "fontFamily": "Titillio",
-          "fontSize": 12,
-          "fontStyle": "normal",
-          "fontWeight": "600",
-          "lineHeight": 16,
-        },
-        {
-          "alignSelf": "center",
-          "flexShrink": 1,
-          "letterSpacing": 0.5,
-          "textTransform": "uppercase",
-        },
-      ]
-    }
-  >
-    text
-  </Text>
-</View>
-`;
+exports[`Test Badge Components Badge Snapshot 1`] = `null`;

package/src/components/banner/Banner.tsx

@@ -8,13 +8,8 @@ import {
   ViewStyle
 } from "react-native";
 import Animated from "react-native-reanimated";
-import {
-  IOBannerBigSpacing,
-  IOBannerRadius,
-  useIONewTypeface,
-  useIOTheme,
-  useIOThemeContext
-} from "../../core";
+import { useIONewTypeface, useIOTheme, useIOThemeContext } from "../../context";
+import { IOBannerBigSpacing, IOBannerRadius } from "../../core";
 import { hexToRgba, IOColors } from "../../core/IOColors";
 import { useScaleAnimation } from "../../hooks";
 import { WithTestID } from "../../utils/types";
@@ -58,7 +53,7 @@ const styles = StyleSheet.create({
 type BaseBannerProps = WithTestID<{
   color: "neutral" | "turquoise";
   pictogramName: IOPictogramsBleed;
-  viewRef?: React.RefObject<View>;
+  viewRef?: React.RefObject<View | null>;
   // A11y related props
   accessibilityLabel?: string;
   accessibilityHint?: string;

package/src/components/banner/BannerErrorState.tsx

@@ -8,14 +8,9 @@ import {
   ViewStyle
 } from "react-native";
 import Animated, { FadeIn, FadeOut } from "react-native-reanimated";
-import {
-  hexToRgba,
-  IOBannerBigSpacing,
-  IOBannerRadius,
-  IOColors,
-  useIOTheme,
-  useIOThemeContext
-} from "../../core";
+import { useIOTheme, useIOThemeContext } from "../../context";
+import { IOBannerBigSpacing, IOBannerRadius } from "../../core";
+import { hexToRgba, IOColors } from "../../core/IOColors";
 import { WithTestID } from "../../utils/types";
 import { Icon, IOIcons } from "../icons";
 import { useScaleAnimation } from "../../hooks";