@pagopa/io-app-design-system 4.5.5 → 4.6.0

package/lib/typescript/components/typography/H2.d.ts

@@ -14,6 +14,6 @@ export declare const H2: React.ForwardRefExoticComponent<Omit<IOTextProps, "styl
     textStyle?: import("./IOText").IOTextStyle | undefined;
     style?: import("./IOText").IOTextStyle | undefined;
 } & {
-    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
+    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-300" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
 } & React.RefAttributes<View>>;
 //# sourceMappingURL=H2.d.ts.map

package/lib/typescript/components/typography/H3.d.ts

@@ -11,7 +11,7 @@ export declare const H3: React.ForwardRefExoticComponent<Omit<IOTextProps, "styl
     textStyle?: import("./IOText").IOTextStyle | undefined;
     style?: import("./IOText").IOTextStyle | undefined;
 } & {
-    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
+    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-300" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
 } & {
     weight?: "Semibold" | "Bold" | undefined;
 } & React.RefAttributes<View>>;

package/lib/typescript/components/typography/H4.d.ts

@@ -11,6 +11,6 @@ export declare const H4: React.ForwardRefExoticComponent<Omit<IOTextProps, "styl
     textStyle?: import("./IOText").IOTextStyle | undefined;
     style?: import("./IOText").IOTextStyle | undefined;
 } & {
-    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
+    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-300" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
 } & React.RefAttributes<View>>;
 //# sourceMappingURL=H4.d.ts.map

package/lib/typescript/components/typography/H5.d.ts

@@ -11,6 +11,6 @@ export declare const H5: React.ForwardRefExoticComponent<Omit<IOTextProps, "styl
     textStyle?: import("./IOText").IOTextStyle | undefined;
     style?: import("./IOText").IOTextStyle | undefined;
 } & {
-    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
+    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-300" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
 } & React.RefAttributes<View>>;
 //# sourceMappingURL=H5.d.ts.map

package/lib/typescript/components/typography/H6.d.ts

@@ -11,6 +11,6 @@ export declare const H6: React.ForwardRefExoticComponent<Omit<IOTextProps, "styl
     textStyle?: import("./IOText").IOTextStyle | undefined;
     style?: import("./IOText").IOTextStyle | undefined;
 } & {
-    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
+    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-300" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
 } & React.RefAttributes<View>>;
 //# sourceMappingURL=H6.d.ts.map

package/lib/typescript/components/typography/Hero.d.ts

@@ -11,6 +11,6 @@ export declare const Hero: React.ForwardRefExoticComponent<Omit<IOTextProps, "st
     textStyle?: import("./IOText").IOTextStyle | undefined;
     style?: import("./IOText").IOTextStyle | undefined;
 } & {
-    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
+    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-300" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
 } & React.RefAttributes<View>>;
 //# sourceMappingURL=Hero.d.ts.map

package/lib/typescript/components/typography/markdown/MdH1.d.ts

@@ -8,6 +8,6 @@ export declare const MdH1: React.ForwardRefExoticComponent<Omit<IOTextProps, "st
     textStyle?: import("../IOText").IOTextStyle | undefined;
     style?: import("../IOText").IOTextStyle | undefined;
 } & {
-    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
+    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-300" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
 } & React.RefAttributes<View>>;
 //# sourceMappingURL=MdH1.d.ts.map

package/lib/typescript/components/typography/markdown/MdH1.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MdH1.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/markdown/MdH1.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmC,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,OAAO,EAAU,WAAW,EAAyB,MAAM,WAAW,CAAC;AAEvE;;GAEG;AAEH,eAAO,MAAM,IAAI;;;;;8BAoBhB,CAAC"}
+{"version":3,"file":"MdH1.d.ts","sourceRoot":"","sources":["../../../../../src/components/typography/markdown/MdH1.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmC,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,OAAO,EAAU,WAAW,EAAyB,MAAM,WAAW,CAAC;AAEvE;;GAEG;AACH,eAAO,MAAM,IAAI;;;;;8BAoBhB,CAAC"}

package/lib/typescript/components/typography/markdown/MdH2.d.ts

@@ -8,6 +8,6 @@ export declare const MdH2: React.ForwardRefExoticComponent<Omit<IOTextProps, "st
     textStyle?: import("../IOText").IOTextStyle | undefined;
     style?: import("../IOText").IOTextStyle | undefined;
 } & {
-    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
+    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-300" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
 } & React.RefAttributes<View>>;
 //# sourceMappingURL=MdH2.d.ts.map

package/lib/typescript/components/typography/markdown/MdH3.d.ts

@@ -8,6 +8,6 @@ export declare const MdH3: React.ForwardRefExoticComponent<Omit<IOTextProps, "st
     textStyle?: import("../IOText").IOTextStyle | undefined;
     style?: import("../IOText").IOTextStyle | undefined;
 } & {
-    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
+    color?: "white" | "grey-50" | "grey-100" | "grey-200" | "grey-300" | "grey-450" | "grey-650" | "grey-700" | "grey-850" | "black" | "blueIO-850" | "blueIO-600" | "blueIO-500" | "blueIO-400" | "blueIO-300" | "blueIO-200" | "blueIO-150" | "blueIO-100" | "blueIO-50" | "hanPurple-850" | "hanPurple-500" | "hanPurple-250" | "hanPurple-100" | "hanPurple-50" | "turquoise-850" | "turquoise-500" | "turquoise-450" | "turquoise-300" | "turquoise-150" | "turquoise-100" | "turquoise-50" | "error-850" | "error-600" | "error-500" | "error-400" | "error-100" | "warning-850" | "warning-700" | "warning-500" | "warning-400" | "warning-100" | "success-850" | "success-700" | "success-500" | "success-400" | "success-100" | "info-850" | "info-700" | "info-500" | "info-400" | "info-100" | "blueItalia-850" | "blueItalia-600" | "blueItalia-500" | "blueItalia-100" | "blueItalia-50" | "blue-600" | "blue-500" | "blue-50" | undefined;
 } & React.RefAttributes<View>>;
 //# sourceMappingURL=MdH3.d.ts.map

package/lib/typescript/core/IOColors.d.ts

@@ -16,6 +16,7 @@ export declare const IOColors: {
     "blueIO-600": string;
     "blueIO-500": string;
     "blueIO-400": string;
+    "blueIO-300": string;
     "blueIO-200": string;
     "blueIO-150": string;
     "blueIO-100": string;
@@ -104,6 +105,8 @@ export declare const IOColorsTints: {
     "blueIO-850": string;
     "blueIO-600": string;
     "blueIO-500": string;
+    "blueIO-400": string;
+    "blueIO-300": string;
     "blueIO-200": string;
     "blueIO-150": string;
     "blueIO-100": string;
@@ -149,7 +152,7 @@ export declare const IOColorsExtra: {
     "blueItalia-50": string;
 };
 export type IOColorsExtra = keyof typeof IOColorsExtra;
-declare const themeKeys: readonly ["appBackground-primary", "appBackground-secondary", "appBackground-tertiary", "appBackground-accent", "interactiveElem-default", "interactiveElem-pressed", "interactiveElem-disabled", "interactiveOutline-disabled", "neutralButton-default", "neutralButton-pressed", "neutralButton-disabled", "buttonText-default", "buttonText-disabled", "listItem-pressed", "textHeading-default", "textHeading-secondary", "textHeading-tertiary", "textBody-default", "textBody-secondary", "textBody-tertiary", "cardBorder-default", "textInputBorder-default", "icon-default", "icon-decorative", "textInputBorder-default", "textInputLabel-default", "textInputValue-default", "textInputValue-disabled", "divider-header", "divider-default", "divider-bottomBar", "pdfViewer-background", "tab-item-border-default", "tab-item-foreground-default", "tab-item-foreground-selected", "tab-item-background-selected", "errorIcon", "errorText", "successIcon", "successText", "warningIcon", "infoIcon", "pictogram-hands", "pictogram-tint-main", "pictogram-tint-secondary", "pictogram-tint-tertiary"];
+declare const themeKeys: readonly ["appBackground-primary", "appBackground-secondary", "appBackground-tertiary", "appBackground-accent", "interactiveElem-default", "interactiveElem-pressed", "interactiveElem-disabled", "interactiveOutline-disabled", "neutralButton-default", "neutralButton-pressed", "neutralButton-disabled", "buttonText-default", "buttonText-danger", "buttonText-disabled", "listItem-pressed", "textHeading-default", "textHeading-secondary", "textHeading-tertiary", "textBody-default", "textBody-secondary", "textBody-tertiary", "cardBorder-default", "textInputBorder-default", "icon-default", "icon-decorative", "textInputBorder-default", "textInputLabel-default", "textInputValue-default", "textInputValue-disabled", "switch-background-off", "switch-background-on", "switch-thumb-color", "selection-border-off", "selection-background-on", "selection-tick", "divider-header", "divider-default", "divider-bottomBar", "pdfViewer-background", "tab-item-border-default", "tab-item-foreground-default", "tab-item-foreground-selected", "tab-item-background-selected", "errorIcon", "errorText", "successIcon", "successText", "warningIcon", "infoIcon", "pictogram-hands", "pictogram-tint-main", "pictogram-tint-secondary", "pictogram-tint-tertiary"];
 export type IOTheme = {
     [K in (typeof themeKeys)[number]]: IOColors;
 };

package/lib/typescript/core/IOColors.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IOColors.d.ts","sourceRoot":"","sources":["../../../src/core/IOColors.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,KAAK,cAAc,MAAM,8BAA8B,CAAC;AAyB/D,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DnB,CAAC;AAEH,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,QAAQ,CAAC;AAE7C,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;CAgB3B,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,MAAM,OAAO,gBAAgB,CAAC;AAE7D,eAAO,MAAM,sBAAsB,eACrB,gBAAgB,KAC3B,eAAe,qBAAqB,CAAC,CAAC,QAAQ,CAGhD,CAAC;AAYF,eAAO,MAAM,cAAc;;;;CAI1B,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,cAAc,CAAC;AAExD,eAAO,MAAM,eAAe;;;;;;;;;;;CAW1B,CAAC;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,eAAe,CAAC;AAE3D,eAAO,MAAM,aAAa;;;;;;;;;;;;;;CAcxB,CAAC;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,aAAa,CAAC;AAEvD,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;CAqBzB,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,cAAc,CAAC;AAEzD,MAAM,MAAM,wBAAwB,GAAG,OAAO,CAC5C,cAAc,EACd,WAAW,GAAG,aAAa,GAAG,UAAU,GAAG,aAAa,CACzD,CAAC;AACF,MAAM,MAAM,wBAAwB,GAAG,OAAO,CAC5C,cAAc,EACd,WAAW,GAAG,aAAa,GAAG,UAAU,GAAG,aAAa,CACzD,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;CAMzB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,aAAa,CAAC;AAMvD,QAAA,MAAM,SAAS,ojCAwDL,CAAC;AAEX,MAAM,MAAM,OAAO,GAAG;KACnB,CAAC,IAAI,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,CAAC,GAAG,QAAQ;CAC5C,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,OAsD1B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,OAKhC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,OAoDzB,CAAC;AAEF,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;CAiBrC,CAAC;AAEH,MAAM,MAAM,0BAA0B,GACpC,MAAM,OAAO,0BAA0B,CAAC;AAE1C,eAAO,MAAM,yBAAyB,EAAE,MAAM,CAC5C,WAAW,CAAC,0BAA0B,CAAC,EACvC,cAAc,CAkBf,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,MAAM,OAAO,yBAAyB,CAAC;AAM/E;;;;GAIG;AAEH,eAAO,MAAM,SAAS,YAAa,UAAU,YAAW,MAAM,WAQ7D,CAAC"}
+{"version":3,"file":"IOColors.d.ts","sourceRoot":"","sources":["../../../src/core/IOColors.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,KAAK,cAAc,MAAM,8BAA8B,CAAC;AAyB/D,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6DnB,CAAC;AAEH,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,QAAQ,CAAC;AAE7C,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;CAgB3B,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,MAAM,OAAO,gBAAgB,CAAC;AAE7D,eAAO,MAAM,sBAAsB,eACrB,gBAAgB,KAC3B,eAAe,qBAAqB,CAAC,CAAC,QAAQ,CAGhD,CAAC;AAYF,eAAO,MAAM,cAAc;;;;CAI1B,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,cAAc,CAAC;AAExD,eAAO,MAAM,eAAe;;;;;;;;;;;CAW1B,CAAC;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,eAAe,CAAC;AAE3D,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;CAgBxB,CAAC;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,aAAa,CAAC;AAEvD,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;CAqBzB,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,cAAc,CAAC;AAEzD,MAAM,MAAM,wBAAwB,GAAG,OAAO,CAC5C,cAAc,EACd,WAAW,GAAG,aAAa,GAAG,UAAU,GAAG,aAAa,CACzD,CAAC;AACF,MAAM,MAAM,wBAAwB,GAAG,OAAO,CAC5C,cAAc,EACd,WAAW,GAAG,aAAa,GAAG,UAAU,GAAG,aAAa,CACzD,CAAC;AAEF,eAAO,MAAM,aAAa;;;;;;CAMzB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,aAAa,CAAC;AAMvD,QAAA,MAAM,SAAS,qtCAgEL,CAAC;AAEX,MAAM,MAAM,OAAO,GAAG;KACnB,CAAC,IAAI,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,CAAC,GAAG,QAAQ;CAC5C,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,OA8D1B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,OAMhC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,OA4DzB,CAAC;AAEF,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;CAiBrC,CAAC;AAEH,MAAM,MAAM,0BAA0B,GACpC,MAAM,OAAO,0BAA0B,CAAC;AAE1C,eAAO,MAAM,yBAAyB,EAAE,MAAM,CAC5C,WAAW,CAAC,0BAA0B,CAAC,EACvC,cAAc,CAkBf,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,MAAM,OAAO,yBAAyB,CAAC;AAM/E;;;;GAIG;AAEH,eAAO,MAAM,SAAS,YAAa,UAAU,YAAW,MAAM,WAQ7D,CAAC"}

package/lib/typescript/core/IOStyles.d.ts

@@ -212,25 +212,12 @@ export declare const IOModuleStyles: {
 interface IOSelectionTickVisualParams {
     size: IOIconSizeScale;
     borderWidth: number;
-    borderColorOffState: IOColors;
-    bgColorOnState: IOColors;
-    tickColor: IOColors;
-}
-interface IOSwitchVisualParams {
-    width: number;
-    height: number;
-    bgColorOffState: IOColors;
-    bgColorOnState: IOColors;
-    tickColor: IOColors;
-    bgCircle: IOColors;
-    padding: number;
 }
 interface IOSelectionTickLegacyVisualParams {
     borderColorOffState: IOColors;
     bgColorOnState: IOColors;
 }
 export declare const IOSelectionTickVisualParams: IOSelectionTickVisualParams;
-export declare const IOSwitchVisualParams: IOSwitchVisualParams;
 export declare const IOSelectionTickLegacyVisualParams: IOSelectionTickLegacyVisualParams;
 interface IOSelectionListItemVisualParams {
     paddingVertical: IOSpacingScale;

package/lib/typescript/core/IOStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IOStyles.d.ts","sourceRoot":"","sources":["../../../src/core/IOStyles.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"IOStyles.d.ts","sourceRoot":"","sources":["../../../src/core/IOStyles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,OAAO,EACL,WAAW,EAGX,QAAQ,EACR,cAAc,EACf,MAAM,aAAa,CAAC;AAErB;;GAEG;AAEH,UAAU,gBAAgB;IACxB,gBAAgB,EAAE,WAAW,CAAC;IAE9B,YAAY,EAAE,MAAM,CAAC;IAErB,eAAe,EAAE,MAAM,CAAC;IACxB,gBAAgB,EAAE,MAAM,CAAC;IACzB,qBAAqB,EAAE,MAAM,CAAC;IAC9B,sBAAsB,EAAE,MAAM,CAAC;IAC/B,wBAAwB,EAAE,MAAM,CAAC;IACjC,qBAAqB,EAAE,MAAM,CAAC;IAC9B,sBAAsB,EAAE,MAAM,CAAC;IAC/B,UAAU,EAAE,cAAc,CAAC;CAC5B;AAED,eAAO,MAAM,gBAAgB,EAAE,gBAW9B,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDnB,CAAC;AAeH,eAAO,MAAM,iBAAiB,EAAE,MAAuB,CAAC;AAGxD,eAAO,MAAM,gBAAgB,EAAE,MAAW,CAAC;AAE3C,eAAO,MAAM,gBAAgB,EAAE,MAAW,CAAC;AAE3C,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;CAsC/B,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyDzB,CAAC;AAEH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;CAsB7B,CAAC;AAEH,eAAO,MAAM,uBAAuB;;;;;;;;;;;;CAclC,CAAC;AAEH;;GAEG;AAEH,UAAU,sBAAsB;IAC9B,eAAe,EAAE,cAAc,CAAC;IAChC,iBAAiB,EAAE,WAAW,CAAC;IAC/B,UAAU,EAAE,cAAc,CAAC;IAC3B,YAAY,EAAE,cAAc,CAAC;IAC7B,QAAQ,EAAE,eAAe,CAAC;IAC1B,WAAW,EAAE,eAAe,CAAC;CAC9B;AAED,eAAO,MAAM,sBAAsB,EAAE,sBAOpC,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;;;CAW3B,CAAC;AAEH,eAAO,MAAM,cAAc;;;;;;;;;;;;CAYzB,CAAC;AAEH;;GAEG;AAEH,UAAU,2BAA2B;IACnC,IAAI,EAAE,eAAe,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,UAAU,iCAAiC;IACzC,mBAAmB,EAAE,QAAQ,CAAC;IAC9B,cAAc,EAAE,QAAQ,CAAC;CAC1B;AAED,eAAO,MAAM,2BAA2B,EAAE,2BAGzC,CAAC;AAEF,eAAO,MAAM,iCAAiC,EAAE,iCAI7C,CAAC;AAEJ,UAAU,+BAA+B;IACvC,eAAe,EAAE,cAAc,CAAC;IAChC,iBAAiB,EAAE,WAAW,CAAC;IAC/B,UAAU,EAAE,cAAc,CAAC;IAC3B,YAAY,EAAE,QAAQ,CAAC;IACvB,QAAQ,EAAE,eAAe,CAAC;IAC1B,iBAAiB,EAAE,QAAQ,CAAC;CAC7B;AAED,eAAO,MAAM,+BAA+B,EAAE,+BAQ3C,CAAC;AAEJ,eAAO,MAAM,yBAAyB;;;;;;;;;;;CAWpC,CAAC"}

package/lib/typescript/hooks/useAccordionAnimation.d.ts

@@ -0,0 +1,41 @@
+import { type LayoutChangeEvent } from "react-native";
+type Params = {
+    defaultExpanded?: boolean;
+};
+export declare const useAccordionAnimation: ({ defaultExpanded }?: Params) => {
+    expanded: boolean;
+    /**
+     * Toggle the accordion expanded/collapsed state.
+     */
+    toggleAccordion: () => void;
+    /**
+     * The style to apply to the accordion icon.
+     */
+    iconAnimatedStyle: {
+        transform: {
+            rotate: "0deg" | "180deg";
+        }[];
+    };
+    /**
+     * Callback to execute on the body's inner container layout.
+     */
+    onBodyLayout: (event: LayoutChangeEvent) => void;
+    /**
+     * The animated style to apply to the collapsible body container – it must be an `Animated.View`.
+     */
+    bodyAnimatedStyle: ({
+        overflow: "hidden";
+    } | {
+        height: number;
+    })[];
+    /**
+     * The style to apply to the inner body container.
+     */
+    bodyInnerStyle: {
+        position: "absolute";
+        padding: 16;
+        paddingTop: number;
+    };
+};
+export {};
+//# sourceMappingURL=useAccordionAnimation.d.ts.map

package/lib/typescript/hooks/useAccordionAnimation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAccordionAnimation.d.ts","sourceRoot":"","sources":["../../../src/hooks/useAccordionAnimation.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,KAAK,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAUlE,KAAK,MAAM,GAAG;IACZ,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,qBAAqB,yBAE/B,MAAM;;IAwDL;;OAEG;;IAEH;;OAEG;;;;;;IAEH;;OAEG;;IAEH;;OAEG;;;;;;IAEH;;OAEG;;;;;;CAGN,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pagopa/io-app-design-system",
-  "version": "4.5.5",
+  "version": "4.6.0",
   "description": "The library defining the core components of the design system of @pagopa/io-app",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

package/src/components/accordion/AccordionItem.tsx

@@ -1,23 +1,15 @@
-import React, { useState } from "react";
-import {
-  LayoutChangeEvent,
-  StyleSheet,
-  TouchableWithoutFeedback,
-  View
-} from "react-native";
+import React from "react";
+import { StyleSheet, TouchableWithoutFeedback, View } from "react-native";
 import LinearGradient from "react-native-linear-gradient";
-import Animated, {
-  useAnimatedStyle,
-  withSpring
-} from "react-native-reanimated";
+import Animated from "react-native-reanimated";
 import {
   IOAccordionRadius,
   IOStyles,
   useIOTheme,
   type IOSpacingScale
 } from "../../core";
-import { IOSpringValues } from "../../core/IOAnimations";
 import { IOColors, hexToRgba } from "../../core/IOColors";
+import { useAccordionAnimation } from "../../hooks/useAccordionAnimation";
 import { IOIconSizeScale, IOIcons, Icon } from "../icons/Icon";
 import { Body, H6 } from "../typography";
 
@@ -28,11 +20,6 @@ export type AccordionItem = {
   icon?: IOIcons;
 };
 
-type AccordionBody = {
-  children: React.ReactNode;
-  expanded: boolean;
-};
-
 const accordionBodySpacing: IOSpacingScale = 16;
 const accordionIconMargin: IOSpacingScale = 12;
 const accordionChevronMargin: IOSpacingScale = 8;
@@ -40,40 +27,6 @@ const accordionChevronMargin: IOSpacingScale = 8;
 // Icon size
 const iconSize: IOIconSizeScale = 24;
 
-/* The code below is a re-adaptation of Dima Portenko's code:
-https://github.com/dimaportenko/reanimated-collapsable-card-tutorial
-*/
-export const AccordionBody = ({ children, expanded }: AccordionBody) => {
-  const [height, setHeight] = useState(0);
-
-  const onLayout = (event: LayoutChangeEvent) => {
-    const { height: onLayoutHeight } = event.nativeEvent.layout;
-
-    if (onLayoutHeight > 0 && height !== onLayoutHeight) {
-      setHeight(onLayoutHeight);
-    }
-  };
-
-  const animatedHeightStyle = useAnimatedStyle(
-    () => ({
-      height: expanded
-        ? withSpring(height, IOSpringValues.accordion)
-        : withSpring(0, IOSpringValues.accordion)
-    }),
-    [expanded]
-  );
-
-  return (
-    <Animated.View
-      style={[animatedHeightStyle, styles.accordionCollapsableContainer]}
-    >
-      <View style={styles.accordionBodyContainer} onLayout={onLayout}>
-        {children}
-      </View>
-    </Animated.View>
-  );
-};
-
 export const AccordionItem = ({
   title,
   accessibilityLabel,
@@ -81,30 +34,21 @@ export const AccordionItem = ({
   icon
 }: AccordionItem) => {
   const theme = useIOTheme();
-  const [expanded, setExpanded] = useState(false);
+
+  const {
+    expanded,
+    toggleAccordion,
+    onBodyLayout,
+    iconAnimatedStyle,
+    bodyAnimatedStyle,
+    bodyInnerStyle
+  } = useAccordionAnimation();
 
   // Visual attributes
   const accordionBackground: IOColors = theme["appBackground-primary"];
   const accordionBorder: IOColors = theme["cardBorder-default"];
   const accordionIconColor: IOColors = theme["icon-decorative"];
 
-  const onItemPress = () => {
-    setExpanded(!expanded);
-  };
-
-  const animatedChevron = useAnimatedStyle(
-    () => ({
-      transform: [
-        {
-          rotate: expanded
-            ? withSpring(`180deg`, IOSpringValues.accordion)
-            : withSpring(`0deg`, IOSpringValues.accordion)
-        }
-      ]
-    }),
-    [expanded]
-  );
-
   return (
     <View
       style={[
@@ -120,7 +64,7 @@ export const AccordionItem = ({
         accessibilityRole="button"
         accessibilityState={{ expanded }}
         accessibilityLabel={accessibilityLabel ?? title}
-        onPress={onItemPress}
+        onPress={toggleAccordion}
       >
         <View style={styles.textContainer}>
           <View
@@ -146,7 +90,7 @@ export const AccordionItem = ({
               <H6 color={theme["textBody-default"]}>{title}</H6>
             </View>
           </View>
-          <Animated.View style={animatedChevron}>
+          <Animated.View style={iconAnimatedStyle}>
             <Icon
               name="chevronBottom"
               color={theme["interactiveElem-default"]}
@@ -155,9 +99,12 @@ export const AccordionItem = ({
         </View>
       </TouchableWithoutFeedback>
 
-      <AccordionBody expanded={expanded}>
-        {typeof body === "string" ? <Body>{body}</Body> : body}
-      </AccordionBody>
+      <Animated.View style={bodyAnimatedStyle}>
+        <View style={bodyInnerStyle} onLayout={onBodyLayout}>
+          {typeof body === "string" ? <Body>{body}</Body> : body}
+        </View>
+      </Animated.View>
+
       {/* This gradient adds a smooth end to the content. If it is missing,
       the content will be cut sharply during the height transition. */}
       <LinearGradient
@@ -185,14 +132,6 @@ const styles = StyleSheet.create({
     borderRadius: IOAccordionRadius,
     borderCurve: "continuous"
   },
-  accordionCollapsableContainer: {
-    overflow: "hidden"
-  },
-  accordionBodyContainer: {
-    position: "absolute",
-    padding: accordionBodySpacing,
-    paddingTop: 0
-  },
   textContainer: {
     padding: accordionBodySpacing,
     flexDirection: "row",

package/src/components/banner/Banner.tsx

@@ -206,13 +206,14 @@ export const Banner = ({
         {action && (
           /* Disable pointer events to avoid
              pressed state on the button */
-          <View
+          <Pressable
             pointerEvents="none"
             importantForAccessibility="no-hide-descendants"
             accessible={true}
             accessibilityElementsHidden
             accessibilityLabel={action}
             accessibilityRole="button"
+            onPress={onPress}
           >
             <VSpacer size={4} />
             <IOText
@@ -229,7 +230,7 @@ export const Banner = ({
             >
               {action}
             </IOText>
-          </View>
+          </Pressable>
         )}
       </View>
       <View style={[styles.bleedPictogram, IOStyles.selfCenter]}>

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

@@ -103,8 +103,36 @@ exports[`Test Banner Components - Experimental Enabled Banner Snapshot 1`] = `
         accessibilityElementsHidden={true}
         accessibilityLabel="Action text"
         accessibilityRole="button"
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
+        accessibilityValue={
+          {
+            "max": undefined,
+            "min": undefined,
+            "now": undefined,
+            "text": undefined,
+          }
+        }
         accessible={true}
+        collapsable={false}
+        focusable={true}
         importantForAccessibility="no-hide-descendants"
+        onBlur={[Function]}
+        onClick={[Function]}
+        onFocus={[Function]}
+        onResponderGrant={[Function]}
+        onResponderMove={[Function]}
+        onResponderRelease={[Function]}
+        onResponderTerminate={[Function]}
+        onResponderTerminationRequest={[Function]}
+        onStartShouldSetResponder={[Function]}
         pointerEvents="none"
       >
         <View
@@ -380,8 +408,36 @@ exports[`Test Banner Components Banner Snapshot 1`] = `
         accessibilityElementsHidden={true}
         accessibilityLabel="Action text"
         accessibilityRole="button"
+        accessibilityState={
+          {
+            "busy": undefined,
+            "checked": undefined,
+            "disabled": undefined,
+            "expanded": undefined,
+            "selected": undefined,
+          }
+        }
+        accessibilityValue={
+          {
+            "max": undefined,
+            "min": undefined,
+            "now": undefined,
+            "text": undefined,
+          }
+        }
         accessible={true}
+        collapsable={false}
+        focusable={true}
         importantForAccessibility="no-hide-descendants"
+        onBlur={[Function]}
+        onClick={[Function]}
+        onFocus={[Function]}
+        onResponderGrant={[Function]}
+        onResponderMove={[Function]}
+        onResponderRelease={[Function]}
+        onResponderTerminate={[Function]}
+        onResponderTerminationRequest={[Function]}
+        onStartShouldSetResponder={[Function]}
         pointerEvents="none"
       >
         <View

package/src/components/buttons/ButtonLink.tsx

@@ -117,7 +117,7 @@ export const ButtonLink = forwardRef<View, ButtonLinkProps>(
             pressed: IOColors[theme["interactiveElem-pressed"]],
             disabled: hexToRgba(
               IOColors[theme["interactiveElem-default"]],
-              0.75
+              0.85
             )
           }
         },

package/src/components/buttons/ButtonSolid.tsx

@@ -171,7 +171,7 @@ export const ButtonSolid = forwardRef<View, ButtonSolidProps>(
             disabled: IOColors[theme["interactiveElem-disabled"]]
           },
           foreground: {
-            default: theme["buttonText-default"],
+            default: theme["buttonText-danger"],
             disabled: theme["buttonText-disabled"]
           }
         },

package/src/components/checkbox/AnimatedCheckbox.tsx

@@ -15,7 +15,7 @@ import Animated, {
   withTiming
 } from "react-native-reanimated";
 import { useIOFontDynamicScale } from "../../utils/accessibility";
-import { useIOExperimentalDesign } from "../../core";
+import { useIOExperimentalDesign, useIOTheme } from "../../core";
 import { IOSpringValues } from "../../core/IOAnimations";
 import { IOColors } from "../../core/IOColors";
 import {
@@ -59,12 +59,13 @@ export const AnimatedCheckbox = ({
   onPress,
   disabled
 }: OwnProps) => {
+  const theme = useIOTheme();
   const { dynamicFontScale } = useIOFontDynamicScale();
   const isChecked = checked ?? false;
 
   const { isExperimental } = useIOExperimentalDesign();
-  const borderColorOffState =
-    IOColors[IOSelectionTickVisualParams.borderColorOffState];
+  const borderColorOffState = IOColors[theme["selection-border-off"]];
+
   // TODO: Remove this when legacy look is deprecated https://pagopa.atlassian.net/browse/IOPLT-153
   const legacyBorderColorOffState =
     IOColors[IOSelectionTickLegacyVisualParams.borderColorOffState];
@@ -72,12 +73,12 @@ export const AnimatedCheckbox = ({
     ? borderColorOffState
     : legacyBorderColorOffState;
 
-  const backgroundColorOnState =
-    IOColors[IOSelectionTickVisualParams.bgColorOnState];
+  const backgroundColorOnState = IOColors[theme["selection-background-on"]];
+
   // TODO: Remove this when legacy look is deprecated https://pagopa.atlassian.net/browse/IOPLT-153
   const legacyBackgroundColorOnState =
     IOColors[IOSelectionTickLegacyVisualParams.bgColorOnState];
-  const backgroundColorProp = isExperimental
+  const backgroundColor = isExperimental
     ? backgroundColorOnState
     : legacyBackgroundColorOnState;
 
@@ -139,9 +140,7 @@ export const AnimatedCheckbox = ({
         style={[
           styles.checkBoxSquare,
           checkboxSizeStyle,
-          {
-            backgroundColor: backgroundColorProp
-          },
+          { backgroundColor },
           animatedCheckboxSquare
         ]}
       />
@@ -150,7 +149,7 @@ export const AnimatedCheckbox = ({
           <AnimatedTick
             size={size}
             progress={tickAnimationProgress}
-            stroke={IOColors[IOSelectionTickVisualParams.tickColor]}
+            stroke={IOColors[theme["selection-tick"]]}
           />
         </View>
       )}