fix(design-tokens): Add missing tokens and update usage on Typography (#29283)

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Updated missing font tokens on `_designTokens.json`.
- Updated `tokens.js` script for building utility-classes for newly
added font tokens.
- Fixed space token typo.
- Updated ionic.typography file to start using design tokens and remove
duplicated code from the tokens generated files.
- Updated Ionic Typography tests

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!--
  If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
  2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer
for more information.
-->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

core/src/foundations/ionic.root.scss

@@ -76,24 +76,37 @@
   --ionic-color-info-800: #02243c;
   --ionic-color-info-900: #020a0f;
   --ionic-color-info: #008bef;
-  --ionic-font-size-h1: 32px;
-  --ionic-font-size-h2: 28px;
-  --ionic-font-size-h3: 26px;
+  --ionic-font-family: "Inter", sans-serif;
+  --ionic-font-letter-spacing-none: 0em;
+  --ionic-font-letter-spacing-s: 0.1em;
+  --ionic-font-letter-spacing-m: 0.15em;
+  --ionic-font-line-height-xs: 16px;
+  --ionic-font-line-height-s: 20px;
+  --ionic-font-line-height-m: 24px;
+  --ionic-font-line-height-l: 28px;
+  --ionic-font-line-height-xl: 32px;
+  --ionic-font-line-height-xxl: 36px;
+  --ionic-font-line-height-display-s: 44px;
+  --ionic-font-line-height-display-m: 48px;
+  --ionic-font-size-h1: 28px;
+  --ionic-font-size-h2: 32px;
+  --ionic-font-size-h3: 24px;
   --ionic-font-size-h4: 22px;
   --ionic-font-size-h5: 20px;
   --ionic-font-size-h6: 18px;
-  --ionic-font-size-display: 36px;
-  --ionic-font-size-base: 16px;
-  --ionic-font-size-s: 14px;
-  --ionic-font-size-xs: 12px;
-  --ionic-font-light: 300;
-  --ionic-font-regular: 400;
-  --ionic-font-semi-bold: 600;
-  --ionic-font-bold: 700;
+  --ionic-font-size-display-s: 32px;
+  --ionic-font-size-display-m: 36px;
+  --ionic-font-size-s: 12px;
+  --ionic-font-size-m: 14px;
+  --ionic-font-size-l: 16px;
+  --ionic-font-weight-light: 300;
+  --ionic-font-weight-regular: 400;
+  --ionic-font-weight-semi-bold: 600;
+  --ionic-font-weight-bold: 700;
   --ionic-space-none: 0;
   --ionic-space-xxxxs: 2px;
   --ionic-space-xxxs: 4px;
-  --ionic-space-xss: 6px;
+  --ionic-space-xxs: 6px;
   --ionic-space-xs: 8px;
   --ionic-space-s: 12px;
   --ionic-space-base: 16px;