Skip to content

Fix month/year dropdown layout, add minDate/maxDate - #80

Open
iamganeshkarki wants to merge 1 commit into
puncoz-official:mainfrom
iamganeshkarki:fix/dropdown-layout-mindate-maxdate-a11y
Open

Fix month/year dropdown layout, add minDate/maxDate#80
iamganeshkarki wants to merge 1 commit into
puncoz-official:mainfrom
iamganeshkarki:fix/dropdown-layout-mindate-maxdate-a11y

Conversation

@iamganeshkarki

Copy link
Copy Markdown

Fix month/year dropdown layout, add minDate/maxDate, keyboard + ARIA support

  • Fix month and year dropdowns being independently toggleable, which let both stay open at once; state is now lifted to CalenderController so opening one closes the other.
  • Fix header row layout: prev/next icons were pushed to the popup's far edges by justify-content: space-between, ending up far from the month/year controls; now grouped together with a fixed popup width so content doesn't overflow, capped for narrow/mobile viewports.
  • Re-enable the year dropdown's scroll-to-selected-year behavior (was dead/commented-out code), so opening it for an old date doesn't dump you at the top of a 130-year list.
  • Add minDate/maxDate props (AD date strings) that disable out-of-range days and the month navigation that would lead to them.
  • Add keyboard support (Enter/Space to activate, Escape to close and refocus the input) and ARIA attributes across the input, month/year triggers, dropdown options, day cells, and prev/next/today controls.
  • Convert prev/next/today controls from non-interactive to real elements for native keyboard operability.

…support

- Fix month and year dropdowns being independently toggleable, which let
  both stay open at once; state is now lifted to CalenderController so
  opening one closes the other.
- Fix header row layout: prev/next icons were pushed to the popup's far
  edges by justify-content: space-between, ending up far from the
  month/year controls; now grouped together with a fixed popup width so
  content doesn't overflow, capped for narrow/mobile viewports.
- Re-enable the year dropdown's scroll-to-selected-year behavior (was
  dead/commented-out code), so opening it for an old date doesn't dump
  you at the top of a 130-year list.
- Add minDate/maxDate props (AD date strings) that disable out-of-range
  days and the month navigation that would lead to them.
- Add keyboard support (Enter/Space to activate, Escape to close and
  refocus the input) and ARIA attributes across the input, month/year
  triggers, dropdown options, day cells, and prev/next/today controls.
- Convert prev/next/today controls from non-interactive <span> to real
  <button> elements for native keyboard operability.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant