FIX: Replace the AM/PM toggle ButtonGroup with ToggleGroupControl.

[patil-vipul]

What?

Fixes https://github.com/WordPress/gutenberg/issues/61298

Why?

When the is12Hour={true} setting is enabled, the AM/PM toggle relies solely on visual cues to convey its state, which presents a challenge for screen readers. This design overlooks accessibility needs, potentially creating barriers for users who rely on such assistive technologies.

How?

The previous ButtonGroup for toggling between AM/PM is replaced with ToggleGroupControl for better accessibility.

Testing Instructions

• Create a new post and add the Date block.
• Make sure your site is configured for 12 Hrs Time Format from the Settings >> General
• Now edit the time on the date block using the "Edit" option (pencil icon) in the Block Controls Toolbar.
• Test using the screen reader to read aloud the intended use of ToggleGroupControl.

Testing Instructions for Keyboard

• Create a new post and add the Date block.
• Make sure your site is configured for 12 Hrs Time Format from the Settings >> General
• Now edit the time on the date block using the "Edit" option (pencil icon) in the Block Controls Toolbar.
• Navigate to AM/PM selector using Tab key.
• Once on AM/PM selector you can toggle between the two states using arrow keys.
• To select the highlighted option press Spacebar.

Screenshots or screencast

[github-actions[bot]]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Unlinked Accounts

The following contributors have not linked their GitHub and WordPress.org accounts: @gutenbergplugin.

Contributors, please read how to link your accounts to ensure your work is properly credited in WordPress releases.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Unlinked contributors: gutenbergplugin.

Co-authored-by: afercia <[email protected]>
Co-authored-by: Mamaduka <[email protected]>
Co-authored-by: richtabor <[email protected]>
Co-authored-by: amitraj2203 <[email protected]>
Co-authored-by: jorgefilipecosta <[email protected]>
Co-authored-by: ntsekouras <[email protected]>
Co-authored-by: sirreal <[email protected]>
Co-authored-by: youknowriad <[email protected]>
Co-authored-by: tyxla <[email protected]>
Co-authored-by: ockham <[email protected]>
Co-authored-by: narenin <[email protected]>
Co-authored-by: draganescu <[email protected]>
Co-authored-by: geriux <[email protected]>
Co-authored-by: colorful-tones <[email protected]>
Co-authored-by: tellthemachines <[email protected]>
Co-authored-by: aaronrobertshaw <[email protected]>
Co-authored-by: carolinan <[email protected]>
Co-authored-by: ajlende <[email protected]>
Co-authored-by: t-hamano <[email protected]>
Co-authored-by: ellatrix <[email protected]>
Co-authored-by: jameskoster <[email protected]>
Co-authored-by: jeryj <[email protected]>
Co-authored-by: nateinaction <[email protected]>
Co-authored-by: Aljullu <[email protected]>
Co-authored-by: SantosGuillamot <[email protected]>
Co-authored-by: senadir <[email protected]>
Co-authored-by: kevin940726 <[email protected]>
Co-authored-by: artemiomorales <[email protected]>
Co-authored-by: jasmussen <[email protected]>
Co-authored-by: shail-mehta <[email protected]>
Co-authored-by: mirka <[email protected]>
Co-authored-by: ramonjd <[email protected]>
Co-authored-by: stokesman <[email protected]>
Co-authored-by: andrewserong <[email protected]>
Co-authored-by: patil-vipul <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[github-actions[bot]]

:wave: Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @patil-vipul! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

[ciampo]

Hey @mirka , I lost track of whether this improvement was ever applied in a different PR. In case it hasn't, do you think it's good for us to pick the task up and apply it?

[mirka]

@ciampo There are some folks in #61163 volunteering to pick this up, FWIW.

@patil-vipul Are you still willing to re-submit your PR?