@brightspace-ui/core 3.144.1 → 3.144.2

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

@@ -4,6 +4,7 @@ import { findComposedAncestor, isComposedAncestor } from '../../helpers/dom.js';
 import { announce } from '../../helpers/announce.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { dragActions } from './list-item-drag-handle.js';
+import { getFlag } from '../../helpers/flags.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { SelectionInfo } from '../selection/selection-mixin.js';
@@ -21,6 +22,8 @@ export const moveLocations = Object.freeze({
 
 export const dropLocation = moveLocations; // backwards compatibility
 
+const dragDropMultipleFlag = getFlag('GAUD-7495-list-item-drag-drop-multiple', true);
+
 const dropTargetLeaveDelay = 1000; // ms
 const touchHoldDuration = 400; // length of time user needs to hold down touch before dragging occurs
 const scrollSensitivity = 150; // pixels between top/bottom of viewport to scroll for mobile
@@ -368,6 +371,9 @@ export const ListItemDragDropMixin = superclass => class extends superclass {
 		if (!this.key) {
 			this.draggable = false;
 		}
+
+		if (!dragDropMultipleFlag) return;
+		this._dragMultiple = this.getRootList()?.hasAttribute('drag-multiple');
 	}
 
 	firstUpdated(changedProperties) {
@@ -871,6 +877,12 @@ export const ListItemDragDropMixin = superclass => class extends superclass {
 		`) : nothing;
 	}
 
+	_renderDragMultipleImage() {
+		if (!dragDropMultipleFlag) return nothing;
+
+		return this._dragMultiple && this.draggable && (this.selectable || this.expandable) ? html`<d2l-list-item-drag-image></d2l-list-item-drag-image>` : nothing;
+	}
+
 	_renderDragTarget(templateMethod) {
 		templateMethod = templateMethod || (dragTarget => dragTarget);
 		return this.draggable && !this._keyboardActive ? templateMethod.call(this, html`

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

@@ -1,5 +1,6 @@
 import '../button/button-add.js';
 import '../colors/colors.js';
+import './list-item-drag-image.js';
 import './list-item-generic-layout.js';
 import './list-item-placement-marker.js';
 import '../tooltip/tooltip.js';
@@ -843,6 +844,7 @@ export const ListItemMixin = superclass => class extends composeMixins(
 			${this.draggable ? html`<div class="d2l-list-item-drag-image">${innerView}</div>` : innerView}
 			${this._renderBottomPlacementMarker(html`<d2l-list-item-placement-marker></d2l-list-item-placement-marker>`)}
 			${this._displayKeyboardTooltip && tooltipForId ? html`<d2l-tooltip align="start" announced for="${tooltipForId}" for-type="descriptor">${this.localizeHTML('components.list.keyboard')}</d2l-tooltip>` : ''}
+			${this.draggable ? this._renderDragMultipleImage() : nothing}
 		`;
 
 	}

package/package.json

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