@brightspace-ui/core 1.239.1 → 1.241.0

package/components/alert/alert.js

@@ -4,7 +4,7 @@ import '../colors/colors.js';
 import { bodyCompactStyles, bodyStandardStyles } from '../typography/styles.js';
 import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { classMap } from 'lit-html/directives/class-map.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 
 /**

package/components/breadcrumbs/breadcrumbs.js

@@ -1,6 +1,6 @@
 import './breadcrumb.js';
 import { css, html, LitElement } from 'lit-element/lit-element.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 
 /**

package/components/calendar/calendar.js

@@ -8,7 +8,7 @@ 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-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { offscreenStyles } from '../offscreen/offscreen.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 

package/components/count-badge/count-badge-mixin.js

@@ -3,7 +3,7 @@ import '../tooltip/tooltip.js';
 import { css, html } from 'lit-element/lit-element.js';
 import { formatNumber } from '@brightspace-ui/intl/lib/number.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { offscreenStyles } from '../offscreen/offscreen.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';

package/components/dialog/dialog-fullscreen.js

@@ -7,7 +7,7 @@ import { classMap } from 'lit-html/directives/class-map.js';
 import { DialogMixin } from './dialog-mixin.js';
 import { dialogStyles } from './dialog-styles.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { styleMap } from 'lit-html/directives/style-map.js';
 
 const mediaQueryList = window.matchMedia('(max-width: 615px), (max-height: 420px) and (max-width: 900px)');

package/components/dialog/dialog.js

@@ -9,7 +9,7 @@ import { dialogStyles } from './dialog-styles.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { heading3Styles } from '../typography/styles.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { styleMap } from 'lit-html/directives/style-map.js';
 
 const mediaQueryList = window.matchMedia('(max-width: 615px), (max-height: 420px) and (max-width: 900px)');

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

@@ -6,7 +6,7 @@ import { findComposedAncestor, getBoundingAncestor, isComposedAncestor, isVisibl
 import { getComposedActiveElement, getFirstFocusableDescendant, getPreviousFocusableAncestor } from '../../helpers/focus.js';
 import { classMap } from 'lit-html/directives/class-map.js';
 import { html } from 'lit-element/lit-element.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { styleMap } from 'lit-html/directives/style-map.js';
 import { tryGetIfrauBackdropService } from '../../helpers/ifrauBackdropService.js';

package/components/filter/README.md

@@ -208,9 +208,9 @@ This component is built to be used alongside the [d2l-filter-dimension-set](#fil
 
 **Coming Soon!**
 
-## Filter Dimension: Tags [d2l-filter-dimension-tags]
+## Tags for Applied Filters [d2l-filter-tags]
 
-**Coming Soon!**
+**This is in progress now! Stable API expected by May.**
 
 <!-- docs: start hidden content -->
 ## Future Improvements

package/components/filter/filter.js

@@ -21,7 +21,7 @@ import { announce } from '../../helpers/announce.js';
 import { classMap } from 'lit-html/directives/class-map.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { offscreenStyles } from '../offscreen/offscreen.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SubscriberRegistryController } from '../../controllers/subscriber/subscriberControllers.js';

package/components/form/form-element-mixin.js

@@ -1,5 +1,5 @@
 import { isCustomFormElement } from './form-helper.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 
 export class FormElementValidityState {
 
@@ -118,6 +118,10 @@ export const FormElementMixin = superclass => class extends LocalizeCoreElement(
 		this._validationCustomConnected = this._validationCustomConnected.bind(this);
 		this._onFormElementErrorsChange = this._onFormElementErrorsChange.bind(this);
 
+		this._firstUpdateResolve = null;
+		this._firstUpdatePromise = new Promise((resolve) => {
+			this._firstUpdateResolve = resolve;
+		});
 		this._validationCustoms = new Set();
 		this._validity = new FormElementValidityState({});
 		/** @ignore */
@@ -168,6 +172,11 @@ export const FormElementMixin = superclass => class extends LocalizeCoreElement(
 		this.shadowRoot.removeEventListener('d2l-form-element-errors-change', this._onFormElementErrorsChange);
 	}
 
+	firstUpdated(changedProperties) {
+		super.firstUpdated(changedProperties);
+		this._firstUpdateResolve();
+	}
+
 	updated(changedProperties) {
 		if (changedProperties.has('_errors') || changedProperties.has('childErrors')) {
 			let errors = this._errors;
@@ -195,6 +204,11 @@ export const FormElementMixin = superclass => class extends LocalizeCoreElement(
 		if (this.noValidate) {
 			return [];
 		}
+
+		// validation can be requested before first update, which can cause issues
+		// if validation logic depends on rendered DOM
+		await this._firstUpdatePromise;
+
 		const customs = [...this._validationCustoms].filter(custom => custom.forElement === this || !isCustomFormElement(custom.forElement));
 		const results = await Promise.all(customs.map(custom => custom.validate()));
 		const errors = customs.map(custom => custom.failureText).filter((_, i) => !results[i]);

package/components/form/form-errory-summary.js

@@ -2,7 +2,7 @@ import '../alert/alert.js';
 import '../expand-collapse/expand-collapse-content.js';
 import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { linkStyles } from '../link/link.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 
 class FormErrorSummary extends LocalizeCoreElement(RtlMixin(LitElement)) {

package/components/form/form-mixin.js

@@ -4,7 +4,7 @@ import '../link/link.js';
 import { isCustomFormElement, isNativeFormElement } from './form-helper.js';
 import { getComposedActiveElement } from '../../helpers/focus.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { localizeFormElement } from './form-element-localize-helper.js';
 
 export const FormMixin = superclass => class extends LocalizeCoreElement(superclass) {
@@ -26,9 +26,13 @@ export const FormMixin = superclass => class extends LocalizeCoreElement(supercl
 		this._onNativeSubmit = this._onNativeSubmit.bind(this);
 
 		this.trackChanges = false;
+		this._errors = new Map();
+		this._firstUpdateResolve = null;
+		this._firstUpdatePromise = new Promise((resolve) => {
+			this._firstUpdateResolve = resolve;
+		});
 		this._tooltips = new Map();
 		this._validationCustoms = new Set();
-		this._errors = new Map();
 
 		this.addEventListener('d2l-form-errors-change', this._onErrorsChange);
 		this.addEventListener('d2l-form-element-errors-change', this._onErrorsChange);
@@ -50,6 +54,7 @@ export const FormMixin = superclass => class extends LocalizeCoreElement(supercl
 		this.addEventListener('change', this._onFormElementChange);
 		this.addEventListener('input', this._onFormElementChange);
 		this.addEventListener('focusout', this._onFormElementChange);
+		this._firstUpdateResolve();
 	}
 
 	// eslint-disable-next-line no-unused-vars
@@ -150,6 +155,9 @@ export const FormMixin = superclass => class extends LocalizeCoreElement(supercl
 	}
 
 	async _validateFormElement(ele, showNewErrors) {
+		// if validation occurs before we've rendered,
+		// localization may not have loaded yet
+		await this._firstUpdatePromise;
 		ele.id = ele.id || getUniqueId();
 		if (isCustomFormElement(ele)) {
 			return ele.validate(showNewErrors);

package/components/hierarchical-view/hierarchical-view-mixin.js

@@ -149,6 +149,7 @@ export const HierarchicalViewMixin = superclass => class extends superclass {
 			this.__intersectionObserver.disconnect();
 			this.__isAutoSized = false;
 		}
+		if (this.__resizeObserver) this.__resizeObserver.disconnect();
 	}
 
 	firstUpdated(changedProperties) {

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

@@ -8,7 +8,7 @@ import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
 

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

@@ -2,7 +2,7 @@ import './input-text.js';
 import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { bodySmallStyles } from '../typography/styles.js';
 import { classMap } from 'lit-html/directives/class-map.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+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';
 
@@ -116,16 +116,9 @@ class InputDateTimeRangeTo extends SkeletonMixin(LocalizeCoreElement(LitElement)
 
 	disconnectedCallback() {
 		super.disconnectedCallback();
-
 		this._disconnectObservers();
 	}
 
-	firstUpdated(changedProperties) {
-		super.firstUpdated(changedProperties);
-
-		this._startObserving();
-	}
-
 	render() {
 		const containerClassMap = {
 			'd2l-input-date-time-range-to-container': true,
@@ -181,9 +174,12 @@ class InputDateTimeRangeTo extends SkeletonMixin(LocalizeCoreElement(LitElement)
 	_startObserving() {
 		if (!this.shadowRoot || !this._parentNode) return;
 
+		const container = this.shadowRoot.querySelector('.d2l-input-date-time-range-to-container');
 		const leftElem = this.shadowRoot.querySelector('.d2l-input-date-time-range-start-container');
+		let leftElemHeight = 0;
+
 		this._leftElemResizeObserver = this._leftElemResizeObserver || new ResizeObserver(() => {
-			this._leftElemHeight = Math.ceil(parseFloat(getComputedStyle(leftElem).getPropertyValue('height')));
+			leftElemHeight = Math.ceil(parseFloat(getComputedStyle(leftElem).getPropertyValue('height')));
 		});
 		this._leftElemResizeObserver.disconnect();
 		this._leftElemResizeObserver.observe(leftElem);
@@ -191,8 +187,8 @@ class InputDateTimeRangeTo extends SkeletonMixin(LocalizeCoreElement(LitElement)
 		this._parentElemResizeObserver = this._parentElemResizeObserver || new ResizeObserver(async() => {
 			this._blockDisplay = false;
 			await this.updateComplete;
-			const height = Math.ceil(parseFloat(getComputedStyle(this.shadowRoot.querySelector('.d2l-input-date-time-range-to-container')).getPropertyValue('height')));
-			if (height >= (this._leftElemHeight * 2)) this._blockDisplay = true; // switch to _blockDisplay styles if content has wrapped (needed for "to" to occupy its own line)
+			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;
 		});
 		this._parentElemResizeObserver.disconnect();

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

@@ -9,7 +9,7 @@ import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
 

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

@@ -20,7 +20,7 @@ import { getDocumentLocaleSettings } from '@brightspace-ui/intl/lib/common.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { LabelledMixin } from '../../mixins/labelled-mixin.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
 import { styleMap } from 'lit-html/directives/style-map.js';

package/components/inputs/input-date.js

@@ -13,7 +13,7 @@ import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { LabelledMixin } from '../../mixins/labelled-mixin.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+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';
 import { styleMap } from 'lit-html/directives/style-map.js';
@@ -186,6 +186,12 @@ class InputDate extends FocusMixin(LabelledMixin(SkeletonMixin(FormElementMixin(
 		return super.validationMessage;
 	}
 
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		if (this._hiddenContentResizeObserver) this._hiddenContentResizeObserver.disconnect();
+		if (this._hiddenCalendarResizeObserver) this._hiddenCalendarResizeObserver.disconnect();
+	}
+
 	async firstUpdated(changedProperties) {
 		super.firstUpdated(changedProperties);
 

package/components/inputs/input-number.js

@@ -6,7 +6,7 @@ import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { LabelledMixin } from '../../mixins/labelled-mixin.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
 
 const HINT_TYPES = {

package/components/inputs/input-percent.js

@@ -4,7 +4,7 @@ import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { FormElementMixin } from '../form/form-element-mixin.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { LabelledMixin } from '../../mixins/labelled-mixin.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
 

package/components/inputs/input-search.js

@@ -5,7 +5,7 @@ import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { inputStyles } from './input-styles.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 
 /**

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

@@ -8,7 +8,7 @@ import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
 

package/components/inputs/input-time.js

@@ -254,6 +254,11 @@ class InputTime extends FocusMixin(LabelledMixin(SkeletonMixin(FormElementMixin(
 		this.requestUpdate('value', oldValue);
 	}
 
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		if (this._hiddenContentResizeObserver) this._hiddenContentResizeObserver.disconnect();
+	}
+
 	async firstUpdated(changedProperties) {
 		super.firstUpdated(changedProperties);
 

package/components/list/list-header.js

@@ -5,7 +5,7 @@ import '../selection/selection-summary.js';
 import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { classMap } from 'lit-html/directives/class-map.js';
 import { findComposedAncestor } from '../../helpers/dom.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 
 /**

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

@@ -97,7 +97,6 @@ export const ListItemCheckboxMixin = superclass => class extends SkeletonMixin(L
 	}
 
 	setSelected(selected, suppressEvent = false) {
-		//if (this.selected === selected) return;
 		if (this.selected === selected || (this.selected === undefined && !selected)) return;
 		this.selected = selected;
 		if (!suppressEvent) this._dispatchSelected(selected);

package/components/list/list-item-drag-handle.js

@@ -6,7 +6,7 @@ import { buttonStyles } from '../button/button-styles.js';
 import { findComposedAncestor } from '../../helpers/dom.js';
 import { getFirstFocusableDescendant } from '../../helpers/focus.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 
 const keyCodes = Object.freeze({

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

@@ -11,7 +11,7 @@ import { ifDefined } from 'lit-html/directives/if-defined.js';
 import { ListItemCheckboxMixin } from './list-item-checkbox-mixin.js';
 import { ListItemDragDropMixin } from './list-item-drag-drop-mixin.js';
 import { ListItemRoleMixin } from './list-item-role-mixin.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { nothing } from 'lit-html';
 import ResizeObserver from 'resize-observer-polyfill';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';

package/components/menu/menu-item-return.js

@@ -1,6 +1,6 @@
 import '../icons/icon.js';
 import { css, html, LitElement } from 'lit-element/lit-element.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { MenuItemMixin } from './menu-item-mixin.js';
 import { menuItemStyles } from './menu-item-styles.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';

package/components/meter/meter-mixin.js

@@ -1,5 +1,5 @@
 import { formatPercent } from '@brightspace-ui/intl/lib/number.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 
 export const MeterMixin = superclass => class extends LocalizeCoreElement(superclass) {
 

package/components/more-less/more-less.js

@@ -4,7 +4,7 @@ import { getComposedChildren, isComposedAncestor } from '../../helpers/dom.js';
 import { classMap } from 'lit-html/directives/class-map.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import ResizeObserver from 'resize-observer-polyfill/dist/ResizeObserver.es.js';
 import { styleMap } from 'lit-html/directives/style-map.js';
 

package/components/overflow-group/overflow-group.js

@@ -12,7 +12,7 @@ import '../menu/menu-item-separator.js';
 import '../menu/menu-item-link.js';
 import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { offscreenStyles } from '../offscreen/offscreen.js';
 import ResizeObserver from 'resize-observer-polyfill/dist/ResizeObserver.es.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
@@ -249,10 +249,15 @@ class OverflowGroup extends RtlMixin(LocalizeCoreElement(LitElement)) {
 		this.openerStyle = OPENER_STYLE.DEFAULT;
 		this.openerType = OPENER_TYPE.DEFAULT;
 		this._mini = this.openerType === OPENER_TYPE.ICON;
-
+		this._resizeObserver = null;
 		this._slotItems = [];
 	}
 
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		if (this._resizeObserver) this._resizeObserver.disconnect();
+	}
+
 	async firstUpdated() {
 		super.firstUpdated();
 
@@ -261,8 +266,8 @@ class OverflowGroup extends RtlMixin(LocalizeCoreElement(LitElement)) {
 
 		this._container = this.shadowRoot.querySelector('.d2l-overflow-group-container');
 
-		const resizeObserver = new ResizeObserver(this._throttledResize);
-		resizeObserver.observe(this._container);
+		this._resizeObserver = new ResizeObserver(this._throttledResize);
+		this._resizeObserver.observe(this._container);
 	}
 
 	render() {

package/components/scroll-wrapper/scroll-wrapper.js

@@ -143,14 +143,21 @@ class ScrollWrapper extends FocusVisiblePolyfillMixin(RtlMixin(LitElement)) {
 		this.hideActions = false;
 		this._container = null;
 		this._hScrollbar = true;
+		this._resizeObserver = null;
 		this._scrollbarLeft = false;
 		this._scrollbarRight = false;
 	}
 
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		if (this._resizeObserver) this._resizeObserver.disconnect();
+	}
+
 	firstUpdated(changedProperties) {
 		super.firstUpdated(changedProperties);
 		this._container = this.shadowRoot.querySelector('.d2l-scroll-wrapper-container');
-		new ResizeObserver(() => requestAnimationFrame(() => this.checkScrollbar())).observe(this._container);
+		this._resizeObserver = new ResizeObserver(() => requestAnimationFrame(() => this.checkScrollbar()));
+		this._resizeObserver.observe(this._container);
 	}
 
 	render() {

package/components/selection/selection-action-dropdown.js

@@ -4,7 +4,7 @@ import { DropdownOpenerMixin } from '../dropdown/dropdown-opener-mixin.js';
 import { dropdownOpenerStyles } from '../dropdown/dropdown-opener-styles.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SelectionActionMixin } from './selection-action-mixin.js';
 
 /**

package/components/selection/selection-action.js

@@ -3,7 +3,7 @@ import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { ButtonMixin } from '../button/button-mixin.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SelectionActionMixin } from './selection-action-mixin.js';
 import { SelectionInfo } from './selection-mixin.js';
 

package/components/selection/selection-select-all-pages.js

@@ -1,7 +1,7 @@
 import '../button/button-subtle.js';
 import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SelectionInfo } from './selection-mixin.js';
 import { SelectionObserverMixin } from './selection-observer-mixin.js';
 

package/components/selection/selection-select-all.js

@@ -2,7 +2,7 @@ import '../inputs/input-checkbox.js';
 import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SelectionInfo } from './selection-mixin.js';
 import { SelectionObserverMixin } from './selection-observer-mixin.js';
 

package/components/selection/selection-summary.js

@@ -1,6 +1,6 @@
 import { css, html, LitElement } from 'lit-element/lit-element.js';
 import { bodyCompactStyles } from '../typography/styles.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SelectionInfo } from './selection-mixin.js';
 import { SelectionObserverMixin } from './selection-observer-mixin.js';
 

package/components/switch/switch-visibility.js

@@ -1,6 +1,6 @@
 import '../icons/icon.js';
 import { html, LitElement } from 'lit-element/lit-element.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SwitchMixin } from './switch-mixin.js';
 
 /**

package/components/tabs/tabs.js

@@ -9,7 +9,7 @@ import { ArrowKeysMixin } from '../../mixins/arrow-keys-mixin.js';
 import { bodyCompactStyles } from '../typography/styles.js';
 import { classMap } from 'lit-html/directives/class-map.js';
 import { FocusVisiblePolyfillMixin } from '../../mixins/focus-visible-polyfill-mixin.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { repeat } from 'lit-html/directives/repeat.js';
 import ResizeObserver from 'resize-observer-polyfill/dist/ResizeObserver.es.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
@@ -266,6 +266,11 @@ class Tabs extends LocalizeCoreElement(ArrowKeysMixin(RtlMixin(FocusVisiblePolyf
 
 	}
 
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		if (this._resizeObserver) this._resizeObserver.disconnect();
+	}
+
 	firstUpdated(changedProperties) {
 		super.firstUpdated(changedProperties);
 

package/helpers/localize-core-element.js

@@ -0,0 +1,11 @@
+import { LocalizeDynamicMixin } from '../mixins/localize-dynamic-mixin.js';
+
+export const LocalizeCoreElement = superclass => class extends LocalizeDynamicMixin(superclass) {
+
+	static get localizeConfig() {
+		return {
+			importFunc: async lang => (await import(`../lang/${lang}.js`)).default
+		};
+	}
+
+};

package/lang/da.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Ryd filtre for: {filterName}",
 	"components.filter.clearDescriptionSingle": "Ryd filtre",
 	"components.filter.loading": "Indlæser filtre",
-	"components.filter.filterCountDescription": "{number, plural, zero {Ingen filtre anvendt.} one {1 filter anvendt.} other {{number} filtre anvendt.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {Ingen filtre anvendt.} one {1 filter anvendt.} other {{number} filtre anvendt.}}",
 	"components.filter.filters": "Filtre",
 	"components.filter.noFilters": "Ingen tilgængelige filtre",
-	"components.filter.searchResults": "{number, plural, zero {No search results} one {1 search result} other {{number} search results}}",
+	"components.filter.searchResults": "{number, plural, =0 {No search results} one {1 search result} other {{number} search results}}",
 	"components.filter.singleDimensionDescription": "Filtrer efter: {filterName}",
 	"components.form-element.defaultError": "{label} er ugyldigt.",
 	"components.form-element.defaultFieldLabel": "Felt",

package/lang/de.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Filter für {filterName} löschen",
 	"components.filter.clearDescriptionSingle": "Filter löschen",
 	"components.filter.loading": "Filter werden geladen",
-	"components.filter.filterCountDescription": "{number, plural, zero {Keine Filter angewendet.} one {1 Filter angewendet.} other {{number} Filter angewendet.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {Keine Filter angewendet.} one {1 Filter angewendet.} other {{number} Filter angewendet.}}",
 	"components.filter.filters": "Filter",
 	"components.filter.noFilters": "Keine verfügbaren Filter",
-	"components.filter.searchResults": "{number, plural, zero {Keine Suchergebnisse} one {1 Suchergebnis} other {{number} Suchergebnisse}}",
+	"components.filter.searchResults": "{number, plural, =0 {Keine Suchergebnisse} one {1 Suchergebnis} other {{number} Suchergebnisse}}",
 	"components.filter.singleDimensionDescription": "Filtern nach: {filterName}",
 	"components.form-element.defaultError": "{label} ist ungültig.",
 	"components.form-element.defaultFieldLabel": "Feld",

package/lang/en.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Clear filters for: {filterName}",
 	"components.filter.clearDescriptionSingle": "Clear filters",
 	"components.filter.loading": "Loading filters",
-	"components.filter.filterCountDescription": "{number, plural, zero {No filters applied.} one {1 filter applied.} other {{number} filters applied.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {No filters applied.} one {1 filter applied.} other {{number} filters applied.}}",
 	"components.filter.filters": "Filters",
 	"components.filter.noFilters": "No available filters",
-	"components.filter.searchResults": "{number, plural, zero {No search results} one {1 search result} other {{number} search results}}",
+	"components.filter.searchResults": "{number, plural, =0 {No search results} one {1 search result} other {{number} search results}}",
 	"components.filter.singleDimensionDescription": "Filter by: {filterName}",
 	"components.form-element.defaultError": "{label} is invalid.",
 	"components.form-element.defaultFieldLabel": "Field",

package/lang/es-es.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Borrar filtros para: {filterName}",
 	"components.filter.clearDescriptionSingle": "Borrar filtros",
 	"components.filter.loading": "Cargando filtros",
-	"components.filter.filterCountDescription": "{number, plural, zero {Sin filtros aplicados.} one {1 filtro aplicado.} other {{number} filtros aplicados.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {Sin filtros aplicados.} one {1 filtro aplicado.} other {{number} filtros aplicados.}}",
 	"components.filter.filters": "Filtros",
 	"components.filter.noFilters": "No hay filtros disponibles",
-	"components.filter.searchResults": "{number, plural, zero {No hay resultados de búsqueda} one {1 resultado de búsqueda} other {{number} resultados de búsqueda}}",
+	"components.filter.searchResults": "{number, plural, =0 {No hay resultados de búsqueda} one {1 resultado de búsqueda} other {{number} resultados de búsqueda}}",
 	"components.filter.singleDimensionDescription": "Filtrar por: {filterName}",
 	"components.form-element.defaultError": "{label} no es válido.",
 	"components.form-element.defaultFieldLabel": "Campo",

package/lang/es.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Borrar filtros para: {filterName}",
 	"components.filter.clearDescriptionSingle": "Borrar filtros",
 	"components.filter.loading": "Cargando filtros",
-	"components.filter.filterCountDescription": "{number, plural, zero {Sin filtros aplicados.} one {1 filtro aplicado.} other {{number} filtros aplicados.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {Sin filtros aplicados.} one {1 filtro aplicado.} other {{number} filtros aplicados.}}",
 	"components.filter.filters": "Filtros",
 	"components.filter.noFilters": "No hay filtros disponibles",
-	"components.filter.searchResults": "{number, plural, zero {No se encontraron resultados de búsqueda} one {1 resultado de búsqueda} other {{number} resultados de búsqueda}}",
+	"components.filter.searchResults": "{number, plural, =0 {No se encontraron resultados de búsqueda} one {1 resultado de búsqueda} other {{number} resultados de búsqueda}}",
 	"components.filter.singleDimensionDescription": "Filtrar por: {filterName}",
 	"components.form-element.defaultError": "{label} no es válida.",
 	"components.form-element.defaultFieldLabel": "Campo",

package/lang/fr-fr.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Supprimer les filtres pour : {filterName}",
 	"components.filter.clearDescriptionSingle": "Supprimer les filtres",
 	"components.filter.loading": "Chargement des filtres",
-	"components.filter.filterCountDescription": "{number, plural, zero {Aucun filtre appliqué.} one {1 filtre appliqué.} other {{number} filtres appliqués.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {Aucun filtre appliqué.} one {1 filtre appliqué.} other {{number} filtres appliqués.}}",
 	"components.filter.filters": "Filtres",
 	"components.filter.noFilters": "Aucun filtre disponible",
-	"components.filter.searchResults": "{number, plural, zero {aucun résultat de recherche} one {1 résultat de recherche} other {{number} résultats de recherche}}",
+	"components.filter.searchResults": "{number, plural, =0 {aucun résultat de recherche} one {1 résultat de recherche} other {{number} résultats de recherche}}",
 	"components.filter.singleDimensionDescription": "Filtrer par : {filterName}",
 	"components.form-element.defaultError": "{label} n'est pas valide.",
 	"components.form-element.defaultFieldLabel": "Champ",

package/lang/fr.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Effacer les filtres pour : {filterName}",
 	"components.filter.clearDescriptionSingle": "Effacer les filtres",
 	"components.filter.loading": "Chargement des filtres",
-	"components.filter.filterCountDescription": "{number, plural, zero {Aucun filtre appliqué.} one {1 filtre appliqué.} other {{number} filtres appliqués.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {Aucun filtre appliqué.} one {1 filtre appliqué.} other {{number} filtres appliqués.}}",
 	"components.filter.filters": "Filtres",
 	"components.filter.noFilters": "Aucun filtre disponible",
-	"components.filter.searchResults": "{number, plural, zero {Aucun résultat de recherche} one {1 résultat de recherche} other {{number} résultats de recherche}}",
+	"components.filter.searchResults": "{number, plural, =0 {Aucun résultat de recherche} one {1 résultat de recherche} other {{number} résultats de recherche}}",
 	"components.filter.singleDimensionDescription": "Filtrer par : {filterName}",
 	"components.form-element.defaultError": "{label} n'est pas valide.",
 	"components.form-element.defaultFieldLabel": "Champ",

package/lang/hi.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "इसके लिए फ़िल्टर्स साफ़ करें: {filterName}",
 	"components.filter.clearDescriptionSingle": "फ़िल्टर साफ़ करें",
 	"components.filter.loading": "फिल्टर्स लोड किए जा रहे हैं",
-	"components.filter.filterCountDescription": "{number, plural, zero {कोई फ़िल्टर लागू नहीं किए गए} one {1 फ़िल्टर लागू किया गया।} other {{number} फ़िल्टर्स लागू किए गए।}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {कोई फ़िल्टर लागू नहीं किए गए} one {1 फ़िल्टर लागू किया गया।} other {{number} फ़िल्टर्स लागू किए गए।}}",
 	"components.filter.filters": "फ़िल्टर्स",
 	"components.filter.noFilters": "कोई उपलब्ध फ़िल्टर्स नहीं",
-	"components.filter.searchResults": "{number, plural, zero {कोई खोज परिणाम नहीं} one {1 खोज परिणाम} other {{number} खोज परिणाम}}",
+	"components.filter.searchResults": "{number, plural, =0 {कोई खोज परिणाम नहीं} one {1 खोज परिणाम} other {{number} खोज परिणाम}}",
 	"components.filter.singleDimensionDescription": "इसके अनुसार फ़िल्टर करें: {filterName}",
 	"components.form-element.defaultError": "{label} अमान्य है।",
 	"components.form-element.defaultFieldLabel": "फ़ील्ड",

package/lang/ja.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "{filterName} フィルタのクリア",
 	"components.filter.clearDescriptionSingle": "フィルタのクリア",
 	"components.filter.loading": "フィルタのロード中",
-	"components.filter.filterCountDescription": "{number, plural, zero {フィルタは適用されていません。} one {1 つのフィルタが適用されています。} other {{number} 個のフィルタが適用されています。}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {フィルタは適用されていません。} other {{number} 個のフィルタが適用されています。}}",
 	"components.filter.filters": "フィルタ",
 	"components.filter.noFilters": "使用可能なフィルタはありません",
-	"components.filter.searchResults": "{number, plural, zero {検索結果なし} one {1 件の検索結果} other {{number} 件の検索結果}}",
+	"components.filter.searchResults": "{number, plural, =0 {検索結果なし} other {{number} 件の検索結果}}",
 	"components.filter.singleDimensionDescription": "フィルタ条件: {filterName}",
 	"components.form-element.defaultError": "{label} は無効です。",
 	"components.form-element.defaultFieldLabel": "フィールド",
@@ -32,7 +32,7 @@ export default {
 	"components.form-element.input.text.tooShort": "{label} は {minlength} 文字以上である必要があります",
 	"components.form-element.input.url.typeMismatch": "URL が有効ではありません",
 	"components.form-element.valueMissing": "{label} は必須です。",
-	"components.form-error-summary.errorSummary": "送信した情報に {count, plural, one {1 件のエラー} other {{count} 件のエラー}} が見つかりました",
+	"components.form-error-summary.errorSummary": "送信した情報に {count, plural, other {{count} 件のエラー}} が見つかりました",
 	"components.input-date-range.endDate": "終了日",
 	"components.input-date-range.errorBadInput": "{startLabel} は {endLabel} より前にする必要があります",
 	"components.input-date-range.startDate": "開始日",

package/lang/ko.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "{filterName}에 대한 필터를 지웁니다.",
 	"components.filter.clearDescriptionSingle": "필터 지우기",
 	"components.filter.loading": "필터 로드 중",
-	"components.filter.filterCountDescription": "{number, plural, zero {적용된 필터 없음.} one {1개 필터 적용.} other {{number}개 필터 적용.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {적용된 필터 없음.} other {{number}개 필터 적용.}}",
 	"components.filter.filters": "개 필터",
 	"components.filter.noFilters": "사용 가능한 필터가 없습니다",
-	"components.filter.searchResults": "{number, plural, zero {검색 결과 없음} one {1개 검색 결과} other {{number}개 검색 결과}}",
+	"components.filter.searchResults": "{number, plural, =0 {검색 결과 없음} other {{number}개 검색 결과}}",
 	"components.filter.singleDimensionDescription": "필터 기준: {filterName}",
 	"components.form-element.defaultError": "{label}이(가) 잘못되었습니다.",
 	"components.form-element.defaultFieldLabel": "필드",
@@ -32,7 +32,7 @@ export default {
 	"components.form-element.input.text.tooShort": "{label}은(는) {minlength}자 이상이어야 합니다",
 	"components.form-element.input.url.typeMismatch": "URL이 유효하지 않습니다",
 	"components.form-element.valueMissing": "{label}이(가) 필요합니다.",
-	"components.form-error-summary.errorSummary": "제출{count, plural, one { 한 정보에서 1개의 오류} other {하신 정보에서 {count}개의 오류}}가 발견되었습니다",
+	"components.form-error-summary.errorSummary": "제출{count, plural, other {하신 정보에서 {count}개의 오류}}가 발견되었습니다",
 	"components.input-date-range.endDate": "종료일",
 	"components.input-date-range.errorBadInput": "{startLabel}은(는) {endLabel} 앞에 있어야 합니다",
 	"components.input-date-range.startDate": "시작일",

package/lang/nl.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Filters wissen voor {filterName}",
 	"components.filter.clearDescriptionSingle": "Filters wissen",
 	"components.filter.loading": "Laden van filters",
-	"components.filter.filterCountDescription": "{number, plural, zero {No filters applied.} one {1 filter applied.} other {{number} filters applied.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {No filters applied.} one {1 filter applied.} other {{number} filters applied.}}",
 	"components.filter.filters": "Filters",
 	"components.filter.noFilters": "Geen beschikbare filters",
-	"components.filter.searchResults": "{number, plural, zero {Geen zoekresultaten} one {1 zoekresultaat} other {{number} zoekresultaten}}",
+	"components.filter.searchResults": "{number, plural, =0 {Geen zoekresultaten} one {1 zoekresultaat} other {{number} zoekresultaten}}",
 	"components.filter.singleDimensionDescription": "Filter op {filterName}",
 	"components.form-element.defaultError": "{label} is ongeldig.",
 	"components.form-element.defaultFieldLabel": "Veld",

package/lang/pt.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Limpar filtros para: {filterName}",
 	"components.filter.clearDescriptionSingle": "Limpar filtros",
 	"components.filter.loading": "Carregar filtros",
-	"components.filter.filterCountDescription": "{number, plural, zero {Nenhum filtro aplicado.} one {Um filtro aplicado.} other {{number} filtros aplicados.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {Nenhum filtro aplicado.} one {Um filtro aplicado.} other {{number} filtros aplicados.}}",
 	"components.filter.filters": "Filtros",
 	"components.filter.noFilters": "Não há filtros disponíveis",
-	"components.filter.searchResults": "{number, plural, zero {Sem resultados para a pesquisa} one {1 resultado para a pesquisa} other {{number} resultados para a pesquisa}}",
+	"components.filter.searchResults": "{number, plural, =0 {Sem resultados para a pesquisa} one {1 resultado para a pesquisa} other {{number} resultados para a pesquisa}}",
 	"components.filter.singleDimensionDescription": "Filtrar por: {filterName}",
 	"components.form-element.defaultError": "{label} é inválido.",
 	"components.form-element.defaultFieldLabel": "Campo",

package/lang/sv.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "Rensa filter för {filterName}",
 	"components.filter.clearDescriptionSingle": "Rensa filter",
 	"components.filter.loading": "Läser in filter",
-	"components.filter.filterCountDescription": "{number, plural, zero {Inga filter tillämpade.} one {1 filter tillämpat.} other {{number} filter tillämpade.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {Inga filter tillämpade.} one {1 filter tillämpat.} other {{number} filter tillämpade.}}",
 	"components.filter.filters": "Filter",
 	"components.filter.noFilters": "Inga tillgängliga filter",
-	"components.filter.searchResults": "{number, plural, zero {No search results} one {1 search result} other {{number} search results}}",
+	"components.filter.searchResults": "{number, plural, =0 {No search results} one {1 search result} other {{number} search results}}",
 	"components.filter.singleDimensionDescription": "Filtrera efter: {filterName}",
 	"components.form-element.defaultError": "{label} är ogiltig.",
 	"components.form-element.defaultFieldLabel": "Fält",

package/lang/tr.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "{filterName} için filtreleri temizle",
 	"components.filter.clearDescriptionSingle": "Filtreleri temizle",
 	"components.filter.loading": "Filtreler yükleniyor",
-	"components.filter.filterCountDescription": "{number, plural, zero {Filtre uygulanmadı.} one {1 filtre uygulandı.} other {{number} filtre uygulandı.}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {Filtre uygulanmadı.} one {1 filtre uygulandı.} other {{number} filtre uygulandı.}}",
 	"components.filter.filters": "Filtre",
 	"components.filter.noFilters": "Uygun filtre yok",
-	"components.filter.searchResults": "{number, plural, zero {Arama sonucu yok} one {1 arama sonucu} other {{number} arama sonucu}}",
+	"components.filter.searchResults": "{number, plural, =0 {Arama sonucu yok} one {1 arama sonucu} other {{number} arama sonucu}}",
 	"components.filter.singleDimensionDescription": "Filtreleme ölçütü: {filterName}",
 	"components.form-element.defaultError": "{label} geçersiz.",
 	"components.form-element.defaultFieldLabel": "Alan",

package/lang/{zh.js → zh-cn.js}

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "清除筛选条件：{ filterName }",
 	"components.filter.clearDescriptionSingle": "清除筛选",
 	"components.filter.loading": "正在加载筛选器",
-	"components.filter.filterCountDescription": "{number, plural, zero {未应用筛选器。} one {已应用 1 个筛选器。} other {已应用 {number} 个筛选器。}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {未应用筛选器。} other {已应用 {number} 个筛选器。}}",
 	"components.filter.filters": "个筛选条件",
 	"components.filter.noFilters": "无可用筛选器",
-	"components.filter.searchResults": "{number, plural, zero {无搜索结果} one {1 个搜索结果} other {{number} 个搜索结果}}",
+	"components.filter.searchResults": "{number, plural, =0 {无搜索结果} other {{number} 个搜索结果}}",
 	"components.filter.singleDimensionDescription": "筛选依据：{filterName}",
 	"components.form-element.defaultError": "{label} 无效。",
 	"components.form-element.defaultFieldLabel": "字段",
@@ -32,7 +32,7 @@ export default {
 	"components.form-element.input.text.tooShort": "{label} 必须至少为 {minlength} 个字符",
 	"components.form-element.input.url.typeMismatch": "URL 无效",
 	"components.form-element.valueMissing": "{label} 为必填项。",
-	"components.form-error-summary.errorSummary": "您提交的信息中出现 {count, plural, one {1 处错误} other {{count} 处错误}} 处错误",
+	"components.form-error-summary.errorSummary": "您提交的信息中出现 {count, plural, other {{count} 处错误}} 处错误",
 	"components.input-date-range.endDate": "结束日期",
 	"components.input-date-range.errorBadInput": "{startLabel} 必须早于 {endLabel}",
 	"components.input-date-range.startDate": "开始日期",

package/lang/zh-tw.js

@@ -18,10 +18,10 @@ export default {
 	"components.filter.clearDescription": "清除 {filterName} 的篩選器",
 	"components.filter.clearDescriptionSingle": "清除篩選器",
 	"components.filter.loading": "正在載入篩選條件",
-	"components.filter.filterCountDescription": "{number, plural, zero {未套用篩選條件。} one {已套用 1 項篩選條件。} other {已套用 {number} 項篩選條件。}}",
+	"components.filter.filterCountDescription": "{number, plural, =0 {未套用篩選條件。} other {已套用 {number} 項篩選條件。}}",
 	"components.filter.filters": "篩選器",
 	"components.filter.noFilters": "沒有可用的篩選條件",
-	"components.filter.searchResults": "{number, plural, zero {無搜尋結果} one {1 個搜尋結果} other {{number} 個搜尋結果}}",
+	"components.filter.searchResults": "{number, plural, =0 {無搜尋結果} other {{number} 個搜尋結果}}",
 	"components.filter.singleDimensionDescription": "按此條件篩選：{filterName}",
 	"components.form-element.defaultError": "{label} 無效。",
 	"components.form-element.defaultFieldLabel": "欄位",
@@ -32,7 +32,7 @@ export default {
 	"components.form-element.input.text.tooShort": "{label} 必須至少為 {minlength} 個字元",
 	"components.form-element.input.url.typeMismatch": "URL 無效",
 	"components.form-element.valueMissing": "{label} 為必填。",
-	"components.form-error-summary.errorSummary": "您提交的資訊中發現 {count, plural, one {1 個錯誤} other {{count} 個錯誤}}",
+	"components.form-error-summary.errorSummary": "您提交的資訊中發現 {count, plural, other {{count} 個錯誤}}",
 	"components.input-date-range.endDate": "結束日期",
 	"components.input-date-range.errorBadInput": "{startLabel} 必須早於 {endLabel}",
 	"components.input-date-range.startDate": "開始日期",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brightspace-ui/core",
-  "version": "1.239.1",
+  "version": "1.241.0",
   "description": "A collection of accessible, free, open-source web components for building Brightspace applications",
   "type": "module",
   "repository": "https://github.com/BrightspaceUI/core.git",
@@ -17,10 +17,11 @@
     "lint:lit": "lit-analyzer \"{components,controllers,directives,helpers,mixins,templates,test,tools}/**/*.js\" --strict --rules.no-unknown-tag-name off",
     "lint:style": "stylelint \"**/*.{js,html}\"",
     "start": "web-dev-server --node-resolve --watch --open",
-    "test": "npm run lint && npm run test:headless && npm run test:axe",
+    "test": "npm run lint && npm run test:translations && npm run test:headless && npm run test:axe",
     "test:axe": "web-test-runner --group aXe",
     "test:headless": "web-test-runner --group default",
-    "test:headless:watch": "web-test-runner --group default --watch"
+    "test:headless:watch": "web-test-runner --group default --watch",
+    "test:translations": "mfv -e -s en -p ./lang/"
   },
   "files": [
     "custom-elements.json",
@@ -57,6 +58,7 @@
     "eslint-plugin-lit": "^1",
     "eslint-plugin-sort-class-members": "^1",
     "lit-analyzer": "^1",
+    "messageformat-validator": "^2",
     "node-sass": "^7",
     "sinon": "^13",
     "stylelint": "^14"

package/templates/primary-secondary/primary-secondary.js

@@ -7,7 +7,7 @@ import { classMap } from 'lit-html/directives/class-map.js';
 import { FocusVisiblePolyfillMixin } from '../../mixins/focus-visible-polyfill-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { LocalizeCoreElement } from '../../lang/localize-core-element.js';
+import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import ResizeObserver from 'resize-observer-polyfill/dist/ResizeObserver.es.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { styleMap } from 'lit-html/directives/style-map.js';
@@ -903,6 +903,7 @@ class TemplatePrimarySecondary extends FocusVisiblePolyfillMixin(RtlMixin(Locali
 			resizer.disconnect();
 		}
 		this._hasConnectedResizers = false;
+		if (this._resizeObserver) this._resizeObserver.disconnect();
 	}
 
 	firstUpdated(changedProperties) {

package/lang/localize-core-element.js

@@ -1,74 +0,0 @@
-import { LocalizeMixin } from '../mixins/localize-mixin.js';
-
-export const LocalizeCoreElement = superclass => class extends LocalizeMixin(superclass) {
-
-	static async getLocalizeResources(langs) {
-		let translations;
-		for await (const lang of langs) {
-			switch (lang) {
-				case 'ar':
-					translations = await import('./ar.js');
-					break;
-				case 'cy':
-					translations = await import('./cy.js');
-					break;
-				case 'da':
-					translations = await import('./da.js');
-					break;
-				case 'de':
-					translations = await import('./de.js');
-					break;
-				case 'en':
-					translations = await import('./en.js');
-					break;
-				case 'es-es':
-					translations = await import('./es-es.js');
-					break;
-				case 'es':
-					translations = await import('./es.js');
-					break;
-				case 'fr-fr':
-					translations = await import('./fr-fr.js');
-					break;
-				case 'fr':
-					translations = await import('./fr.js');
-					break;
-				case 'ja':
-					translations = await import('./ja.js');
-					break;
-				case 'ko':
-					translations = await import('./ko.js');
-					break;
-				case 'nl':
-					translations = await import('./nl.js');
-					break;
-				case 'pt':
-					translations = await import('./pt.js');
-					break;
-				case 'sv':
-					translations = await import('./sv.js');
-					break;
-				case 'tr':
-					translations = await import('./tr.js');
-					break;
-				case 'zh-tw':
-					translations = await import('./zh-tw.js');
-					break;
-				case 'zh':
-					translations = await import('./zh.js');
-					break;
-			}
-			if (translations && translations.default) {
-				return {
-					language: lang,
-					resources: translations.default
-				};
-			}
-		}
-		translations = await import('./en.js');
-		return {
-			language: 'en',
-			resources: translations.default
-		};
-	}
-};