@pagopa/io-app-design-system 2.0.1 → 2.0.2

package/lib/typescript/components/layout/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./useFooterActionsMeasurements";
+export * from "./useFooterActionsInlineMeasurements";
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/components/layout/hooks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC;AAC/C,cAAc,sCAAsC,CAAC"}

package/lib/typescript/components/layout/hooks/useBottomMargins.d.ts

@@ -0,0 +1,5 @@
+export declare const useBottomMargins: (withSecondaryAction?: boolean, excludeSafeAreaMargins?: boolean) => {
+    bottomMargin: number;
+    extraBottomMargin: number;
+};
+//# sourceMappingURL=useBottomMargins.d.ts.map

package/lib/typescript/components/layout/hooks/useBottomMargins.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBottomMargins.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/hooks/useBottomMargins.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,gBAAgB,yBACN,OAAO,2BACJ,OAAO;;;CAoBhC,CAAC"}

package/lib/typescript/components/layout/hooks/useFooterActionsInlineMeasurements.d.ts

@@ -0,0 +1,17 @@
+import { FooterActionsInlineMeasurements } from "../FooterActionsInline";
+type UseFooterActionsInlineMeasurementsProps = {
+    footerActionsInlineMeasurements: FooterActionsInlineMeasurements;
+    handleFooterActionsInlineMeasurements: (values: FooterActionsInlineMeasurements) => void;
+};
+/**
+ * Custom hook to handle the `FooterActions` measurements
+ * @returns
+ *   - `footerActionsInlineMeasurements`
+ *      Object containing the `FooterActionsInline` measurements
+ *   - `handleFooterActionsInlineMeasurements`
+ *      Function to update the footer actions measurements
+ *      (to be applied to `onMeasure` prop of `FooterActionsInline`)
+ */
+export declare const useFooterActionsInlineMeasurements: () => UseFooterActionsInlineMeasurementsProps;
+export {};
+//# sourceMappingURL=useFooterActionsInlineMeasurements.d.ts.map

package/lib/typescript/components/layout/hooks/useFooterActionsInlineMeasurements.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFooterActionsInlineMeasurements.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/hooks/useFooterActionsInlineMeasurements.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,+BAA+B,EAAE,MAAM,wBAAwB,CAAC;AAEzE,KAAK,uCAAuC,GAAG;IAC7C,+BAA+B,EAAE,+BAA+B,CAAC;IACjE,qCAAqC,EAAE,CACrC,MAAM,EAAE,+BAA+B,KACpC,IAAI,CAAC;CACX,CAAC;AACF;;;;;;;;GAQG;AACH,eAAO,MAAM,kCAAkC,QACzC,uCAkBH,CAAC"}

package/lib/typescript/components/layout/hooks/useFooterActionsMeasurements.d.ts

@@ -0,0 +1,17 @@
+import { FooterActionsMeasurements } from "../FooterActions";
+type UseFooterActionsMeasurementsProps = {
+    footerActionsMeasurements: FooterActionsMeasurements;
+    handleFooterActionsMeasurements: (values: FooterActionsMeasurements) => void;
+};
+/**
+ * Custom hook to handle the `FooterActions` measurements
+ * @returns
+ *   - `footerActionsMeasurements`
+ *      Object containing the `FooterActions` measurements
+ *   - `handleFooterActionsMeasurements`
+ *      Function to update the footer actions measurements
+ *      (to be applied to `onMeasure` prop of `FooterActions`)
+ */
+export declare const useFooterActionsMeasurements: () => UseFooterActionsMeasurementsProps;
+export {};
+//# sourceMappingURL=useFooterActionsMeasurements.d.ts.map

package/lib/typescript/components/layout/hooks/useFooterActionsMeasurements.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFooterActionsMeasurements.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/hooks/useFooterActionsMeasurements.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAE7D,KAAK,iCAAiC,GAAG;IACvC,yBAAyB,EAAE,yBAAyB,CAAC;IACrD,+BAA+B,EAAE,CAAC,MAAM,EAAE,yBAAyB,KAAK,IAAI,CAAC;CAC9E,CAAC;AACF;;;;;;;;GAQG;AACH,eAAO,MAAM,4BAA4B,QACnC,iCAiBH,CAAC"}

package/lib/typescript/components/layout/index.d.ts

@@ -1,4 +1,6 @@
 export * from "./BlockButtons";
+export * from "./FooterActions";
+export * from "./FooterActionsInline";
 export * from "./FooterWithButtons";
 export * from "./ForceScrollDownView";
 export * from "./GradientBottomActions";
@@ -7,4 +9,5 @@ export * from "./HeaderFirstLevel";
 export * from "./HeaderSecondLevel";
 export * from "./ModalBSHeader";
 export * from "./common";
+export * from "./hooks";
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/components/layout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/index.tsx"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/index.tsx"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC"}

package/lib/typescript/components/pictograms/Pictogram.d.ts

@@ -58,6 +58,9 @@ export declare const IOPictograms: {
     comunicationProblem: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
     payments: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
     workInProgress: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
+    smile: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
+    fingerprint: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
+    walletDoc: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
     ibanCard: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
     followMessage: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
     manual: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;

package/lib/typescript/components/pictograms/Pictogram.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pictogram.d.ts","sourceRoot":"","sources":["../../../../src/components/pictograms/Pictogram.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,QAAQ,EAAyC,MAAM,YAAY,CAAC;AA4G7E,OAAO,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAElE,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoExB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,YAAY,CAAC;AAErD,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,CAAC,EAAE,QAAQ,CAAC;IAIjB,cAAc,CAAC,EAAE,SAAS,GAAG,eAAe,GAAG,cAAc,CAAC;IAC9D,IAAI,CAAC,EAAE,oBAAoB,GAAG,MAAM,CAAC;CACtC,CAAC;AAQF,eAAO,MAAM,SAAS,oDAMnB,iBAAiB,sBAgCnB,CAAC;AAUF,MAAM,MAAM,iBAAiB,GAAG,OAAO,CACnC,OAAO,GACP,SAAS,GACT,WAAW,GACX,SAAS,GACT,MAAM,GACN,UAAU,GACV,MAAM,GACN,UAAU,GACV,UAAU,GACV,SAAS,GACT,KAAK,GACL,UAAU,GACV,aAAa,GACb,eAAe,GACf,iBAAiB,GACjB,eAAe,GACf,cAAc,GACd,SAAS,GACT,eAAe,GACf,cAAc,GACd,WAAW,GACX,cAAc,GACd,UAAU,GACV,cAAc,GACd,MAAM,GACN,SAAS,GACT,OAAO,GACP,QAAQ,GACR,YAAY,GACZ,UAAU,GACV,SAAS,GACT,YAAY,GACZ,cAAc,GACd,MAAM,GACN,KAAK,GACL,cAAc,GACd,MAAM,GACN,QAAQ,GACR,gBAAgB,GAChB,UAAU,GACV,UAAU,GACV,YAAY,GACZ,gBAAgB,EAClB,YAAY,CACb,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE;KAC7B,GAAG,IAAI,iBAAiB,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,iBAAiB,KAAK,GAAG,CAAC,OAAO;CA2CzE,CAAC;AAEF,eAAO,MAAM,cAAc,oDAMxB,iBAAiB,sBAiCnB,CAAC;AAOF,eAAO,MAAM,kBAAkB;;;;;;;;CAQrB,CAAC;AAEX,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,kBAAkB,CAAC;AAMjE,eAAO,MAAM,kBAAkB;;;CAGrB,CAAC;AAEX,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,kBAAkB,CAAC"}
+{"version":3,"file":"Pictogram.d.ts","sourceRoot":"","sources":["../../../../src/components/pictograms/Pictogram.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,QAAQ,EAAyC,MAAM,YAAY,CAAC;AA+G7E,OAAO,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAElE,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuExB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,YAAY,CAAC;AAErD,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,CAAC,EAAE,QAAQ,CAAC;IAIjB,cAAc,CAAC,EAAE,SAAS,GAAG,eAAe,GAAG,cAAc,CAAC;IAC9D,IAAI,CAAC,EAAE,oBAAoB,GAAG,MAAM,CAAC;CACtC,CAAC;AASF,eAAO,MAAM,SAAS,oDAMnB,iBAAiB,sBAiCnB,CAAC;AAUF,MAAM,MAAM,iBAAiB,GAAG,OAAO,CACnC,OAAO,GACP,SAAS,GACT,WAAW,GACX,SAAS,GACT,MAAM,GACN,UAAU,GACV,MAAM,GACN,UAAU,GACV,UAAU,GACV,SAAS,GACT,KAAK,GACL,UAAU,GACV,aAAa,GACb,eAAe,GACf,iBAAiB,GACjB,eAAe,GACf,cAAc,GACd,SAAS,GACT,eAAe,GACf,cAAc,GACd,WAAW,GACX,cAAc,GACd,UAAU,GACV,cAAc,GACd,MAAM,GACN,SAAS,GACT,OAAO,GACP,QAAQ,GACR,YAAY,GACZ,UAAU,GACV,SAAS,GACT,YAAY,GACZ,cAAc,GACd,MAAM,GACN,KAAK,GACL,cAAc,GACd,MAAM,GACN,QAAQ,GACR,gBAAgB,GAChB,UAAU,GACV,UAAU,GACV,YAAY,GACZ,gBAAgB,EAClB,YAAY,CACb,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE;KAC7B,GAAG,IAAI,iBAAiB,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,iBAAiB,KAAK,GAAG,CAAC,OAAO;CA2CzE,CAAC;AAEF,eAAO,MAAM,cAAc,oDAMxB,iBAAiB,sBAkCnB,CAAC;AAOF,eAAO,MAAM,kBAAkB;;;;;;;;CAQrB,CAAC;AAEX,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,kBAAkB,CAAC;AAMjE,eAAO,MAAM,kBAAkB;;;CAGrB,CAAC;AAEX,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,kBAAkB,CAAC"}

package/lib/typescript/components/pictograms/svg/PictogramFingerprint.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { SVGPictogramProps } from "../types";
+declare const PictogramFingerprint: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
+export default PictogramFingerprint;
+//# sourceMappingURL=PictogramFingerprint.d.ts.map

package/lib/typescript/components/pictograms/svg/PictogramFingerprint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PictogramFingerprint.d.ts","sourceRoot":"","sources":["../../../../../src/components/pictograms/svg/PictogramFingerprint.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,QAAA,MAAM,oBAAoB,oCAIvB,iBAAiB,sBAuCnB,CAAC;AAEF,eAAe,oBAAoB,CAAC"}

package/lib/typescript/components/pictograms/svg/PictogramSmile.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { SVGPictogramProps } from "../types";
+declare const PictogramSmile: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
+export default PictogramSmile;
+//# sourceMappingURL=PictogramSmile.d.ts.map

package/lib/typescript/components/pictograms/svg/PictogramSmile.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PictogramSmile.d.ts","sourceRoot":"","sources":["../../../../../src/components/pictograms/svg/PictogramSmile.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,QAAA,MAAM,cAAc,oCAAqC,iBAAiB,sBAezE,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/typescript/components/pictograms/svg/PictogramWalletDoc.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+import { SVGPictogramProps } from "../types";
+declare const PictogramWalletDoc: ({ size, colorValues, ...props }: SVGPictogramProps) => React.JSX.Element;
+export default PictogramWalletDoc;
+//# sourceMappingURL=PictogramWalletDoc.d.ts.map

package/lib/typescript/components/pictograms/svg/PictogramWalletDoc.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PictogramWalletDoc.d.ts","sourceRoot":"","sources":["../../../../../src/components/pictograms/svg/PictogramWalletDoc.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,QAAA,MAAM,kBAAkB,oCAIrB,iBAAiB,sBAiCnB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

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

@@ -180,7 +180,7 @@ export declare const IOColorsExtra: {
     "blue-50": string;
 };
 export type IOColorsExtra = keyof typeof IOColorsExtra;
-declare const themeKeys: readonly ["appBackground-primary", "appBackground-secondary", "appBackground-tertiary", "appBackground-accent", "interactiveElem-default", "interactiveElem-pressed", "listItem-pressed", "textHeading-default", "textHeading-secondary", "textHeading-tertiary", "textBody-default", "textBody-secondary", "textBody-tertiary", "cardBorder-default", "icon-default", "icon-decorative", "divider-default", "errorIcon", "errorText", "pictogram-hands", "pictogram-tint-main", "pictogram-tint-secondary"];
+declare const themeKeys: readonly ["appBackground-primary", "appBackground-secondary", "appBackground-tertiary", "appBackground-accent", "interactiveElem-default", "interactiveElem-pressed", "listItem-pressed", "textHeading-default", "textHeading-secondary", "textHeading-tertiary", "textBody-default", "textBody-secondary", "textBody-tertiary", "cardBorder-default", "icon-default", "icon-decorative", "divider-header", "divider-default", "divider-bottomBar", "errorIcon", "errorText", "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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2EnB,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;AA0BF,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;CAkB1B,CAAC;AACF,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;;;;;;;;;;;;;;;CAexB,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;AACzD,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;;;;;;;;CAQzB,CAAC;AACF,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,aAAa,CAAC;AAMvD,QAAA,MAAM,SAAS,8eA6BL,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,OA6B1B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,OAKhC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,OA4BzB,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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2EnB,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;AA0BF,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;CAkB1B,CAAC;AACF,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;;;;;;;;;;;;;;;CAexB,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;AACzD,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;;;;;;;;CAQzB,CAAC;AACF,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,aAAa,CAAC;AAMvD,QAAA,MAAM,SAAS,gjBAgCL,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,OAgC1B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,OAKhC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,OA8BzB,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/IOSpacing.d.ts

@@ -21,4 +21,12 @@ export declare const IOModuleIDPHSpacing: IOModuleIDPSpacing;
 export declare const IOModuleIDPVSpacing: IOModuleIDPSpacing;
 export declare const IOModuleIDPSavedVSpacing: IOModuleIDPSpacing;
 export declare const IOListItemLogoMargin: IOModuleIDPSpacing;
+declare const spacingConstantKeys: readonly ["screenEndMargin"];
+export type IOSpacingConstants = {
+    [K in (typeof spacingConstantKeys)[number]]: IOSpacingScale;
+};
+export declare const IOSpacing: {
+    readonly screenEndMargin: 32;
+};
+export {};
 //# sourceMappingURL=IOSpacing.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"IOSpacing.d.ts","sourceRoot":"","sources":["../../../src/core/IOSpacing.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,cAAc,wEAEjB,CAAC;AACX,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;AAG7D,eAAO,MAAM,QAAQ,yCAE6B,CAAC;AACnD,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC;AAGjD,eAAO,MAAM,WAAW,8BAE0B,CAAC;AACnD,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAGvD,eAAO,MAAM,cAAc,mBAEuB,CAAC;AACnD,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;AAG7D,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC;AAC/D,eAAO,MAAM,kBAAkB,EAAE,eAAoB,CAAC;AACtD,eAAO,MAAM,qBAAqB,EAAE,eAAoB,CAAC;AACzD,eAAO,MAAM,qBAAqB,EAAE,eAAoB,CAAC;AAGzD,MAAM,MAAM,YAAY,GAAG,OAAO,CAAC,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;AAC1D,eAAO,MAAM,aAAa,EAAE,YAAgB,CAAC;AAC7C,eAAO,MAAM,aAAa,EAAE,YAAgB,CAAC;AAG7C,MAAM,MAAM,cAAc,GAAG,OAAO,CAAC,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;AAC5D,eAAO,MAAM,eAAe,EAAE,cAAkB,CAAC;AACjD,eAAO,MAAM,eAAe,EAAE,cAAkB,CAAC;AAGjD,MAAM,MAAM,kBAAkB,GAAG,OAAO,CAAC,cAAc,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;AACtE,eAAO,MAAM,mBAAmB,EAAE,kBAAuB,CAAC;AAC1D,eAAO,MAAM,mBAAmB,EAAE,kBAAuB,CAAC;AAC1D,eAAO,MAAM,wBAAwB,EAAE,kBAAuB,CAAC;AAC/D,eAAO,MAAM,oBAAoB,EAAE,kBAAsB,CAAC"}
+{"version":3,"file":"IOSpacing.d.ts","sourceRoot":"","sources":["../../../src/core/IOSpacing.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,cAAc,wEAEjB,CAAC;AACX,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;AAG7D,eAAO,MAAM,QAAQ,yCAE6B,CAAC;AACnD,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC;AAGjD,eAAO,MAAM,WAAW,8BAE0B,CAAC;AACnD,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAGvD,eAAO,MAAM,cAAc,mBAEuB,CAAC;AACnD,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC;AAG7D,MAAM,MAAM,eAAe,GAAG,OAAO,CAAC,cAAc,EAAE,EAAE,GAAG,EAAE,CAAC,CAAC;AAC/D,eAAO,MAAM,kBAAkB,EAAE,eAAoB,CAAC;AACtD,eAAO,MAAM,qBAAqB,EAAE,eAAoB,CAAC;AACzD,eAAO,MAAM,qBAAqB,EAAE,eAAoB,CAAC;AAGzD,MAAM,MAAM,YAAY,GAAG,OAAO,CAAC,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;AAC1D,eAAO,MAAM,aAAa,EAAE,YAAgB,CAAC;AAC7C,eAAO,MAAM,aAAa,EAAE,YAAgB,CAAC;AAG7C,MAAM,MAAM,cAAc,GAAG,OAAO,CAAC,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;AAC5D,eAAO,MAAM,eAAe,EAAE,cAAkB,CAAC;AACjD,eAAO,MAAM,eAAe,EAAE,cAAkB,CAAC;AAGjD,MAAM,MAAM,kBAAkB,GAAG,OAAO,CAAC,cAAc,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;AACtE,eAAO,MAAM,mBAAmB,EAAE,kBAAuB,CAAC;AAC1D,eAAO,MAAM,mBAAmB,EAAE,kBAAuB,CAAC;AAC1D,eAAO,MAAM,wBAAwB,EAAE,kBAAuB,CAAC;AAC/D,eAAO,MAAM,oBAAoB,EAAE,kBAAsB,CAAC;AAM1D,QAAA,MAAM,mBAAmB,8BAA+B,CAAC;AAEzD,MAAM,MAAM,kBAAkB,GAAG;KAC9B,CAAC,IAAI,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,CAAC,GAAG,cAAc;CAC5D,CAAC;AAEF,eAAO,MAAM,SAAS;;CAEiB,CAAC"}

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

@@ -4,7 +4,6 @@ export * from "./IOTransitions";
 export * from "./IOStyles";
 export * from "./IOShapes";
 export * from "./IOSpacing";
-export * from "./IOStyleVariables";
 export * from "./IODSExperimentalContextProvider";
 export * from "./IOThemeContextProvider";
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,oBAAoB,CAAC;AACnC,cAAc,mCAAmC,CAAC;AAClD,cAAc,0BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,mCAAmC,CAAC;AAClD,cAAc,0BAA0B,CAAC"}

package/lib/typescript/utils/fonts.d.ts

@@ -13,7 +13,7 @@ declare const fonts: {
     DMMono: string;
 };
 export type IOFontFamily = keyof typeof fonts;
-declare const allFontSizes: (22 | 16 | 12 | 20 | 32 | 14 | 18 | 28 | 26 | 31 | 35)[];
+declare const allFontSizes: (16 | 12 | 20 | 32 | 14 | 18 | 28 | 22 | 26 | 31 | 35)[];
 export type IOFontSize = (typeof allFontSizes)[number];
 declare const weights: readonly ["Light", "Regular", "Medium", "Semibold", "Bold"];
 export type IOFontWeight = (typeof weights)[number];
@@ -46,6 +46,6 @@ export declare const makeFontFamilyName: (font: IOFontFamily, weight?: IOFontWei
  * @param weight
  * @param fontStyle
  */
-export declare const makeFontStyleObject: (size: 22 | 16 | 12 | 20 | 32 | 14 | 18 | 28 | 26 | 31 | 35 | undefined, font: "TitilliumSansPro" | "ReadexPro" | "DMMono" | undefined, lineHeight: TextStyle["lineHeight"], weight?: IOFontWeight, fontStyle?: TextStyle["fontStyle"], boldEnabled?: boolean) => FontStyleObject;
+export declare const makeFontStyleObject: (size: 16 | 12 | 20 | 32 | 14 | 18 | 28 | 22 | 26 | 31 | 35 | undefined, font: "TitilliumSansPro" | "ReadexPro" | "DMMono" | undefined, lineHeight: TextStyle["lineHeight"], weight?: IOFontWeight, fontStyle?: TextStyle["fontStyle"], boldEnabled?: boolean) => FontStyleObject;
 export {};
 //# sourceMappingURL=fonts.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pagopa/io-app-design-system",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "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/contentWrapper/ContentWrapper.tsx

@@ -1,12 +1,13 @@
 import React from "react";
 import { View } from "react-native";
+import { WithTestID } from "src/utils/types";
 import type { IOAppMargin } from "../../core";
 import { IOVisualCostants } from "../../core/IOStyles";
 
-type IOContentWrapperProps = {
+type IOContentWrapperProps = WithTestID<{
   margin?: IOAppMargin;
   children: React.ReactNode;
-};
+}>;
 
 /**
 `ContentWrapper` is the main wrapper of the application. It automatically sets side margins,
@@ -15,9 +16,11 @@ depending on the size value
  */
 export const ContentWrapper = ({
   margin = IOVisualCostants.appMarginDefault,
+  testID,
   children
 }: IOContentWrapperProps) => (
   <View
+    testID={testID}
     style={{
       paddingHorizontal: margin
     }}

package/src/components/layout/BlockButtons.tsx

@@ -77,7 +77,7 @@ export type BlockButtonsProps = Props;
 
 /**
  * Implements a component that show buttons on a line on 1, 2 or 3 buttons
- * @deprecated This component is deprecated.
+ * @deprecated This component is deprecated. Use `FooterActionsInline` instead.
  */
 export const BlockButtons = (props: Props) => {
   const renderRightButton = () => {

package/src/components/layout/FooterActions.tsx

@@ -0,0 +1,260 @@
+import * as React from "react";
+import { ComponentProps, Fragment, PropsWithChildren, useState } from "react";
+import {
+  ColorValue,
+  LayoutChangeEvent,
+  LayoutRectangle,
+  StyleSheet,
+  Text,
+  View,
+  ViewStyle
+} from "react-native";
+import Animated from "react-native-reanimated";
+import {
+  IOColors,
+  IOSpacer,
+  IOSpacing,
+  IOVisualCostants,
+  buttonSolidHeight,
+  hexToRgba,
+  useIOExperimentalDesign,
+  useIOTheme
+} from "../../core";
+import { WithTestID } from "../../utils/types";
+import { ButtonLink, ButtonOutline, ButtonSolid } from "../buttons";
+import { VSpacer } from "../spacer";
+import { useBottomMargins } from "./hooks/useBottomMargins";
+
+type FooterSingleButton = {
+  type: "SingleButton";
+  primary: Omit<ComponentProps<typeof ButtonSolid>, "fullWidth">;
+  secondary?: never;
+  tertiary?: never;
+};
+
+type FooterTwoButtons = {
+  type: "TwoButtons";
+  primary: Omit<ComponentProps<typeof ButtonSolid>, "fullWidth">;
+  secondary: Omit<ComponentProps<typeof ButtonLink>, "color">;
+  tertiary?: never;
+};
+
+type FooterThreeButtons = {
+  type: "ThreeButtons";
+  primary: Omit<ComponentProps<typeof ButtonSolid>, "fullWidth">;
+  secondary: Omit<ComponentProps<typeof ButtonOutline>, "fullWidth" | "color">;
+  tertiary: Omit<ComponentProps<typeof ButtonLink>, "color">;
+};
+
+export type FooterActionsMeasurements = {
+  // Height of the "Actions" block
+  actionBlockHeight: number;
+  /* Height of the safe bottom area. It includes:
+     - Margin between screen content
+       and actions (contentEndMargin)
+     - Actions block height
+     - Eventual safe area margin (bottomMargin)
+     This is the total bottom padding that needs
+     to be applied to the ScrollView.
+  */
+  safeBottomAreaHeight: number;
+};
+
+type FooterActions = FooterSingleButton | FooterTwoButtons | FooterThreeButtons;
+
+type FooterAnimatedStyles = {
+  /* Apply object returned by `useAnimatedStyle` to the main block */
+  mainBlock?: Animated.AnimateStyle<ViewStyle>;
+  /* Apply object returned by `useAnimatedStyle` to the background */
+  background?: Animated.AnimateStyle<ViewStyle>;
+};
+
+type FooterActionsProps = WithTestID<
+  PropsWithChildren<{
+    actions?: FooterActions;
+    onMeasure?: (measurements: FooterActionsMeasurements) => void;
+    animatedStyles?: FooterAnimatedStyles;
+    /* Make the background transparent */
+    transparent?: boolean;
+    /* Don't include safe area insets */
+    excludeSafeAreaMargins?: boolean;
+    /* Fixed at the bottom of the screen */
+    fixed?: boolean;
+    /* Show the following elements:
+       - Opaque red background to show the component boundaries
+       - Height of the component */
+    debugMode?: boolean;
+  }>
+>;
+
+/* Margin between ButtonSolid and ButtonOutline */
+const spaceBetweenActions: IOSpacer = 16;
+/* Margin between ButtonSolid and ButtonLink */
+const spaceBetweenActionAndLink: IOSpacer = 16;
+
+const styles = StyleSheet.create({
+  buttonContainer: {
+    paddingHorizontal: IOVisualCostants.appMarginDefault,
+    width: "100%",
+    flexShrink: 0
+  },
+  debugText: {
+    position: "absolute",
+    right: 8,
+    top: -16,
+    color: IOColors.black,
+    fontSize: 9,
+    opacity: 0.75
+  },
+  blockShadow: {
+    shadowColor: IOColors.black,
+    shadowOffset: {
+      width: 0,
+      height: -4
+    },
+    shadowOpacity: 0.1,
+    shadowRadius: 32
+  }
+});
+
+export const FooterActions = ({
+  actions,
+  excludeSafeAreaMargins = false,
+  animatedStyles,
+  fixed = true,
+  transparent = false,
+  onMeasure,
+  testID,
+  debugMode = false
+}: FooterActionsProps) => {
+  const theme = useIOTheme();
+  const { isExperimental } = useIOExperimentalDesign();
+
+  const { bottomMargin, extraBottomMargin } = useBottomMargins(
+    !!actions?.secondary,
+    excludeSafeAreaMargins
+  );
+
+  /* Total height of actions */
+  const [actionBlockHeight, setActionBlockHeight] =
+    useState<LayoutRectangle["height"]>(0);
+
+  /* Background color should be app main background
+     (both light and dark themes) */
+  const HEADER_BG_COLOR: ColorValue = IOColors[theme["appBackground-primary"]];
+  const TRANSPARENT_BG_COLOR: ColorValue = "transparent";
+  const BUTTONSOLID_HEIGHT = isExperimental ? buttonSolidHeight : 40;
+
+  /* Safe background block. Cover everything until it reaches
+     the half of the primary action button. It avoids
+     glitchy behavior underneath.  */
+  const safeBackgroundBlockHeight =
+    bottomMargin + actionBlockHeight - BUTTONSOLID_HEIGHT / 2;
+
+  const getActionBlockMeasurements = (event: LayoutChangeEvent) => {
+    const { height } = event.nativeEvent.layout;
+    setActionBlockHeight(height);
+    /* Height of the safe bottom area, applied to the ScrollView:
+       Actions + Content end margin */
+    const safeBottomAreaHeight =
+      bottomMargin + height + IOSpacing.screenEndMargin;
+    onMeasure?.({ actionBlockHeight: height, safeBottomAreaHeight });
+  };
+
+  return (
+    <Animated.View
+      style={[
+        {
+          width: "100%",
+          paddingBottom: bottomMargin
+        },
+        fixed
+          ? { position: "absolute", bottom: 0 }
+          : { marginTop: IOSpacing.screenEndMargin },
+        debugMode && {
+          backgroundColor: hexToRgba(IOColors["error-500"], 0.15)
+        },
+        animatedStyles?.mainBlock
+      ]}
+      testID={testID}
+    >
+      {/* Safe background block. It's added because when you swipe up
+          quickly, the content below is visible for about 100ms. Without this
+          block, the content scrolls underneath. */}
+      <Animated.View
+        style={[
+          {
+            ...(fixed && {
+              width: "100%",
+              height: safeBackgroundBlockHeight,
+              position: "absolute",
+              bottom: 0,
+              backgroundColor: transparent
+                ? TRANSPARENT_BG_COLOR
+                : HEADER_BG_COLOR
+            }),
+            ...(fixed ? styles.blockShadow : null)
+          },
+          animatedStyles?.background
+        ]}
+        pointerEvents="none"
+      />
+
+      <View
+        style={styles.buttonContainer}
+        onLayout={getActionBlockMeasurements}
+        pointerEvents="box-none"
+      >
+        {debugMode && (
+          <Text style={styles.debugText}>{`Height: ${actionBlockHeight}`}</Text>
+        )}
+
+        {renderActions(actions, extraBottomMargin)}
+      </View>
+    </Animated.View>
+  );
+};
+
+const renderActions = (
+  actions: FooterActions | undefined,
+  extraBottomMargin: number
+) => {
+  if (!actions) {
+    return null;
+  }
+  const {
+    type,
+    primary: primaryAction,
+    secondary: secondaryAction,
+    tertiary: tertiaryAction
+  } = actions;
+  return (
+    <Fragment>
+      {primaryAction && <ButtonSolid fullWidth {...primaryAction} />}
+      {type === "TwoButtons" && secondaryAction && (
+        <View style={{ alignSelf: "center", marginBottom: extraBottomMargin }}>
+          <VSpacer size={spaceBetweenActionAndLink} />
+          <ButtonLink color="primary" {...secondaryAction} />
+        </View>
+      )}
+      {type === "ThreeButtons" && (
+        <>
+          {secondaryAction && (
+            <>
+              <VSpacer size={spaceBetweenActions} />
+              <ButtonOutline fullWidth color="primary" {...secondaryAction} />
+            </>
+          )}
+          {tertiaryAction && (
+            <View
+              style={{ alignSelf: "center", marginBottom: extraBottomMargin }}
+            >
+              <VSpacer size={spaceBetweenActionAndLink} />
+              <ButtonLink color="primary" {...tertiaryAction} />
+            </View>
+          )}
+        </>
+      )}
+    </Fragment>
+  );
+};