@brightspace-ui/core 2.61.0 → 2.63.0

package/components/demo/code-view.js

@@ -30,7 +30,7 @@ class CodeView extends LitElement {
 		if (Prism.languages[language]) {
 			this._dependenciesPromise = Promise.resolve();
 		} else {
-			this._dependenciesPromise = import(`./node_modules/prismjs/components/prism-${language}.min.js`);
+			this._dependenciesPromise = import(`../../node_modules/prismjs/components/prism-${language}.min.js`);
 		}
 		if (this.shadowRoot) this._updateCode(this.shadowRoot.querySelector('slot'));
 		super.attributeChangedCallback(name, oldval, newval);

package/components/html-block/demo/html-block.html

@@ -39,7 +39,11 @@
 			}
 
 			// demo replacement renderer for html-block
-			provideInstance(document, 'html-block-renderers', [ new DemoReplacementRenderer() ]);
+			provideInstance(document, 'html-block-renderer-loader', {
+				async getRenderers() {
+					return [ new DemoReplacementRenderer() ];
+				}
+			});
 
 		</script>
 		<script type="module">

package/helpers/mathjax.js

@@ -30,9 +30,6 @@ const mathjaxFontMappings = new Map([
 	['MJXTEX-VB', 'MathJax_Vector-Bold']
 ]);
 
-let mathJaxLoaded;
-let renderingPromise = Promise.resolve();
-
 class HtmlBlockMathRenderer {
 
 	get contextAttributes() {
@@ -45,34 +42,13 @@ class HtmlBlockMathRenderer {
 		if (contextVal === undefined) return elem;
 
 		const context = JSON.parse(contextVal) || {};
-		const isLatexSupported = context.renderLatex;
-
-		if (!elem.querySelector('math') && !(isLatexSupported && /\$\$|\\\(|\\\[|\\begin{|\\ref{|\\eqref{/.test(elem.innerHTML))) return elem;
 
-		const mathJaxConfig = {
+		await typesetMath(elem, {
 			deferTypeset: true,
-			renderLatex: isLatexSupported,
-			outputScale: context.outputScale || 1
-		};
-
-		await loadMathJax(mathJaxConfig);
-
-		// MathJax 3 does not support newlines, but it does persist styles, so add custom styles to mimic a linebreak
-		// This work-around should be removed when linebreaks are natively supported.
-		// MathJax issue: https://github.com/mathjax/MathJax/issues/2312
-		// A duplicate that explains our exact issue: https://github.com/mathjax/MathJax/issues/2495
-		elem.querySelectorAll('mspace[linebreak="newline"]').forEach(elm => {
-			elm.style.display = 'block';
-			elm.style.height = '0.5rem';
+			renderLatex: context.renderLatex,
+			outputScale: context.outputScale || 1,
+			window: window
 		});
-
-		// If we're using deferred rendering, we need to create a document structure
-		// within the element so MathJax can appropriately process math.
-		if (!options.noDeferredRendering) elem.innerHTML = `<mjx-doc><mjx-head></mjx-head><mjx-body>${elem.innerHTML}</mjx-body></mjx-doc>`;
-
-		await window.MathJax.startup.promise;
-		renderingPromise = renderingPromise.then(() => window.MathJax.typesetShadow(elem.getRootNode(), elem));
-		await renderingPromise;
 	}
 
 }
@@ -83,9 +59,12 @@ export function createHtmlBlockRenderer() {
 
 export function loadMathJax(mathJaxConfig) {
 
-	if (mathJaxLoaded) return mathJaxLoaded;
+	const win = (mathJaxConfig && mathJaxConfig.window) || window;
 
-	window.MathJax = {
+	win.D2L = win.D2L || {};
+	if (win.D2L.mathJaxLoaded) return win.D2L.mathJaxLoaded;
+
+	win.MathJax = {
 		chtml: {
 			adaptiveCSS: false,
 			scale: (mathJaxConfig && mathJaxConfig.outputScale) || 1
@@ -110,11 +89,11 @@ export function loadMathJax(mathJaxConfig) {
 				//  just an example and so we use an expedient method of
 				//  accessing these for now.)
 				//
-				const mathjax = window.MathJax._.mathjax.mathjax;
-				const HTMLAdaptor = window.MathJax._.adaptors.HTMLAdaptor.HTMLAdaptor;
-				const HTMLHandler = window.MathJax._.handlers.html.HTMLHandler.HTMLHandler;
-				const AbstractHandler = window.MathJax._.core.Handler.AbstractHandler.prototype;
-				const startup = window.MathJax.startup;
+				const mathjax = win.MathJax._.mathjax.mathjax;
+				const HTMLAdaptor = win.MathJax._.adaptors.HTMLAdaptor.HTMLAdaptor;
+				const HTMLHandler = win.MathJax._.handlers.html.HTMLHandler.HTMLHandler;
+				const AbstractHandler = win.MathJax._.core.Handler.AbstractHandler.prototype;
+				const startup = win.MathJax.startup;
 
 				const getFirstChild = doc => {
 					const child = doc.firstChild;
@@ -155,7 +134,7 @@ export function loadMathJax(mathJaxConfig) {
 						const adaptor = this.adaptor;
 						if (typeof(document) === 'string') {
 							document = adaptor.parse(document, 'text/html');
-						} else if ((document instanceof adaptor.window.HTMLElement || document instanceof adaptor.window.DocumentFragment) && !(document instanceof window.ShadowRoot)) {
+						} else if ((document instanceof adaptor.window.HTMLElement || document instanceof adaptor.window.DocumentFragment) && !(document instanceof win.ShadowRoot)) {
 							const child = document;
 							document = adaptor.parse('', 'text/html');
 							adaptor.append(adaptor.body(document), child);
@@ -173,7 +152,7 @@ export function loadMathJax(mathJaxConfig) {
 				//  Register the new handler and adaptor
 				//
 				startup.registerConstructor('HTMLHandler', ShadowHandler);
-				startup.registerConstructor('browserAdaptor', () => new ShadowAdaptor(window));
+				startup.registerConstructor('browserAdaptor', () => new ShadowAdaptor(win));
 
 				//
 				//  A service function that creates a new MathDocument from the
@@ -181,7 +160,7 @@ export function loadMathJax(mathJaxConfig) {
 				//  renders the document.  The MathDocument is returned in case
 				//  you need to rerender the shadowRoot later.
 				//
-				window.MathJax.typesetShadow = async function(root, elem) {
+				win.MathJax.typesetShadow = async function(root, elem) {
 					const InputJax = startup.getInputJax();
 					const OutputJax = startup.getOutputJax();
 					const html = mathjax.document(root, { InputJax, OutputJax });
@@ -195,15 +174,15 @@ export function loadMathJax(mathJaxConfig) {
 				//
 				//  Now do the usual startup now that the extensions are in place
 				//
-				window.MathJax.startup.defaultReady();
+				win.MathJax.startup.defaultReady();
 			},
 			// Defer typesetting if the config is present and deferring is set
 			typeset: !(mathJaxConfig && mathJaxConfig.deferTypeset)
 		}
 	};
 
-	if (mathJaxConfig && mathJaxConfig.deferTypeset && !document.head.querySelector('#d2l-mathjax-fonts') && !document.head.querySelector('#MJX-CHTML-styles')) {
-		const styleElem = document.createElement('style');
+	if (mathJaxConfig && mathJaxConfig.deferTypeset && !win.document.head.querySelector('#d2l-mathjax-fonts') && !win.document.head.querySelector('#MJX-CHTML-styles')) {
+		const styleElem = win.document.createElement('style');
 		styleElem.id = 'd2l-mathjax-fonts';
 
 		let fontImportStyles = '';
@@ -216,11 +195,11 @@ export function loadMathJax(mathJaxConfig) {
 		});
 
 		styleElem.textContent = fontImportStyles;
-		document.head.appendChild(styleElem);
+		win.document.head.appendChild(styleElem);
 	}
 
-	mathJaxLoaded = new Promise(resolve => {
-		const script = document.createElement('script');
+	win.D2L.mathJaxLoaded = new Promise(resolve => {
+		const script = win.document.createElement('script');
 		script.async = 'async';
 		script.onload = resolve;
 
@@ -229,9 +208,44 @@ export function loadMathJax(mathJaxConfig) {
 			: 'mml-chtml';
 
 		script.src = `${mathjaxBaseUrl}/${component}.js`;
-		document.head.appendChild(script);
+		win.document.head.appendChild(script);
+	});
+
+	return win.D2L.mathJaxLoaded;
+
+}
+
+export async function typesetMath(elem, options) {
+	if (!elem.querySelector('math') && !(options.renderLatex && /\$\$|\\\(|\\\[|\\begin{|\\ref{|\\eqref{/.test(elem.innerHTML))) return elem;
+
+	const win = options.window;
+
+	const mathJaxConfig = {
+		deferTypeset: options.deferTypeset,
+		renderLatex: options.renderLatex,
+		outputScale: options.outputScale || 1,
+		window: win
+	};
+
+	await loadMathJax(mathJaxConfig);
+
+	// MathJax 3 does not support newlines, but it does persist styles, so add custom styles to mimic a linebreak
+	// This work-around should be removed when linebreaks are natively supported.
+	// MathJax issue: https://github.com/mathjax/MathJax/issues/2312
+	// A duplicate that explains our exact issue: https://github.com/mathjax/MathJax/issues/2495
+	elem.querySelectorAll('mspace[linebreak="newline"]').forEach(elm => {
+		elm.style.display = 'block';
+		elm.style.height = '0.5rem';
 	});
 
-	return mathJaxLoaded;
+	// If we're using deferred rendering, we need to create a document structure
+	// within the element so MathJax can appropriately process math.
+	if (!options.noDeferredRendering) elem.innerHTML = `<mjx-doc><mjx-head></mjx-head><mjx-body>${elem.innerHTML}</mjx-body></mjx-doc>`;
+
+	await win.MathJax.startup.promise;
+	win.D2L = win.D2L || {};
 
+	if (!win.D2L.renderingPromise) win.D2L.renderingPromise = Promise.resolve();
+	win.D2L.renderingPromise = win.D2L.renderingPromise.then(() => win.MathJax.typesetShadow(elem.getRootNode(), elem));
+	await win.D2L.renderingPromise;
 }

package/lang/ar.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "مؤشر التقدم",
 	"components.more-less.less": "أقل",
 	"components.more-less.more": "المزيد",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"components.object-property-list.item-placeholder-text": "عنصر نائب",
 	"components.overflow-group.moreActions": "مزيد من الإجراءات",
 	"components.pager-load-more.action": "تحميل {count} إضافي",
 	"components.pager-load-more.info": "{totalCount, plural, one {{showingCount} من أصل {totalCountFormatted} من العناصر} other {{showingCount} من أصل {totalCountFormatted} من العناصر}}",

package/lang/cy.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Dangosydd Cynnydd",
 	"components.more-less.less": "llai",
 	"components.more-less.more": "mwy",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} o {totalCountFormatted} eitem} other {{showingCount} o {totalCountFormatted} eitem}}",

package/lang/da.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Statusindikator",
 	"components.more-less.less": "færre",
 	"components.more-less.more": "flere",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} af {totalCountFormatted} element} other {{showingCount} af {totalCountFormatted} elementer}}",

package/lang/de.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Fortschrittsanzeige",
 	"components.more-less.less": "Weniger",
 	"components.more-less.more": "mehr",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} von {totalCountFormatted} Element} other {{showingCount} von {totalCountFormatted} Elementen}}",

package/lang/es-es.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Indicador de progreso",
 	"components.more-less.less": "menos",
 	"components.more-less.more": "más",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} de {totalCountFormatted} elemento} other {{showingCount} de {totalCountFormatted} elemento}}",

package/lang/es.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Indicador de progreso",
 	"components.more-less.less": "menos",
 	"components.more-less.more": "más",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} de {totalCountFormatted} elemento} other {{showingCount} de {totalCountFormatted} elemento}}",

package/lang/fr-fr.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Indicateur de progrès",
 	"components.more-less.less": "moins",
 	"components.more-less.more": "plus",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} sur {totalCountFormatted} élément} other {{showingCount} sur {totalCountFormatted} éléments}}",

package/lang/fr.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Indicateur de progrès",
 	"components.more-less.less": "moins",
 	"components.more-less.more": "plus",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} de {totalCountFormatted} élément} other {{showingCount} de {totalCountFormatted} éléments}}",

package/lang/hi.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "प्रगति संकेतक",
 	"components.more-less.less": "कम",
 	"components.more-less.more": "अधिक",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"components.object-property-list.item-placeholder-text": "प्लेसहोल्डर आइटम",
 	"components.overflow-group.moreActions": "अधिक क्रियाएँ",
 	"components.pager-load-more.action": "{count} और लोड करें",
 	"components.pager-load-more.info": "{totalCount, plural, one {{totalCountFormatted} में से {showingCount} आइटम} other {{totalCountFormatted} में से {showingCount} आइटम}}",

package/lang/ja.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "進捗状況インジケータ",
 	"components.more-less.less": "減らす",
 	"components.more-less.more": "増やす",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"components.object-property-list.item-placeholder-text": "プレースホルダの項目",
 	"components.overflow-group.moreActions": "その他のアクション",
 	"components.pager-load-more.action": "さらに {count} 件を読み込む",
 	"components.pager-load-more.info": "{totalCount, plural, other {{showingCount}/{totalCountFormatted} 個の項目}}",

package/lang/ko.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "진도 표시기",
 	"components.more-less.less": "축소",
 	"components.more-less.more": "더 보기",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"components.object-property-list.item-placeholder-text": "자리표시자 항목",
 	"components.overflow-group.moreActions": "추가 작업",
 	"components.pager-load-more.action": "{count}개 더 로드",
 	"components.pager-load-more.info": "{totalCount, plural, other {{totalCountFormatted}개 항목 중 {showingCount}개}}",

package/lang/nl.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Voortgangsindicator",
 	"components.more-less.less": "minder",
 	"components.more-less.more": "meer",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} van {totalCountFormatted} artikel} other {{showingCount} van {totalCountFormatted} artikelen}}",

package/lang/pt.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Indicador de progresso",
 	"components.more-less.less": "menos",
 	"components.more-less.more": "mais",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} de {totalCountFormatted} item} other {{showingCount} de {totalCountFormatted} itens}}",

package/lang/sv.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Förloppsindikator",
 	"components.more-less.less": "mindre",
 	"components.more-less.more": "mer",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} av {totalCountFormatted} objekt} other {{showingCount} av {totalCountFormatted} objekt}}",

package/lang/tr.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "Gelişim Göstergesi",
 	"components.more-less.less": "daha az",
 	"components.more-less.more": "daha fazla",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"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.info": "{totalCount, plural, one {{showingCount} / {totalCountFormatted} öğe} other {{showingCount} / {totalCountFormatted} öğe}}",

package/lang/zh-cn.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "进度指示符",
 	"components.more-less.less": "更少",
 	"components.more-less.more": "更多",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"components.object-property-list.item-placeholder-text": "占位符项目",
 	"components.overflow-group.moreActions": "更多操作",
 	"components.pager-load-more.action": "再加载 {count} 个",
 	"components.pager-load-more.info": "{totalCount, plural, other {{showingCount}/{totalCountFormatted} 项}}",

package/lang/zh-tw.js

@@ -90,7 +90,7 @@ export default {
 	"components.meter-mixin.progressIndicator": "進度指示器",
 	"components.more-less.less": "較少",
 	"components.more-less.more": "較多",
-	"components.object-property-list.item-placeholder-text": "Placeholder Item",
+	"components.object-property-list.item-placeholder-text": "預留位置項目",
 	"components.overflow-group.moreActions": "其他動作",
 	"components.pager-load-more.action": "再載入 {count} 個",
 	"components.pager-load-more.info": "{totalCount, plural, other {{showingCount} 項，共 {totalCountFormatted} 項}}",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brightspace-ui/core",
-  "version": "2.61.0",
+  "version": "2.63.0",
   "description": "A collection of accessible, free, open-source web components for building Brightspace applications",
   "type": "module",
   "repository": "https://github.com/BrightspaceUI/core.git",
@@ -13,10 +13,11 @@
     "build:illustrations": "node ./cli/empty-state-illustration-generator.js",
     "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",
     "lint": "npm run lint:eslint && npm run lint:style && npm run lint:lit",
-    "lint:eslint": "eslint . --ext .js,.html",
+    "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}\"",
+    "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",
     "test:axe": "web-test-runner --group aXe",
@@ -46,6 +47,8 @@
     "@babel/eslint-parser": "^7",
     "@brightspace-ui/stylelint-config": "^0.7",
     "@open-wc/testing": "^3",
+    "@rollup/plugin-dynamic-import-vars": "^2",
+    "@rollup/plugin-node-resolve": "^15",
     "@web/dev-server": "^0.1",
     "@web/test-runner": "^0.15",
     "@web/test-runner-playwright": "^0.9",
@@ -53,9 +56,13 @@
     "chalk": "^5",
     "eslint": "^8",
     "eslint-config-brightspace": "^0.19",
+    "glob-all": "^3",
     "lit-analyzer": "^1",
     "messageformat-validator": "^2",
-    "node-sass": "^7",
+    "node-sass": "^8",
+    "rollup": "^2",
+    "rollup-plugin-copy": "^3",
+    "rollup-plugin-delete": "^2",
     "sinon": "^14",
     "stylelint": "^14"
   },