@brightspace-ui/core 2.145.2 → 2.146.1

package/components/calendar/calendar.js

@@ -2,10 +2,10 @@ import '../button/button-icon.js';
 import '../colors/colors.js';
 import { bodySmallStyles, heading4Styles } from '../typography/styles.js';
 import { css, html, LitElement } from 'lit';
-import { formatDateInISO, getClosestValidDate, getDateFromDateObj, getDateFromISODate, getDateTimeDescriptorShared, getToday, isDateInRange } from '../../helpers/dateTime.js';
+import { formatDate, getDateTimeDescriptor } from '@brightspace-ui/intl/lib/dateTime.js';
+import { formatDateInISO, getClosestValidDate, getDateFromDateObj, getDateFromISODate, getToday, isDateInRange } from '../../helpers/dateTime.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { findComposedAncestor } from '../../helpers/dom.js';
-import { formatDate } from '@brightspace-ui/intl/lib/dateTime.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
@@ -29,15 +29,13 @@ const keyCodes = {
 const reduceMotion = matchMedia('(prefers-reduced-motion: reduce)').matches;
 
 let calendarData;
-function getCalendarData(refresh) {
-	if (!calendarData) {
-		calendarData = {};
-		calendarData.descriptor = getDateTimeDescriptorShared(refresh);
-		calendarData.firstDayOfWeek = calendarData.descriptor.calendar.firstDayOfWeek;
-		calendarData.daysOfWeekIndex = [];
-		for (let i = calendarData.firstDayOfWeek; i < calendarData.firstDayOfWeek + daysInWeek; i++) {
-			calendarData.daysOfWeekIndex.push(i % daysInWeek);
-		}
+function getCalendarData() {
+	calendarData = {};
+	calendarData.descriptor = getDateTimeDescriptor();
+	calendarData.firstDayOfWeek = calendarData.descriptor.calendar.firstDayOfWeek;
+	calendarData.daysOfWeekIndex = [];
+	for (let i = calendarData.firstDayOfWeek; i < calendarData.firstDayOfWeek + daysInWeek; i++) {
+		calendarData.daysOfWeekIndex.push(i % daysInWeek);
 	}
 	return calendarData;
 }
@@ -339,8 +337,8 @@ class Calendar extends LocalizeCoreElement(RtlMixin(LitElement)) {
 				background-color: var(--d2l-color-gypsum);
 			}
 
-			td:focus button:not(.d2l-calendar-date-selected):hover,
-			td:focus button:not(.d2l-calendar-date-selected).d2l-calendar-date-hover {
+			td:focus button:not(.d2l-calendar-date-selected):not(:disabled):hover,
+			td:focus button:not(.d2l-calendar-date-selected):not(:disabled).d2l-calendar-date-hover {
 				box-shadow: 0 0 0 2px var(--d2l-color-gypsum), 0 0 0 4px var(--d2l-color-celestine);
 				transition: none;
 			}
@@ -351,8 +349,11 @@ class Calendar extends LocalizeCoreElement(RtlMixin(LitElement)) {
 
 			td:focus .d2l-calendar-date {
 				border-radius: 0.16rem;
-				box-shadow: 0 0 0 2px white, 0 0 0 4px var(--d2l-color-celestine);
 				padding: 0;
+			}
+
+			td:focus .d2l-calendar-date:not(:disabled) {
+				box-shadow: 0 0 0 2px white, 0 0 0 4px var(--d2l-color-celestine);
 				transition: none;
 			}
 
@@ -423,8 +424,7 @@ class Calendar extends LocalizeCoreElement(RtlMixin(LitElement)) {
 		this.addEventListener('blur', () => this._isInitialFocusDate = true);
 
 		this.addEventListener('d2l-localize-resources-change', () => {
-			calendarData = null;
-			getCalendarData(true);
+			getCalendarData();
 			this.requestUpdate();
 		});
 

package/components/inputs/input-date.js

@@ -6,8 +6,8 @@ import '../icons/icon.js';
 import '../tooltip/tooltip.js';
 import './input-text.js';
 import { css, html, LitElement } from 'lit';
-import { formatDate, parseDate } from '@brightspace-ui/intl/lib/dateTime.js';
-import { formatDateInISO, getDateFromISODate, getDateTimeDescriptorShared, getToday } from '../../helpers/dateTime.js';
+import { formatDate, getDateTimeDescriptor, parseDate } from '@brightspace-ui/intl/lib/dateTime.js';
+import { formatDateInISO, getDateFromISODate, getToday } from '../../helpers/dateTime.js';
 import { FocusMixin } from '../../mixins/focus/focus-mixin.js';
 import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
@@ -165,7 +165,7 @@ class InputDate extends FocusMixin(LabelledMixin(SkeletonMixin(FormElementMixin(
 		this._showInfoTooltip = true;
 		this._shownValue = '';
 
-		this._dateTimeDescriptor = getDateTimeDescriptorShared();
+		this._dateTimeDescriptor = getDateTimeDescriptor();
 	}
 
 	static get focusElementSelector() {
@@ -208,7 +208,7 @@ class InputDate extends FocusMixin(LabelledMixin(SkeletonMixin(FormElementMixin(
 
 		this.addEventListener('blur', this._handleBlur);
 		this.addEventListener('d2l-localize-resources-change', () => {
-			this._dateTimeDescriptor = getDateTimeDescriptorShared(true);
+			this._dateTimeDescriptor = getDateTimeDescriptor();
 			this.requestUpdate();
 			this.updateComplete.then(() => tryUpdateHiddenContentWidth());
 		});

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

@@ -164,7 +164,7 @@ export const ListItemMixin = superclass => class extends composeMixins(
 				border-top: 0;
 			}
 
-			.d2l-list-item-content-extend-separators > [slot="control"] {
+			:host(:not([_render-expand-collapse-slot])) .d2l-list-item-content-extend-separators > [slot="control"] {
 				width: 3rem;
 			}
 			:host(:not([_has-color-slot])) .d2l-list-item-content-extend-separators > [slot="content"],
@@ -290,8 +290,8 @@ export const ListItemMixin = superclass => class extends composeMixins(
 			d2l-selection-input {
 				margin: 0.55rem 0.55rem 0.55rem 0;
 			}
-			.d2l-list-item-content-extend-separators d2l-selection-input {
-				margin-left: 0.9rem;
+			:host(:not([_render-expand-collapse-slot])) .d2l-list-item-content-extend-separators d2l-selection-input {
+				margin-inline-start: 0.9rem;
 			}
 
 			d2l-list-item-drag-handle {
@@ -301,9 +301,6 @@ export const ListItemMixin = superclass => class extends composeMixins(
 				margin-left: 0.9rem;
 				margin-right: 0;
 			}
-			:host([dir="rtl"]) .d2l-list-item-content-extend-separators d2l-selection-input {
-				margin-right: 0.9rem;
-			}
 
 			[slot="outside-control-container"] {
 				border: 1px solid transparent;
@@ -678,11 +675,12 @@ export const ListItemMixin = superclass => class extends composeMixins(
 			backgroundColor: this._hasColorSlot ? this.color : undefined
 		};
 
+		const alignNested = ((this.draggable && this.selectable) || (this.expandable && this.selectable && this.color)) ? 'control' : undefined;
 		const primaryAction = ((!this.noPrimaryAction && this._renderPrimaryAction) ? this._renderPrimaryAction(this._contentId) : null);
 		const tooltipForId = (primaryAction ? this._primaryActionId : (this.selectable ? this._checkboxId : null));
 		const innerView = html`
 			<d2l-list-item-generic-layout
-				align-nested="${ifDefined(this.draggable && this.selectable ? 'control' : undefined)}"
+				align-nested="${ifDefined(alignNested)}"
 				@focusin="${this._onFocusIn}"
 				@focusout="${this._onFocusOut}"
 				class="${classMap(classes)}"

package/helpers/dateTime.js

@@ -1,4 +1,4 @@
-import { convertLocalToUTCDateTime, convertUTCToLocalDateTime, getDateTimeDescriptor } from '@brightspace-ui/intl/lib/dateTime.js';
+import { convertLocalToUTCDateTime, convertUTCToLocalDateTime } from '@brightspace-ui/intl/lib/dateTime.js';
 
 // val is an object containing year, month, date
 export function formatDateInISO(val) {
@@ -139,12 +139,6 @@ export function getDateNoConversion(value) {
 	return new Date(parsed.year, parsed.month - 1, parsed.date, parsed.hours, parsed.minutes, parsed.seconds);
 }
 
-let dateTimeDescriptor = null;
-export function getDateTimeDescriptorShared(refresh) {
-	if (!dateTimeDescriptor || refresh) dateTimeDescriptor = getDateTimeDescriptor();
-	return dateTimeDescriptor;
-}
-
 export function getLocalDateTimeFromUTCDateTime(dateTime) {
 	const dateObj = parseISODateTime(dateTime);
 	const localDateTime = convertUTCToLocalDateTime(dateObj);

package/package.json

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