npm - @ongov/ontario-design-system-component-library - Versions diffs - 4.3.1-alpha.1 → 5.0.0-alpha.10 - Mend

@ongov/ontario-design-system-component-library 4.3.1-alpha.1 → 5.0.0-alpha.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2406) hide show

package/src/index.html CHANGED Viewed

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html dir="ltr" lang="en">
 	<head>
 		<link rel="stylesheet" href="/build/ontario-design-system-components.css" />
@@ -62,6 +62,7 @@
 						<li><a href="#text-inputs">Text inputs</a></li>
 						<li><a href="#date-input">Date input</a></li>
 						<li><a href="#step-indicator">Step indicator</a></li>
+						<li><a href="#search-box">Search Box</a></li>
 						<li><a href="#form">Form example</a></li>
 					</ol>
 					<hr />
@@ -176,58 +177,280 @@
 					<div>
 						<h2 id="card">Card Collection & Card</h2>
 						<div>
+							<h3>Basic cards (no images)</h3>
 							<ontario-card-collection cards-per-row="4">
-								<ontario-card-collection cards-per-row="2">
-									<ontario-card
-										card-type="horizonal"
-										label="Card Title 1"
-										image="https://picsum.photos/200/300"
-										card-link="https://google.ca"
-										horizontal-image-position-type="left"
-										horizontal-image-size-type="one-fourth"
-										description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
-									>
-									</ontario-card>
-									<ontario-card
-										card-type="horizonal"
-										label="Card Title 2"
-										image="https://picsum.photos/200/300"
-										horizontal-image-position-type="left"
-										horizontal-image-size-type="one-fourth"
-										description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
-									>
-									</ontario-card>
-								</ontario-card-collection>
 								<ontario-card
-									card-type="basic"
-									label="Card Title 3"
-									image="https://picsum.photos/200/300"
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									label="Card Title 1"
+								>
+								</ontario-card>
+								<ontario-card
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									header-colour="sky"
+									label="Card Title 2"
+								>
+								</ontario-card>
+								<ontario-card label="Card Title 3"> </ontario-card>
+								<ontario-card header-colour="sky" label="Card Title 4"> </ontario-card>
+							</ontario-card-collection>
+							<h3>Basic cards with 4:3 images</h3>
+							<ontario-card-collection cards-per-row="4">
+								<ontario-card
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/300/225"
+									label="Card Title 1"
+								>
+								</ontario-card>
+								<ontario-card
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/300/225"
+									header-colour="sky"
+									label="Card Title 2"
+								>
+								</ontario-card>
+								<ontario-card image="https://picsum.photos/300/225" label="Card Title 3"> </ontario-card>
+								<ontario-card header-colour="sky" image="https://picsum.photos/300/225" label="Card Title 4">
+								</ontario-card>
+							</ontario-card-collection>
+							<h3>Basic cards with 16:9 images</h3>
+							<ontario-card-collection cards-per-row="4">
+								<ontario-card
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/300/169"
+									label="Card Title 1"
+								>
+								</ontario-card>
+								<ontario-card
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/300/169"
+									header-colour="sky"
+									label="Card Title 2"
+								>
+								</ontario-card>
+								<ontario-card image="https://picsum.photos/300/169" label="Card Title 3"> </ontario-card>
+								<ontario-card header-colour="sky" image="https://picsum.photos/300/169" label="Card Title 4">
+								</ontario-card>
+							</ontario-card-collection>
+							<h3>Basic cards with 2:1 images</h3>
+							<ontario-card-collection cards-per-row="4">
+								<ontario-card
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/300/150"
+									label="Card Title 1"
+								>
+								</ontario-card>
+								<ontario-card
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/300/150"
+									header-colour="sky"
+									label="Card Title 2"
+								>
+								</ontario-card>
+								<ontario-card image="https://picsum.photos/300/150" label="Card Title 3"> </ontario-card>
+								<ontario-card header-colour="sky" image="https://picsum.photos/300/150" label="Card Title 4">
+								</ontario-card>
+							</ontario-card-collection>
+							<h3>Horizontal cards with left align 9:16 images (one-fourth size)</h3>
+							<ontario-card-collection cards-per-row="4">
+								<ontario-card
+									layout="horizontal"
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/169/300"
 									horizontal-image-position-type="left"
 									horizontal-image-size-type="one-fourth"
+									label="Card Title 1"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
 									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/169/300"
+									header-colour="sky"
+									horizontal-image-position-type="left"
+									horizontal-image-size-type="one-fourth"
+									label="Card Title 2"
 								>
 								</ontario-card>
 								<ontario-card
-									card-type="basic"
-									label="Card Title 4"
-									image="https://picsum.photos/200/300"
+									layout="horizontal"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="left"
+									horizontal-image-size-type="one-fourth"
+									label="Card Title 3"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									header-colour="sky"
+									image="https://picsum.photos/169/300"
 									horizontal-image-position-type="left"
 									horizontal-image-size-type="one-fourth"
+									label="Card Title 4"
+								>
+								</ontario-card>
+							</ontario-card-collection>
+							<h3>Horizontal cards with left align 9:16 images (one-third size)</h3>
+							<ontario-card-collection cards-per-row="4">
+								<ontario-card
+									layout="horizontal"
 									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="left"
+									horizontal-image-size-type="one-third"
+									label="Card Title 1"
 								>
 								</ontario-card>
 								<ontario-card
-									card-type="basic"
-									label="Card Title 5"
-									image="https://picsum.photos/200/300"
+									layout="horizontal"
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/169/300"
+									header-colour="sky"
 									horizontal-image-position-type="left"
+									horizontal-image-size-type="one-third"
+									label="Card Title 2"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="left"
+									horizontal-image-size-type="one-third"
+									label="Card Title 3"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									header-colour="sky"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="left"
+									horizontal-image-size-type="one-third"
+									label="Card Title 4"
+								>
+								</ontario-card>
+							</ontario-card-collection>
+							<h3>Horizontal cards with right align 9:16 images (one-fourth size)</h3>
+							<ontario-card-collection cards-per-row="4">
+								<ontario-card
+									layout="horizontal"
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="right"
+									horizontal-image-size-type="one-fourth"
+									label="Card Title 1"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/169/300"
+									header-colour="sky"
+									horizontal-image-position-type="right"
 									horizontal-image-size-type="one-fourth"
+									label="Card Title 2"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="right"
+									horizontal-image-size-type="one-fourth"
+									label="Card Title 3"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									header-colour="sky"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="right"
+									horizontal-image-size-type="one-fourth"
+									label="Card Title 4"
+								>
+								</ontario-card>
+							</ontario-card-collection>
+							<h3>Horizontal cards with right align 9:16 images (one-third size)</h3>
+							<ontario-card-collection cards-per-row="4">
+								<ontario-card
+									layout="horizontal"
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="right"
+									horizontal-image-size-type="one-third"
+									label="Card Title 1"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+									image="https://picsum.photos/169/300"
+									header-colour="sky"
+									horizontal-image-position-type="right"
+									horizontal-image-size-type="one-third"
+									label="Card Title 2"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="right"
+									horizontal-image-size-type="one-third"
+									label="Card Title 3"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									header-colour="sky"
+									image="https://picsum.photos/169/300"
+									horizontal-image-position-type="right"
+									horizontal-image-size-type="one-third"
+									label="Card Title 4"
+								>
+								</ontario-card>
+							</ontario-card-collection>
+							<h3>Edge cases</h3>
+							<ontario-card-collection cards-per-row="3">
+								<ontario-card
+									header-colour="orange"
+									label="Card Title 1 Card Title 1 Card Title 1"
+									image="https://picsum.photos/200/300"
+								>
+								</ontario-card>
+								<ontario-card
+									header-colour="sky"
+									label="Card Title 2"
+									image="https://picsum.photos/200/300"
 									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
 								>
 								</ontario-card>
 								<ontario-card
-									card-type="basic"
-									label="Card Title 6"
+									label="Card Title 3"
+									image="https://picsum.photos/200/300"
+									description="Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum"
+								>
+								</ontario-card>
+							</ontario-card-collection>
+							<ontario-card-collection cards-per-row="2">
+								<ontario-card
+									layout="horizontal"
+									header-colour="orange"
+									label="Card Title 1 Card Title 1 Card Title 1"
+									image="https://picsum.photos/200/300"
+									horizontal-image-position-type="left"
+									horizontal-image-size-type="one-third"
+								>
+								</ontario-card>
+								<ontario-card
+									layout="horizontal"
+									header-colour="sky"
+									label="Card Title 2"
 									image="https://picsum.photos/200/300"
 									horizontal-image-position-type="left"
 									horizontal-image-size-type="one-fourth"
@@ -235,8 +458,8 @@
 								>
 								</ontario-card>
 								<ontario-card
-									card-type="basic"
-									label="Card Title 7"
+									layout="horizontal"
+									label="Card Title 3"
 									image="https://picsum.photos/200/300"
 									horizontal-image-position-type="left"
 									horizontal-image-size-type="one-fourth"
@@ -942,6 +1165,36 @@
 							number-of-steps="5"
 						></ontario-step-indicator>
 					</div>
+					<hr />
+					<!-- Search box -->
+					<script>
+						window.addEventListener('load', () => {
+							console.log('Loaded Search Box Event Listener');
+							const searchBox = document.getElementById('ontario-search-box');
+							searchBox.performSearch = async ($value) => {
+								console.log('Performing search with value:', $value);
+							};
+							searchBox.addEventListener('searchOnSubmit', (event) => {
+								console.log('Search Event:', event);
+							});
+						});
+					</script>
+					<div>
+						<h2 id="search-box">Search box</h2>
+						<ontario-search-box
+							id="ontario-search-box"
+							caption='{
+							"captionText": "Search directory",
+							"captionType": "default"
+						}'
+							hint-text="Search by employee name or organization name."
+						></ontario-search-box>
+					</div>
+					<hr />
 					<div>
 						<!-- Form -->
 						<form id="sample-form">
@@ -1133,6 +1386,10 @@
 				},
 				"printerLink": {
 					"href": "https://www.ontario.ca/page/copyright-information"
+				},
+				"termsOfUseLink": {
+					"text": "Terms of Use",
+					"href": "https://www.ontario.ca/page/terms-use"
 				}
 			}'
 			social-links='{
@@ -1208,24 +1465,6 @@
 		<ontario-back-to-top />
 		<script>
-			const changeLanguage = (e) => {
-				e.preventDefault();
-				let header = document.getElementById('ontarioHeader');
-				header.customLanguageToggle = () => {
-					setTimeout(() => {
-						window.location.href = '/french.html';
-						console.log(header);
-						console.log('Lang switch');
-					}, 5000);
-				};
-			};
-			window.addEventListener('load', changeLanguage);
-			function testFunction() {
-				alert('HELLO WORLD!');
-			}
 			function activateHeaderType(headerType) {
 				const ontarioHeaderElement = document.querySelector('ontario-header');
 				ontarioHeaderElement.type = headerType;

package/src/translations/global.i18n.json CHANGED Viewed

@@ -23,6 +23,16 @@
 			"fr": "Accessibilité"
 		}
 	},
+	"termsOfUse": {
+		"link": {
+			"en": "https://www.ontario.ca/page/terms-use",
+			"fr": "https://www.ontario.ca/fr/page/conditions-dutilisation"
+		},
+		"text": {
+			"en": "Terms of Use",
+			"fr": "Conditions d’utilisation"
+		}
+	},
 	"accordion": {
 		"collapse": {
 			"en": "Collapse all",

package/src/utils/common/input/input.tsx CHANGED Viewed

@@ -18,7 +18,8 @@ export type InputProps = {
 	onChange?: ((event: Event) => void) | undefined;
 	onBlur?: ((event: Event) => void) | undefined;
 	onFocus?: ((event: Event) => void) | undefined;
-	ref?: (el: any) => HTMLElement;
+	onClick?: ((event: Event) => void) | undefined;
+	ref?: (el: HTMLInputElement) => HTMLElement;
 };
 export const Input: FunctionalComponent<InputProps> = ({
@@ -36,6 +37,7 @@ export const Input: FunctionalComponent<InputProps> = ({
 	onChange,
 	onBlur,
 	onFocus,
+	onClick,
 	ariaInvalid,
 	ariaDescribedBy,
 	ref,
@@ -58,6 +60,7 @@ export const Input: FunctionalComponent<InputProps> = ({
 			onChange={onChange}
 			onBlur={onBlur}
 			onFocus={onFocus}
+			onClick={onClick}
 			inputMode={inputMode}
 			ref={ref}
 			aria-invalid={ariaInvalid}

package/src/utils/common/input-caption/input-caption.tsx CHANGED Viewed

@@ -76,20 +76,26 @@ export class InputCaption implements CaptionInfo {
 	/**
 	 * Return the `<label>` element for text inputs
 	 * @param captionFor Set the `htmlFor` attribute
+	 * @param hasHintExpander Indicate whether the component the label is for has a hint expander or not
+	 * @param disableRequiredFlag Disable the required/optional label text _(only use in highly special cases)_
 	 * @returns element containing the caption for the input
 	 */
-	getCaption = (captionFor?: string | undefined, hasHintExpander: boolean = false): HTMLElement => {
+	getCaption = (
+		captionFor?: string | undefined,
+		hasHintExpander: boolean = false,
+		disableRequiredFlag: boolean = false,
+	): HTMLElement => {
 		const captionText = this.captionText && this.captionText.toLowerCase();
 		const captionContent = this.isLegend ? (
 			<legend class={this.getClass()}>
 				{this.captionType === 'heading' ? <h1>{this.captionText}</h1> : this.captionText}
-				{this.getRequiredFlagElement()}
+				{!disableRequiredFlag && this.getRequiredFlagElement()}
 				{hasHintExpander && this.getHintExpanderAccessibilityText(captionText, false)}
 			</legend>
 		) : (
 			<label htmlFor={captionFor} class={this.getClass()}>
 				{this.captionText}
-				{this.getRequiredFlagElement()}
+				{!disableRequiredFlag && this.getRequiredFlagElement()}
 				{hasHintExpander && this.getHintExpanderAccessibilityText(captionText, false)}
 			</label>
 		);
@@ -147,8 +153,8 @@ export class InputCaption implements CaptionInfo {
 				? `ontario-fieldset__legend ontario-fieldset__legend--${this.captionType}`
 				: `ontario-label ontario-label--${this.captionType}`
 			: this.isLegend
-			? 'ontario-fieldset__legend'
-			: 'ontario-label';
+				? 'ontario-fieldset__legend'
+				: 'ontario-label';
 	}
 	/**

package/src/utils/console-message/console-message.ts CHANGED Viewed

@@ -47,7 +47,7 @@ export function printConsoleMessage(
 			: messages?.reduce(
 					(message: string, currentObject: ConsoleMessage) => (message += addSpecifier(currentObject.message) ?? ''),
 					hasDesignSystemTag ? addSpecifier(designSystemTag) : '',
-			  );
+				);
 	// array of arguments to be passed into the the console function
 	const messageArray: string[] = [];

package/src/utils/helper/utils.spec.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { format } from './utils';
+import { format, isNumber, retrieveEnumKeys } from './utils';
 describe('format', () => {
 	it('returns empty string for no names defined', () => {
@@ -17,3 +17,129 @@ describe('format', () => {
 		expect(format('Joseph', 'Quincy', 'Publique')).toEqual('Joseph Quincy Publique');
 	});
 });
+describe('isNumber', () => {
+	it('should return false if value is undefined', () => {
+		const value: any = undefined;
+		const result = isNumber(value);
+		expect(result).toEqual(false);
+	});
+	it('should return false if value that is null', () => {
+		const value: any = null;
+		const result = isNumber(value);
+		expect(result).toEqual(false);
+	});
+	it('should return true if value is a number', () => {
+		const value: number = 2000;
+		const result = isNumber(value);
+		expect(result).toEqual(true);
+	});
+	it('should return true if value is a number as a string', () => {
+		const value: string = '2000';
+		const result = isNumber(value);
+		expect(result).toEqual(true);
+	});
+	it('should return false if value is not a number string', () => {
+		const value: string = 'two-thousand';
+		const result = isNumber(value);
+		expect(result).toEqual(false);
+	});
+});
+describe('isNumber', () => {
+	it('should return false if value is undefined', () => {
+		const value: any = undefined;
+		const result = isNumber(value);
+		expect(result).toEqual(false);
+	});
+	it('should return false if value that is null', () => {
+		const value: any = null;
+		const result = isNumber(value);
+		expect(result).toEqual(false);
+	});
+	it('should return true if value is a number', () => {
+		const value: number = 2000;
+		const result = isNumber(value);
+		expect(result).toEqual(true);
+	});
+	it('should return true if value is a number as a string', () => {
+		const value: string = '2000';
+		const result = isNumber(value);
+		expect(result).toEqual(true);
+	});
+	it('should return false if value is not a number string', () => {
+		const value: string = 'two-thousand';
+		const result = isNumber(value);
+		expect(result).toEqual(false);
+	});
+});
+enum ColourEnumNumeric {
+	RED,
+	ORANGE,
+	YELLOW,
+	GREEN,
+	BLUE,
+	INDIGO,
+	VIOLET,
+}
+enum ColourEnumString {
+	'red' = 'Red',
+	'orange' = 'Orange',
+	'yellow' = 'Yellow',
+	'green' = 'Green',
+	'blue' = 'Blue',
+	'indigo' = 'Indigo',
+	'violet' = 'Violet',
+}
+describe('retrieveEnumKeys', () => {
+	it('should return empty array if enumObject is undefined', () => {
+		const expectedResult = new Array<string>(0);
+		const enumObject: any = undefined;
+		const result = retrieveEnumKeys(enumObject);
+		expect(result).toEqual(expectedResult);
+	});
+	it('should return empty array if enumObject is null', () => {
+		const expectedResult = new Array<string>(0);
+		const enumObject: any = null;
+		const result = retrieveEnumKeys(enumObject);
+		expect(result).toEqual(expectedResult);
+	});
+	it('should return keys from numerical enum', () => {
+		const expectedResult = ['RED', 'ORANGE', 'YELLOW', 'GREEN', 'BLUE', 'INDIGO', 'VIOLET'];
+		const result = retrieveEnumKeys(ColourEnumNumeric);
+		expect(result).toEqual(expectedResult);
+	});
+	it('should return keys from string enum', () => {
+		const expectedResult = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'];
+		const result = retrieveEnumKeys(ColourEnumString);
+		expect(result).toEqual(expectedResult);
+	});
+});

package/src/utils/helper/utils.ts CHANGED Viewed

@@ -67,7 +67,8 @@ export function removeObjectsBySpecificKey<T>(objects: T[], key: keyof T, value:
  * @returns {boolean}
  */
 export function isNumber(value: string | number): boolean {
-	return isNaN(Number(value)) === true;
+	if (value === undefined || value === null) return false;
+	return isNaN(Number(value)) === false;
 }
 export function isEmpty(str: string | undefined | null): boolean {
@@ -82,7 +83,8 @@ export function isEmpty(str: string | undefined | null): boolean {
  * @returns {string[]}
  */
 export function retrieveEnumKeys(enumObject: object): string[] {
-	return Object.keys(enumObject).filter(isNumber);
+	if (enumObject === undefined || enumObject === null) return new Array<string>(0);
+	return Object.keys(enumObject).filter((key) => !isNumber(key));
 }
 /**

package/src/utils/svgTransform.js CHANGED Viewed

@@ -3,10 +3,10 @@ const path = require('path');
 module.exports = {
 	process(src, filePath) {
 		if (path.extname(filePath) !== '.svg') {
-			return src;
+			return { code: src }; // Return an object with the code property
 		}
-		return 'module.exports = {};';
+		return { code: 'module.exports = {};' };
 	},
 	getCacheKey() {
 		// The output is always the same.

package/www/build/index.esm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":[],"sources":[],"mappings":""}
1	+ {"version":3,"names":[],"sources":[],"mappings":"","ignoreList":[]}