[IOAPPX-415] Remove the legacy UI + Add the new useIONewTypeface ho…

…ok to manage new and legacy typography (#345) ## Short description This PR completely removes the legacy UI by removing all the logic introduced to manage the new and old views simultaneously. It also adds the new `useIONewTypeface` hook to manage the legacy and new typography. ## List of changes proposed in this pull request - Remove the legacy styles from all the components - Replace `isExperimental` with `newTypefaceEnabled` in all the typographic styles ## How to test 1. Launch the example app 2. You should no longer need to activate the experimental DS 3. Test the components by enabling/disabling the new typeface toggle 4. Check that all the components are OK
pagopa · Jan 8, 2025 · 487f1fa · 487f1fa
1 parent 550f348
commit 487f1fa
Show file tree

Hide file tree

Showing 65 changed files with 1,103 additions and 1,914 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -4,20 +4,28 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
-#### [v4.4.4](https://github.com/pagopa/io-app-design-system/compare/v5.0.0-0...v4.4.4)
+#### [v5.0.0-1](https://github.com/pagopa/io-app-design-system/compare/v5.0.0-0...v5.0.0-1)
 
 - Add `numberOfLines` and `textAlign` props to `ButtonLink` [`#375`](https://github.com/pagopa/io-app-design-system/pull/375)
 - Skip the `entering` transition on the first render of `ButtonSolid` [`#374`](https://github.com/pagopa/io-app-design-system/pull/374)
 - chore: release 4.4.3 [`58ea9e9`](https://github.com/pagopa/io-app-design-system/commit/58ea9e96bd87ab4ab2b78cfabd8efc7ed357f25a)
+- chore: release 4.4.4 [`3a52bb7`](https://github.com/pagopa/io-app-design-system/commit/3a52bb766c40e79f178685fff0b05b7eb0ccdc36)
 
-#### [v5.0.0-0](https://github.com/pagopa/io-app-design-system/compare/v4.4.3...v5.0.0-0)
+#### [v5.0.0-0](https://github.com/pagopa/io-app-design-system/compare/v4.4.4...v5.0.0-0)
 
 > 20 December 2024
 
 - Remove legacy styles from buttons [`d0ca275`](https://github.com/pagopa/io-app-design-system/commit/d0ca275ea9f1ec810d5afabde2392413791e3a9c)
 - Update `jest` snapshots [`47d1f88`](https://github.com/pagopa/io-app-design-system/commit/47d1f88c017bc69b245c6996f61884e396bb8dc5)
 - Update `jest` snapshots [`30076b9`](https://github.com/pagopa/io-app-design-system/commit/30076b93887ccf211ad03a02e4ed2700997b1300)
 
+#### [v4.4.4](https://github.com/pagopa/io-app-design-system/compare/v4.4.3...v4.4.4)
+
+> 7 January 2025
+
+- Add `numberOfLines` and `textAlign` props to `ButtonLink` [`#375`](https://github.com/pagopa/io-app-design-system/pull/375)
+- chore: release 4.4.4 [`3a52bb7`](https://github.com/pagopa/io-app-design-system/commit/3a52bb766c40e79f178685fff0b05b7eb0ccdc36)
+
 #### [v4.4.3](https://github.com/pagopa/io-app-design-system/compare/v4.4.2...v4.4.3)
 
 > 20 December 2024

diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -1,14 +1,15 @@
 import {
   IODSExperimentalContextProvider,
+  IONewTypefaceContextProvider,
   IOThemeContextProvider,
   ToastProvider
 } from "@pagopa/io-app-design-system";
 import * as React from "react";
 import { useColorScheme } from "react-native";
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 import { SafeAreaProvider } from "react-native-safe-area-context";
-import AppNavigator from "./navigation/navigator";
 import { StatusBannerProvider } from "./components/StatusBannerProvider";
+import AppNavigator from "./navigation/navigator";
 
 export default function App() {
   const colorScheme = useColorScheme();
@@ -17,15 +18,17 @@ export default function App() {
     <GestureHandlerRootView style={{ flex: 1 }}>
       <SafeAreaProvider>
         <IODSExperimentalContextProvider>
-          <IOThemeContextProvider
-            theme={colorScheme === "dark" ? "dark" : "light"}
-          >
-            <StatusBannerProvider>
-              <ToastProvider>
-                <AppNavigator />
-              </ToastProvider>
-            </StatusBannerProvider>
-          </IOThemeContextProvider>
+          <IONewTypefaceContextProvider>
+            <IOThemeContextProvider
+              theme={colorScheme === "dark" ? "dark" : "light"}
+            >
+              <StatusBannerProvider>
+                <ToastProvider>
+                  <AppNavigator />
+                </ToastProvider>
+              </StatusBannerProvider>
+            </IOThemeContextProvider>
+          </IONewTypefaceContextProvider>
         </IODSExperimentalContextProvider>
       </SafeAreaProvider>
     </GestureHandlerRootView>

diff --git a/example/src/pages/Accordion.tsx b/example/src/pages/Accordion.tsx
@@ -1,17 +1,11 @@
 import {
   AccordionItem,
   Body,
-  H3,
-  H5,
-  IOColors,
-  IOStyles,
   IOVisualCostants,
-  Icon,
-  RawAccordion,
   VSpacer
 } from "@pagopa/io-app-design-system";
 import * as React from "react";
-import { FlatList, ListRenderItemInfo, View } from "react-native";
+import { FlatList, ListRenderItemInfo } from "react-native";
 import { Screen } from "../components/Screen";
 
 const assistanceData: Array<AccordionItem> = [
@@ -81,53 +75,6 @@ export const Accordion = () => {
         keyExtractor={(item, index) => `${item.title}-${index}`}
         renderItem={renderItem}
       />
-
-      {renderRawAccordion()}
     </Screen>
   );
 };
-
-const renderRawAccordion = () => (
-  <>
-    <VSpacer size={40} />
-    <H3>RawAccordion</H3>
-    <VSpacer size={16} />
-    <View style={[IOStyles.flex, { width: "100%" }]}>
-      <RawAccordion
-        headerStyle={{
-          paddingVertical: 16,
-          backgroundColor: IOColors.greyLight
-        }}
-        header={
-          <View style={IOStyles.row}>
-            <Icon name="productIOApp" size={24} color="grey-650" />
-            <H3 style={{ alignSelf: "center" }}>{"Custom header "}</H3>
-            <H5 style={{ alignSelf: "center" }}>{"Purgatorio, Canto VI"}</H5>
-          </View>
-        }
-      >
-        <Body>
-          {"Ahi serva Italia, di dolore ostello, \n" +
-            "nave sanza nocchiere in gran tempesta, \n" +
-            "non donna di province, ma bordello!" +
-            "\n\n" +
-            "Quell’anima gentil fu così presta, \n" +
-            "sol per lo dolce suon de la sua terra, \n" +
-            "di fare al cittadin suo quivi festa;" +
-            "\n\n" +
-            "e ora in te non stanno sanza guerra \n" +
-            "li vivi tuoi, e l’un l’altro si rode \n" +
-            "di quei ch’un muro e una fossa serra." +
-            "\n\n" +
-            "Cerca, misera, intorno da le prode \n" +
-            "le tue marine, e poi ti guarda in seno, \n" +
-            "s’alcuna parte in te di pace gode." +
-            "\n\n" +
-            "Che val perché ti racconciasse il freno \n" +
-            "Iustiniano, se la sella è vota? \n" +
-            "Sanz’esso fora la vergogna meno."}
-        </Body>
-      </RawAccordion>
-    </View>
-  </>
-);