Description

This PR migrates usages of HeaderStackedStandard to HeaderCompactStandard and TitleStandard, then removes the HeaderStackedStandard component from app/component-library/components-temp/.

Reason for change: Preparing to deprecate HeaderStackedStandard. Replacing it with HeaderCompactStandard (button row) + TitleStandard (title block) preserves the same layout and spacings (px-2 on the header row, px-4 pt-1 pb-3 on the title section) while using the preferred components.

What changed:

1. View migrations (3 files)

   • ImportNewSecretRecoveryPhrase – Replaced HeaderStackedStandard with HeaderCompactStandard (back + QR button) and TitleStandard (title + bottomAccessory), props inlined.
   • ConnectHardware/SelectHardware – Same pattern: HeaderCompactStandard (onBack) + TitleStandard (title, bottomAccessory), props inlined.
   • ImportPrivateKey – Same pattern: HeaderCompactStandard (backButtonProps) + TitleStandard (title, bottomAccessory), props inlined.
   • No Box wrappers; header and title are direct siblings of their parent. Spacing applied via twClassName="px-4 pt-1 pb-3" on TitleStandard.

2. Removed HeaderStackedStandard

   • Deleted app/component-library/components-temp/HeaderStackedStandard/ (index, types, component, stories, test).
   • Removed its story require() from .storybook/storybook.requires.js.

No other app code used HeaderStackedStandard; removal is limited to the three views above and the component folder.

Changelog

This PR is not end-user-facing; it refactors internal header usage and removes one header component.

CHANGELOG entry: null

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/DSYS-496

Manual testing steps

Feature: HeaderStackedStandard replaced with HeaderCompactStandard + TitleStandard

  Scenario: Lint and type check pass
    Given the branch is checked out
    When the author runs yarn lint and yarn lint:tsc
    Then both complete without errors

  Scenario: No references to HeaderStackedStandard
    Given the codebase is searched for HeaderStackedStandard
    Then no imports or usages remain

  Scenario: Migrated screens render correctly
    Given the app is running
    When the user opens Import Secret Recovery Phrase, Connect Hardware (Select Hardware), or Import Private Key
    Then the header shows the same back/close/actions and title section layout and spacing as before

Screenshots/Recordings

Before

N/A – layout unchanged; only implementation (component swap) changed.

After

N/A – same header appearance and spacing on the three screens.

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Mobile Coding Standards.
• 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.