@brightspace-ui/core 3.36.4 → 3.36.6

package/components/dialog/dialog-styles.js

@@ -152,7 +152,7 @@ export const dialogStyles = css`
 	.d2l-dialog-footer {
 		box-sizing: border-box;
 		flex: none;
-		padding: 30px 30px 12px 30px; /* 18px margin below footer children */
+		padding: 18px 30px 0 30px; /* 18px margin below footer children */
 		position: relative; /* stack footer overflow shadow on top of content */
 	}
 
@@ -183,6 +183,7 @@ export const dialogStyles = css`
 	}
 
 	@media (max-width: 615px), (max-height: 420px) and (max-width: 900px) {
+
 		.d2l-dialog-header {
 			padding: 14px 20px 16px 20px;
 		}
@@ -198,18 +199,19 @@ export const dialogStyles = css`
 			padding: 0 20px;
 		}
 		.d2l-dialog-footer {
-			padding: 20px 20px 2px 20px;
+			padding: 18px 20px 0 20px;
 		}
 		.d2l-dialog-outer.d2l-dialog-fullscreen-mobile {
 			margin: 0 !important;
 			min-width: calc(var(--d2l-vw, 1vw) * 100);
-			top: 42px;
+			top: 5%;
 		}
 		:host(:not([in-iframe])) dialog.d2l-dialog-outer.d2l-dialog-fullscreen-mobile,
 		:host(:not([in-iframe])) div.d2l-dialog-outer.d2l-dialog-fullscreen-mobile {
-			height: calc(var(--d2l-vh, 1vh) * 100 - 42px);
-			min-height: calc(var(--d2l-vh, 1vh) * 100 - 42px);
+			height: calc(var(--d2l-vh, 1vh) * 95);
+			min-height: calc(var(--d2l-vh, 1vh) * 95);
 		}
+
 	}
 
 	@media (prefers-reduced-motion: reduce) {

package/components/dialog/dialog.js

@@ -83,6 +83,15 @@ class Dialog extends LocalizeCoreElement(AsyncContainerMixin(DialogMixin(LitElem
 				padding: 0 0 5px 0;
 			}
 
+			@media (max-width: 615px), (max-height: 420px) and (max-width: 900px) {
+
+				.d2l-dialog-header,
+				:host([critical]) .d2l-dialog-header {
+					padding-bottom: 9px;
+				}
+
+			}
+
 		`];
 	}
 

package/components/focus-trap/focus-trap.js

@@ -117,8 +117,7 @@ class FocusTrap extends FocusMixin(LitElement) {
 			// user is exiting trap via forward tabbing...
 			const firstFocusable = getNextFocusable(this.shadowRoot.querySelector('.d2l-focus-trap-start'));
 			if (firstFocusable) {
-				// Delay to re-apply the focus effects as a visual clue when there is only one focusable element
-				setTimeout(() => firstFocusable.focus(), 50);
+				firstFocusable.focus();
 				return;
 			}
 		}
@@ -141,8 +140,7 @@ class FocusTrap extends FocusMixin(LitElement) {
 			// user is exiting trap via back tabbing...
 			const lastFocusable = getPreviousFocusable(this.shadowRoot.querySelector('.d2l-focus-trap-end'));
 			if (lastFocusable) {
-				// Delay to re-apply the focus effects as a visual clue when there is only one focusable element
-				setTimeout(() => lastFocusable.focus(), 50);
+				lastFocusable.focus();
 				return;
 			}
 		}

package/components/inputs/docs/input-search.md

@@ -82,7 +82,7 @@ When the input is cleared, the same event will be fired with an empty value.
 * `inline-help`: Help text that will appear below the input. Use this only when other helpful cues are not sufficient, such as a carefully-worded label.
 <!-- docs: end hidden content -->
 
-## Accessbility
+## Accessibility
 
 - While the component does not have a visible label, the search icon clearly indicates its purpose
 	- While not required to meet WCAG, this [pattern](https://www.w3.org/WAI/WCAG2/supplemental/patterns/o1p07-icons-used/) is a great way to help individuals with cognitive accessibility needs

package/package.json

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