{"version":3,"names":["DesktopNavigation","LogLevel","warn","location","origin","searchActivated","event","this","searchActive","detail","render","h","class","availableLocales","locale","navigation","stsServer","bpStsServer","hidden","logLevel","language","domain","stsType","clientId","audience","scope","silentRenewPage","silentRenewScript","redirectUri","postLogoutRedirectUri","bpClientId","pnlIe11WarningCss","IE11Warning","message","nl_NL","nl_BE","fr_BE","en_GB","async","userAgent","window","navigator","isIE11","test","innerHTML","images","warning","pnlMobileNavigationCss","MobileNavigation","toggleMenu","open","menuToggled","emit","document","body","classList","add","remove","type","onClick","toString","closeMenuThick","openMenu","getTranslatedLabel","mainMenu","href","homeUrl","home","src","alt","id"],"sources":["./src/components/pnl-header/pnl-desktop-navigation/pnl-desktop-navigation.tsx","./src/components/pnl-header/pnl-ie11-warning/pnl-ie11-warning.scss?tag=pnl-ie11-warning","./src/components/pnl-header/pnl-ie11-warning/pnl-ie11-warning.tsx","./src/components/pnl-header/pnl-mobile-navigation/pnl-mobile-navigation.scss?tag=pnl-mobile-navigation","./src/components/pnl-header/pnl-mobile-navigation/pnl-mobile-navigation.tsx"],"sourcesContent":["import { Component, h, Listen, Prop, State } from '@stencil/core';\nimport { StsType } from '../../../services/authentication/authentication.models';\nimport { Header } from '../../navigation-structure.models';\nimport { LogLevel } from '../../pnl-user-menu/utility/logging.service';\n\n@Component({\n    tag: 'pnl-desktop-navigation'\n})\nexport class DesktopNavigation {\n    @State() searchActive: boolean;\n\n    @Prop() logLevel: LogLevel = LogLevel.warn;\n\n    @Prop() domain: string;\n    @Prop() locale: string;\n    @Prop() availableLocales: string;\n\n    @Prop() navigation: Header;\n\n    @Prop() stsType: StsType;\n    @Prop() stsServer: string;\n    @Prop() clientId: string;\n    @Prop() audience: string;\n    @Prop() scope: string;\n    @Prop() silentRenewPage: string;\n    @Prop() silentRenewScript: string;\n    @Prop() redirectUri: string = location.origin;\n    @Prop() postLogoutRedirectUri: string = location.origin;\n    @Prop() bpStsServer: string;\n    @Prop() bpClientId: string;\n\n    @Listen('searchActivated')\n    searchActivated(event: CustomEvent) {\n        this.searchActive = event.detail;\n    }\n\n    render() {\n        return (\n            <div class=\"pnl-header--desktop\">\n                <div class=\"pnl-header__utility\">\n                    <div class=\"pci-inner-container\">\n                        <pnl-language-selector availableLocales={this.availableLocales} locale={this.locale}></pnl-language-selector>\n                    </div>\n                </div>\n                <div class=\"pnl-header__main pnl-header__main--desktop pnl-navigation\">\n                    <div class=\"pci-inner-container pnl-navigation-container\">\n                    <pnl-navigation-menu searchActive={this.searchActive} navigation={this.navigation} locale={this.locale}></pnl-navigation-menu>\n                        <div class=\"pnl-menu-spacer\"></div>\n                        {(this.stsServer || this.bpStsServer) &&\n                            <pnl-user-menu\n                                class={'pnl-user-menu-container'}\n                                hidden={this.searchActive}\n                                log-level={this.logLevel}\n                                language={this.locale}\n                                domain={this.domain}\n                                sts-type={this.stsType}\n                                sts-server={this.stsServer}\n                                client-id={this.clientId}\n                                audience={this.audience}\n                                scope={this.scope}\n                                silentRenewPage={this.silentRenewPage}\n                                silentRenewScript={this.silentRenewScript}\n                                redirect-uri={this.redirectUri}\n                                post-logout-redirect-uri={this.postLogoutRedirectUri}\n                                bp-sts-server={this.bpStsServer}\n                                bp-client-id={this.bpClientId}>\n                            </pnl-user-menu>\n                        }\n                        <pnl-search class=\"pci-navigation__search\" domain={this.domain} locale={this.locale}></pnl-search>\n                    </div>\n                </div>\n            </div>\n        );\n    }\n}\n","@import '../../../../node_modules/@postnl/pci/postnl-styles/settings';\n@import '../../../../node_modules/@postnl/pci/postnl-styles/components/alerts';\n\n//specific overwrites for shadow dom\n.pci-alert {\n    padding: .5em 1em;\n    border-radius: .25em;\n}\n\n.pci-alert__text {\n    padding-left: 2em;\n}\n","import { Component, h, Prop, State } from '@stencil/core';\nimport { images } from '../../../helpers/inline-images.service';\n\n/**\n * Display a warning when user is using IE11.\n */\n@Component({\n    tag: 'pnl-ie11-warning',\n    styleUrl: 'pnl-ie11-warning.scss'\n})\nexport class IE11Warning {\n\n    private message = {\n        'nl_NL': 'Let op. Je gebruikt een verouderde versie van Internet Explorer. Met een verouderde browser kun je onze website helaas niet meer (goed) gebruiken. We raden je aan om een andere browser te installeren.',\n        'nl_BE': 'Let op. U gebruikt een verouderde versie van Internet Explorer. Met een verouderde browser kunt u onze website helaas niet meer (goed) gebruiken. We raden u aan om een andere browser te installeren.',\n        'fr_BE': 'S\\'il vous plaît noter. Vous utilisez une version obsolète d\\'Internet Explorer. Avec un navigateur obsolète, vous ne pouvez malheureusement plus utiliser notre site Web (correctement). Nous vous recommandons d\\'installer un autre navigateur.',\n        'en_GB': 'Attention. You are using an older version of Internet Explorer. Our website does not work (well) with an older browser. Please upgrade your browser.'\n    }\n\n    @State() isIE11 = false;\n\n    /** The locale the warning is rendered in. */\n    @Prop() locale = 'nl_NL';\n\n    async componentWillLoad() {\n        const userAgent = window.navigator.userAgent;\n        this.isIE11 = /MSIE|Trident/.test(userAgent);\n    }\n\n    render() {\n        if (this.isIE11) {\n            return (\n                <div class=\"pci-inner-container\">\n                    <div class=\"pci-alert pci-alert--warning\">\n                        <p class=\"pci-alert__text\">\n                            <span class=\"pci-alert__icon\" innerHTML={images.warning}></span>\n                            {this.message[this.locale]}\n                        </p>\n                    </div>\n                </div>\n            )\n        }\n    }\n}\n","@import '../../../assets/styles/variables';\n@import '../../../assets/styles/typography';\n@import '../../../../node_modules/@postnl/pci/postnl-styles/settings';\n@import '../../../../node_modules/@postnl/pci/postnl-styles/tools/utilities';\n\n.pnl-header__main--mobile {\n    display: block;\n    height: 44px;\n}\n\n.pnl-navigation__link--home-mobile {\n    position: absolute;\n    left: 50%;\n    transform: translateX(-50%);\n\n    img {\n        width: 2.5em;\n        height: 2.5em;\n    }\n\n    &:focus:not(:focus-visible) {\n        outline: none;\n    }\n\n    &:focus-visible {\n        outline: 2px solid $color-border-focus-outline;\n        outline-offset: 2px;\n        border-radius: 0.25rem;\n    }\n}\n","import { Component, Event, EventEmitter, Prop, State, h } from '@stencil/core';\nimport { images } from '../../../helpers/inline-images.service';\nimport { StsType } from '../../../services/authentication/authentication.models';\nimport { Header } from '../../navigation-structure.models';\nimport { LogLevel } from '../../pnl-user-menu/utility/logging.service';\nimport { getTranslatedLabel } from '../language.util';\n\n@Component({\n    tag: 'pnl-mobile-navigation',\n    styleUrl: 'pnl-mobile-navigation.scss',\n})\nexport class MobileNavigation {\n    @State() open = false;\n\n    @Prop() logLevel: LogLevel = LogLevel.warn;\n\n    @Prop() domain: string;\n    @Prop() locale: string;\n    @Prop() availableLocales: string;\n\n    @Prop() navigation: Header;\n\n    @Prop() stsType: StsType;\n    @Prop() stsServer: string;\n    @Prop() clientId: string;\n    @Prop() audience: string;\n    @Prop() scope: string;\n    @Prop() silentRenewPage: string;\n    @Prop() silentRenewScript: string;\n    @Prop() redirectUri: string = location.origin;\n    @Prop() postLogoutRedirectUri: string = location.origin;\n    @Prop() bpStsServer: string;\n    @Prop() bpClientId: string;\n\n    /**\n     * Emits an event when the menu is toggled. event.detail will contains true of the menu was opened, or false when it was closed.\n     * You can use this for example to set styling on your application's body to prevent the background from scrolling when the menu is opened.\n     */\n    @Event() menuToggled: EventEmitter<boolean>;\n\n    toggleMenu() {\n        this.open = !this.open;\n        this.menuToggled.emit(this.open);\n\n        if (this.open) {\n            document.body.classList.add('noscroll');\n        } else {\n            document.body.classList.remove('noscroll');\n        }\n    }\n\n    render() {\n        return (\n            <div class=\"pnl-header__main pnl-header__main--mobile\">\n                <div class=\"pci-inner-container\">\n                    <button\n                        type=\"button\"\n                        class=\"pnl-navigation__toggle--mobile\"\n                        onClick={() => this.toggleMenu()}\n                        aria-controls=\"pnl-main-nav-menu-container\"\n                        aria-expanded={this.open.toString()}\n                    >\n                        <div\n                            class=\"pnl-navigation__toggle-icon\"\n                            innerHTML={\n                                this.open\n                                    ? images.closeMenuThick\n                                    : images.openMenu\n                            }\n                        ></div>\n                        <span class=\"visually-hidden\">\n                            {getTranslatedLabel(this.locale).mainMenu}\n                        </span>\n                    </button>\n                    <a\n                        class=\"pnl-navigation__link pnl-navigation__link--home pnl-navigation__link--home-mobile\"\n                        href={this.navigation.homeUrl}\n                        aria-label={getTranslatedLabel(this.locale).home}\n                    >\n                        <img\n                            src=\"https://cdn.postnl.nl/images/icons/svg/logo-postnl-outline.svg\"\n                            alt=\"PostNL logo\"\n                        />\n                        <span class=\"visually-hidden\">\n                            {getTranslatedLabel(this.locale).home}\n                        </span>\n                    </a>\n                    {(this.stsServer || this.bpStsServer) && (\n                        <pnl-user-menu\n                            log-level={this.logLevel}\n                            language={this.locale}\n                            domain={this.domain}\n                            sts-type={this.stsType}\n                            sts-server={this.stsServer}\n                            client-id={this.clientId}\n                            audience={this.audience}\n                            scope={this.scope}\n                            silentRenewPage={this.silentRenewPage}\n                            silentRenewScript={this.silentRenewScript}\n                            redirect-uri={this.redirectUri}\n                            post-logout-redirect-uri={\n                                this.postLogoutRedirectUri\n                            }\n                            bp-sts-server={this.bpStsServer}\n                            bp-client-id={this.bpClientId}\n                        ></pnl-user-menu>\n                    )}\n                    {this.open && (\n                        <div class=\"pnl-navigation\">\n                            <div\n                                id=\"pnl-main-nav-menu-container\"\n                                class=\"pnl-navigation-container\"\n                            >\n                                <pnl-search\n                                    class=\"pnl-navigation__search\"\n                                    domain={this.domain}\n                                    locale={this.locale}\n                                ></pnl-search>\n                                <pnl-language-selector\n                                    availableLocales={this.availableLocales}\n                                    locale={this.locale}\n                                ></pnl-language-selector>\n                                <pnl-navigation-menu\n                                    navigation={this.navigation}\n                                    locale={this.locale}\n                                ></pnl-navigation-menu>\n                            </div>\n                        </div>\n                    )}\n                </div>\n            </div>\n        );\n    }\n}\n"],"mappings":"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"}