@edugouvfr/ngx-dsfr-ext/esm2022/lib/panel/panel.component.mjs

NgxDsfrExt est une extension au package @edugouvfr/ngx-dsfr (portage Angular des éléments DSFR)

import { Component, EventEmitter, Input, Output, ViewEncapsulation, inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { DsfrButtonModule, DsfrI18nPipe, DsfrI18nService, Language, newUniqueId } from '@edugouvfr/ngx-dsfr';
import { MESSAGES_EN } from './i18n/messages.en';
import { MESSAGES_FR } from './i18n/messages.fr';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
export class DsfrPanelComponent {
    constructor() {
        /**
         * Indique si le panel doit être fermé initialement.
         * Si null le panel ne sera pas refermable.
         */
        this.expanded = true;
        /**
         * Événement présentant le nouvel état du panel.
         */
        this.expandedChange = new EventEmitter();
        this.i18n = inject(DsfrI18nService);
        this.i18n.extendsLabelsBundle(Language.EN, MESSAGES_EN);
        this.i18n.extendsLabelsBundle(Language.FR, MESSAGES_FR);
    }
    ngOnInit() {
        this.panelId ??= newUniqueId();
        if (this.expanded === undefined) {
            this.expanded = true;
        }
        this.messageExpandButton = this.expanded ? 'panel.collapse' : 'panel.expand';
    }
    /** @Internal */
    toggleExpand(e) {
        e.preventDefault();
        e.stopPropagation();
        this.expanded = !this.expanded;
        this.expandedChange.emit(this.expanded);
        this.messageExpandButton = this.expanded ? 'panel.collapse' : 'panel.expand';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DsfrPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: DsfrPanelComponent, isStandalone: true, selector: "dsfr-ext-panel, dsfrx-panel", inputs: { heading: "heading", headingLevel: "headingLevel", panelId: "panelId", expanded: "expanded" }, outputs: { expandedChange: "expandedChange" }, ngImport: i0, template: "<div class=\"dsfrx-panel\">\n  <div class=\"dsfrx-panel__header fr-background-alt--grey\">\n    <ng-container *ngTemplateOutlet=\"dsfrPanelHeaderExpand\"></ng-container>\n  </div>\n  <!--content + footer-->\n  <div\n    [ngClass]=\"{ 'dsfrx-panel__collapse': true, 'dsfrx-panel__collapse--expanded': expanded || expanded === null }\"\n    [id]=\"panelId\">\n    <div class=\"dsfrx-panel__content\">\n      <ng-content></ng-content>\n    </div>\n    <div class=\"dsfrx-panel__footer fr-background-alt--grey\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<ng-template #dsfrPanelHeaderExpand>\n  <ng-container *ngTemplateOutlet=\"dsfrPanelHeaderTitle\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"dsfrPanelHeaderActions\"></ng-container>\n</ng-template>\n\n<!--TITRE-->\n<ng-template #dsfrPanelHeaderTitle>\n  <ng-container>\n    @switch (headingLevel) {\n      @default {\n        <h1 class=\"dsfrx-panel__title\">{{ heading }}</h1>\n      }\n      @case ('H2') {\n        <h2 class=\"dsfrx-panel__title\">{{ heading }}</h2>\n      }\n      @case ('H3') {\n        <h3 class=\"dsfrx-panel__title\">{{ heading }}</h3>\n      }\n      @case ('H4') {\n        <h4 class=\"dsfrx-panel__title\">{{ heading }}</h4>\n      }\n      @case ('H5') {\n        <h5 class=\"dsfrx-panel__title\">{{ heading }}</h5>\n      }\n      @case ('H6') {\n        <h6 class=\"dsfrx-panel__title\">{{ heading }}</h6>\n      }\n    }\n  </ng-container>\n</ng-template>\n\n<ng-template #dsfrPanelHeaderActions>\n  <div class=\"dsfrx-panel__actions\">\n    <ng-content select=\"[actions]\"></ng-content>\n    @if (expanded !== null) {\n      <button\n        type=\"button\"\n        (click)=\"toggleExpand($event)\"\n        class=\"dsfrx-panel__btn\"\n        [attr.aria-expanded]=\"expanded\"\n        [attr.aria-label]=\"expanded ? ('panel.collapse' | dsfrI18n) : ('panel.expand' | dsfrI18n)\"\n        [attr.aria-controls]=\"panelId\"\n        data-testid=\"expand-btn\">\n        <span class=\"fr-sr-only\">{{ messageExpandButton | dsfrI18n }}</span>\n        @if (expanded) {\n          <span class=\"fr-icon-subtract-line\" aria-hidden=\"true\"></span>\n        } @else {\n          <span class=\"fr-icon-add-line\" aria-hidden=\"true\"></span>\n        }\n      </button>\n    }\n  </div>\n</ng-template>\n", styles: [".dsfrx-panel{width:100%;display:flex;flex-direction:column;box-shadow:0 0 0 1px var(--border-default-grey)}.dsfrx-panel__header{display:flex;justify-content:space-between;align-items:center;padding:.625rem 2rem;box-sizing:border-box;margin:0;max-height:3rem}.dsfrx-panel__title{font-size:1.375rem;line-height:1.75rem;margin-bottom:0;font-weight:700}.dsfrx-panel__actions{display:flex;align-items:center}.dsfrx-panel__actions .dsfrx-panel__btn{margin-left:1rem}.dsfrx-panel__content{padding:2rem;box-sizing:border-box}.dsfrx-panel__footer{padding:.25rem 2rem;font-size:.75rem}.dsfrx-panel__footer>p{margin-bottom:0;font-size:.75rem}.dsfrx-panel__collapse:not(.dsfrx-panel__collapse--expanded){overflow:hidden;visibility:collapse;max-height:0}.dsfrx-panel__collapse--expanded{max-height:100%}.dsfrx-panel h1.panel__header,.dsfrx-panel h2.panel__header,.dsfrx-panel h3.panel__header,.dsfrx-panel h4.panel__header,.dsfrx-panel h5.panel__header,.dsfrx-panel h6.panel__header{position:relative;padding:0}.dsfrx-panel h1.panel__header:hover,.dsfrx-panel h2.panel__header:hover,.dsfrx-panel h3.panel__header:hover,.dsfrx-panel h4.panel__header:hover,.dsfrx-panel h5.panel__header:hover,.dsfrx-panel h6.panel__header:hover{background-color:var(--hover-tint)}@media screen and (max-width: 575px){.dsfrx-panel__header{padding:.625rem;max-height:initial;flex-wrap:wrap;justify-content:end}.dsfrx-panel__title{width:100%;order:2}.dsfrx-panel__actions{order:1;margin-bottom:.625rem}.dsfrx-panel__content{padding:1rem .625rem}.dsfrx-panel__footer{padding:.25rem .625rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: DsfrButtonModule }, { kind: "pipe", type: DsfrI18nPipe, name: "dsfrI18n" }], encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DsfrPanelComponent, decorators: [{
            type: Component,
            args: [{ selector: 'dsfr-ext-panel, dsfrx-panel', standalone: true, imports: [CommonModule, DsfrButtonModule, DsfrI18nPipe], encapsulation: ViewEncapsulation.None, template: "<div class=\"dsfrx-panel\">\n  <div class=\"dsfrx-panel__header fr-background-alt--grey\">\n    <ng-container *ngTemplateOutlet=\"dsfrPanelHeaderExpand\"></ng-container>\n  </div>\n  <!--content + footer-->\n  <div\n    [ngClass]=\"{ 'dsfrx-panel__collapse': true, 'dsfrx-panel__collapse--expanded': expanded || expanded === null }\"\n    [id]=\"panelId\">\n    <div class=\"dsfrx-panel__content\">\n      <ng-content></ng-content>\n    </div>\n    <div class=\"dsfrx-panel__footer fr-background-alt--grey\">\n      <ng-content select=\"[footer]\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<ng-template #dsfrPanelHeaderExpand>\n  <ng-container *ngTemplateOutlet=\"dsfrPanelHeaderTitle\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"dsfrPanelHeaderActions\"></ng-container>\n</ng-template>\n\n<!--TITRE-->\n<ng-template #dsfrPanelHeaderTitle>\n  <ng-container>\n    @switch (headingLevel) {\n      @default {\n        <h1 class=\"dsfrx-panel__title\">{{ heading }}</h1>\n      }\n      @case ('H2') {\n        <h2 class=\"dsfrx-panel__title\">{{ heading }}</h2>\n      }\n      @case ('H3') {\n        <h3 class=\"dsfrx-panel__title\">{{ heading }}</h3>\n      }\n      @case ('H4') {\n        <h4 class=\"dsfrx-panel__title\">{{ heading }}</h4>\n      }\n      @case ('H5') {\n        <h5 class=\"dsfrx-panel__title\">{{ heading }}</h5>\n      }\n      @case ('H6') {\n        <h6 class=\"dsfrx-panel__title\">{{ heading }}</h6>\n      }\n    }\n  </ng-container>\n</ng-template>\n\n<ng-template #dsfrPanelHeaderActions>\n  <div class=\"dsfrx-panel__actions\">\n    <ng-content select=\"[actions]\"></ng-content>\n    @if (expanded !== null) {\n      <button\n        type=\"button\"\n        (click)=\"toggleExpand($event)\"\n        class=\"dsfrx-panel__btn\"\n        [attr.aria-expanded]=\"expanded\"\n        [attr.aria-label]=\"expanded ? ('panel.collapse' | dsfrI18n) : ('panel.expand' | dsfrI18n)\"\n        [attr.aria-controls]=\"panelId\"\n        data-testid=\"expand-btn\">\n        <span class=\"fr-sr-only\">{{ messageExpandButton | dsfrI18n }}</span>\n        @if (expanded) {\n          <span class=\"fr-icon-subtract-line\" aria-hidden=\"true\"></span>\n        } @else {\n          <span class=\"fr-icon-add-line\" aria-hidden=\"true\"></span>\n        }\n      </button>\n    }\n  </div>\n</ng-template>\n", styles: [".dsfrx-panel{width:100%;display:flex;flex-direction:column;box-shadow:0 0 0 1px var(--border-default-grey)}.dsfrx-panel__header{display:flex;justify-content:space-between;align-items:center;padding:.625rem 2rem;box-sizing:border-box;margin:0;max-height:3rem}.dsfrx-panel__title{font-size:1.375rem;line-height:1.75rem;margin-bottom:0;font-weight:700}.dsfrx-panel__actions{display:flex;align-items:center}.dsfrx-panel__actions .dsfrx-panel__btn{margin-left:1rem}.dsfrx-panel__content{padding:2rem;box-sizing:border-box}.dsfrx-panel__footer{padding:.25rem 2rem;font-size:.75rem}.dsfrx-panel__footer>p{margin-bottom:0;font-size:.75rem}.dsfrx-panel__collapse:not(.dsfrx-panel__collapse--expanded){overflow:hidden;visibility:collapse;max-height:0}.dsfrx-panel__collapse--expanded{max-height:100%}.dsfrx-panel h1.panel__header,.dsfrx-panel h2.panel__header,.dsfrx-panel h3.panel__header,.dsfrx-panel h4.panel__header,.dsfrx-panel h5.panel__header,.dsfrx-panel h6.panel__header{position:relative;padding:0}.dsfrx-panel h1.panel__header:hover,.dsfrx-panel h2.panel__header:hover,.dsfrx-panel h3.panel__header:hover,.dsfrx-panel h4.panel__header:hover,.dsfrx-panel h5.panel__header:hover,.dsfrx-panel h6.panel__header:hover{background-color:var(--hover-tint)}@media screen and (max-width: 575px){.dsfrx-panel__header{padding:.625rem;max-height:initial;flex-wrap:wrap;justify-content:end}.dsfrx-panel__title{width:100%;order:2}.dsfrx-panel__actions{order:1;margin-bottom:.625rem}.dsfrx-panel__content{padding:1rem .625rem}.dsfrx-panel__footer{padding:.25rem .625rem}}\n"] }]
        }], ctorParameters: () => [], propDecorators: { heading: [{
                type: Input
            }], headingLevel: [{
                type: Input
            }], panelId: [{
                type: Input
            }], expanded: [{
                type: Input
            }], expandedChange: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFuZWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWRzZnItZXh0L3NyYy9saWIvcGFuZWwvcGFuZWwuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWRzZnItZXh0L3NyYy9saWIvcGFuZWwvcGFuZWwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFFMUcsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxZQUFZLEVBQUUsZUFBZSxFQUFFLFFBQVEsRUFBRSxXQUFXLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQztBQUU3RyxPQUFPLEVBQUUsV0FBVyxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFDakQsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLG9CQUFvQixDQUFDOzs7QUFVakQsTUFBTSxPQUFPLGtCQUFrQjtJQTZCN0I7UUFmQTs7O1dBR0c7UUFDTSxhQUFRLEdBQW1CLElBQUksQ0FBQztRQUV6Qzs7V0FFRztRQUNPLG1CQUFjLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztRQUkvQyxTQUFJLEdBQUcsTUFBTSxDQUFDLGVBQWUsQ0FBQyxDQUFDO1FBR3JDLElBQUksQ0FBQyxJQUFJLENBQUMsbUJBQW1CLENBQUMsUUFBUSxDQUFDLEVBQUUsRUFBRSxXQUFXLENBQUMsQ0FBQztRQUN4RCxJQUFJLENBQUMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLFFBQVEsQ0FBQyxFQUFFLEVBQUUsV0FBVyxDQUFDLENBQUM7SUFDMUQsQ0FBQztJQUVELFFBQVE7UUFDTixJQUFJLENBQUMsT0FBTyxLQUFLLFdBQVcsRUFBRSxDQUFDO1FBRS9CLElBQUksSUFBSSxDQUFDLFFBQVEsS0FBSyxTQUFTLEVBQUUsQ0FBQztZQUNoQyxJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQztRQUN2QixDQUFDO1FBQ0QsSUFBSSxDQUFDLG1CQUFtQixHQUFHLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLGdCQUFnQixDQUFDLENBQUMsQ0FBQyxjQUFjLENBQUM7SUFDL0UsQ0FBQztJQUVELGdCQUFnQjtJQUNoQixZQUFZLENBQUMsQ0FBUTtRQUNuQixDQUFDLENBQUMsY0FBYyxFQUFFLENBQUM7UUFDbkIsQ0FBQyxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBQ3BCLElBQUksQ0FBQyxRQUFRLEdBQUcsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDO1FBQy9CLElBQUksQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUN4QyxJQUFJLENBQUMsbUJBQW1CLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsZ0JBQWdCLENBQUMsQ0FBQyxDQUFDLGNBQWMsQ0FBQztJQUMvRSxDQUFDOytHQWxEVSxrQkFBa0I7bUdBQWxCLGtCQUFrQiw4T0NoQi9CLG15RUFzRUEsK2tERHpEWSxZQUFZLG1TQUFFLGdCQUFnQiwwQkFBRSxZQUFZOzs0RkFHM0Msa0JBQWtCO2tCQVI5QixTQUFTOytCQUNFLDZCQUE2QixjQUczQixJQUFJLFdBQ1AsQ0FBQyxZQUFZLEVBQUUsZ0JBQWdCLEVBQUUsWUFBWSxDQUFDLGlCQUN4QyxpQkFBaUIsQ0FBQyxJQUFJO3dEQU01QixPQUFPO3NCQUFmLEtBQUs7Z0JBR0csWUFBWTtzQkFBcEIsS0FBSztnQkFLRyxPQUFPO3NCQUFmLEtBQUs7Z0JBTUcsUUFBUTtzQkFBaEIsS0FBSztnQkFLSSxjQUFjO3NCQUF2QixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkluaXQsIE91dHB1dCwgVmlld0VuY2Fwc3VsYXRpb24sIGluamVjdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgRHNmckJ1dHRvbk1vZHVsZSwgRHNmckkxOG5QaXBlLCBEc2ZySTE4blNlcnZpY2UsIExhbmd1YWdlLCBuZXdVbmlxdWVJZCB9IGZyb20gJ0BlZHVnb3V2ZnIvbmd4LWRzZnInO1xuaW1wb3J0IHsgRHNmckhlYWRpbmdMZXZlbCB9IGZyb20gJy4uL3NoYXJlZC9tb2RlbHMvaGVhZGluZy1sZXZlbCc7XG5pbXBvcnQgeyBNRVNTQUdFU19FTiB9IGZyb20gJy4vaTE4bi9tZXNzYWdlcy5lbic7XG5pbXBvcnQgeyBNRVNTQUdFU19GUiB9IGZyb20gJy4vaTE4bi9tZXNzYWdlcy5mcic7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2RzZnItZXh0LXBhbmVsLCBkc2ZyeC1wYW5lbCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9wYW5lbC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3BhbmVsLmNvbXBvbmVudC5zY3NzJ10sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIERzZnJCdXR0b25Nb2R1bGUsIERzZnJJMThuUGlwZV0sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG59KVxuZXhwb3J0IGNsYXNzIERzZnJQYW5lbENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIC8qKlxuICAgKiBUaXRyZSBkdSBwYW5lbC5cbiAgICovXG4gIEBJbnB1dCgpIGhlYWRpbmc6IHN0cmluZztcblxuICAvKiogTGUgbml2ZWF1IGRlIHRpdHJlIGRldmFudCDDqnRyZSB1dGlsaXPDqS4gKi9cbiAgQElucHV0KCkgaGVhZGluZ0xldmVsOiBEc2ZySGVhZGluZ0xldmVsO1xuXG4gIC8qKlxuICAgKiAgSWRlbnRpZmlhbnQgZHUgcGFuZWwgc3VyIGxhIHBhZ2UuIElkZW50aWZpYW50IHVuaXF1ZSBnw6luw6lyw6kgcGFyIGTDqWZhdXQgc2kgbm9uIHJlbnNlaWduw6kuXG4gICAqL1xuICBASW5wdXQoKSBwYW5lbElkOiBzdHJpbmc7XG5cbiAgLyoqXG4gICAqIEluZGlxdWUgc2kgbGUgcGFuZWwgZG9pdCDDqnRyZSBmZXJtw6kgaW5pdGlhbGVtZW50LlxuICAgKiBTaSBudWxsIGxlIHBhbmVsIG5lIHNlcmEgcGFzIHJlZmVybWFibGUuXG4gICAqL1xuICBASW5wdXQoKSBleHBhbmRlZDogYm9vbGVhbiB8IG51bGwgPSB0cnVlO1xuXG4gIC8qKlxuICAgKiDDiXbDqW5lbWVudCBwcsOpc2VudGFudCBsZSBub3V2ZWwgw6l0YXQgZHUgcGFuZWwuXG4gICAqL1xuICBAT3V0cHV0KCkgZXhwYW5kZWRDaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XG5cbiAgcHJvdGVjdGVkIG1lc3NhZ2VFeHBhbmRCdXR0b246IHN0cmluZztcblxuICBwcml2YXRlIGkxOG4gPSBpbmplY3QoRHNmckkxOG5TZXJ2aWNlKTtcblxuICBjb25zdHJ1Y3RvcigpIHtcbiAgICB0aGlzLmkxOG4uZXh0ZW5kc0xhYmVsc0J1bmRsZShMYW5ndWFnZS5FTiwgTUVTU0FHRVNfRU4pO1xuICAgIHRoaXMuaTE4bi5leHRlbmRzTGFiZWxzQnVuZGxlKExhbmd1YWdlLkZSLCBNRVNTQUdFU19GUik7XG4gIH1cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICB0aGlzLnBhbmVsSWQgPz89IG5ld1VuaXF1ZUlkKCk7XG5cbiAgICBpZiAodGhpcy5leHBhbmRlZCA9PT0gdW5kZWZpbmVkKSB7XG4gICAgICB0aGlzLmV4cGFuZGVkID0gdHJ1ZTtcbiAgICB9XG4gICAgdGhpcy5tZXNzYWdlRXhwYW5kQnV0dG9uID0gdGhpcy5leHBhbmRlZCA/ICdwYW5lbC5jb2xsYXBzZScgOiAncGFuZWwuZXhwYW5kJztcbiAgfVxuXG4gIC8qKiBASW50ZXJuYWwgKi9cbiAgdG9nZ2xlRXhwYW5kKGU6IEV2ZW50KSB7XG4gICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgIGUuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgdGhpcy5leHBhbmRlZCA9ICF0aGlzLmV4cGFuZGVkO1xuICAgIHRoaXMuZXhwYW5kZWRDaGFuZ2UuZW1pdCh0aGlzLmV4cGFuZGVkKTtcbiAgICB0aGlzLm1lc3NhZ2VFeHBhbmRCdXR0b24gPSB0aGlzLmV4cGFuZGVkID8gJ3BhbmVsLmNvbGxhcHNlJyA6ICdwYW5lbC5leHBhbmQnO1xuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwiZHNmcngtcGFuZWxcIj5cbiAgPGRpdiBjbGFzcz1cImRzZnJ4LXBhbmVsX19oZWFkZXIgZnItYmFja2dyb3VuZC1hbHQtLWdyZXlcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiZHNmclBhbmVsSGVhZGVyRXhwYW5kXCI+PC9uZy1jb250YWluZXI+XG4gIDwvZGl2PlxuICA8IS0tY29udGVudCArIGZvb3Rlci0tPlxuICA8ZGl2XG4gICAgW25nQ2xhc3NdPVwieyAnZHNmcngtcGFuZWxfX2NvbGxhcHNlJzogdHJ1ZSwgJ2RzZnJ4LXBhbmVsX19jb2xsYXBzZS0tZXhwYW5kZWQnOiBleHBhbmRlZCB8fCBleHBhbmRlZCA9PT0gbnVsbCB9XCJcbiAgICBbaWRdPVwicGFuZWxJZFwiPlxuICAgIDxkaXYgY2xhc3M9XCJkc2ZyeC1wYW5lbF9fY29udGVudFwiPlxuICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJkc2ZyeC1wYW5lbF9fZm9vdGVyIGZyLWJhY2tncm91bmQtYWx0LS1ncmV5XCI+XG4gICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbZm9vdGVyXVwiPjwvbmctY29udGVudD5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj5cblxuPG5nLXRlbXBsYXRlICNkc2ZyUGFuZWxIZWFkZXJFeHBhbmQ+XG4gIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJkc2ZyUGFuZWxIZWFkZXJUaXRsZVwiPjwvbmctY29udGFpbmVyPlxuICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiZHNmclBhbmVsSGVhZGVyQWN0aW9uc1wiPjwvbmctY29udGFpbmVyPlxuPC9uZy10ZW1wbGF0ZT5cblxuPCEtLVRJVFJFLS0+XG48bmctdGVtcGxhdGUgI2RzZnJQYW5lbEhlYWRlclRpdGxlPlxuICA8bmctY29udGFpbmVyPlxuICAgIEBzd2l0Y2ggKGhlYWRpbmdMZXZlbCkge1xuICAgICAgQGRlZmF1bHQge1xuICAgICAgICA8aDEgY2xhc3M9XCJkc2ZyeC1wYW5lbF9fdGl0bGVcIj57eyBoZWFkaW5nIH19PC9oMT5cbiAgICAgIH1cbiAgICAgIEBjYXNlICgnSDInKSB7XG4gICAgICAgIDxoMiBjbGFzcz1cImRzZnJ4LXBhbmVsX190aXRsZVwiPnt7IGhlYWRpbmcgfX08L2gyPlxuICAgICAgfVxuICAgICAgQGNhc2UgKCdIMycpIHtcbiAgICAgICAgPGgzIGNsYXNzPVwiZHNmcngtcGFuZWxfX3RpdGxlXCI+e3sgaGVhZGluZyB9fTwvaDM+XG4gICAgICB9XG4gICAgICBAY2FzZSAoJ0g0Jykge1xuICAgICAgICA8aDQgY2xhc3M9XCJkc2ZyeC1wYW5lbF9fdGl0bGVcIj57eyBoZWFkaW5nIH19PC9oND5cbiAgICAgIH1cbiAgICAgIEBjYXNlICgnSDUnKSB7XG4gICAgICAgIDxoNSBjbGFzcz1cImRzZnJ4LXBhbmVsX190aXRsZVwiPnt7IGhlYWRpbmcgfX08L2g1PlxuICAgICAgfVxuICAgICAgQGNhc2UgKCdINicpIHtcbiAgICAgICAgPGg2IGNsYXNzPVwiZHNmcngtcGFuZWxfX3RpdGxlXCI+e3sgaGVhZGluZyB9fTwvaDY+XG4gICAgICB9XG4gICAgfVxuICA8L25nLWNvbnRhaW5lcj5cbjwvbmctdGVtcGxhdGU+XG5cbjxuZy10ZW1wbGF0ZSAjZHNmclBhbmVsSGVhZGVyQWN0aW9ucz5cbiAgPGRpdiBjbGFzcz1cImRzZnJ4LXBhbmVsX19hY3Rpb25zXCI+XG4gICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2FjdGlvbnNdXCI+PC9uZy1jb250ZW50PlxuICAgIEBpZiAoZXhwYW5kZWQgIT09IG51bGwpIHtcbiAgICAgIDxidXR0b25cbiAgICAgICAgdHlwZT1cImJ1dHRvblwiXG4gICAgICAgIChjbGljayk9XCJ0b2dnbGVFeHBhbmQoJGV2ZW50KVwiXG4gICAgICAgIGNsYXNzPVwiZHNmcngtcGFuZWxfX2J0blwiXG4gICAgICAgIFthdHRyLmFyaWEtZXhwYW5kZWRdPVwiZXhwYW5kZWRcIlxuICAgICAgICBbYXR0ci5hcmlhLWxhYmVsXT1cImV4cGFuZGVkID8gKCdwYW5lbC5jb2xsYXBzZScgfCBkc2ZySTE4bikgOiAoJ3BhbmVsLmV4cGFuZCcgfCBkc2ZySTE4bilcIlxuICAgICAgICBbYXR0ci5hcmlhLWNvbnRyb2xzXT1cInBhbmVsSWRcIlxuICAgICAgICBkYXRhLXRlc3RpZD1cImV4cGFuZC1idG5cIj5cbiAgICAgICAgPHNwYW4gY2xhc3M9XCJmci1zci1vbmx5XCI+e3sgbWVzc2FnZUV4cGFuZEJ1dHRvbiB8IGRzZnJJMThuIH19PC9zcGFuPlxuICAgICAgICBAaWYgKGV4cGFuZGVkKSB7XG4gICAgICAgICAgPHNwYW4gY2xhc3M9XCJmci1pY29uLXN1YnRyYWN0LWxpbmVcIiBhcmlhLWhpZGRlbj1cInRydWVcIj48L3NwYW4+XG4gICAgICAgIH0gQGVsc2Uge1xuICAgICAgICAgIDxzcGFuIGNsYXNzPVwiZnItaWNvbi1hZGQtbGluZVwiIGFyaWEtaGlkZGVuPVwidHJ1ZVwiPjwvc3Bhbj5cbiAgICAgICAgfVxuICAgICAgPC9idXR0b24+XG4gICAgfVxuICA8L2Rpdj5cbjwvbmctdGVtcGxhdGU+XG4iXX0=