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

package/dist/components/ontario-loading-indicator.js.map

@@ -1 +1 @@
-{"file":"ontario-loading-indicator.js","mappings":";;;;;AAAA,MAAM,0BAA0B,GAAG,i7CAAi7C,CAAC;AACr9C,sCAAe,0BAA0B;;MCY5BA,yBAAuB;;;;;;;;;IAI3B,IAAI,GAAsB,OAAO,CAAC;;;;IAKlC,SAAS,GAAY,KAAK,CAAC;;;;;;;IAQ3B,OAAO,CAAU;;;;;;IAOjB,iBAAiB,GAAa,IAAI,CAAC;;;;;IAMlB,QAAQ,CAAY;IAEpC,YAAY,GAAQ,YAAY,CAAC;;;;IAKzB,cAAc,CAAU;IACxB,SAAS,CAAoB;;;;IAM9C,oBAAoB,CAAC,KAA4B;QAChD,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YACnB,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;SACxC;KACD;IAGD,2BAA2B,CAAC,KAA4B;QACvD,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;KACxC;;;;IAMD,gBAAgB,CAAC,YAAqB;QACrC,IAAI,CAAC,cAAc,GAAG,YAAY,CAAC;KACnC;;;;;;;IASD,YAAY;QACX,MAAM,OAAO,GAAG,yBAAyB,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC;QACzE,IAAI,OAAO,EAAE;YACZ,QAAQ,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,EAAE;SACpC;aAAM;YACN,IAAI,CAAC,eAAe,EAAE,CAAC;YACvB,QAAQ,IAAI,CAAC,SAAS,GAAG,OAAO,EAAE;SAClC;KACD;;;;;IAMO,eAAe;QACtB,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE,CAAC;QAC1C,OAAO;aACL,kBAAkB,EAAE;aACpB,gBAAgB,CAAC,QAAQ,CAAC;aAC1B,cAAc,CAAC,IAAI,CAAC;aACpB,gBAAgB,CAAC,+BAA+B,CAAC;aACjD,cAAc,CAAC,kCAAkC,CAAC;aAClD,gBAAgB,CAAC,kBAAkB,CAAC;aACpC,cAAc,CAAC,iCAAiC,CAAC;aACjD,gBAAgB,CAAC,SAAS,CAAC;aAC3B,cAAc,CAAC,aAAa,CAAC;aAC7B,YAAY,EAAE,CAAC;KACjB;IAED,iBAAiB;QAChB,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAChD,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC;KACrC;IAED,MAAM;QACL,OAAO,IAAI,CAAC,SAAS,KAAK,OAAO,IAChC,WACC,KAAK,EACJ,IAAI,CAAC,iBAAiB;kBACnB,oCAAoC;kBACpC,sDAAsD,iBAE7C,IAAI,CAAC,cAAc,GAAG,OAAO,GAAG,MAAM,EACnD,IAAI,EAAC,OAAO,eACF,WAAW,IAErB,WAAK,KAAK,EAAC,2BAA2B,IACrC,WAAK,KAAK,EAAC,oCAAoC,EAAC,OAAO,EAAC,aAAa,EAAC,KAAK,EAAC,4BAA4B,IACvG,cAAQ,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,kBAAc,GAAG,GAAG,CACzD,EACN,aAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAK,CACjE,CACD,KAEN,uEAA8D,CAC9D,CAAC;KACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["OntarioLoadingIndicator"],"sources":["src/components/ontario-loading-indicator/ontario-loading-indicator.scss?tag=ontario-loading-indicator&encapsulation=shadow","src/components/ontario-loading-indicator/ontario-loading-indicator.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/spacing.variables' as spacing;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/fonts.variables' as fonts;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/font-weights.variables' as fontWeights;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/line-heights.variables' as lineHeights;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\n\n$offset: 1, 200;\n$duration: 1.5s;\n$spinner-size: 3rem;\n$dasharray: 89, 200;\n$loading-indicator-z-index: 9999;\n\n.ontario-loading-indicator__overlay,\n.ontario-loading-indicator__overlay--within-container {\n\tposition: fixed;\n\twidth: 100%;\n\tleft: 0;\n\tright: 0;\n\ttop: 0;\n\tbottom: 0;\n\tbackground-color: rgba(colours.$ontario-colour-white, 0.7);\n\tz-index: $loading-indicator-z-index;\n\n\t&[aria-hidden='false'] {\n\t\tdisplay: block;\n\t}\n\n\t&[aria-hidden='true'] {\n\t\tdisplay: none;\n\t}\n}\n\n.ontario-loading-indicator__overlay--within-container {\n\tposition: absolute;\n}\n\n.ontario-loading-indicator {\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\tposition: absolute;\n\ttop: 50%;\n\ttransform: translateY(-50%);\n\twidth: 100%;\n\theight: 100%;\n\n\tp {\n\t\tcolor: colours.$ontario-greyscale-70;\n\t\tfont-family: fonts.$ontario-font-raleway;\n\t\tfont-size: globalFunctions.px-to-rem(16);\n\t\tline-height: lineHeights.$ontario-line-height-7;\n\t\tfont-weight: fontWeights.$ontario-font-weights-bold;\n\t\tword-spacing: 0.025rem;\n\t\tmargin: spacing.$spacing-3 spacing.$spacing-0 spacing.$spacing-0;\n\t}\n}\n\n.ontario-loading-indicator__spinner {\n\tanimation: rotator $duration linear infinite;\n\twidth: $spinner-size;\n\theight: $spinner-size;\n\toverflow: visible;\n\n\tcircle {\n\t\tstroke-dasharray: $offset;\n\t\tstroke-dashoffset: 0;\n\t\tstroke-linecap: round;\n\t\tstroke: colours.$ontario-greyscale-70;\n\t\tanimation: dash $duration ease-in-out infinite;\n\t}\n}\n\n@keyframes rotator {\n\t100% {\n\t\ttransform: rotate(360deg);\n\t}\n}\n\n@keyframes dash {\n\t0% {\n\t\tstroke-dasharray: $offset;\n\t\tstroke-dashoffset: 0;\n\t}\n\n\t50% {\n\t\tstroke-dasharray: $dasharray;\n\t\tstroke-dashoffset: -35px;\n\t}\n\n\t100% {\n\t\tstroke-dasharray: $dasharray;\n\t\tstroke-dashoffset: -124px;\n\t}\n}\n","import { Component, h, Prop, Listen, State, Watch } from '@stencil/core';\nimport { Language } from '../../utils/common/language-types';\nimport { validateLanguage } from '../../utils/validation/validation-functions';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\n\nimport translations from '../../translations/global.i18n.json';\n\n@Component({\n\ttag: 'ontario-loading-indicator',\n\tstyleUrl: 'ontario-loading-indicator.scss',\n\tshadow: true,\n})\nexport class OntarioLoadingIndicator {\n\t/**\n\t * The type of loading indicator to render.\n\t */\n\t@Prop() type: 'small' | 'large' = 'large';\n\n\t/**\n\t * A boolean value to determine whether or not the loading indicator is loading (i.e: is visible) or not.\n\t */\n\t@Prop() isLoading: boolean = false;\n\n\t/**\n\t * The message that tells the user what is happening or why the user is waiting.\n\t * If no message prop is passed, it will default to \"Loading\". Translations for this default message are included.\n\t *\n\t * This is optional.\n\t */\n\t@Prop() message?: string;\n\n\t/**\n\t * A boolean value to determine whether the loading indicator overlay covers the full page or not. By default, this is set to `true`.\n\t *\n\t * If set to `false`, the loading indicator overlay will be positioned absolutely relative to its container. Note that this will only work if the containing element has a style rule specifying it to be positioned relatively.\n\t */\n\t@Prop() fullScreenOverlay?: boolean = true;\n\n\t/**\n\t * The language of the component.\n\t * This is used for translations, and is by default set through event listeners checking for a language property from the header. If no language is passed, it will default to English.\n\t */\n\t@Prop({ mutable: true }) language?: Language;\n\n\t@State() translations: any = translations;\n\n\t/**\n\t * Mutable variables, for internal use only.\n\t */\n\t@State() private isLoadingState: boolean;\n\t@State() private typeState: 'small' | 'large';\n\n\t/**\n\t * This listens for the `setAppLanguage` event sent from the test language toggler when it is is connected to the DOM. It is used for the initial language when the input component loads.\n\t */\n\t@Listen('setAppLanguage', { target: 'window' })\n\thandleSetAppLanguage(event: CustomEvent<Language>) {\n\t\tif (!this.language) {\n\t\t\tthis.language = validateLanguage(event);\n\t\t}\n\t}\n\n\t@Listen('headerLanguageToggled', { target: 'window' })\n\thandleHeaderLanguageToggled(event: CustomEvent<Language>) {\n\t\tthis.language = validateLanguage(event);\n\t}\n\n\t/**\n\t * Watch for changes in the `isLoading` prop.\n\t */\n\t@Watch('isLoading')\n\tisLoadingChanged(newIsLoading: boolean) {\n\t\tthis.isLoadingState = newIsLoading;\n\t}\n\n\t/**\n\t * Watch for changes in the `type` variable for validation purposes.\n\t *\n\t * If the user input doesn't match one of the array values then `type` will be set to its default (`large`).\n\t * If a match is found in one of the array values then `type` will be set to the matching array key value.\n\t */\n\t@Watch('type')\n\tvalidateType() {\n\t\tconst isValid = validateValueAgainstArray(this.type, ['large', 'small']);\n\t\tif (isValid) {\n\t\t\treturn (this.typeState = this.type);\n\t\t} else {\n\t\t\tthis.warnDefaultType();\n\t\t\treturn (this.typeState = 'large');\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid `type` warning message.\n\t * @returns default type ('large')\n\t */\n\tprivate warnDefaultType() {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' type ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-loading-indicator> ')\n\t\t\t.addRegularText('was set to an invalid type; only')\n\t\t\t.addMonospaceText(' large or small ')\n\t\t\t.addRegularText('are supported. The default type')\n\t\t\t.addMonospaceText(' large ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.language = validateLanguage(this.language);\n\t\tthis.validateType();\n\t\tthis.isLoadingState = this.isLoading;\n\t}\n\n\trender() {\n\t\treturn this.typeState === 'large' ? (\n\t\t\t<div\n\t\t\t\tclass={\n\t\t\t\t\tthis.fullScreenOverlay\n\t\t\t\t\t\t? `ontario-loading-indicator__overlay`\n\t\t\t\t\t\t: `ontario-loading-indicator__overlay--within-container`\n\t\t\t\t}\n\t\t\t\taria-hidden={this.isLoadingState ? 'false' : 'true'}\n\t\t\t\trole=\"alert\"\n\t\t\t\taria-live=\"assertive\"\n\t\t\t>\n\t\t\t\t<div class=\"ontario-loading-indicator\">\n\t\t\t\t\t<svg class=\"ontario-loading-indicator__spinner\" viewBox=\"25 25 50 50\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t\t<circle cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\n\t\t\t\t\t</svg>\n\t\t\t\t\t<p>{this.message ?? this.translations.loading[`${this.language}`]}</p>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t) : (\n\t\t\t<p>The small loading indicator is still under development.</p>\n\t\t);\n\t}\n}\n"],"version":3}
+{"file":"ontario-loading-indicator.js","mappings":";;;;;AAAA,MAAM,0BAA0B,GAAG,07CAA07C;;MCah9CA,yBAAuB,iBAAAC,kBAAA,CAAA,MAAA,uBAAA,SAAAC,CAAA,CAAA;;;;;;AACnC;;AAEG;IACK,IAAI,GAAsB,OAAO;AAEzC;;AAEG;IACK,SAAS,GAAY,KAAK;AAElC;;;;;AAKG;AACK,IAAA,OAAO;AAEf;;;;AAIG;IACK,iBAAiB,GAAa,IAAI;AAE1C;;;AAGG;AACsB,IAAA,QAAQ;IAExB,YAAY,GAAQ,YAAY;AAEzC;;AAEG;AACc,IAAA,cAAc;AACd,IAAA,SAAS;AAE1B;;AAEG;AAEH,IAAA,oBAAoB,CAAC,KAA4B,EAAA;AAChD,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;AACnB,YAAA,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,KAAK,CAAC;;;AAKzC,IAAA,2BAA2B,CAAC,KAA4B,EAAA;AACvD,QAAA,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,KAAK,CAAC;;AAGxC;;AAEG;AAEH,IAAA,gBAAgB,CAAC,YAAqB,EAAA;AACrC,QAAA,IAAI,CAAC,cAAc,GAAG,YAAY;;AAGnC;;;;;AAKG;IAEH,YAAY,GAAA;AACX,QAAA,MAAM,OAAO,GAAG,yBAAyB,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QACxE,IAAI,OAAO,EAAE;YACZ,QAAQ,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI;;aAC5B;YACN,IAAI,CAAC,eAAe,EAAE;AACtB,YAAA,QAAQ,IAAI,CAAC,SAAS,GAAG,OAAO;;;AAIlC;;;AAGG;IACK,eAAe,GAAA;AACtB,QAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;QACzC;AACE,aAAA,kBAAkB;aAClB,gBAAgB,CAAC,QAAQ;aACzB,cAAc,CAAC,IAAI;aACnB,gBAAgB,CAAC,+BAA+B;aAChD,cAAc,CAAC,kCAAkC;aACjD,gBAAgB,CAAC,kBAAkB;aACnC,cAAc,CAAC,iCAAiC;aAChD,gBAAgB,CAAC,SAAS;aAC1B,cAAc,CAAC,aAAa;AAC5B,aAAA,YAAY,EAAE;;IAGjB,iBAAiB,GAAA;QAChB,IAAI,CAAC,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/C,IAAI,CAAC,YAAY,EAAE;AACnB,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;;IAGrC,MAAM,GAAA;AACL,QAAA,OAAO,IAAI,CAAC,SAAS,KAAK,OAAO,IAChC,CACC,CAAA,KAAA,EAAA,EAAA,KAAK,EACJ,IAAI,CAAC;AACJ,kBAAE,CAAoC,kCAAA;kBACpC,CAAsD,oDAAA,CAAA,EAAA,aAAA,EAE7C,IAAI,CAAC,cAAc,GAAG,OAAO,GAAG,MAAM,EACnD,IAAI,EAAC,OAAO,eACF,WAAW,EAAA,EAErB,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,2BAA2B,EAAA,EACrC,CAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,oCAAoC,EAAC,OAAO,EAAC,aAAa,EAAC,KAAK,EAAC,4BAA4B,EAAA,EACvG,CAAA,CAAA,QAAA,EAAA,EAAQ,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,EAAc,cAAA,EAAA,GAAG,GAAG,CACzD,EACN,CAAI,CAAA,GAAA,EAAA,IAAA,EAAA,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,CAAA,EAAG,IAAI,CAAC,QAAQ,CAAA,CAAE,CAAC,CAAK,CACjE,CACD,KAEN,CAA8D,CAAA,GAAA,EAAA,IAAA,EAAA,yDAAA,CAAA,CAC9D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["OntarioLoadingIndicator","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ontario-loading-indicator/ontario-loading-indicator.scss?tag=ontario-loading-indicator&encapsulation=shadow","src/components/ontario-loading-indicator/ontario-loading-indicator.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/spacing.variables' as spacing;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/fonts.variables' as fonts;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/font-weights.variables' as fontWeights;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/line-heights.variables' as lineHeights;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\n\n$offset: 1, 200;\n$duration: 1.5s;\n$spinner-size: 3rem;\n$dasharray: 89, 200;\n$loading-indicator-z-index: 9999;\n\n.ontario-loading-indicator__overlay,\n.ontario-loading-indicator__overlay--within-container {\n\tposition: fixed;\n\twidth: 100%;\n\tleft: 0;\n\tright: 0;\n\ttop: 0;\n\tbottom: 0;\n\tbackground-color: rgba(colours.$ontario-colour-white, 0.7);\n\tz-index: $loading-indicator-z-index;\n\n\t&[aria-hidden='false'] {\n\t\tdisplay: block;\n\t}\n\n\t&[aria-hidden='true'] {\n\t\tdisplay: none;\n\t}\n}\n\n.ontario-loading-indicator__overlay--within-container {\n\tposition: absolute;\n}\n\n.ontario-loading-indicator {\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\tposition: absolute;\n\ttop: 50%;\n\ttransform: translateY(-50%);\n\twidth: 100%;\n\theight: 100%;\n\n\tp {\n\t\tcolor: colours.$ontario-greyscale-70;\n\t\tfont-family: fonts.$ontario-font-raleway-modified;\n\t\tfont-size: globalFunctions.px-to-rem(16);\n\t\tline-height: lineHeights.$ontario-line-height-7;\n\t\tfont-weight: fontWeights.$ontario-font-weights-bold;\n\t\tword-spacing: 0.025rem;\n\t\tmargin: spacing.$spacing-3 spacing.$spacing-0 spacing.$spacing-0;\n\t}\n}\n\n.ontario-loading-indicator__spinner {\n\tanimation: rotator $duration linear infinite;\n\twidth: $spinner-size;\n\theight: $spinner-size;\n\toverflow: visible;\n\n\tcircle {\n\t\tstroke-dasharray: $offset;\n\t\tstroke-dashoffset: 0;\n\t\tstroke-linecap: round;\n\t\tstroke: colours.$ontario-greyscale-70;\n\t\tanimation: dash $duration ease-in-out infinite;\n\t}\n}\n\n@keyframes rotator {\n\t100% {\n\t\ttransform: rotate(360deg);\n\t}\n}\n\n@keyframes dash {\n\t0% {\n\t\tstroke-dasharray: $offset;\n\t\tstroke-dashoffset: 0;\n\t}\n\n\t50% {\n\t\tstroke-dasharray: $dasharray;\n\t\tstroke-dashoffset: -35px;\n\t}\n\n\t100% {\n\t\tstroke-dasharray: $dasharray;\n\t\tstroke-dashoffset: -124px;\n\t}\n}\n","import { Component, h, Prop, Listen, State, Watch } from '@stencil/core';\nimport { Language } from '../../utils/common/language-types';\nimport { validateLanguage } from '../../utils/validation/validation-functions';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\n\nimport translations from '../../translations/global.i18n.json';\n\n@Component({\n\ttag: 'ontario-loading-indicator',\n\tstyleUrl: 'ontario-loading-indicator.scss',\n\tshadow: true,\n})\nexport class OntarioLoadingIndicator {\n\t/**\n\t * The type of loading indicator to render.\n\t */\n\t@Prop() type: 'small' | 'large' = 'large';\n\n\t/**\n\t * A boolean value to determine whether or not the loading indicator is loading (i.e: is visible) or not.\n\t */\n\t@Prop() isLoading: boolean = false;\n\n\t/**\n\t * The message that tells the user what is happening or why the user is waiting.\n\t * If no message prop is passed, it will default to \"Loading\". Translations for this default message are included.\n\t *\n\t * This is optional.\n\t */\n\t@Prop() message?: string;\n\n\t/**\n\t * A boolean value to determine whether the loading indicator overlay covers the full page or not. By default, this is set to `true`.\n\t *\n\t * If set to `false`, the loading indicator overlay will be positioned absolutely relative to its container. Note that this will only work if the containing element has a style rule specifying it to be positioned relatively.\n\t */\n\t@Prop() fullScreenOverlay?: boolean = true;\n\n\t/**\n\t * The language of the component.\n\t * This is used for translations, and is by default set through event listeners checking for a language property from the header. If no language is passed, it will default to English.\n\t */\n\t@Prop({ mutable: true }) language?: Language;\n\n\t@State() translations: any = translations;\n\n\t/**\n\t * Mutable variables, for internal use only.\n\t */\n\t@State() private isLoadingState: boolean;\n\t@State() private typeState: 'small' | 'large';\n\n\t/**\n\t * This listens for the `setAppLanguage` event sent from the test language toggler when it is is connected to the DOM. It is used for the initial language when the input component loads.\n\t */\n\t@Listen('setAppLanguage', { target: 'window' })\n\thandleSetAppLanguage(event: CustomEvent<Language>) {\n\t\tif (!this.language) {\n\t\t\tthis.language = validateLanguage(event);\n\t\t}\n\t}\n\n\t@Listen('headerLanguageToggled', { target: 'window' })\n\thandleHeaderLanguageToggled(event: CustomEvent<Language>) {\n\t\tthis.language = validateLanguage(event);\n\t}\n\n\t/**\n\t * Watch for changes in the `isLoading` prop.\n\t */\n\t@Watch('isLoading')\n\tisLoadingChanged(newIsLoading: boolean) {\n\t\tthis.isLoadingState = newIsLoading;\n\t}\n\n\t/**\n\t * Watch for changes in the `type` variable for validation purposes.\n\t *\n\t * If the user input doesn't match one of the array values then `type` will be set to its default (`large`).\n\t * If a match is found in one of the array values then `type` will be set to the matching array key value.\n\t */\n\t@Watch('type')\n\tvalidateType() {\n\t\tconst isValid = validateValueAgainstArray(this.type, ['large', 'small']);\n\t\tif (isValid) {\n\t\t\treturn (this.typeState = this.type);\n\t\t} else {\n\t\t\tthis.warnDefaultType();\n\t\t\treturn (this.typeState = 'large');\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid `type` warning message.\n\t * @returns default type ('large')\n\t */\n\tprivate warnDefaultType() {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' type ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-loading-indicator> ')\n\t\t\t.addRegularText('was set to an invalid type; only')\n\t\t\t.addMonospaceText(' large or small ')\n\t\t\t.addRegularText('are supported. The default type')\n\t\t\t.addMonospaceText(' large ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.language = validateLanguage(this.language);\n\t\tthis.validateType();\n\t\tthis.isLoadingState = this.isLoading;\n\t}\n\n\trender() {\n\t\treturn this.typeState === 'large' ? (\n\t\t\t<div\n\t\t\t\tclass={\n\t\t\t\t\tthis.fullScreenOverlay\n\t\t\t\t\t\t? `ontario-loading-indicator__overlay`\n\t\t\t\t\t\t: `ontario-loading-indicator__overlay--within-container`\n\t\t\t\t}\n\t\t\t\taria-hidden={this.isLoadingState ? 'false' : 'true'}\n\t\t\t\trole=\"alert\"\n\t\t\t\taria-live=\"assertive\"\n\t\t\t>\n\t\t\t\t<div class=\"ontario-loading-indicator\">\n\t\t\t\t\t<svg class=\"ontario-loading-indicator__spinner\" viewBox=\"25 25 50 50\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t\t\t\t\t<circle cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" stroke-width=\"4\" />\n\t\t\t\t\t</svg>\n\t\t\t\t\t<p>{this.message ?? this.translations.loading[`${this.language}`]}</p>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t) : (\n\t\t\t<p>The small loading indicator is still under development.</p>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/components/ontario-page-alert.js

@@ -1,12 +1,11 @@
-import { p as proxyCustomElement, H, h } from './p-846438ed.js';
-import { d as defineCustomElement$5 } from './p-c13fee12.js';
-import { d as defineCustomElement$4 } from './p-0c95bab2.js';
-import { d as defineCustomElement$3 } from './p-94efeef1.js';
-import { d as defineCustomElement$2 } from './p-09bf4083.js';
+import { p as proxyCustomElement, H, h } from './index.js';
+import { d as defineCustomElement$5 } from './p-BeNeXjVo.js';
+import { d as defineCustomElement$4 } from './p-DtoxyT30.js';
+import { d as defineCustomElement$3 } from './p-C6R1RJva.js';
+import { d as defineCustomElement$2 } from './p-oOEM9Utl.js';
 
 const ontarioPageAlertCss =
-	'@charset "UTF-8";h6,.ontario-h6,h5,.ontario-h5,h4,.ontario-h4,h3,.ontario-h3,h2,.ontario-h2,h1,.ontario-h1{font-style:normal;font-weight:700;text-rendering:optimizeLegibility;margin-bottom:1rem;font-feature-settings:normal;font-family:"Raleway", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif}h1,.ontario-h1{font-size:2rem;letter-spacing:0.04rem;line-height:1.29;margin:2.5rem 0 1.5rem 0;max-width:70rem}@media screen and (min-width: 40em){h1,.ontario-h1{font-size:2.5rem;letter-spacing:0.04rem;line-height:1.2}}h2,.ontario-h2{font-size:1.6875rem;letter-spacing:0.03rem;line-height:1.37;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h2,.ontario-h2{font-size:2.0625rem;letter-spacing:0.02rem;line-height:1.33}}h3,.ontario-h3{font-size:1.4375rem;letter-spacing:0.02rem;line-height:1.39;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h3,.ontario-h3{font-size:1.75rem;letter-spacing:0.02rem;line-height:1.43}}h4,.ontario-h4{font-size:1.25rem;letter-spacing:0.03rem;line-height:1.5;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h4,.ontario-h4{font-size:1.5rem;letter-spacing:0.0313rem;line-height:1.5}}h5,.ontario-h5{font-size:1.125rem;letter-spacing:0.03rem;line-height:1.56;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h5,.ontario-h5{font-size:1.1875rem;letter-spacing:0.025rem;line-height:1.5}}h6,.ontario-h6{font-size:1rem;line-height:1.56;letter-spacing:0.03rem;max-width:48rem;margin:0 0 0.75rem 0}@media screen and (min-width: 40em){h6,.ontario-h6{font-size:1rem;letter-spacing:0.025rem;line-height:1.5}}.ontario-lead-statement{font-size:1.25rem;line-height:1.6;max-width:70rem}@media screen and (min-width: 40em){.ontario-lead-statement{font-size:1.375rem}}html{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem}body{font-size:1rem;line-height:1.6;background-color:#FFFFFF;color:#1a1a1a;margin:0}p{font-size:inherit;margin-bottom:1.25rem;text-rendering:optimizeLegibility;margin:0 0 1.5rem 0}cite{font-style:italic;line-height:inherit}strong{font-weight:700;line-height:inherit}*,*::before,*::after{box-sizing:inherit}main p,main p:not(.ontario-lead-statement),main dd,main li{max-width:48rem}hr{border:0;padding:0;margin:2.5rem 0;border-bottom:4px solid #cccccc}hr.ontario-hr--dark{border-bottom:4px solid #1a1a1a}a{color:#0066CC;text-decoration:underline}a:visited{color:#551A8B}a:hover{color:#00478F}a:active{color:#002142}a:focus{-moz-box-shadow:0 0 0 4px #009ADB;-webkit-box-shadow:0 0 0 4px #009ADB;box-shadow:0 0 0 4px #009ADB;outline:4px solid transparent;transition:all 0.1s ease-in-out}​p{margin:0 0 1.5rem 0}​p+h1,p+h2,p+h3,p+h4,p+h5,p+h6,ul+h1,ul+h2,ul+h3,ul+h4,ul+h5,ul+h6,ol+h1,ol+h2,ol+h3,ol+h4,ol+h5,ol+h6,h1+h2,h2+h3,h3+h4,h4+h5,h5+h6{margin-top:2rem}p code,td code,li code{line-height:2.25rem}input[type=text],input[type=number],input[type=email],input[type=date],input[type=color],input[type=search],input[type=tel],textarea{background-origin:initial;height:auto;-webkit-appearance:none;-moz-appearance:none}input[type=checkbox]+label,input[type=radio]+label{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:400;margin-left:0;margin-right:0}fieldset{border:0;margin:0;padding:0;page-break-inside:avoid}legend,label{display:block;margin:0}select{background-origin:initial;height:auto;-webkit-appearance:none;-moz-appearance:none}ul,ol{padding:0}ul{margin-left:2rem}ul li{padding:0 0 0.75rem 0}ol{margin-left:1.75rem}ol li{padding:0 0 0.75rem 0.25rem}ul li:last-child,ol li:last-child{padding-bottom:0}ul[class*=columns-] li:last-child,ol[class*=columns-] li:last-child{padding-bottom:0.75rem}ul ul,ol ul{margin:0.5rem 0 0.5rem 2rem}ul ol,ol ol{margin:0.5rem 0 0.5rem 1.75rem}p+ul,p+ol{margin-top:-0.75rem}@media screen and (min-width: 40em){ul{margin:0.5rem 0 1.5rem 3rem}ol{margin:0.5rem 0 1.5rem 2.75rem}ul ul,ol ul{margin:0.5rem 0 0.5rem 3rem}ul ol,ol ol{margin:0.5rem 0 0.5rem 2.75rem}}.ontario-alert{border-width:0 0 0 0.25rem;border-style:solid;padding:1.5rem;margin:2rem 0 2.5rem 0}.ontario-alert__header{display:-webkit-box;display:-ms-flexbox;display:flex}.ontario-alert__header-icon{display:inline-block;vertical-align:top;margin-right:0.95rem}.ontario-alert__header-title{margin-bottom:0.75rem;padding-top:0.125rem}.ontario-alert__body{margin-left:3.25rem;max-width:48rem}@media screen and (max-width: 40em){.ontario-alert__body{margin-left:0}}.ontario-alert__body p{margin-top:0}.ontario-alert__body p:last-of-type{margin-bottom:0.5rem}.ontario-alert__body p:last-of-type+ul{margin-top:1rem}.ontario-alert__body ul:last-of-type{margin-bottom:0.5rem}.ontario-alert--error ul{margin-left:1.25rem}.ontario-alert--error ul:last-of-type{margin-bottom:0.5rem}.ontario-alert--informational{border-color:#1080A6;background-color:#E2F0F4}.ontario-alert--warning{border-color:#FFD440;background-color:#FEF6DC}.ontario-alert--success{border-color:#118847;background-color:#E5f0E9}.ontario-alert--error{border-color:#CD0000;background-color:#FCEFF0}.ontario-alert--error a{color:#CD0000}.ontario-alert--error a:hover,.ontario-alert--error a:focus{color:#6b0000}.ontario-alert--error a:active{color:#280000}';
-const OntarioPageAlertStyle0 = ontarioPageAlertCss;
+	'@charset "UTF-8";h6,.ontario-h6,h5,.ontario-h5,h4,.ontario-h4,h3,.ontario-h3,h2,.ontario-h2,h1,.ontario-h1{font-style:normal;font-weight:700;text-rendering:optimizeLegibility;margin-bottom:1rem;font-feature-settings:normal;font-family:"Raleway Modified", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif}h1,.ontario-h1{font-size:2rem;letter-spacing:0.04rem;line-height:1.29;margin:2.5rem 0 1.5rem 0;max-width:70rem}@media screen and (min-width: 40em){h1,.ontario-h1{font-size:2.5rem;letter-spacing:0.04rem;line-height:1.2}}h2,.ontario-h2{font-size:1.6875rem;letter-spacing:0.03rem;line-height:1.37;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h2,.ontario-h2{font-size:2.0625rem;letter-spacing:0.02rem;line-height:1.33}}h3,.ontario-h3{font-size:1.4375rem;letter-spacing:0.02rem;line-height:1.39;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h3,.ontario-h3{font-size:1.75rem;letter-spacing:0.02rem;line-height:1.43}}h4,.ontario-h4{font-size:1.25rem;letter-spacing:0.03rem;line-height:1.5;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h4,.ontario-h4{font-size:1.5rem;letter-spacing:0.0313rem;line-height:1.5}}h5,.ontario-h5{font-size:1.125rem;letter-spacing:0.03rem;line-height:1.56;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h5,.ontario-h5{font-size:1.1875rem;letter-spacing:0.025rem;line-height:1.5}}h6,.ontario-h6{font-size:1rem;line-height:1.56;letter-spacing:0.03rem;max-width:48rem;margin:0 0 0.75rem 0}@media screen and (min-width: 40em){h6,.ontario-h6{font-size:1rem;letter-spacing:0.025rem;line-height:1.5}}.ontario-lead-statement{font-size:1.25rem;line-height:1.6;max-width:70rem}@media screen and (min-width: 40em){.ontario-lead-statement{font-size:1.375rem}}html{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem}body{font-size:1rem;line-height:1.6;background-color:#FFFFFF;color:#1a1a1a;margin:0}p{font-size:inherit;margin-bottom:1.25rem;text-rendering:optimizeLegibility;margin:0 0 1.5rem 0}cite{font-style:italic;line-height:inherit}strong{font-weight:700;line-height:inherit}*,*::before,*::after{box-sizing:inherit}main p,main p:not(.ontario-lead-statement),main dd,main li{max-width:48rem}hr{border:0;padding:0;margin:2.5rem 0;border-bottom:4px solid #cccccc}hr.ontario-hr--dark{border-bottom:4px solid #1a1a1a}a{color:#0066CC;text-decoration:underline}a:visited{color:#551A8B}a:hover{color:#00478F}a:active{color:#002142}a:focus{-moz-box-shadow:0 0 0 4px #009ADB;-webkit-box-shadow:0 0 0 4px #009ADB;box-shadow:0 0 0 4px #009ADB;outline:4px solid transparent;transition:all 0.1s ease-in-out}​p{margin:0 0 1.5rem 0}​p+h1,p+h2,p+h3,p+h4,p+h5,p+h6,ul+h1,ul+h2,ul+h3,ul+h4,ul+h5,ul+h6,ol+h1,ol+h2,ol+h3,ol+h4,ol+h5,ol+h6,h1+h2,h2+h3,h3+h4,h4+h5,h5+h6{margin-top:2rem}p code,td code,li code{line-height:2.25rem}input[type=text],input[type=number],input[type=email],input[type=date],input[type=color],input[type=search],input[type=tel],textarea{background-origin:initial;height:auto;-webkit-appearance:none;-moz-appearance:none}input[type=checkbox]+label,input[type=radio]+label{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:400;margin-left:0;margin-right:0}fieldset{border:0;margin:0;padding:0;page-break-inside:avoid}legend,label{display:block;margin:0}select{background-origin:initial;height:auto;-webkit-appearance:none;-moz-appearance:none}ul,ol{padding:0}ul{margin-left:2rem}ul li{padding:0 0 0.75rem 0}ol{margin-left:1.75rem}ol li{padding:0 0 0.75rem 0.25rem}ul li:last-child,ol li:last-child{padding-bottom:0}ul[class*=columns-] li:last-child,ol[class*=columns-] li:last-child{padding-bottom:0.75rem}ul ul,ol ul{margin:0.5rem 0 0.5rem 2rem}ul ol,ol ol{margin:0.5rem 0 0.5rem 1.75rem}p+ul,p+ol{margin-top:-0.75rem}@media screen and (min-width: 40em){ul{margin:0.5rem 0 1.5rem 3rem}ol{margin:0.5rem 0 1.5rem 2.75rem}ul ul,ol ul{margin:0.5rem 0 0.5rem 3rem}ul ol,ol ol{margin:0.5rem 0 0.5rem 2.75rem}}.ontario-alert{border-width:0 0 0 0.25rem;border-style:solid;padding:1.5rem;margin:2rem 0 2.5rem 0}.ontario-alert__header{display:-webkit-box;display:-ms-flexbox;display:flex}.ontario-alert__header-icon{display:inline-block;vertical-align:top;margin-right:0.95rem}.ontario-alert__header-title{margin-bottom:0.75rem;padding-top:0.125rem}.ontario-alert__body{margin-left:3.25rem;max-width:48rem}@media screen and (max-width: 40em){.ontario-alert__body{margin-left:0}}.ontario-alert__body p{margin-top:0}.ontario-alert__body p:last-of-type{margin-bottom:0.5rem}.ontario-alert__body p:last-of-type+ul{margin-top:1rem}.ontario-alert__body ul:last-of-type{margin-bottom:0.5rem}.ontario-alert--error ul{margin-left:1.25rem}.ontario-alert--error ul:last-of-type{margin-bottom:0.5rem}.ontario-alert--informational{border-color:#1080A6;background-color:#E2F0F4}.ontario-alert--warning{border-color:#FFD440;background-color:#FEF6DC}.ontario-alert--success{border-color:#118847;background-color:#E5f0E9}.ontario-alert--error{border-color:#CD0000;background-color:#FCEFF0}.ontario-alert--error a{color:#CD0000}.ontario-alert--error a:hover,.ontario-alert--error a:focus{color:#6b0000}.ontario-alert--error a:active{color:#280000}';
 
 const OntarioPageAlert$1 = /*@__PURE__*/ proxyCustomElement(
 	class OntarioPageAlert extends H {
@@ -76,30 +75,30 @@ const OntarioPageAlert$1 = /*@__PURE__*/ proxyCustomElement(
 		render() {
 			return h(
 				'div',
-				{ key: '177966a73a196ca3424eecdf1bea139918e2207f', class: this.getClass() },
+				{ key: 'bc89ba1ae733df97405d1431c21e94b6bde31659', class: this.getClass() },
 				h(
 					'div',
-					{ key: '52cf48c4fd84a7bd17233acbfaffefc2f3ceb2f2', class: 'ontario-alert__header' },
+					{ key: '823d43473763c86b7d62e50c6a9f38377eb85931', class: 'ontario-alert__header' },
 					h(
 						'div',
-						{ key: 'e7d36d8f358c8dd362512377346bece42fcd688d', class: 'ontario-alert__header-icon' },
+						{ key: '186731136cf022db116adcb017c1d53be3589312', class: 'ontario-alert__header-icon' },
 						this.renderIcon(),
 					),
 					h(
 						'h2',
-						{ key: '32d9d21ad979b969f157f3d0bc9e15499c23a54c', class: 'ontario-alert__header-title ontario-h4' },
+						{ key: '01f2f4f91f6567cff09130359ac2cd6fb949574e', class: 'ontario-alert__header-title ontario-h4' },
 						this.heading,
 					),
 				),
 				h(
 					'div',
-					{ key: '6a4a21d2ed84fe9a2eae2b26c239871fb8514612', class: 'ontario-alert__body' },
+					{ key: 'c72fdccf42f2669259856c58be84085152dde302', class: 'ontario-alert__body' },
 					this.renderContent(),
 				),
 			);
 		}
 		static get style() {
-			return OntarioPageAlertStyle0;
+			return ontarioPageAlertCss;
 		}
 	},
 	[
@@ -158,5 +157,6 @@ const OntarioPageAlert = OntarioPageAlert$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { OntarioPageAlert, defineCustomElement };
+//# sourceMappingURL=ontario-page-alert.js.map
 
 //# sourceMappingURL=ontario-page-alert.js.map

package/dist/components/ontario-page-alert.js.map

@@ -1 +1 @@
-{"file":"ontario-page-alert.js","mappings":";;;;;;AAAA,MAAM,mBAAmB,GAAG,qoKAAqoK,CAAC;AAClqK,+BAAe,mBAAmB;;MCOrBA,kBAAgB;;;;;;;;;;;;;;;IAUpB,IAAI,GAAkB,eAAe,CAAC;;;;;;;;IAStC,OAAO,CAAS;;;;;;;;;;;;;;IAehB,OAAO,CAAS;;;;IAKhB,QAAQ;QACf,OAAO,gCAAgC,IAAI,CAAC,IAAI,EAAE,CAAC;KACnD;IAED,UAAU;QACT,MAAM,SAAS,GAAG,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;QAEvC,QAAQ,IAAI,CAAC,IAAI;YAChB,KAAK,eAAe;gBACnB,OAAO,yCAAoC,SAAS,GAAI,CAAC;YAE1D,KAAK,SAAS;gBACb,OAAO,qCAAgC,SAAS,GAAI,CAAC;YAEtD,KAAK,SAAS;gBACb,OAAO,qCAAgC,SAAS,GAAI,CAAC;YAEtD,KAAK,OAAO;gBACX,OAAO,mCAA8B,SAAS,GAAI,CAAC;SACpD;KACD;IAED,aAAa;QACZ,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC;QAE1B,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;YAC7B,OAAO,aAAI,IAAI,CAAK,CAAC;SACrB;QAED,OAAO,eAAQ,CAAC;KAChB;IAED,MAAM;QACL,QACC,4DAAK,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,IAC1B,4DAAK,KAAK,EAAC,uBAAuB,IACjC,4DAAK,KAAK,EAAC,4BAA4B,IAAE,IAAI,CAAC,UAAU,EAAE,CAAO,EACjE,2DAAI,KAAK,EAAC,wCAAwC,IAAE,IAAI,CAAC,OAAO,CAAM,CACjE,EACN,4DAAK,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,aAAa,EAAE,CAAO,CACxD,EACL;KACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["OntarioPageAlert"],"sources":["src/components/ontario-page-alert/ontario-page-alert.scss?tag=ontario-page-alert&encapsulation=shadow","src/components/ontario-page-alert/ontario-page-alert.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/global.variables' as globalVariables;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/spacing.variables' as spacing;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/breakpoints.variables' as breakpoints;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\n@forward '@ongov/ontario-design-system-global-styles/dist/styles/scss/4-elements/_global.elements.scss';\n\n$ontario-alert-link-focus: #6b0000;\n$ontario-alert-link-active: #280000;\n\n.ontario-alert {\n\tborder-width: 0 0 0 globalFunctions.px-to-rem(4);\n\tborder-style: solid;\n\tpadding: spacing.$spacing-5;\n\tmargin: spacing.$spacing-6 spacing.$spacing-0 spacing.$spacing-7 spacing.$spacing-0;\n}\n\n.ontario-alert__header {\n\tdisplay: -webkit-box;\n\tdisplay: -ms-flexbox;\n\tdisplay: flex;\n}\n\n.ontario-alert__header-icon {\n\tdisplay: inline-block;\n\tvertical-align: top;\n\tmargin-right: 0.95rem;\n}\n\n.ontario-alert__header-title {\n\tmargin-bottom: spacing.$spacing-3;\n\tpadding-top: globalFunctions.px-to-rem(2);\n}\n\n.ontario-alert__body {\n\tmargin-left: 3.25rem;\n\tmax-width: globalVariables.$standard-width;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\tmargin-left: spacing.$spacing-0;\n\t}\n}\n\n.ontario-alert__body p {\n\tmargin-top: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tmargin-bottom: spacing.$spacing-2;\n\t}\n}\n\n.ontario-alert__body p:last-of-type + ul {\n\tmargin-top: spacing.$spacing-4;\n}\n\n.ontario-alert__body ul:last-of-type {\n\tmargin-bottom: spacing.$spacing-2;\n}\n\n.ontario-alert--error ul {\n\tmargin-left: 1.25rem;\n}\n\n.ontario-alert--error ul:last-of-type {\n\tmargin-bottom: spacing.$spacing-2;\n}\n\n// ---------------------\n//    Alert variations\n// ---------------------\n// informational alert\n.ontario-alert--informational {\n\tborder-color: colours.$ontario-colour-information;\n\tbackground-color: colours.$ontario-colour-information-light;\n}\n\n// warning alert\n.ontario-alert--warning {\n\tborder-color: colours.$ontario-colour-warning;\n\tbackground-color: colours.$ontario-colour-warning-light;\n}\n\n// success alert\n.ontario-alert--success {\n\tborder-color: colours.$ontario-colour-success;\n\tbackground-color: colours.$ontario-colour-success-light;\n}\n\n// error alert\n.ontario-alert--error {\n\tborder-color: colours.$ontario-colour-alert;\n\tbackground-color: colours.$ontario-colour-alert-light;\n}\n\n.ontario-alert--error a {\n\tcolor: colours.$ontario-colour-alert;\n\n\t&:hover,\n\t&:focus {\n\t\tcolor: $ontario-alert-link-focus;\n\t}\n\n\t&:active {\n\t\tcolor: $ontario-alert-link-active;\n\t}\n}\n","import { Component, h, Prop } from '@stencil/core';\nimport { PageAlert, PageAlertType } from './ontario-page-alert.interface';\n\n@Component({\n\ttag: 'ontario-page-alert',\n\tstyleUrl: 'ontario-page-alert.scss',\n\tshadow: true,\n})\nexport class OntarioPageAlert implements PageAlert {\n\t/**\n\t * The type of page alert to render. If no value is provided, the `informational` type alert would be rendered.\n\t *\n\t * There are four possible values for page alert: `informational`, `warning`, `success` or `error`.\n\t *\n\t * @example\n\t * <ontario-page-alert type=\"error\">\n\t * </ontario-page-alert>\n\t */\n\t@Prop() type: PageAlertType = 'informational';\n\n\t/**\n\t * The heading for the page alert.\n\t *\n\t * @example\n\t * <ontario-page-alert heading=\"Licence plates\">\n\t * </ontario-page-alert>\n\t */\n\t@Prop() heading: string;\n\n\t/**\n\t * The main content for the page alert. This can be rendered as either string or HTML content.\n\t *\n\t * @example\n\t * <ontario-page-alert content=\"Please look out for an email confirmation with your receipt and order number.\">\n\t * </ontario-page-alert>\n\t *\n\t * or\n\t *\n\t * <ontario-page-alert>\n\t *  <p>This is a sample page alert component using slots. <a href=\"#\">Learn more</a>.</p>\n\t * </ontario-page-alert>\n\t */\n\t@Prop() content: string;\n\n\t/**\n\t * @returns the classes of the page alert container based on the alert `type`.\n\t */\n\tprivate getClass() {\n\t\treturn `ontario-alert ontario-alert--${this.type}`;\n\t}\n\n\trenderIcon() {\n\t\tconst iconProps = { 'icon-width': 36 };\n\n\t\tswitch (this.type) {\n\t\t\tcase 'informational':\n\t\t\t\treturn <ontario-icon-alert-information {...iconProps} />;\n\n\t\t\tcase 'success':\n\t\t\t\treturn <ontario-icon-alert-success {...iconProps} />;\n\n\t\t\tcase 'warning':\n\t\t\t\treturn <ontario-icon-alert-warning {...iconProps} />;\n\n\t\t\tcase 'error':\n\t\t\t\treturn <ontario-icon-alert-error {...iconProps} />;\n\t\t}\n\t}\n\n\trenderContent() {\n\t\tconst body = this.content;\n\n\t\tif (typeof body === 'string') {\n\t\t\treturn <p>{body}</p>;\n\t\t}\n\n\t\treturn <slot />;\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<div class={this.getClass()}>\n\t\t\t\t<div class=\"ontario-alert__header\">\n\t\t\t\t\t<div class=\"ontario-alert__header-icon\">{this.renderIcon()}</div>\n\t\t\t\t\t<h2 class=\"ontario-alert__header-title ontario-h4\">{this.heading}</h2>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"ontario-alert__body\">{this.renderContent()}</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"],"version":3}
+{"file":"ontario-page-alert.js","mappings":";;;;;;AAAA,MAAM,mBAAmB,GAAG,8oKAA8oK;;MCQ7pKA,kBAAgB,iBAAAC,kBAAA,CAAA,MAAA,gBAAA,SAAAC,CAAA,CAAA;;;;;;AAC5B;;;;;;;;AAQG;IACK,IAAI,GAAkB,eAAe;AAE7C;;;;;;AAMG;AACK,IAAA,OAAO;AAEf;;;;;;;;;;;;AAYG;AACK,IAAA,OAAO;AAEf;;AAEG;IACK,QAAQ,GAAA;AACf,QAAA,OAAO,CAAgC,6BAAA,EAAA,IAAI,CAAC,IAAI,EAAE;;IAGnD,UAAU,GAAA;AACT,QAAA,MAAM,SAAS,GAAG,EAAE,YAAY,EAAE,EAAE,EAAE;AAEtC,QAAA,QAAQ,IAAI,CAAC,IAAI;AAChB,YAAA,KAAK,eAAe;gBACnB,OAAO,CAAA,CAAA,gCAAA,EAAA,EAAA,GAAoC,SAAS,EAAA,CAAI;AAEzD,YAAA,KAAK,SAAS;gBACb,OAAO,CAAA,CAAA,4BAAA,EAAA,EAAA,GAAgC,SAAS,EAAA,CAAI;AAErD,YAAA,KAAK,SAAS;gBACb,OAAO,CAAA,CAAA,4BAAA,EAAA,EAAA,GAAgC,SAAS,EAAA,CAAI;AAErD,YAAA,KAAK,OAAO;gBACX,OAAO,CAAA,CAAA,0BAAA,EAAA,EAAA,GAA8B,SAAS,EAAA,CAAI;;;IAIrD,aAAa,GAAA;AACZ,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO;AAEzB,QAAA,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;YAC7B,OAAO,CAAA,CAAA,GAAA,EAAA,IAAA,EAAI,IAAI,CAAK;;AAGrB,QAAA,OAAO,eAAQ;;IAGhB,MAAM,GAAA;QACL,QACC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,EAAA,EAC1B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,uBAAuB,EAAA,EACjC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,4BAA4B,EAAA,EAAE,IAAI,CAAC,UAAU,EAAE,CAAO,EACjE,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,wCAAwC,EAAA,EAAE,IAAI,CAAC,OAAO,CAAM,CACjE,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,qBAAqB,EAAE,EAAA,IAAI,CAAC,aAAa,EAAE,CAAO,CACxD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["OntarioPageAlert","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ontario-page-alert/ontario-page-alert.scss?tag=ontario-page-alert&encapsulation=shadow","src/components/ontario-page-alert/ontario-page-alert.tsx"],"sourcesContent":["@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/global.variables' as globalVariables;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/spacing.variables' as spacing;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/breakpoints.variables' as breakpoints;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\n@forward '@ongov/ontario-design-system-global-styles/dist/styles/scss/4-elements/_global.elements.scss';\n\n$ontario-alert-link-focus: #6b0000;\n$ontario-alert-link-active: #280000;\n\n.ontario-alert {\n\tborder-width: 0 0 0 globalFunctions.px-to-rem(4);\n\tborder-style: solid;\n\tpadding: spacing.$spacing-5;\n\tmargin: spacing.$spacing-6 spacing.$spacing-0 spacing.$spacing-7 spacing.$spacing-0;\n}\n\n.ontario-alert__header {\n\tdisplay: -webkit-box;\n\tdisplay: -ms-flexbox;\n\tdisplay: flex;\n}\n\n.ontario-alert__header-icon {\n\tdisplay: inline-block;\n\tvertical-align: top;\n\tmargin-right: 0.95rem;\n}\n\n.ontario-alert__header-title {\n\tmargin-bottom: spacing.$spacing-3;\n\tpadding-top: globalFunctions.px-to-rem(2);\n}\n\n.ontario-alert__body {\n\tmargin-left: 3.25rem;\n\tmax-width: globalVariables.$standard-width;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\tmargin-left: spacing.$spacing-0;\n\t}\n}\n\n.ontario-alert__body p {\n\tmargin-top: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tmargin-bottom: spacing.$spacing-2;\n\t}\n}\n\n.ontario-alert__body p:last-of-type + ul {\n\tmargin-top: spacing.$spacing-4;\n}\n\n.ontario-alert__body ul:last-of-type {\n\tmargin-bottom: spacing.$spacing-2;\n}\n\n.ontario-alert--error ul {\n\tmargin-left: 1.25rem;\n}\n\n.ontario-alert--error ul:last-of-type {\n\tmargin-bottom: spacing.$spacing-2;\n}\n\n// ---------------------\n//    Alert variations\n// ---------------------\n// informational alert\n.ontario-alert--informational {\n\tborder-color: colours.$ontario-colour-information;\n\tbackground-color: colours.$ontario-colour-information-light;\n}\n\n// warning alert\n.ontario-alert--warning {\n\tborder-color: colours.$ontario-colour-warning;\n\tbackground-color: colours.$ontario-colour-warning-light;\n}\n\n// success alert\n.ontario-alert--success {\n\tborder-color: colours.$ontario-colour-success;\n\tbackground-color: colours.$ontario-colour-success-light;\n}\n\n// error alert\n.ontario-alert--error {\n\tborder-color: colours.$ontario-colour-alert;\n\tbackground-color: colours.$ontario-colour-alert-light;\n}\n\n.ontario-alert--error a {\n\tcolor: colours.$ontario-colour-alert;\n\n\t&:hover,\n\t&:focus {\n\t\tcolor: $ontario-alert-link-focus;\n\t}\n\n\t&:active {\n\t\tcolor: $ontario-alert-link-active;\n\t}\n}\n","import { Component, h, Prop } from '@stencil/core';\nimport { PageAlert, PageAlertType } from './ontario-page-alert.interface';\n\n@Component({\n\ttag: 'ontario-page-alert',\n\tstyleUrl: 'ontario-page-alert.scss',\n\tshadow: true,\n})\nexport class OntarioPageAlert implements PageAlert {\n\t/**\n\t * The type of page alert to render. If no value is provided, the `informational` type alert would be rendered.\n\t *\n\t * There are four possible values for page alert: `informational`, `warning`, `success` or `error`.\n\t *\n\t * @example\n\t * <ontario-page-alert type=\"error\">\n\t * </ontario-page-alert>\n\t */\n\t@Prop() type: PageAlertType = 'informational';\n\n\t/**\n\t * The heading for the page alert.\n\t *\n\t * @example\n\t * <ontario-page-alert heading=\"Licence plates\">\n\t * </ontario-page-alert>\n\t */\n\t@Prop() heading: string;\n\n\t/**\n\t * The main content for the page alert. This can be rendered as either string or HTML content.\n\t *\n\t * @example\n\t * <ontario-page-alert content=\"Please look out for an email confirmation with your receipt and order number.\">\n\t * </ontario-page-alert>\n\t *\n\t * or\n\t *\n\t * <ontario-page-alert>\n\t *  <p>This is a sample page alert component using slots. <a href=\"#\">Learn more</a>.</p>\n\t * </ontario-page-alert>\n\t */\n\t@Prop() content: string;\n\n\t/**\n\t * @returns the classes of the page alert container based on the alert `type`.\n\t */\n\tprivate getClass() {\n\t\treturn `ontario-alert ontario-alert--${this.type}`;\n\t}\n\n\trenderIcon() {\n\t\tconst iconProps = { 'icon-width': 36 };\n\n\t\tswitch (this.type) {\n\t\t\tcase 'informational':\n\t\t\t\treturn <ontario-icon-alert-information {...iconProps} />;\n\n\t\t\tcase 'success':\n\t\t\t\treturn <ontario-icon-alert-success {...iconProps} />;\n\n\t\t\tcase 'warning':\n\t\t\t\treturn <ontario-icon-alert-warning {...iconProps} />;\n\n\t\t\tcase 'error':\n\t\t\t\treturn <ontario-icon-alert-error {...iconProps} />;\n\t\t}\n\t}\n\n\trenderContent() {\n\t\tconst body = this.content;\n\n\t\tif (typeof body === 'string') {\n\t\t\treturn <p>{body}</p>;\n\t\t}\n\n\t\treturn <slot />;\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<div class={this.getClass()}>\n\t\t\t\t<div class=\"ontario-alert__header\">\n\t\t\t\t\t<div class=\"ontario-alert__header-icon\">{this.renderIcon()}</div>\n\t\t\t\t\t<h2 class=\"ontario-alert__header-title ontario-h4\">{this.heading}</h2>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"ontario-alert__body\">{this.renderContent()}</div>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/components/ontario-radio-buttons.js

@@ -1,20 +1,19 @@
-import { p as proxyCustomElement, H, d as createEvent, h } from './p-846438ed.js';
-import { I as Input } from './p-7caacdde.js';
-import { I as InputCaption, h as handleInputEvent, E as EventType } from './p-3fa830a3.js';
-import { v as validateLanguage, b as validatePropExists, c as validateObjectExists } from './p-edb765a1.js';
-import { C as ConsoleMessageClass } from './p-b2019a19.js';
-import { c as constructHintTextObject } from './p-e77d78ce.js';
-import { t as translations } from './p-a5331e15.js';
-import { E as ErrorMessage } from './p-8874216e.js';
-import { d as defineCustomElement$6 } from './p-9c61c9bc.js';
-import { d as defineCustomElement$5 } from './p-226df20b.js';
-import { d as defineCustomElement$4 } from './p-c13fee12.js';
-import { d as defineCustomElement$3 } from './p-1dc1dba8.js';
-import { d as defineCustomElement$2 } from './p-77545837.js';
+import { p as proxyCustomElement, H, c as createEvent, h } from './index.js';
+import { I as Input } from './p-BgeHsfjA.js';
+import { I as InputCaption, h as handleInputEvent, E as EventType } from './p-CJ1sSyqT.js';
+import { b as validateLanguage, a as validatePropExists, c as validateObjectExists } from './p-CNqFEifG.js';
+import { C as ConsoleMessageClass } from './p-CJXRCL8b.js';
+import { c as constructHintTextObject } from './p-CkusvkRr.js';
+import { t as translations } from './p-DgMhpSmi.js';
+import { E as ErrorMessage } from './p-DcoC7PVV.js';
+import { d as defineCustomElement$6 } from './p-orSa-v1r.js';
+import { d as defineCustomElement$5 } from './p-Br8HOVJk.js';
+import { d as defineCustomElement$4 } from './p-BeNeXjVo.js';
+import { d as defineCustomElement$3 } from './p-DyZbYpqr.js';
+import { d as defineCustomElement$2 } from './p-pYZtHvSO.js';
 
 const ontarioRadioButtonsCss =
-	'@charset "UTF-8";.ontario-radios__input:focus+.ontario-radios__label:before,.ontario-input:focus,.ontario-input:active{box-shadow:0 0 0 4px #009ADB;outline:4px solid transparent;transition:box-shadow 0.1s ease-in-out}h6,.ontario-h6,h5,.ontario-h5,h4,.ontario-h4,h3,.ontario-h3,h2,.ontario-h2,.ontario-fieldset__legend--large h1,.ontario-fieldset__legend--heading h1,h1,.ontario-h1{font-style:normal;font-weight:700;text-rendering:optimizeLegibility;margin-bottom:1rem;font-feature-settings:normal;font-family:"Raleway", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif}.ontario-fieldset__legend--large h1,.ontario-fieldset__legend--heading h1,h1,.ontario-h1{font-size:2rem;letter-spacing:0.04rem;line-height:1.29;margin:2.5rem 0 1.5rem 0;max-width:70rem}@media screen and (min-width: 40em){.ontario-fieldset__legend--large h1,.ontario-fieldset__legend--heading h1,h1,.ontario-h1{font-size:2.5rem;letter-spacing:0.04rem;line-height:1.2}}h2,.ontario-h2{font-size:1.6875rem;letter-spacing:0.03rem;line-height:1.37;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h2,.ontario-h2{font-size:2.0625rem;letter-spacing:0.02rem;line-height:1.33}}h3,.ontario-h3{font-size:1.4375rem;letter-spacing:0.02rem;line-height:1.39;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h3,.ontario-h3{font-size:1.75rem;letter-spacing:0.02rem;line-height:1.43}}h4,.ontario-h4{font-size:1.25rem;letter-spacing:0.03rem;line-height:1.5;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h4,.ontario-h4{font-size:1.5rem;letter-spacing:0.0313rem;line-height:1.5}}h5,.ontario-h5{font-size:1.125rem;letter-spacing:0.03rem;line-height:1.56;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h5,.ontario-h5{font-size:1.1875rem;letter-spacing:0.025rem;line-height:1.5}}h6,.ontario-h6{font-size:1rem;line-height:1.56;letter-spacing:0.03rem;max-width:48rem;margin:0 0 0.75rem 0}@media screen and (min-width: 40em){h6,.ontario-h6{font-size:1rem;letter-spacing:0.025rem;line-height:1.5}}.ontario-lead-statement{font-size:1.25rem;line-height:1.6;max-width:70rem}@media screen and (min-width: 40em){.ontario-lead-statement{font-size:1.375rem}}html{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem}body{font-size:1rem;line-height:1.6;background-color:#FFFFFF;color:#1a1a1a;margin:0}p{font-size:inherit;margin-bottom:1.25rem;text-rendering:optimizeLegibility;margin:0 0 1.5rem 0}cite{font-style:italic;line-height:inherit}strong{font-weight:700;line-height:inherit}*,*::before,*::after{box-sizing:inherit}main p,main p:not(.ontario-lead-statement),main dd,main li{max-width:48rem}hr{border:0;padding:0;margin:2.5rem 0;border-bottom:4px solid #cccccc}hr.ontario-hr--dark{border-bottom:4px solid #1a1a1a}a{color:#0066CC;text-decoration:underline}a:visited{color:#551A8B}a:hover{color:#00478F}a:active{color:#002142}a:focus{-moz-box-shadow:0 0 0 4px #009ADB;-webkit-box-shadow:0 0 0 4px #009ADB;box-shadow:0 0 0 4px #009ADB;outline:4px solid transparent;transition:all 0.1s ease-in-out}​p{margin:0 0 1.5rem 0}​p+h1,p+h2,p+h3,p+h4,p+h5,p+h6,ul+h1,ul+h2,ul+h3,ul+h4,ul+h5,ul+h6,ol+h1,ol+h2,ol+h3,ol+h4,ol+h5,ol+h6,h1+h2,h2+h3,h3+h4,h4+h5,h5+h6{margin-top:2rem}p code,td code,li code{line-height:2.25rem}input[type=text],input[type=number],input[type=email],input[type=date],input[type=color],input[type=search],input[type=tel],textarea{background-origin:initial;height:auto;-webkit-appearance:none;-moz-appearance:none}input[type=checkbox]+label,input[type=radio]+label{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:400;margin-left:0;margin-right:0}fieldset{border:0;margin:0;padding:0;page-break-inside:avoid}legend,label{display:block;margin:0}select{background-origin:initial;height:auto;-webkit-appearance:none;-moz-appearance:none}ul,ol{padding:0}ul{margin-left:2rem}ul li{padding:0 0 0.75rem 0}ol{margin-left:1.75rem}ol li{padding:0 0 0.75rem 0.25rem}ul li:last-child,ol li:last-child{padding-bottom:0}ul[class*=columns-] li:last-child,ol[class*=columns-] li:last-child{padding-bottom:0.75rem}ul ul,ol ul{margin:0.5rem 0 0.5rem 2rem}ul ol,ol ol{margin:0.5rem 0 0.5rem 1.75rem}p+ul,p+ol{margin-top:-0.75rem}@media screen and (min-width: 40em){ul{margin:0.5rem 0 1.5rem 3rem}ol{margin:0.5rem 0 1.5rem 2.75rem}ul ul,ol ul{margin:0.5rem 0 0.5rem 3rem}ul ol,ol ol{margin:0.5rem 0 0.5rem 2.75rem}}.ontario-form-group:last-of-type{margin-bottom:2.5rem}.ontario-form-group:last-of-type{margin-bottom:3rem}.ontario-fieldset__legend{color:#1a1a1a;font-family:"Raleway", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1.1875rem;font-weight:700;margin:0 0 1rem 0;line-height:1.5;max-width:38.75em;white-space:normal;width:100%;hyphens:auto}@media screen and (max-width: 40em){.ontario-fieldset__legend{font-size:1.125rem;line-height:1.56}}.ontario-fieldset__legend--large,.ontario-fieldset__legend--heading{letter-spacing:0.02rem;line-height:1.2}.ontario-fieldset__legend--large h1,.ontario-fieldset__legend--heading h1{display:inline-block;margin:0}@media screen and (max-width: 40em){.ontario-fieldset__legend--large,.ontario-fieldset__legend--heading{font-size:1.4375rem;line-height:1.39}}.ontario-fieldset__legend--large{font-size:1.75rem}.ontario-fieldset__legend-required-flag,.ontario-fieldset__legend-optional-flag{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:400}.ontario-fieldset__legend-required-flag:before,.ontario-fieldset__legend-optional-flag:before{content:" "}.ontario-label__flag{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:400}.ontario-label__flag:before{content:" "}.ontario-hide{display:none !important}.ontario-invisible{visibility:hidden !important}@media screen and (max-width: 39.99875em){.ontario-hide-for-small-only{display:none !important}}@media screen and (max-width: 0em), screen and (min-width: 40em){.ontario-show-for-small-only{display:none !important}}@media print, screen and (min-width: 40em){.ontario-hide-for-medium{display:none !important}}@media screen and (max-width: 39.99875em){.ontario-show-for-medium{display:none !important}}@media screen and (min-width: 40em) and (max-width: 72.99875em){.ontario-hide-for-medium-only{display:none !important}}@media screen and (max-width: 39.99875em), screen and (min-width: 73em){.ontario-show-for-medium-only{display:none !important}}@media print, screen and (min-width: 73em){.ontario-hide-for-large{display:none !important}}@media screen and (max-width: 72.99875em){.ontario-show-for-large{display:none !important}}@media screen and (min-width: 73em) and (max-width: 95.99875em){.ontario-hide-for-large-only{display:none !important}}@media screen and (max-width: 72.99875em), screen and (min-width: 96em){.ontario-show-for-large-only{display:none !important}}.ontario-show-for-sr,.ontario-show-on-focus{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0, 0, 0, 0)}.ontario-show-on-focus:active,.ontario-show-on-focus:focus{position:static;width:auto;height:auto;overflow:visible;clip:auto}.ontario-show-for-landscape,.ontario-hide-for-portrait{display:block !important}@media screen and (orientation: landscape){.ontario-show-for-landscape,.ontario-hide-for-portrait{display:block !important}}@media screen and (orientation: portrait){.ontario-show-for-landscape,.ontario-hide-for-portrait{display:none !important}}.ontario-hide-for-landscape,.ontario-show-for-portrait{display:none !important}@media screen and (orientation: landscape){.ontario-hide-for-landscape,.ontario-show-for-portrait{display:none !important}}@media screen and (orientation: portrait){.ontario-hide-for-landscape,.ontario-show-for-portrait{display:block !important}}.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}.ontario-error-messaging{display:flex;align-items:flex-start;margin:-0.25rem 0 0.5rem 0;color:#D81A21;max-width:48rem}.ontario-error-messaging__content{margin-left:0.5rem}.ontario-input__error{border-color:#D81A21 !important}.ontario-error__hidden{display:none}.ontario-radios__item{position:relative;display:block;margin:0 0 1rem;padding:0 2rem 0}.ontario-radios__item:last-of-type{margin-bottom:0}.ontario-radios__input{cursor:pointer;margin:0;position:absolute;opacity:0;top:-2px;left:-2px;width:36px;height:36px;z-index:0}@media screen and (max-width: 40em){.ontario-radios__input{width:40px;height:40px;top:-1.5px;left:-1.5px}}.ontario-radios__label{cursor:pointer;color:#1a1a1a;display:inline-block;font-family:"Raleway", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:700;line-height:1.5;margin:0.2rem 0;max-width:38.75em;padding:0 0.75rem;touch-action:manipulation;white-space:normal;width:auto;white-space:normal}@media screen and (max-width: 40em){.ontario-radios__label{margin:0.3rem 0;padding:0 1rem}}.ontario-radios__label:before{content:"";border:2px solid #1a1a1a;border-radius:50%;box-sizing:border-box;position:absolute;top:0;left:0;width:32px;height:32px;transition:border 0.1s ease-in-out}@media screen and (max-width: 40em){.ontario-radios__label:before{width:36px;height:36px}}.ontario-radios__label:after{content:"";border-radius:50%;border:10px solid #1a1a1a;position:absolute;top:0;left:0;transform:translate(6px, 6px);opacity:0}@media screen and (max-width: 40em){.ontario-radios__label:after{border:12px solid #1a1a1a}}.ontario-radios__input:focus+.ontario-radios__label:before{-moz-box-shadow:0 0 0 4px #009ADB;-webkit-box-shadow:#009ADB}.ontario-radios__input:checked+.ontario-radios__label:after{opacity:1}.ontario-radios__hint-expander{margin:0.75rem 0 0 0.5rem}@media screen and (max-width: 40em){.ontario-radios__hint-expander{margin-top:1rem}}';
-const OntarioRadioButtonsStyle0 = ontarioRadioButtonsCss;
+	'@charset "UTF-8";.ontario-radios__input:focus+.ontario-radios__label:before,.ontario-input:focus,.ontario-input:active{box-shadow:0 0 0 4px #009ADB;outline:4px solid transparent;transition:box-shadow 0.1s ease-in-out}h6,.ontario-h6,h5,.ontario-h5,h4,.ontario-h4,h3,.ontario-h3,h2,.ontario-h2,.ontario-fieldset__legend--large h1,.ontario-fieldset__legend--heading h1,h1,.ontario-h1{font-style:normal;font-weight:700;text-rendering:optimizeLegibility;margin-bottom:1rem;font-feature-settings:normal;font-family:"Raleway Modified", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif}.ontario-fieldset__legend--large h1,.ontario-fieldset__legend--heading h1,h1,.ontario-h1{font-size:2rem;letter-spacing:0.04rem;line-height:1.29;margin:2.5rem 0 1.5rem 0;max-width:70rem}@media screen and (min-width: 40em){.ontario-fieldset__legend--large h1,.ontario-fieldset__legend--heading h1,h1,.ontario-h1{font-size:2.5rem;letter-spacing:0.04rem;line-height:1.2}}h2,.ontario-h2{font-size:1.6875rem;letter-spacing:0.03rem;line-height:1.37;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h2,.ontario-h2{font-size:2.0625rem;letter-spacing:0.02rem;line-height:1.33}}h3,.ontario-h3{font-size:1.4375rem;letter-spacing:0.02rem;line-height:1.39;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h3,.ontario-h3{font-size:1.75rem;letter-spacing:0.02rem;line-height:1.43}}h4,.ontario-h4{font-size:1.25rem;letter-spacing:0.03rem;line-height:1.5;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h4,.ontario-h4{font-size:1.5rem;letter-spacing:0.0313rem;line-height:1.5}}h5,.ontario-h5{font-size:1.125rem;letter-spacing:0.03rem;line-height:1.56;margin:0 0 0.75rem 0;max-width:48rem}@media screen and (min-width: 40em){h5,.ontario-h5{font-size:1.1875rem;letter-spacing:0.025rem;line-height:1.5}}h6,.ontario-h6{font-size:1rem;line-height:1.56;letter-spacing:0.03rem;max-width:48rem;margin:0 0 0.75rem 0}@media screen and (min-width: 40em){h6,.ontario-h6{font-size:1rem;letter-spacing:0.025rem;line-height:1.5}}.ontario-lead-statement{font-size:1.25rem;line-height:1.6;max-width:70rem}@media screen and (min-width: 40em){.ontario-lead-statement{font-size:1.375rem}}html{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem}body{font-size:1rem;line-height:1.6;background-color:#FFFFFF;color:#1a1a1a;margin:0}p{font-size:inherit;margin-bottom:1.25rem;text-rendering:optimizeLegibility;margin:0 0 1.5rem 0}cite{font-style:italic;line-height:inherit}strong{font-weight:700;line-height:inherit}*,*::before,*::after{box-sizing:inherit}main p,main p:not(.ontario-lead-statement),main dd,main li{max-width:48rem}hr{border:0;padding:0;margin:2.5rem 0;border-bottom:4px solid #cccccc}hr.ontario-hr--dark{border-bottom:4px solid #1a1a1a}a{color:#0066CC;text-decoration:underline}a:visited{color:#551A8B}a:hover{color:#00478F}a:active{color:#002142}a:focus{-moz-box-shadow:0 0 0 4px #009ADB;-webkit-box-shadow:0 0 0 4px #009ADB;box-shadow:0 0 0 4px #009ADB;outline:4px solid transparent;transition:all 0.1s ease-in-out}​p{margin:0 0 1.5rem 0}​p+h1,p+h2,p+h3,p+h4,p+h5,p+h6,ul+h1,ul+h2,ul+h3,ul+h4,ul+h5,ul+h6,ol+h1,ol+h2,ol+h3,ol+h4,ol+h5,ol+h6,h1+h2,h2+h3,h3+h4,h4+h5,h5+h6{margin-top:2rem}p code,td code,li code{line-height:2.25rem}input[type=text],input[type=number],input[type=email],input[type=date],input[type=color],input[type=search],input[type=tel],textarea{background-origin:initial;height:auto;-webkit-appearance:none;-moz-appearance:none}input[type=checkbox]+label,input[type=radio]+label{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:400;margin-left:0;margin-right:0}fieldset{border:0;margin:0;padding:0;page-break-inside:avoid}legend,label{display:block;margin:0}select{background-origin:initial;height:auto;-webkit-appearance:none;-moz-appearance:none}ul,ol{padding:0}ul{margin-left:2rem}ul li{padding:0 0 0.75rem 0}ol{margin-left:1.75rem}ol li{padding:0 0 0.75rem 0.25rem}ul li:last-child,ol li:last-child{padding-bottom:0}ul[class*=columns-] li:last-child,ol[class*=columns-] li:last-child{padding-bottom:0.75rem}ul ul,ol ul{margin:0.5rem 0 0.5rem 2rem}ul ol,ol ol{margin:0.5rem 0 0.5rem 1.75rem}p+ul,p+ol{margin-top:-0.75rem}@media screen and (min-width: 40em){ul{margin:0.5rem 0 1.5rem 3rem}ol{margin:0.5rem 0 1.5rem 2.75rem}ul ul,ol ul{margin:0.5rem 0 0.5rem 3rem}ul ol,ol ol{margin:0.5rem 0 0.5rem 2.75rem}}.ontario-form-group:last-of-type{margin-bottom:2.5rem}.ontario-form-group:last-of-type{margin-bottom:3rem}.ontario-fieldset__legend{color:#1a1a1a;font-family:"Raleway Modified", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1.1875rem;font-weight:700;margin:0 0 1rem 0;line-height:1.5;max-width:38.75em;white-space:normal;width:100%;hyphens:auto}@media screen and (max-width: 40em){.ontario-fieldset__legend{font-size:1.125rem;line-height:1.56}}.ontario-fieldset__legend--large,.ontario-fieldset__legend--heading{letter-spacing:0.02rem;line-height:1.2}.ontario-fieldset__legend--large h1,.ontario-fieldset__legend--heading h1{display:inline-block;margin:0}@media screen and (max-width: 40em){.ontario-fieldset__legend--large,.ontario-fieldset__legend--heading{font-size:1.4375rem;line-height:1.39}}.ontario-fieldset__legend--large{font-size:1.75rem}.ontario-fieldset__legend-required-flag,.ontario-fieldset__legend-optional-flag{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:400}.ontario-fieldset__legend-required-flag:before,.ontario-fieldset__legend-optional-flag:before{content:" "}.ontario-label__flag{font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:400}.ontario-label__flag:before{content:" "}.ontario-hide{display:none !important}.ontario-invisible{visibility:hidden !important}@media screen and (max-width: 39.99875em){.ontario-hide-for-small-only{display:none !important}}@media screen and (max-width: 0em), screen and (min-width: 40em){.ontario-show-for-small-only{display:none !important}}@media print, screen and (min-width: 40em){.ontario-hide-for-medium{display:none !important}}@media screen and (max-width: 39.99875em){.ontario-show-for-medium{display:none !important}}@media screen and (min-width: 40em) and (max-width: 72.99875em){.ontario-hide-for-medium-only{display:none !important}}@media screen and (max-width: 39.99875em), screen and (min-width: 73em){.ontario-show-for-medium-only{display:none !important}}@media print, screen and (min-width: 73em){.ontario-hide-for-large{display:none !important}}@media screen and (max-width: 72.99875em){.ontario-show-for-large{display:none !important}}@media screen and (min-width: 73em) and (max-width: 95.99875em){.ontario-hide-for-large-only{display:none !important}}@media screen and (max-width: 72.99875em), screen and (min-width: 96em){.ontario-show-for-large-only{display:none !important}}.ontario-show-for-sr,.ontario-show-on-focus{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0, 0, 0, 0)}.ontario-show-on-focus:active,.ontario-show-on-focus:focus{position:static;width:auto;height:auto;overflow:visible;clip:auto}.ontario-show-for-landscape,.ontario-hide-for-portrait{display:block !important}@media screen and (orientation: landscape){.ontario-show-for-landscape,.ontario-hide-for-portrait{display:block !important}}@media screen and (orientation: portrait){.ontario-show-for-landscape,.ontario-hide-for-portrait{display:none !important}}.ontario-hide-for-landscape,.ontario-show-for-portrait{display:none !important}@media screen and (orientation: landscape){.ontario-hide-for-landscape,.ontario-show-for-portrait{display:none !important}}@media screen and (orientation: portrait){.ontario-hide-for-landscape,.ontario-show-for-portrait{display:block !important}}.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}.ontario-error-messaging{display:flex;align-items:flex-start;margin:-0.25rem 0 0.5rem 0;color:#D81A21;max-width:48rem}.ontario-error-messaging__content{margin-left:0.5rem}.ontario-input__error{border-color:#D81A21 !important}.ontario-error__hidden{display:none}.ontario-radios__item{position:relative;display:block;margin:0 0 1rem;padding:0 2rem 0}.ontario-radios__item:last-of-type{margin-bottom:0}.ontario-radios__input{cursor:pointer;margin:0;position:absolute;opacity:0;top:-2px;left:-2px;width:36px;height:36px;z-index:0}@media screen and (max-width: 40em){.ontario-radios__input{width:40px;height:40px;top:-1.5px;left:-1.5px}}.ontario-radios__label{cursor:pointer;color:#1a1a1a;display:inline-block;font-family:"Raleway Modified", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;font-size:1rem;font-weight:700;line-height:1.5;margin:0.2rem 0;max-width:38.75em;padding:0 0.75rem;touch-action:manipulation;white-space:normal;width:auto;white-space:normal}@media screen and (max-width: 40em){.ontario-radios__label{margin:0.3rem 0;padding:0 1rem}}.ontario-radios__label:before{content:"";border:2px solid #1a1a1a;border-radius:50%;box-sizing:border-box;position:absolute;top:0;left:0;width:32px;height:32px;transition:border 0.1s ease-in-out}@media screen and (max-width: 40em){.ontario-radios__label:before{width:36px;height:36px}}.ontario-radios__label:after{content:"";border-radius:50%;border:10px solid #1a1a1a;position:absolute;top:0;left:0;transform:translate(6px, 6px);opacity:0}@media screen and (max-width: 40em){.ontario-radios__label:after{border:12px solid #1a1a1a}}.ontario-radios__input:focus+.ontario-radios__label:before{-moz-box-shadow:0 0 0 4px #009ADB;-webkit-box-shadow:#009ADB}.ontario-radios__input:checked+.ontario-radios__label:after{opacity:1}.ontario-radios__hint-expander{margin:0.75rem 0 0 0.5rem}@media screen and (max-width: 40em){.ontario-radios__hint-expander{margin-top:1rem}}';
 
 const OntarioRadioButtons$1 = /*@__PURE__*/ proxyCustomElement(
 	class OntarioRadioButtons extends H {
@@ -22,10 +21,10 @@ const OntarioRadioButtons$1 = /*@__PURE__*/ proxyCustomElement(
 			super();
 			this.__registerHost();
 			this.__attachShadow();
-			this.radioOnChange = createEvent(this, 'radioOnChange', 7);
-			this.radioOnBlur = createEvent(this, 'radioOnBlur', 7);
-			this.radioOnFocus = createEvent(this, 'radioOnFocus', 7);
-			this.inputErrorOccurred = createEvent(this, 'inputErrorOccurred', 7);
+			this.radioOnChange = createEvent(this, 'radioOnChange');
+			this.radioOnBlur = createEvent(this, 'radioOnBlur');
+			this.radioOnFocus = createEvent(this, 'radioOnFocus');
+			this.inputErrorOccurred = createEvent(this, 'inputErrorOccurred');
 			this.internals = this.attachInternals();
 		}
 		get element() {
@@ -359,29 +358,29 @@ const OntarioRadioButtons$1 = /*@__PURE__*/ proxyCustomElement(
 			return h(
 				'div',
 				{
-					key: 'a72d3814a73c41fe295bbe7267a57e4de4f09c6f',
+					key: 'ba478aa73f71d17fba7f1a403f4758f6853b220b',
 					class: `ontario-form-group ${error ? 'ontario-input--error' : ''}`,
 				},
 				h(
 					'fieldset',
 					{
-						'key': 'b3a4bf7f2e8351107125ccf3aaac96f088dea4d6',
+						'key': 'cae7a78b9c05a3b69b9af229e5c3ba1e4328b340',
 						'class': 'ontario-fieldset',
 						'aria-describedby': this.hintTextId,
 					},
 					this.captionState.getCaption(undefined, !!this.internalHintExpander),
 					this.internalHintText &&
 						h('ontario-hint-text', {
-							key: '4a59f75d053edd397eeeb7f0f75b8d301c872e8c',
+							key: '122c784ca3b0219b6478b443cabc258d13ab3e7c',
 							hint: this.internalHintText.hint,
 							hintContentType: this.internalHintText.hintContentType,
 							ref: (el) => (this.hintTextRef = el),
 						}),
 					h(
 						'div',
-						{ key: 'f38ba7f77cc5bb712529d10df095c13affa90f4e', class: 'ontario-radios' },
+						{ key: '1580f017c32064bc1ec65cb21a28aa3e253c2fdd', class: 'ontario-radios' },
 						h(ErrorMessage, {
-							key: '1d48ccc837cde3c9687b6f8f357b52a452d2fbba',
+							key: 'd3c602b449e84c5d9b21836378835552fdeba767',
 							message: this.errorMessage,
 							error: error,
 						}),
@@ -424,9 +423,9 @@ const OntarioRadioButtons$1 = /*@__PURE__*/ proxyCustomElement(
 						this.internalHintExpander &&
 							h(
 								'div',
-								{ key: '7474fc0072c87dd627f576fb4b1ed92078ac9d40', class: 'ontario-radios__hint-expander' },
+								{ key: '6cd63cae4be79a78c328c13288d348537c8551ad', class: 'ontario-radios__hint-expander' },
 								h('ontario-hint-expander', {
-									'key': '29777790764d03b3a8a6fd2c2b50c196f520e939',
+									'key': 'e9abb0ecb680b50283438469d1425293e3a80440',
 									'hint': this.internalHintExpander.hint,
 									'content': this.internalHintExpander.content,
 									'hintContentType': this.internalHintExpander.hintContentType,
@@ -452,7 +451,7 @@ const OntarioRadioButtons$1 = /*@__PURE__*/ proxyCustomElement(
 			};
 		}
 		static get style() {
-			return OntarioRadioButtonsStyle0;
+			return ontarioRadioButtonsCss;
 		}
 	},
 	[
@@ -467,9 +466,9 @@ const OntarioRadioButtons$1 = /*@__PURE__*/ proxyCustomElement(
 			required: [4],
 			options: [1],
 			errorMessage: [1025, 'error-message'],
-			customOnChange: [16],
-			customOnBlur: [16],
-			customOnFocus: [16],
+			customOnChange: [16, 'custom-on-change'],
+			customOnBlur: [16, 'custom-on-blur'],
+			customOnFocus: [16, 'custom-on-focus'],
 			hintTextId: [32],
 			internalHintText: [32],
 			internalHintExpander: [32],
@@ -543,5 +542,6 @@ const OntarioRadioButtons = OntarioRadioButtons$1;
 const defineCustomElement = defineCustomElement$1;
 
 export { OntarioRadioButtons, defineCustomElement };
+//# sourceMappingURL=ontario-radio-buttons.js.map
 
 //# sourceMappingURL=ontario-radio-buttons.js.map

package/dist/components/ontario-radio-buttons.js.map

@@ -1 +1 @@
-{"file":"ontario-radio-buttons.js","mappings":"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","names":["OntarioRadioButtons"],"sources":["src/components/ontario-radio-buttons/ontario-radio-buttons.scss?tag=ontario-radio-buttons&encapsulation=shadow","src/components/ontario-radio-buttons/ontario-radio-buttons.tsx"],"sourcesContent":["@use 'sass:math';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/global.variables' as globalVariables;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/spacing.variables' as spacing;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/breakpoints.variables' as breakpoints;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/fonts.variables' as fonts;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/z-index.variables' as zIndex;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/font-sizes.variables' as fontSizes;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/line-heights.variables' as lineheight;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/font-weights.variables' as fontWeights;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/placeholder/focus.placeholders' as\n\tplaceholders;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/4-elements/_global.elements.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/6-components/_form.component.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/7-overrides/_visibility.overrides.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/6-components/_text-inputs.component.scss';\n@forward '../../utils/components/error-message/error-message';\n\n$ontario-radios-size: 32px;\n$ontario-radios-size-mobile: 36px;\n$ontario-input-offset: math.div((globalVariables.$touch-target-size - $ontario-radios-size), 2);\n\n.ontario-radios__item {\n\tposition: relative;\n\tdisplay: block;\n\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-4;\n\tpadding: spacing.$spacing-0 spacing.$spacing-6 spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tmargin-bottom: spacing.$spacing-0;\n\t}\n}\n\n.ontario-radios__input {\n\tcursor: pointer;\n\tmargin: spacing.$spacing-0;\n\tposition: absolute;\n\topacity: 0;\n\ttop: $ontario-input-offset * -1;\n\tleft: $ontario-input-offset * -1;\n\twidth: globalVariables.$touch-target-size;\n\theight: globalVariables.$touch-target-size;\n\tz-index: zIndex.$ontario-z-index-neutral;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\twidth: globalVariables.$touch-target-size-mobile;\n\t\theight: globalVariables.$touch-target-size-mobile;\n\t\ttop: $ontario-input-offset * -0.75;\n\t\tleft: $ontario-input-offset * -0.75;\n\t}\n}\n\n.ontario-radios__label {\n\tcursor: pointer;\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: inline-block;\n\tfont-family: fonts.$ontario-font-raleway;\n\tfont-size: fontSizes.$ontario-font-size-standard-body-text;\n\tfont-weight: fontWeights.$ontario-font-weights-bold;\n\tline-height: globalVariables.$line-height-default;\n\t// Specific spacing required in order to visually align label with input\n\tmargin: 0.2rem 0;\n\tmax-width: globalVariables.$narrow-width;\n\tpadding: spacing.$spacing-0 spacing.$spacing-3;\n\t// remove 300ms pause on mobile\n\ttouch-action: manipulation;\n\twhite-space: normal;\n\twidth: auto;\n\twhite-space: normal;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\t// Specific spacing required in order to visually align label with input\n\t\tmargin: 0.3rem spacing.$spacing-0;\n\t\tpadding: spacing.$spacing-0 spacing.$spacing-4;\n\t}\n\n\t&:before {\n\t\tcontent: '';\n\t\tborder: globalVariables.$border-size-standard solid colours.$ontario-colour-black;\n\t\tborder-radius: 50%;\n\t\tbox-sizing: border-box;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\twidth: $ontario-radios-size;\n\t\theight: $ontario-radios-size;\n\t\ttransition: border 0.1s ease-in-out;\n\n\t\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\t\twidth: $ontario-radios-size-mobile;\n\t\t\theight: $ontario-radios-size-mobile;\n\t\t}\n\t}\n\n\t&:after {\n\t\tcontent: '';\n\t\tborder-radius: 50%;\n\t\tborder: 10px solid colours.$ontario-colour-black;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\ttransform: translate($ontario-input-offset * 3, $ontario-input-offset * 3);\n\t\topacity: 0;\n\n\t\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\t\tborder: 12px solid colours.$ontario-colour-black;\n\t\t}\n\t}\n}\n\n.ontario-radios__input:focus + .ontario-radios__label:before {\n\t-moz-box-shadow: placeholders.$ontario-focus-box-shadow;\n\t-webkit-box-shadow: colours.$ontario-colour-focus;\n\t@extend %ontario-focus;\n}\n\n.ontario-radios__input:checked + .ontario-radios__label:after {\n\topacity: 1;\n}\n\n.ontario-radios__hint-expander {\n\tmargin: spacing.$spacing-3 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-2;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\tmargin-top: spacing.$spacing-4;\n\t}\n}\n","import { Component, h, Prop, State, Event, Listen, Watch, Element, EventEmitter, AttachInternals } from '@stencil/core';\nimport { RadioButtons } from './radio-buttons.interface';\nimport { RadioOption } from './radio-option.interface';\n\nimport { Input } from '../../utils/common/input/input';\nimport { Hint } from '../../utils/common/common.interface';\nimport { InputCaption } from '../../utils/common/input-caption/input-caption';\nimport { Caption } from '../../utils/common/input-caption/caption.interface';\nimport { HintExpander } from '../ontario-hint-expander/hint-expander.interface';\nimport {\n\tvalidateObjectExists,\n\tvalidatePropExists,\n\tvalidateLanguage,\n} from '../../utils/validation/validation-functions';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { Language } from '../../utils/common/language-types';\nimport { constructHintTextObject } from '../../utils/components/hints/hints';\nimport {\n\tInputFocusBlurEvent,\n\tRadioAndCheckboxChangeEvent,\n\tEventType,\n} from '../../utils/events/event-handler.interface';\nimport { handleInputEvent } from '../../utils/events/event-handler';\n\nimport { default as translations } from '../../translations/global.i18n.json';\nimport { ErrorMessage } from '../../utils/components/error-message/error-message';\n\n@Component({\n\ttag: 'ontario-radio-buttons',\n\tstyleUrl: 'ontario-radio-buttons.scss',\n\tshadow: true,\n\tformAssociated: true,\n})\nexport class OntarioRadioButtons implements RadioButtons {\n\t@Element() element: HTMLElement;\n\t@AttachInternals() internals: ElementInternals;\n\n\thintTextRef: HTMLOntarioHintTextElement | undefined;\n\n\t/**\n\t * The text to display for the radio button legend.\n\t *\n\t * @example\n\t * <ontario-radio-buttons\n\t *   caption='{\n\t *     \"captionText\": \"Radio legend\",\n\t *     \"captionType\": \"heading\",\n\t *    }'\n\t *   required=\"true\"\n\t *   ...>\n\t * </ontario-radio-buttons>\n\t */\n\t@Prop() caption: Caption | string;\n\t/**\n\t * The language of the component.\n\t * This is used for translations, and is by default set through event listeners checking for a language property from the header. If no language is passed, it will default to English.\n\t */\n\t@Prop({ mutable: true }) language?: Language;\n\n\t/**\n\t * The name assigned to the radio button. The name value is used to reference form data after a form is submitted.\n\t */\n\t@Prop() name: string;\n\n\t/**\n\t * Used to include the ontario-hint-text component for radio button group.\n\t * This is optional.\n\t */\n\t@Prop() hintText?: string | Hint;\n\n\t/**\n\t * Used to include the ontario-hint-expander component for the radio button group.\n\t * This is passed in as an object with key-value pairs.\n\t *\n\t * This is optional.\n\t *\n\t * @example\n\t * <ontario-radio-buttons\n\t *   caption='{\n\t *     \"captionText\": \"Radio legend\",\n\t *     \"captionType\": \"heading\",\n\t *   }'\n\t * \t name=\"radios\"\n\t *   options='[\n\t * \t   {\n\t *        \"value\": \"radio-option-1\",\n\t * \t\t  \"elementId\": \"radio-1\",\n\t *        \"label\": \"Radio option 1 label\",\n\t *        \"hintExpander\": {\n\t *\t\t\t  \"hint\": \"Hint expander for radio option 1\",\n\t * \t\t      \"content\": \"Example hint expander content for radio option 1.\"\n\t *\t\t  }\n\t *     }\n\t *   ]'\n\t *   hint-expander='{\n\t *     \"hint\": \"Hint expander for the radio button group\",\n\t *     \"content\": \"Example hint expander content for the radio button group.\"\n\t *   }'\n\t *   required=\"true\"\n\t * >\n\t * </ontario-radio-buttons>\n\t */\n\t@Prop() hintExpander?: HintExpander | string;\n\n\t/**\n\t * This is used to determine whether the radio button is required or not.\n\t * This prop also gets passed to the InputCaption utility to display either an optional or required flag in the label.\n\t * If no prop is set, it will default to false (optional).\n\t */\n\t@Prop() required?: boolean = false;\n\n\t/**\n\t * The options for the radio button group.\n\t *\n\t * Each property will be passed in through an object in the options array.\n\t * This can either be passed in as an object directly (if using react), or as a string in HTML.\n\t * If there are multiple radio buttons in a group, each radio button will be displayed as an option.\n\t *\n\t * In the example below, the options are being passed in as a string and there are two radio buttons to be displayed in the group.\n\t *\n\t * @example\n\t * <ontario-radio-buttons\n\t *   caption='{\n\t *     \"captionText\": \"Radio legend\",\n\t *     \"captionType\": \"heading\",\n\t *   }'\n\t *   name=\"radios\"\n\t *   hint-text=\"Hint text for the radio button group.\"\n\t *   options='[\n\t *     {\n\t *        \"value\": \"radio-option-1\",\n\t * \t\t  \"elementId\": \"radio-1\",\n\t *        \"label\": \"Radio option 1 label\"\n\t *     },\n\t *     {\n\t *        \"value\": \"radio-option-2\",\n\t * \t\t  \"elementId\": \"radio-2\",\n\t *        \"label\": \"Radio option 2 label\",\n\t *        \"hintExpander\": {\n\t *\t\t\t  \"hint\": \"Hint expander for radio option 2\",\n\t * \t\t      \"content\": \"Example hint expander content for radio option 2.\"\n\t *\t\t  }\n\t *      }\n\t *   ]'\n\t *   required=\"true\"\n\t * >\n\t * </ontario-radio-buttons>\n\t */\n\t@Prop() options: string | RadioOption[];\n\n\t/**\n\t * Set this to display an error message\n\t */\n\t@Prop({ mutable: true }) errorMessage?: string;\n\n\t/**\n\t * Used to add a custom function to the radio input onChange event.\n\t */\n\t@Prop() customOnChange?: (event: globalThis.Event) => void;\n\n\t/**\n\t * Used to add a custom function to the radio input onBlur event.\n\t */\n\t@Prop() customOnBlur?: (event: globalThis.Event) => void;\n\n\t/**\n\t * Used to add a custom function to the radio input onFocus event.\n\t */\n\t@Prop() customOnFocus?: (event: globalThis.Event) => void;\n\n\t/**\n\t * Used for the `aria-describedby` value of the radio button group. This will match with the id of the hint text.\n\t */\n\t@State() hintTextId: string | null | undefined;\n\n\t/**\n\t * The hint text options are re-assigned to the internalHintText array.\n\t */\n\t@State() private internalHintText: Hint;\n\n\t/**\n\t * The hint expander options are re-assigned to the internalHintExpander array.\n\t */\n\t@State() private internalHintExpander: HintExpander;\n\n\t/**\n\t * The options are re-assigned to the internalOptions array.\n\t */\n\t@State() private internalOptions: RadioOption[];\n\n\t/**\n\t * Instantiate an InputCaption object for internal logic use\n\t */\n\t@State() private captionState: InputCaption;\n\n\t/**\n\t * Emitted when a keyboard input or mouse event occurs when a radio option has been changed.\n\t */\n\t@Event({ eventName: 'radioOnChange' }) radioOnChange: EventEmitter<RadioAndCheckboxChangeEvent>;\n\n\t/**\n\t * Emitted when a keyboard input event occurs when a radio option has lost focus.\n\t */\n\t@Event({ eventName: 'radioOnBlur' }) radioOnBlur: EventEmitter<InputFocusBlurEvent>;\n\n\t/**\n\t * Emitted when a keyboard input event occurs when a radio option has gained focus.\n\t */\n\t@Event({ eventName: 'radioOnFocus' }) radioOnFocus: EventEmitter<InputFocusBlurEvent>;\n\n\t/**\n\t * Emitted when an error message is reported to the component.\n\t */\n\t@Event() inputErrorOccurred: EventEmitter<{ errorMessage: string }>;\n\n\t/**\n\t * This listens for the `setAppLanguage` event sent from the test language toggler when it is is connected to the DOM. It is used for the initial language when the input component loads.\n\t */\n\t@Listen('setAppLanguage', { target: 'window' })\n\thandleSetAppLanguage(event: CustomEvent<Language>) {\n\t\tif (!this.language) {\n\t\t\tthis.language = validateLanguage(event);\n\t\t}\n\t}\n\n\t@Listen('headerLanguageToggled', { target: 'window' })\n\thandleHeaderLanguageToggled(event: CustomEvent<Language>) {\n\t\tthis.language = validateLanguage(event);\n\t}\n\n\t/**\n\t * Watch for changes to the `hintText` prop.\n\t *\n\t * If a `hintText` prop is passed, the `constructHintTextObject` function will convert it to the correct format, and set the result to the `internalHintText` state.\n\t */\n\t@Watch('hintText')\n\tprivate parseHintText() {\n\t\tif (this.hintText) {\n\t\t\tconst hintTextObject = constructHintTextObject(this.hintText);\n\t\t\tthis.internalHintText = hintTextObject;\n\t\t}\n\t}\n\n\t/**\n\t * Watch for changes to the `hintExpander` prop.\n\t *\n\t * If a `hintExpander` prop is passed, it will be parsed (if it is a string), and the result will be set to the `internalHintExpander` state.\n\t */\n\t@Watch('hintExpander')\n\tprivate parseHintExpander() {\n\t\tconst hintExpander = this.hintExpander;\n\t\tif (hintExpander) {\n\t\t\tif (typeof hintExpander === 'string') this.internalHintExpander = JSON.parse(hintExpander);\n\t\t\telse this.internalHintExpander = hintExpander;\n\t\t}\n\t}\n\n\t/**\n\t * Watch for changes to the `options` prop.\n\t *\n\t * If an `options` prop is passed, it will be parsed (if it is a string), and the result will be set to the `internalOptions` state. The result will be run through a validation function.\n\t */\n\t@Watch('options')\n\tparseOptions() {\n\t\tif (typeof this.options !== 'undefined') {\n\t\t\tif (!Array.isArray(this.options)) {\n\t\t\t\tthis.internalOptions = JSON.parse(this.options);\n\t\t\t} else {\n\t\t\t\tthis.internalOptions = this.options;\n\t\t\t}\n\t\t}\n\t}\n\n\t/*\n\t * Watch for changes in the `name` prop for validation purposes.\n\t *\n\t * Validate the `name` and make sure the `name` prop has a value.\n\t * Log a warning if user doesn't input a value for the `name`.\n\t */\n\t@Watch('name')\n\tvalidateName(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(' name ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-radio-buttons> ')\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 * Watch for changes in the `options` prop for validation purposes.\n\n\t * Validate the `options` and make sure the `options` prop has a value.\n\t * Log a warning if user doesn't input a value for the `options`.\n\t */\n\t@Watch('options')\n\tvalidateOptions(newValue: object) {\n\t\tif (validateObjectExists(newValue)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' options ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-radio-buttons> ')\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 * Watch for changes to the `caption` prop.\n\t *\n\t * The caption will be run through the InputCaption constructor to convert it to the correct format, and set the result to the `captionState` state.\n\t * @param newValue: Caption | string\n\t */\n\t@Watch('caption')\n\tupdateCaptionState(newValue: Caption | string) {\n\t\tthis.captionState = new InputCaption(\n\t\t\tthis.element.tagName,\n\t\t\tnewValue,\n\t\t\ttranslations,\n\t\t\tthis.language,\n\t\t\ttrue,\n\t\t\tthis.required,\n\t\t);\n\t}\n\n\t/**\n\t * Watch for changes to the `language` prop to render either the English or French translations\n\t */\n\t@Watch('language')\n\tupdateLanguage() {\n\t\tthis.updateCaptionState(this.caption);\n\t}\n\n\t@Watch('errorMessage')\n\tbroadcastInputErrorOccurredEvent() {\n\t\t// Emit event to notify anyone who wants to listen for errors occurring\n\t\tthis.inputErrorOccurred.emit({ errorMessage: this.errorMessage ?? '' });\n\t}\n\n\t/**\n\t * Function to handle radio buttons events and the information pertaining to the radio buttons to emit.\n\t */\n\tprivate handleEvent(event: Event, eventType: EventType) {\n\t\tconst input = event.target as HTMLInputElement | null;\n\n\t\t// Reset all internalOptions checked states\n\t\tconst changedOption = this.internalOptions\n\t\t\t.map((x) => {\n\t\t\t\tx.checked = false;\n\t\t\t\treturn x;\n\t\t\t})\n\t\t\t.find((x) => x.value === input?.value);\n\t\t// Set the new checked state for the selected value\n\t\tif (changedOption) changedOption.checked = !changedOption?.checked;\n\n\t\t// Set the value within the form\n\t\tthis.internals?.setFormValue?.(\n\t\t\tthis.internalOptions\n\t\t\t\t.filter((x) => !!x.checked)\n\t\t\t\t.reduce((formData, currentValue) => {\n\t\t\t\t\tformData.append(this.name, currentValue.value);\n\t\t\t\t\treturn formData;\n\t\t\t\t}, new FormData()),\n\t\t);\n\n\t\thandleInputEvent(\n\t\t\tevent,\n\t\t\teventType,\n\t\t\tinput,\n\t\t\tthis.radioOnChange,\n\t\t\tthis.radioOnFocus,\n\t\t\tthis.radioOnBlur,\n\t\t\tundefined,\n\t\t\t'radio',\n\t\t\tthis.customOnChange,\n\t\t\tthis.customOnFocus,\n\t\t\tthis.customOnBlur,\n\t\t\tundefined,\n\t\t\tthis.element,\n\t\t);\n\t}\n\n\t/**\n\t * If a `hintText` prop is passed, the id generated from it will be set to the internal `hintTextId` state to match with the fieldset `aria-describedBy` attribute.\n\t */\n\tasync componentDidLoad() {\n\t\tthis.hintTextId = await this.hintTextRef?.getHintTextId();\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.updateCaptionState(this.caption);\n\t\tthis.parseOptions();\n\t\tthis.parseHintText();\n\t\tthis.parseHintExpander();\n\t\tthis.validateName(this.name);\n\t\tthis.validateOptions(this.internalOptions);\n\t\tthis.language = validateLanguage(this.language);\n\t}\n\n\trender() {\n\t\tconst error = !!this.errorMessage;\n\t\treturn (\n\t\t\t<div class={`ontario-form-group ${error ? 'ontario-input--error' : ''}`}>\n\t\t\t\t<fieldset class=\"ontario-fieldset\" aria-describedby={this.hintTextId}>\n\t\t\t\t\t{this.captionState.getCaption(undefined, !!this.internalHintExpander)}\n\t\t\t\t\t{this.internalHintText && (\n\t\t\t\t\t\t<ontario-hint-text\n\t\t\t\t\t\t\thint={this.internalHintText.hint}\n\t\t\t\t\t\t\thintContentType={this.internalHintText.hintContentType}\n\t\t\t\t\t\t\tref={(el) => (this.hintTextRef = el)}\n\t\t\t\t\t\t></ontario-hint-text>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div class=\"ontario-radios\">\n\t\t\t\t\t\t<ErrorMessage message={this.errorMessage} error={error} />\n\t\t\t\t\t\t{this.internalOptions?.map((radioOption) => (\n\t\t\t\t\t\t\t<div class=\"ontario-radios__item\">\n\t\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\t\tclassName=\"ontario-radios__input\"\n\t\t\t\t\t\t\t\t\tid={radioOption.elementId}\n\t\t\t\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\tvalue={radioOption.value}\n\t\t\t\t\t\t\t\t\trequired={!!this.required}\n\t\t\t\t\t\t\t\t\tchecked={!!radioOption.checked}\n\t\t\t\t\t\t\t\t\tonChange={(e) => this.handleEvent(e, EventType.Change)}\n\t\t\t\t\t\t\t\t\tonBlur={(e) => this.handleEvent(e, EventType.Blur)}\n\t\t\t\t\t\t\t\t\tonFocus={(e) => this.handleEvent(e, EventType.Focus)}\n\t\t\t\t\t\t\t\t></Input>\n\t\t\t\t\t\t\t\t<label class=\"ontario-radios__label\" htmlFor={radioOption.elementId}>\n\t\t\t\t\t\t\t\t\t{radioOption.label}\n\t\t\t\t\t\t\t\t\t{radioOption.hintExpander &&\n\t\t\t\t\t\t\t\t\t\tthis.captionState.getHintExpanderAccessibilityText(radioOption.label, true)}\n\t\t\t\t\t\t\t\t</label>\n\n\t\t\t\t\t\t\t\t{radioOption.hintExpander && (\n\t\t\t\t\t\t\t\t\t<div class=\"ontario-radios__hint-expander\">\n\t\t\t\t\t\t\t\t\t\t<ontario-hint-expander\n\t\t\t\t\t\t\t\t\t\t\thint={radioOption.hintExpander.hint}\n\t\t\t\t\t\t\t\t\t\t\tcontent={radioOption.hintExpander.content}\n\t\t\t\t\t\t\t\t\t\t\thintContentType={radioOption.hintExpander.hintContentType}\n\t\t\t\t\t\t\t\t\t\t\tinput-exists\n\t\t\t\t\t\t\t\t\t\t></ontario-hint-expander>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\n\t\t\t\t\t\t{this.internalHintExpander && (\n\t\t\t\t\t\t\t<div class=\"ontario-radios__hint-expander\">\n\t\t\t\t\t\t\t\t<ontario-hint-expander\n\t\t\t\t\t\t\t\t\thint={this.internalHintExpander.hint}\n\t\t\t\t\t\t\t\t\tcontent={this.internalHintExpander.content}\n\t\t\t\t\t\t\t\t\thintContentType={this.internalHintExpander.hintContentType}\n\t\t\t\t\t\t\t\t\tinput-exists\n\t\t\t\t\t\t\t\t></ontario-hint-expander>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</fieldset>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"],"version":3}
+{"file":"ontario-radio-buttons.js","mappings":"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","names":["OntarioRadioButtons","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ontario-radio-buttons/ontario-radio-buttons.scss?tag=ontario-radio-buttons&encapsulation=shadow","src/components/ontario-radio-buttons/ontario-radio-buttons.tsx"],"sourcesContent":["@use 'sass:math';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/global.variables' as globalVariables;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/spacing.variables' as spacing;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/breakpoints.variables' as breakpoints;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/fonts.variables' as fonts;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/z-index.variables' as zIndex;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/font-sizes.variables' as fontSizes;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/line-heights.variables' as lineheight;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/font-weights.variables' as fontWeights;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/placeholder/focus.placeholders' as\n\tplaceholders;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/4-elements/_global.elements.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/6-components/_form.component.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/7-overrides/_visibility.overrides.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/6-components/_text-inputs.component.scss';\n@forward '../../utils/components/error-message/error-message';\n\n$ontario-radios-size: 32px;\n$ontario-radios-size-mobile: 36px;\n$ontario-input-offset: math.div((globalVariables.$touch-target-size - $ontario-radios-size), 2);\n\n.ontario-radios__item {\n\tposition: relative;\n\tdisplay: block;\n\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-4;\n\tpadding: spacing.$spacing-0 spacing.$spacing-6 spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tmargin-bottom: spacing.$spacing-0;\n\t}\n}\n\n.ontario-radios__input {\n\tcursor: pointer;\n\tmargin: spacing.$spacing-0;\n\tposition: absolute;\n\topacity: 0;\n\ttop: $ontario-input-offset * -1;\n\tleft: $ontario-input-offset * -1;\n\twidth: globalVariables.$touch-target-size;\n\theight: globalVariables.$touch-target-size;\n\tz-index: zIndex.$ontario-z-index-neutral;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\twidth: globalVariables.$touch-target-size-mobile;\n\t\theight: globalVariables.$touch-target-size-mobile;\n\t\ttop: $ontario-input-offset * -0.75;\n\t\tleft: $ontario-input-offset * -0.75;\n\t}\n}\n\n.ontario-radios__label {\n\tcursor: pointer;\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: inline-block;\n\tfont-family: fonts.$ontario-font-raleway-modified;\n\tfont-size: fontSizes.$ontario-font-size-standard-body-text;\n\tfont-weight: fontWeights.$ontario-font-weights-bold;\n\tline-height: globalVariables.$line-height-default;\n\t// Specific spacing required in order to visually align label with input\n\tmargin: 0.2rem 0;\n\tmax-width: globalVariables.$narrow-width;\n\tpadding: spacing.$spacing-0 spacing.$spacing-3;\n\t// remove 300ms pause on mobile\n\ttouch-action: manipulation;\n\twhite-space: normal;\n\twidth: auto;\n\twhite-space: normal;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\t// Specific spacing required in order to visually align label with input\n\t\tmargin: 0.3rem spacing.$spacing-0;\n\t\tpadding: spacing.$spacing-0 spacing.$spacing-4;\n\t}\n\n\t&:before {\n\t\tcontent: '';\n\t\tborder: globalVariables.$border-size-standard solid colours.$ontario-colour-black;\n\t\tborder-radius: 50%;\n\t\tbox-sizing: border-box;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\twidth: $ontario-radios-size;\n\t\theight: $ontario-radios-size;\n\t\ttransition: border 0.1s ease-in-out;\n\n\t\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\t\twidth: $ontario-radios-size-mobile;\n\t\t\theight: $ontario-radios-size-mobile;\n\t\t}\n\t}\n\n\t&:after {\n\t\tcontent: '';\n\t\tborder-radius: 50%;\n\t\tborder: 10px solid colours.$ontario-colour-black;\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 0;\n\t\ttransform: translate($ontario-input-offset * 3, $ontario-input-offset * 3);\n\t\topacity: 0;\n\n\t\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\t\tborder: 12px solid colours.$ontario-colour-black;\n\t\t}\n\t}\n}\n\n.ontario-radios__input:focus + .ontario-radios__label:before {\n\t-moz-box-shadow: placeholders.$ontario-focus-box-shadow;\n\t-webkit-box-shadow: colours.$ontario-colour-focus;\n\t@extend %ontario-focus;\n}\n\n.ontario-radios__input:checked + .ontario-radios__label:after {\n\topacity: 1;\n}\n\n.ontario-radios__hint-expander {\n\tmargin: spacing.$spacing-3 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-2;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\tmargin-top: spacing.$spacing-4;\n\t}\n}\n","import { Component, h, Prop, State, Event, Listen, Watch, Element, EventEmitter, AttachInternals } from '@stencil/core';\nimport { RadioButtons } from './radio-buttons.interface';\nimport { RadioOption } from './radio-option.interface';\n\nimport { Input } from '../../utils/common/input/input';\nimport { Hint } from '../../utils/common/common.interface';\nimport { InputCaption } from '../../utils/common/input-caption/input-caption';\nimport { Caption } from '../../utils/common/input-caption/caption.interface';\nimport { HintExpander } from '../ontario-hint-expander/hint-expander.interface';\nimport {\n\tvalidateObjectExists,\n\tvalidatePropExists,\n\tvalidateLanguage,\n} from '../../utils/validation/validation-functions';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { Language } from '../../utils/common/language-types';\nimport { constructHintTextObject } from '../../utils/components/hints/hints';\nimport {\n\tInputFocusBlurEvent,\n\tRadioAndCheckboxChangeEvent,\n\tEventType,\n} from '../../utils/events/event-handler.interface';\nimport { handleInputEvent } from '../../utils/events/event-handler';\n\nimport { default as translations } from '../../translations/global.i18n.json';\nimport { ErrorMessage } from '../../utils/components/error-message/error-message';\n\n@Component({\n\ttag: 'ontario-radio-buttons',\n\tstyleUrl: 'ontario-radio-buttons.scss',\n\tshadow: true,\n\tformAssociated: true,\n})\nexport class OntarioRadioButtons implements RadioButtons {\n\t@Element() element: HTMLElement;\n\t@AttachInternals() internals: ElementInternals;\n\n\thintTextRef: HTMLOntarioHintTextElement | undefined;\n\n\t/**\n\t * The text to display for the radio button legend.\n\t *\n\t * @example\n\t * <ontario-radio-buttons\n\t *   caption='{\n\t *     \"captionText\": \"Radio legend\",\n\t *     \"captionType\": \"heading\",\n\t *    }'\n\t *   required=\"true\"\n\t *   ...>\n\t * </ontario-radio-buttons>\n\t */\n\t@Prop() caption: Caption | string;\n\t/**\n\t * The language of the component.\n\t * This is used for translations, and is by default set through event listeners checking for a language property from the header. If no language is passed, it will default to English.\n\t */\n\t@Prop({ mutable: true }) language?: Language;\n\n\t/**\n\t * The name assigned to the radio button. The name value is used to reference form data after a form is submitted.\n\t */\n\t@Prop() name: string;\n\n\t/**\n\t * Used to include the ontario-hint-text component for radio button group.\n\t * This is optional.\n\t */\n\t@Prop() hintText?: string | Hint;\n\n\t/**\n\t * Used to include the ontario-hint-expander component for the radio button group.\n\t * This is passed in as an object with key-value pairs.\n\t *\n\t * This is optional.\n\t *\n\t * @example\n\t * <ontario-radio-buttons\n\t *   caption='{\n\t *     \"captionText\": \"Radio legend\",\n\t *     \"captionType\": \"heading\",\n\t *   }'\n\t * \t name=\"radios\"\n\t *   options='[\n\t * \t   {\n\t *        \"value\": \"radio-option-1\",\n\t * \t\t  \"elementId\": \"radio-1\",\n\t *        \"label\": \"Radio option 1 label\",\n\t *        \"hintExpander\": {\n\t *\t\t\t  \"hint\": \"Hint expander for radio option 1\",\n\t * \t\t      \"content\": \"Example hint expander content for radio option 1.\"\n\t *\t\t  }\n\t *     }\n\t *   ]'\n\t *   hint-expander='{\n\t *     \"hint\": \"Hint expander for the radio button group\",\n\t *     \"content\": \"Example hint expander content for the radio button group.\"\n\t *   }'\n\t *   required=\"true\"\n\t * >\n\t * </ontario-radio-buttons>\n\t */\n\t@Prop() hintExpander?: HintExpander | string;\n\n\t/**\n\t * This is used to determine whether the radio button is required or not.\n\t * This prop also gets passed to the InputCaption utility to display either an optional or required flag in the label.\n\t * If no prop is set, it will default to false (optional).\n\t */\n\t@Prop() required?: boolean = false;\n\n\t/**\n\t * The options for the radio button group.\n\t *\n\t * Each property will be passed in through an object in the options array.\n\t * This can either be passed in as an object directly (if using react), or as a string in HTML.\n\t * If there are multiple radio buttons in a group, each radio button will be displayed as an option.\n\t *\n\t * In the example below, the options are being passed in as a string and there are two radio buttons to be displayed in the group.\n\t *\n\t * @example\n\t * <ontario-radio-buttons\n\t *   caption='{\n\t *     \"captionText\": \"Radio legend\",\n\t *     \"captionType\": \"heading\",\n\t *   }'\n\t *   name=\"radios\"\n\t *   hint-text=\"Hint text for the radio button group.\"\n\t *   options='[\n\t *     {\n\t *        \"value\": \"radio-option-1\",\n\t * \t\t  \"elementId\": \"radio-1\",\n\t *        \"label\": \"Radio option 1 label\"\n\t *     },\n\t *     {\n\t *        \"value\": \"radio-option-2\",\n\t * \t\t  \"elementId\": \"radio-2\",\n\t *        \"label\": \"Radio option 2 label\",\n\t *        \"hintExpander\": {\n\t *\t\t\t  \"hint\": \"Hint expander for radio option 2\",\n\t * \t\t      \"content\": \"Example hint expander content for radio option 2.\"\n\t *\t\t  }\n\t *      }\n\t *   ]'\n\t *   required=\"true\"\n\t * >\n\t * </ontario-radio-buttons>\n\t */\n\t@Prop() options: string | RadioOption[];\n\n\t/**\n\t * Set this to display an error message\n\t */\n\t@Prop({ mutable: true }) errorMessage?: string;\n\n\t/**\n\t * Used to add a custom function to the radio input onChange event.\n\t */\n\t@Prop() customOnChange?: (event: globalThis.Event) => void;\n\n\t/**\n\t * Used to add a custom function to the radio input onBlur event.\n\t */\n\t@Prop() customOnBlur?: (event: globalThis.Event) => void;\n\n\t/**\n\t * Used to add a custom function to the radio input onFocus event.\n\t */\n\t@Prop() customOnFocus?: (event: globalThis.Event) => void;\n\n\t/**\n\t * Used for the `aria-describedby` value of the radio button group. This will match with the id of the hint text.\n\t */\n\t@State() hintTextId: string | null | undefined;\n\n\t/**\n\t * The hint text options are re-assigned to the internalHintText array.\n\t */\n\t@State() private internalHintText: Hint;\n\n\t/**\n\t * The hint expander options are re-assigned to the internalHintExpander array.\n\t */\n\t@State() private internalHintExpander: HintExpander;\n\n\t/**\n\t * The options are re-assigned to the internalOptions array.\n\t */\n\t@State() private internalOptions: RadioOption[];\n\n\t/**\n\t * Instantiate an InputCaption object for internal logic use\n\t */\n\t@State() private captionState: InputCaption;\n\n\t/**\n\t * Emitted when a keyboard input or mouse event occurs when a radio option has been changed.\n\t */\n\t@Event({ eventName: 'radioOnChange' }) radioOnChange: EventEmitter<RadioAndCheckboxChangeEvent>;\n\n\t/**\n\t * Emitted when a keyboard input event occurs when a radio option has lost focus.\n\t */\n\t@Event({ eventName: 'radioOnBlur' }) radioOnBlur: EventEmitter<InputFocusBlurEvent>;\n\n\t/**\n\t * Emitted when a keyboard input event occurs when a radio option has gained focus.\n\t */\n\t@Event({ eventName: 'radioOnFocus' }) radioOnFocus: EventEmitter<InputFocusBlurEvent>;\n\n\t/**\n\t * Emitted when an error message is reported to the component.\n\t */\n\t@Event() inputErrorOccurred: EventEmitter<{ errorMessage: string }>;\n\n\t/**\n\t * This listens for the `setAppLanguage` event sent from the test language toggler when it is is connected to the DOM. It is used for the initial language when the input component loads.\n\t */\n\t@Listen('setAppLanguage', { target: 'window' })\n\thandleSetAppLanguage(event: CustomEvent<Language>) {\n\t\tif (!this.language) {\n\t\t\tthis.language = validateLanguage(event);\n\t\t}\n\t}\n\n\t@Listen('headerLanguageToggled', { target: 'window' })\n\thandleHeaderLanguageToggled(event: CustomEvent<Language>) {\n\t\tthis.language = validateLanguage(event);\n\t}\n\n\t/**\n\t * Watch for changes to the `hintText` prop.\n\t *\n\t * If a `hintText` prop is passed, the `constructHintTextObject` function will convert it to the correct format, and set the result to the `internalHintText` state.\n\t */\n\t@Watch('hintText')\n\tprivate parseHintText() {\n\t\tif (this.hintText) {\n\t\t\tconst hintTextObject = constructHintTextObject(this.hintText);\n\t\t\tthis.internalHintText = hintTextObject;\n\t\t}\n\t}\n\n\t/**\n\t * Watch for changes to the `hintExpander` prop.\n\t *\n\t * If a `hintExpander` prop is passed, it will be parsed (if it is a string), and the result will be set to the `internalHintExpander` state.\n\t */\n\t@Watch('hintExpander')\n\tprivate parseHintExpander() {\n\t\tconst hintExpander = this.hintExpander;\n\t\tif (hintExpander) {\n\t\t\tif (typeof hintExpander === 'string') this.internalHintExpander = JSON.parse(hintExpander);\n\t\t\telse this.internalHintExpander = hintExpander;\n\t\t}\n\t}\n\n\t/**\n\t * Watch for changes to the `options` prop.\n\t *\n\t * If an `options` prop is passed, it will be parsed (if it is a string), and the result will be set to the `internalOptions` state. The result will be run through a validation function.\n\t */\n\t@Watch('options')\n\tparseOptions() {\n\t\tif (typeof this.options !== 'undefined') {\n\t\t\tif (!Array.isArray(this.options)) {\n\t\t\t\tthis.internalOptions = JSON.parse(this.options);\n\t\t\t} else {\n\t\t\t\tthis.internalOptions = this.options;\n\t\t\t}\n\t\t}\n\t}\n\n\t/*\n\t * Watch for changes in the `name` prop for validation purposes.\n\t *\n\t * Validate the `name` and make sure the `name` prop has a value.\n\t * Log a warning if user doesn't input a value for the `name`.\n\t */\n\t@Watch('name')\n\tvalidateName(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(' name ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-radio-buttons> ')\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 * Watch for changes in the `options` prop for validation purposes.\n\n\t * Validate the `options` and make sure the `options` prop has a value.\n\t * Log a warning if user doesn't input a value for the `options`.\n\t */\n\t@Watch('options')\n\tvalidateOptions(newValue: object) {\n\t\tif (validateObjectExists(newValue)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' options ')\n\t\t\t\t.addRegularText('for')\n\t\t\t\t.addMonospaceText(' <ontario-radio-buttons> ')\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 * Watch for changes to the `caption` prop.\n\t *\n\t * The caption will be run through the InputCaption constructor to convert it to the correct format, and set the result to the `captionState` state.\n\t * @param newValue: Caption | string\n\t */\n\t@Watch('caption')\n\tupdateCaptionState(newValue: Caption | string) {\n\t\tthis.captionState = new InputCaption(\n\t\t\tthis.element.tagName,\n\t\t\tnewValue,\n\t\t\ttranslations,\n\t\t\tthis.language,\n\t\t\ttrue,\n\t\t\tthis.required,\n\t\t);\n\t}\n\n\t/**\n\t * Watch for changes to the `language` prop to render either the English or French translations\n\t */\n\t@Watch('language')\n\tupdateLanguage() {\n\t\tthis.updateCaptionState(this.caption);\n\t}\n\n\t@Watch('errorMessage')\n\tbroadcastInputErrorOccurredEvent() {\n\t\t// Emit event to notify anyone who wants to listen for errors occurring\n\t\tthis.inputErrorOccurred.emit({ errorMessage: this.errorMessage ?? '' });\n\t}\n\n\t/**\n\t * Function to handle radio buttons events and the information pertaining to the radio buttons to emit.\n\t */\n\tprivate handleEvent(event: Event, eventType: EventType) {\n\t\tconst input = event.target as HTMLInputElement | null;\n\n\t\t// Reset all internalOptions checked states\n\t\tconst changedOption = this.internalOptions\n\t\t\t.map((x) => {\n\t\t\t\tx.checked = false;\n\t\t\t\treturn x;\n\t\t\t})\n\t\t\t.find((x) => x.value === input?.value);\n\t\t// Set the new checked state for the selected value\n\t\tif (changedOption) changedOption.checked = !changedOption?.checked;\n\n\t\t// Set the value within the form\n\t\tthis.internals?.setFormValue?.(\n\t\t\tthis.internalOptions\n\t\t\t\t.filter((x) => !!x.checked)\n\t\t\t\t.reduce((formData, currentValue) => {\n\t\t\t\t\tformData.append(this.name, currentValue.value);\n\t\t\t\t\treturn formData;\n\t\t\t\t}, new FormData()),\n\t\t);\n\n\t\thandleInputEvent(\n\t\t\tevent,\n\t\t\teventType,\n\t\t\tinput,\n\t\t\tthis.radioOnChange,\n\t\t\tthis.radioOnFocus,\n\t\t\tthis.radioOnBlur,\n\t\t\tundefined,\n\t\t\t'radio',\n\t\t\tthis.customOnChange,\n\t\t\tthis.customOnFocus,\n\t\t\tthis.customOnBlur,\n\t\t\tundefined,\n\t\t\tthis.element,\n\t\t);\n\t}\n\n\t/**\n\t * If a `hintText` prop is passed, the id generated from it will be set to the internal `hintTextId` state to match with the fieldset `aria-describedBy` attribute.\n\t */\n\tasync componentDidLoad() {\n\t\tthis.hintTextId = await this.hintTextRef?.getHintTextId();\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.updateCaptionState(this.caption);\n\t\tthis.parseOptions();\n\t\tthis.parseHintText();\n\t\tthis.parseHintExpander();\n\t\tthis.validateName(this.name);\n\t\tthis.validateOptions(this.internalOptions);\n\t\tthis.language = validateLanguage(this.language);\n\t}\n\n\trender() {\n\t\tconst error = !!this.errorMessage;\n\t\treturn (\n\t\t\t<div class={`ontario-form-group ${error ? 'ontario-input--error' : ''}`}>\n\t\t\t\t<fieldset class=\"ontario-fieldset\" aria-describedby={this.hintTextId}>\n\t\t\t\t\t{this.captionState.getCaption(undefined, !!this.internalHintExpander)}\n\t\t\t\t\t{this.internalHintText && (\n\t\t\t\t\t\t<ontario-hint-text\n\t\t\t\t\t\t\thint={this.internalHintText.hint}\n\t\t\t\t\t\t\thintContentType={this.internalHintText.hintContentType}\n\t\t\t\t\t\t\tref={(el) => (this.hintTextRef = el)}\n\t\t\t\t\t\t></ontario-hint-text>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div class=\"ontario-radios\">\n\t\t\t\t\t\t<ErrorMessage message={this.errorMessage} error={error} />\n\t\t\t\t\t\t{this.internalOptions?.map((radioOption) => (\n\t\t\t\t\t\t\t<div class=\"ontario-radios__item\">\n\t\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\t\tclassName=\"ontario-radios__input\"\n\t\t\t\t\t\t\t\t\tid={radioOption.elementId}\n\t\t\t\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\tvalue={radioOption.value}\n\t\t\t\t\t\t\t\t\trequired={!!this.required}\n\t\t\t\t\t\t\t\t\tchecked={!!radioOption.checked}\n\t\t\t\t\t\t\t\t\tonChange={(e) => this.handleEvent(e, EventType.Change)}\n\t\t\t\t\t\t\t\t\tonBlur={(e) => this.handleEvent(e, EventType.Blur)}\n\t\t\t\t\t\t\t\t\tonFocus={(e) => this.handleEvent(e, EventType.Focus)}\n\t\t\t\t\t\t\t\t></Input>\n\t\t\t\t\t\t\t\t<label class=\"ontario-radios__label\" htmlFor={radioOption.elementId}>\n\t\t\t\t\t\t\t\t\t{radioOption.label}\n\t\t\t\t\t\t\t\t\t{radioOption.hintExpander &&\n\t\t\t\t\t\t\t\t\t\tthis.captionState.getHintExpanderAccessibilityText(radioOption.label, true)}\n\t\t\t\t\t\t\t\t</label>\n\n\t\t\t\t\t\t\t\t{radioOption.hintExpander && (\n\t\t\t\t\t\t\t\t\t<div class=\"ontario-radios__hint-expander\">\n\t\t\t\t\t\t\t\t\t\t<ontario-hint-expander\n\t\t\t\t\t\t\t\t\t\t\thint={radioOption.hintExpander.hint}\n\t\t\t\t\t\t\t\t\t\t\tcontent={radioOption.hintExpander.content}\n\t\t\t\t\t\t\t\t\t\t\thintContentType={radioOption.hintExpander.hintContentType}\n\t\t\t\t\t\t\t\t\t\t\tinput-exists\n\t\t\t\t\t\t\t\t\t\t></ontario-hint-expander>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\n\t\t\t\t\t\t{this.internalHintExpander && (\n\t\t\t\t\t\t\t<div class=\"ontario-radios__hint-expander\">\n\t\t\t\t\t\t\t\t<ontario-hint-expander\n\t\t\t\t\t\t\t\t\thint={this.internalHintExpander.hint}\n\t\t\t\t\t\t\t\t\tcontent={this.internalHintExpander.content}\n\t\t\t\t\t\t\t\t\thintContentType={this.internalHintExpander.hintContentType}\n\t\t\t\t\t\t\t\t\tinput-exists\n\t\t\t\t\t\t\t\t></ontario-hint-expander>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</fieldset>\n\t\t\t</div>\n\t\t);\n\t}\n}\n"],"version":3}