Accessibility: Widgets: Make the "Available Widgets" section operable with a keyboard.

For a number of years, the "Available Widgets" section has been off-limits for
keyboard users. Now it can be used also with the keyboard. This change introduces
also some improvements for assistive technologies.

- makes the widget toggles focusable and adds an `aria-expanded` attribute to indicate their state
- improves the toggles labelling to clarify context (add/edit)
- changes the controls to choose a sidebar from list items to buttons
- adds an `aria-label` attribute to the buttons to clarify their purpose
- adds an `aria-pressed` attribute to the buttons to indicate which one is selected
- improves color contrast of the selected button
- uses a `wp.a11y.speak()` message to announce to screen reader users when a widget has been added to a sidebar
- moves focus back to the toggle button when closing a widget

See #40677.


git-svn-id: https://develop.svn.wordpress.org/trunk@42794 602fd350-edb4-49c9-b593-d223f7449a82

src/wp-admin/css/common.css

@@ -3368,7 +3368,8 @@ img {
 .control-section.open .accordion-section-title:after,
 #customize-info.open .accordion-section-title:after,
 .nav-menus-php .menu-item-edit-active .item-edit:before,
-.widget.open .widget-top .widget-action .toggle-indicator:before {
+.widget.open .widget-top .widget-action .toggle-indicator:before,
+.widget.widget-in-question .widget-top .widget-action .toggle-indicator:before  {
 	content: "\f142";
 }