feat(input): support dynamic type (#28184)

Issue number: N/A

---------

<!-- 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 current behavior?

`ion-input` does not support dynamic type.

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

`ion-input` supports dynamic type. Most of the sizing was already
inherited; only the helper text needed updating.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

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

---------

Co-authored-by: ionitron <[email protected]>

Author: averyjohnston

core/src/components/input/input.scss

@@ -346,7 +346,7 @@
 
   border-top: var(--border-width) var(--border-style) var(--border-color);
 
-  font-size: 12px;
+  font-size: dynamic-font(12px);
 }
 
 /**

core/src/components/input/test/a11y/input.e2e.ts

@@ -2,7 +2,7 @@ import AxeBuilder from '@axe-core/playwright';
 import { expect } from '@playwright/test';
 import { configs, test } from '@utils/test/playwright';
 
-configs({ directions: ['ltr'] }).forEach(({ title, config }) => {
+configs({ directions: ['ltr'] }).forEach(({ title, config, screenshot }) => {
   test.describe(title('input: a11y'), () => {
     test('should not have accessibility violations', async ({ page }) => {
       await page.goto(`/src/components/input/test/a11y`, config);
@@ -11,4 +11,23 @@ configs({ directions: ['ltr'] }).forEach(({ title, config }) => {
       expect(results.violations).toEqual([]);
     });
   });
+
+  test.describe(title('input: font scaling'), () => {
+    test('should scale text on larger font sizes', async ({ page }) => {
+      await page.setContent(
+        `
+          <style>
+            html {
+              font-size: 310%;
+            }
+          </style>
+          <ion-input label="Email" helper-text="Enter your email"></ion-input>
+        `,
+        config
+      );
+
+      const input = page.locator('ion-input');
+      await expect(input).toHaveScreenshot(screenshot('input-scale'));
+    });
+  });
 });