[Existing app][Contacts Import] Close keyboard and screen-reader gaps

[kryputh]

Summary

Improve the existing Contacts Import surface. This issue is intentionally scoped to existing app code and should not introduce a new standalone tool or unrelated feature.

Current area

import wizard steps, contact parser, malformed row handling, preview data, and contact import types

Relevant paths

• src/features/contacts/ImportWizard.tsx
• src/features/contacts/parseContacts.ts
• src/features/contacts/types.ts

Goal

improve the current contacts import wizard so contact data parsing is transparent and recoverable.

Work focus

Audit the existing surface for keyboard flow, focus order, visible focus, ARIA naming, reduced-motion behavior, and screen-reader clarity. Fix gaps in place without changing the core workflow.

Acceptance criteria

• All interactive controls are reachable and operable from the keyboard.
• Focus order matches the visual reading order and does not trap users unexpectedly.
• Icon-only controls have accessible names and stateful controls expose current state.
• Reduced-motion or non-animated fallback behavior is respected where motion exists.

Scope guardrails

• Keep the work inside the relevant existing app/module paths above unless a small shared helper is clearly justified.
• Do not add a new V1/V2 tool folder for this issue.
• Do not use real user data, secrets, private keys, or live customer mail.
• Keep copy and UI aligned with the Stealth Mail safety, speed, and sender-control positioning.

Suggested validation

• Run the most relevant unit or e2e tests for the touched area.
• Run �un x tsc --noEmit and �un run lint when the local environment supports the project dependency install.

[Babigdk]

Hi team,

I’m interested in working on this issue. I have experience improving frontend accessibility, form-heavy flows, and data parsing UX in production React applications.

For this task, I will:

• Audit the Import Wizard for keyboard navigation, focus order, and interaction flow
• Improve ARIA labels, icon-only control accessibility, and state clarity
• Ensure reduced-motion behavior is properly respected where animations exist
• Make malformed row handling and preview parsing more transparent and user-recoverable
• Keep all changes strictly within the existing contacts import modules
• Validate with relevant tests, tsc --noEmit, and lint checks

I will ensure the improvements enhance accessibility and usability without changing the core import workflow.

[gloskull]

Hello, I have 4 years of experience delivering solutions for projects like this, covering backend, frontend, and smart contract development. After carefully reviewing your requirements, I have a clear understanding of the task and am confident in my ability to deliver a clean, efficient, and thoroughly tested solution on time. I prioritize code quality, maintainability, and industry best practices throughout the development process.