@ongov/ontario-design-system-component-library 5.0.0-alpha.6 → 6.0.0-alpha.1

package/www/build/p-6c70f7b2.entry.js

@@ -0,0 +1,139 @@
+import { r as c, a as e, h as a } from './p-DMZw5oVx.js';
+import { C as i } from './p-CJXRCL8b.js';
+const t =
+	'.ontario-icon svg,.ontario-icon{display:inline-block;stroke-width:0;stroke:currentColor;fill:currentColor;vertical-align:middle;overflow:hidden}.ontario-icon--blue svg{stroke:#0066CC;fill:#0066CC}.ontario-icon--grey svg{stroke:#666666;fill:#666666}.ontario-icon--black svg{stroke:#1A1A1A;fill:#1A1A1A}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}';
+const o = class {
+	constructor(e) {
+		c(this, e);
+	}
+	iconWidth = 24;
+	iconWidthState;
+	validateWidth() {
+		if (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {
+			const c = new i();
+			c.addDesignSystemTag()
+				.addMonospaceText(' icon-width ')
+				.addRegularText('on')
+				.addMonospaceText(' <ontario-icon-interac-en> ')
+				.addRegularText(
+					`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,
+				)
+				.addMonospaceText(' 24px ')
+				.addRegularText('was assumed.')
+				.printMessage();
+			this.iconWidthState = 24;
+		} else {
+			this.iconWidthState = this.iconWidth;
+		}
+	}
+	get host() {
+		return e(this);
+	}
+	validateColour() {
+		if (this.host.hasAttribute('colour')) {
+			const c = new i();
+			c.addDesignSystemTag()
+				.addMonospaceText(' colour ')
+				.addRegularText('on')
+				.addMonospaceText(' <ontario-icon-interac-en> ')
+				.addRegularText('cannot be set. The provided colour is ignored.')
+				.printMessage();
+		}
+	}
+	componentWillLoad() {
+		this.validateColour();
+		this.validateWidth();
+	}
+	render() {
+		return a(
+			'div',
+			{
+				key: '151d0ff1d04ce36bc6ba450c4fde686ed73ed3fc',
+				class: `ontario-icon ontario-icon--width-${this.iconWidthState}`,
+				style: { width: `${this.iconWidthState}px` },
+			},
+			a(
+				'svg',
+				{
+					key: 'd49c20a6acd764d7dd2953d7a58eac4e32336c42',
+					class: 'svg-icon',
+					role: 'img',
+					xmlns: 'http://www.w3.org/2000/svg',
+					viewBox: '0 0 24 24',
+					id: 'interac-en',
+				},
+				a('path', {
+					'key': '1103a5343a8798808a50648e30584fe75c1efc32',
+					'fill-rule': 'evenodd',
+					'd': 'M16.008 18.403c0 .7-.584 1.285-1.285 1.285H1.837c-.7 0-1.285-.584-1.285-1.285V5.517c0-.7.584-1.285 1.285-1.285h12.886c.7 0 1.285.584 1.285 1.285v12.886z',
+					'fill': '#ecaa20',
+				}),
+				a('path', {
+					key: '94e11c885bd98b02dc383d4ca58f00639a48508b',
+					d: 'M30.178 4H1.837C.98 4 .28 4.7.28 5.557v12.886C.28 19.3.98 20 1.837 20h28.34a1.56 1.56 0 0 0 1.557-1.557V5.557c0-.895-.7-1.557-1.557-1.557zM1.837 19.69c-.7 0-1.285-.584-1.285-1.285V5.518c0-.7.584-1.285 1.285-1.285h12.886c.7 0 1.285.584 1.285 1.285v12.886c0 .7-.584 1.285-1.285 1.285H1.837zm29.625-1.285c0 .7-.584 1.285-1.285 1.285h-14.56c.428-.273.662-.74.662-1.285V5.518c0-.545-.273-1.012-.662-1.285h14.56c.7 0 1.285.584 1.285 1.285v12.886z',
+					fill: '#fff',
+				}),
+				a('path', {
+					key: 'f2be9e833c2ea620c5fd7fc488308b469ff6532d',
+					d: 'M16.28 5.558v12.886c0 .545-.273 1.012-.662 1.285h14.56c.7 0 1.285-.584 1.285-1.285V5.558c0-.7-.584-1.285-1.285-1.285h-14.56c.39.272.662.74.662 1.285z',
+					fill: '#636466',
+				}),
+				a('path', {
+					key: '6ee364b486dc8406b224aff3442438af9796e318',
+					d: 'M19.122 9.564c1.05 0 1.207.74 1.207 1.83 0 1.05-.117 1.83-1.207 1.83-1.05 0-1.207-.74-1.207-1.83s.156-1.83 1.207-1.83zm0 3.114c.428 0 .467-.35.467-1.285s-.078-1.285-.467-1.285c-.428 0-.467.35-.467 1.285-.04.934.04 1.285.467 1.285zm1.674-2.176h.662v.3a.72.72 0 0 1 .662-.389c.428 0 .662.234.662.74V13.1h-.662v-1.83c0-.273-.078-.35-.272-.35-.234 0-.35.156-.35.428V13.1h-.662v-2.608h-.04zm3.192-.86h-.662v3.504h.662V9.643zm.584-.036h.662v.584h-.662v-.584zm0 .895h.662v2.647h-.662v-2.647zm1.246 0h.662v.3a.72.72 0 0 1 .662-.389c.428 0 .662.234.662.74V13.1h-.662v-1.83c0-.273-.078-.35-.273-.35-.233 0-.35.156-.35.428V13.1h-.662v-2.608h-.04zm3.036 1.44v.195c0 .3.078.623.35.623.234 0 .3-.156.35-.506h.623c-.04.623-.312.973-.973.973-.973 0-1.012-.74-1.012-1.402 0-.7.156-1.363 1.05-1.363.78 0 .973.545.973 1.324v.156h-1.363zm.7-.428c0-.4-.078-.623-.35-.623s-.35.273-.35.506v.117h.7z',
+					fill: '#fff',
+				}),
+				a(
+					'g',
+					{ key: 'a8728c40ba1b5fefb93eb3aa98149914e541c3bf', fill: '#000' },
+					a('path', {
+						key: '7005354079ced76d84d7ec52ccc63bbc6188ce6b',
+						d: 'M2.85 12.915c-.234-.04-.35.04-.35.04V10.97l.74-.156v.3s.195-.428.7-.545c.584-.117.78.195.78.7v1.985l-.78.195v-1.87c0-.312-.156-.35-.3-.312-.234.04-.4.312-.4.584v1.285c0-.04-.156-.195-.4-.234zm6.345-.74V9.4l.74-.156v.35s.195-.467.623-.584c.117-.04.195 0 .195 0v.7s-.156 0-.4.078c-.273.117-.4.35-.4.7v1.518l-.78.156z',
+					}),
+					a('path', {
+						key: '70e5386d04b841c596faf0480b4e3c2915fe21cf',
+						d: 'M5.38 13.068s-.117-.156-.117-.818v-1.362l-.39.078v-.584l.39-.078V9.68l.78-.195v.623l.545-.117v.584l-.545.117v1.402c0 .623.156.78.156.78l-.818.195z',
+					}),
+					a('path', {
+						key: '7f169c3d26187643442e4cc467fcd377de804a78',
+						d: 'M6.664 11.435c0-.506.078-.857.234-1.13.195-.3.467-.545.895-.623.856-.195 1.13.3 1.13.973v.35l-1.48.35v.04c0 .467.117.7.4.623.273-.04.3-.195.35-.428v-.117l.7-.156v.117c0 .273-.078.934-1.05 1.168-.934.195-1.168-.35-1.168-1.168zm1.13-1.246c-.234.04-.4.3-.4.7l.74-.195v-.117c.04-.312-.078-.467-.35-.4zm5.526-.39c-.04-.856.195-1.518 1.13-1.713.584-.117.817 0 .934.156s.156.35.156.623v.04l-.74.156v-.117c0-.3-.078-.428-.3-.4-.273.078-.4.35-.4.856v.234c0 .545.078.78.4.7.272-.04.3-.3.3-.506v-.156l.74-.156v.117c0 .7-.4 1.13-1.05 1.285-.934.3-1.13-.273-1.168-1.13zM10.8 11c0-.623.4-.856.934-1.1.506-.195.506-.3.506-.506 0-.156-.078-.273-.3-.234a.36.36 0 0 0-.312.35v.156l-.7.156s0-.234.04-.428c.117-.4.467-.623 1.05-.78.74-.156 1.012.156 1.012.662v1.246c0 .584.117.662.117.662l-.7.156s-.078-.117-.078-.234c0 0-.156.4-.7.506-.584.195-.856-.156-.856-.623zm1.44-.895s-.156.117-.4.233-.35.273-.35.467.117.3.3.273c.234-.04.4-.273.4-.545.04-.195.04-.4.04-.428z',
+					}),
+					a('path', {
+						'key': 'd071acf5e27d74331bef797a94769ee5a815ca3e',
+						'fill-rule': 'evenodd',
+						'd': 'M3.472 14.122l1.246.817a.68.68 0 0 1 .272.545v3.62h-1.4a1.31 1.31 0 0 1-1.324-1.324v-4.165a.45.45 0 0 1 .467-.467c.272 0 .467.234.467.467V16c0 .078.04.117.117.117s.117-.078.117-.156c.04-.04.04-1.83.04-1.83z',
+					}),
+					a('path', {
+						key: '8598ea94a7448377bf0f604ee5bd68618f6bbe14',
+						d: 'M1.02 14.394c-.04.078-.078.156-.078.234 0 .234.195.428.428.428h.078c.04 0 .35-.078.584-.117v-.74l-1.013.195z',
+					}),
+					a('use', { key: '60034507beac027a9dfd34d2ec7a4f49c0431877', href: '#B3' }),
+					a('use', { key: '6c0d57c59d8e2211f7ebfb66049808bbee47d956', href: '#B3', y: '1.014' }),
+					a('path', {
+						key: '2a22349e9e91b4bd99b58d7b36cd708a64f6501f',
+						d: 'M1.214 14.045V9.607l.818-.195v4.438l-.818.195zM14.762 7.62a.78.78 0 0 1-.779-.779.78.78 0 0 1 .779-.779.78.78 0 0 1 .779.779.78.78 0 0 1-.779.779zm0-1.48a.701.701 0 1 0 0 1.402.7.7 0 0 0 .701-.701c-.04-.4-.35-.7-.7-.7z',
+					}),
+					a('path', {
+						key: 'b4d4a45581698a7b25873b61f81ab949a5759b5e',
+						d: 'M14.45 6.334h.35c.117 0 .234.078.234.234 0 .117-.04.234-.156.234.078 0 .156.078.156.195v.195c0 .04.04.078.04.078h-.156s-.04-.04-.04-.078v-.195c0-.117-.04-.156-.156-.156h-.117v.428h-.156v-.935zm.273.428c.117 0 .156-.078.156-.156 0-.117-.04-.156-.156-.156h-.117v.312h.117z',
+					}),
+				),
+				a(
+					'defs',
+					{ key: '0b31c7335631813a5ba048773e3dff058da02da6' },
+					a('path', {
+						key: '59da551bef74af91e3a9269615c5036169d30b8e',
+						id: 'B3',
+						d: 'M1.02 15.406c-.04.078-.078.156-.078.234 0 .234.195.43.428.43h.078c.04 0 .35-.078.584-.117v-.74l-1.013.195z',
+					}),
+				),
+			),
+		);
+	}
+	static get watchers() {
+		return { iconWidth: ['validateWidth'] };
+	}
+};
+o.style = t;
+export { o as ontario_icon_interac_en };
+//# sourceMappingURL=p-6c70f7b2.entry.js.map

package/www/build/p-6c70f7b2.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ontarioIconCss","OntarioIconInteracEn","iconWidth","iconWidthState","validateWidth","isNaN","this","message","ConsoleMessageClass","addDesignSystemTag","addMonospaceText","addRegularText","printMessage","validateColour","host","hasAttribute","componentWillLoad","render","h","key","class","style","width","role","xmlns","viewBox","id","d","fill","href","y"],"sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-interac-en&encapsulation=shadow","src/components/ontario-icon/ontario-icon-interac-en.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State, Element } from '@stencil/core';\nimport { Icon } from './icon.interface';\nimport { IconSize } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\n\n@Component({\n\ttag: 'ontario-icon-interac-en',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconInteracEn implements Icon {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-interac-en> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Reference to the host element\n\t * Use to check if the host element has the `colour` attribute set\n\t */\n\t@Element() host: HTMLElement;\n\n\t/**\n\t * Validate that the `colour` attribute is not set by users\n\t * Prints a warning message if the `colour` attribute is set\n\t */\n\tvalidateColour() {\n\t\tif (this.host.hasAttribute('colour')) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' colour ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-interac-en> ')\n\t\t\t\t.addRegularText('cannot be set. The provided colour is ignored.')\n\t\t\t\t.printMessage();\n\t\t}\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg class=\"svg-icon\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" id=\"interac-en\">\n\t\t\t\t\t<path\n\t\t\t\t\t\tfill-rule=\"evenodd\"\n\t\t\t\t\t\td=\"M16.008 18.403c0 .7-.584 1.285-1.285 1.285H1.837c-.7 0-1.285-.584-1.285-1.285V5.517c0-.7.584-1.285 1.285-1.285h12.886c.7 0 1.285.584 1.285 1.285v12.886z\"\n\t\t\t\t\t\tfill=\"#ecaa20\"\n\t\t\t\t\t/>\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M30.178 4H1.837C.98 4 .28 4.7.28 5.557v12.886C.28 19.3.98 20 1.837 20h28.34a1.56 1.56 0 0 0 1.557-1.557V5.557c0-.895-.7-1.557-1.557-1.557zM1.837 19.69c-.7 0-1.285-.584-1.285-1.285V5.518c0-.7.584-1.285 1.285-1.285h12.886c.7 0 1.285.584 1.285 1.285v12.886c0 .7-.584 1.285-1.285 1.285H1.837zm29.625-1.285c0 .7-.584 1.285-1.285 1.285h-14.56c.428-.273.662-.74.662-1.285V5.518c0-.545-.273-1.012-.662-1.285h14.56c.7 0 1.285.584 1.285 1.285v12.886z\"\n\t\t\t\t\t\tfill=\"#fff\"\n\t\t\t\t\t/>\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M16.28 5.558v12.886c0 .545-.273 1.012-.662 1.285h14.56c.7 0 1.285-.584 1.285-1.285V5.558c0-.7-.584-1.285-1.285-1.285h-14.56c.39.272.662.74.662 1.285z\"\n\t\t\t\t\t\tfill=\"#636466\"\n\t\t\t\t\t/>\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M19.122 9.564c1.05 0 1.207.74 1.207 1.83 0 1.05-.117 1.83-1.207 1.83-1.05 0-1.207-.74-1.207-1.83s.156-1.83 1.207-1.83zm0 3.114c.428 0 .467-.35.467-1.285s-.078-1.285-.467-1.285c-.428 0-.467.35-.467 1.285-.04.934.04 1.285.467 1.285zm1.674-2.176h.662v.3a.72.72 0 0 1 .662-.389c.428 0 .662.234.662.74V13.1h-.662v-1.83c0-.273-.078-.35-.272-.35-.234 0-.35.156-.35.428V13.1h-.662v-2.608h-.04zm3.192-.86h-.662v3.504h.662V9.643zm.584-.036h.662v.584h-.662v-.584zm0 .895h.662v2.647h-.662v-2.647zm1.246 0h.662v.3a.72.72 0 0 1 .662-.389c.428 0 .662.234.662.74V13.1h-.662v-1.83c0-.273-.078-.35-.273-.35-.233 0-.35.156-.35.428V13.1h-.662v-2.608h-.04zm3.036 1.44v.195c0 .3.078.623.35.623.234 0 .3-.156.35-.506h.623c-.04.623-.312.973-.973.973-.973 0-1.012-.74-1.012-1.402 0-.7.156-1.363 1.05-1.363.78 0 .973.545.973 1.324v.156h-1.363zm.7-.428c0-.4-.078-.623-.35-.623s-.35.273-.35.506v.117h.7z\"\n\t\t\t\t\t\tfill=\"#fff\"\n\t\t\t\t\t/>\n\t\t\t\t\t<g fill=\"#000\">\n\t\t\t\t\t\t<path d=\"M2.85 12.915c-.234-.04-.35.04-.35.04V10.97l.74-.156v.3s.195-.428.7-.545c.584-.117.78.195.78.7v1.985l-.78.195v-1.87c0-.312-.156-.35-.3-.312-.234.04-.4.312-.4.584v1.285c0-.04-.156-.195-.4-.234zm6.345-.74V9.4l.74-.156v.35s.195-.467.623-.584c.117-.04.195 0 .195 0v.7s-.156 0-.4.078c-.273.117-.4.35-.4.7v1.518l-.78.156z\" />\n\t\t\t\t\t\t<path d=\"M5.38 13.068s-.117-.156-.117-.818v-1.362l-.39.078v-.584l.39-.078V9.68l.78-.195v.623l.545-.117v.584l-.545.117v1.402c0 .623.156.78.156.78l-.818.195z\" />\n\t\t\t\t\t\t<path d=\"M6.664 11.435c0-.506.078-.857.234-1.13.195-.3.467-.545.895-.623.856-.195 1.13.3 1.13.973v.35l-1.48.35v.04c0 .467.117.7.4.623.273-.04.3-.195.35-.428v-.117l.7-.156v.117c0 .273-.078.934-1.05 1.168-.934.195-1.168-.35-1.168-1.168zm1.13-1.246c-.234.04-.4.3-.4.7l.74-.195v-.117c.04-.312-.078-.467-.35-.4zm5.526-.39c-.04-.856.195-1.518 1.13-1.713.584-.117.817 0 .934.156s.156.35.156.623v.04l-.74.156v-.117c0-.3-.078-.428-.3-.4-.273.078-.4.35-.4.856v.234c0 .545.078.78.4.7.272-.04.3-.3.3-.506v-.156l.74-.156v.117c0 .7-.4 1.13-1.05 1.285-.934.3-1.13-.273-1.168-1.13zM10.8 11c0-.623.4-.856.934-1.1.506-.195.506-.3.506-.506 0-.156-.078-.273-.3-.234a.36.36 0 0 0-.312.35v.156l-.7.156s0-.234.04-.428c.117-.4.467-.623 1.05-.78.74-.156 1.012.156 1.012.662v1.246c0 .584.117.662.117.662l-.7.156s-.078-.117-.078-.234c0 0-.156.4-.7.506-.584.195-.856-.156-.856-.623zm1.44-.895s-.156.117-.4.233-.35.273-.35.467.117.3.3.273c.234-.04.4-.273.4-.545.04-.195.04-.4.04-.428z\" />\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\tfill-rule=\"evenodd\"\n\t\t\t\t\t\t\td=\"M3.472 14.122l1.246.817a.68.68 0 0 1 .272.545v3.62h-1.4a1.31 1.31 0 0 1-1.324-1.324v-4.165a.45.45 0 0 1 .467-.467c.272 0 .467.234.467.467V16c0 .078.04.117.117.117s.117-.078.117-.156c.04-.04.04-1.83.04-1.83z\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<path d=\"M1.02 14.394c-.04.078-.078.156-.078.234 0 .234.195.428.428.428h.078c.04 0 .35-.078.584-.117v-.74l-1.013.195z\" />\n\t\t\t\t\t\t<use href=\"#B3\" />\n\t\t\t\t\t\t<use href=\"#B3\" y=\"1.014\" />\n\t\t\t\t\t\t<path d=\"M1.214 14.045V9.607l.818-.195v4.438l-.818.195zM14.762 7.62a.78.78 0 0 1-.779-.779.78.78 0 0 1 .779-.779.78.78 0 0 1 .779.779.78.78 0 0 1-.779.779zm0-1.48a.701.701 0 1 0 0 1.402.7.7 0 0 0 .701-.701c-.04-.4-.35-.7-.7-.7z\" />\n\t\t\t\t\t\t<path d=\"M14.45 6.334h.35c.117 0 .234.078.234.234 0 .117-.04.234-.156.234.078 0 .156.078.156.195v.195c0 .04.04.078.04.078h-.156s-.04-.04-.04-.078v-.195c0-.117-.04-.156-.156-.156h-.117v.428h-.156v-.935zm.273.428c.117 0 .156-.078.156-.156 0-.117-.04-.156-.156-.156h-.117v.312h.117z\" />\n\t\t\t\t\t</g>\n\t\t\t\t\t<defs>\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\tid=\"B3\"\n\t\t\t\t\t\t\td=\"M1.02 15.406c-.04.078-.078.156-.078.234 0 .234.195.43.428.43h.078c.04 0 .35-.078.584-.117v-.74l-1.013.195z\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</defs>\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"mappings":"sFAAA,MAAMA,EAAiB,0Z,MCWVC,EAAoB,M,yBAKxBC,UAAsB,GAMrBC,eAOT,aAAAC,GACC,GAAIC,MAAMC,KAAKJ,aAAgBG,MAAMC,KAAKJ,YAAcI,KAAKJ,WAAa,EAAI,CAC7E,MAAMK,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,gBACjBC,eAAe,MACfD,iBAAiB,+BACjBC,eACA,GACCN,MAAMC,KAAKJ,WAAa,iCAAmC,0FAG5DQ,iBAAiB,UACjBC,eAAe,gBACfC,eACFN,KAAKH,eAAiB,E,KAChB,CACNG,KAAKH,eAAiBG,KAAKJ,S,4BAc7B,cAAAW,GACC,GAAIP,KAAKQ,KAAKC,aAAa,UAAW,CACrC,MAAMR,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,YACjBC,eAAe,MACfD,iBAAiB,+BACjBC,eAAe,kDACfC,c,EAOJ,iBAAAI,GACCV,KAAKO,iBACLP,KAAKF,e,CAMN,MAAAa,GACC,OACCC,EAAA,OAAAC,IAAA,2CACCC,MAAO,oCAAoCd,KAAKH,iBAChDkB,MAAO,CAAEC,MAAO,GAAGhB,KAAKH,qBAExBe,EAAA,OAAAC,IAAA,2CAAKC,MAAM,WAAWG,KAAK,MAAMC,MAAM,6BAA6BC,QAAQ,YAAYC,GAAG,cAC1FR,EACW,QAAAC,IAAA,iEACVQ,EAAE,2JACFC,KAAK,YAENV,EAAA,QAAAC,IAAA,2CACCQ,EAAE,2bACFC,KAAK,SAENV,EAAA,QAAAC,IAAA,2CACCQ,EAAE,wJACFC,KAAK,YAENV,EAAA,QAAAC,IAAA,2CACCQ,EAAE,82BACFC,KAAK,SAENV,EAAG,KAAAC,IAAA,2CAAAS,KAAK,QACPV,EAAM,QAAAC,IAAA,2CAAAQ,EAAE,+TACRT,EAAM,QAAAC,IAAA,2CAAAQ,EAAE,uJACRT,EAAM,QAAAC,IAAA,2CAAAQ,EAAE,u7BACRT,EAAA,QAAAC,IAAA,uDACW,UACVQ,EAAE,mNAEHT,EAAM,QAAAC,IAAA,2CAAAQ,EAAE,iHACRT,EAAK,OAAAC,IAAA,2CAAAU,KAAK,QACVX,EAAA,OAAAC,IAAA,2CAAKU,KAAK,MAAMC,EAAE,UAClBZ,EAAM,QAAAC,IAAA,2CAAAQ,EAAE,+NACRT,EAAA,QAAAC,IAAA,2CAAMQ,EAAE,oRAETT,EAAA,QAAAC,IAAA,4CACCD,EAAA,QAAAC,IAAA,2CACCO,GAAG,KACHC,EAAE,iH","ignoreList":[]}

package/www/build/p-6e6b81c0.entry.js

@@ -0,0 +1,92 @@
+import { r as o, h as i } from './p-DMZw5oVx.js';
+import { v as t, a as s, I as e } from './p-_eQ6Jzc4.js';
+import { C as a } from './p-CJXRCL8b.js';
+const n =
+	'.ontario-icon svg,.ontario-icon{display:inline-block;stroke-width:0;stroke:currentColor;fill:currentColor;vertical-align:middle;overflow:hidden}.ontario-icon--blue svg{stroke:#0066CC;fill:#0066CC}.ontario-icon--grey svg{stroke:#666666;fill:#666666}.ontario-icon--black svg{stroke:#1A1A1A;fill:#1A1A1A}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}';
+const l = class {
+	constructor(i) {
+		o(this, i);
+	}
+	iconWidth = 24;
+	iconWidthState;
+	validateWidth() {
+		if (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {
+			const o = new a();
+			o.addDesignSystemTag()
+				.addMonospaceText(' icon-width ')
+				.addRegularText('on')
+				.addMonospaceText(' <ontario-icon-download> ')
+				.addRegularText(
+					`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,
+				)
+				.addMonospaceText(' 24px ')
+				.addRegularText('was assumed.')
+				.printMessage();
+			this.iconWidthState = 24;
+		} else {
+			this.iconWidthState = this.iconWidth;
+		}
+	}
+	colour = 'black';
+	iconColourState;
+	iconCustomColourState;
+	validateColour() {
+		const o = t(this.colour, e);
+		if (o) {
+			this.iconColourState = this.colour;
+		} else {
+			if (s(this.colour)) {
+				this.iconCustomColourState = this.colour;
+			} else {
+				this.iconColourState = this.warnDefaultColour();
+			}
+		}
+	}
+	warnDefaultColour() {
+		const o = new a();
+		o.addDesignSystemTag()
+			.addMonospaceText(' colour ')
+			.addRegularText('on')
+			.addMonospaceText(' <ontario-icon-download> ')
+			.addRegularText('was set to an invalid colour; only')
+			.addMonospaceText(' black, blue, grey or white ')
+			.addRegularText('are supported. The default colour')
+			.addMonospaceText(' black ')
+			.addRegularText('is assumed.')
+			.printMessage();
+		return 'black';
+	}
+	componentWillLoad() {
+		this.validateColour();
+		this.validateWidth();
+	}
+	render() {
+		return i(
+			'div',
+			{
+				key: '6d01423125531dec1fc54790c3fdf8f1f4814493',
+				class: `ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`,
+				style: { width: `${this.iconWidthState}px` },
+			},
+			i(
+				'svg',
+				{
+					key: '5b72b61d6ad04a2d1dc3bd827d6b459626ece101',
+					class: 'svg-icon',
+					style: { fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` },
+					role: 'img',
+					xmlns: 'http://www.w3.org/2000/svg',
+					viewBox: '0 0 24 24',
+					id: 'download',
+				},
+				i('path', { key: 'b52236b2f5472fe86066764fdf8591ffc7284dae', d: 'M5 20h14v-2H5v2zM19 9h-4V3H9v6H5l7 7 7-7z' }),
+			),
+		);
+	}
+	static get watchers() {
+		return { iconWidth: ['validateWidth'], colour: ['validateColour'] };
+	}
+};
+l.style = n;
+export { l as ontario_icon_download };
+//# sourceMappingURL=p-6e6b81c0.entry.js.map

package/www/build/p-6e6b81c0.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ontarioIconCss","OntarioIconDownload","iconWidth","iconWidthState","validateWidth","isNaN","this","message","ConsoleMessageClass","addDesignSystemTag","addMonospaceText","addRegularText","printMessage","colour","iconColourState","iconCustomColourState","validateColour","isValid","validateValueAgainstArray","IconColours","validateColor","warnDefaultColour","componentWillLoad","render","h","key","class","style","width","fill","stroke","role","xmlns","viewBox","id","d"],"sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-download&encapsulation=shadow","src/components/ontario-icon/ontario-icon-download.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-download',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconDownload implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-download> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-download> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"download\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M5 20h14v-2H5v2zM19 9h-4V3H9v6H5l7 7 7-7z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"mappings":"iIAAA,MAAMA,EAAiB,0Z,MCaVC,EAAmB,M,yBAKvBC,UAAsB,GAMrBC,eAOT,aAAAC,GACC,GAAIC,MAAMC,KAAKJ,aAAgBG,MAAMC,KAAKJ,YAAcI,KAAKJ,WAAa,EAAI,CAC7E,MAAMK,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,gBACjBC,eAAe,MACfD,iBAAiB,6BACjBC,eACA,GACCN,MAAMC,KAAKJ,WAAa,iCAAmC,0FAG5DQ,iBAAiB,UACjBC,eAAe,gBACfC,eACFN,KAAKH,eAAiB,E,KAChB,CACNG,KAAKH,eAAiBG,KAAKJ,S,EAOrBW,OAAqB,QAMpBC,gBAMAC,sBAQT,cAAAC,GACC,MAAMC,EAAUC,EAA0BZ,KAAKO,OAAQM,GACvD,GAAIF,EAAS,CACZX,KAAKQ,gBAAkBR,KAAKO,M,KACtB,CACN,GAAIO,EAAcd,KAAKO,QAAS,CAC/BP,KAAKS,sBAAwBT,KAAKO,M,KAC5B,CACNP,KAAKQ,gBAAkBR,KAAKe,mB,GASvB,iBAAAA,GACP,MAAMd,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,YACjBC,eAAe,MACfD,iBAAiB,6BACjBC,eAAe,sCACfD,iBAAiB,gCACjBC,eAAe,qCACfD,iBAAiB,WACjBC,eAAe,eACfC,eACF,MAAO,O,CAMR,iBAAAU,GACChB,KAAKU,iBACLV,KAAKF,e,CAMN,MAAAmB,GACC,OACCC,EACC,OAAAC,IAAA,2CAAAC,MAAO,8BAA8BpB,KAAKQ,uCAAuCR,KAAKH,iBACtFwB,MAAO,CAAEC,MAAO,GAAGtB,KAAKH,qBAExBqB,EAAA,OAAAC,IAAA,2CACCC,MAAM,WACNC,MAAO,CAAEE,KAAM,GAAGvB,KAAKS,wBAAyBe,OAAQ,GAAGxB,KAAKS,yBAChEgB,KAAK,MACLC,MAAM,6BACNC,QAAQ,YACRC,GAAG,YAEHV,EAAA,QAAAC,IAAA,2CAAMU,EAAE,+C","ignoreList":[]}

package/www/build/p-712d4b56.entry.js

@@ -0,0 +1,95 @@
+import { r as o, h as i } from './p-DMZw5oVx.js';
+import { v as t, a as s, I as e } from './p-_eQ6Jzc4.js';
+import { C as a } from './p-CJXRCL8b.js';
+const n =
+	'.ontario-icon svg,.ontario-icon{display:inline-block;stroke-width:0;stroke:currentColor;fill:currentColor;vertical-align:middle;overflow:hidden}.ontario-icon--blue svg{stroke:#0066CC;fill:#0066CC}.ontario-icon--grey svg{stroke:#666666;fill:#666666}.ontario-icon--black svg{stroke:#1A1A1A;fill:#1A1A1A}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}';
+const l = class {
+	constructor(i) {
+		o(this, i);
+	}
+	iconWidth = 24;
+	iconWidthState;
+	validateWidth() {
+		if (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {
+			const o = new a();
+			o.addDesignSystemTag()
+				.addMonospaceText(' icon-width ')
+				.addRegularText('on')
+				.addMonospaceText(' <ontario-icon-lock-on> ')
+				.addRegularText(
+					`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,
+				)
+				.addMonospaceText(' 24px ')
+				.addRegularText('was assumed.')
+				.printMessage();
+			this.iconWidthState = 24;
+		} else {
+			this.iconWidthState = this.iconWidth;
+		}
+	}
+	colour = 'black';
+	iconColourState;
+	iconCustomColourState;
+	validateColour() {
+		const o = t(this.colour, e);
+		if (o) {
+			this.iconColourState = this.colour;
+		} else {
+			if (s(this.colour)) {
+				this.iconCustomColourState = this.colour;
+			} else {
+				this.iconColourState = this.warnDefaultColour();
+			}
+		}
+	}
+	warnDefaultColour() {
+		const o = new a();
+		o.addDesignSystemTag()
+			.addMonospaceText(' colour ')
+			.addRegularText('on')
+			.addMonospaceText(' <ontario-icon-lock-on> ')
+			.addRegularText('was set to an invalid colour; only')
+			.addMonospaceText(' black, blue, grey or white ')
+			.addRegularText('are supported. The default colour')
+			.addMonospaceText(' black ')
+			.addRegularText('is assumed.')
+			.printMessage();
+		return 'black';
+	}
+	componentWillLoad() {
+		this.validateColour();
+		this.validateWidth();
+	}
+	render() {
+		return i(
+			'div',
+			{
+				key: 'bf6da76f6ee9a826f038a357e1347665e2a718a5',
+				class: `ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`,
+				style: { width: `${this.iconWidthState}px` },
+			},
+			i(
+				'svg',
+				{
+					key: '12c87279a2e6823babd9cfbfa2af721400cb8085',
+					class: 'svg-icon',
+					style: { fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` },
+					role: 'img',
+					xmlns: 'http://www.w3.org/2000/svg',
+					viewBox: '0 0 24 24',
+					id: 'lock-on',
+				},
+				i('path', {
+					key: '0e722f3f8e6ddda51f3e67b52a0119aab6db379b',
+					d: 'M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.7 1.4-3.1 3.1-3.1s3.1 1.4 3.1 3.1v2z',
+				}),
+			),
+		);
+	}
+	static get watchers() {
+		return { iconWidth: ['validateWidth'], colour: ['validateColour'] };
+	}
+};
+l.style = n;
+export { l as ontario_icon_lock_on };
+//# sourceMappingURL=p-712d4b56.entry.js.map

package/www/build/p-712d4b56.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ontarioIconCss","OntarioIconLockOn","iconWidth","iconWidthState","validateWidth","isNaN","this","message","ConsoleMessageClass","addDesignSystemTag","addMonospaceText","addRegularText","printMessage","colour","iconColourState","iconCustomColourState","validateColour","isValid","validateValueAgainstArray","IconColours","validateColor","warnDefaultColour","componentWillLoad","render","h","key","class","style","width","fill","stroke","role","xmlns","viewBox","id","d"],"sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-lock-on&encapsulation=shadow","src/components/ontario-icon/ontario-icon-lock-on.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-lock-on',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconLockOn implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-lock-on> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-lock-on> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"lock-on\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.7 1.4-3.1 3.1-3.1s3.1 1.4 3.1 3.1v2z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"mappings":"iIAAA,MAAMA,EAAiB,0Z,MCaVC,EAAiB,M,yBAKrBC,UAAsB,GAMrBC,eAOT,aAAAC,GACC,GAAIC,MAAMC,KAAKJ,aAAgBG,MAAMC,KAAKJ,YAAcI,KAAKJ,WAAa,EAAI,CAC7E,MAAMK,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,gBACjBC,eAAe,MACfD,iBAAiB,4BACjBC,eACA,GACCN,MAAMC,KAAKJ,WAAa,iCAAmC,0FAG5DQ,iBAAiB,UACjBC,eAAe,gBACfC,eACFN,KAAKH,eAAiB,E,KAChB,CACNG,KAAKH,eAAiBG,KAAKJ,S,EAOrBW,OAAqB,QAMpBC,gBAMAC,sBAQT,cAAAC,GACC,MAAMC,EAAUC,EAA0BZ,KAAKO,OAAQM,GACvD,GAAIF,EAAS,CACZX,KAAKQ,gBAAkBR,KAAKO,M,KACtB,CACN,GAAIO,EAAcd,KAAKO,QAAS,CAC/BP,KAAKS,sBAAwBT,KAAKO,M,KAC5B,CACNP,KAAKQ,gBAAkBR,KAAKe,mB,GASvB,iBAAAA,GACP,MAAMd,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,YACjBC,eAAe,MACfD,iBAAiB,4BACjBC,eAAe,sCACfD,iBAAiB,gCACjBC,eAAe,qCACfD,iBAAiB,WACjBC,eAAe,eACfC,eACF,MAAO,O,CAMR,iBAAAU,GACChB,KAAKU,iBACLV,KAAKF,e,CAMN,MAAAmB,GACC,OACCC,EACC,OAAAC,IAAA,2CAAAC,MAAO,8BAA8BpB,KAAKQ,uCAAuCR,KAAKH,iBACtFwB,MAAO,CAAEC,MAAO,GAAGtB,KAAKH,qBAExBqB,EAAA,OAAAC,IAAA,2CACCC,MAAM,WACNC,MAAO,CAAEE,KAAM,GAAGvB,KAAKS,wBAAyBe,OAAQ,GAAGxB,KAAKS,yBAChEgB,KAAK,MACLC,MAAM,6BACNC,QAAQ,YACRC,GAAG,WAEHV,EAAA,QAAAC,IAAA,2CAAMU,EAAE,6N","ignoreList":[]}

package/www/build/p-76630ce4.entry.js

@@ -0,0 +1,95 @@
+import { r as o, h as i } from './p-DMZw5oVx.js';
+import { v as t, a as s, I as e } from './p-_eQ6Jzc4.js';
+import { C as a } from './p-CJXRCL8b.js';
+const r =
+	'.ontario-icon svg,.ontario-icon{display:inline-block;stroke-width:0;stroke:currentColor;fill:currentColor;vertical-align:middle;overflow:hidden}.ontario-icon--blue svg{stroke:#0066CC;fill:#0066CC}.ontario-icon--grey svg{stroke:#666666;fill:#666666}.ontario-icon--black svg{stroke:#1A1A1A;fill:#1A1A1A}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}';
+const n = class {
+	constructor(i) {
+		o(this, i);
+	}
+	iconWidth = 24;
+	iconWidthState;
+	validateWidth() {
+		if (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {
+			const o = new a();
+			o.addDesignSystemTag()
+				.addMonospaceText(' icon-width ')
+				.addRegularText('on')
+				.addMonospaceText(' <ontario-icon-export> ')
+				.addRegularText(
+					`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,
+				)
+				.addMonospaceText(' 24px ')
+				.addRegularText('was assumed.')
+				.printMessage();
+			this.iconWidthState = 24;
+		} else {
+			this.iconWidthState = this.iconWidth;
+		}
+	}
+	colour = 'black';
+	iconColourState;
+	iconCustomColourState;
+	validateColour() {
+		const o = t(this.colour, e);
+		if (o) {
+			this.iconColourState = this.colour;
+		} else {
+			if (s(this.colour)) {
+				this.iconCustomColourState = this.colour;
+			} else {
+				this.iconColourState = this.warnDefaultColour();
+			}
+		}
+	}
+	warnDefaultColour() {
+		const o = new a();
+		o.addDesignSystemTag()
+			.addMonospaceText(' colour ')
+			.addRegularText('on')
+			.addMonospaceText(' <ontario-icon-export> ')
+			.addRegularText('was set to an invalid colour; only')
+			.addMonospaceText(' black, blue, grey or white ')
+			.addRegularText('are supported. The default colour')
+			.addMonospaceText(' black ')
+			.addRegularText('is assumed.')
+			.printMessage();
+		return 'black';
+	}
+	componentWillLoad() {
+		this.validateColour();
+		this.validateWidth();
+	}
+	render() {
+		return i(
+			'div',
+			{
+				key: '279e654599137ed929cad64ffb7d0f3a50afd83c',
+				class: `ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`,
+				style: { width: `${this.iconWidthState}px` },
+			},
+			i(
+				'svg',
+				{
+					key: '18fa2d641d08bcbd7cf15c94e56e4dd39b5fbca1',
+					class: 'svg-icon',
+					style: { fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` },
+					role: 'img',
+					xmlns: 'http://www.w3.org/2000/svg',
+					viewBox: '0 0 24 24',
+					id: 'export',
+				},
+				i('path', {
+					key: 'e6cd771fc86f30285bf3c9467757f69941425d25',
+					d: 'M19 12v7H5v-7H3v7c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-7h-2zm-6 .67l2.6-2.58 1.4 1.4-5 5-5-5 1.4-1.4 2.6 2.58V3h2v9.67z',
+				}),
+			),
+		);
+	}
+	static get watchers() {
+		return { iconWidth: ['validateWidth'], colour: ['validateColour'] };
+	}
+};
+n.style = r;
+export { n as ontario_icon_export };
+//# sourceMappingURL=p-76630ce4.entry.js.map

package/www/build/p-76630ce4.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ontarioIconCss","OntarioIconExport","iconWidth","iconWidthState","validateWidth","isNaN","this","message","ConsoleMessageClass","addDesignSystemTag","addMonospaceText","addRegularText","printMessage","colour","iconColourState","iconCustomColourState","validateColour","isValid","validateValueAgainstArray","IconColours","validateColor","warnDefaultColour","componentWillLoad","render","h","key","class","style","width","fill","stroke","role","xmlns","viewBox","id","d"],"sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-export&encapsulation=shadow","src/components/ontario-icon/ontario-icon-export.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-export',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconExport implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-export> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-export> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"export\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M19 12v7H5v-7H3v7c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-7h-2zm-6 .67l2.6-2.58 1.4 1.4-5 5-5-5 1.4-1.4 2.6 2.58V3h2v9.67z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"mappings":"iIAAA,MAAMA,EAAiB,0Z,MCaVC,EAAiB,M,yBAKrBC,UAAsB,GAMrBC,eAOT,aAAAC,GACC,GAAIC,MAAMC,KAAKJ,aAAgBG,MAAMC,KAAKJ,YAAcI,KAAKJ,WAAa,EAAI,CAC7E,MAAMK,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,gBACjBC,eAAe,MACfD,iBAAiB,2BACjBC,eACA,GACCN,MAAMC,KAAKJ,WAAa,iCAAmC,0FAG5DQ,iBAAiB,UACjBC,eAAe,gBACfC,eACFN,KAAKH,eAAiB,E,KAChB,CACNG,KAAKH,eAAiBG,KAAKJ,S,EAOrBW,OAAqB,QAMpBC,gBAMAC,sBAQT,cAAAC,GACC,MAAMC,EAAUC,EAA0BZ,KAAKO,OAAQM,GACvD,GAAIF,EAAS,CACZX,KAAKQ,gBAAkBR,KAAKO,M,KACtB,CACN,GAAIO,EAAcd,KAAKO,QAAS,CAC/BP,KAAKS,sBAAwBT,KAAKO,M,KAC5B,CACNP,KAAKQ,gBAAkBR,KAAKe,mB,GASvB,iBAAAA,GACP,MAAMd,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,YACjBC,eAAe,MACfD,iBAAiB,2BACjBC,eAAe,sCACfD,iBAAiB,gCACjBC,eAAe,qCACfD,iBAAiB,WACjBC,eAAe,eACfC,eACF,MAAO,O,CAMR,iBAAAU,GACChB,KAAKU,iBACLV,KAAKF,e,CAMN,MAAAmB,GACC,OACCC,EACC,OAAAC,IAAA,2CAAAC,MAAO,8BAA8BpB,KAAKQ,uCAAuCR,KAAKH,iBACtFwB,MAAO,CAAEC,MAAO,GAAGtB,KAAKH,qBAExBqB,EAAA,OAAAC,IAAA,2CACCC,MAAM,WACNC,MAAO,CAAEE,KAAM,GAAGvB,KAAKS,wBAAyBe,OAAQ,GAAGxB,KAAKS,yBAChEgB,KAAK,MACLC,MAAM,6BACNC,QAAQ,YACRC,GAAG,UAEHV,EAAA,QAAAC,IAAA,2CAAMU,EAAE,yH","ignoreList":[]}

package/www/build/p-79cf7e05.entry.js

@@ -0,0 +1,95 @@
+import { r as o, h as i } from './p-DMZw5oVx.js';
+import { v as t, a as s, I as e } from './p-_eQ6Jzc4.js';
+import { C as a } from './p-CJXRCL8b.js';
+const l =
+	'.ontario-icon svg,.ontario-icon{display:inline-block;stroke-width:0;stroke:currentColor;fill:currentColor;vertical-align:middle;overflow:hidden}.ontario-icon--blue svg{stroke:#0066CC;fill:#0066CC}.ontario-icon--grey svg{stroke:#666666;fill:#666666}.ontario-icon--black svg{stroke:#1A1A1A;fill:#1A1A1A}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}';
+const r = class {
+	constructor(i) {
+		o(this, i);
+	}
+	iconWidth = 24;
+	iconWidthState;
+	validateWidth() {
+		if (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {
+			const o = new a();
+			o.addDesignSystemTag()
+				.addMonospaceText(' icon-width ')
+				.addRegularText('on')
+				.addMonospaceText(' <ontario-icon-clock> ')
+				.addRegularText(
+					`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,
+				)
+				.addMonospaceText(' 24px ')
+				.addRegularText('was assumed.')
+				.printMessage();
+			this.iconWidthState = 24;
+		} else {
+			this.iconWidthState = this.iconWidth;
+		}
+	}
+	colour = 'black';
+	iconColourState;
+	iconCustomColourState;
+	validateColour() {
+		const o = t(this.colour, e);
+		if (o) {
+			this.iconColourState = this.colour;
+		} else {
+			if (s(this.colour)) {
+				this.iconCustomColourState = this.colour;
+			} else {
+				this.iconColourState = this.warnDefaultColour();
+			}
+		}
+	}
+	warnDefaultColour() {
+		const o = new a();
+		o.addDesignSystemTag()
+			.addMonospaceText(' colour ')
+			.addRegularText('on')
+			.addMonospaceText(' <ontario-icon-clock> ')
+			.addRegularText('was set to an invalid colour; only')
+			.addMonospaceText(' black, blue, grey or white ')
+			.addRegularText('are supported. The default colour')
+			.addMonospaceText(' black ')
+			.addRegularText('is assumed.')
+			.printMessage();
+		return 'black';
+	}
+	componentWillLoad() {
+		this.validateColour();
+		this.validateWidth();
+	}
+	render() {
+		return i(
+			'div',
+			{
+				key: 'ae7c83582f991b73743e027920e6623bdded3d94',
+				class: `ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`,
+				style: { width: `${this.iconWidthState}px` },
+			},
+			i(
+				'svg',
+				{
+					key: '4dcd4dbe69326b66c2d9ea7ae01b6b2668962666',
+					class: 'svg-icon',
+					style: { fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` },
+					role: 'img',
+					xmlns: 'http://www.w3.org/2000/svg',
+					viewBox: '0 0 24 24',
+					id: 'clock',
+				},
+				i('path', {
+					key: '57a93938a43dc71a5418c277693a4341775f7035',
+					d: 'M12 2a10 10 0 0 0-7.071 2.929 10 10 0 0 0 0 14.142A10 10 0 0 0 12 22a10 10 0 0 0 10-10 10 10 0 0 0-2.929-7.071A10 10 0 0 0 12 2zm4.2 14.2L11 13V7h1.5v5.2l4.5 2.7-.8 1.3z',
+				}),
+			),
+		);
+	}
+	static get watchers() {
+		return { iconWidth: ['validateWidth'], colour: ['validateColour'] };
+	}
+};
+r.style = l;
+export { r as ontario_icon_clock };
+//# sourceMappingURL=p-79cf7e05.entry.js.map

package/www/build/p-79cf7e05.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ontarioIconCss","OntarioIconClock","iconWidth","iconWidthState","validateWidth","isNaN","this","message","ConsoleMessageClass","addDesignSystemTag","addMonospaceText","addRegularText","printMessage","colour","iconColourState","iconCustomColourState","validateColour","isValid","validateValueAgainstArray","IconColours","validateColor","warnDefaultColour","componentWillLoad","render","h","key","class","style","width","fill","stroke","role","xmlns","viewBox","id","d"],"sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-clock&encapsulation=shadow","src/components/ontario-icon/ontario-icon-clock.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-clock',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconClock implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-clock> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-clock> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"clock\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M12 2a10 10 0 0 0-7.071 2.929 10 10 0 0 0 0 14.142A10 10 0 0 0 12 22a10 10 0 0 0 10-10 10 10 0 0 0-2.929-7.071A10 10 0 0 0 12 2zm4.2 14.2L11 13V7h1.5v5.2l4.5 2.7-.8 1.3z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"mappings":"iIAAA,MAAMA,EAAiB,0Z,MCaVC,EAAgB,M,yBAKpBC,UAAsB,GAMrBC,eAOT,aAAAC,GACC,GAAIC,MAAMC,KAAKJ,aAAgBG,MAAMC,KAAKJ,YAAcI,KAAKJ,WAAa,EAAI,CAC7E,MAAMK,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,gBACjBC,eAAe,MACfD,iBAAiB,0BACjBC,eACA,GACCN,MAAMC,KAAKJ,WAAa,iCAAmC,0FAG5DQ,iBAAiB,UACjBC,eAAe,gBACfC,eACFN,KAAKH,eAAiB,E,KAChB,CACNG,KAAKH,eAAiBG,KAAKJ,S,EAOrBW,OAAqB,QAMpBC,gBAMAC,sBAQT,cAAAC,GACC,MAAMC,EAAUC,EAA0BZ,KAAKO,OAAQM,GACvD,GAAIF,EAAS,CACZX,KAAKQ,gBAAkBR,KAAKO,M,KACtB,CACN,GAAIO,EAAcd,KAAKO,QAAS,CAC/BP,KAAKS,sBAAwBT,KAAKO,M,KAC5B,CACNP,KAAKQ,gBAAkBR,KAAKe,mB,GASvB,iBAAAA,GACP,MAAMd,EAAU,IAAIC,EACpBD,EACEE,qBACAC,iBAAiB,YACjBC,eAAe,MACfD,iBAAiB,0BACjBC,eAAe,sCACfD,iBAAiB,gCACjBC,eAAe,qCACfD,iBAAiB,WACjBC,eAAe,eACfC,eACF,MAAO,O,CAMR,iBAAAU,GACChB,KAAKU,iBACLV,KAAKF,e,CAMN,MAAAmB,GACC,OACCC,EACC,OAAAC,IAAA,2CAAAC,MAAO,8BAA8BpB,KAAKQ,uCAAuCR,KAAKH,iBACtFwB,MAAO,CAAEC,MAAO,GAAGtB,KAAKH,qBAExBqB,EAAA,OAAAC,IAAA,2CACCC,MAAM,WACNC,MAAO,CAAEE,KAAM,GAAGvB,KAAKS,wBAAyBe,OAAQ,GAAGxB,KAAKS,yBAChEgB,KAAK,MACLC,MAAM,6BACNC,QAAQ,YACRC,GAAG,SAEHV,EAAA,QAAAC,IAAA,2CAAMU,EAAE,+K","ignoreList":[]}