feat: enhance accessibility and functionality in Send Money flow

[TechBroAfrica]

closes #284

• Updated package.json to include additional test directories and axe-core for accessibility testing.
• Refactored Button component to support forwardRef and added aria-haspopup attribute for better accessibility.
• Improved Modal component with focus management, keyboard navigation, and ARIA attributes for enhanced accessibility.
• Enhanced Navbar component with appropriate aria-labels for navigation elements.
• Added visually hidden class for assistive technology announcements in index.css.
• Introduced new styles for confirmation dialogs in SendMoney.css.
• Implemented confirmation and result dialogs in SendMoney component with proper state management and accessibility features.
• Expanded integration tests for Send Money flow to cover keyboard-only interactions and accessibility checks.
• Created dedicated tests for Modal component to ensure focus management and accessibility compliance.
• Conducted automated accessibility audits using axe-core for various states of the Send Money flow.

Description

Motivation

Changes Made

Type of Change

• 🐛 Bug fix (non-breaking change that fixes an issue)
• ✨ New feature (non-breaking change that adds functionality)
• 💥 Breaking change (fix or feature that would cause existing functionality to not work as expected)
• 📝 Documentation update
• 🎨 Style/UI update (formatting, styling, no code change)
• ♻️ Code refactoring (no functional changes)
• ⚡ Performance improvement
• ✅ Test update (adding or updating tests)
• 🔧 Chore (dependencies, config, tooling)

Testing

• Tested locally in development mode
• All existing tests pass (npm test)
• Added new tests for the changes
• Tested in production build (npm run build && npm run preview)
• Lighthouse checks pass (if UI changes)

Test Evidence

Screenshots (if applicable)

Before

After

Accessibility

• Semantic HTML elements used
• ARIA labels added where needed
• Keyboard navigation tested
• Minimum 44×44px touch targets maintained
• Color contrast meets WCAG AA standards
• Screen reader tested (if applicable)

Checklist

• My code follows the project's style guidelines
• I have performed a self-review of my code
• I have commented my code where necessary
• I have updated the documentation accordingly
• My changes generate no new warnings or errors
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally
• Any dependent changes have been merged and published

Related Issues

Fixes #

Additional Notes

Breaking Changes

---