refactor: updated Input and TextField to align with mobile fixes

[brianacnguyen]

Description

Related issues

Fixes:

Manual testing steps

1. Go to this page...

Screenshots/Recordings

Before

After

Pre-merge author checklist

• I've followed MetaMask Contributor Docs
• I've completed the PR template to the best of my ability
• I’ve included tests if applicable
• I’ve documented my code using JSDoc format if applicable
• I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

---

Note

Medium Risk
Medium risk because it changes Input typography styling (removing text-* utility usage in favor of explicit metrics) and alters TextField public API/styling by removing TextFieldSize and adjusting borders/heights, which may affect consumers’ layout and visual states.

Overview
Updates Input typography handling by introducing MAP_TEXT_VARIANT_INPUT_METRICS (fontSize/letterSpacing without lineHeight) and applying it directly, keeping the iOS placeholder lineHeight: 0 workaround scoped to placeholder-visible state.

Refactors TextField to a fixed 48px height (removing TextFieldSize and related exports/docs/stories), tweaks container styling (muted background and new border color logic for focus/error/disabled), forces the inner Input to be single-line with a 46px height, and adds startAccessoryTestID/endAccessoryTestID with new/updated tests and Storybook using controlled wrappers.

^{Written by Cursor Bugbot for commit f0b95db. This will update automatically on new commits. Configure here.}

[github-actions]

📖 Storybook Preview

• View PR Storybook