chore(Cross): [IOAPPX-300] Add `FooterActions` that replaces `FooterWithButtons`

[dmnplb]

trafficstars

Description

This PR adds the new FooterActions component which completely replaces the legacy FooterWithButtons. The new component is designed to work flawlessly in different scenarios:

• Fixed behaviour (at the bottom of the screen)
• Without fixed behaviour (through fixed prop set to false)
• Sticky behaviour (as required by the new MessageDetail template)
• Without additional safe margins (as required in special scenarios, such as the BottomSheet component)

[!important] The component also returns two values: actionBlockHeight (the height of the block containing actions) and safeBottomAreaHeight (the height of the entire block, including the bottom content margin). The latter must be applied to the ScrollView as bottomPadding value to ensure that the content is not hidden underneath it. Based on the button configuration, this value is dynamically adjusted.

Last but not least, the component also accepts two different animatedStyles (main component and relative background) if you need to set custom transitions using the reanimated library (advanced use). If you want to see an example, check out the Sticky behaviour

[!note] After an initial testing period, the component will be removed from this codebase and included in the io-app-design-system package.

List of changes proposed in this pull request

• Add the new FooterActions component
• Add different example screens in the Debug section (DS)
• Add debugMode that shows opaque red background and total height of the component
• Move IOScrollView screens from Screens to Debug (DS)
• Make some DS screens dark mode compliant
• [extra] Set myself (@dmnplb) as code owner for ui components folder
• [extra] Fix prop configuration in the IOScrollView component

Preview

Default	Not fixed	Sticky

How to test

1. Launch the app in the local environment
2. Go to the Design System → Footer Actions … (under Debug section)
3. Check all the different examples

[pagopa-github-bot]

Affected stories

• ⚙️ IOAPPX-300: FooterActions, sostituto di FooterWithButtons subtask of
  • ⚡ IOAPPX-32: Design System

Generated by :no_entry_sign: dangerJS against d91737c8d67774403e2fb0a5dd1d6d76c3d1c233

[codecov[bot]]

Codecov Report

Attention: Patch coverage is 14.77273% with 75 lines in your changes are missing coverage. Please review.

Project coverage is 49.40%. Comparing base (4f204b4) to head (d91737c). Report is 102 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #5787      +/-   ##
==========================================
+ Coverage   48.42%   49.40%   +0.98%     
==========================================
  Files        1488     1627     +139     
  Lines       31617    32427     +810     
  Branches     7669     7795     +126     
==========================================
+ Hits        15311    16022     +711     
- Misses      16238    16351     +113     
+ Partials       68       54      -14     

Files	Coverage Δ
ts/components/ui/IOScrollView.tsx	10.25% <ø> (ø)
ts/features/design-system/navigation/navigator.tsx	18.75% <ø> (-4.11%)	:arrow_down:
ts/features/design-system/navigation/routes.ts	100.00% <ø> (ø)
ts/screens/profile/DeveloperModeSection.tsx	4.37% <0.00%> (-0.10%)	:arrow_down:
...res/design-system/core/DSFooterActionsNotFixed.tsx	42.85% <42.85%> (ø)
ts/features/design-system/core/DSFooterActions.tsx	27.27% <27.27%> (ø)
...tures/design-system/core/DSFooterActionsSticky.tsx	11.53% <11.11%> (ø)
ts/components/ui/FooterActions.tsx	10.00% <10.00%> (ø)

... and 545 files with indirect coverage changes

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 98aa311...d91737c. Read the comment docs.