@brightspace-ui/core 3.124.0 → 3.124.2

package/components/collapsible-panel/collapsible-panel.js

@@ -257,7 +257,7 @@ class CollapsiblePanel extends SkeletonMixin(FocusMixin(RtlMixin(LitElement))) {
 				transform-origin: 0.4rem;
 			}
 			:host([expanded]) d2l-icon-custom svg {
-				fill: var(--d2l-color-tungsten);
+				fill: currentColor;
 				transform: rotate(90deg);
 			}
 			@media (prefers-reduced-motion: no-preference) {
@@ -457,7 +457,7 @@ class CollapsiblePanel extends SkeletonMixin(FocusMixin(RtlMixin(LitElement))) {
 					</div>
 					<d2l-icon-custom size="tier1" class="d2l-skeletize" aria-hidden="true">
 						<svg xmlns="http://www.w3.org/2000/svg" width="10" height="18" fill="none" viewBox="0 0 10 18">
-							<path stroke="var(--d2l-color-tungsten)" stroke-linejoin="round" stroke-width="2" d="m9 9-8 8V1l8 8Z"/>
+							<path stroke="currentColor" stroke-linejoin="round" stroke-width="2" d="m9 9-8 8V1l8 8Z"/>
 						</svg>
 					</d2l-icon-custom>
 				</div>

package/components/inputs/input-date-time-range-to.js

@@ -7,6 +7,14 @@ import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import ResizeObserver from 'resize-observer-polyfill/dist/ResizeObserver.es.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
 
+function debounce(func, delay) {
+	let timer = 0;
+	return function() {
+		clearTimeout(timer);
+		timer = setTimeout(func, delay);
+	};
+}
+
 class InputDateTimeRangeTo extends SkeletonMixin(LocalizeCoreElement(LitElement)) {
 
 	static get properties() {
@@ -169,13 +177,13 @@ class InputDateTimeRangeTo extends SkeletonMixin(LocalizeCoreElement(LitElement)
 		this._leftElemResizeObserver.disconnect();
 		this._leftElemResizeObserver.observe(leftElem);
 
-		this._parentElemResizeObserver = this._parentElemResizeObserver || new ResizeObserver(async() => {
+		this._parentElemResizeObserver = this._parentElemResizeObserver || new ResizeObserver(debounce(async() => {
 			this._blockDisplay = false;
 			await this.updateComplete;
 			const height = Math.ceil(parseFloat(getComputedStyle(container).getPropertyValue('height')));
 			if (height >= (leftElemHeight * 2)) this._blockDisplay = true; // switch to _blockDisplay styles if content has wrapped (needed for "to" to occupy its own line)
 			else this._blockDisplay = false;
-		});
+		}, 5).bind(this));
 		this._parentElemResizeObserver.disconnect();
 		this._parentElemResizeObserver.observe(this._parentNode);
 	}

package/components/switch/switch.js

@@ -1,7 +1,7 @@
 import '../colors/colors.js';
 import '../icons/icon.js';
 import '../icons/icon-custom.js';
-import { html, LitElement } from 'lit';
+import { css, html, LitElement } from 'lit';
 import { SwitchMixin } from './switch-mixin.js';
 
 /**
@@ -11,11 +11,19 @@ import { SwitchMixin } from './switch-mixin.js';
  */
 class Switch extends SwitchMixin(LitElement) {
 
+	static get styles() {
+		return [super.styles, css`
+			.d2l-switch-icon-off > d2l-icon-custom {
+				color: var(--d2l-color-ferrite);
+			}
+		`];
+	}
+
 	get offIcon() {
 		return html`
 			<d2l-icon-custom size="tier1">
 				<svg viewBox="0 0 18 18" height="18" width="18" xmlns="http://www.w3.org/2000/svg">
-					<circle cx="9" cy="9" r="6" stroke="var(--d2l-color-ferrite)" stroke-width="3" fill="none" />
+					<circle cx="9" cy="9" r="6" stroke="currentColor" stroke-width="3" fill="none" />
 				</svg>
 			</d2l-icon-custom>
 		`;

package/package.json

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