@brightspace-ui/core 2.86.4 → 2.86.5

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

@@ -129,6 +129,12 @@ export const ListItemCheckboxMixin = superclass => class extends SkeletonMixin(s
 		}
 	}
 
+	_onCheckboxKeyDown(e) {
+		// handle the enter key
+		if (e.keyCode !== 13) return;
+		this.selected = !this.selected;
+	}
+
 	_onMouseEnterSelection() {
 		this._hoveringSelection = !this.selectionDisabled;
 	}
@@ -150,24 +156,25 @@ export const ListItemCheckboxMixin = superclass => class extends SkeletonMixin(s
 		return this.selectable ? html`
 			<d2l-selection-input
 				@d2l-selection-change="${this._onCheckboxChange}"
-				?selected="${this.selected}"
 				?disabled="${this.selectionDisabled}"
+				.hovering="${this._hoveringSelection}"
 				id="${this._checkboxId}"
 				?_indeterminate="${this.selectionInfo.state === SelectionInfo.states.some}"
 				key="${this.key}"
+				@keydown="${this._onCheckboxKeyDown}"
 				label="${this.label}"
-				?skeleton="${this.skeleton}"
-				.hovering="${this._hoveringSelection}">
+				?selected="${this.selected}"
+				?skeleton="${this.skeleton}">
 			</d2l-selection-input>
 		` : nothing;
 	}
 
 	_renderCheckboxAction(inner) {
 		return this.selectable ? html`
-			<div @click="${this._onCheckboxActionClick}"
+			<div class="d2l-checkbox-action"
+				@click="${this._onCheckboxActionClick}"
 				@mouseenter="${this._onMouseEnterSelection}"
-				@mouseleave="${this._onMouseLeaveSelection}"
-				class="d2l-checkbox-action">
+				@mouseleave="${this._onMouseLeaveSelection}">
 				${inner}
 			</div>
 			` : nothing;

package/components/list/list-item-generic-layout.js

@@ -445,16 +445,10 @@ class ListItemGenericLayout extends RtlMixin(LitElement) {
 
 	_onKeydown(event) {
 		if (!this.gridActive) return;
+
 		let node = null;
 		let preventDefault = true;
 		switch (event.keyCode) {
-			case keyCodes.ENTER:
-			case keyCodes.SPACE:
-				node = getComposedActiveElement();
-				node.click();
-				// mouseup event is necessary for components like d2l-dropdown-more that control state by listening to this event
-				node.dispatchEvent(new MouseEvent('mouseup', { composed: true }));
-				break;
 			case keyCodes.RIGHT:
 				node = getComposedActiveElement();
 				if (this.dir === 'rtl') {

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

@@ -49,9 +49,21 @@ export const ListItemLinkMixin = superclass => class extends ListItemMixin(super
 		this.dispatchEvent(new CustomEvent('d2l-list-item-link-click', { bubbles: true }));
 	}
 
+	_handleLinkKeyDown(e) {
+		if (e.keyCode !== 32) return;
+		// handle the space key
+		e.preventDefault();
+		e.stopPropagation();
+		this.shadowRoot.querySelector(`#${this._primaryActionId}`).click();
+	}
+
 	_renderPrimaryAction(labelledBy) {
 		if (!this.actionHref) return;
-		return html`<a id="${this._primaryActionId}" aria-labelledby="${labelledBy}" href="${this.actionHref}" @click="${this._handleLinkClick}"></a>`;
+		return html`<a aria-labelledby="${labelledBy}"
+			@click="${this._handleLinkClick}"
+			href="${this.actionHref}"
+			id="${this._primaryActionId}"
+			@keydown="${this._handleLinkKeyDown}"></a>`;
 	}
 
 };

package/custom-elements.json

@@ -8181,11 +8181,6 @@
           "default": "false"
         }
       ],
-      "events": [
-        {
-          "name": "mouseup"
-        }
-      ],
       "slots": [
         {
           "name": "outside-control",

package/package.json

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