{"version":3,"names":["PnlCookieWidgetOverview","render","showLanguageSelector","this","availableLocales","split","length","h","class","locale","innerHTML","content","pageTitle","tabindex","onKeyUp","e","key","openSettings","onClick","changeCookiesText","images","chevronRight","saveSettings","acceptCookiesText","refuseOptionalCookiesText","settingsSelected","emit","acceptAll","settings","categories","forEach","category","checked","saved","PnlCookieWidgetSettings","domain","map","c","required","title","description","type","id","onInput","setPreference","target","htmlFor","consentText","saveButtonText","selectedCategory","find","f","console","error","_a","navigateToOverview","cancelled"],"sources":["./src/components/pnl-cookie-widget/pnl-cookie-widget-overview/pnl-cookie-widget-overview.tsx","./src/components/pnl-cookie-widget/pnl-cookie-widget-settings/pnl-cookie-widget-settings.tsx"],"sourcesContent":["import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\nimport { CookieWallSettings, LandingPage } from '../models/cookie-wall.models';\nimport { images } from '../../../helpers/inline-images.service';\n\n@Component({\n    tag: 'pnl-cookie-widget-overview',\n})\nexport class PnlCookieWidgetOverview {\n    @Prop() content: LandingPage;\n    @Prop() settings: CookieWallSettings;\n    @Prop() locale: string;\n    @Prop() availableLocales: string;\n\n    @Event() settingsSelected: EventEmitter<void>;\n    @Event() saved: EventEmitter<void>;\n\n    render() {\n        const showLanguageSelector =\n            this.availableLocales.split(',').length > 1;\n\n        return (\n            <div class=\"pci-modal\">\n                <div class=\"pci-modal__content overview wide\">\n                    <div class=\"pci-modal__body\">\n                        <div class=\"pci-modal__body-inner\">\n                            {showLanguageSelector && (\n                                <pnl-language-selector\n                                    available-locales={this.availableLocales}\n                                    locale={this.locale}\n                                ></pnl-language-selector>\n                            )}\n                            <p class=\"h1\" innerHTML={this.content.pageTitle}></p>\n                            <div innerHTML={this.content.content}></div>\n                            <div class=\"whitespace\"></div>\n                        </div>\n                    </div>\n\n                    <div class=\"pci-modal__footer\">\n                        <div class=\"pci-cookie-button-container\">\n                            <a\n                                class=\"pci-widget-link pci-widget-actions\"\n                                tabindex=\"0\"\n                                onKeyUp={(e) => e.key === \"Enter\" ? this.openSettings() : null}\n                                onClick={() => this.openSettings()}>\n                                    <span class=\"pci-link__text\">\n                                        {this.content.changeCookiesText}\n                                    </span>\n                                <i class=\"pci-link-chevron\" innerHTML={images.chevronRight}></i>\n                            </a>\n                            <div class=\"pci-cookie-button-inner\">\n                                <button\n                                    class=\"pci-button pci-button--primary pci-widget-actions\"\n                                    onClick={() => this.saveSettings(true)}>\n                                        <span class=\"pci-button__text\">\n                                            {this.content.acceptCookiesText}\n                                        </span>\n                                </button>\n                                <button\n                                    class=\"pci-button pci-button--secondary pci-widget-actions\"\n                                    onClick={() => this.saveSettings(false)}>\n                                    <span class=\"pci-button__text\">\n                                        {this.content.refuseOptionalCookiesText}\n                                    </span>\n                                </button>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        );\n    }\n\n    openSettings() {\n        this.settingsSelected.emit();\n    }\n\n    saveSettings(acceptAll: boolean) {\n        if (acceptAll) {\n            this.settings.categories.forEach((category) => {\n                category.checked = true;\n            });\n        }\n\n        this.saved.emit();\n    }\n}\n","import {Component, Prop, h, State, Event, EventEmitter, Listen} from '@stencil/core';\nimport { CookieWallSettings, SettingsPage } from '../models/cookie-wall.models';\n\n@Component({\n    tag: 'pnl-cookie-widget-settings'\n})\nexport class PnlCookieWidgetSettings {\n    @Prop() content: SettingsPage;\n    @Prop() settings: CookieWallSettings;\n    @Prop() locale: string;\n    @Prop() availableLocales: string;\n\n    @State() value: string;\n    @State() selectValue: string;\n    @State() categoryContent: string;\n\n    @Event() cancelled: EventEmitter<void>;\n    @Event() saved: EventEmitter<void>;\n\n    render() {\n        return (\n            <div class=\"pci-modal\">\n                <div class=\"pci-modal__content settings\">\n                    <pnl-focus-header\n                        domain=\"postnl.nl\"\n                        locale={this.locale}\n                        availableLocales={this.availableLocales}\n                    >\n                    </pnl-focus-header>\n                    <div class=\"pci-modal__body\">\n                        <div class=\"pci-inner-container\">\n                            <p class=\"h1\" innerHTML={this.content.pageTitle}></p>\n                            <div innerHTML={this.content.content}></div>\n\n                            <ul class=\"pci-checkbox__ul\">\n                                {this.settings.categories.map(c => {\n                                    return (\n                                        <li class=\"pci-checkbox__li\">\n                                            {c.required &&\n                                                <div>\n                                                    <span innerHTML={c.title}></span>\n                                                    <div class=\"pci-checkbox__content\"\n                                                         innerHTML={c.description}>\n                                                    </div>\n                                                </div>\n                                            }\n                                            {!c.required &&\n                                                <div>\n                                                    <div class=\"pci-checkbox\">\n                                                        <input type=\"checkbox\"\n                                                               class=\"pci-checkbox__input\"\n                                                               id={c.category}\n                                                               onInput={(e) => this.setPreference(e.target as HTMLInputElement)}\n                                                               checked={c.checked} />\n                                                        <label class=\"pci-checkbox__label\" htmlFor={c.category}>\n                                                            <span innerHTML={c.title}></span>\n                                                        </label>\n                                                    </div>\n                                                    <div class=\"pci-checkbox__content\"\n                                                         innerHTML={c.description}>\n                                                    </div>\n                                                </div>\n                                            }\n                                        </li>\n                                    );\n                                })\n                                }\n                            </ul>\n                            <div class=\"pci-consent__paragraph\" innerHTML={this.content.consentText}></div>\n                            <div class=\"pci-cookie-button-container\">\n                                <button type=\"submit\" class=\"pci-button pci-button--primary pci-button-savesettings\" onClick={() => this.saveSettings()}>\n                                    <span class=\"pci-button__text\">{this.content.saveButtonText}</span>\n                                </button>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        );\n    }\n\n    setPreference(target: HTMLInputElement) {\n        const selectedCategory = this.settings.categories.find(f => f.category === target.id);\n        if (!selectedCategory) {\n            console.error('Given category is not implemented:', target.id ?? 'null');\n        } else {\n            selectedCategory.checked = target.checked;\n        }\n    }\n\n    saveSettings() {\n        this.saved.emit();\n    }\n\n    @Listen('cancel')\n    navigateToOverview() {\n        this.cancelled.emit();\n    }\n}\n"],"mappings":"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"}