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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/cjs/ontario-accordion_44.cjs.entry.js.map +1 -1
  2. package/dist/collection/components/ontario-footer/test/ontario-footer.spec.js +4 -4
  3. package/dist/collection/components/ontario-footer/test/ontario-footer.spec.js.map +1 -1
  4. package/dist/components/ontario-header.js.map +1 -1
  5. package/dist/esm/ontario-accordion_44.entry.js.map +1 -1
  6. package/dist/ontario-design-system-components/p-ac4e76b2.entry.js.map +1 -1
  7. package/package.json +2 -2
  8. package/src/components/ontario-footer/test/ontario-footer.spec.tsx +4 -4
  9. package/src/components/ontario-header/ontario-header.scss +4 -4
  10. package/www/build/p-ac4e76b2.entry.js.map +1 -1
package/dist/components/ontario-header.js.map CHANGED
@@ -1 +1 @@
1
- {"file":"ontario-header.js","mappings":"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","names":["OntarioHeader"],"sources":["src/components/ontario-header/ontario-application-header.scss?tag=ontario-header&mode=application&encapsulation=shadow","src/components/ontario-header/ontario-header.scss?tag=ontario-header&mode=ontario&encapsulation=shadow","src/components/ontario-header/service-ontario-header.scss?tag=ontario-header&mode=serviceOntario&encapsulation=shadow","src/components/ontario-header/ontario-header.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/typography.variables' as typography;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\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\tfocusPlaceholders;\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/5-layout/_grid.layout.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/6-components/_text-inputs.component.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/7-overrides/_visibility.overrides.scss';\n\n$navigation-link-bg--hover: #e5e5e5;\n$navigation-max-width: 72rem;\n\n$ontario-application-header-menu-button-icon--margin-right: 6px;\n\n.ontario-application-header {\n\tdisplay: flex;\n\talign-items: center;\n\tbackground-color: colours.$ontario-colour-black;\n\tcolor: colours.$ontario-colour-white;\n\theight: 3.125rem !important;\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\n\t> .ontario-row {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n}\n\n.ontario-application-header-container {\n\tposition: relative;\n\twidth: 100%;\n}\n\n.ontario-header-button.ontario-application-navigation--open {\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n}\n\n.ontario-header-button.ontario-application-navigation--closed {\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header-button--with-outline {\n\tborder: globalVariables.$border-size-standard solid colours.$ontario-colour-white;\n\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-4;\n\tpadding: 0.375rem spacing.$spacing-4;\n}\n\n.ontario-application-subheader .ontario-header-button,\n.ontario-application-navigation .ontario-header-button {\n\tbackground-color: colours.$ontario-greyscale-70;\n}\n\n.ontario-header-button--closed {\n\t&:focus {\n\t\tbox-shadow: none;\n\t\toutline: none;\n\t\ttransition: none;\n\t}\n}\n\n.ontario-application-header__logo,\n.ontario-application-header__logo a,\n.ontario-application-header__lang-toggle,\n.ontario-application-subheader__container,\n.ontario-application-subheader__menu-container,\n.ontario-application-subheader__menu {\n\tdisplay: flex;\n\talign-items: center;\n\toutline: none;\n}\n\n.ontario-application-header__logo a {\n\t&:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\ttransition: all 0.1s ease-in-out;\n\t}\n}\n\n.ontario-application-header__logo svg,\n.ontario-application-header__logo img {\n\twidth: 100px;\n\theight: 25px;\n}\n\n.ontario-application-header__lang-toggle {\n\tjustify-content: flex-end;\n\n\ta {\n\t\tfont-size: globalFunctions.px-to-rem(16);\n\t\tline-height: globalFunctions.px-to-rem(22);\n\t\theight: auto;\n\t\toutline: none;\n\t\tpadding: spacing.$spacing-2 spacing.$spacing-3;\n\t}\n}\n\n/* Ontario application subheader styles */\n.ontario-application-subheader {\n\tpadding: (spacing.$spacing-2 + spacing.$spacing-3) 0;\n\tbackground-color: darken(colours.$ontario-colour-white, 75);\n\toverflow: visible;\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: zIndex.$ontario-z-index-neutral;\n\t}\n\n\t& > .ontario-row {\n\t\tposition: relative;\n\t}\n}\n\n.ontario-application-header-container {\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n}\n\n.ontario-application-header > .ontario-row {\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.ontario-application-subheader .ontario-header-button {\n\tvisibility: visible;\n}\n\n.ontario-application-subheader .ontario-header-button,\n.ontario-application-navigation .ontario-header-button {\n\tbackground-color: colours.$ontario-greyscale-70;\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header-button--without-outline {\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\toutline: 4px solid transparent;\n\t\ttransition: all 0.1s ease-in-out;\n\t}\n}\n\n.ontario-application-subheader__heading {\n\tpadding: 0.375rem spacing.$spacing-0;\n\t@extend %h4-styles;\n\tmargin-bottom: spacing.$spacing-0;\n\tmax-width: 65%;\n\n\ta {\n\t\tcolor: colours.$ontario-colour-white;\n\t\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\t\ttext-decoration: none;\n\n\t\t&:focus {\n\t\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\t\ttransition: all 0.1s ease-in-out;\n\t\t}\n\n\t\t&:hover,\n\t\t&:active,\n\t\t&:visited {\n\t\t\tcolor: colours.$ontario-colour-white;\n\t\t\ttext-decoration: underline;\n\t\t}\n\t}\n}\n\n.ontario-application-subheader .ontario-header-button {\n\tvisibility: visible;\n\tbackground-color: colours.$ontario-greyscale-70;\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header__menu-toggler {\n\tspan {\n\t\tdisplay: flex;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\t&:last-of-type {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t}\n\t}\n\n\tsvg {\n\t\tmargin-right: $ontario-application-header-menu-button-icon--margin-right;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-0;\n\t\t}\n\t}\n}\n\n.ontario-application-subheader__container {\n\talign-items: center;\n\tjustify-content: space-between;\n}\n\n.ontario-application-subheader__menu {\n\tdisplay: flex;\n\talign-items: center;\n\tlist-style: none;\n\tmargin: spacing.$spacing-0;\n\tpadding-left: spacing.$spacing-0;\n\n\tli {\n\t\tborder-radius: globalVariables.$global-radius;\n\t\tpadding: spacing.$spacing-0;\n\t\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-3;\n\t\ttext-align: center;\n\t}\n}\n\n.ontario-application-subheader__menu-container a {\n\tbox-sizing: border-box;\n\tborder-radius: globalVariables.$global-radius;\n\tcolor: colours.$ontario-colour-white;\n\tdisplay: inline-block;\n\tfont-family: typography.$ontario-font-open-sans;\n\tfont-size: globalFunctions.px-to-rem(18);\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\theight: globalVariables.$standard-input-height;\n\tline-height: globalFunctions.px-to-rem(23);\n\toutline: none;\n\tpadding: spacing.$spacing-3;\n\ttext-align: left;\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\t&.ontario-link--active {\n\t\tborder-radius: globalVariables.$global-radius globalVariables.$global-radius 0 0;\n\t\tborder-bottom: globalVariables.$global-radius solid colours.$ontario-colour-white;\n\t}\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\ttransition: all 0.1s ease-in-out;\n\t}\n}\n\n.ontario-application-navigation {\n\tposition: absolute;\n\twidth: 100%;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tposition: relative;\n\t\tmax-width: $navigation-max-width;\n\t\twidth: auto;\n\t\tmargin: spacing.$spacing-0 auto;\n\t}\n}\n\n.ontario-application-navigation .ontario-header-button {\n\tvisibility: hidden;\n\tposition: absolute;\n\ttop: (-(spacing.$spacing-9) + -(spacing.$spacing-1));\n\tright: spacing.$spacing-4;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 2);\n}\n\n.ontario-application-navigation__container {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttop: 0;\n\twidth: 100%;\n\tz-index: zIndex.$ontario-z-index-above-high;\n\n\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\tbackground: colours.$ontario-colour-white;\n\t\tposition: absolute;\n\t\tz-index: zIndex.$ontario-z-index-above-high;\n\t}\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tbox-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);\n\t\tborder-radius: globalVariables.$global-radius;\n\t\tposition: absolute;\n\t\tright: spacing.$spacing-3;\n\t\ttop: -0.6rem;\n\t\tmin-width: 290px;\n\t\tmax-width: 30%;\n\t\tz-index: calc(zIndex.$ontario-z-index-above-medium + 1);\n\t\ttransition: none !important;\n\t}\n}\n\n.ontario-application-navigation ul {\n\tlist-style: none;\n\tpadding: spacing.$spacing-2 spacing.$spacing-0;\n\tmargin: spacing.$spacing-0;\n\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tborder-bottom: none;\n\t}\n}\n\n.ontario-application-navigation li {\n\tborder-top: 1px solid colours.$ontario-greyscale-20;\n\tpadding: spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\t}\n}\n\n.ontario-application-navigation a {\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: block;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\ttext-decoration: none;\n\tpadding: calc(spacing.$spacing-3 - math.div(spacing.$spacing-1, 3.25)) spacing.$spacing-5;\n\n\t&:hover {\n\t\ttext-decoration: underline;\n\t\tbackground-color: $navigation-link-bg--hover;\n\t}\n\n\t&:active {\n\t\ttext-decoration: underline;\n\t\tbackground-color: colours.$ontario-greyscale-20;\n\t}\n\n\t&:focus,\n\t&:active {\n\t\t@extend %ontario-focus;\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow inset;\n\t}\n\n\t&.ontario-link--active {\n\t\tborder-left: 6px solid colours.$ontario-colour-black;\n\t\tbackground-color: colours.$ontario-greyscale-5;\n\t}\n}\n\n.ontario-navigation--open {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-navigation--closed {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n}\n\n.ontario-application-navigation.ontario-navigation--open .ontario-application-navigation__container {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\ttransition: none;\n\t\tdisplay: block;\n\t}\n}\n\n.ontario-overlay {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(0, 0, 0, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n.ontario-header-button.ontario-navigation--open {\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header-button.ontario-navigation--closed {\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n/* Header buttons */\n.ontario-header-button {\n\tbackground-color: colours.$ontario-colour-black;\n\tborder: none;\n\tborder-radius: globalVariables.$global-radius;\n\tbox-sizing: border-box;\n\tbox-shadow: none;\n\tcolor: colours.$ontario-colour-white;\n\tcursor: pointer;\n\n\tdisplay: flex;\n\talign-items: center;\n\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\theight: globalVariables.$standard-input-height;\n\tline-height: math.div(14, 9);\n\ttext-align: center;\n\ttext-decoration: none;\n\n\t&:focus {\n\t\t@extend %ontario-focus;\n\t}\n\n\t&:hover,\n\t&:focus,\n\t&:visited {\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n}\n\n.ontario-header-button--with-outline,\n.ontario-header-button--without-outline {\n\tbackground-color: colours.$ontario-colour-black;\n\tcolor: colours.$ontario-colour-white;\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n}\n\n.ontario-header-button--with-outline {\n\tborder: 2px solid colours.$ontario-colour-white;\n\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-4;\n\tpadding: math.div(spacing.$spacing-3, 2) spacing.$spacing-4;\n\n\t&:hover {\n\t\tborder: 2px solid colours.$ontario-colour-white;\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\tpadding: math.div(spacing.$spacing-3, 2);\n\t}\n}\n\n.ontario-header__menu-toggler {\n\tpadding: math.div(spacing.$spacing-3, 2) spacing.$spacing-4;\n\n\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\tpadding-left: spacing.$spacing-2;\n\t\tpadding-right: spacing.$spacing-2;\n\t}\n\n\tspan {\n\t\tdisplay: flex;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\tsvg {\n\t\tmargin-right: 6px;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-0;\n\t\t}\n\t}\n}\n\n.ontario-application-navigation__container {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tbox-shadow: 0 globalVariables.$global-radius 12px rgba(0, 0, 0, 0.3);\n\t\tborder-radius: globalVariables.$global-radius;\n\t\tdisplay: none;\n\t\tposition: absolute;\n\t\tright: spacing.$spacing-4;\n\t\ttop: calc(100% - #{spacing.$spacing-2});\n\t\tmin-width: 290px; // this value is to control the min-width size the dropdown navigation list can be\n\t\tmax-width: 30%;\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-application-navigation.ontario-navigation--open .ontario-application-navigation__container {\n\tbackground: colours.$ontario-colour-white;\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\ttransition: none;\n\t\tdisplay: block;\n\t}\n}\n\n.ontario-application-navigation.ontario-navigation--open {\n\tbackground: colours.$ontario-colour-white;\n\tz-index: zIndex.$ontario-z-index-above-high;\n}\n\n.ontario-application-navigation ul {\n\tlist-style: none;\n\tpadding: spacing.$spacing-2 spacing.$spacing-0;\n\tmargin: spacing.$spacing-0;\n\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tborder-bottom: none;\n\t}\n}\n\n.ontario-application-navigation li {\n\tborder-top: 1px solid colours.$ontario-greyscale-20;\n\tpadding: spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\t}\n}\n\n.ontario-application-navigation a {\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: block;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\ttext-decoration: none;\n\tpadding: (spacing.$spacing-3 - math.div(spacing.$spacing-1, 3.25)) spacing.$spacing-5;\n\n\t&:hover {\n\t\ttext-decoration: underline;\n\t\tbackground-color: $navigation-link-bg--hover;\n\t}\n\n\t&:active {\n\t\ttext-decoration: underline;\n\t\tbackground-color: colours.$ontario-greyscale-20;\n\t}\n\n\t&:focus,\n\t&:active {\n\t\t@extend %ontario-focus;\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow inset;\n\t}\n\n\t&.ontario-link--active {\n\t\tborder-left: 6px solid colours.$ontario-colour-black;\n\t\tbackground-color: colours.$ontario-greyscale-5;\n\t}\n}\n\n/* Ontario application header overlay styles */\n.ontario-overlay {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(0, 0, 0, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n/* Ontario header helper styles */\n.ontario-header__icon-container {\n\tdisplay: flex;\n\talign-items: center;\n}\n","@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/typography.variables' as typography;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\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\tfocusPlaceholders;\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/line-heights.variables' as lineHeights;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/5-layout/_grid.layout.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/6-components/_text-inputs.component.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/7-overrides/_visibility.overrides.scss';\n\n$ontario-search-input-padding: 7.2rem;\n$ontario-search-input-padding--mobile: 6.4rem;\n\n$ontario-header-logo-width: 180px;\n$ontario-header-logo-width--mobile: 45px;\n\n$ontario-header-custom-breakpoint: 39.9375em;\n\n$ontario-header-menu-button-icon--margin-right: 6px;\n\n$ontario-navigation-container-min-width: 290px;\n\n:host {\n\t--header-search-reset: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTE5IDYuNEwxNy42IDUgMTIgMTAuNiA2LjQgNSA1IDYuNGw1LjYgNS42TDUgMTcuNiA2LjQgMTlsNS42LTUuNiA1LjYgNS42IDEuNC0xLjQtNS42LTUuNkwxOSA2LjR6IiBmaWxsPSIjMDAwIi8+PC9zdmc+);\n}\n\n.ontario-header__container {\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: zIndex.$ontario-z-index-above-low;\n\t}\n}\n\n.ontario-icon-container {\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.ontario-icon-container-reset {\n\tdisplay: flex;\n\talign-items: center;\n\n\tsvg {\n\t\tfill: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-subheader__menu a {\n\tborder-radius: globalVariables.$global-radius;\n\tcolor: colours.$ontario-colour-white;\n\tdisplay: inline;\n\tfont-family: typography.$ontario-font-open-sans;\n\tfont-size: globalFunctions.px-to-rem(18);\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\theight: globalVariables.$standard-input-height;\n\tline-height: globalFunctions.px-to-rem(23);\n\tpadding: spacing.$spacing-3 spacing.$spacing-4;\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\t&.ontario-link--active {\n\t\tborder-radius: 4px 4px 0 0;\n\t\tborder-bottom: 4px solid colours.$ontario-colour-white;\n\t}\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\toutline: 4px solid transparent;\n\t\ttransition: all 0.1s ease-in-out;\n\t}\n}\n\n.ontario-navigation {\n\tposition: absolute;\n\twidth: 100%;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tposition: relative;\n\t\tmax-width: 72rem;\n\t\twidth: auto;\n\t\tmargin: spacing.$spacing-0 auto;\n\t}\n}\n\n.nav-ul-closed {\n\tbackground: white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n}\n\n.nav-ul-opened {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-navigation ul {\n\tlist-style: none;\n\tpadding: spacing.$spacing-2 spacing.$spacing-0;\n\tmargin: spacing.$spacing-0;\n\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tborder-bottom: none;\n\t}\n}\n\n.ontario-navigation li {\n\tborder-top: 1px solid colours.$ontario-greyscale-20;\n\tpadding: spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\t}\n}\n\n.ontario-navigation a {\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: block;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\ttext-decoration: none;\n\tpadding: calc(spacing.$spacing-3 - math.div(spacing.$spacing-1, 3.25)) spacing.$spacing-5;\n\n\t&:hover {\n\t\ttext-decoration: underline;\n\t\tbackground-color: darken(colours.$ontario-greyscale-5, 5);\n\t}\n\n\t&:active {\n\t\ttext-decoration: underline;\n\t\tbackground-color: colours.$ontario-greyscale-20;\n\t}\n\n\t&:focus,\n\t&:active {\n\t\t@extend %ontario-focus;\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow inset;\n\t}\n\n\t&.ontario-link--active {\n\t\tborder-left: 6px solid colours.$ontario-colour-black;\n\t\tbackground-color: colours.$ontario-greyscale-5;\n\t}\n}\n\n.ontario-overlay {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(0, 0, 0, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n.ontario-header {\n\tposition: relative;\n\toverflow: hidden;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\tbackground-color: colours.$ontario-colour-black;\n\tcolor: colours.$ontario-colour-white;\n\tdisplay: flex;\n\talign-items: center;\n\theight: 5.75rem;\n\n\t.ontario-row {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: flex-end;\n\t}\n\n\tsvg {\n\t\twidth: spacing.$spacing-6;\n\t\theight: spacing.$spacing-6;\n\t\tmargin-bottom: spacing.$spacing-0;\n\t}\n}\n\n.ontario-header__logo-container {\n\ta {\n\t\tdisplay: inline-flex;\n\t\theight: 100%;\n\t\toutline: none;\n\n\t\t&:focus {\n\t\t\tbox-shadow: 0 0 0 globalVariables.$global-radius colours.$ontario-colour-focus;\n\t\t}\n\n\t\timg {\n\t\t\twidth: $ontario-header-logo-width--mobile;\n\t\t\theight: globalVariables.$ontario-logo-height;\n\n\t\t\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\t\t\twidth: $ontario-header-logo-width;\n\t\t\t\theight: globalVariables.$ontario-logo-height;\n\t\t\t}\n\t\t}\n\t}\n}\n\n.ontario-navigation__container.ontario-navigation--open {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-navigation__container.ontario-navigation--closed {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n}\n\n.ontario-header-button.ontario-navigation--open {\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header-button.ontario-navigation--closed {\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header__logo-container {\n\theight: globalVariables.$ontario-logo-height;\n\n\tsvg {\n\t\twidth: $ontario-header-logo-width--mobile;\n\t\theight: globalVariables.$ontario-logo-height;\n\n\t\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\t\twidth: $ontario-header-logo-width;\n\t\t\theight: globalVariables.$ontario-logo-height;\n\t\t}\n\t}\n}\n\n.ontario-header__logo-container a {\n\tdisplay: inline-block;\n\theight: 100%;\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 globalVariables.$global-radius colours.$ontario-colour-focus;\n\t}\n}\n\n/* Ontario heaader search styles */\n.ontario-header__search-container {\n\tposition: relative;\n\tdisplay: none;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tdisplay: flex;\n\t}\n\n\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\tpadding-right: math.div(2rem, 2);\n\t}\n}\n\n.ontario-input.ontario-header__search-input {\n\tborder-width: 0;\n\tmargin-bottom: spacing.$spacing-0;\n\theight: globalVariables.$standard-input-height;\n\tpadding-left: spacing.$spacing-3;\n\tpadding-right: $ontario-search-input-padding;\n\n\t&:invalid + input[type='reset'] {\n\t\tdisplay: none;\n\t}\n\n\t&:focus {\n\t\t& ~ .ontario-header__search-submit {\n\t\t\tbackground-color: colours.$ontario-colour-link;\n\t\t\tcolor: colours.$ontario-colour-white;\n\n\t\t\tsvg {\n\t\t\t\tfill: colours.$ontario-colour-white;\n\t\t\t}\n\n\t\t\t&:hover {\n\t\t\t\tbackground-color: colours.$ontario-colour-link--hover;\n\t\t\t\tcolor: colours.$ontario-colour-white;\n\t\t\t}\n\t\t}\n\t}\n\n\t// Remove auto X icon for IE and Edge on input area\n\t&::-ms-clear {\n\t\tdisplay: none;\n\t\twidth: 0;\n\t\theight: 0;\n\t}\n\n\t// Remove red outline around input area on Firefox\n\t&:invalid:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\t-moz-box-shadow: none;\n\t}\n\n\t&:invalid:not(:focus) {\n\t\tbox-shadow: none;\n\t\t-moz-box-shadow: none;\n\t}\n\n\t@media screen and (min-width: breakpoints.$small-breakpoint) and (max-width: breakpoints.$medium-breakpoint) {\n\t\tpadding-left: spacing.$spacing-4;\n\t\tpadding-right: $ontario-search-input-padding--mobile;\n\t}\n}\n\n.ontario-header__search-submit {\n\tborder: 0;\n\tborder-radius: 0 3px 3px 0;\n\tbackground-color: colours.$ontario-greyscale-5;\n\tcolor: colours.$ontario-colour-black;\n\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\n\tfont-family: typography.$ontario-font-open-sans;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-size: 1.125rem;\n\theight: 100%;\n\tline-height: lineHeights.$ontario-line-height-8;\n\n\tposition: absolute;\n\tright: spacing.$spacing-4;\n\ttop: spacing.$spacing-0;\n\tcursor: pointer;\n\n\tpadding-left: spacing.$spacing-3;\n\tpadding-right: spacing.$spacing-3;\n\n\tsvg {\n\t\tfill: colours.$ontario-colour-black;\n\t}\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-colour-link--hover;\n\t\tcolor: colours.$ontario-colour-white;\n\n\t\tsvg {\n\t\t\tfill: colours.$ontario-colour-white;\n\t\t}\n\t}\n\n\t&:focus {\n\t\toutline: none;\n\t\tbox-shadow: 0 0 0 globalVariables.$global-radius colours.$ontario-colour-focus;\n\t\tbackground-color: colours.$ontario-colour-link--hover;\n\t\tcolor: colours.$ontario-colour-white;\n\n\t\tsvg {\n\t\t\tfill: colours.$ontario-colour-white;\n\t\t}\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-link--active;\n\t\tcolor: colours.$ontario-colour-white;\n\n\t\tsvg {\n\t\t\tfill: colours.$ontario-colour-white;\n\t\t}\n\t}\n\n\tsvg {\n\t\tmargin-right: spacing.$spacing-0;\n\t}\n}\n\ninput[type='reset'].ontario-header__search-reset {\n\tposition: absolute;\n\tdisplay: flex;\n\talign-items: center;\n\ttop: 11px;\n\tright: 80px;\n\theight: 28px;\n\twidth: 28px;\n\tcolor: colours.$ontario-colour-black;\n\tmargin: spacing.$spacing-0;\n\tpadding: spacing.$spacing-2;\n\tbackground-image: var(--header-search-reset);\n\tbackground-position: center center;\n\tbackground-repeat: no-repeat;\n\tbackground-color: transparent;\n\toutline: none;\n\tborder: none;\n\tcursor: pointer;\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 globalVariables.$global-radius colours.$ontario-colour-focus;\n\t}\n}\n\n/* Header menu & language toggle & close search button styles */\n.ontario-header__nav-right-container {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: flex-end;\n}\n\n/* Header buttons */\n.ontario-header-button {\n\tbackground-color: colours.$ontario-colour-black;\n\tborder: none;\n\tborder-radius: globalVariables.$global-radius;\n\tbox-sizing: border-box;\n\tbox-shadow: none;\n\tcolor: colours.$ontario-colour-white;\n\tcursor: pointer;\n\tdisplay: flex;\n\talign-items: center;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\theight: globalVariables.$standard-input-height;\n\tline-height: math.div(14, 9);\n\ttext-align: center;\n\ttext-decoration: none;\n\n\t&:focus {\n\t\t@extend %ontario-focus;\n\t}\n\n\t&:hover,\n\t&:focus,\n\t&:visited {\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n}\n\n.ontario-header-button--with-outline,\n.ontario-header-button--without-outline {\n\tbackground-color: colours.$ontario-colour-black;\n\tcolor: colours.$ontario-colour-white;\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n}\n\n.ontario-header-button--with-outline {\n\tborder: 2px solid colours.$ontario-colour-white;\n\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-4;\n\tpadding: math.div(spacing.$spacing-3, 2) spacing.$spacing-4;\n\n\t&:hover {\n\t\tborder: 2px solid colours.$ontario-colour-white;\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\tpadding: math.div(spacing.$spacing-3, 2);\n\t}\n}\n\n.ontario-header-button--without-outline {\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n}\n\n.ontario-header__menu-toggler {\n\tpadding: math.div(spacing.$spacing-3, 2) spacing.$spacing-4;\n\n\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\tpadding-left: spacing.$spacing-2;\n\t\tpadding-right: spacing.$spacing-2;\n\t}\n\n\tspan {\n\t\tdisplay: flex;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\tsvg {\n\t\tmargin-right: $ontario-header-menu-button-icon--margin-right;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-0;\n\t\t}\n\t}\n}\n\n.ontario-header__language-toggler {\n\tpadding: spacing.$spacing-3;\n\n\tabbr[title] {\n\t\ttext-decoration: none;\n\t}\n}\n\n.ontario-header__search-toggler {\n\tpadding: spacing.$spacing-2 spacing.$spacing-3;\n\tmargin-left: spacing.$spacing-4;\n\n\tsvg {\n\t\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-1;\n\t\t}\n\t}\n}\n\n.ontario-header__search-close {\n\tflex-direction: column-reverse;\n\tfont-weight: fontWeights.$ontario-font-weights-normal;\n\tmargin-right: spacing.$spacing-4;\n\tpadding: math.div(spacing.$spacing-5, 10) spacing.$spacing-1;\n\tposition: relative;\n\theight: 60px;\n\tdisplay: none;\n\n\tspan {\n\t\tposition: relative;\n\t\ttop: -3px;\n\t\tfont-size: spacing.$spacing-4;\n\t\tmargin-left: spacing.$spacing-0;\n\n\t\t&:last-of-type {\n\t\t\ttop: 0;\n\t\t\theight: 1.875rem;\n\t\t}\n\n\t\t@media screen and (min-width: $ontario-header-custom-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-1;\n\t\t}\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\toutline: none;\n\t\t\ttext-decoration: none;\n\t\t}\n\t}\n\n\tsvg {\n\t\ttop: 0;\n\t}\n\n\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\tflex-direction: row;\n\t\tpadding: spacing.$spacing-1 spacing.$spacing-2 spacing.$spacing-1 spacing.$spacing-4;\n\t\theight: globalVariables.$standard-input-height;\n\n\t\tspan {\n\t\t\ttop: 0;\n\t\t}\n\n\t\tsvg {\n\t\t\tposition: relative;\n\t\t\twidth: spacing.$spacing-7;\n\t\t\theight: spacing.$spacing-7;\n\t\t}\n\t}\n}\n\n.ontario-header--search-open .ontario-header__search-close {\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tdisplay: none;\n\t}\n}\n\n.ontario-header__search-close-container {\n\tdisplay: none;\n\tjustify-content: flex-end;\n\tpadding-right: 0;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\twidth: auto;\n\t\tpadding-left: 0;\n\t\tpadding-right: 0;\n\t}\n}\n\n@media screen and (max-width: breakpoints.$medium-breakpoint) {\n\t.ontario-header--search-open .ontario-header__logo-container,\n\t.ontario-header--search-open .ontario-header__nav-right-container {\n\t\tdisplay: none;\n\t}\n\n\t.ontario-header--search-open .ontario-header__search-close-container,\n\t.ontario-header--search-open .ontario-header__search-container,\n\t.ontario-header--search-open .ontario-header__search-close {\n\t\tdisplay: flex;\n\t}\n}\n\n/* Ontario header navigation styles */\n.ontario-navigation {\n\tposition: absolute;\n\twidth: 100%;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tposition: relative;\n\t\tmax-width: 72rem;\n\t\twidth: auto;\n\t\tmargin: spacing.$spacing-0 auto;\n\t}\n}\n\n.ontario-navigation__container {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tbox-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);\n\t\tborder-radius: 4px;\n\t\tdisplay: none;\n\t\tposition: absolute;\n\t\tright: spacing.$spacing-4;\n\t\ttop: calc(100% - #{spacing.$spacing-2});\n\t\tmin-width: $ontario-navigation-container-min-width;\n\t\tmax-width: 30%;\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-navigation ul {\n\tlist-style: none;\n\tpadding: spacing.$spacing-2 spacing.$spacing-0;\n\tmargin: spacing.$spacing-0;\n\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tborder-bottom: none;\n\t}\n}\n\n.ontario-header-navigation__menu-item {\n\tborder-top: 1px solid colours.$ontario-greyscale-20;\n\tpadding: spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\t}\n}\n\n.ontario-navigation a {\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: block;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\ttext-decoration: none;\n\tpadding: (spacing.$spacing-3 - math.div(spacing.$spacing-1, 3.25)) spacing.$spacing-5;\n\n\t&:hover {\n\t\ttext-decoration: underline;\n\t\tbackground-color: darken(colours.$ontario-greyscale-5, 5);\n\t}\n\n\t&:active {\n\t\ttext-decoration: underline;\n\t\tbackground-color: colours.$ontario-greyscale-20;\n\t}\n\n\t&:focus,\n\t&:active {\n\t\t@extend %ontario-focus;\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow inset;\n\t}\n\n\t&.ontario-link--active {\n\t\tborder-left: 6px solid colours.$ontario-colour-black;\n\t\tbackground-color: colours.$ontario-greyscale-5;\n\t}\n}\n\n.ontario-navigation.ontario-navigation--open .ontario-navigation__container {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\ttransition: none;\n\t\tdisplay: block;\n\t}\n}\n\n/* Ontario header overlay styles */\n.ontario-overlay {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(0, 0, 0, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n/* Ontario header helper styles */\n.ontario-header__icon-container {\n\tdisplay: flex;\n\talign-items: center;\n}\n\n// Fractal component style coverage ↓\n.ontario-navigation .ontario-header-button {\n\tvisibility: hidden;\n\tposition: absolute;\n\tright: spacing.$spacing-4;\n\tz-index: 6;\n\n\tsvg {\n\t\twidth: 2rem;\n\t\theight: 2rem;\n\t\tmargin-bottom: 0;\n\t}\n}\n\n.ontario-navigation--open .ontario-navigation .ontario-header-button {\n\tvisibility: visible;\n}\n\n.ontario-header + .ontario-navigation .ontario-header-button {\n\ttop: -4.35rem;\n}\n","@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/typography.variables' as typography;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\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/z-index.variables' as zIndex;\n@use './ontario-application-header.scss';\n\n.ontario-service-header {\n\theight: 3.125rem;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n}\n\n.ontario-service-header__logo,\n.ontario-service-header__logo a,\n.ontario-service-header__lang-toggle,\n.ontario-service-subheader__container,\n.ontario-service-subheader__menu-container,\n.ontario-service-subheader__menu {\n\tdisplay: flex;\n}\n\n.ontario-service-header__logo img {\n\twidth: 100px;\n\theight: 25px;\n}\n\n.ontario-service-header__lang-toggle {\n\tjustify-content: flex-end;\n\n\ta {\n\t\tfont-size: globalFunctions.px-to-rem(16);\n\t\tline-height: globalFunctions.px-to-rem(22);\n\t\theight: auto;\n\t\tpadding: spacing.$spacing-2 spacing.$spacing-3;\n\t}\n}\n\n.ontario-service-subheader {\n\tpadding: spacing.$spacing-4 spacing.$spacing-0;\n\tbackground-color: colours.$ontario-colour-service-ontario-header-brand;\n\toverflow: hidden;\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: zIndex.$ontario-z-index-neutral;\n\t}\n\n\t& > .ontario-row {\n\t\tposition: relative;\n\t}\n}\n\n.ontario-service-subheader .ontario-header-button {\n\tdisplay: flex;\n}\n\n.ontario-service-subheader .ontario-header-button {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-brand;\n\n\t.ontario-icon {\n\t\twidth: 2rem;\n\t\theight: 2rem;\n\t\tmargin-bottom: spacing.$spacing-0;\n\t}\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-colour-service-ontario-header-hover;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-service-ontario-header-active;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 4px colours.$ontario-colour-service-ontario-header-focus;\n\t}\n}\n\n.ontario-service-subheader__link {\n\ttext-decoration: none;\n}\n\n.ontario-service-subheader__heading-container {\n\ta & {\n\t\tcolor: colours.$ontario-colour-white;\n\t\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\t\ttext-decoration: none;\n\n\t\t&:hover,\n\t\t&:active,\n\t\t&:visited {\n\t\t\tcolor: colours.$ontario-colour-white;\n\t\t\ttext-decoration: underline;\n\t\t}\n\n\t\t&:focus {\n\t\t\tbox-shadow: 0 0 0 4px colours.$ontario-colour-service-ontario-header-focus;\n\t\t}\n\t}\n}\n\n.ontario-service-subheader__heading {\n\t@extend %h3-styles;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tpadding: spacing.$spacing-0 spacing.$spacing-0 math.div(spacing.$spacing-1, 2) spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\ttext-decoration: none;\n}\n\n.ontario-service-subheader__description {\n\tpadding: math.div(spacing.$spacing-1, 2) spacing.$spacing-0 spacing.$spacing-1 spacing.$spacing-0;\n\t@extend %h5-styles;\n\tmargin-bottom: spacing.$spacing-0;\n\tcolor: colours.$ontario-colour-white;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\ttext-decoration: none;\n}\n\n.ontario-service-subheader__container {\n\talign-items: center;\n\tjustify-content: space-between;\n}\n\n.ontario-service-subheader__menu {\n\tlist-style: none;\n\tmargin: spacing.$spacing-0;\n\tpadding-left: spacing.$spacing-0;\n\talign-items: center;\n}\n\n.ontario-service-subheader__menu li {\n\tpadding: spacing.$spacing-0;\n\tmargin-left: spacing.$spacing-4;\n}\n\n.ontario-service-subheader__menu a {\n\tborder-radius: globalVariables.$global-radius;\n\tcolor: colours.$ontario-colour-white;\n\tdisplay: block;\n\tfont-family: typography.$ontario-font-open-sans;\n\tfont-size: globalFunctions.px-to-rem(18);\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\theight: globalVariables.$standard-input-height;\n\tline-height: globalFunctions.px-to-rem(23);\n\tpadding: spacing.$spacing-3;\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\t&.ontario-link--active {\n\t\tborder-radius: globalVariables.$global-radius globalVariables.$global-radius 0 0;\n\t\tborder-bottom: globalFunctions.px-to-rem(4) solid colours.$ontario-colour-white;\n\t}\n\n\t&:hover {\n\t\tcolor: colours.$ontario-colour-white;\n\t\tbackground-color: colours.$ontario-colour-service-ontario-header-hover;\n\t}\n\n\t&:active {\n\t\tcolor: colours.$ontario-colour-white;\n\t\tbackground-color: colours.$ontario-colour-service-ontario-header-active;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 4px colours.$ontario-colour-service-ontario-header-focus;\n\t}\n}\n\n.ontario-overlay {\n\tdisplay: none;\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(colours.$ontario-colour-black, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n.ontario-navigation--open {\n\t.ontario-service-subheader .ontario-header-button:first-of-type {\n\t\tdisplay: none;\n\t}\n\n\t.ontario-service-subheader .ontario-header-button:last-of-type {\n\t\tdisplay: flex;\n\t}\n\n\t@media screen and (max-width: breakpoints.$medium-breakpoint) {\n\t\t.ontario-service-subheader-menu__container {\n\t\t\tposition: relative;\n\t\t\tz-index: calc(zIndex.$ontario-z-index-above-medium + 1);\n\t\t}\n\t}\n\n\t.ontario-overlay {\n\t\tdisplay: block;\n\n\t\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n}\n\n.ontario-colour-service-ontario-header-brand {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-brand;\n}\n\n.ontario-colour-service-ontario-header-focus {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-focus;\n}\n\n.ontario-colour-service-ontario-header-hover {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-hover;\n}\n\n.ontario-colour-service-ontario-header-active {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-active;\n}\n","import { Component, Prop, State, Watch, h, Listen, Element, getAssetPath } from '@stencil/core';\n\nimport { Input } from '../../utils/common/input/input';\nimport {\n\tMenuItem,\n\tApplicationHeaderInfo,\n\tLanguageToggleOptions,\n\tOntarioMenuItems,\n\tOntarioHeaderType,\n} from './ontario-header.interface';\n\nimport OntarioIconClose from '../ontario-icon/assets/ontario-icon-close-header.svg';\nimport OntarioIconMenu from '../ontario-icon/assets/ontario-icon-menu-header.svg';\nimport OntarioIconSearch from '../ontario-icon/assets/ontario-icon-search.svg';\nimport OntarioIconSearchWhite from '../ontario-icon/assets/ontario-icon-search-white.svg';\nimport OntarioHeaderDefaultData from './ontario-header-default-data.json';\n\nimport { Language } from '../../utils/common/language-types';\nimport { validateLanguage } from '../../utils/validation/validation-functions';\n\nimport translations from '../../translations/global.i18n.json';\nimport config from '../../config.json';\n\n@Component({\n\ttag: 'ontario-header',\n\tstyleUrls: {\n\t\tontario: 'ontario-header.scss',\n\t\tapplication: 'ontario-application-header.scss',\n\t\tserviceOntario: 'service-ontario-header.scss',\n\t},\n\tshadow: true,\n\tassetsDirs: ['./assets'],\n})\nexport class OntarioHeader {\n\t@Element() el: HTMLElement;\n\n\t/**\n\t * The type of header.\n\t */\n\t@Prop() type?: OntarioHeaderType = 'application';\n\n\t/**\n\t * Information pertaining to the application header. This is only necessary for the 'application' header type.\n\t *\n\t * This includes the application name, URL and optional props for the number of links in the subheader for desktop, tablet, and mobile views.\n\t *\n\t * @example\n\t * <ontario-header\n\t * type=\"application\"\n\t * application-header-info='{\n\t * \"title\": \"Application name\",\n\t * \"href\": \"/application-homepage\",\n\t * \"maxSubheaderDesktopLinks\": \"3\",\n\t * \"maxSubheaderTabletLinks\": \"2\",\n\t * \"maxSubheaderMobileLinks\": \"1\"\n\t * }'>\n\t * </ontario-header>\n\t */\n\t@Prop() applicationHeaderInfo: ApplicationHeaderInfo | string;\n\n\t/**\n\t * The items that will go inside the menu.\n\t */\n\t@Prop() menuItems: MenuItem[] | string;\n\n\t/**\n\t * Option to disable fetching of the dynamic menu from the Ontario Header API\n\t *\n\t * @example\n\t * \t<ontario-header\n\t * \t\t\ttype=\"ontario\"\n\t * \t\t\tdisable-dynamic-menu=\"false\"\n\t *\t\t\tmenu-items='[{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t}]'>\n\t *\t</ontario-header>\n\t */\n\t@Prop() disableDynamicMenu: boolean = false;\n\n\t/**\n\t * Information pertaining to the language toggle links.\n\t *\n\t * @example\n\t * <ontario-header\n\t * \tlanguage-toggle-options='{\n\t * \"englishLink\": \"/en\",\n\t * \"frenchLink\": \"/fr\"\n\t * }'\n\t * ...\n\t * >\n\t * </ontario-header>\n\t */\n\t@Prop() languageToggleOptions?: LanguageToggleOptions | string;\n\n\t/**\n\t * A custom function to pass to the language toggle button.\n\t */\n\t@Prop() customLanguageToggle?: (event: globalThis.Event) => void;\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 none is passed, it will default to English.\n\t */\n\t@Prop({ mutable: true }) language?: Language = 'en';\n\n\t/**\n\t * The base path to an assets folder containing the Design System assets\n\t */\n\t@Prop() assetBasePath: string;\n\n\t/**\n\t * The application header information is reassigned to applicationHeaderInfoState for parsing\n\t */\n\t@State() private applicationHeaderInfoState: ApplicationHeaderInfo;\n\n\t/**\n\t * The menuItems is reassigned to itemState for parsing\n\t *\n\t * @example\n\t * \t<ontario-header\n\t * \t\t\ttype=\"ontario\"\n\t * \t\t\tdisable-dynamic-menu=\"true\"\n\t *\t\t\tmenu-items='[{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t}]'>\n\t *\t</ontario-header>\n\t */\n\t@State() private menuItemState: MenuItem[];\n\n\t/**\n\t * Check to see if menu is dynamic or static\n\t */\n\t@State() private isDynamicMenu: boolean = false;\n\n\t/**\n\t * The languageToggleOptions is reassigned to languageState for parsing\n\t *\n\t * @example\n\t * \t<ontario-header\n\t *\t\tlanguage-toggle-options='{\n\t *\t\t\t\"englishLink\":\"/en\",\n\t *\t\t\t\"frenchLink\": \"/fr\"\n\t *\t\t}'\n\t *\t</ontario-header>\n\t */\n\t@State() private languageState: LanguageToggleOptions;\n\n\t/**\n\t * Toggler for the menu and the search button\n\t */\n\t@State() menuToggle: boolean = false;\n\t@State() searchToggle?: boolean = false;\n\n\t/**\n\t * Assigning values to elements to use them as ref\n\t */\n\theader!: HTMLElement;\n\tmenuButton!: HTMLElement;\n\tmenuButtonDesktop!: HTMLElement;\n\tmenuButtonTablet!: HTMLElement;\n\tmenuButtonMobile!: HTMLElement;\n\tsearchBar!: HTMLInputElement;\n\tsearchButton!: HTMLInputElement;\n\n\t@State() translations: any = translations;\n\n\t@Watch('applicationHeaderInfo')\n\tprivate parseApplicationHeaderInfo() {\n\t\tconst applicationHeaderInfo = this.applicationHeaderInfo;\n\t\tif (applicationHeaderInfo) {\n\t\t\tif (typeof applicationHeaderInfo === 'string')\n\t\t\t\tthis.applicationHeaderInfoState = JSON.parse(applicationHeaderInfo);\n\t\t\telse this.applicationHeaderInfoState = applicationHeaderInfo;\n\t\t}\n\t}\n\n\t@Watch('menuItems')\n\tparseMenuItems() {\n\t\tconst isEnglish = this.language === 'en';\n\n\t\tif (!Array.isArray(this.menuItems) && typeof this.menuItems === 'string') {\n\t\t\tthis.menuItemState = JSON.parse(this.menuItems);\n\t\t\tthis.isDynamicMenu = false;\n\t\t} else if (Array.isArray(this.menuItems) && this.type === 'application') {\n\t\t\tthis.menuItemState = this.menuItems;\n\t\t\tthis.isDynamicMenu = false;\n\t\t} else {\n\t\t\tthis.menuItemState = isEnglish ? OntarioHeaderDefaultData.en : OntarioHeaderDefaultData.fr;\n\t\t\tthis.isDynamicMenu = false;\n\t\t}\n\t}\n\n\t@Watch('languageToggleOptions')\n\tprivate parseLanguage() {\n\t\tconst languageToggleOptions = this.languageToggleOptions;\n\t\tif (languageToggleOptions) {\n\t\t\tif (typeof languageToggleOptions === 'string') {\n\t\t\t\tthis.languageState = JSON.parse(languageToggleOptions);\n\t\t\t} else {\n\t\t\t\tthis.languageState = languageToggleOptions;\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Logic to close the menu when anything outside the menu is clicked\n\t */\n\t@Listen('click', { capture: true, target: 'window' })\n\thandleClick(event: any) {\n\t\t// if the button is clicked, return\n\t\tif (\n\t\t\tevent.composedPath().includes(this.menuButton) ||\n\t\t\tevent.composedPath().includes(this.menuButtonDesktop) ||\n\t\t\tevent.composedPath().includes(this.menuButtonTablet) ||\n\t\t\tevent.composedPath().includes(this.menuButtonMobile)\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\t// If the click was outside the current component, do the following\n\t\tif (this.menuToggle) this.menuToggle = !this.menuToggle;\n\t}\n\n\t/**\n\t * This listens for the `setAppLanguage` event sent from the language toggle when it is is connected to the DOM.\n\t * 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> | Language) {\n\t\tthis.language = validateLanguage(event);\n\t\tthis.parseMenuItems();\n\t}\n\n\t/**\n\t * This listens for the `headerLanguageToggled` event sent from the language toggle when it is is connected to the DOM.\n\t * It is used for changing the component language after the language toggle has been activated.\n\t */\n\t@Listen('headerLanguageToggled', { target: 'window' })\n\thandleLanguageToggle(event: CustomEvent<{ oldLanguage: Language; newLanguage: Language }>) {\n\t\tthis.handleSetAppLanguage(event.detail.newLanguage);\n\t}\n\n\t/**\n\t * Logic to handle the menu toggling\n\t */\n\thandleMenuToggle = () => {\n\t\tthis.menuToggle = !this.menuToggle;\n\t\tthis.searchToggle = undefined;\n\t};\n\n\t/**\n\t * Logic to handle the search toggling\n\t */\n\thandleSearchToggle = () => {\n\t\tthis.searchToggle = !this.searchToggle;\n\t};\n\n\t/**\n\t * event.preventDefault(): https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault\n\t * location.href: https://developer.mozilla.org/en-US/docs/Web/API/Location/href\n\t */\n\thandleSubmit = (event: any) => {\n\t\tevent.preventDefault();\n\t\tlocation.href = `${this.translations.header.ontarioSearchURL[`${this.language}`]}${event.target[0].value}`;\n\t};\n\n\t/**\n\t * Logic to make the focus go back to the menu button when the list ends\n\t */\n\ttrapMenuFocus = (e: any) => {\n\t\tlet dataType = e.target?.dataset.type;\n\t\tif (dataType === 'app-desktop') {\n\t\t\tthis.menuButtonDesktop.focus();\n\t\t} else if (dataType === 'app-tablet') {\n\t\t\tthis.menuButtonTablet.focus();\n\t\t} else if (dataType === 'app-mobile') {\n\t\t\tthis.menuButtonMobile.focus();\n\t\t} else {\n\t\t\tthis.menuButton.focus();\n\t\t}\n\t};\n\n\t/**\n\t * Call to Ontario Menu API to fetch linksets to populate header component\n\t */\n\tasync fetchOntarioMenu() {\n\t\tconst isEnglish = this.language === 'en';\n\n\t\t// If menu has already been fetched and contains dynamic menu items, do not run fetch again\n\t\tif (!this.isDynamicMenu) {\n\t\t\tconst apiUrl = isEnglish\n\t\t\t\t? (config.ONTARIO_HEADER_API_URL_EN as string)\n\t\t\t\t: (config.ONTARIO_HEADER_API_URL_FR as string);\n\n\t\t\tconst response = await fetch(apiUrl)\n\t\t\t\t.then((response) => response.json())\n\t\t\t\t.then((json) => json.linkset[0].item as OntarioMenuItems[])\n\t\t\t\t.catch(() => {\n\t\t\t\t\tconsole.error('Unable to retrieve data from Ontario Menu API');\n\t\t\t\t\treturn [];\n\t\t\t\t});\n\n\t\t\tif (response.length > 0) {\n\t\t\t\tconst externalMenuItems = response.map((item) => {\n\t\t\t\t\treturn { href: item.href, title: item.title };\n\t\t\t\t});\n\t\t\t\tthis.menuItemState = externalMenuItems;\n\t\t\t\tthis.isDynamicMenu = true;\n\t\t\t}\n\t\t}\n\t\treturn;\n\t}\n\n\t/**\n\t * Generate a link to the given image based on the base asset path.\n\t * @param imageName Name of the image to build the path to\n\t * @returns Path to image with asset path\n\t */\n\tprivate getImageAssetSrcPath(imageName: string): string {\n\t\treturn `${this.assetBasePath ? this.assetBasePath : getAssetPath('./assets')}/${imageName}`;\n\t}\n\n\t/**\n\t * This function generates the menu items in a <li>, accordingly, to the given parameters.\n\t *\n\t * href and title are necessary, but rest are not.\n\t *\n\t * @param href - the href of the menu item\n\t * @param title - the title of the menu item\n\t * @param linkIsActive - when set to true, this will add the classes necessary to style the link in a way that indicates to the user what the active page/link is\n\t * @param liClass - if there is a class that is related to the <a> portion of the menu item, put it here\n\t * @param onClick - for any custom onClick event a user might want to add to their menu links\n\t * @param onBlur - when set to true, it will call the function trapMenuFocus(), otherwise nothing is done (used in lastLink)\n\t */\n\tprivate generateMenuItem(\n\t\thref: string,\n\t\ttitle: string,\n\t\tlinkIsActive: boolean | undefined,\n\t\ttype: string,\n\t\tliClass?: string,\n\t\tonClick?: any,\n\t\tonBlur?: boolean,\n\t) {\n\t\treturn (\n\t\t\t<li class={liClass}>\n\t\t\t\t<a\n\t\t\t\t\tclass={linkIsActive === true ? `ontario-link--active` : ``}\n\t\t\t\t\thref={href}\n\t\t\t\t\tonClick={onClick}\n\t\t\t\t\tonBlur={onBlur ? this.trapMenuFocus : undefined}\n\t\t\t\t\tdata-type={type}\n\t\t\t\t>\n\t\t\t\t\t{title}\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t);\n\t}\n\n\t/**\n\t * This function generates the menu dropdown button for the ontario header component.\n\t *\n\t * @param viewportSize - the size of the screen where the function is being called. It can either be set to `desktop`, `tablet` or `mobile`. This dictates the classes used on the menu button, as well as the ref to keep the focus trapped when the menu is open.\n\t */\n\tprivate renderMenuButton(viewportSize: string) {\n\t\tif (!this.isMenuVisible(viewportSize)) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn (\n\t\t\t<button\n\t\t\t\tclass={\n\t\t\t\t\tviewportSize === 'desktop'\n\t\t\t\t\t\t? 'ontario-header__menu-toggler ontario-header-button ontario-header-button--with-outline ontario-show-for-large'\n\t\t\t\t\t\t: viewportSize === 'tablet'\n\t\t\t\t\t\t? 'ontario-header__menu-toggler ontario-header-button ontario-header-button--with-outline ontario-hide-for-small ontario-show-for-medium ontario-hide-for-large'\n\t\t\t\t\t\t: viewportSize === 'mobile'\n\t\t\t\t\t\t? 'ontario-header__menu-toggler ontario-header-button ontario-header-button--with-outline ontario-show-for-small-only'\n\t\t\t\t\t\t: 'ontario-header__menu-toggler ontario-header-button ontario-header-button--with-outline'\n\t\t\t\t}\n\t\t\t\tid={this.type === 'ontario' ? 'ontario-header-menu-toggler' : 'ontario-application-header-menu-toggler'}\n\t\t\t\taria-controls=\"ontario-navigation\"\n\t\t\t\taria-label={\n\t\t\t\t\tthis.menuToggle\n\t\t\t\t\t\t? this.translations.header.closeMenu[`${this.language}`]\n\t\t\t\t\t\t: this.translations.header.openMenu[`${this.language}`]\n\t\t\t\t}\n\t\t\t\tonClick={this.handleMenuToggle}\n\t\t\t\ttype=\"button\"\n\t\t\t\tref={\n\t\t\t\t\tviewportSize === 'desktop'\n\t\t\t\t\t\t? (el) => (this.menuButtonDesktop = el as HTMLInputElement)\n\t\t\t\t\t\t: viewportSize === 'tablet'\n\t\t\t\t\t\t? (el) => (this.menuButtonTablet = el as HTMLInputElement)\n\t\t\t\t\t\t: viewportSize === 'mobile'\n\t\t\t\t\t\t? (el) => (this.menuButtonMobile = el as HTMLInputElement)\n\t\t\t\t\t\t: (el) => (this.menuButton = el as HTMLInputElement)\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<span class=\"ontario-header__icon-container\" innerHTML={this.menuToggle ? OntarioIconClose : OntarioIconMenu} />\n\t\t\t\t<span>Menu</span>\n\t\t\t</button>\n\t\t);\n\t}\n\n\t/**\n\t * A helper function to generate navigation dropdown links with onBlur functionality. This is used for the application header.\n\t *\n\t * @param item - the menu item to be looped over (contains the title and href)\n\t * @param index\n\t * @param links - the number of links associated with the maxSubheader[size]Links in the application header info prop. This will determine how many links should be displayed in the dropdown.\n\t * @param viewportSize - the size of the viewport. It can be set to `desktop`, `tablet` or `mobile`.\n\t * @returns\n\t */\n\tprivate generateNavigationLinks(item: MenuItem, index: number, links: number | undefined, viewportSize: string) {\n\t\tconst lastLink =\n\t\t\tindex + 1 === (links ? this.menuItemState.length - links : this.menuItemState.length) ? true : false;\n\n\t\treturn this.generateMenuItem(\n\t\t\titem.href,\n\t\t\titem.title,\n\t\t\titem.linkIsActive,\n\t\t\tviewportSize,\n\t\t\t'',\n\t\t\titem.onClickHandler,\n\t\t\tlastLink,\n\t\t);\n\t}\n\n\t/**\n\t * The onEscapePressed function clears the searchbar form when Escape is pressed\n\t */\n\tprivate onEscapePressed(event: any) {\n\t\tif (event.key === 'Escape') {\n\t\t\tevent.path[0].value = '';\n\t\t}\n\t}\n\n\tprivate isMenuVisible(viewportSize: string) {\n\t\tconst { menuItemState, applicationHeaderInfoState } = this;\n\t\tconst { maxSubheaderMobileLinks, maxSubheaderTabletLinks, maxSubheaderDesktopLinks } =\n\t\t\tapplicationHeaderInfoState ?? {};\n\n\t\tconst numOfMenuItems = menuItemState?.length ?? 0;\n\n\t\tif (numOfMenuItems <= 0) {\n\t\t\treturn false;\n\t\t}\n\n\t\tif (viewportSize === 'mobile') {\n\t\t\treturn numOfMenuItems - (maxSubheaderMobileLinks ?? 0) > 0;\n\t\t}\n\n\t\tif (viewportSize === 'tablet') {\n\t\t\treturn numOfMenuItems - (maxSubheaderTabletLinks ?? 0) > 0;\n\t\t}\n\n\t\tif (viewportSize === 'desktop') {\n\t\t\treturn numOfMenuItems - (maxSubheaderDesktopLinks ?? 0) > 0;\n\t\t}\n\n\t\treturn true;\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.parseApplicationHeaderInfo();\n\t\tthis.parseMenuItems();\n\t\tthis.parseLanguage();\n\t}\n\n\tcomponentDidRender() {\n\t\tif (this.disableDynamicMenu === false && this.type === 'ontario') {\n\t\t\tthis.fetchOntarioMenu();\n\t\t}\n\t}\n\n\t/**\n\t * Handles the focus when menu/toggle button is clicked.\n\t * When search button is clicked, the search bar is in focus,\n\t * when the closed button is clicked, the search button is back into focus.\n\t * When the menu is closed, the menu button should be out of focus.\n\t */\n\tcomponentDidUpdate() {\n\t\tif (this.type == 'ontario') {\n\t\t\tif (this.searchToggle === true) this.searchBar.focus();\n\t\t\tif (this.searchToggle === false) this.searchButton.focus();\n\t\t\tif (this.menuToggle === false) this.menuButton.blur();\n\t\t}\n\t}\n\n\trender() {\n\t\tconst isServiceOntarioType = this.type === 'serviceOntario';\n\n\t\tif (this.type == 'ontario') {\n\t\t\treturn (\n\t\t\t\t<div>\n\t\t\t\t\t<div class=\"ontario-header__container\" ref={(el) => (this.header = el as HTMLInputElement)}>\n\t\t\t\t\t\t<header\n\t\t\t\t\t\t\tclass={this.searchToggle ? 'ontario-header ontario-header--search-open' : 'ontario-header'}\n\t\t\t\t\t\t\tid=\"ontario-header\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"ontario-row\">\n\t\t\t\t\t\t\t\t{/* Ontario header logo */}\n\t\t\t\t\t\t\t\t<div class=\"ontario-header__logo-container ontario-columns ontario-small-2 ontario-medium-4 ontario-large-3\">\n\t\t\t\t\t\t\t\t\t<a href={this.translations.header.logoLink[`${this.language}`]}>\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\tclass=\"ontario-show-for-medium\"\n\t\t\t\t\t\t\t\t\t\t\tsrc={this.getImageAssetSrcPath('ontario-logo--desktop.svg')}\n\t\t\t\t\t\t\t\t\t\t\talt={this.translations.header.logoAltText[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\tclass=\"ontario-show-for-small-only\"\n\t\t\t\t\t\t\t\t\t\t\tsrc={this.getImageAssetSrcPath('ontario-logo--mobile.svg')}\n\t\t\t\t\t\t\t\t\t\t\talt={this.translations.header.logoAltText[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t\t{/* Ontario header search input */}\n\t\t\t\t\t\t\t\t<form\n\t\t\t\t\t\t\t\t\tname=\"searchForm\"\n\t\t\t\t\t\t\t\t\tid=\"ontario-search-form-container\"\n\t\t\t\t\t\t\t\t\tonSubmit={this.handleSubmit}\n\t\t\t\t\t\t\t\t\tclass=\"ontario-header__search-container ontario-columns ontario-small-10 ontario-medium-offset-3 ontario-medium-6 ontario-large-offset-0 ontario-large-6\"\n\t\t\t\t\t\t\t\t\tnovalidate\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<label htmlFor=\"ontario-search-input-field\" class=\"ontario-show-for-sr\">\n\t\t\t\t\t\t\t\t\t\t{this.translations.header.search[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\tname=\"search\"\n\t\t\t\t\t\t\t\t\t\tid=\"ontario-search-input-field\"\n\t\t\t\t\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t\t\t\t\t\taria-autocomplete=\"none\"\n\t\t\t\t\t\t\t\t\t\tclassName=\"ontario-input ontario-header__search-input\"\n\t\t\t\t\t\t\t\t\t\trequired={true}\n\t\t\t\t\t\t\t\t\t\tref={(el) => (this.searchBar = el as HTMLInputElement)}\n\t\t\t\t\t\t\t\t\t\tonKeyDown={this.onEscapePressed}\n\t\t\t\t\t\t\t\t\t></Input>\n\t\t\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\t\t\tclassName=\"ontario-header__search-reset\"\n\t\t\t\t\t\t\t\t\t\tid=\"ontario-search-reset\"\n\t\t\t\t\t\t\t\t\t\ttype=\"reset\"\n\t\t\t\t\t\t\t\t\t\tvalue=\"\"\n\t\t\t\t\t\t\t\t\t\taria-label={this.translations.header.clearSearchField[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t></Input>\n\t\t\t\t\t\t\t\t\t<button class=\"ontario-header__search-submit\" id=\"ontario-search-submit\" type=\"submit\">\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-show-for-sr\">{this.translations.header.submit[`${this.language}`]}</span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-header__icon-container\" innerHTML={OntarioIconSearch} />\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</form>\n\n\t\t\t\t\t\t\t\t{/* Ontario header language toggle + menu button */}\n\t\t\t\t\t\t\t\t<div class=\"ontario-header__nav-right-container ontario-columns ontario-small-10 ontario-medium-8 ontario-large-3\">\n\t\t\t\t\t\t\t\t\t<ontario-language-toggle\n\t\t\t\t\t\t\t\t\t\turl={this.language === 'en' ? this.languageState?.frenchLink : this.languageState?.englishLink}\n\t\t\t\t\t\t\t\t\t\tsize=\"default\"\n\t\t\t\t\t\t\t\t\t\tcustomLanguageToggle={this.customLanguageToggle}\n\t\t\t\t\t\t\t\t\t></ontario-language-toggle>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tclass=\"ontario-header__search-toggler ontario-header-button ontario-header-button--without-outline ontario-hide-for-large\"\n\t\t\t\t\t\t\t\t\t\tid=\"ontario-header-search-toggler\"\n\t\t\t\t\t\t\t\t\t\taria-controls=\"ontario-search-form-container\"\n\t\t\t\t\t\t\t\t\t\tonClick={this.handleSearchToggle}\n\t\t\t\t\t\t\t\t\t\tref={(el) => (this.searchButton = el as HTMLInputElement)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-header__icon-container\" innerHTML={OntarioIconSearchWhite} />\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-show-for-medium ontario-show\">\n\t\t\t\t\t\t\t\t\t\t\t{this.translations.header.search[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t{this.renderMenuButton('ontario-header')}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div class=\"ontario-header__search-close-container ontario-columns ontario-small-2 ontario-medium-3\">\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tclass=\"ontario-header__search-close ontario-header-button ontario-header-button--without-outline\"\n\t\t\t\t\t\t\t\t\t\tid=\"ontario-header-search-close\"\n\t\t\t\t\t\t\t\t\t\taria-label={this.translations.header.closeSearch[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\tonClick={this.handleSearchToggle}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span aria-hidden={`${!this.searchToggle}`}>\n\t\t\t\t\t\t\t\t\t\t\t{this.translations.header.close[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-header__icon-container\" innerHTML={OntarioIconClose} />\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</header>\n\n\t\t\t\t\t\t{/* Ontario header navigation */}\n\t\t\t\t\t\t<nav\n\t\t\t\t\t\t\trole=\"navigation\"\n\t\t\t\t\t\t\tclass={this.menuToggle ? 'ontario-navigation ontario-navigation--open' : 'ontario-navigation'}\n\t\t\t\t\t\t\tid=\"ontario-navigation\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"ontario-navigation__container\">\n\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t{/*\n\t\t\t\t\t\t\t\t\t\tMaps through all the menu items, and the last item is set to lastLink.\n\t\t\t\t\t\t\t\t\t\tWhen the focus goes away from the lastLink, return the focus to the menu button\n\t\t\t\t\t\t\t\t\t\t(only applicable pressing the \"tab\" key, not actually clicking away from the menu).\n\t\t\t\t\t\t\t\t\t*/}\n\t\t\t\t\t\t\t\t\t{this.menuItemState?.map((item, index: number) => {\n\t\t\t\t\t\t\t\t\t\tconst lastLink = index + 1 === this.menuItemState.length;\n\t\t\t\t\t\t\t\t\t\tconst activeLinkRegex = item.title.replace(/\\s+/g, '-').toLowerCase();\n\t\t\t\t\t\t\t\t\t\tconst linkIsActive = window.location.pathname.includes(activeLinkRegex);\n\t\t\t\t\t\t\t\t\t\treturn this.isDynamicMenu\n\t\t\t\t\t\t\t\t\t\t\t? this.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\tlinkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'ontario-header',\n\t\t\t\t\t\t\t\t\t\t\t\t\t'ontario-header-navigation__menu-item',\n\t\t\t\t\t\t\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\t\t\t\t\t\t\tlastLink,\n\t\t\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t\t\t: this.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.linkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'ontario-header',\n\t\t\t\t\t\t\t\t\t\t\t\t\t'ontario-header-navigation__menu-item',\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.onClickHandler,\n\t\t\t\t\t\t\t\t\t\t\t\t\tlastLink,\n\t\t\t\t\t\t\t\t\t\t\t );\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</nav>\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.menuToggle && <div class=\"ontario-hide-for-large ontario-overlay\" />}\n\t\t\t\t</div>\n\t\t\t);\n\t\t} else {\n\t\t\treturn (\n\t\t\t\t<div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass=\"ontario-application-header-container\"\n\t\t\t\t\t\tid=\"ontario-application-header\"\n\t\t\t\t\t\tref={(el) => (this.header = el as HTMLInputElement)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{/* Ontario application header black bar */}\n\t\t\t\t\t\t<header class=\"ontario-application-header\" id=\"ontario-header\">\n\t\t\t\t\t\t\t<div class=\"ontario-row\">\n\t\t\t\t\t\t\t\t<div class=\"ontario-columns ontario-small-6 ontario-application-header__logo\">\n\t\t\t\t\t\t\t\t\t<a href={this.translations.header.logoLink[`${this.language}`]}>\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\tsrc={this.getImageAssetSrcPath('ontario-logo--desktop.svg')}\n\t\t\t\t\t\t\t\t\t\t\talt={this.translations.header.logoAltText[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div class=\"ontario-columns ontario-small-6 ontario-application-header__lang-toggle\">\n\t\t\t\t\t\t\t\t\t<ontario-language-toggle\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\turl={this.language === 'en' ? this.languageState?.frenchLink : this.languageState?.englishLink}\n\t\t\t\t\t\t\t\t\t\tcustomLanguageToggle={this.customLanguageToggle}\n\t\t\t\t\t\t\t\t\t></ontario-language-toggle>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</header>\n\n\t\t\t\t\t\t{/* Ontario application header subheader */}\n\t\t\t\t\t\t<div class=\"ontario-application-subheader-menu__container\">\n\t\t\t\t\t\t\t<section\n\t\t\t\t\t\t\t\tclass={`ontario-application-subheader ${isServiceOntarioType ? 'ontario-service-subheader' : ''}`}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div class=\"ontario-row\">\n\t\t\t\t\t\t\t\t\t<div class=\"ontario-columns ontario-small-12 ontario-application-subheader__container\">\n\t\t\t\t\t\t\t\t\t\t{!isServiceOntarioType ? (\n\t\t\t\t\t\t\t\t\t\t\t<p class=\"ontario-application-subheader__heading\">\n\t\t\t\t\t\t\t\t\t\t\t\t<a href={this.applicationHeaderInfoState?.href}>{this.applicationHeaderInfoState?.title}</a>\n\t\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<a href={this.applicationHeaderInfoState?.href} class=\"ontario-service-subheader__link\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"ontario-service-subheader__heading-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"ontario-service-subheader__heading\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{this.translations.header.serviceOntario[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"ontario-service-subheader__description\">{this.applicationHeaderInfoState?.title}</p>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t<div class=\"ontario-application-subheader__menu-container\">\n\t\t\t\t\t\t\t\t\t\t\t{/* Desktop subheader links */}\n\t\t\t\t\t\t\t\t\t\t\t{!!this.applicationHeaderInfoState?.maxSubheaderDesktopLinks && (\n\t\t\t\t\t\t\t\t\t\t\t\t<ul\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass={`${\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisServiceOntarioType\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'ontario-service-subheader__menu'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'ontario-application-subheader__menu'\n\t\t\t\t\t\t\t\t\t\t\t\t\t} ontario-show-for-large`}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.slice(0, this.applicationHeaderInfoState?.maxSubheaderDesktopLinks)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t.map((item) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.linkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'app-desktop',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.onClickHandler,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t\t\t\t{/* Tablet subheader links */}\n\t\t\t\t\t\t\t\t\t\t\t{!!this.applicationHeaderInfoState?.maxSubheaderTabletLinks && (\n\t\t\t\t\t\t\t\t\t\t\t\t<ul class=\"ontario-application-subheader__menu ontario-hide-for-small ontario-show-for-medium ontario-hide-for-large\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.slice(0, this.applicationHeaderInfoState?.maxSubheaderTabletLinks)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t.map((item) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.linkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'app-tablet',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.onClickHandler,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t\t\t\t{/* Mobile subheader links */}\n\t\t\t\t\t\t\t\t\t\t\t{!!this.applicationHeaderInfoState?.maxSubheaderMobileLinks && (\n\t\t\t\t\t\t\t\t\t\t\t\t<ul class=\"ontario-application-subheader__menu ontario-show-for-small-only\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.slice(0, this.applicationHeaderInfoState.maxSubheaderMobileLinks)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t.map((item) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.linkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'app-mobile',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.onClickHandler,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t\t\t\t{/* Render menu button if menuItemState exists, and if there are items to display in a dropdown menu */}\n\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState !== undefined &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderDesktopLinks !== this.menuItemState.length &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.renderMenuButton('desktop')}\n\n\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState !== undefined &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderTabletLinks !== this.menuItemState.length &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.renderMenuButton('tablet')}\n\n\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState !== undefined &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderMobileLinks !== this.menuItemState.length &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.renderMenuButton('mobile')}\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</section>\n\t\t\t\t\t\t\t<nav\n\t\t\t\t\t\t\t\trole=\"navigation\"\n\t\t\t\t\t\t\t\tclass={\n\t\t\t\t\t\t\t\t\tthis.menuToggle === true\n\t\t\t\t\t\t\t\t\t\t? 'ontario-application-navigation ontario-navigation--open'\n\t\t\t\t\t\t\t\t\t\t: 'ontario-application-navigation'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tid=\"ontario-application-navigation\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div class=\"ontario-application-navigation__container\">\n\t\t\t\t\t\t\t\t\t{/* Ontario application header desktop menu dropdown links */}\n\t\t\t\t\t\t\t\t\t<ul class=\"ontario-show-for-large\">\n\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t?.slice(this.applicationHeaderInfoState?.maxSubheaderDesktopLinks, this.menuItemState.length)\n\t\t\t\t\t\t\t\t\t\t\t.map((item: any, index) => {\n\t\t\t\t\t\t\t\t\t\t\t\treturn this.generateNavigationLinks(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderDesktopLinks,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'app-desktop',\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</ul>\n\n\t\t\t\t\t\t\t\t\t{/* Ontario application header tablet menu dropdown links */}\n\t\t\t\t\t\t\t\t\t<ul class=\"ontario-show-for-medium ontario-hide-for-small ontario-hide-for-large\">\n\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t?.slice(this.applicationHeaderInfoState?.maxSubheaderTabletLinks, this.menuItemState.length)\n\t\t\t\t\t\t\t\t\t\t\t.map((item, index) => {\n\t\t\t\t\t\t\t\t\t\t\t\treturn this.generateNavigationLinks(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderTabletLinks,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'app-tablet',\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</ul>\n\n\t\t\t\t\t\t\t\t\t{/* Ontario application header mobile menu dropdown links */}\n\t\t\t\t\t\t\t\t\t<ul class=\"ontario-show-for-small-only\">\n\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t?.slice(this.applicationHeaderInfoState?.maxSubheaderMobileLinks, this.menuItemState.length)\n\t\t\t\t\t\t\t\t\t\t\t.map((item, index) => {\n\t\t\t\t\t\t\t\t\t\t\t\treturn this.generateNavigationLinks(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderMobileLinks,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'app-mobile',\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</nav>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.menuToggle && <div class=\"ontario-hide-for-large ontario-overlay\" />}\n\t\t\t\t</div>\n\t\t\t);\n\t\t}\n\t}\n}\n"],"version":3}
1
+ {"file":"ontario-header.js","mappings":"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","names":["OntarioHeader"],"sources":["src/components/ontario-header/ontario-application-header.scss?tag=ontario-header&mode=application&encapsulation=shadow","src/components/ontario-header/ontario-header.scss?tag=ontario-header&mode=ontario&encapsulation=shadow","src/components/ontario-header/service-ontario-header.scss?tag=ontario-header&mode=serviceOntario&encapsulation=shadow","src/components/ontario-header/ontario-header.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/typography.variables' as typography;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\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\tfocusPlaceholders;\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/5-layout/_grid.layout.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/6-components/_text-inputs.component.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/7-overrides/_visibility.overrides.scss';\n\n$navigation-link-bg--hover: #e5e5e5;\n$navigation-max-width: 72rem;\n\n$ontario-application-header-menu-button-icon--margin-right: 6px;\n\n.ontario-application-header {\n\tdisplay: flex;\n\talign-items: center;\n\tbackground-color: colours.$ontario-colour-black;\n\tcolor: colours.$ontario-colour-white;\n\theight: 3.125rem !important;\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\n\t> .ontario-row {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t}\n}\n\n.ontario-application-header-container {\n\tposition: relative;\n\twidth: 100%;\n}\n\n.ontario-header-button.ontario-application-navigation--open {\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n}\n\n.ontario-header-button.ontario-application-navigation--closed {\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header-button--with-outline {\n\tborder: globalVariables.$border-size-standard solid colours.$ontario-colour-white;\n\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-4;\n\tpadding: 0.375rem spacing.$spacing-4;\n}\n\n.ontario-application-subheader .ontario-header-button,\n.ontario-application-navigation .ontario-header-button {\n\tbackground-color: colours.$ontario-greyscale-70;\n}\n\n.ontario-header-button--closed {\n\t&:focus {\n\t\tbox-shadow: none;\n\t\toutline: none;\n\t\ttransition: none;\n\t}\n}\n\n.ontario-application-header__logo,\n.ontario-application-header__logo a,\n.ontario-application-header__lang-toggle,\n.ontario-application-subheader__container,\n.ontario-application-subheader__menu-container,\n.ontario-application-subheader__menu {\n\tdisplay: flex;\n\talign-items: center;\n\toutline: none;\n}\n\n.ontario-application-header__logo a {\n\t&:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\ttransition: all 0.1s ease-in-out;\n\t}\n}\n\n.ontario-application-header__logo svg,\n.ontario-application-header__logo img {\n\twidth: 100px;\n\theight: 25px;\n}\n\n.ontario-application-header__lang-toggle {\n\tjustify-content: flex-end;\n\n\ta {\n\t\tfont-size: globalFunctions.px-to-rem(16);\n\t\tline-height: globalFunctions.px-to-rem(22);\n\t\theight: auto;\n\t\toutline: none;\n\t\tpadding: spacing.$spacing-2 spacing.$spacing-3;\n\t}\n}\n\n/* Ontario application subheader styles */\n.ontario-application-subheader {\n\tpadding: (spacing.$spacing-2 + spacing.$spacing-3) 0;\n\tbackground-color: darken(colours.$ontario-colour-white, 75);\n\toverflow: visible;\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: zIndex.$ontario-z-index-neutral;\n\t}\n\n\t& > .ontario-row {\n\t\tposition: relative;\n\t}\n}\n\n.ontario-application-header-container {\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n}\n\n.ontario-application-header > .ontario-row {\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.ontario-application-subheader .ontario-header-button {\n\tvisibility: visible;\n}\n\n.ontario-application-subheader .ontario-header-button,\n.ontario-application-navigation .ontario-header-button {\n\tbackground-color: colours.$ontario-greyscale-70;\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header-button--without-outline {\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\toutline: 4px solid transparent;\n\t\ttransition: all 0.1s ease-in-out;\n\t}\n}\n\n.ontario-application-subheader__heading {\n\tpadding: 0.375rem spacing.$spacing-0;\n\t@extend %h4-styles;\n\tmargin-bottom: spacing.$spacing-0;\n\tmax-width: 65%;\n\n\ta {\n\t\tcolor: colours.$ontario-colour-white;\n\t\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\t\ttext-decoration: none;\n\n\t\t&:focus {\n\t\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\t\ttransition: all 0.1s ease-in-out;\n\t\t}\n\n\t\t&:hover,\n\t\t&:active,\n\t\t&:visited {\n\t\t\tcolor: colours.$ontario-colour-white;\n\t\t\ttext-decoration: underline;\n\t\t}\n\t}\n}\n\n.ontario-application-subheader .ontario-header-button {\n\tvisibility: visible;\n\tbackground-color: colours.$ontario-greyscale-70;\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header__menu-toggler {\n\tspan {\n\t\tdisplay: flex;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\t&:last-of-type {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t}\n\t}\n\n\tsvg {\n\t\tmargin-right: $ontario-application-header-menu-button-icon--margin-right;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-0;\n\t\t}\n\t}\n}\n\n.ontario-application-subheader__container {\n\talign-items: center;\n\tjustify-content: space-between;\n}\n\n.ontario-application-subheader__menu {\n\tdisplay: flex;\n\talign-items: center;\n\tlist-style: none;\n\tmargin: spacing.$spacing-0;\n\tpadding-left: spacing.$spacing-0;\n\n\tli {\n\t\tborder-radius: globalVariables.$global-radius;\n\t\tpadding: spacing.$spacing-0;\n\t\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-3;\n\t\ttext-align: center;\n\t}\n}\n\n.ontario-application-subheader__menu-container a {\n\tbox-sizing: border-box;\n\tborder-radius: globalVariables.$global-radius;\n\tcolor: colours.$ontario-colour-white;\n\tdisplay: inline-block;\n\tfont-family: typography.$ontario-font-open-sans;\n\tfont-size: globalFunctions.px-to-rem(18);\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\theight: globalVariables.$standard-input-height;\n\tline-height: globalFunctions.px-to-rem(23);\n\toutline: none;\n\tpadding: spacing.$spacing-3;\n\ttext-align: left;\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\t&.ontario-link--active {\n\t\tborder-radius: globalVariables.$global-radius globalVariables.$global-radius 0 0;\n\t\tborder-bottom: globalVariables.$global-radius solid colours.$ontario-colour-white;\n\t}\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\ttransition: all 0.1s ease-in-out;\n\t}\n}\n\n.ontario-application-navigation {\n\tposition: absolute;\n\twidth: 100%;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tposition: relative;\n\t\tmax-width: $navigation-max-width;\n\t\twidth: auto;\n\t\tmargin: spacing.$spacing-0 auto;\n\t}\n}\n\n.ontario-application-navigation .ontario-header-button {\n\tvisibility: hidden;\n\tposition: absolute;\n\ttop: (-(spacing.$spacing-9) + -(spacing.$spacing-1));\n\tright: spacing.$spacing-4;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 2);\n}\n\n.ontario-application-navigation__container {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttop: 0;\n\twidth: 100%;\n\tz-index: zIndex.$ontario-z-index-above-high;\n\n\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\tbackground: colours.$ontario-colour-white;\n\t\tposition: absolute;\n\t\tz-index: zIndex.$ontario-z-index-above-high;\n\t}\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tbox-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);\n\t\tborder-radius: globalVariables.$global-radius;\n\t\tposition: absolute;\n\t\tright: spacing.$spacing-3;\n\t\ttop: -0.6rem;\n\t\tmin-width: 290px;\n\t\tmax-width: 30%;\n\t\tz-index: calc(zIndex.$ontario-z-index-above-medium + 1);\n\t\ttransition: none !important;\n\t}\n}\n\n.ontario-application-navigation ul {\n\tlist-style: none;\n\tpadding: spacing.$spacing-2 spacing.$spacing-0;\n\tmargin: spacing.$spacing-0;\n\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tborder-bottom: none;\n\t}\n}\n\n.ontario-application-navigation li {\n\tborder-top: 1px solid colours.$ontario-greyscale-20;\n\tpadding: spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\t}\n}\n\n.ontario-application-navigation a {\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: block;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\ttext-decoration: none;\n\tpadding: calc(spacing.$spacing-3 - math.div(spacing.$spacing-1, 3.25)) spacing.$spacing-5;\n\n\t&:hover {\n\t\ttext-decoration: underline;\n\t\tbackground-color: $navigation-link-bg--hover;\n\t}\n\n\t&:active {\n\t\ttext-decoration: underline;\n\t\tbackground-color: colours.$ontario-greyscale-20;\n\t}\n\n\t&:focus,\n\t&:active {\n\t\t@extend %ontario-focus;\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow inset;\n\t}\n\n\t&.ontario-link--active {\n\t\tborder-left: 6px solid colours.$ontario-colour-black;\n\t\tbackground-color: colours.$ontario-greyscale-5;\n\t}\n}\n\n.ontario-navigation--open {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-navigation--closed {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n}\n\n.ontario-application-navigation.ontario-navigation--open .ontario-application-navigation__container {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\ttransition: none;\n\t\tdisplay: block;\n\t}\n}\n\n.ontario-overlay {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(0, 0, 0, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n.ontario-header-button.ontario-navigation--open {\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header-button.ontario-navigation--closed {\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n/* Header buttons */\n.ontario-header-button {\n\tbackground-color: colours.$ontario-colour-black;\n\tborder: none;\n\tborder-radius: globalVariables.$global-radius;\n\tbox-sizing: border-box;\n\tbox-shadow: none;\n\tcolor: colours.$ontario-colour-white;\n\tcursor: pointer;\n\n\tdisplay: flex;\n\talign-items: center;\n\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\theight: globalVariables.$standard-input-height;\n\tline-height: math.div(14, 9);\n\ttext-align: center;\n\ttext-decoration: none;\n\n\t&:focus {\n\t\t@extend %ontario-focus;\n\t}\n\n\t&:hover,\n\t&:focus,\n\t&:visited {\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n}\n\n.ontario-header-button--with-outline,\n.ontario-header-button--without-outline {\n\tbackground-color: colours.$ontario-colour-black;\n\tcolor: colours.$ontario-colour-white;\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n}\n\n.ontario-header-button--with-outline {\n\tborder: 2px solid colours.$ontario-colour-white;\n\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-4;\n\tpadding: math.div(spacing.$spacing-3, 2) spacing.$spacing-4;\n\n\t&:hover {\n\t\tborder: 2px solid colours.$ontario-colour-white;\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\tpadding: math.div(spacing.$spacing-3, 2);\n\t}\n}\n\n.ontario-header__menu-toggler {\n\tpadding: math.div(spacing.$spacing-3, 2) spacing.$spacing-4;\n\n\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\tpadding-left: spacing.$spacing-2;\n\t\tpadding-right: spacing.$spacing-2;\n\t}\n\n\tspan {\n\t\tdisplay: flex;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\tsvg {\n\t\tmargin-right: 6px;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-0;\n\t\t}\n\t}\n}\n\n.ontario-application-navigation__container {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tbox-shadow: 0 globalVariables.$global-radius 12px rgba(0, 0, 0, 0.3);\n\t\tborder-radius: globalVariables.$global-radius;\n\t\tdisplay: none;\n\t\tposition: absolute;\n\t\tright: spacing.$spacing-4;\n\t\ttop: calc(100% - #{spacing.$spacing-2});\n\t\tmin-width: 290px; // this value is to control the min-width size the dropdown navigation list can be\n\t\tmax-width: 30%;\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-application-navigation.ontario-navigation--open .ontario-application-navigation__container {\n\tbackground: colours.$ontario-colour-white;\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\ttransition: none;\n\t\tdisplay: block;\n\t}\n}\n\n.ontario-application-navigation.ontario-navigation--open {\n\tbackground: colours.$ontario-colour-white;\n\tz-index: zIndex.$ontario-z-index-above-high;\n}\n\n.ontario-application-navigation ul {\n\tlist-style: none;\n\tpadding: spacing.$spacing-2 spacing.$spacing-0;\n\tmargin: spacing.$spacing-0;\n\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tborder-bottom: none;\n\t}\n}\n\n.ontario-application-navigation li {\n\tborder-top: 1px solid colours.$ontario-greyscale-20;\n\tpadding: spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\t}\n}\n\n.ontario-application-navigation a {\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: block;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\ttext-decoration: none;\n\tpadding: (spacing.$spacing-3 - math.div(spacing.$spacing-1, 3.25)) spacing.$spacing-5;\n\n\t&:hover {\n\t\ttext-decoration: underline;\n\t\tbackground-color: $navigation-link-bg--hover;\n\t}\n\n\t&:active {\n\t\ttext-decoration: underline;\n\t\tbackground-color: colours.$ontario-greyscale-20;\n\t}\n\n\t&:focus,\n\t&:active {\n\t\t@extend %ontario-focus;\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow inset;\n\t}\n\n\t&.ontario-link--active {\n\t\tborder-left: 6px solid colours.$ontario-colour-black;\n\t\tbackground-color: colours.$ontario-greyscale-5;\n\t}\n}\n\n/* Ontario application header overlay styles */\n.ontario-overlay {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(0, 0, 0, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n/* Ontario header helper styles */\n.ontario-header__icon-container {\n\tdisplay: flex;\n\talign-items: center;\n}\n","@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/typography.variables' as typography;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\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\tfocusPlaceholders;\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/line-heights.variables' as lineHeights;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/5-layout/_grid.layout.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/6-components/_text-inputs.component.scss';\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/7-overrides/_visibility.overrides.scss';\n\n$ontario-search-padding: 7.2rem;\n$ontario-search-padding--mobile: 6.4rem;\n\n$ontario-header-logo-width: 180px;\n$ontario-header-logo-width--mobile: 45px;\n\n$ontario-header-custom-breakpoint: 39.9375em;\n\n$ontario-header-menu-button-icon--margin-right: 6px;\n\n$ontario-navigation-container-min-width: 290px;\n\n:host {\n\t--header-search-reset: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTE5IDYuNEwxNy42IDUgMTIgMTAuNiA2LjQgNSA1IDYuNGw1LjYgNS42TDUgMTcuNiA2LjQgMTlsNS42LTUuNiA1LjYgNS42IDEuNC0xLjQtNS42LTUuNkwxOSA2LjR6IiBmaWxsPSIjMDAwIi8+PC9zdmc+);\n}\n\n.ontario-header__container {\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: zIndex.$ontario-z-index-above-low;\n\t}\n}\n\n.ontario-icon-container {\n\tdisplay: flex;\n\talign-items: center;\n}\n\n.ontario-icon-container-reset {\n\tdisplay: flex;\n\talign-items: center;\n\n\tsvg {\n\t\tfill: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-subheader__menu a {\n\tborder-radius: globalVariables.$global-radius;\n\tcolor: colours.$ontario-colour-white;\n\tdisplay: inline;\n\tfont-family: typography.$ontario-font-open-sans;\n\tfont-size: globalFunctions.px-to-rem(18);\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\theight: globalVariables.$standard-input-height;\n\tline-height: globalFunctions.px-to-rem(23);\n\tpadding: spacing.$spacing-3 spacing.$spacing-4;\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\t&.ontario-link--active {\n\t\tborder-radius: 4px 4px 0 0;\n\t\tborder-bottom: 4px solid colours.$ontario-colour-white;\n\t}\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\toutline: 4px solid transparent;\n\t\ttransition: all 0.1s ease-in-out;\n\t}\n}\n\n.ontario-navigation {\n\tposition: absolute;\n\twidth: 100%;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tposition: relative;\n\t\tmax-width: 72rem;\n\t\twidth: auto;\n\t\tmargin: spacing.$spacing-0 auto;\n\t}\n}\n\n.nav-ul-closed {\n\tbackground: white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n}\n\n.nav-ul-opened {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-navigation ul {\n\tlist-style: none;\n\tpadding: spacing.$spacing-2 spacing.$spacing-0;\n\tmargin: spacing.$spacing-0;\n\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tborder-bottom: none;\n\t}\n}\n\n.ontario-navigation li {\n\tborder-top: 1px solid colours.$ontario-greyscale-20;\n\tpadding: spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\t}\n}\n\n.ontario-navigation a {\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: block;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\ttext-decoration: none;\n\tpadding: calc(spacing.$spacing-3 - math.div(spacing.$spacing-1, 3.25)) spacing.$spacing-5;\n\n\t&:hover {\n\t\ttext-decoration: underline;\n\t\tbackground-color: darken(colours.$ontario-greyscale-5, 5);\n\t}\n\n\t&:active {\n\t\ttext-decoration: underline;\n\t\tbackground-color: colours.$ontario-greyscale-20;\n\t}\n\n\t&:focus,\n\t&:active {\n\t\t@extend %ontario-focus;\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow inset;\n\t}\n\n\t&.ontario-link--active {\n\t\tborder-left: 6px solid colours.$ontario-colour-black;\n\t\tbackground-color: colours.$ontario-greyscale-5;\n\t}\n}\n\n.ontario-overlay {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(0, 0, 0, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n.ontario-header {\n\tposition: relative;\n\toverflow: hidden;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\tbackground-color: colours.$ontario-colour-black;\n\tcolor: colours.$ontario-colour-white;\n\tdisplay: flex;\n\talign-items: center;\n\theight: 5.75rem;\n\n\t.ontario-row {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: flex-end;\n\t}\n\n\tsvg {\n\t\twidth: spacing.$spacing-6;\n\t\theight: spacing.$spacing-6;\n\t\tmargin-bottom: spacing.$spacing-0;\n\t}\n}\n\n.ontario-header__logo-container {\n\ta {\n\t\tdisplay: inline-flex;\n\t\theight: 100%;\n\t\toutline: none;\n\n\t\t&:focus {\n\t\t\tbox-shadow: 0 0 0 globalVariables.$global-radius colours.$ontario-colour-focus;\n\t\t}\n\n\t\timg {\n\t\t\twidth: $ontario-header-logo-width--mobile;\n\t\t\theight: globalVariables.$ontario-logo-height;\n\n\t\t\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\t\t\twidth: $ontario-header-logo-width;\n\t\t\t\theight: globalVariables.$ontario-logo-height;\n\t\t\t}\n\t\t}\n\t}\n}\n\n.ontario-navigation__container.ontario-navigation--open {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-navigation__container.ontario-navigation--closed {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n}\n\n.ontario-header-button.ontario-navigation--open {\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header-button.ontario-navigation--closed {\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-black;\n\t}\n}\n\n.ontario-header__logo-container {\n\theight: globalVariables.$ontario-logo-height;\n\n\tsvg {\n\t\twidth: $ontario-header-logo-width--mobile;\n\t\theight: globalVariables.$ontario-logo-height;\n\n\t\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\t\twidth: $ontario-header-logo-width;\n\t\t\theight: globalVariables.$ontario-logo-height;\n\t\t}\n\t}\n}\n\n.ontario-header__logo-container a {\n\tdisplay: inline-block;\n\theight: 100%;\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 globalVariables.$global-radius colours.$ontario-colour-focus;\n\t}\n}\n\n/* Ontario heaader search styles */\n.ontario-header__search-container {\n\tposition: relative;\n\tdisplay: none;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tdisplay: flex;\n\t}\n\n\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\tpadding-right: math.div(2rem, 2);\n\t}\n}\n\n.ontario-input.ontario-header__search-input {\n\tborder-width: 0;\n\tmargin-bottom: spacing.$spacing-0;\n\theight: globalVariables.$standard-input-height;\n\tpadding-left: spacing.$spacing-3;\n\tpadding-right: $ontario-search-padding;\n\n\t&:invalid + input[type='reset'] {\n\t\tdisplay: none;\n\t}\n\n\t&:focus {\n\t\t& ~ .ontario-header__search-submit {\n\t\t\tbackground-color: colours.$ontario-colour-link;\n\t\t\tcolor: colours.$ontario-colour-white;\n\n\t\t\tsvg {\n\t\t\t\tfill: colours.$ontario-colour-white;\n\t\t\t}\n\n\t\t\t&:hover {\n\t\t\t\tbackground-color: colours.$ontario-colour-link--hover;\n\t\t\t\tcolor: colours.$ontario-colour-white;\n\t\t\t}\n\t\t}\n\t}\n\n\t// Remove auto X icon for IE and Edge on input area\n\t&::-ms-clear {\n\t\tdisplay: none;\n\t\twidth: 0;\n\t\theight: 0;\n\t}\n\n\t// Remove red outline around input area on Firefox\n\t&:invalid:focus {\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow;\n\t\t-moz-box-shadow: none;\n\t}\n\n\t&:invalid:not(:focus) {\n\t\tbox-shadow: none;\n\t\t-moz-box-shadow: none;\n\t}\n\n\t@media screen and (min-width: breakpoints.$small-breakpoint) and (max-width: breakpoints.$medium-breakpoint) {\n\t\tpadding-left: spacing.$spacing-4;\n\t\tpadding-right: $ontario-search-padding--mobile;\n\t}\n}\n\n.ontario-header__search-submit {\n\tborder: 0;\n\tborder-radius: 0 3px 3px 0;\n\tbackground-color: colours.$ontario-greyscale-5;\n\tcolor: colours.$ontario-colour-black;\n\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\n\tfont-family: typography.$ontario-font-open-sans;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-size: 1.125rem;\n\theight: 100%;\n\tline-height: lineHeights.$ontario-line-height-8;\n\n\tposition: absolute;\n\tright: spacing.$spacing-4;\n\ttop: spacing.$spacing-0;\n\tcursor: pointer;\n\n\tpadding-left: spacing.$spacing-3;\n\tpadding-right: spacing.$spacing-3;\n\n\tsvg {\n\t\tfill: colours.$ontario-colour-black;\n\t}\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-colour-link--hover;\n\t\tcolor: colours.$ontario-colour-white;\n\n\t\tsvg {\n\t\t\tfill: colours.$ontario-colour-white;\n\t\t}\n\t}\n\n\t&:focus {\n\t\toutline: none;\n\t\tbox-shadow: 0 0 0 globalVariables.$global-radius colours.$ontario-colour-focus;\n\t\tbackground-color: colours.$ontario-colour-link--hover;\n\t\tcolor: colours.$ontario-colour-white;\n\n\t\tsvg {\n\t\t\tfill: colours.$ontario-colour-white;\n\t\t}\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-link--active;\n\t\tcolor: colours.$ontario-colour-white;\n\n\t\tsvg {\n\t\t\tfill: colours.$ontario-colour-white;\n\t\t}\n\t}\n\n\tsvg {\n\t\tmargin-right: spacing.$spacing-0;\n\t}\n}\n\ninput[type='reset'].ontario-header__search-reset {\n\tposition: absolute;\n\tdisplay: flex;\n\talign-items: center;\n\ttop: 11px;\n\tright: 80px;\n\theight: 28px;\n\twidth: 28px;\n\tcolor: colours.$ontario-colour-black;\n\tmargin: spacing.$spacing-0;\n\tpadding: spacing.$spacing-2;\n\tbackground-image: var(--header-search-reset);\n\tbackground-position: center center;\n\tbackground-repeat: no-repeat;\n\tbackground-color: transparent;\n\toutline: none;\n\tborder: none;\n\tcursor: pointer;\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 globalVariables.$global-radius colours.$ontario-colour-focus;\n\t}\n}\n\n/* Header menu & language toggle & close search button styles */\n.ontario-header__nav-right-container {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: flex-end;\n}\n\n/* Header buttons */\n.ontario-header-button {\n\tbackground-color: colours.$ontario-colour-black;\n\tborder: none;\n\tborder-radius: globalVariables.$global-radius;\n\tbox-sizing: border-box;\n\tbox-shadow: none;\n\tcolor: colours.$ontario-colour-white;\n\tcursor: pointer;\n\tdisplay: flex;\n\talign-items: center;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\theight: globalVariables.$standard-input-height;\n\tline-height: math.div(14, 9);\n\ttext-align: center;\n\ttext-decoration: none;\n\n\t&:focus {\n\t\t@extend %ontario-focus;\n\t}\n\n\t&:hover,\n\t&:focus,\n\t&:visited {\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n}\n\n.ontario-header-button--with-outline,\n.ontario-header-button--without-outline {\n\tbackground-color: colours.$ontario-colour-black;\n\tcolor: colours.$ontario-colour-white;\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-greyscale-60;\n\t}\n}\n\n.ontario-header-button--with-outline {\n\tborder: 2px solid colours.$ontario-colour-white;\n\tmargin: spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-0 spacing.$spacing-4;\n\tpadding: math.div(spacing.$spacing-3, 2) spacing.$spacing-4;\n\n\t&:hover {\n\t\tborder: 2px solid colours.$ontario-colour-white;\n\t\tcolor: colours.$ontario-colour-white;\n\t}\n\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n\n\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\tpadding: math.div(spacing.$spacing-3, 2);\n\t}\n}\n\n.ontario-header-button--without-outline {\n\t&:focus {\n\t\tbackground-color: colours.$ontario-greyscale-70;\n\t}\n}\n\n.ontario-header__menu-toggler {\n\tpadding: math.div(spacing.$spacing-3, 2) spacing.$spacing-4;\n\n\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\tpadding-left: spacing.$spacing-2;\n\t\tpadding-right: spacing.$spacing-2;\n\t}\n\n\tspan {\n\t\tdisplay: flex;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\tsvg {\n\t\tmargin-right: $ontario-header-menu-button-icon--margin-right;\n\n\t\t@media screen and (max-width: breakpoints.$xsmall-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-0;\n\t\t}\n\t}\n}\n\n.ontario-header__language-toggler {\n\tpadding: spacing.$spacing-3;\n\n\tabbr[title] {\n\t\ttext-decoration: none;\n\t}\n}\n\n.ontario-header__search-toggler {\n\tpadding: spacing.$spacing-2 spacing.$spacing-3;\n\tmargin-left: spacing.$spacing-4;\n\n\tsvg {\n\t\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-1;\n\t\t}\n\t}\n}\n\n.ontario-header__search-close {\n\tflex-direction: column-reverse;\n\tfont-weight: fontWeights.$ontario-font-weights-normal;\n\tmargin-right: spacing.$spacing-4;\n\tpadding: math.div(spacing.$spacing-5, 10) spacing.$spacing-1;\n\tposition: relative;\n\theight: 60px;\n\tdisplay: none;\n\n\tspan {\n\t\tposition: relative;\n\t\ttop: -3px;\n\t\tfont-size: spacing.$spacing-4;\n\t\tmargin-left: spacing.$spacing-0;\n\n\t\t&:last-of-type {\n\t\t\ttop: 0;\n\t\t\theight: 1.875rem;\n\t\t}\n\n\t\t@media screen and (min-width: $ontario-header-custom-breakpoint) {\n\t\t\tmargin-right: spacing.$spacing-1;\n\t\t}\n\n\t\t&:hover,\n\t\t&:focus {\n\t\t\toutline: none;\n\t\t\ttext-decoration: none;\n\t\t}\n\t}\n\n\tsvg {\n\t\ttop: 0;\n\t}\n\n\t@media screen and (min-width: breakpoints.$small-breakpoint) {\n\t\tflex-direction: row;\n\t\tpadding: spacing.$spacing-1 spacing.$spacing-2 spacing.$spacing-1 spacing.$spacing-4;\n\t\theight: globalVariables.$standard-input-height;\n\n\t\tspan {\n\t\t\ttop: 0;\n\t\t}\n\n\t\tsvg {\n\t\t\tposition: relative;\n\t\t\twidth: spacing.$spacing-7;\n\t\t\theight: spacing.$spacing-7;\n\t\t}\n\t}\n}\n\n.ontario-header--search-open .ontario-header__search-close {\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tdisplay: none;\n\t}\n}\n\n.ontario-header__search-close-container {\n\tdisplay: none;\n\tjustify-content: flex-end;\n\tpadding-right: 0;\n\n\t@media screen and (max-width: breakpoints.$small-breakpoint) {\n\t\twidth: auto;\n\t\tpadding-left: 0;\n\t\tpadding-right: 0;\n\t}\n}\n\n@media screen and (max-width: breakpoints.$medium-breakpoint) {\n\t.ontario-header--search-open .ontario-header__logo-container,\n\t.ontario-header--search-open .ontario-header__nav-right-container {\n\t\tdisplay: none;\n\t}\n\n\t.ontario-header--search-open .ontario-header__search-close-container,\n\t.ontario-header--search-open .ontario-header__search-container,\n\t.ontario-header--search-open .ontario-header__search-close {\n\t\tdisplay: flex;\n\t}\n}\n\n/* Ontario header navigation styles */\n.ontario-navigation {\n\tposition: absolute;\n\twidth: 100%;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tposition: relative;\n\t\tmax-width: 72rem;\n\t\twidth: auto;\n\t\tmargin: spacing.$spacing-0 auto;\n\t}\n}\n\n.ontario-navigation__container {\n\tbackground: colours.$ontario-colour-white;\n\tposition: absolute;\n\ttransform: translateY(-100%);\n\ttransition: transform 0.3s ease-in-out, visibility 0.1s ease;\n\twidth: 100%;\n\tvisibility: hidden;\n\tz-index: zIndex.$ontario-z-index-above-high;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tbox-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);\n\t\tborder-radius: 4px;\n\t\tdisplay: none;\n\t\tposition: absolute;\n\t\tright: spacing.$spacing-4;\n\t\ttop: calc(100% - #{spacing.$spacing-2});\n\t\tmin-width: $ontario-navigation-container-min-width;\n\t\tmax-width: 30%;\n\t\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\t}\n}\n\n.ontario-navigation ul {\n\tlist-style: none;\n\tpadding: spacing.$spacing-2 spacing.$spacing-0;\n\tmargin: spacing.$spacing-0;\n\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tborder-bottom: none;\n\t}\n}\n\n.ontario-header-navigation__menu-item {\n\tborder-top: 1px solid colours.$ontario-greyscale-20;\n\tpadding: spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\n\t&:last-of-type {\n\t\tborder-bottom: 1px solid colours.$ontario-greyscale-20;\n\t}\n}\n\n.ontario-navigation a {\n\tcolor: colours.$ontario-colour-black;\n\tdisplay: block;\n\tfont-size: 1.125rem;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tfont-family: typography.$ontario-font-open-sans;\n\ttext-decoration: none;\n\tpadding: (spacing.$spacing-3 - math.div(spacing.$spacing-1, 3.25)) spacing.$spacing-5;\n\n\t&:hover {\n\t\ttext-decoration: underline;\n\t\tbackground-color: darken(colours.$ontario-greyscale-5, 5);\n\t}\n\n\t&:active {\n\t\ttext-decoration: underline;\n\t\tbackground-color: colours.$ontario-greyscale-20;\n\t}\n\n\t&:focus,\n\t&:active {\n\t\t@extend %ontario-focus;\n\t\tbox-shadow: focusPlaceholders.$ontario-focus-box-shadow inset;\n\t}\n\n\t&.ontario-link--active {\n\t\tborder-left: 6px solid colours.$ontario-colour-black;\n\t\tbackground-color: colours.$ontario-greyscale-5;\n\t}\n}\n\n.ontario-navigation.ontario-navigation--open .ontario-navigation__container {\n\tvisibility: visible;\n\ttransform: translateY(0);\n\ttransition: transform 0.4s ease-in-out;\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\ttransition: none;\n\t\tdisplay: block;\n\t}\n}\n\n/* Ontario header overlay styles */\n.ontario-overlay {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(0, 0, 0, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n/* Ontario header helper styles */\n.ontario-header__icon-container {\n\tdisplay: flex;\n\talign-items: center;\n}\n\n// Fractal component style coverage ↓\n.ontario-navigation .ontario-header-button {\n\tvisibility: hidden;\n\tposition: absolute;\n\tright: spacing.$spacing-4;\n\tz-index: 6;\n\n\tsvg {\n\t\twidth: 2rem;\n\t\theight: 2rem;\n\t\tmargin-bottom: 0;\n\t}\n}\n\n.ontario-navigation--open .ontario-navigation .ontario-header-button {\n\tvisibility: visible;\n}\n\n.ontario-header + .ontario-navigation .ontario-header-button {\n\ttop: -4.35rem;\n}\n","@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/typography.variables' as typography;\n@use '@ongov/ontario-design-system-global-styles/dist/styles/scss/2-tools/functions/global.functions' as globalFunctions;\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/z-index.variables' as zIndex;\n@use './ontario-application-header.scss';\n\n.ontario-service-header {\n\theight: 3.125rem;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n}\n\n.ontario-service-header__logo,\n.ontario-service-header__logo a,\n.ontario-service-header__lang-toggle,\n.ontario-service-subheader__container,\n.ontario-service-subheader__menu-container,\n.ontario-service-subheader__menu {\n\tdisplay: flex;\n}\n\n.ontario-service-header__logo img {\n\twidth: 100px;\n\theight: 25px;\n}\n\n.ontario-service-header__lang-toggle {\n\tjustify-content: flex-end;\n\n\ta {\n\t\tfont-size: globalFunctions.px-to-rem(16);\n\t\tline-height: globalFunctions.px-to-rem(22);\n\t\theight: auto;\n\t\tpadding: spacing.$spacing-2 spacing.$spacing-3;\n\t}\n}\n\n.ontario-service-subheader {\n\tpadding: spacing.$spacing-4 spacing.$spacing-0;\n\tbackground-color: colours.$ontario-colour-service-ontario-header-brand;\n\toverflow: hidden;\n\tposition: relative;\n\tz-index: calc(zIndex.$ontario-z-index-above-high + 1);\n\n\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\tz-index: zIndex.$ontario-z-index-neutral;\n\t}\n\n\t& > .ontario-row {\n\t\tposition: relative;\n\t}\n}\n\n.ontario-service-subheader .ontario-header-button {\n\tdisplay: flex;\n}\n\n.ontario-service-subheader .ontario-header-button {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-brand;\n\n\t.ontario-icon {\n\t\twidth: 2rem;\n\t\theight: 2rem;\n\t\tmargin-bottom: spacing.$spacing-0;\n\t}\n\n\t&:hover {\n\t\tbackground-color: colours.$ontario-colour-service-ontario-header-hover;\n\t}\n\n\t&:active {\n\t\tbackground-color: colours.$ontario-colour-service-ontario-header-active;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 4px colours.$ontario-colour-service-ontario-header-focus;\n\t}\n}\n\n.ontario-service-subheader__link {\n\ttext-decoration: none;\n}\n\n.ontario-service-subheader__heading-container {\n\ta & {\n\t\tcolor: colours.$ontario-colour-white;\n\t\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\t\ttext-decoration: none;\n\n\t\t&:hover,\n\t\t&:active,\n\t\t&:visited {\n\t\t\tcolor: colours.$ontario-colour-white;\n\t\t\ttext-decoration: underline;\n\t\t}\n\n\t\t&:focus {\n\t\t\tbox-shadow: 0 0 0 4px colours.$ontario-colour-service-ontario-header-focus;\n\t\t}\n\t}\n}\n\n.ontario-service-subheader__heading {\n\t@extend %h3-styles;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\tpadding: spacing.$spacing-0 spacing.$spacing-0 math.div(spacing.$spacing-1, 2) spacing.$spacing-0;\n\tmargin-bottom: spacing.$spacing-0;\n\ttext-decoration: none;\n}\n\n.ontario-service-subheader__description {\n\tpadding: math.div(spacing.$spacing-1, 2) spacing.$spacing-0 spacing.$spacing-1 spacing.$spacing-0;\n\t@extend %h5-styles;\n\tmargin-bottom: spacing.$spacing-0;\n\tcolor: colours.$ontario-colour-white;\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\ttext-decoration: none;\n}\n\n.ontario-service-subheader__container {\n\talign-items: center;\n\tjustify-content: space-between;\n}\n\n.ontario-service-subheader__menu {\n\tlist-style: none;\n\tmargin: spacing.$spacing-0;\n\tpadding-left: spacing.$spacing-0;\n\talign-items: center;\n}\n\n.ontario-service-subheader__menu li {\n\tpadding: spacing.$spacing-0;\n\tmargin-left: spacing.$spacing-4;\n}\n\n.ontario-service-subheader__menu a {\n\tborder-radius: globalVariables.$global-radius;\n\tcolor: colours.$ontario-colour-white;\n\tdisplay: block;\n\tfont-family: typography.$ontario-font-open-sans;\n\tfont-size: globalFunctions.px-to-rem(18);\n\tfont-weight: fontWeights.$ontario-font-weights-semi-bold;\n\theight: globalVariables.$standard-input-height;\n\tline-height: globalFunctions.px-to-rem(23);\n\tpadding: spacing.$spacing-3;\n\ttext-decoration: none;\n\twhite-space: nowrap;\n\n\t&.ontario-link--active {\n\t\tborder-radius: globalVariables.$global-radius globalVariables.$global-radius 0 0;\n\t\tborder-bottom: globalFunctions.px-to-rem(4) solid colours.$ontario-colour-white;\n\t}\n\n\t&:hover {\n\t\tcolor: colours.$ontario-colour-white;\n\t\tbackground-color: colours.$ontario-colour-service-ontario-header-hover;\n\t}\n\n\t&:active {\n\t\tcolor: colours.$ontario-colour-white;\n\t\tbackground-color: colours.$ontario-colour-service-ontario-header-active;\n\t}\n\n\t&:focus {\n\t\tbox-shadow: 0 0 0 4px colours.$ontario-colour-service-ontario-header-focus;\n\t}\n}\n\n.ontario-overlay {\n\tdisplay: none;\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tbackground: rgba(colours.$ontario-colour-black, 0.6);\n\twidth: 100%;\n\theight: 100%;\n\tz-index: zIndex.$ontario-z-index-above-medium;\n}\n\n.ontario-navigation--open {\n\t.ontario-service-subheader .ontario-header-button:first-of-type {\n\t\tdisplay: none;\n\t}\n\n\t.ontario-service-subheader .ontario-header-button:last-of-type {\n\t\tdisplay: flex;\n\t}\n\n\t@media screen and (max-width: breakpoints.$medium-breakpoint) {\n\t\t.ontario-service-subheader-menu__container {\n\t\t\tposition: relative;\n\t\t\tz-index: calc(zIndex.$ontario-z-index-above-medium + 1);\n\t\t}\n\t}\n\n\t.ontario-overlay {\n\t\tdisplay: block;\n\n\t\t@media screen and (min-width: breakpoints.$medium-breakpoint) {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n}\n\n.ontario-colour-service-ontario-header-brand {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-brand;\n}\n\n.ontario-colour-service-ontario-header-focus {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-focus;\n}\n\n.ontario-colour-service-ontario-header-hover {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-hover;\n}\n\n.ontario-colour-service-ontario-header-active {\n\tbackground-color: colours.$ontario-colour-service-ontario-header-active;\n}\n","import { Component, Prop, State, Watch, h, Listen, Element, getAssetPath } from '@stencil/core';\n\nimport { Input } from '../../utils/common/input/input';\nimport {\n\tMenuItem,\n\tApplicationHeaderInfo,\n\tLanguageToggleOptions,\n\tOntarioMenuItems,\n\tOntarioHeaderType,\n} from './ontario-header.interface';\n\nimport OntarioIconClose from '../ontario-icon/assets/ontario-icon-close-header.svg';\nimport OntarioIconMenu from '../ontario-icon/assets/ontario-icon-menu-header.svg';\nimport OntarioIconSearch from '../ontario-icon/assets/ontario-icon-search.svg';\nimport OntarioIconSearchWhite from '../ontario-icon/assets/ontario-icon-search-white.svg';\nimport OntarioHeaderDefaultData from './ontario-header-default-data.json';\n\nimport { Language } from '../../utils/common/language-types';\nimport { validateLanguage } from '../../utils/validation/validation-functions';\n\nimport translations from '../../translations/global.i18n.json';\nimport config from '../../config.json';\n\n@Component({\n\ttag: 'ontario-header',\n\tstyleUrls: {\n\t\tontario: 'ontario-header.scss',\n\t\tapplication: 'ontario-application-header.scss',\n\t\tserviceOntario: 'service-ontario-header.scss',\n\t},\n\tshadow: true,\n\tassetsDirs: ['./assets'],\n})\nexport class OntarioHeader {\n\t@Element() el: HTMLElement;\n\n\t/**\n\t * The type of header.\n\t */\n\t@Prop() type?: OntarioHeaderType = 'application';\n\n\t/**\n\t * Information pertaining to the application header. This is only necessary for the 'application' header type.\n\t *\n\t * This includes the application name, URL and optional props for the number of links in the subheader for desktop, tablet, and mobile views.\n\t *\n\t * @example\n\t * <ontario-header\n\t * type=\"application\"\n\t * application-header-info='{\n\t * \"title\": \"Application name\",\n\t * \"href\": \"/application-homepage\",\n\t * \"maxSubheaderDesktopLinks\": \"3\",\n\t * \"maxSubheaderTabletLinks\": \"2\",\n\t * \"maxSubheaderMobileLinks\": \"1\"\n\t * }'>\n\t * </ontario-header>\n\t */\n\t@Prop() applicationHeaderInfo: ApplicationHeaderInfo | string;\n\n\t/**\n\t * The items that will go inside the menu.\n\t */\n\t@Prop() menuItems: MenuItem[] | string;\n\n\t/**\n\t * Option to disable fetching of the dynamic menu from the Ontario Header API\n\t *\n\t * @example\n\t * \t<ontario-header\n\t * \t\t\ttype=\"ontario\"\n\t * \t\t\tdisable-dynamic-menu=\"false\"\n\t *\t\t\tmenu-items='[{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t}]'>\n\t *\t</ontario-header>\n\t */\n\t@Prop() disableDynamicMenu: boolean = false;\n\n\t/**\n\t * Information pertaining to the language toggle links.\n\t *\n\t * @example\n\t * <ontario-header\n\t * \tlanguage-toggle-options='{\n\t * \"englishLink\": \"/en\",\n\t * \"frenchLink\": \"/fr\"\n\t * }'\n\t * ...\n\t * >\n\t * </ontario-header>\n\t */\n\t@Prop() languageToggleOptions?: LanguageToggleOptions | string;\n\n\t/**\n\t * A custom function to pass to the language toggle button.\n\t */\n\t@Prop() customLanguageToggle?: (event: globalThis.Event) => void;\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 none is passed, it will default to English.\n\t */\n\t@Prop({ mutable: true }) language?: Language = 'en';\n\n\t/**\n\t * The base path to an assets folder containing the Design System assets\n\t */\n\t@Prop() assetBasePath: string;\n\n\t/**\n\t * The application header information is reassigned to applicationHeaderInfoState for parsing\n\t */\n\t@State() private applicationHeaderInfoState: ApplicationHeaderInfo;\n\n\t/**\n\t * The menuItems is reassigned to itemState for parsing\n\t *\n\t * @example\n\t * \t<ontario-header\n\t * \t\t\ttype=\"ontario\"\n\t * \t\t\tdisable-dynamic-menu=\"true\"\n\t *\t\t\tmenu-items='[{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t},{\n\t *\t\t\t\t\"title\": \"Hint\",\n\t *\t\t\t\t\"href\": \"/ontario-hint\"\n\t *\t\t\t\t\"linkIsActive\": \"false\"\n\t *\t\t\t}]'>\n\t *\t</ontario-header>\n\t */\n\t@State() private menuItemState: MenuItem[];\n\n\t/**\n\t * Check to see if menu is dynamic or static\n\t */\n\t@State() private isDynamicMenu: boolean = false;\n\n\t/**\n\t * The languageToggleOptions is reassigned to languageState for parsing\n\t *\n\t * @example\n\t * \t<ontario-header\n\t *\t\tlanguage-toggle-options='{\n\t *\t\t\t\"englishLink\":\"/en\",\n\t *\t\t\t\"frenchLink\": \"/fr\"\n\t *\t\t}'\n\t *\t</ontario-header>\n\t */\n\t@State() private languageState: LanguageToggleOptions;\n\n\t/**\n\t * Toggler for the menu and the search button\n\t */\n\t@State() menuToggle: boolean = false;\n\t@State() searchToggle?: boolean = false;\n\n\t/**\n\t * Assigning values to elements to use them as ref\n\t */\n\theader!: HTMLElement;\n\tmenuButton!: HTMLElement;\n\tmenuButtonDesktop!: HTMLElement;\n\tmenuButtonTablet!: HTMLElement;\n\tmenuButtonMobile!: HTMLElement;\n\tsearchBar!: HTMLInputElement;\n\tsearchButton!: HTMLInputElement;\n\n\t@State() translations: any = translations;\n\n\t@Watch('applicationHeaderInfo')\n\tprivate parseApplicationHeaderInfo() {\n\t\tconst applicationHeaderInfo = this.applicationHeaderInfo;\n\t\tif (applicationHeaderInfo) {\n\t\t\tif (typeof applicationHeaderInfo === 'string')\n\t\t\t\tthis.applicationHeaderInfoState = JSON.parse(applicationHeaderInfo);\n\t\t\telse this.applicationHeaderInfoState = applicationHeaderInfo;\n\t\t}\n\t}\n\n\t@Watch('menuItems')\n\tparseMenuItems() {\n\t\tconst isEnglish = this.language === 'en';\n\n\t\tif (!Array.isArray(this.menuItems) && typeof this.menuItems === 'string') {\n\t\t\tthis.menuItemState = JSON.parse(this.menuItems);\n\t\t\tthis.isDynamicMenu = false;\n\t\t} else if (Array.isArray(this.menuItems) && this.type === 'application') {\n\t\t\tthis.menuItemState = this.menuItems;\n\t\t\tthis.isDynamicMenu = false;\n\t\t} else {\n\t\t\tthis.menuItemState = isEnglish ? OntarioHeaderDefaultData.en : OntarioHeaderDefaultData.fr;\n\t\t\tthis.isDynamicMenu = false;\n\t\t}\n\t}\n\n\t@Watch('languageToggleOptions')\n\tprivate parseLanguage() {\n\t\tconst languageToggleOptions = this.languageToggleOptions;\n\t\tif (languageToggleOptions) {\n\t\t\tif (typeof languageToggleOptions === 'string') {\n\t\t\t\tthis.languageState = JSON.parse(languageToggleOptions);\n\t\t\t} else {\n\t\t\t\tthis.languageState = languageToggleOptions;\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Logic to close the menu when anything outside the menu is clicked\n\t */\n\t@Listen('click', { capture: true, target: 'window' })\n\thandleClick(event: any) {\n\t\t// if the button is clicked, return\n\t\tif (\n\t\t\tevent.composedPath().includes(this.menuButton) ||\n\t\t\tevent.composedPath().includes(this.menuButtonDesktop) ||\n\t\t\tevent.composedPath().includes(this.menuButtonTablet) ||\n\t\t\tevent.composedPath().includes(this.menuButtonMobile)\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\t// If the click was outside the current component, do the following\n\t\tif (this.menuToggle) this.menuToggle = !this.menuToggle;\n\t}\n\n\t/**\n\t * This listens for the `setAppLanguage` event sent from the language toggle when it is is connected to the DOM.\n\t * 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> | Language) {\n\t\tthis.language = validateLanguage(event);\n\t\tthis.parseMenuItems();\n\t}\n\n\t/**\n\t * This listens for the `headerLanguageToggled` event sent from the language toggle when it is is connected to the DOM.\n\t * It is used for changing the component language after the language toggle has been activated.\n\t */\n\t@Listen('headerLanguageToggled', { target: 'window' })\n\thandleLanguageToggle(event: CustomEvent<{ oldLanguage: Language; newLanguage: Language }>) {\n\t\tthis.handleSetAppLanguage(event.detail.newLanguage);\n\t}\n\n\t/**\n\t * Logic to handle the menu toggling\n\t */\n\thandleMenuToggle = () => {\n\t\tthis.menuToggle = !this.menuToggle;\n\t\tthis.searchToggle = undefined;\n\t};\n\n\t/**\n\t * Logic to handle the search toggling\n\t */\n\thandleSearchToggle = () => {\n\t\tthis.searchToggle = !this.searchToggle;\n\t};\n\n\t/**\n\t * event.preventDefault(): https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault\n\t * location.href: https://developer.mozilla.org/en-US/docs/Web/API/Location/href\n\t */\n\thandleSubmit = (event: any) => {\n\t\tevent.preventDefault();\n\t\tlocation.href = `${this.translations.header.ontarioSearchURL[`${this.language}`]}${event.target[0].value}`;\n\t};\n\n\t/**\n\t * Logic to make the focus go back to the menu button when the list ends\n\t */\n\ttrapMenuFocus = (e: any) => {\n\t\tlet dataType = e.target?.dataset.type;\n\t\tif (dataType === 'app-desktop') {\n\t\t\tthis.menuButtonDesktop.focus();\n\t\t} else if (dataType === 'app-tablet') {\n\t\t\tthis.menuButtonTablet.focus();\n\t\t} else if (dataType === 'app-mobile') {\n\t\t\tthis.menuButtonMobile.focus();\n\t\t} else {\n\t\t\tthis.menuButton.focus();\n\t\t}\n\t};\n\n\t/**\n\t * Call to Ontario Menu API to fetch linksets to populate header component\n\t */\n\tasync fetchOntarioMenu() {\n\t\tconst isEnglish = this.language === 'en';\n\n\t\t// If menu has already been fetched and contains dynamic menu items, do not run fetch again\n\t\tif (!this.isDynamicMenu) {\n\t\t\tconst apiUrl = isEnglish\n\t\t\t\t? (config.ONTARIO_HEADER_API_URL_EN as string)\n\t\t\t\t: (config.ONTARIO_HEADER_API_URL_FR as string);\n\n\t\t\tconst response = await fetch(apiUrl)\n\t\t\t\t.then((response) => response.json())\n\t\t\t\t.then((json) => json.linkset[0].item as OntarioMenuItems[])\n\t\t\t\t.catch(() => {\n\t\t\t\t\tconsole.error('Unable to retrieve data from Ontario Menu API');\n\t\t\t\t\treturn [];\n\t\t\t\t});\n\n\t\t\tif (response.length > 0) {\n\t\t\t\tconst externalMenuItems = response.map((item) => {\n\t\t\t\t\treturn { href: item.href, title: item.title };\n\t\t\t\t});\n\t\t\t\tthis.menuItemState = externalMenuItems;\n\t\t\t\tthis.isDynamicMenu = true;\n\t\t\t}\n\t\t}\n\t\treturn;\n\t}\n\n\t/**\n\t * Generate a link to the given image based on the base asset path.\n\t * @param imageName Name of the image to build the path to\n\t * @returns Path to image with asset path\n\t */\n\tprivate getImageAssetSrcPath(imageName: string): string {\n\t\treturn `${this.assetBasePath ? this.assetBasePath : getAssetPath('./assets')}/${imageName}`;\n\t}\n\n\t/**\n\t * This function generates the menu items in a <li>, accordingly, to the given parameters.\n\t *\n\t * href and title are necessary, but rest are not.\n\t *\n\t * @param href - the href of the menu item\n\t * @param title - the title of the menu item\n\t * @param linkIsActive - when set to true, this will add the classes necessary to style the link in a way that indicates to the user what the active page/link is\n\t * @param liClass - if there is a class that is related to the <a> portion of the menu item, put it here\n\t * @param onClick - for any custom onClick event a user might want to add to their menu links\n\t * @param onBlur - when set to true, it will call the function trapMenuFocus(), otherwise nothing is done (used in lastLink)\n\t */\n\tprivate generateMenuItem(\n\t\thref: string,\n\t\ttitle: string,\n\t\tlinkIsActive: boolean | undefined,\n\t\ttype: string,\n\t\tliClass?: string,\n\t\tonClick?: any,\n\t\tonBlur?: boolean,\n\t) {\n\t\treturn (\n\t\t\t<li class={liClass}>\n\t\t\t\t<a\n\t\t\t\t\tclass={linkIsActive === true ? `ontario-link--active` : ``}\n\t\t\t\t\thref={href}\n\t\t\t\t\tonClick={onClick}\n\t\t\t\t\tonBlur={onBlur ? this.trapMenuFocus : undefined}\n\t\t\t\t\tdata-type={type}\n\t\t\t\t>\n\t\t\t\t\t{title}\n\t\t\t\t</a>\n\t\t\t</li>\n\t\t);\n\t}\n\n\t/**\n\t * This function generates the menu dropdown button for the ontario header component.\n\t *\n\t * @param viewportSize - the size of the screen where the function is being called. It can either be set to `desktop`, `tablet` or `mobile`. This dictates the classes used on the menu button, as well as the ref to keep the focus trapped when the menu is open.\n\t */\n\tprivate renderMenuButton(viewportSize: string) {\n\t\tif (!this.isMenuVisible(viewportSize)) {\n\t\t\treturn;\n\t\t}\n\n\t\treturn (\n\t\t\t<button\n\t\t\t\tclass={\n\t\t\t\t\tviewportSize === 'desktop'\n\t\t\t\t\t\t? 'ontario-header__menu-toggler ontario-header-button ontario-header-button--with-outline ontario-show-for-large'\n\t\t\t\t\t\t: viewportSize === 'tablet'\n\t\t\t\t\t\t? 'ontario-header__menu-toggler ontario-header-button ontario-header-button--with-outline ontario-hide-for-small ontario-show-for-medium ontario-hide-for-large'\n\t\t\t\t\t\t: viewportSize === 'mobile'\n\t\t\t\t\t\t? 'ontario-header__menu-toggler ontario-header-button ontario-header-button--with-outline ontario-show-for-small-only'\n\t\t\t\t\t\t: 'ontario-header__menu-toggler ontario-header-button ontario-header-button--with-outline'\n\t\t\t\t}\n\t\t\t\tid={this.type === 'ontario' ? 'ontario-header-menu-toggler' : 'ontario-application-header-menu-toggler'}\n\t\t\t\taria-controls=\"ontario-navigation\"\n\t\t\t\taria-label={\n\t\t\t\t\tthis.menuToggle\n\t\t\t\t\t\t? this.translations.header.closeMenu[`${this.language}`]\n\t\t\t\t\t\t: this.translations.header.openMenu[`${this.language}`]\n\t\t\t\t}\n\t\t\t\tonClick={this.handleMenuToggle}\n\t\t\t\ttype=\"button\"\n\t\t\t\tref={\n\t\t\t\t\tviewportSize === 'desktop'\n\t\t\t\t\t\t? (el) => (this.menuButtonDesktop = el as HTMLInputElement)\n\t\t\t\t\t\t: viewportSize === 'tablet'\n\t\t\t\t\t\t? (el) => (this.menuButtonTablet = el as HTMLInputElement)\n\t\t\t\t\t\t: viewportSize === 'mobile'\n\t\t\t\t\t\t? (el) => (this.menuButtonMobile = el as HTMLInputElement)\n\t\t\t\t\t\t: (el) => (this.menuButton = el as HTMLInputElement)\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<span class=\"ontario-header__icon-container\" innerHTML={this.menuToggle ? OntarioIconClose : OntarioIconMenu} />\n\t\t\t\t<span>Menu</span>\n\t\t\t</button>\n\t\t);\n\t}\n\n\t/**\n\t * A helper function to generate navigation dropdown links with onBlur functionality. This is used for the application header.\n\t *\n\t * @param item - the menu item to be looped over (contains the title and href)\n\t * @param index\n\t * @param links - the number of links associated with the maxSubheader[size]Links in the application header info prop. This will determine how many links should be displayed in the dropdown.\n\t * @param viewportSize - the size of the viewport. It can be set to `desktop`, `tablet` or `mobile`.\n\t * @returns\n\t */\n\tprivate generateNavigationLinks(item: MenuItem, index: number, links: number | undefined, viewportSize: string) {\n\t\tconst lastLink =\n\t\t\tindex + 1 === (links ? this.menuItemState.length - links : this.menuItemState.length) ? true : false;\n\n\t\treturn this.generateMenuItem(\n\t\t\titem.href,\n\t\t\titem.title,\n\t\t\titem.linkIsActive,\n\t\t\tviewportSize,\n\t\t\t'',\n\t\t\titem.onClickHandler,\n\t\t\tlastLink,\n\t\t);\n\t}\n\n\t/**\n\t * The onEscapePressed function clears the searchbar form when Escape is pressed\n\t */\n\tprivate onEscapePressed(event: any) {\n\t\tif (event.key === 'Escape') {\n\t\t\tevent.path[0].value = '';\n\t\t}\n\t}\n\n\tprivate isMenuVisible(viewportSize: string) {\n\t\tconst { menuItemState, applicationHeaderInfoState } = this;\n\t\tconst { maxSubheaderMobileLinks, maxSubheaderTabletLinks, maxSubheaderDesktopLinks } =\n\t\t\tapplicationHeaderInfoState ?? {};\n\n\t\tconst numOfMenuItems = menuItemState?.length ?? 0;\n\n\t\tif (numOfMenuItems <= 0) {\n\t\t\treturn false;\n\t\t}\n\n\t\tif (viewportSize === 'mobile') {\n\t\t\treturn numOfMenuItems - (maxSubheaderMobileLinks ?? 0) > 0;\n\t\t}\n\n\t\tif (viewportSize === 'tablet') {\n\t\t\treturn numOfMenuItems - (maxSubheaderTabletLinks ?? 0) > 0;\n\t\t}\n\n\t\tif (viewportSize === 'desktop') {\n\t\t\treturn numOfMenuItems - (maxSubheaderDesktopLinks ?? 0) > 0;\n\t\t}\n\n\t\treturn true;\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.parseApplicationHeaderInfo();\n\t\tthis.parseMenuItems();\n\t\tthis.parseLanguage();\n\t}\n\n\tcomponentDidRender() {\n\t\tif (this.disableDynamicMenu === false && this.type === 'ontario') {\n\t\t\tthis.fetchOntarioMenu();\n\t\t}\n\t}\n\n\t/**\n\t * Handles the focus when menu/toggle button is clicked.\n\t * When search button is clicked, the search bar is in focus,\n\t * when the closed button is clicked, the search button is back into focus.\n\t * When the menu is closed, the menu button should be out of focus.\n\t */\n\tcomponentDidUpdate() {\n\t\tif (this.type == 'ontario') {\n\t\t\tif (this.searchToggle === true) this.searchBar.focus();\n\t\t\tif (this.searchToggle === false) this.searchButton.focus();\n\t\t\tif (this.menuToggle === false) this.menuButton.blur();\n\t\t}\n\t}\n\n\trender() {\n\t\tconst isServiceOntarioType = this.type === 'serviceOntario';\n\n\t\tif (this.type == 'ontario') {\n\t\t\treturn (\n\t\t\t\t<div>\n\t\t\t\t\t<div class=\"ontario-header__container\" ref={(el) => (this.header = el as HTMLInputElement)}>\n\t\t\t\t\t\t<header\n\t\t\t\t\t\t\tclass={this.searchToggle ? 'ontario-header ontario-header--search-open' : 'ontario-header'}\n\t\t\t\t\t\t\tid=\"ontario-header\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"ontario-row\">\n\t\t\t\t\t\t\t\t{/* Ontario header logo */}\n\t\t\t\t\t\t\t\t<div class=\"ontario-header__logo-container ontario-columns ontario-small-2 ontario-medium-4 ontario-large-3\">\n\t\t\t\t\t\t\t\t\t<a href={this.translations.header.logoLink[`${this.language}`]}>\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\tclass=\"ontario-show-for-medium\"\n\t\t\t\t\t\t\t\t\t\t\tsrc={this.getImageAssetSrcPath('ontario-logo--desktop.svg')}\n\t\t\t\t\t\t\t\t\t\t\talt={this.translations.header.logoAltText[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\tclass=\"ontario-show-for-small-only\"\n\t\t\t\t\t\t\t\t\t\t\tsrc={this.getImageAssetSrcPath('ontario-logo--mobile.svg')}\n\t\t\t\t\t\t\t\t\t\t\talt={this.translations.header.logoAltText[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t\t{/* Ontario header search input */}\n\t\t\t\t\t\t\t\t<form\n\t\t\t\t\t\t\t\t\tname=\"searchForm\"\n\t\t\t\t\t\t\t\t\tid=\"ontario-search-form-container\"\n\t\t\t\t\t\t\t\t\tonSubmit={this.handleSubmit}\n\t\t\t\t\t\t\t\t\tclass=\"ontario-header__search-container ontario-columns ontario-small-10 ontario-medium-offset-3 ontario-medium-6 ontario-large-offset-0 ontario-large-6\"\n\t\t\t\t\t\t\t\t\tnovalidate\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<label htmlFor=\"ontario-search-input-field\" class=\"ontario-show-for-sr\">\n\t\t\t\t\t\t\t\t\t\t{this.translations.header.search[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\t\t\tname=\"search\"\n\t\t\t\t\t\t\t\t\t\tid=\"ontario-search-input-field\"\n\t\t\t\t\t\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t\t\t\t\t\taria-autocomplete=\"none\"\n\t\t\t\t\t\t\t\t\t\tclassName=\"ontario-input ontario-header__search-input\"\n\t\t\t\t\t\t\t\t\t\trequired={true}\n\t\t\t\t\t\t\t\t\t\tref={(el) => (this.searchBar = el as HTMLInputElement)}\n\t\t\t\t\t\t\t\t\t\tonKeyDown={this.onEscapePressed}\n\t\t\t\t\t\t\t\t\t></Input>\n\t\t\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\t\t\tclassName=\"ontario-header__search-reset\"\n\t\t\t\t\t\t\t\t\t\tid=\"ontario-search-reset\"\n\t\t\t\t\t\t\t\t\t\ttype=\"reset\"\n\t\t\t\t\t\t\t\t\t\tvalue=\"\"\n\t\t\t\t\t\t\t\t\t\taria-label={this.translations.header.clearSearchField[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t></Input>\n\t\t\t\t\t\t\t\t\t<button class=\"ontario-header__search-submit\" id=\"ontario-search-submit\" type=\"submit\">\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-show-for-sr\">{this.translations.header.submit[`${this.language}`]}</span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-header__icon-container\" innerHTML={OntarioIconSearch} />\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</form>\n\n\t\t\t\t\t\t\t\t{/* Ontario header language toggle + menu button */}\n\t\t\t\t\t\t\t\t<div class=\"ontario-header__nav-right-container ontario-columns ontario-small-10 ontario-medium-8 ontario-large-3\">\n\t\t\t\t\t\t\t\t\t<ontario-language-toggle\n\t\t\t\t\t\t\t\t\t\turl={this.language === 'en' ? this.languageState?.frenchLink : this.languageState?.englishLink}\n\t\t\t\t\t\t\t\t\t\tsize=\"default\"\n\t\t\t\t\t\t\t\t\t\tcustomLanguageToggle={this.customLanguageToggle}\n\t\t\t\t\t\t\t\t\t></ontario-language-toggle>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tclass=\"ontario-header__search-toggler ontario-header-button ontario-header-button--without-outline ontario-hide-for-large\"\n\t\t\t\t\t\t\t\t\t\tid=\"ontario-header-search-toggler\"\n\t\t\t\t\t\t\t\t\t\taria-controls=\"ontario-search-form-container\"\n\t\t\t\t\t\t\t\t\t\tonClick={this.handleSearchToggle}\n\t\t\t\t\t\t\t\t\t\tref={(el) => (this.searchButton = el as HTMLInputElement)}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-header__icon-container\" innerHTML={OntarioIconSearchWhite} />\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-show-for-medium ontario-show\">\n\t\t\t\t\t\t\t\t\t\t\t{this.translations.header.search[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t{this.renderMenuButton('ontario-header')}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div class=\"ontario-header__search-close-container ontario-columns ontario-small-2 ontario-medium-3\">\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tclass=\"ontario-header__search-close ontario-header-button ontario-header-button--without-outline\"\n\t\t\t\t\t\t\t\t\t\tid=\"ontario-header-search-close\"\n\t\t\t\t\t\t\t\t\t\taria-label={this.translations.header.closeSearch[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\tonClick={this.handleSearchToggle}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<span aria-hidden={`${!this.searchToggle}`}>\n\t\t\t\t\t\t\t\t\t\t\t{this.translations.header.close[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t<span class=\"ontario-header__icon-container\" innerHTML={OntarioIconClose} />\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</header>\n\n\t\t\t\t\t\t{/* Ontario header navigation */}\n\t\t\t\t\t\t<nav\n\t\t\t\t\t\t\trole=\"navigation\"\n\t\t\t\t\t\t\tclass={this.menuToggle ? 'ontario-navigation ontario-navigation--open' : 'ontario-navigation'}\n\t\t\t\t\t\t\tid=\"ontario-navigation\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"ontario-navigation__container\">\n\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t{/*\n\t\t\t\t\t\t\t\t\t\tMaps through all the menu items, and the last item is set to lastLink.\n\t\t\t\t\t\t\t\t\t\tWhen the focus goes away from the lastLink, return the focus to the menu button\n\t\t\t\t\t\t\t\t\t\t(only applicable pressing the \"tab\" key, not actually clicking away from the menu).\n\t\t\t\t\t\t\t\t\t*/}\n\t\t\t\t\t\t\t\t\t{this.menuItemState?.map((item, index: number) => {\n\t\t\t\t\t\t\t\t\t\tconst lastLink = index + 1 === this.menuItemState.length;\n\t\t\t\t\t\t\t\t\t\tconst activeLinkRegex = item.title.replace(/\\s+/g, '-').toLowerCase();\n\t\t\t\t\t\t\t\t\t\tconst linkIsActive = window.location.pathname.includes(activeLinkRegex);\n\t\t\t\t\t\t\t\t\t\treturn this.isDynamicMenu\n\t\t\t\t\t\t\t\t\t\t\t? this.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\tlinkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'ontario-header',\n\t\t\t\t\t\t\t\t\t\t\t\t\t'ontario-header-navigation__menu-item',\n\t\t\t\t\t\t\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\t\t\t\t\t\t\tlastLink,\n\t\t\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t\t\t: this.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.linkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'ontario-header',\n\t\t\t\t\t\t\t\t\t\t\t\t\t'ontario-header-navigation__menu-item',\n\t\t\t\t\t\t\t\t\t\t\t\t\titem.onClickHandler,\n\t\t\t\t\t\t\t\t\t\t\t\t\tlastLink,\n\t\t\t\t\t\t\t\t\t\t\t );\n\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</nav>\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.menuToggle && <div class=\"ontario-hide-for-large ontario-overlay\" />}\n\t\t\t\t</div>\n\t\t\t);\n\t\t} else {\n\t\t\treturn (\n\t\t\t\t<div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass=\"ontario-application-header-container\"\n\t\t\t\t\t\tid=\"ontario-application-header\"\n\t\t\t\t\t\tref={(el) => (this.header = el as HTMLInputElement)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{/* Ontario application header black bar */}\n\t\t\t\t\t\t<header class=\"ontario-application-header\" id=\"ontario-header\">\n\t\t\t\t\t\t\t<div class=\"ontario-row\">\n\t\t\t\t\t\t\t\t<div class=\"ontario-columns ontario-small-6 ontario-application-header__logo\">\n\t\t\t\t\t\t\t\t\t<a href={this.translations.header.logoLink[`${this.language}`]}>\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\tsrc={this.getImageAssetSrcPath('ontario-logo--desktop.svg')}\n\t\t\t\t\t\t\t\t\t\t\talt={this.translations.header.logoAltText[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div class=\"ontario-columns ontario-small-6 ontario-application-header__lang-toggle\">\n\t\t\t\t\t\t\t\t\t<ontario-language-toggle\n\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\turl={this.language === 'en' ? this.languageState?.frenchLink : this.languageState?.englishLink}\n\t\t\t\t\t\t\t\t\t\tcustomLanguageToggle={this.customLanguageToggle}\n\t\t\t\t\t\t\t\t\t></ontario-language-toggle>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</header>\n\n\t\t\t\t\t\t{/* Ontario application header subheader */}\n\t\t\t\t\t\t<div class=\"ontario-application-subheader-menu__container\">\n\t\t\t\t\t\t\t<section\n\t\t\t\t\t\t\t\tclass={`ontario-application-subheader ${isServiceOntarioType ? 'ontario-service-subheader' : ''}`}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div class=\"ontario-row\">\n\t\t\t\t\t\t\t\t\t<div class=\"ontario-columns ontario-small-12 ontario-application-subheader__container\">\n\t\t\t\t\t\t\t\t\t\t{!isServiceOntarioType ? (\n\t\t\t\t\t\t\t\t\t\t\t<p class=\"ontario-application-subheader__heading\">\n\t\t\t\t\t\t\t\t\t\t\t\t<a href={this.applicationHeaderInfoState?.href}>{this.applicationHeaderInfoState?.title}</a>\n\t\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<a href={this.applicationHeaderInfoState?.href} class=\"ontario-service-subheader__link\">\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"ontario-service-subheader__heading-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"ontario-service-subheader__heading\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{this.translations.header.serviceOntario[`${this.language}`]}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p class=\"ontario-service-subheader__description\">{this.applicationHeaderInfoState?.title}</p>\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t<div class=\"ontario-application-subheader__menu-container\">\n\t\t\t\t\t\t\t\t\t\t\t{/* Desktop subheader links */}\n\t\t\t\t\t\t\t\t\t\t\t{!!this.applicationHeaderInfoState?.maxSubheaderDesktopLinks && (\n\t\t\t\t\t\t\t\t\t\t\t\t<ul\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass={`${\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tisServiceOntarioType\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'ontario-service-subheader__menu'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'ontario-application-subheader__menu'\n\t\t\t\t\t\t\t\t\t\t\t\t\t} ontario-show-for-large`}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.slice(0, this.applicationHeaderInfoState?.maxSubheaderDesktopLinks)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t.map((item) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.linkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'app-desktop',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.onClickHandler,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t\t\t\t{/* Tablet subheader links */}\n\t\t\t\t\t\t\t\t\t\t\t{!!this.applicationHeaderInfoState?.maxSubheaderTabletLinks && (\n\t\t\t\t\t\t\t\t\t\t\t\t<ul class=\"ontario-application-subheader__menu ontario-hide-for-small ontario-show-for-medium ontario-hide-for-large\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.slice(0, this.applicationHeaderInfoState?.maxSubheaderTabletLinks)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t.map((item) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.linkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'app-tablet',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.onClickHandler,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t\t\t\t{/* Mobile subheader links */}\n\t\t\t\t\t\t\t\t\t\t\t{!!this.applicationHeaderInfoState?.maxSubheaderMobileLinks && (\n\t\t\t\t\t\t\t\t\t\t\t\t<ul class=\"ontario-application-subheader__menu ontario-show-for-small-only\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t?.slice(0, this.applicationHeaderInfoState.maxSubheaderMobileLinks)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t.map((item) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tthis.generateMenuItem(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.href,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.title,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.linkIsActive,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'app-mobile',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'',\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\titem.onClickHandler,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t\t\t\t\t\t{/* Render menu button if menuItemState exists, and if there are items to display in a dropdown menu */}\n\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState !== undefined &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderDesktopLinks !== this.menuItemState.length &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.renderMenuButton('desktop')}\n\n\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState !== undefined &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderTabletLinks !== this.menuItemState.length &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.renderMenuButton('tablet')}\n\n\t\t\t\t\t\t\t\t\t\t\t{this.menuItemState !== undefined &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderMobileLinks !== this.menuItemState.length &&\n\t\t\t\t\t\t\t\t\t\t\t\tthis.renderMenuButton('mobile')}\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</section>\n\t\t\t\t\t\t\t<nav\n\t\t\t\t\t\t\t\trole=\"navigation\"\n\t\t\t\t\t\t\t\tclass={\n\t\t\t\t\t\t\t\t\tthis.menuToggle === true\n\t\t\t\t\t\t\t\t\t\t? 'ontario-application-navigation ontario-navigation--open'\n\t\t\t\t\t\t\t\t\t\t: 'ontario-application-navigation'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tid=\"ontario-application-navigation\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div class=\"ontario-application-navigation__container\">\n\t\t\t\t\t\t\t\t\t{/* Ontario application header desktop menu dropdown links */}\n\t\t\t\t\t\t\t\t\t<ul class=\"ontario-show-for-large\">\n\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t?.slice(this.applicationHeaderInfoState?.maxSubheaderDesktopLinks, this.menuItemState.length)\n\t\t\t\t\t\t\t\t\t\t\t.map((item: any, index) => {\n\t\t\t\t\t\t\t\t\t\t\t\treturn this.generateNavigationLinks(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderDesktopLinks,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'app-desktop',\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</ul>\n\n\t\t\t\t\t\t\t\t\t{/* Ontario application header tablet menu dropdown links */}\n\t\t\t\t\t\t\t\t\t<ul class=\"ontario-show-for-medium ontario-hide-for-small ontario-hide-for-large\">\n\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t?.slice(this.applicationHeaderInfoState?.maxSubheaderTabletLinks, this.menuItemState.length)\n\t\t\t\t\t\t\t\t\t\t\t.map((item, index) => {\n\t\t\t\t\t\t\t\t\t\t\t\treturn this.generateNavigationLinks(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderTabletLinks,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'app-tablet',\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</ul>\n\n\t\t\t\t\t\t\t\t\t{/* Ontario application header mobile menu dropdown links */}\n\t\t\t\t\t\t\t\t\t<ul class=\"ontario-show-for-small-only\">\n\t\t\t\t\t\t\t\t\t\t{this.menuItemState\n\t\t\t\t\t\t\t\t\t\t\t?.slice(this.applicationHeaderInfoState?.maxSubheaderMobileLinks, this.menuItemState.length)\n\t\t\t\t\t\t\t\t\t\t\t.map((item, index) => {\n\t\t\t\t\t\t\t\t\t\t\t\treturn this.generateNavigationLinks(\n\t\t\t\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tthis.applicationHeaderInfoState?.maxSubheaderMobileLinks,\n\t\t\t\t\t\t\t\t\t\t\t\t\t'app-mobile',\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</nav>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t{this.menuToggle && <div class=\"ontario-hide-for-large ontario-overlay\" />}\n\t\t\t\t</div>\n\t\t\t);\n\t\t}\n\t}\n}\n"],"version":3}