@brightspace-ui/core 3.83.1 → 3.85.0

package/components/backdrop/README.md

@@ -1,6 +1,6 @@
 # Backdrops
 
-The `d2l-backdrop` element displays a semi-transparent backdrop behind a specified sibling target element. It also hides elements other than the target from assistive technologies by applying `aria-hidden="true"`.
+Use a backdrop to de-emphasize background elements and draw the user's attention to a dialog or other modal content.
 
 ## Backdrop [d2l-backdrop]
 
@@ -42,4 +42,10 @@ Elements with `aria-hidden` applied (as well as their descendants) are completel
 
 **When showing a backdrop**: first move focus inside the target, then set the `shown` attribute on the backdrop.
 
-**When hiding a backdrop**: first remove the `shown` attribute on the backdrop, then if appropriate move focus outside the target.
+**When hiding a backdrop**: first remove the `shown` attribute on the backdrop, then if appropriate move focus outside the target.
+
+## Accessibility
+
+The backdrop hides background elements from screen reader users by setting `aria-hidden="true"` on all elements other than the target element specified in `for-target`.
+
+Before showing the backdrop, focus should be moved inside the target element — see [Focus Management](#focus-management) for more details.

package/components/focus-trap/README.md

@@ -4,7 +4,7 @@ This component assists with managing user focus within your web application.
 
 ## Focus Trap [d2l-focus-trap]
 
-The `d2l-focus-trap` is a generic container that will trap user focus from leaving. Focus will cycle to the first or last focusable elements when tabbing forwards or backwards respectively.  It will also capture focus from the document when actively trapping.
+The `d2l-focus-trap` is a generic container that will trap user focus from leaving. Focus will cycle to the first or last focusable elements when tabbing forwards or backwards respectively.  It will also capture focus from the document when actively trapping. The consumer entirely handles `trap` being enabled or not.
 
 <!-- docs: demo code properties name:d2l-focus-trap sandboxTitle:'Focus Trap' -->
 ```html
@@ -30,3 +30,9 @@ The `d2l-focus-trap` is a generic container that will trap user focus from leavi
 
 - `d2l-focus-trap-enter`: dispatched when focus enters the trap. May be used to override initial focus placement when focus enters the trap.
 <!-- docs: end hidden content -->
+
+## Accessibility
+
+Focus trapping should only be used in proper context, such as modal dialogs, where the user has an obvious way to exit via keyboard. For example, the [modal dialog w3c documentation](https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/) recommends that "the tab sequence of all dialogs include a visible element with role button that closes the dialog, such as a close icon or cancel button." 
+
+When using focus trapping, be wary of [SC 2.1.2 "No Keyboard Trap"](https://www.w3.org/TR/UNDERSTANDING-WCAG20/keyboard-operation-trapping.html), which discusses not trapping a user's keyboard focus such that they cannot leave and navigate the remainder of the page.

package/components/list/list-item-mixin.js

@@ -201,7 +201,7 @@ export const ListItemMixin = superclass => class extends composeMixins(
 			}
 			[slot="content"] {
 				display: flex;
-				justify-content: stretch;
+				justify-content: start;
 				padding: 0.55rem 0.55rem 0.55rem 0;
 			}
 			:host([dir="rtl"]) [slot="content"] {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brightspace-ui/core",
-  "version": "3.83.1",
+  "version": "3.85.0",
   "description": "A collection of accessible, free, open-source web components for building Brightspace applications",
   "type": "module",
   "repository": "https://github.com/BrightspaceUI/core.git",