@brightspace-ui/core 2.94.0 → 2.95.1

package/components/card/card-footer-link.js

@@ -2,6 +2,7 @@ import '../colors/colors.js';
 import '../count-badge/count-badge-icon.js';
 import '../icons/icon.js';
 import { css, html, LitElement } from 'lit';
+import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { offscreenStyles } from '../offscreen/offscreen.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
@@ -10,7 +11,7 @@ import { RtlMixin } from '../../mixins/rtl-mixin.js';
  * An icon link that can be placed in the `footer` slot.
  * @slot tooltip - slot for the link tooltip
  */
-class CardFooterLink extends RtlMixin(LitElement) {
+class CardFooterLink extends FocusMixin(RtlMixin(LitElement)) {
 
 	static get properties() {
 		return {
@@ -100,6 +101,10 @@ class CardFooterLink extends RtlMixin(LitElement) {
 		this.secondaryCountType = 'notification';
 	}
 
+	static get focusElementSelector() {
+		return 'a';
+	}
+
 	render() {
 		const noNumber = this.secondaryCount === undefined;
 		return html`

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

@@ -4,6 +4,7 @@ import '../expand-collapse/expand-collapse-content.js';
 import { css, html, LitElement } from 'lit';
 import { heading1Styles, heading2Styles, heading3Styles, heading4Styles } from '../typography/styles.js';
 import { classMap } from 'lit/directives/class-map.js';
+import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { offscreenStyles } from '../offscreen/offscreen.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 
@@ -25,7 +26,7 @@ const defaultHeading = 3;
  * @fires d2l-collapsible-panel-expand - Dispatched when the panel is expanded
  * @fires d2l-collapsible-panel-collapse - Dispatched when the panel is collapsed
  */
-class CollapsiblePanel extends RtlMixin(LitElement) {
+class CollapsiblePanel extends FocusMixin(RtlMixin(LitElement)) {
 
 	static get properties() {
 		return {
@@ -271,6 +272,10 @@ class CollapsiblePanel extends RtlMixin(LitElement) {
 		this._scrolled = false;
 	}
 
+	static get focusElementSelector() {
+		return 'button.d2l-offscreen';
+	}
+
 	disconnectedCallback() {
 		super.disconnectedCallback();
 		if (this._intersectionObserver) this._intersectionObserver.disconnect();

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

@@ -2,11 +2,12 @@ import '../colors/colors.js';
 import '../icons/icon.js';
 import { css, html, LitElement, unsafeCSS } from 'lit';
 import { CountBadgeMixin } from './count-badge-mixin.js';
+import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { getFocusPseudoClass } from '../../helpers/focus.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 
-class CountBadgeIcon extends CountBadgeMixin(LitElement) {
+class CountBadgeIcon extends FocusMixin(CountBadgeMixin(LitElement)) {
 
 	static get properties() {
 		return {
@@ -78,6 +79,10 @@ class CountBadgeIcon extends CountBadgeMixin(LitElement) {
 		this._badgeId = getUniqueId();
 	}
 
+	static get focusElementSelector() {
+		return 'd2l-icon';
+	}
+
 	render() {
 		let numberStyles = {
 			border: '2px solid white',

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

@@ -1,11 +1,12 @@
 import '../colors/colors.js';
 import { css, html, LitElement, unsafeCSS } from 'lit';
 import { CountBadgeMixin } from './count-badge-mixin.js';
+import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { getFocusPseudoClass } from '../../helpers/focus.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 
-class CountBadge extends CountBadgeMixin(LitElement) {
+class CountBadge extends FocusMixin(CountBadgeMixin(LitElement)) {
 
 	static get styles() {
 		return [super.styles, css`
@@ -38,6 +39,10 @@ class CountBadge extends CountBadgeMixin(LitElement) {
 		this._badgeId = getUniqueId();
 	}
 
+	static get focusElementSelector() {
+		return '.d2l-count-badge-wrapper';
+	}
+
 	render() {
 		const tabbable = (this.tabStop || this.hasTooltip) && !(this.hideZero && this.number === 0) && !this.skeleton;
 		const innerHtml =  html`

package/components/filter/filter-dimension-set.js

@@ -1,10 +1,5 @@
 import { html, LitElement } from 'lit';
 
-export const EmptyStateType = {
-	Search: 'search',
-	Set: 'set'
-};
-
 /**
  * A component to represent the main filter dimension type - a set of possible values that can be selected.
  * This component does not render anything, but instead gathers data needed for the d2l-filter.
@@ -104,11 +99,11 @@ class FilterDimensionSet extends LitElement {
 	}
 
 	getSearchEmptyState() {
-		return this._getEmptyState(this._searchEmptyStateSlot);
+		return this._getEmptyState(this._searchEmptyStateSlot, 'search');
 	}
 
 	getSetEmptyState() {
-		return this._getEmptyState(this._setEmptyStateSlot);
+		return this._getEmptyState(this._setEmptyStateSlot, 'set');
 	}
 
 	getValues() {
@@ -134,7 +129,7 @@ class FilterDimensionSet extends LitElement {
 		}));
 	}
 
-	_getEmptyState(emptyStateSlot) {
+	_getEmptyState(emptyStateSlot, emptyStateType) {
 		if (!emptyStateSlot) return null;
 		const nodes = emptyStateSlot.assignedNodes({ flatten: true });
 		const emptyState = nodes.find((node) => node.nodeType === Node.ELEMENT_NODE && node.tagName.toLowerCase() === 'd2l-filter-dimension-set-empty-state');
@@ -142,7 +137,8 @@ class FilterDimensionSet extends LitElement {
 		return {
 			actionHref: emptyState.actionHref,
 			actionText: emptyState.actionText,
-			description: emptyState.description
+			description: emptyState.description,
+			type: emptyStateType
 		};
 	}
 

package/components/filter/filter.js

@@ -22,7 +22,6 @@ import { bodyCompactStyles, bodySmallStyles, bodyStandardStyles } from '../typog
 import { css, html, LitElement, nothing } from 'lit';
 import { announce } from '../../helpers/announce.js';
 import { classMap } from 'lit/directives/class-map.js';
-import { EmptyStateType } from './filter-dimension-set.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { formatNumber } from '@brightspace-ui/intl/lib/number.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
@@ -415,7 +414,7 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 		`;
 	}
 
-	_createEmptyState(emptyState, dimensionKey, type) {
+	_createEmptyState(emptyState, dimensionKey) {
 		let emptyStateAction = nothing;
 		if (emptyState.actionText && emptyState.actionHref) {
 			emptyStateAction = html`
@@ -430,7 +429,7 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 				<d2l-empty-state-action-button
 					@d2l-empty-state-action="${this._handleEmptyStateAction}"
 					data-dimension-key="${dimensionKey}"
-					data-type="${type}"
+					data-type="${emptyState.type}"
 					text="${emptyState.actionText}">
 				</d2l-empty-state-action-button>
 			`;
@@ -454,7 +453,7 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 
 		if (this._isDimensionEmpty(dimension)) {
 			const emptyState = dimension.setEmptyState
-				? this._createEmptyState(dimension.setEmptyState, dimension.key, EmptyStateType.Set)
+				? this._createEmptyState(dimension.setEmptyState, dimension.key)
 				: html`
 					<d2l-empty-state-simple
 						class="d2l-filter-dimension-info-message"
@@ -476,7 +475,7 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 				'd2l-offscreen': count !== 0
 			};
 			const emptyState = dimension.searchEmptyState && count === 0
-				? this._createEmptyState(dimension.searchEmptyState, dimension.key, EmptyStateType.Search)
+				? this._createEmptyState(dimension.searchEmptyState, dimension.key)
 				: html`
 					<d2l-empty-state-simple
 						class="d2l-filter-dimension-info-message"

package/components/table/table-controls.js

@@ -30,6 +30,10 @@ class TableControls extends SelectionControls {
 		`];
 	}
 
+	_getSelectionControlsLabel() {
+		return this.localize('components.table-controls.label');
+	}
+
 	_renderSelection() {
 		return html`
 			<d2l-selection-summary

package/lang/ar.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "مرئي.",
 	"components.switch.hidden": "مخفي",
 	"components.switch.conditions": "يجب استيفاء الشروط",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "التمرير إلى الأمام",
 	"components.tabs.previous": "التمرير إلى الخلف",
 	"components.tag-list.clear": "انقر فوق، أو اضغط على مسافة للخلف، أو اضغط على مفتاح حذف لإزالة العنصر {value}",

package/lang/cy.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Gweladwy.",
 	"components.switch.hidden": "Cudd",
 	"components.switch.conditions": "Rhaid bodloni’r amodau",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Sgrolio Ymlaen",
 	"components.tabs.previous": "Sgrolio Yn Ôl",
 	"components.tag-list.clear": "Cliciwch, pwyswch yn ôl, neu pwyswch y bysell dileu i dynnu’r eitem {value}",

package/lang/da.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Synlig.",
 	"components.switch.hidden": "Skjult",
 	"components.switch.conditions": "Betingelserne skal være opfyldt",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Rul frem",
 	"components.tabs.previous": "Rul tilbage",
 	"components.tag-list.clear": "Klik, tryk på tilbagetasten, eller tryk på slettasten for at fjerne element {value}",

package/lang/de.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Sichtbar.",
 	"components.switch.hidden": "Ausgeblendet",
 	"components.switch.conditions": "Bedingungen müssen erfüllt sein",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Weiterblättern",
 	"components.tabs.previous": "Zurückblättern",
 	"components.tag-list.clear": "Klicken Sie, drücken Sie die Rücktaste, oder drücken Sie die Entfernen-Taste, um das Element {value} zu entfernen",

package/lang/en-gb.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Visible.",
 	"components.switch.hidden": "Hidden",
 	"components.switch.conditions": "Conditions must be met",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Scroll Forward",
 	"components.tabs.previous": "Scroll Backward",
 	"components.tag-list.clear": "Click, press backspace, or press delete key to remove item {value}",

package/lang/en.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Visible.",
 	"components.switch.hidden": "Hidden",
 	"components.switch.conditions": "Conditions must be met",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Scroll Forward",
 	"components.tabs.previous": "Scroll Backward",
 	"components.tag-list.clear": "Click, press backspace, or press delete key to remove item {value}",

package/lang/es-es.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Visible.", // mfv-translated
 	"components.switch.hidden": "Oculto",
 	"components.switch.conditions": "Deben cumplirse las condiciones",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Desplazarse hacia delante",
 	"components.tabs.previous": "Desplazarse hacia atrás",
 	"components.tag-list.clear": "Haga clic, pulse Retroceso o pulse la tecla Supr para eliminar el elemento {value}",

package/lang/es.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Visible.", // mfv-translated
 	"components.switch.hidden": "Oculto",
 	"components.switch.conditions": "Se deben cumplir las condiciones",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Desplazarse hacia adelante",
 	"components.tabs.previous": "Desplazarse hacia atrás",
 	"components.tag-list.clear": "Haga clic, presione Retroceso o presione la tecla Suprimir para eliminar el elemento {value}",

package/lang/fr-fr.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Visible.", // mfv-translated
 	"components.switch.hidden": "Masqué",
 	"components.switch.conditions": "Les conditions doivent être remplies",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Faire défiler vers l'avant",
 	"components.tabs.previous": "Faire défiler vers l'arrière",
 	"components.tag-list.clear": "Cliquez sur l’élément, appuyez sur la touche Retour arrière ou sur la touche Suppr pour supprimer l’élément {value}",

package/lang/fr.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Visible.", // mfv-translated
 	"components.switch.hidden": "Masqué(e)",
 	"components.switch.conditions": "Les conditions doivent être remplies",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Défilement avant",
 	"components.tabs.previous": "Défilement arrière",
 	"components.tag-list.clear": "Cliquez sur le bouton, appuyez sur retour arrière ou appuyez sur la touche de suppression pour supprimer l’élément {value}",

package/lang/hi.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "दृश्यमान।",
 	"components.switch.hidden": "छुपा हुआ",
 	"components.switch.conditions": "शर्तें पूरी होनी चाहिए",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "आगे स्क्रॉल करें",
 	"components.tabs.previous": "पीछे स्क्रॉल करें",
 	"components.tag-list.clear": "{value} को हटाने के लिए क्लिक करें, बैकस्पेस दबाएँ, या हटाएँ कुंजी को दबाएँ",

package/lang/ja.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "表示。",
 	"components.switch.hidden": "非表示",
 	"components.switch.conditions": "条件が一致する必要があります",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "前方にスクロール",
 	"components.tabs.previous": "後方にスクロール",
 	"components.tag-list.clear": "クリックする、Backspace キーを押す、または Delete キーを押すと項目 {value} が削除されます",

package/lang/ko.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "표시.",
 	"components.switch.hidden": "숨김",
 	"components.switch.conditions": "조건을 충족해야 합니다",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "앞으로 스크롤",
 	"components.tabs.previous": "뒤로 스크롤",
 	"components.tag-list.clear": "항목 {value}을(를) 제거하려면 클릭하거나, 백스페이스 또는 삭제 키를 누릅니다.",

package/lang/nl.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Zichtbaar.",
 	"components.switch.hidden": "Verborgen",
 	"components.switch.conditions": "Er moet aan de voorwaarden worden voldaan",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Naar voren scrollen",
 	"components.tabs.previous": "Naar achteren scrollen",
 	"components.tag-list.clear": "Klik, druk op Backspace of druk op de Delete-toets om item {value} te verwijderen",

package/lang/pt.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Visível.",
 	"components.switch.hidden": "Oculto",
 	"components.switch.conditions": "As condições devem ser atendidas",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Ir para frente",
 	"components.tabs.previous": "Ir para trás",
 	"components.tag-list.clear": "Clique em, pressione Backspace ou pressione a tecla Delete para remover o item {value}",

package/lang/sv.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Synlig.",
 	"components.switch.hidden": "Dold",
 	"components.switch.conditions": "Villkoren måste uppfyllas",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "Bläddra framåt",
 	"components.tabs.previous": "Bläddra bakåt",
 	"components.tag-list.clear": "Klicka, tryck på backstegstangenten eller Delete-tangenten för att ta bort objektet {value}",

package/lang/tr.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "Görünür.",
 	"components.switch.hidden": "Gizli",
 	"components.switch.conditions": "Koşullar karşılanmalıdır",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "İleri Kaydır",
 	"components.tabs.previous": "Geri Kaydır",
 	"components.tag-list.clear": "Öğe {value} değerini kaldırmak için tıklatın, geri al tuşuna veya sil tuşuna basın",

package/lang/zh-cn.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "可见。",
 	"components.switch.hidden": "隐藏",
 	"components.switch.conditions": "必须符合条件",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "向前滚动",
 	"components.tabs.previous": "向后滚动",
 	"components.tag-list.clear": "单击、按退格键或按 Delete 键以移除项目 {value}",

package/lang/zh-tw.js

@@ -106,6 +106,7 @@ export default {
 	"components.switch.visibleWithPeriod": "可見。",
 	"components.switch.hidden": "隱藏",
 	"components.switch.conditions": "必須符合條件",
+	"components.table-controls.label": "Actions for table",
 	"components.tabs.next": "向前捲動",
 	"components.tabs.previous": "向後捲動",
 	"components.tag-list.clear": "按一下、按下退格鍵或按下刪除鍵以移除項目 {value}",

package/mixins/focus-mixin.md

@@ -12,13 +12,14 @@ Apply the mixin and set the static `focusElementSelector` to a CSS query selecto
 import { FocusMixin } from '@brightspace-ui/core/mixins/focus-mixin.js';
 
 class MyComponent extends FocusMixin(LitElement) {
-  
+
   // delegate focus to the underlying input
   static get focusElementSelector() {
-		return 'input';
+    return 'input';
+  }
 
   render() {
-	  return html`<input type="text">`;
+    return html`<input type="text">`;
   }
 
 }

package/package.json

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