@brightspace-ui/core 3.32.0 → 3.33.0

package/components/typography/styles.js

@@ -318,3 +318,65 @@ export const blockquoteStyles = css`
 		}
 	}
 `;
+
+const importUrl = 'https://s.brightspace.com/lib/fonts/0.6.1/assets/';
+const fonts = {
+	LatoRegular: 'Lato-400',
+	LatoBold: 'Lato-700',
+	BCSansLight: 'BCSans-Light',
+	BCSansRegular: 'BCSans-Regular',
+	BCSansBold: 'BCSans-Bold',
+	BCSansLightItalic: 'BCSans-LightItalic',
+	BCSansItalic: 'BCSans-Italic',
+	BCSansBoldItalic: 'BCSans-BoldItalic'
+};
+export const fontFacesCss = `
+	@font-face {
+		font-family: 'Lato';
+		font-style: normal;
+		font-weight: 400;
+		src: local('Lato Regular'), local('Lato-Regular'), url(${new URL(`${fonts.LatoRegular}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.LatoRegular}.woff`, importUrl)}) format('woff'), url(${new URL(`${fonts.LatoRegular}.ttf`, importUrl)}) format('truetype');
+	}
+	@font-face {
+		font-family: 'Lato';
+		font-style: normal;
+		font-weight: 700;
+		src: local('Lato Bold'), local('Lato-Bold'), url(${new URL(`${fonts.LatoBold}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.LatoBold}.woff`, importUrl)}) format('woff'), url(${new URL(`${fonts.LatoBold}.ttf`, importUrl)}) format('truetype');
+	}
+	@font-face {
+		font-family: 'BC Sans';
+		font-style: normal;
+		font-weight: 300;
+		src: url(${new URL(`${fonts.BCSansLight}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansLight}.woff`, importUrl)}) format('woff');
+	}
+	@font-face {
+		font-family: 'BC Sans';
+		font-style: normal;
+		font-weight: 400;
+		src: url(${new URL(`${fonts.BCSansRegular}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansRegular}.woff`, importUrl)}) format('woff');
+	}
+	@font-face {
+		font-family: 'BC Sans';
+		font-style: normal;
+		font-weight: 700;
+		src: url(${new URL(`${fonts.BCSansBold}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansBold}.woff`, importUrl)}) format('woff');
+	}
+	@font-face {
+		font-family: 'BC Sans';
+		font-style: italic;
+		font-weight: 300;
+		src: url(${new URL(`${fonts.BCSansLightItalic}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansLightItalic}.woff`, importUrl)}) format('woff');
+	}
+	@font-face {
+		font-family: 'BC Sans';
+		font-style: italic;
+		font-weight: 400;
+		src: url(${new URL(`${fonts.BCSansItalic}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansItalic}.woff`, importUrl)}) format('woff');
+	}
+	@font-face {
+		font-family: 'BC Sans';
+		font-style: italic;
+		font-weight: 700;
+		src: url(${new URL(`${fonts.BCSansBoldItalic}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansBoldItalic}.woff`, importUrl)}) format('woff');
+	}
+`;

package/components/typography/typography.js

@@ -1,16 +1,5 @@
 import '../colors/colors.js';
-
-export const importUrl = 'https://s.brightspace.com/lib/fonts/0.6.1/assets/';
-export const fonts = {
-	LatoRegular: 'Lato-400',
-	LatoBold: 'Lato-700',
-	BCSansLight: 'BCSans-Light',
-	BCSansRegular: 'BCSans-Regular',
-	BCSansBold: 'BCSans-Bold',
-	BCSansLightItalic: 'BCSans-LightItalic',
-	BCSansItalic: 'BCSans-Italic',
-	BCSansBoldItalic: 'BCSans-BoldItalic'
-};
+import { fontFacesCss } from './styles.js';
 
 if (!document.head.querySelector('#d2l-typography-font-face')) {
 	const style = document.createElement('style');
@@ -24,54 +13,7 @@ if (!document.head.querySelector('#d2l-typography-font-face')) {
 			--d2l-document-direction: rtl;
 		}
 
-		@font-face {
-			font-family: 'Lato';
-			font-style: normal;
-			font-weight: 400;
-			src: local('Lato Regular'), local('Lato-Regular'), url(${new URL(`${fonts.LatoRegular}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.LatoRegular}.woff`, importUrl)}) format('woff'), url(${new URL(`${fonts.LatoRegular}.ttf`, importUrl)}) format('truetype');
-		}
-		@font-face {
-			font-family: 'Lato';
-			font-style: normal;
-			font-weight: 700;
-			src: local('Lato Bold'), local('Lato-Bold'), url(${new URL(`${fonts.LatoBold}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.LatoBold}.woff`, importUrl)}) format('woff'), url(${new URL(`${fonts.LatoBold}.ttf`, importUrl)}) format('truetype');
-		}
-		@font-face {
-			font-family: 'BC Sans';
-			font-style: normal;
-			font-weight: 300;
-			src: url(${new URL(`${fonts.BCSansLight}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansLight}.woff`, importUrl)}) format('woff');
-		}
-		@font-face {
-			font-family: 'BC Sans';
-			font-style: normal;
-			font-weight: 400;
-			src: url(${new URL(`${fonts.BCSansRegular}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansRegular}.woff`, importUrl)}) format('woff');
-		}
-		@font-face {
-			font-family: 'BC Sans';
-			font-style: normal;
-			font-weight: 700;
-			src: url(${new URL(`${fonts.BCSansBold}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansBold}.woff`, importUrl)}) format('woff');
-		}
-		@font-face {
-			font-family: 'BC Sans';
-			font-style: italic;
-			font-weight: 300;
-			src: url(${new URL(`${fonts.BCSansLightItalic}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansLightItalic}.woff`, importUrl)}) format('woff');
-		}
-		@font-face {
-			font-family: 'BC Sans';
-			font-style: italic;
-			font-weight: 400;
-			src: url(${new URL(`${fonts.BCSansItalic}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansItalic}.woff`, importUrl)}) format('woff');
-		}
-		@font-face {
-			font-family: 'BC Sans';
-			font-style: italic;
-			font-weight: 700;
-			src: url(${new URL(`${fonts.BCSansBoldItalic}.woff2`, importUrl)}) format('woff2'), url(${new URL(`${fonts.BCSansBoldItalic}.woff`, importUrl)}) format('woff');
-		}
+		${fontFacesCss}
 
 		.d2l-typography {
 			color: var(--d2l-color-ferrite);

package/helpers/mathjax.js

@@ -45,7 +45,6 @@ class HtmlBlockMathRenderer {
 
 		const mathJaxConfig = {
 			deferTypeset: true,
-			enableMML3Support: context.enableMML3Support,
 			renderLatex: context.renderLatex,
 			outputScale: context.outputScale || 1,
 			window: window
@@ -62,24 +61,6 @@ class HtmlBlockMathRenderer {
 			elm.style.height = '0.5rem';
 		});
 
-		if (context.enableMML3Support) {
-			// There's a bug in the experimental MML3 plugin that causes mi and mo elements containing non-breaking
-			// spaces to break MathJax's math processing (e.g. <mo>&nbsp;</mo>, <mi>Some&nbsp;Identifier</mi>).
-			// Unfortunately, WIRIS tends to add a lot of these in chemistry equations, so they break math processing.
-			//
-			// In order to address this, we can just remove any non-breaking spaces entirely, replacing them with
-			// empty strings. MathJax will ignore any empty elements as a result, and while this may mean intended
-			// whitespace is occasionally removed, it's necessary for MathJax to render anything at all.
-			//
-			// NOTE: MathJax evidently has a fix for this in MathJax 4, so we should consider trying to remove this when
-			// the update comes out of beta and we decide to take it on.
-			//
-			// See https://github.com/mathjax/MathJax/issues/3030 for some related discussion.
-			elem.querySelectorAll('mo, mi').forEach(elm => {
-				elm.innerHTML = elm.innerHTML.replace(/&nbsp;/g, '');
-			});
-		}
-
 		// 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>`;
@@ -120,13 +101,7 @@ export function loadMathJax(mathJaxConfig) {
 			}
 		},
 		loader: {
-			load: mathJaxConfig && mathJaxConfig.enableMML3Support
-				? [
-					'[mml]/mml3',
-					'ui/menu'
-				] : [
-					'ui/menu'
-				]
+			load: ['ui/menu']
 		},
 		startup: {
 			ready: () => {

package/package.json

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

package/tools/mathjax-test-context.js

@@ -4,6 +4,5 @@ console.warn('Using mathjax test context, this is intended for demo pages and te
 
 addContext('d2l-mathjax', {
 	outputScale: 1.1,
-	renderLatex: !(window.location.search.indexOf('latex=false') !== -1),
-	enableMML3Support: true
+	renderLatex: !(window.location.search.indexOf('latex=false') !== -1)
 });