Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions components/list/demo/demo-list.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ import '../list-controls.js';
import '../list-item-content.js';
import '../list-item.js';
import '../list.js';
import '../../inputs/input-radio.js';
import '../../inputs/input-radio-group.js';
import { css, html, LitElement } from 'lit';
import { getUniqueId } from '../../../helpers/uniqueId.js';
import { ifDefined } from 'lit/directives/if-defined.js';
Expand Down Expand Up @@ -144,6 +146,7 @@ class DemoList extends LitElement {
this.items = JSON.parse(JSON.stringify(items));
this._lastItemLoadedIndex = 2;
this._pageSize = 2;
this.dataState = 'clean';
}

render() {
Expand All @@ -158,6 +161,11 @@ class DemoList extends LitElement {
?add-button="${this.addButton}"
add-button-text="${ifDefined(addButtonText)}">
<d2l-list-controls slot="controls" select-all-pages-allowed>
<d2l-input-radio-group style="align-content:center;min-width:260px;" label="Date State" horizontal label-hidden name="dataState" @change=${this._handleDataStateChange}>
<d2l-input-radio label="Clean" value="clean" ?checked=${this.dataState === 'clean'}></d2l-input-radio>
<d2l-input-radio label="Dirty" value="dirty" ?checked=${this.dataState === 'dirty'}></d2l-input-radio>
<d2l-input-radio label="Loading" value="loading" ?checked=${this.dataState === 'loading'}></d2l-input-radio>
</d2l-input-radio-group>
<d2l-selection-action icon="tier1:plus-default" text="Add" @d2l-selection-action-click="${this._handleAddItem}"></d2l-selection-action>
<d2l-selection-action-dropdown text="Move To" requires-selection>
<d2l-dropdown-menu>
Expand Down Expand Up @@ -228,6 +236,11 @@ class DemoList extends LitElement {
this.requestUpdate();
}

_handleDataStateChange(e) {
this.shadowRoot.querySelector('d2l-list').dataState = e.detail.value;
this.dataState = e.detail.value;
}

_handlePagerLoadMore(e) {
// mock delay consumers might have
setTimeout(() => {
Expand Down
16 changes: 15 additions & 1 deletion components/list/list.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import '../backdrop/backdrop-loading.js';
import { css, html, LitElement } from 'lit';
import { getNextFocusable, getPreviousFocusable } from '../../helpers/focus.js';
import { SelectionInfo, SelectionMixin } from '../selection/selection-mixin.js';
Expand Down Expand Up @@ -98,6 +99,14 @@ class List extends PageableMixin(SelectionMixin(LitElement)) {
* Show selection only on hover, focus or if at least one item is selected. Exclusive for the tile layout
* @type {boolean}
*/
/**
* The state of data in the table. Set to 'clean' when the data represents the user's latest selections, 'dirty' when the data does not represent the user's latest selections, and 'loading' if the data is being actively refreshed
* @type {'clean'|'dirty'|'loading'}
*/
dataState: {
reflect: true,
type: String
},
selectionWhenInteracted: { type: Boolean, attribute: 'selection-when-interacted', reflect: true },
_breakpoint: { type: Number, reflect: true },
_slimColor: { type: Boolean, reflect: true, attribute: '_slim-color' }
Expand Down Expand Up @@ -175,6 +184,7 @@ class List extends PageableMixin(SelectionMixin(LitElement)) {
this._listItemChanges = [];
this._childHasColor = false;
this._childHasExpandCollapseToggle = false;
this.dataState = 'clean';

this._breakpoint = 0;
this._slimColor = false;
Expand Down Expand Up @@ -247,11 +257,15 @@ class List extends PageableMixin(SelectionMixin(LitElement)) {
render() {
const role = !this.grid ? 'list' : 'application'; // not using grid role due to Safari+VO: https://bugs.webkit.org/show_bug.cgi?id=291591
const ariaLabel = this.slot !== 'nested' ? this.label : undefined;
console.log(this.dataState);
return html`
<slot name="controls"></slot>
<slot name="header"></slot>
<div role="${role}" aria-label="${ifDefined(ariaLabel)}" class="d2l-list-content">
<slot @keydown="${this._handleKeyDown}" @slotchange="${this._handleSlotChange}"></slot>
<div style="position:relative">
<slot id="list-slot" @keydown="${this._handleKeyDown}" @slotchange="${this._handleSlotChange}"></slot>
<d2l-backdrop-loading for="list-slot" dataState='${this.dataState}'></d2l-backdrop-loading>
</div>
</div>
${this._renderPagerContainer()}
`;
Expand Down
6 changes: 3 additions & 3 deletions lang/ar.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "إغلاق التنبيه",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "مسار التنقل",
"components.button-add.addItem": "إضافة عنصر",
"components.button-copy.copied": "تم النسخ!",
Expand Down
6 changes: 3 additions & 3 deletions lang/cy.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Cau Hysbysiad",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Briwsionyn Bara",
"components.button-add.addItem": "Ychwanegu Eitem",
"components.button-copy.copied": "Wedi’i gopïo!",
Expand Down
6 changes: 3 additions & 3 deletions lang/da.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Luk besked",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Brødkrumme",
"components.button-add.addItem": "Tilføj element",
"components.button-copy.copied": "Kopieret!",
Expand Down
6 changes: 3 additions & 3 deletions lang/de.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Benachrichtigung schließen",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Brotkrümelnavigation",
"components.button-add.addItem": "Element hinzufügen",
"components.button-copy.copied": "Kopiert.",
Expand Down
6 changes: 3 additions & 3 deletions lang/en-gb.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Close Alert",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Breadcrumb",
"components.button-add.addItem": "Add Item",
"components.button-copy.copied": "Copied!",
Expand Down
6 changes: 3 additions & 3 deletions lang/en.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Close Alert",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Breadcrumb",
"components.button-add.addItem": "Add Item",
"components.button-copy.copied": "Copied!",
Expand Down
6 changes: 3 additions & 3 deletions lang/es-es.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Cerrar alerta",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Ruta de navegación",
"components.button-add.addItem": "Agregar elemento",
"components.button-copy.copied": "¡Copiado!",
Expand Down
6 changes: 3 additions & 3 deletions lang/es.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Cerrar alerta",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Ruta de navegación",
"components.button-add.addItem": "Agregar elemento",
"components.button-copy.copied": "Copiado.",
Expand Down
6 changes: 3 additions & 3 deletions lang/fr-fr.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Fermer l’alerte",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Chemin de navigation",
"components.button-add.addItem": "Ajouter un élément",
"components.button-copy.copied": "Copie effectuée !",
Expand Down
6 changes: 3 additions & 3 deletions lang/fr.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Fermer l’alerte",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Chemin de navigation",
"components.button-add.addItem": "Ajouter un élément",
"components.button-copy.copied": "Copié!",
Expand Down
6 changes: 3 additions & 3 deletions lang/haw.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Pani i ka makaʻala",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Palapalapala",
"components.button-add.addItem": "Pākuʻi Mea",
"components.button-copy.copied": "Kope ʻia!",
Expand Down
6 changes: 3 additions & 3 deletions lang/hi.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "अलर्ट बंद करें",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "ब्रेडक्रंब",
"components.button-add.addItem": "आइटम जोड़ें",
"components.button-copy.copied": "कॉपी किया गया!",
Expand Down
6 changes: 3 additions & 3 deletions lang/ja.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "アラートを閉じる",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "階層",
"components.button-add.addItem": "項目の追加",
"components.button-copy.copied": "コピーできました。",
Expand Down
6 changes: 3 additions & 3 deletions lang/ko.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "경보 닫기",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "이동 경로",
"components.button-add.addItem": "항목 추가",
"components.button-copy.copied": "복사 완료!",
Expand Down
6 changes: 3 additions & 3 deletions lang/mi.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Kati Matohi",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Pānui",
"components.button-add.addItem": "Tāpiri Tūemi",
"components.button-copy.copied": "Kua tāruatia!",
Expand Down
6 changes: 3 additions & 3 deletions lang/nl.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Waarschuwing sluiten",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Kruimelpad",
"components.button-add.addItem": "Item toevoegen",
"components.button-copy.copied": "Gekopieerd!",
Expand Down
6 changes: 3 additions & 3 deletions lang/pt.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Fechar alerta",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Auxiliar de navegação",
"components.button-add.addItem": "Adicionar item",
"components.button-copy.copied": "Copiado!",
Expand Down
6 changes: 3 additions & 3 deletions lang/sv.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
export default {
"components.alert.close": "Stängningsvarning",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.backdrop-loading.dirtyAnnouncement": "Filters have been changed. Click to apply filters",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.dirtyDialogAction": "Apply Filters.",
"components.backdrop-loading.dirtyDialogDescription": "Filters have been changed.",
"components.backdrop-loading.loadingAnnouncement": "Loading.",
"components.backdrop-loading.loadingCompleteAnnouncement": "Loading Complete.",
"components.breadcrumbs.breadcrumb": "Sökväg",
"components.button-add.addItem": "Lägg till objekt",
"components.button-copy.copied": "Kopierat!",
Expand Down
Loading