@brightspace-ui/core 2.126.0 → 2.127.0

package/README.md

@@ -98,14 +98,14 @@ D2L employees can also view the latest main-branch demos at https://brightspace-
 ### Linting
 
 ```shell
-# eslint and lit-analyzer
+# eslint and stylelint
 npm run lint
 
 # eslint only
 npm run lint:eslint
 
-# lit-analyzer only
-npm run lint:lit
+# stylelint only
+npm run lint:style
 ```
 
 ### Testing

package/components/inputs/input-text.js

@@ -460,7 +460,7 @@ class InputText extends FocusMixin(LabelledMixin(FormElementMixin(SkeletonMixin(
 
 		let tooltip = nothing;
 		if (this.validationError && !this.skeleton && !this.noValidate) {
-			tooltip = html`<d2l-tooltip state="error" align="start">${this.validationError} <span class="d2l-offscreen">${this.description}</span></d2l-tooltip>`;
+			tooltip = html`<d2l-tooltip state="error" announced align="start">${this.validationError} <span class="d2l-offscreen">${this.description}</span></d2l-tooltip>`;
 		}
 
 		return html`${tooltip}${label}${input}`;

package/components/paging/README.md

@@ -37,7 +37,7 @@ pager.addEventListener('d2l-pager-load-more', e => {
 | Property | Type | Description |
 |---|---|---|
 | `has-more` | Boolean, default: `false` | Whether there are more items that can be loaded. |
-| `page-size` | Number, default: 50 | The number of additional items to load. |
+| `page-size` | Number | The number of additional items to load. If not given, the component will simply show `Load More` without any value. |
 
 ### Events
 

package/components/paging/demo/pager-load-more.html

@@ -57,16 +57,50 @@
 				</template>
 			</d2l-demo-snippet>
 
+			<h2>Load More Pager (no page count)</h2>
+
+			<d2l-demo-snippet>
+				<template>
+					<d2l-test-pageable item-count=12>
+						<ul>
+							<li><a href="https://some-website">item 1</a></li>
+							<li><a href="https://some-website">item 2</a></li>
+						</ul>
+						<d2l-pager-load-more id="pager3" slot="pager" has-more></d2l-pager-load-more>
+					</d2l-test-pageable>
+					<script>
+						document.querySelector('#pager3').addEventListener('d2l-pager-load-more', window.handleLoadMore);
+					</script>
+				</template>
+			</d2l-demo-snippet>
+
+			<h2>Load More Pager (no item or page count)</h2>
+
+			<d2l-demo-snippet>
+				<template>
+					<d2l-test-pageable>
+						<ul>
+							<li><a href="https://some-website">item 1</a></li>
+							<li><a href="https://some-website">item 2</a></li>
+						</ul>
+						<d2l-pager-load-more id="pager4" slot="pager" has-more></d2l-pager-load-more>
+					</d2l-test-pageable>
+					<script>
+						document.querySelector('#pager4').addEventListener('d2l-pager-load-more', window.handleLoadMore);
+					</script>
+				</template>
+			</d2l-demo-snippet>
 		</d2l-demo-page>
 
 		<script>
 			const ITEM_COUNT = 12;
+			const PAGE_SIZE = 3;
 			window.handleLoadMore = e => {
 				// fake delay
 				setTimeout(() => {
 					const list = e.target.parentNode.querySelector('ul');
 					let remainingCount = ITEM_COUNT - list.children.length;
-					const numberToLoad = remainingCount < e.target.pageSize ? remainingCount : e.target.pageSize;
+					const numberToLoad = remainingCount < PAGE_SIZE ? remainingCount : PAGE_SIZE;
 					for (let i = 0; i < numberToLoad; i++) {
 						const newItem = list.lastElementChild.cloneNode(true);
 						newItem.querySelector('a').textContent = `item ${list.children.length + 1}`;
@@ -76,7 +110,7 @@
 						e.target.hasMore = false;
 					} else {
 						remainingCount = ITEM_COUNT - list.children.length;
-						if (remainingCount < e.target.pageSize) e.target.pageSize = remainingCount;
+						if (remainingCount < PAGE_SIZE && e.target.pageSize) e.target.pageSize = remainingCount;
 					}
 					e.detail.complete();
 				}, 1000);

package/components/paging/pager-load-more.js

@@ -78,7 +78,6 @@ class LoadMore extends PageableSubscriberMixin(FocusMixin(LocalizeCoreElement(Rt
 		this.hasMore = false;
 
 		/** @ignore */
-		this.pageSize = 50;
 		this._loading = false;
 	}
 
@@ -98,7 +97,7 @@ class LoadMore extends PageableSubscriberMixin(FocusMixin(LocalizeCoreElement(Rt
 			${this._loading ? html`
 				<d2l-loading-spinner size="24"></d2l-loading-spinner>
 			` : html`
-				<span class="action">${this.localize('components.pager-load-more.action', { count: formatNumber(this.pageSize) })}</span>
+				<span class="action">${isNaN(this.pageSize) ? this.localize('components.pager-load-more.action') : this.localize('components.pager-load-more.action-with-page-size', { count: formatNumber(this.pageSize) })}</span>
 				${itemCount !== null ? html`
 					<span class="d2l-offscreen">${getSeparator({ nonBreaking: true })}</span>
 					<span class="separator"></span>

package/lang/ar.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "المزيد",
 	"components.object-property-list.item-placeholder-text": "عنصر نائب",
 	"components.overflow-group.moreActions": "مزيد من الإجراءات",
-	"components.pager-load-more.action": "تحميل {count} إضافي",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "تحميل {count} إضافي",
 	"components.pageable.info": "{count, plural, one {{countFormatted} مادة واحد} other {{countFormatted} من المواد}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} من أصل {totalCountFormatted} مادة واحدة} other {{countFormatted} من أصل {totalCountFormatted} من المواد}}",
 	"components.pager-load-more.status-loading": "تحميل المزيد من المواد",

package/lang/cy.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "mwy",
 	"components.object-property-list.item-placeholder-text": "Eitem Dalfan",
 	"components.overflow-group.moreActions": "Rhagor o Gamau Gweithredu",
-	"components.pager-load-more.action": "Lwytho {count} Arall",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Lwytho {count} Arall",
 	"components.pageable.info": "{count, plural, one {{countFormatted} eitem} other {{countFormatted} o eitemau}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} o {totalCountFormatted} eitem} other {{countFormatted} o {totalCountFormatted} eitemau}}",
 	"components.pager-load-more.status-loading": "Llwytho rhagor o eitemau",

package/lang/da.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "flere",
 	"components.object-property-list.item-placeholder-text": "Pladsholder-element",
 	"components.overflow-group.moreActions": "Flere handlinger",
-	"components.pager-load-more.action": "Indlæs {count} mere",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Indlæs {count} mere",
 	"components.pageable.info": "{count, plural, one {{countFormatted} element} other {{countFormatted} elementer}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} af {totalCountFormatted} element} other {{countFormatted} af {totalCountFormatted} elementer}}",
 	"components.pager-load-more.status-loading": "Indlæser flere elementer",

package/lang/de.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "mehr",
 	"components.object-property-list.item-placeholder-text": "Platzhalterelement",
 	"components.overflow-group.moreActions": "Weitere Aktionen",
-	"components.pager-load-more.action": "{count} weitere laden",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "{count} weitere laden",
 	"components.pageable.info": "{count, plural, one {{countFormatted} Element} other {{countFormatted} Elemente}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} von {totalCountFormatted} Element} other {{countFormatted} von {totalCountFormatted} Elemente}}",
 	"components.pager-load-more.status-loading": "Weitere Elemente werden geladen",

package/lang/en-gb.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "more",
 	"components.object-property-list.item-placeholder-text": "Placeholder Item",
 	"components.overflow-group.moreActions": "More Actions",
-	"components.pager-load-more.action": "Load {count} More",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Load {count} More",
 	"components.pageable.info": "{count, plural, one {{countFormatted} item} other {{countFormatted} items}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} of {totalCountFormatted} item} other {{countFormatted} of {totalCountFormatted} items}}",
 	"components.pager-load-more.status-loading": "Loading more items",

package/lang/en.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "more",
 	"components.object-property-list.item-placeholder-text": "Placeholder Item",
 	"components.overflow-group.moreActions": "More Actions",
-	"components.pager-load-more.action": "Load {count} More",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Load {count} More",
 	"components.pageable.info": "{count, plural, one {{countFormatted} item} other {{countFormatted} items}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} of {totalCountFormatted} item} other {{countFormatted} of {totalCountFormatted} items}}",
 	"components.pager-load-more.status-loading": "Loading more items",

package/lang/es-es.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "más",
 	"components.object-property-list.item-placeholder-text": "Elemento de marcador de posición",
 	"components.overflow-group.moreActions": "Más acciones",
-	"components.pager-load-more.action": "Cargar {count} más",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Cargar {count} más",
 	"components.pageable.info": "{count, plural, one {{countFormatted} elemento} other {{countFormatted} elementos}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} de {totalCountFormatted} elemento} other {{countFormatted} de {totalCountFormatted} elementos}}",
 	"components.pager-load-more.status-loading": "Cargando más elementos",

package/lang/es.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "más",
 	"components.object-property-list.item-placeholder-text": "Elemento de marcador de posición",
 	"components.overflow-group.moreActions": "Más acciones",
-	"components.pager-load-more.action": "Cargar {count} más",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Cargar {count} más",
 	"components.pageable.info": "{count, plural, one {{countFormatted} elemento} other {{countFormatted} elementos}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} de {totalCountFormatted} elemento} other {{countFormatted} de {totalCountFormatted} elementos}}",
 	"components.pager-load-more.status-loading": "Cargando más elementos",

package/lang/fr-fr.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "plus",
 	"components.object-property-list.item-placeholder-text": "Élément d’espace réservé",
 	"components.overflow-group.moreActions": "Plus d'actions",
-	"components.pager-load-more.action": "Charger {count} supplémentaire(s)",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Charger {count} supplémentaire(s)",
 	"components.pageable.info": "{count, plural, one {{countFormatted} élément} other {{countFormatted} éléments}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} sur {totalCountFormatted} élément} other {{countFormatted} sur {totalCountFormatted} éléments}}",
 	"components.pager-load-more.status-loading": "Charger plus d’éléments",

package/lang/fr.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "plus",
 	"components.object-property-list.item-placeholder-text": "Élément de paramètre fictif",
 	"components.overflow-group.moreActions": "Plus d'actions",
-	"components.pager-load-more.action": "Charger {count} de plus",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Charger {count} de plus",
 	"components.pageable.info": "{count, plural, one {{countFormatted} élément} other {{countFormatted} éléments}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} de {totalCountFormatted} élément} other {{countFormatted} de {totalCountFormatted} éléments}}",
 	"components.pager-load-more.status-loading": "Chargement d'autres d'éléments",

package/lang/hi.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "अधिक",
 	"components.object-property-list.item-placeholder-text": "प्लेसहोल्डर आइटम",
 	"components.overflow-group.moreActions": "अधिक क्रियाएँ",
-	"components.pager-load-more.action": "{count} और लोड करें",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "{count} और लोड करें",
 	"components.pageable.info": "{count, plural, one {{countFormatted} आइटम} other {{countFormatted} आइटम}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{totalCountFormatted} में से {countFormatted} आइटम} other {{totalCountFormatted} में से {countFormatted} आइटम}}",
 	"components.pager-load-more.status-loading": "और आइटम लोड करना",

package/lang/ja.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "増やす",
 	"components.object-property-list.item-placeholder-text": "プレースホルダの項目",
 	"components.overflow-group.moreActions": "その他のアクション",
-	"components.pager-load-more.action": "さらに {count} 件を読み込む",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "さらに {count} 件を読み込む",
 	"components.pageable.info": "{count, plural, other {{countFormatted} 個の項目}}",
 	"components.pageable.info-with-total": "{totalCount, plural, other {{countFormatted}/{totalCountFormatted} 個の項目}}",
 	"components.pager-load-more.status-loading": "さらに項目を読み込み中",

package/lang/ko.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "더 보기",
 	"components.object-property-list.item-placeholder-text": "자리표시자 항목",
 	"components.overflow-group.moreActions": "추가 작업",
-	"components.pager-load-more.action": "{count}개 더 로드",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "{count}개 더 로드",
 	"components.pageable.info": "{count, plural, other {해당 항목 수 {countFormatted}개}}",
 	"components.pageable.info-with-total": "{totalCount, plural, other {{totalCountFormatted}개 항목 중 {countFormatted}개}}",
 	"components.pager-load-more.status-loading": "더 많은 항목 로드",

package/lang/nl.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "meer",
 	"components.object-property-list.item-placeholder-text": "Item tijdelijke aanduiding",
 	"components.overflow-group.moreActions": "Meer acties",
-	"components.pager-load-more.action": "Laad nog {count} extra",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Laad nog {count} extra",
 	"components.pageable.info": "{count, plural, one {{countFormatted} item} other {{countFormatted} items}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} van {totalCountFormatted} artikel} other {{countFormatted} van {totalCountFormatted} artikelen}}",
 	"components.pager-load-more.status-loading": "Er worden meer items geladen",

package/lang/pt.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "mais",
 	"components.object-property-list.item-placeholder-text": "Item de espaço reservado",
 	"components.overflow-group.moreActions": "Mais ações",
-	"components.pager-load-more.action": "Carregar mais {count}",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Carregar mais {count}",
 	"components.pageable.info": "{count, plural, one {{countFormatted} item} other {{countFormatted} itens}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} de {totalCountFormatted} item} other {{countFormatted} de {totalCountFormatted} itens}}",
 	"components.pager-load-more.status-loading": "Carregando mais itens",

package/lang/sv.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "mer",
 	"components.object-property-list.item-placeholder-text": "Platshållarobjekt",
 	"components.overflow-group.moreActions": "Fler åtgärder",
-	"components.pager-load-more.action": "Läs in {count} till",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "Läs in {count} till",
 	"components.pageable.info": "{count, plural, one {{countFormatted} objekt} other {{countFormatted} objekt}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} av {totalCountFormatted} objekt} other {{countFormatted} av {totalCountFormatted} objekt}}",
 	"components.pager-load-more.status-loading": "Läser in fler objekt",

package/lang/tr.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "daha fazla",
 	"components.object-property-list.item-placeholder-text": "Yer Tutucu Öğesi",
 	"components.overflow-group.moreActions": "Daha Fazla Eylem",
-	"components.pager-load-more.action": "{count} Tane Daha Yükle",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "{count} Tane Daha Yükle",
 	"components.pageable.info": "{count, plural, one {{countFormatted} öğe} other {{countFormatted} öğe}}",
 	"components.pageable.info-with-total": "{totalCount, plural, one {{countFormatted} / {totalCountFormatted} öğe} other {{countFormatted} / {totalCountFormatted} öğe}}",
 	"components.pager-load-more.status-loading": "Daha fazla öğe yükleniyor",

package/lang/zh-cn.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "更多",
 	"components.object-property-list.item-placeholder-text": "占位符项目",
 	"components.overflow-group.moreActions": "更多操作",
-	"components.pager-load-more.action": "再加载 {count} 个",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "再加载 {count} 个",
 	"components.pageable.info": "{count, plural, other {{countFormatted} 项}}",
 	"components.pageable.info-with-total": "{totalCount, plural, other {{countFormatted}/{totalCountFormatted} 项}}",
 	"components.pager-load-more.status-loading": "加载更多项目",

package/lang/zh-tw.js

@@ -94,7 +94,8 @@ export default {
 	"components.more-less.more": "較多",
 	"components.object-property-list.item-placeholder-text": "預留位置項目",
 	"components.overflow-group.moreActions": "其他動作",
-	"components.pager-load-more.action": "再載入 {count} 個",
+	"components.pager-load-more.action": "Load More",
+	"components.pager-load-more.action-with-page-size": "再載入 {count} 個",
 	"components.pageable.info": "{count, plural, other {{countFormatted} 個項目}}",
 	"components.pageable.info-with-total": "{totalCount, plural, other {{countFormatted} 項，共 {totalCountFormatted} 項}}",
 	"components.pager-load-more.status-loading": "正在載入更多項目",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brightspace-ui/core",
-  "version": "2.126.0",
+  "version": "2.127.0",
   "description": "A collection of accessible, free, open-source web components for building Brightspace applications",
   "type": "module",
   "repository": "https://github.com/BrightspaceUI/core.git",
@@ -14,9 +14,8 @@
     "build:sass": "node-sass --output-style expanded ./test/sass.scss > ./test/sass.output.css",
     "build": "npm run build:clean && npm run build:icons && npm run build:illustrations && npm run build:sass",
     "build-static": "rollup -c ./rollup/rollup.config.js",
-    "lint": "npm run lint:eslint && npm run lint:style && npm run lint:lit",
+    "lint": "npm run lint:eslint && npm run lint:style",
     "lint:eslint": "eslint . --ext .js,.html --ignore-path .gitignore",
-    "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}\" --ignore-path .gitignore",
     "start": "web-dev-server --node-resolve --watch --open",
     "test": "npm run lint && npm run test:translations && npm run test:headless && npm run test:axe",
@@ -59,15 +58,13 @@
     "eslint": "^8",
     "eslint-config-brightspace": "^0.23",
     "glob-all": "^3",
-    "lit-analyzer": "^1",
     "messageformat-validator": "^2",
     "node-sass": "^9",
     "rollup": "^3",
     "rollup-plugin-copy": "^3",
     "rollup-plugin-delete": "^2",
     "sinon": "^15",
-    "stylelint": "^15",
-    "typescript": "^5.0.3"
+    "stylelint": "^15"
   },
   "dependencies": {
     "@brightspace-ui/intl": "^3",