@brightspace-ui/core 1.220.5 → 1.221.0

package/components/dropdown/dropdown-content-mixin.js

@@ -14,6 +14,8 @@ import { tryGetIfrauBackdropService } from '../../helpers/ifrauBackdropService.j
 const reduceMotion = matchMedia('(prefers-reduced-motion: reduce)').matches;
 const minBackdropHeightMobile = 42;
 const minBackdropWidthMobile = 30;
+const outerMarginTopBottom = 18;
+const defaultVerticalOffset = 20;
 
 export const DropdownContentMixin = superclass => class extends LocalizeCoreElement(RtlMixin(superclass)) {
 
@@ -264,6 +266,7 @@ export const DropdownContentMixin = superclass => class extends LocalizeCoreElem
 		this._hasHeader = false;
 		this._hasFooter = false;
 		this._showBackdrop = false;
+		this._verticalOffset = defaultVerticalOffset;
 
 		this.__onResize = this.__onResize.bind(this);
 		this.__onAutoCloseFocus = this.__onAutoCloseFocus.bind(this);
@@ -324,9 +327,10 @@ export const DropdownContentMixin = superclass => class extends LocalizeCoreElem
 			if (propName === 'verticalOffset') {
 				let newVerticalOffset = parseInt(this.verticalOffset);
 				if (isNaN(newVerticalOffset)) {
-					newVerticalOffset = 20;
+					newVerticalOffset = defaultVerticalOffset;
 				}
 				this.style.setProperty('--d2l-dropdown-verticaloffset', `${newVerticalOffset}px`);
+				this._verticalOffset = newVerticalOffset;
 			}
 		});
 	}
@@ -616,9 +620,9 @@ export const DropdownContentMixin = superclass => class extends LocalizeCoreElem
 			if (bounded) {
 				spaceAround = this._constrainSpaceAround({
 					// allow for target offset + outer margin
-					above: targetRect.top - boundingContainerRect.top - 40,
+					above: targetRect.top - boundingContainerRect.top - this._verticalOffset - outerMarginTopBottom,
 					// allow for target offset + outer margin
-					below: boundingContainerRect.bottom - targetRect.bottom - 40,
+					below: boundingContainerRect.bottom - targetRect.bottom - this._verticalOffset - outerMarginTopBottom,
 					// allow for outer margin
 					left: targetRect.left - boundingContainerRect.left - 20,
 					// allow for outer margin
@@ -631,9 +635,9 @@ export const DropdownContentMixin = superclass => class extends LocalizeCoreElem
 			} else {
 				spaceAround = this._constrainSpaceAround({
 					// allow for target offset + outer margin
-					above: targetRect.top - 50,
+					above: targetRect.top - this._verticalOffset - outerMarginTopBottom,
 					// allow for target offset + outer margin
-					below: window.innerHeight - targetRect.bottom - 80,
+					below: window.innerHeight - targetRect.bottom - this._verticalOffset - outerMarginTopBottom,
 					// allow for outer margin
 					left: targetRect.left - 20,
 					// allow for outer margin

package/package.json

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