feat: add ability to localize common characters

.eslintrc.json

@@ -11,5 +11,11 @@
     "rules": {
       "no-console": 0
     }
-  }]
+  },
+  {
+		"files": "./lang/*.js",
+		"rules": {
+			"quotes": 0
+		}
+	}]
 }

intl.serge.json

@@ -0,0 +1,9 @@
+{
+	"name": "intl",
+	"parser_plugin": {
+	  "plugin": "parse_js"
+	},
+	"source_match": "en\\.js$",
+	"source_dir": "lang",
+	"output_file_path": "lang/%LANG%.js"
+  }

lang/en.js

@@ -0,0 +1,15 @@
+export default {
+	"intl-common:characters:apostrophe": "apostrophe",
+	"intl-common:characters:ampersand": "ampersand",
+	"intl-common:characters:asterisk": "asterisk",
+	"intl-common:characters:backslash": "backslash",
+	"intl-common:characters:colon": "colon",
+	"intl-common:characters:comma": "comma",
+	"intl-common:characters:greaterThan": "greater-than sign",
+	"intl-common:characters:lessThan": "less-than sign",
+	"intl-common:characters:numberSign": "number sign",
+	"intl-common:characters:percentSign": "percent sign",
+	"intl-common:characters:pipe": "pipe",
+	"intl-common:characters:questionMark": "question mark",
+	"intl-common:characters:quotationMark": "quotation mark",
+};

lib/localize.js

@@ -5,6 +5,22 @@ import IntlMessageFormat from 'intl-messageformat';
 
 export const allowedTags = Object.freeze(['d2l-link', 'd2l-tooltip-help', 'p', 'br', 'b', 'strong', 'i', 'em', 'button']);
 
+const characterMap = new Map([
+	['\'', 'apostrophe'],
+	['&', 'ampersand'],
+	['*', 'asterisk'],
+	['\\', 'backslash'],
+	[':', 'colon'],
+	[',', 'comma'],
+	['>', 'greaterThan'],
+	['<', 'lessThan'],
+	['#', 'numberSign'],
+	['%', 'percentSign'],
+	['|', 'pipe'],
+	['?', 'questionMark'],
+	['"', 'quotationMark']
+]);
+
 const getDisallowedTagsRegex = allowedTags => {
 	const validTerminators = '([>\\s/]|$)';
 	const allowedAfterTriangleBracket = `/?(${allowedTags.join('|')})?${validTerminators}`;
@@ -112,6 +128,13 @@ export const getLocalizeClass = (superclass = class {}) => class LocalizeClass e
 		return formattedMessage;
 	}
 
+	localizeCharacter(char) {
+		if (!characterMap.has(char)) {
+			throw new Error(`localizeCharacter() does not support character: "${char}"`);
+		}
+		return this.localize(`intl-common:characters:${characterMap.get(char)}`);
+	}
+
 	localizeHTML(name, replacements = {}) {
 
 		const { language, value } = this.localize.resources?.[name] ?? {};
@@ -166,6 +189,9 @@ export const getLocalizeClass = (superclass = class {}) => class LocalizeClass e
 			const possibleLanguages = this._generatePossibleLanguages(config);
 			const resourcesPromise = this.getLocalizeResources(possibleLanguages, config);
 			resourcesLoadedPromises.push(resourcesPromise);
+			resourcesLoadedPromises.push(this.getLocalizeResources(possibleLanguages, {
+				importFunc: async lang => (await import(`../lang/${lang}.js`)).default
+			}));
 		}
 		return Promise.all(resourcesLoadedPromises);
 	}

package.json

@@ -11,6 +11,7 @@
     "test": "npm run lint && npm run test:unit"
   },
   "files": [
+    "/lang",
     "/lib",
     "/helpers"
   ],

test/localize.test.js

@@ -103,6 +103,22 @@ describe('Localize', () => {
 
 	});
 
+	describe('localizeCharacter', () => {
+
+		it('should localize "&"', async() => {
+			await localizer.ready;
+			const localized = localizer.localizeCharacter('&');
+			expect(localized).to.equal('ampersand');
+		});
+
+		it('should throw an error for unknown characters', async() => {
+			await localizer.ready;
+			expect(() => localizer.localizeCharacter('$'))
+				.to.throw('localizeCharacter() does not support character: "$"');
+		});
+
+	});
+
 	describe('localizeHTML()', () => {
 
 		it('should localize, replacing tags with HTML', async() => {