npm - @ongov/ontario-design-system-component-library - Versions diffs - 6.0.0-alpha.3 → 6.0.0-alpha.4 - Mend

@ongov/ontario-design-system-component-library 6.0.0-alpha.3 → 6.0.0-alpha.4

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 (1873) hide show

package/dist/collection/components/ontario-header/service-ontario-header.css CHANGED Viewed

@@ -26,7 +26,8 @@
 /* callout backgrounds */
 /* icon colours */
 /* service ontario header colours */
-/*** 1 - Breakpoint sizes for media queries ***/ /* -------------------------------
+/*** 1 - Breakpoint sizes for media queries ***/
+/* -------------------------------
     Global font variables
 --------------------------------- */
 /* Rem calc function */
@@ -1584,56 +1585,6 @@
 		float: left;
 	}
 }
-/*
-*  Text Inputs
-*/
-.ontario-input {
-	border: 2px solid #1a1a1a;
-	border-radius: 4px;
-	box-sizing: border-box;
-	color: #1a1a1a;
-	display: block;
-	font-size: 1rem;
-	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-	line-height: 1.5;
-	margin: 0 0 2.5rem;
-	max-width: 48rem;
-	width: 100%;
-	padding: 0.625rem 1rem;
-	transition: box-shadow 0.1s ease-in-out;
-}
-.ontario-input--2-char-width {
-	max-width: 8ex;
-}
-.ontario-input--3-char-width {
-	max-width: 10ex;
-}
-.ontario-input--4-char-width {
-	max-width: 12ex;
-}
-.ontario-input--5-char-width {
-	max-width: 14ex;
-}
-.ontario-input--7-char-width {
-	max-width: 17ex;
-}
-.ontario-input--10-char-width {
-	max-width: 23ex;
-}
-.ontario-input--20-char-width {
-	max-width: 41ex;
-}
-.ontario-form-group:last-of-type {
-	margin-bottom: 2.5rem;
-}
 /*
 * Visibility
 *
@@ -1749,10 +1700,53 @@
 		display: block !important;
 	}
 }
+.ontario-input {
+	border: 2px solid rgb(25.5, 25.5, 25.5);
+	border-radius: 4px;
+	box-sizing: border-box;
+	color: rgb(25.5, 25.5, 25.5);
+	display: block;
+	font-size: 1rem;
+	font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+	line-height: 1.5;
+	margin: 0;
+	max-width: 48rem;
+	width: 100%;
+	padding: 0.625rem 1rem;
+	transition: box-shadow 0.1s ease-in-out;
+}
+.ontario-input--2-char-width {
+	max-width: 8ex;
+}
+.ontario-input--3-char-width {
+	max-width: 10ex;
+}
+.ontario-input--4-char-width {
+	max-width: 12ex;
+}
+.ontario-input--5-char-width {
+	max-width: 14ex;
+}
+.ontario-input--7-char-width {
+	max-width: 17ex;
+}
+.ontario-input--10-char-width {
+	max-width: 23ex;
+}
+.ontario-input--20-char-width {
+	max-width: 41ex;
+}
 .ontario-application-header {
 	display: flex;
 	align-items: center;
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 	color: #ffffff;
 	height: 3.125rem !important;
 	position: relative;
@@ -1773,7 +1767,7 @@
 }
 .ontario-header-button.ontario-application-navigation--closed:active {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 }
 .ontario-header-button--with-outline {
@@ -1784,7 +1778,7 @@
 .ontario-application-subheader .ontario-header-button,
 .ontario-application-navigation .ontario-header-button {
-	background-color: #4d4d4d;
+	background-color: rgb(76.5, 76.5, 76.5);
 }
 .ontario-header-button--closed:focus {
@@ -1829,7 +1823,7 @@
 /* Ontario application subheader styles */
 .ontario-application-subheader {
 	padding: 1.25rem 0;
-	background-color: #404040;
+	background-color: rgb(63.75, 63.75, 63.75);
 	overflow: visible;
 	position: relative;
 	z-index: 5;
@@ -1859,7 +1853,7 @@
 .ontario-application-subheader .ontario-header-button,
 .ontario-application-navigation .ontario-header-button {
-	background-color: #4d4d4d;
+	background-color: rgb(76.5, 76.5, 76.5);
 }
 .ontario-application-subheader .ontario-header-button:hover,
 .ontario-application-navigation .ontario-header-button:hover {
@@ -1867,11 +1861,11 @@
 }
 .ontario-application-subheader .ontario-header-button:active,
 .ontario-application-navigation .ontario-header-button:active {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 }
 .ontario-header-button--without-outline:hover {
-	background-color: #4d4d4d;
+	background-color: rgb(76.5, 76.5, 76.5);
 }
 .ontario-header-button--without-outline:focus {
 	box-shadow: 0 0 0 4px #009adb;
@@ -1902,13 +1896,13 @@
 .ontario-application-subheader .ontario-header-button {
 	visibility: visible;
-	background-color: #4d4d4d;
+	background-color: rgb(76.5, 76.5, 76.5);
 }
 .ontario-application-subheader .ontario-header-button:hover {
 	background-color: #666666;
 }
 .ontario-application-subheader .ontario-header-button:active {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 }
 .ontario-header__menu-toggler span {
@@ -1972,7 +1966,7 @@
 	color: #ffffff;
 }
 .ontario-application-subheader__menu-container a:active {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 }
 .ontario-application-subheader__menu-container a:focus {
 	box-shadow: 0 0 0 4px #009adb;
@@ -2050,7 +2044,7 @@
 }
 .ontario-application-navigation a {
-	color: #1a1a1a;
+	color: rgb(25.5, 25.5, 25.5);
 	display: block;
 	font-size: 1.125rem;
 	font-weight: 600;
@@ -2071,8 +2065,8 @@
 	box-shadow: 0 0 0 4px #009adb inset;
 }
 .ontario-application-navigation a.ontario-link--active {
-	border-left: 6px solid #1a1a1a;
-	background-color: #f2f2f2;
+	border-left: 6px solid rgb(25.5, 25.5, 25.5);
+	background-color: rgb(242.25, 242.25, 242.25);
 }
 .ontario-navigation--open {
@@ -2124,16 +2118,16 @@
 	background-color: #666666;
 }
 .ontario-header-button.ontario-navigation--open:active {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 }
 .ontario-header-button.ontario-navigation--closed:active {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 }
 /* Header buttons */
 .ontario-header-button {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 	border: none;
 	border-radius: 4px;
 	box-sizing: border-box;
@@ -2158,12 +2152,12 @@
 .ontario-header-button--with-outline,
 .ontario-header-button--without-outline {
-	background-color: #1a1a1a;
+	background-color: rgb(25.5, 25.5, 25.5);
 	color: #ffffff;
 }
 .ontario-header-button--with-outline:hover,
 .ontario-header-button--without-outline:hover {
-	background-color: #4d4d4d;
+	background-color: rgb(76.5, 76.5, 76.5);
 }
 .ontario-header-button--with-outline:active,
 .ontario-header-button--without-outline:active {
@@ -2171,7 +2165,7 @@
 }
 .ontario-header-button--with-outline:focus,
 .ontario-header-button--without-outline:focus {
-	background-color: #4d4d4d;
+	background-color: rgb(76.5, 76.5, 76.5);
 }
 .ontario-header-button--with-outline {
@@ -2184,7 +2178,7 @@
 	color: #ffffff;
 }
 .ontario-header-button--with-outline:focus {
-	background-color: #4d4d4d;
+	background-color: rgb(76.5, 76.5, 76.5);
 }
 @media screen and (max-width: 20em) {
 	.ontario-header-button--with-outline {
@@ -2283,7 +2277,7 @@
 }
 .ontario-application-navigation a {
-	color: #1a1a1a;
+	color: rgb(25.5, 25.5, 25.5);
 	display: block;
 	font-size: 1.125rem;
 	font-weight: 600;
@@ -2304,8 +2298,8 @@
 	box-shadow: 0 0 0 4px #009adb inset;
 }
 .ontario-application-navigation a.ontario-link--active {
-	border-left: 6px solid #1a1a1a;
-	background-color: #f2f2f2;
+	border-left: 6px solid rgb(25.5, 25.5, 25.5);
+	background-color: rgb(242.25, 242.25, 242.25);
 }
 /* Ontario application header overlay styles */
@@ -2477,7 +2471,7 @@ a .ontario-service-subheader__heading-container:focus {
 	position: fixed;
 	top: 0;
 	left: 0;
-	background: rgba(26, 26, 26, 0.6);
+	background: rgba(25.5, 25.5, 25.5, 0.6);
 	width: 100%;
 	height: 100%;
 	z-index: 2;

package/dist/collection/components/ontario-hint-expander/ontario-hint-expander.css CHANGED Viewed

@@ -26,7 +26,8 @@
 /* callout backgrounds */
 /* icon colours */
 /* service ontario header colours */
-/*** 1 - Breakpoint sizes for media queries ***/ /* -------------------------------
+/*** 1 - Breakpoint sizes for media queries ***/
+/* -------------------------------
     Global font variables
 --------------------------------- */
 /* -------------------------------
@@ -86,8 +87,8 @@
 .ontario-hint-expander__content {
 	border-left: 4px solid #cccccc;
-	color: #1a1a1a;
-	background-color: #f2f2f2;
+	color: rgb(25.5, 25.5, 25.5);
+	background-color: rgb(242.25, 242.25, 242.25);
 	display: none;
 	padding: 1rem 1rem 1rem calc(1rem + 0.25rem);
 	margin: 0 0 1rem 0.25rem;

package/dist/collection/components/ontario-hint-expander/ontario-hint-expander.js CHANGED Viewed

@@ -141,11 +141,11 @@ export class OntarioHintExpander {
 	render() {
 		return h(
 			'div',
-			{ key: 'fb1201710bebea695ad866de154d2ef9cb9758ee', class: 'ontario-hint-expander__container' },
+			{ key: 'c1b5ef191ecbb485dbd7c880bbbbe1025aa14b37', class: 'ontario-hint-expander__container' },
 			h(
 				'button',
 				{
-					'key': 'b838acc881188931404c8c4f0388e48afa0da6f1',
+					'key': '9a294c7c4f7ba31e3263ce451e165b6df466c035',
 					'class': 'ontario-hint-expander__button',
 					'onClick': this.onClick,
 					'id': `hint-expander-button-${this.getId()}`,
@@ -156,22 +156,30 @@ export class OntarioHintExpander {
 				h(
 					'span',
 					{
-						key: '1fe025941c4a25b654dccd68fc24fefd3f70f9c2',
+						key: '83378a499652ff0066e4935e2666544e8de48834',
 						class: 'ontario-hint-expander__button-icon--close ontario-icon',
 					},
-					h('ontario-icon-chevron-up', { key: '636186e5cb9bae0ef2342be9e702eecbfc370a92', colour: 'inherit' }),
+					h('ontario-icon-chevron-up', {
+						'key': 'e438e561f82d7fceb4abd0e772117bace68faa3c',
+						'colour': 'inherit',
+						'aria-hidden': 'true',
+					}),
 				),
 				h(
 					'span',
-					{ key: 'a9d555db0bf0537fffa3fc87e746514a8a2c7f81', class: 'ontario-hint-expander__button-icon--open' },
-					h('ontario-icon-chevron-down', { key: '77785dde41c493d3b77e306de0d8075ae62ce934', colour: 'inherit' }),
+					{ key: 'fe4a275febd08b305760d3bf0ef04be24e4d54bb', class: 'ontario-hint-expander__button-icon--open' },
+					h('ontario-icon-chevron-down', {
+						'key': '7463ef85ee1938df1c25dd3bae4718528b3b7326',
+						'colour': 'inherit',
+						'aria-hidden': 'true',
+					}),
 				),
 				this.hint,
 			),
 			h(
 				'div',
 				{
-					'key': 'ea08efd47eaa792b435eabcc08c1dc9101b6028a',
+					'key': '383b61ae83347e5c47aac307b821120f541e5254',
 					'class': 'ontario-hint-expander__content',
 					'id': `hint-expander-content-${this.getId()}`,
 					'aria-labelledby': `hint-expander-button-${this.getId()}`,

package/dist/collection/components/ontario-hint-expander/ontario-hint-expander.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ontario-hint-expander.js","sourceRoot":"","sources":["../../../src/components/ontario-hint-expander/ontario-hint-expander.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Prop, Watch, State } from '@stencil/core';\nimport { v4 as uuid } from 'uuid';\n\nimport { HintExpander } from './hint-expander.interface';\nimport { HintContentType } from '../../utils/common/common.interface';\n\nimport { validatePropExists } from '../../utils/validation/validation-functions';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\n\n@Component({\n\ttag: 'ontario-hint-expander',\n\tstyleUrl: 'ontario-hint-expander.scss',\n\tshadow: true,\n})\nexport class OntarioHintExpander implements HintExpander {\n\t@Element() host: HTMLElement;\n\n\t/*\n\t The content type of the hint.\n\t * If no prop is passed, it will default to a string.\n\t * If the hint requires multiple lines or HTML, the `hintContentType` prop should be set to `html`.\n\t /\n\t@Prop({ mutable: true }) hintContentType?: HintContentType = 'string';\n\n\t/\n\t Text to display as the hint expander question/statement\n\t /\n\t@Prop() hint: string;\n\n\t/\n\t Content to display as the hint, once the expander is toggled open.\n\t * Please note that any content that is passed into this prop will only be displayed as a string.\n\t * If you would like to add HTML content, supply child content to the component.\n\t \n\t @example\n\t * <ontario-hint-expander hint=\"This is the hint\"\n\t * <img src=\"https://www.jquery-az.com/html/images/banana.jpg\" title=\"Title of image\" alt=\"alt text here\"/>\n\t * <p> Here is the content beside the image </p>\n\t * </ontario-hint-expander>\n\t /\n\t@Prop({ mutable: true }) content: string;\n\n\t/\n\t Used to used to establish a relationship between hint text content and elements using aria-describedby. This is optional - if no ID is passed, one will be generated.\n\t /\n\t@Prop({ mutable: true }) elementId?: string;\n\n\t@State() hintState: string;\n\n\t/\n\t Emitted when a keyboard input or mouse event occurs.\n\t /\n\t@Event() toggleExpanderEvent!: EventEmitter<MouseEvent \| KeyboardEvent>;\n\n\t/\n\t Watch for changes to the `hintContentType` prop for validation purposes.\n\t * If none is provided, or the wrong type is provided, it will default to `string`.\n\t /\n\t@Watch('hintContentType')\n\tprivate checkHintContentType() {\n\t\tif (this.hintContentType !== 'string' && this.hintContentType !== 'html') {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' hintContentType ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-hint-text> ')\n\t\t\t\t.addRegularText('was not one of the permitted types. A default type of `string` will be applied.')\n\t\t\t\t.printMessage();\n\n\t\t\treturn (this.hintContentType = 'string');\n\t\t}\n\n\t\treturn this.hintContentType;\n\t}\n\n\t/\n\t * Watch for changes in the `hint` prop for validation purposes.\n\t * If no `hint` prop is provided, the `hint` will be set to the host element textContent (if it exists).\n\t /\n\t@Watch('hint')\n\tprivate updateHintContent() {\n\t\tthis.hintState = this.hint ?? this.host.textContent ?? '';\n\t\tthis.validateHint(this.hintState);\n\t}\n\n\t/\n\t * Watch for changes to the `content` prop for validation purposes.\n\t \n\t Validate the `content` and make sure the `content` has a value.\n\t * Log a warning if user doesn't input a value for the `content` or element content.\n\t /\n\t@Watch('content')\n\tvalidateContent(newValue: string) {\n\t\tif (validatePropExists(newValue)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' content ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-hint-expander> ')\n\t\t\t\t.addRegularText('was not provided')\n\t\t\t\t.printMessage();\n\t\t}\n\t}\n\n\tprivate onClick = (ev: Event) => {\n\t\tconst hintExpander = ev.target as HTMLButtonElement \| null;\n\t\tconst hintExpanderParent = hintExpander?.parentElement;\n\n\t\thintExpanderParent?.classList.toggle('ontario-expander--active');\n\t\tlet content = hintExpanderParent?.querySelector(\"[data-toggle='ontario-expander-content']\");\n\t\tcontent?.classList.toggle('ontario-expander__content--opened');\n\t\tcontent?.classList.contains('ontario-expander__content--opened')\n\t\t\t? content.setAttribute('aria-hidden', 'false')\n\t\t\t: content?.setAttribute('aria-hidden', 'true');\n\t\thintExpanderParent?.classList.contains('ontario-expander--active')\n\t\t\t? hintExpanderParent?.setAttribute('aria-expanded', 'true')\n\t\t\t: hintExpanderParent?.setAttribute('aria-expanded', 'false');\n\n\t\tthis.toggleExpanderEvent.emit(ev as MouseEvent);\n\t};\n\n\t/\n\t * Watch for changes in the `hint` prop for validation purposes.\n\t \n\t Validate the `hint` and make sure the `hint` has a value.\n\t * Log a warning if user doesn't input a value for the `hint`.\n\t /\n\tvalidateHint(newValue: string) {\n\t\tif (validatePropExists(newValue)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' hint ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-hint-expander> ')\n\t\t\t\t.addRegularText('was not provided')\n\t\t\t\t.printMessage();\n\t\t}\n\t}\n\n\t/\n\t Set `hint` using internal component logic\n\t /\n\tcomponentWillLoad() {\n\t\tthis.elementId = this.elementId ?? uuid();\n\t\tthis.updateHintContent();\n\t\tthis.checkHintContentType();\n\t\tthis.validateContent(this.content);\n\t}\n\n\t/\n\t This helper is used to help load translations for any slots + text content passed in by the user.\n\t */\n\tcomponentDidLoad() {\n\t\tconst observer = new MutationObserver((mutations) => {\n\t\t\tmutations.forEach((mutation) => {\n\t\t\t\tif (mutation.type === 'attributes') {\n\t\t\t\t\tthis.updateHintContent();\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\n\t\tconst options = { attributes: true };\n\t\tobserver.observe(this.host, options);\n\t}\n\n\tpublic getId(): string {\n\t\treturn this.elementId ?? '';\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<div class=\"ontario-hint-expander__container\">\n\t\t\t\t<button\n\t\t\t\t\tclass=\"ontario-hint-expander__button\"\n\t\t\t\t\tonClick={this.onClick}\n\t\t\t\t\tid={`hint-expander-button-${this.getId()}`}\n\t\t\t\t\taria-controls={`hint-expander-content-${this.getId()}`}\n\t\t\t\t\taria-expanded=\"false\"\n\t\t\t\t\tdata-toggle=\"ontario-collapse\"\n\t\t\t\t>\n\t\t\t\t\t<span class=\"ontario-hint-expander__button-icon--close ontario-icon\">\n\t\t\t\t\t\t<ontario-icon-chevron-up colour=\"inherit\"></ontario-icon-chevron-up>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"ontario-hint-expander__button-icon--open\">\n\t\t\t\t\t\t<ontario-icon-chevron-down colour=\"inherit\"></ontario-icon-chevron-down>\n\t\t\t\t\t</span>\n\t\t\t\t\t{this.hint}\n\t\t\t\t</button>\n\t\t\t\t<div\n\t\t\t\t\tclass=\"ontario-hint-expander__content\"\n\t\t\t\t\tid={`hint-expander-content-${this.getId()}`}\n\t\t\t\t\taria-labelledby={`hint-expander-button-${this.getId()}`}\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tdata-toggle=\"ontario-expander-content\"\n\t\t\t\t>\n\t\t\t\t\t{this.hintContentType === 'string' && this.content ? (\n\t\t\t\t\t\tthis.content\n\t\t\t\t\t) : this.hintContentType === 'html' && this.content ? (\n\t\t\t\t\t\t<span innerHTML={this.content}></span>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}
1	+ {"version":3,"file":"ontario-hint-expander.js","sourceRoot":"","sources":["../../../src/components/ontario-hint-expander/ontario-hint-expander.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Prop, Watch, State } from '@stencil/core';\nimport { v4 as uuid } from 'uuid';\n\nimport { HintExpander } from './hint-expander.interface';\nimport { HintContentType } from '../../utils/common/common.interface';\n\nimport { validatePropExists } from '../../utils/validation/validation-functions';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\n\n@Component({\n\ttag: 'ontario-hint-expander',\n\tstyleUrl: 'ontario-hint-expander.scss',\n\tshadow: true,\n})\nexport class OntarioHintExpander implements HintExpander {\n\t@Element() host: HTMLElement;\n\n\t/*\n\t The content type of the hint.\n\t * If no prop is passed, it will default to a string.\n\t * If the hint requires multiple lines or HTML, the `hintContentType` prop should be set to `html`.\n\t /\n\t@Prop({ mutable: true }) hintContentType?: HintContentType = 'string';\n\n\t/\n\t Text to display as the hint expander question/statement\n\t /\n\t@Prop() hint: string;\n\n\t/\n\t Content to display as the hint, once the expander is toggled open.\n\t * Please note that any content that is passed into this prop will only be displayed as a string.\n\t * If you would like to add HTML content, supply child content to the component.\n\t \n\t @example\n\t * <ontario-hint-expander hint=\"This is the hint\"\n\t * <img src=\"https://www.jquery-az.com/html/images/banana.jpg\" title=\"Title of image\" alt=\"alt text here\"/>\n\t * <p> Here is the content beside the image </p>\n\t * </ontario-hint-expander>\n\t /\n\t@Prop({ mutable: true }) content: string;\n\n\t/\n\t Used to used to establish a relationship between hint text content and elements using aria-describedby. This is optional - if no ID is passed, one will be generated.\n\t /\n\t@Prop({ mutable: true }) elementId?: string;\n\n\t@State() hintState: string;\n\n\t/\n\t Emitted when a keyboard input or mouse event occurs.\n\t /\n\t@Event() toggleExpanderEvent!: EventEmitter<MouseEvent \| KeyboardEvent>;\n\n\t/\n\t Watch for changes to the `hintContentType` prop for validation purposes.\n\t * If none is provided, or the wrong type is provided, it will default to `string`.\n\t /\n\t@Watch('hintContentType')\n\tprivate checkHintContentType() {\n\t\tif (this.hintContentType !== 'string' && this.hintContentType !== 'html') {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' hintContentType ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-hint-text> ')\n\t\t\t\t.addRegularText('was not one of the permitted types. A default type of `string` will be applied.')\n\t\t\t\t.printMessage();\n\n\t\t\treturn (this.hintContentType = 'string');\n\t\t}\n\n\t\treturn this.hintContentType;\n\t}\n\n\t/\n\t * Watch for changes in the `hint` prop for validation purposes.\n\t * If no `hint` prop is provided, the `hint` will be set to the host element textContent (if it exists).\n\t /\n\t@Watch('hint')\n\tprivate updateHintContent() {\n\t\tthis.hintState = this.hint ?? this.host.textContent ?? '';\n\t\tthis.validateHint(this.hintState);\n\t}\n\n\t/\n\t * Watch for changes to the `content` prop for validation purposes.\n\t \n\t Validate the `content` and make sure the `content` has a value.\n\t * Log a warning if user doesn't input a value for the `content` or element content.\n\t /\n\t@Watch('content')\n\tvalidateContent(newValue: string) {\n\t\tif (validatePropExists(newValue)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' content ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-hint-expander> ')\n\t\t\t\t.addRegularText('was not provided')\n\t\t\t\t.printMessage();\n\t\t}\n\t}\n\n\tprivate onClick = (ev: Event) => {\n\t\tconst hintExpander = ev.target as HTMLButtonElement \| null;\n\t\tconst hintExpanderParent = hintExpander?.parentElement;\n\n\t\thintExpanderParent?.classList.toggle('ontario-expander--active');\n\t\tlet content = hintExpanderParent?.querySelector(\"[data-toggle='ontario-expander-content']\");\n\t\tcontent?.classList.toggle('ontario-expander__content--opened');\n\t\tcontent?.classList.contains('ontario-expander__content--opened')\n\t\t\t? content.setAttribute('aria-hidden', 'false')\n\t\t\t: content?.setAttribute('aria-hidden', 'true');\n\t\thintExpanderParent?.classList.contains('ontario-expander--active')\n\t\t\t? hintExpanderParent?.setAttribute('aria-expanded', 'true')\n\t\t\t: hintExpanderParent?.setAttribute('aria-expanded', 'false');\n\n\t\tthis.toggleExpanderEvent.emit(ev as MouseEvent);\n\t};\n\n\t/\n\t * Watch for changes in the `hint` prop for validation purposes.\n\t \n\t Validate the `hint` and make sure the `hint` has a value.\n\t * Log a warning if user doesn't input a value for the `hint`.\n\t /\n\tvalidateHint(newValue: string) {\n\t\tif (validatePropExists(newValue)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' hint ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-hint-expander> ')\n\t\t\t\t.addRegularText('was not provided')\n\t\t\t\t.printMessage();\n\t\t}\n\t}\n\n\t/\n\t Set `hint` using internal component logic\n\t /\n\tcomponentWillLoad() {\n\t\tthis.elementId = this.elementId ?? uuid();\n\t\tthis.updateHintContent();\n\t\tthis.checkHintContentType();\n\t\tthis.validateContent(this.content);\n\t}\n\n\t/\n\t This helper is used to help load translations for any slots + text content passed in by the user.\n\t */\n\tcomponentDidLoad() {\n\t\tconst observer = new MutationObserver((mutations) => {\n\t\t\tmutations.forEach((mutation) => {\n\t\t\t\tif (mutation.type === 'attributes') {\n\t\t\t\t\tthis.updateHintContent();\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\n\t\tconst options = { attributes: true };\n\t\tobserver.observe(this.host, options);\n\t}\n\n\tpublic getId(): string {\n\t\treturn this.elementId ?? '';\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<div class=\"ontario-hint-expander__container\">\n\t\t\t\t<button\n\t\t\t\t\tclass=\"ontario-hint-expander__button\"\n\t\t\t\t\tonClick={this.onClick}\n\t\t\t\t\tid={`hint-expander-button-${this.getId()}`}\n\t\t\t\t\taria-controls={`hint-expander-content-${this.getId()}`}\n\t\t\t\t\taria-expanded=\"false\"\n\t\t\t\t\tdata-toggle=\"ontario-collapse\"\n\t\t\t\t>\n\t\t\t\t\t<span class=\"ontario-hint-expander__button-icon--close ontario-icon\">\n\t\t\t\t\t\t<ontario-icon-chevron-up colour=\"inherit\" aria-hidden=\"true\"></ontario-icon-chevron-up>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span class=\"ontario-hint-expander__button-icon--open\">\n\t\t\t\t\t\t<ontario-icon-chevron-down colour=\"inherit\" aria-hidden=\"true\"></ontario-icon-chevron-down>\n\t\t\t\t\t</span>\n\t\t\t\t\t{this.hint}\n\t\t\t\t</button>\n\t\t\t\t<div\n\t\t\t\t\tclass=\"ontario-hint-expander__content\"\n\t\t\t\t\tid={`hint-expander-content-${this.getId()}`}\n\t\t\t\t\taria-labelledby={`hint-expander-button-${this.getId()}`}\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tdata-toggle=\"ontario-expander-content\"\n\t\t\t\t>\n\t\t\t\t\t{this.hintContentType === 'string' && this.content ? (\n\t\t\t\t\t\tthis.content\n\t\t\t\t\t) : this.hintContentType === 'html' && this.content ? (\n\t\t\t\t\t\t<span innerHTML={this.content}></span>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"]}

package/dist/collection/components/ontario-hint-text/ontario-hint-text.css CHANGED Viewed

@@ -27,7 +27,7 @@
 /* icon colours */
 /* service ontario header colours */
 .ontario-hint {
-	color: #4d4d4d;
+	color: rgb(76.5, 76.5, 76.5);
 	display: inline-block;
 	margin: 0 0 1rem 0;
 	width: 100%;

package/dist/collection/components/ontario-icon/assets/ontario-icon-sort-alphabetical-ascending.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19 17H22L18 21L14 17H17V3H19M11 13V15L7.67 19H11V21H5V19L8.33 15H5V13M9 3H7C5.9 3 5 3.9 5 5V11H7V9H9V11H11V5C11 3.9 10.11 3 9 3ZM9 7H7V5H9V7Z"/>
+</svg>

package/dist/collection/components/ontario-icon/assets/ontario-icon-sort-alphabetical-descending.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19 7H22L18 3L14 7H17V21H19M11 13V15L7.67 19H11V21H5V19L8.33 15H5V13M9 3H7C5.9 3 5 3.9 5 5V11H7V9H9V11H11V5C11 3.9 10.11 3 9 3ZM9 7H7V5H9V7Z"/>
+</svg>

package/dist/collection/components/ontario-icon/assets/ontario-icon-sort-ascending.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19 17H22L18 21L14 17H17V3H19M2 17H12V19H2M6 5V7H2V5M2 11H9V13H2V11Z"/>
+</svg>

package/dist/collection/components/ontario-icon/assets/ontario-icon-sort-descending.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M19 7H22L18 3L14 7H17V21H19M2 17H12V19H2M6 5V7H2V5M2 11H9V13H2V11Z"/>
+</svg>

package/dist/collection/components/ontario-icon/assets/ontario-icon-sort-variant.svg ADDED Viewed

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3 13H15V11H3M3 6V8H21V6M3 18H9V16H3V18Z"/>
+</svg>

package/dist/collection/components/ontario-icon/assets/ontario-icon-sort.svg CHANGED Viewed

@@ -1 +1,3 @@
-<svg class="svg-icon" role="img" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24"><path d="M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z"/></svg>
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 21L14 17H17V7H14L18 3L22 7H19V17H22M2 19V17H12V19M2 13V11H9V13M2 7V5H6V7H2Z"/>
+</svg>

package/dist/collection/components/ontario-icon/ontario-icon-accessibility.js CHANGED Viewed

@@ -89,14 +89,14 @@ export class OntarioIconAccessibility {
 		return h(
 			'div',
 			{
-				key: 'b567cc8fc55209a62a22dc3a33e9b0fabd2996da',
+				key: '95385081b476aba9de5e08f34d338fece5886f93',
 				class: `ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`,
 				style: { width: `${this.iconWidthState}px` },
 			},
 			h(
 				'svg',
 				{
-					key: 'ccbf1e874c54606b98fb7f68c46702b8ac0d3b98',
+					key: '2c1cbf16fdfd14dc5a5e242ce8c70430fd582691',
 					class: 'svg-icon',
 					style: { fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` },
 					role: 'img',
@@ -105,7 +105,7 @@ export class OntarioIconAccessibility {
 					id: 'accessibility',
 				},
 				h('path', {
-					key: 'd4fbfc2d2bbff88b3c436538ea648bebd2987f15',
+					key: '53309bedbf9f6c507cceff0e0d347435325f441f',
 					d: 'M18.4 11.2l-4.1.2 2.3-2.6c.2-.3.3-.8.2-1.3-.1-.3-.2-.6-.5-.8l-5.4-3.2c-.4-.3-1-.2-1.4.1L6.8 6.1c-.5.5-.6 1.2-.1 1.7.4.5 1.2.5 1.7.1l2-1.8 1.9 1.1-4.2 4.3c-.1.1-.1.2-.2.2-.5.2-1 .4-1.4.7L8 13.9c.5-.2 1-.4 1.5-.4 1.9 0 3.5 1.6 3.5 3.5 0 .6-.1 1.1-.4 1.5l1.5 1.5a5.29 5.29 0 0 0 .9-3c0-1.2-.4-2.4-1.1-3.3l3.3-.3-.2 4.8c-.1.7.4 1.2 1.1 1.3h.1c.6 0 1.1-.5 1.2-1.1l.2-5.9c0-.3-.1-.7-.3-.9-.3-.3-.6-.4-.9-.4zM18 5.5a2 2 0 0 0 2-2 2 2 0 0 0-2-2 2 2 0 0 0-2 2 2 2 0 0 0 2 2zm-5.5 16.1a5.29 5.29 0 0 1-3 .9C6.5 22.5 4 20 4 17a5.29 5.29 0 0 1 .9-3l1.5 1.5c-.2.5-.4 1-.4 1.5 0 1.9 1.6 3.5 3.5 3.5.6 0 1.1-.1 1.5-.4l1.5 1.5z',
 				}),
 			),

package/dist/collection/components/ontario-icon/ontario-icon-account.js CHANGED Viewed

@@ -89,14 +89,14 @@ export class OntarioIconAccount {
 		return h(
 			'div',
 			{
-				key: '322a1bd85e3d6228f1f78b13996c48a416879317',
+				key: '41e8deab5aefc8af1456dd2582228cadfc6fc1ad',
 				class: `ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`,
 				style: { width: `${this.iconWidthState}px` },
 			},
 			h(
 				'svg',
 				{
-					key: '8a151f6b082b6ed6242d95806c05a3f545fddc98',
+					key: '51d8c69ab4443141950749e53ace8d05e658fd9f',
 					class: 'svg-icon',
 					style: { fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` },
 					role: 'img',
@@ -105,7 +105,7 @@ export class OntarioIconAccount {
 					id: 'account',
 				},
 				h('path', {
-					key: '1071a45dca814a19d217f3528f040453a6fa1f89',
+					key: '3a5a242fac1244fb9990ace13212f9af6576e27a',
 					d: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 3c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.2a7.2 7.2 0 0 1-6-3.22c.03-2 4-3.08 6-3.08 2 0 5.97 1.1 6 3.08a7.2 7.2 0 0 1-6 3.22z',
 				}),
 			),

package/dist/collection/components/ontario-icon/ontario-icon-add-alt.js CHANGED Viewed

@@ -89,14 +89,14 @@ export class OntarioIconAddAlt {
 		return h(
 			'div',
 			{
-				key: 'd93fe05fca936008e4711d1f1eeefc2cddd233fd',
+				key: '8cfb668c0e09fe0e92c6f4fd98beb52dae005e6d',
 				class: `ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`,
 				style: { width: `${this.iconWidthState}px` },
 			},
 			h(
 				'svg',
 				{
-					key: 'be9af29e5982afb0750916b1c9967e60c05b4123',
+					key: '32f6b962633ad92c8a8a0c47626cdce1812cb169',
 					class: 'svg-icon',
 					style: { fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` },
 					role: 'img',
@@ -106,7 +106,7 @@ export class OntarioIconAddAlt {
 					id: 'add-alt',
 				},
 				h('path', {
-					key: '1d5551f05c708ec36a5a4552e169db317bad2c7a',
+					key: 'b84cac8de2495e358e3805c4f3b875aa8da2fb56',
 					d: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z',
 				}),
 			),

package/dist/collection/components/ontario-icon/ontario-icon-add.js CHANGED Viewed

@@ -89,14 +89,14 @@ export class OntarioIconAdd {
 		return h(
 			'div',
 			{
-				key: '9c5805e302bb405cecbaaacf8d0009b1e394a260',
+				key: '1d178f328fbee55d06d781839d781067ef49eb4d',
 				class: `ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`,
 				style: { width: `${this.iconWidthState}px` },
 			},
 			h(
 				'svg',
 				{
-					key: '544d47882c6eba4daa417c098f1e870b63e2c18d',
+					key: '2ce4b46caf8511911aec857e2acfc8e34d82494d',
 					class: 'svg-icon',
 					style: { fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` },
 					role: 'img',
@@ -106,7 +106,7 @@ export class OntarioIconAdd {
 					id: 'add',
 				},
 				h('path', {
-					key: '5865615b86007c70d51a73f41a32e26317444ce5',
+					key: '2c1b905f2903472964a0a32fb593acbfa31bc5a3',
 					d: 'M13 7h-2v4H7v2h4v4h2v-4h4v-2h-4V7zm-1-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.4 0-8-3.6-8-8s3.6-8 8-8 8 3.6 8 8-3.6 8-8 8z',
 				}),
 			),

package/dist/collection/components/ontario-icon/ontario-icon-alert-error.js CHANGED Viewed

@@ -62,14 +62,14 @@ export class OntarioIconAlertError {
 		return h(
 			'div',
 			{
-				key: '0ab7ca01e1530b78124c21a8bd5d78d0e6a89ee0',
+				key: '7dba3876f7bd739ad221452caab0d267f976fea2',
 				class: `ontario-icon ontario-icon--width-${this.iconWidthState}`,
 				style: { width: `${this.iconWidthState}px` },
 			},
 			h(
 				'svg',
 				{
-					key: 'aa78b34ca6cbdf38f7bb9635c9cbf0a9e7e91ec4',
+					key: 'f9adf80d43dc4c13ccb312d66a08430e596fc244',
 					class: 'svg-icon',
 					role: 'img',
 					xmlns: 'http://www.w3.org/2000/svg',
@@ -78,12 +78,12 @@ export class OntarioIconAlertError {
 					id: 'alert-error',
 				},
 				h('path', {
-					key: '728f4d84873cd6670b91b6304b250069180ab0c5',
+					key: '3ccfda378bc3955de567027d207fa501eb4d0e24',
 					d: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z',
 					fill: '#cd0000',
 				}),
 				h('path', {
-					key: 'ed5b79932b22bba32e04bf41d2bfe6517020fc5c',
+					key: '4c1202fb45d7f4fcfebc5a6256b4bf5be8978a0b',
 					d: 'M11 17h2v-2h-2v2zm0-4h2V7h-2v6z',
 					fill: '#fff',
 				}),

package/dist/collection/components/ontario-icon/ontario-icon-alert-information.js CHANGED Viewed

@@ -62,14 +62,14 @@ export class OntarioIconAlertInformation {
 		return h(
 			'div',
 			{
-				key: 'c45ab789ae339fe5347c4893ccb392fa3e90fe81',
+				key: 'b252b04252da12351597b4fbdc30b3fa0a9e350c',
 				class: `ontario-icon ontario-icon--width-${this.iconWidthState}`,
 				style: { width: `${this.iconWidthState}px` },
 			},
 			h(
 				'svg',
 				{
-					key: '5424a2027c875d9a9274e3d356b22eaa9f020925',
+					key: '87dc578e1bfdd0da9a986635ed326bf9af9baabc',
 					class: 'svg-icon',
 					role: 'img',
 					xmlns: 'http://www.w3.org/2000/svg',
@@ -78,12 +78,12 @@ export class OntarioIconAlertInformation {
 					id: 'alert-information',
 				},
 				h('path', {
-					key: 'c6679137887a1046193167cd5543bf73585543fa',
+					key: '3f391abbed6875da1e4c3cc2cd005997062c485f',
 					d: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z',
 					fill: '#1080a6',
 				}),
 				h('path', {
-					key: '0fa8279e85a1ec1482056456d2ea389246ebad61',
+					key: 'a6b344c0b7df27b0bd66ee24fde7b7772f83c8e5',
 					d: 'M11 17h2v-6h-2v6zm0-8h2V7h-2v2z',
 					fill: '#fff',
 				}),