@provoly/dashboard 0.11.0

package/fesm2022/provoly-dashboard-restitution.mjs

@@ -0,0 +1,557 @@
+import * as i3 from '@angular/common';
+import { CommonModule, DatePipe } from '@angular/common';
+import * as i0 from '@angular/core';
+import { Component, ViewEncapsulation, EventEmitter, Input, Output, TemplateRef, ElementRef, ViewChild, NgModule } from '@angular/core';
+import * as i4 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+import * as i1 from '@provoly/dashboard';
+import { SubscriptionnerDirective, DEFAULT_RESTITUTION_ICON_URL, PryVisibilityType, LibraryTypes, DataSourceActions, ClassActions, ConfigActions, FieldActions, ClassSelectors, DataSourceSelectors, SearchActions, GeoMetadata, ViewMode, ConfigSelectors, DashboardSelectors, DashboardGridLayout, DashboardActions, PryCoreModule, PryIconModule, PrySelectModule, PryDashboardModule, PryShareModule, PryI18nModule, PryOverlayModule } from '@provoly/dashboard';
+import { PryCardModule } from '@provoly/dashboard/components/card';
+import * as i6 from '@provoly/dashboard/components/checkbox';
+import { PryCheckboxModule } from '@provoly/dashboard/components/checkbox';
+import * as i8 from '@provoly/dashboard/components/sinceDate';
+import { PrySinceDateModule } from '@provoly/dashboard/components/sinceDate';
+import * as i5 from '@provoly/dashboard/components/stepper';
+import { PryStepperModule } from '@provoly/dashboard/components/stepper';
+import { PrySearchModule } from '@provoly/dashboard/search';
+import * as i2$1 from '@angular/cdk/overlay';
+import { OverlayConfig } from '@angular/cdk/overlay';
+import { TemplatePortal } from '@angular/cdk/portal';
+import { BehaviorSubject, Subject, map, combineLatest } from 'rxjs';
+import * as i2 from '@ngrx/store';
+import { v4 } from 'uuid';
+
+class PryCatalogCssComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryCatalogCssComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryCatalogCssComponent, selector: "pry-restitution-css", ngImport: i0, template: '', isInline: true, styles: [".o-catalog__filters__by-type__list,.o-catalog__list{margin:0;padding:0}.o-catalog__filters__by-type__list li,.o-catalog__list li{list-style:none}.o-catalog{display:flex;flex-direction:column;overflow:scroll;width:28.125rem;height:100%;padding:.9375rem;border-right-width:.0625rem;border-right-style:solid}.o-catalog .a-h2{padding-top:.625rem}.o-catalog pry-restitution{flex:1}.o-catalog__filters{padding-top:.3125rem}.o-catalog__filters__by-name{position:relative;margin-bottom:1.25rem}.o-catalog__filters__by-name .a-icon{position:absolute;left:.6875rem;bottom:.5625rem;pointer-events:none}.o-catalog__filters__by-name .a-form-field{width:60%;padding-left:2.1875rem}.o-catalog__filters__by-type{display:flex;flex-wrap:wrap;column-gap:1.25rem}.o-catalog__filters__by-type__list{display:flex;gap:.3125rem}.o-catalog__filters__by-type__list li{width:2.1875rem;height:2.1875rem}.o-catalog__filters__by-type__list li .a-label{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;margin:0;border-width:.0625rem;border-style:solid;border-radius:.3125rem}.o-catalog__filters__by-type .a-btn.a-btn--icon-text.-link-like{margin-top:5px;font-weight:300;font-size:.8125rem}.o-catalog__filters__by-type .a-btn.a-btn--icon-text.-link-like[disabled]{opacity:0}.o-catalog .is-point{cursor:default}.o-catalog__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:.9375rem;justify-content:space-around;padding:1.875rem 0}.o-catalog__list__icon{cursor:pointer}.o-catalog__list__item{position:relative;display:flex;flex-direction:column;justify-content:space-between;align-items:center;max-width:8.125rem;max-height:13.125rem;text-align:center;cursor:move}.o-catalog__list__item .is-private{position:absolute;top:.3125rem;left:.3125rem}.o-catalog__list__item img{margin-top:.625rem}.o-catalog__list__item img.is-full-width{width:100%;height:30%;object-fit:cover}.o-catalog__list__item .a-btn--icon-only{margin-bottom:.6875rem;padding:.8125rem}.o-catalog__list__item__libelle{width:100%;margin-bottom:0;padding:.9375rem .625rem;word-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.o-catalog__list__item__action{width:100%;margin-top:auto;padding:.375rem .625rem;text-align:center}.o-catalog__list__item__action .a-btn--ghost{height:auto;padding:0 .3125rem}.o-catalog__create{align-self:center;width:-moz-fit-content;width:fit-content;margin-bottom:1rem}\n", ".o-restitution{height:100%;margin:0 auto;border-collapse:collapse;font-size:.875rem;min-width:20.625rem;overflow:hidden}.o-restitution .widget-instanciator{position:relative;height:100%}.o-restitution .m-btn-group.actions{padding-top:1.5625rem;padding-bottom:1.25rem}.o-restitution .a-checkbox{margin-bottom:0rem}.o-restitution h4{margin-top:2rem}.o-restitution label{border-radius:10%}\n", ".o-presentation{margin:0;padding:0}.o-presentation li{list-style:none}.o-manifest-layout__content{height:100%}.o-manifest-layout__content .pointer{cursor:pointer}.pry-viewingpresentation{display:flex;overflow-y:scroll}.pry-viewingpresentation .o-manifest-layout__content,.pry-viewingpresentation .o-dashboard-widget{flex:100% 1 1}.o-presentation{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:1.875rem;padding:.25rem .25rem 1.25rem;overflow-y:auto}.o-presentation__item{display:flex;flex-direction:column;align-items:stretch}.o-presentation__item__header{position:relative;display:flex;align-items:center;justify-content:center;height:6.875rem}.o-presentation__item__header img{width:auto;height:90%;cursor:pointer}.o-presentation__item__header img.is-full-width{width:100%;height:100%;object-fit:cover}.o-presentation__item__header pry-icon.is-private{position:absolute;top:.625rem;left:.625rem}.o-presentation__item__txt{flex-grow:1;padding:.625rem .9375rem}.o-presentation__item__txt .a-h3{font-size:.875rem}.o-presentation__item__txt .a-p{font-size:.8125rem}.o-presentation__item__txt .a-p.-date{margin-bottom:0}.o-presentation__item__footer{padding:.625rem .9375rem}.o-presentation__item__footer .m-actions-list{justify-content:space-evenly}.o-presentation-consult{width:100%;padding:.9375rem}.o-restitution-catalog .o-manifest-layout__toolbox{height:5.25rem;display:flex;flex-direction:row;justify-content:space-between;align-items:center}.o-restitution-catalog .o-catalog__search{position:relative}.o-restitution-catalog .o-catalog__search .a-icon{position:absolute;right:.6875rem;bottom:.5625rem;opacity:.5;pointer-events:none}.o-restitution-catalog .o-manifest-layout__content .o-restitution-wrapper .o-restitution{width:100%}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryCatalogCssComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pry-restitution-css', template: '', encapsulation: ViewEncapsulation.None, styles: [".o-catalog__filters__by-type__list,.o-catalog__list{margin:0;padding:0}.o-catalog__filters__by-type__list li,.o-catalog__list li{list-style:none}.o-catalog{display:flex;flex-direction:column;overflow:scroll;width:28.125rem;height:100%;padding:.9375rem;border-right-width:.0625rem;border-right-style:solid}.o-catalog .a-h2{padding-top:.625rem}.o-catalog pry-restitution{flex:1}.o-catalog__filters{padding-top:.3125rem}.o-catalog__filters__by-name{position:relative;margin-bottom:1.25rem}.o-catalog__filters__by-name .a-icon{position:absolute;left:.6875rem;bottom:.5625rem;pointer-events:none}.o-catalog__filters__by-name .a-form-field{width:60%;padding-left:2.1875rem}.o-catalog__filters__by-type{display:flex;flex-wrap:wrap;column-gap:1.25rem}.o-catalog__filters__by-type__list{display:flex;gap:.3125rem}.o-catalog__filters__by-type__list li{width:2.1875rem;height:2.1875rem}.o-catalog__filters__by-type__list li .a-label{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;margin:0;border-width:.0625rem;border-style:solid;border-radius:.3125rem}.o-catalog__filters__by-type .a-btn.a-btn--icon-text.-link-like{margin-top:5px;font-weight:300;font-size:.8125rem}.o-catalog__filters__by-type .a-btn.a-btn--icon-text.-link-like[disabled]{opacity:0}.o-catalog .is-point{cursor:default}.o-catalog__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:.9375rem;justify-content:space-around;padding:1.875rem 0}.o-catalog__list__icon{cursor:pointer}.o-catalog__list__item{position:relative;display:flex;flex-direction:column;justify-content:space-between;align-items:center;max-width:8.125rem;max-height:13.125rem;text-align:center;cursor:move}.o-catalog__list__item .is-private{position:absolute;top:.3125rem;left:.3125rem}.o-catalog__list__item img{margin-top:.625rem}.o-catalog__list__item img.is-full-width{width:100%;height:30%;object-fit:cover}.o-catalog__list__item .a-btn--icon-only{margin-bottom:.6875rem;padding:.8125rem}.o-catalog__list__item__libelle{width:100%;margin-bottom:0;padding:.9375rem .625rem;word-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.o-catalog__list__item__action{width:100%;margin-top:auto;padding:.375rem .625rem;text-align:center}.o-catalog__list__item__action .a-btn--ghost{height:auto;padding:0 .3125rem}.o-catalog__create{align-self:center;width:-moz-fit-content;width:fit-content;margin-bottom:1rem}\n", ".o-restitution{height:100%;margin:0 auto;border-collapse:collapse;font-size:.875rem;min-width:20.625rem;overflow:hidden}.o-restitution .widget-instanciator{position:relative;height:100%}.o-restitution .m-btn-group.actions{padding-top:1.5625rem;padding-bottom:1.25rem}.o-restitution .a-checkbox{margin-bottom:0rem}.o-restitution h4{margin-top:2rem}.o-restitution label{border-radius:10%}\n", ".o-presentation{margin:0;padding:0}.o-presentation li{list-style:none}.o-manifest-layout__content{height:100%}.o-manifest-layout__content .pointer{cursor:pointer}.pry-viewingpresentation{display:flex;overflow-y:scroll}.pry-viewingpresentation .o-manifest-layout__content,.pry-viewingpresentation .o-dashboard-widget{flex:100% 1 1}.o-presentation{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-gap:1.875rem;padding:.25rem .25rem 1.25rem;overflow-y:auto}.o-presentation__item{display:flex;flex-direction:column;align-items:stretch}.o-presentation__item__header{position:relative;display:flex;align-items:center;justify-content:center;height:6.875rem}.o-presentation__item__header img{width:auto;height:90%;cursor:pointer}.o-presentation__item__header img.is-full-width{width:100%;height:100%;object-fit:cover}.o-presentation__item__header pry-icon.is-private{position:absolute;top:.625rem;left:.625rem}.o-presentation__item__txt{flex-grow:1;padding:.625rem .9375rem}.o-presentation__item__txt .a-h3{font-size:.875rem}.o-presentation__item__txt .a-p{font-size:.8125rem}.o-presentation__item__txt .a-p.-date{margin-bottom:0}.o-presentation__item__footer{padding:.625rem .9375rem}.o-presentation__item__footer .m-actions-list{justify-content:space-evenly}.o-presentation-consult{width:100%;padding:.9375rem}.o-restitution-catalog .o-manifest-layout__toolbox{height:5.25rem;display:flex;flex-direction:row;justify-content:space-between;align-items:center}.o-restitution-catalog .o-catalog__search{position:relative}.o-restitution-catalog .o-catalog__search .a-icon{position:absolute;right:.6875rem;bottom:.5625rem;opacity:.5;pointer-events:none}.o-restitution-catalog .o-manifest-layout__content .o-restitution-wrapper .o-restitution{width:100%}\n"] }]
+        }] });
+
+class PryRestitutionComponent extends SubscriptionnerDirective {
+    constructor(toolboxManifestService, store, toolboxMenuService) {
+        super();
+        this.toolboxManifestService = toolboxManifestService;
+        this.store = store;
+        this.toolboxMenuService = toolboxMenuService;
+        this.search$ = new BehaviorSubject('');
+        this.customManifest = {
+            type: 'detail',
+            layout: { x: 1, y: 1, width: 1, height: 1 },
+            options: { itemIds: [] }
+        };
+        this.form = {
+            selectedWidget: '',
+            selectedDataSource: [],
+            title: '',
+            image: DEFAULT_RESTITUTION_ICON_URL,
+            description: '',
+            cover: false
+        };
+        this.visibility = {
+            type: PryVisibilityType.PRIVATE,
+            users: []
+        };
+        this.openSettings$ = new Subject();
+        this.users$ = null;
+        this.consultMode = false;
+        this.selectedRestitution = null;
+        this.edit = true;
+        this.restitutionCreated = new EventEmitter();
+        this.type = LibraryTypes.ILLUSTRATION;
+        this.isDataSourceSelected = false;
+        this.idToNameDatasource = {};
+        this.image = DEFAULT_RESTITUTION_ICON_URL;
+        this.store.dispatch(DataSourceActions.load());
+        this.store.dispatch(ClassActions.load());
+        this.store.dispatch(ConfigActions.loadCustomization());
+        this.store.dispatch(FieldActions.load());
+        this.types$ = this.toolboxMenuService.types$.pipe(map((type) => type.filter((filteredType) => filteredType.type !== 'detail')));
+        this.classes$ = this.store.select(ClassSelectors.classes);
+        this.widgetsList$ = this.toolboxMenuService.menuStructure$.pipe(map((menu) => menu
+            .map((items) => [...items.sub.filter((s) => this.toolboxManifestService.isModel(s.type))])
+            .reduce((acc, items) => [...acc, ...items], [])));
+        this.filteredDataSource$ = combineLatest([
+            this.search$,
+            this.store.select(DataSourceSelectors.getDataSourcesSorted)
+        ]).pipe(map(([searchValue, dataSource]) => dataSource.filter((dataSource) => searchValue === '' || dataSource.name.toLowerCase().includes(searchValue.toLowerCase()))));
+        this.subscriptions.add(this.filteredDataSource$.subscribe((dataSource) => {
+            dataSource.forEach((ds) => (this.idToNameDatasource[ds.id] = ds.name));
+        }));
+    }
+    ngOnInit() {
+        if (this.selectedRestitution) {
+            if (!this.edit) {
+                this.consultMode = true;
+            }
+            this.customManifest = JSON.parse(this.selectedRestitution.content);
+            if (Array.isArray(this.customManifest.datasource)) {
+                this.customManifest.datasource.forEach((dataSource) => {
+                    this.store.dispatch(SearchActions.getDatasourceItems({ id: dataSource }));
+                });
+            }
+            else {
+                this.store.dispatch(SearchActions.getDatasourceItems({ id: this.customManifest.datasource }));
+            }
+            if (this.selectedRestitution.visibility) {
+                this.visibility = this.selectedRestitution.visibility;
+            }
+            this.form.selectedDataSource.forEach((dataSource) => {
+                this.store.dispatch(SearchActions.getDatasourceItems({ id: dataSource }));
+            });
+            this.customManifest = JSON.parse(this.selectedRestitution.content);
+            this.customManifest.header = {
+                datasourceSelection: false,
+                parameters: true,
+                window: false,
+                maximize: false,
+                addToCatalog: false,
+                delete: false,
+                changeSpot: false
+            };
+            this.form = {
+                selectedWidget: this.customManifest.type,
+                selectedDataSource: this.customManifest.datasource,
+                title: this.selectedRestitution.name,
+                cover: this.selectedRestitution.cover,
+                ...this.selectedRestitution
+            };
+        }
+        this.image = this.selectedRestitution?.image ?? DEFAULT_RESTITUTION_ICON_URL;
+    }
+    cancel(stepper) {
+        this.form.selectedWidget = '';
+        this.form.selectedDataSource = [];
+        this.form.title = '';
+        this.form.description = '';
+        this.form.image = '';
+        this.form.cover = false;
+        if (this.consultMode || this.selectedRestitution) {
+            this.restitutionCreated.emit();
+            return;
+        }
+        this.prev(stepper);
+    }
+    toggleDatasource(id) {
+        if (!this.form.selectedDataSource.includes(id)) {
+            this.form.selectedDataSource.push(id);
+        }
+        else {
+            this.form.selectedDataSource = this.form.selectedDataSource.filter((dataSourceId) => dataSourceId !== id);
+        }
+    }
+    submit(stepper) {
+        if (this.consultMode) {
+            this.goNext(stepper);
+            return;
+        }
+        this.customManifest = {
+            ...this.customManifest,
+            type: this.form.selectedWidget,
+            title: this.form.title,
+            datasource: this.form.selectedDataSource,
+            cover: this.form.cover ?? false,
+            header: {
+                datasourceSelection: false,
+                parameters: true,
+                window: false,
+                maximize: false,
+                addToCatalog: false,
+                delete: false,
+                changeSpot: false
+            },
+            options: {
+                ...this.customManifest.options,
+                title: this.form.title
+            }
+        };
+        this.form.selectedDataSource.forEach((nameQuery) => {
+            this.store.dispatch(SearchActions.getDatasourceItems({ id: nameQuery }));
+        });
+        this.goNext(stepper);
+        setTimeout(() => {
+            this.openSettings$.next();
+        }, 150);
+    }
+    isSubmitDisabled() {
+        return (this.form.selectedWidget === '' ||
+            this.form.title.trim().length === 0 ||
+            this.form.title.length > 30 ||
+            this.form.description.length > 255);
+    }
+    noDataSourceSelected() {
+        return this.form.selectedDataSource.length === 0;
+    }
+    goNext(stepper) {
+        stepper.next();
+    }
+    prev(stepper) {
+        stepper.prev();
+    }
+    updateManifest($event) {
+        this.customManifest = $event.manifest;
+    }
+    lastStepCompleted() {
+        this.form.image = this.image;
+        if (this.edit) {
+            this.store.dispatch(ConfigActions.saveWidget({
+                widget: {
+                    id: this.selectedRestitution?.id ?? v4(),
+                    content: JSON.stringify(this.customManifest),
+                    name: this.form.title,
+                    description: this.form.description,
+                    image: this.form.image ?? '',
+                    visibility: this.visibility,
+                    datasource: this.form.selectedDataSource,
+                    cover: this.form.cover ?? false,
+                    modificationDate: ''
+                }
+            }));
+        }
+        this.store.dispatch(ConfigActions.loadWidgets());
+        this.restitutionCreated.emit();
+    }
+    isGeo(ds) {
+        return ds.metadata?.find((m) => m.metadataDef.name === GeoMetadata.NAMESPACE) !== undefined;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionComponent, deps: [{ token: i1.ToolboxManifestService }, { token: i2.Store }, { token: i1.ToolboxMenuService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryRestitutionComponent, selector: "pry-restitution", inputs: { selectedRestitution: "selectedRestitution", edit: "edit", isDataSourceSelected: "isDataSourceSelected", bindId: "bindId" }, outputs: { restitutionCreated: "restitutionCreated" }, usesInheritance: true, ngImport: i0, template: "<pry-restitution-css></pry-restitution-css>\n<div class=\"o-restitution\">\n  <h3 class=\"a-h2 o-restitution__title\">\n    {{ (consultMode ? '@pry.restitution.consult_title' : '@pry.restitution.create_title') | i18n }}\n  </h3>\n  <pry-stepper #stepper [isConsultMode]=\"consultMode || edit\" (lastStepCompleted)=\"lastStepCompleted()\">\n    <pry-step>\n      <h4 class=\"m-stepper-item__title\" *stepTitle>{{ '@pry.restitution.configure' | i18n }}</h4>\n      <div>\n        <div class=\"m-form-label-field\">\n          <label for=\"restitution\" class=\"a-label\">{{ '@pry.restitution.restitution_type' | i18n }}</label>\n          <pry-select\n            id=\"restitution\"\n            class=\"a-pry-select\"\n            [itemsAsOption]=\"true\"\n            [items]=\"types$ | async\"\n            [labelTranslate]=\"true\"\n            [(ngModel)]=\"form.selectedWidget\"\n            [disabled]=\"consultMode\"\n            bindIcon=\"icon\"\n            bindLabel=\"label\"\n            bindValue=\"type\"\n          >\n          </pry-select>\n        </div>\n        <div *ngIf=\"form.selectedWidget !== ''\">\n          <div class=\"m-form-label-field\">\n            <label for=\"graphTitle\" class=\"a-label\">{{ '@pry.restitution.graph_title' | i18n }}</label>\n            <input\n              name=\"title\"\n              id=\"graphTitle\"\n              class=\"a-form-field\"\n              [(ngModel)]=\"form.title\"\n              type=\"text\"\n              [disabled]=\"consultMode\"\n              maxlength=\"30\"\n              ngDefaultControl\n            />\n          </div>\n          <div class=\"m-form-label-field\">\n            <label for=\"description\" class=\"a-label\">{{ '@pry.restitution.description' | i18n }}</label>\n            <textarea\n              name=\"description\"\n              id=\"description\"\n              class=\"a-form-field\"\n              [(ngModel)]=\"form.description\"\n              style=\"resize: none\"\n              [disabled]=\"consultMode\"\n              maxlength=\"255\"\n              ngDefaultControl\n            >\n            </textarea>\n          </div>\n          <div class=\"m-form-label-field -width-full\">\n            <label class=\"a-label\">{{ '@pry.presentation.form.image' | i18n }}</label>\n            <div class=\"o-file-input\">\n              <pry-select-image (changed)=\"image = $event\" [iconUrl]=\"image\" [mode]=\"type\"></pry-select-image>\n              <pry-checkbox [(ngModel)]=\"form.cover\" name=\"cover\"> {{ '@pry.restitution.cover' | i18n }}</pry-checkbox>\n            </div>\n          </div>\n          <div class=\"m-btn-group -space-evenly actions\">\n            <button (click)=\"cancel(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n              {{ '@pry.restitution.close' | i18n }}\n            </button>\n            <button (click)=\"goNext(stepper)\" [disabled]=\"isSubmitDisabled()\" class=\"a-btn a-btn--primary\">\n              {{ '@pry.restitution.validate' | i18n }}\n            </button>\n          </div>\n        </div>\n      </div>\n    </pry-step>\n    <pry-step>\n      <h4 class=\"m-stepper-item__title\" *stepTitle>{{ '@pry.restitution.dataSource' | i18n }}</h4>\n      <div class=\"overflow\">\n        <div class=\"o-catalog__search\">\n          <input\n            id=\"catalog-search\"\n            type=\"text\"\n            class=\"a-form-field\"\n            name=\"search\"\n            [placeholder]=\"'Recherchez une donn\u00E9e'\"\n            [ngModel]=\"search$ | async\"\n            (ngModelChange)=\"this.search$.next($event)\"\n            ngDefaultControl\n          />\n          <pry-icon iconSvg=\"search\" [width]=\"17\" [height]=\"17\"></pry-icon>\n        </div>\n\n        <div class=\"o-datasources\">\n          <div *ngIf=\"form.selectedDataSource.length > 0\">\n            <h4 class=\"a-h4\">{{ '@pry.restitution.selection' | i18n }}</h4>\n            <ul class=\"o-datasources__list o-datasources__list--selected\">\n              <li class=\"o-datasources__item\" *ngFor=\"let id of form.selectedDataSource\">\n                <button (click)=\"toggleDatasource(id)\" type=\"button\" class=\"a-btn a-btn--icon-text\">\n                  <span class=\"u-visually-hidden\">{{ '@pry.restitution.unselectDataSource' | i18n }}</span>\n                  {{ idToNameDatasource[id] }}\n                  <pry-icon [iconSvg]=\"'close'\" [width]=\"18\" [height]=\"18\"></pry-icon>\n                </button>\n              </li>\n            </ul>\n          </div>\n\n          <ng-container *ngIf=\"filteredDataSource$ | async as datasource\">\n            <h4 class=\"a-h4\">{{ '@pry.restitution.select' | i18n }}</h4>\n            <ul *ngIf=\"datasource.length > 0; else noDatasource\" class=\"o-datasources__list\">\n              <li class=\"o-datasources__item\" *ngFor=\"let ds of datasource\" (click)=\"toggleDatasource(ds.id)\">\n                <div class=\"o-datasources__card\">\n                  <div class=\"o-datasources__card__name\">\n                    <pry-checkbox\n                      [ngModel]=\"form.selectedDataSource.includes(ds.id)\"\n                      (click)=\"$event.preventDefault()\"\n                    ></pry-checkbox>\n                    <span class=\"u-visually-hidden\">{{ '@pry.restitution.selectDataSource' | i18n }}</span>\n                    <p class=\"a-p\">\n                      {{ ds.id | translateId: { type: 'datasource', output: 'name' } | async }}\n                      <pry-icon *ngIf=\"isGeo(ds)\" iconSvg=\"globe\"></pry-icon>\n                    </p>\n                  </div>\n                </div>\n              </li>\n            </ul>\n          </ng-container>\n        </div>\n\n        <div class=\"m-btn-group -space-evenly actions\">\n          <button (click)=\"prev(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n            {{ '@pry.restitution.close' | i18n }}\n          </button>\n          <button (click)=\"submit(stepper)\" [disabled]=\"noDataSourceSelected()\" class=\"a-btn a-btn--primary\">\n            {{ '@pry.restitution.validate' | i18n }}\n          </button>\n        </div>\n      </div>\n    </pry-step>\n    <pry-step>\n      <h4 class=\"m-stepper-item__title\" *stepTitle>{{ '@pry.restitution.visualize' | i18n }}</h4>\n      <div class=\"widget-instanciator\">\n        <pry-widget-instanciator\n          [standalone]=\"true\"\n          [staticManifest]=\"customManifest\"\n          [open$]=\"openSettings$\"\n          (manifestModified)=\"updateManifest($event)\"\n        ></pry-widget-instanciator>\n      </div>\n      <div class=\"m-btn-group -space-evenly actions\" *ngIf=\"!consultMode; else consult\">\n        <button (click)=\"prev(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n          {{ '@pry.restitution.close' | i18n }}\n        </button>\n        <button (click)=\"goNext(stepper)\" type=\"button\" class=\"a-btn a-btn--primary\">\n          {{ '@pry.restitution.validate' | i18n }}\n        </button>\n      </div>\n    </pry-step>\n    <pry-step>\n      <h4 class=\"m-stepper-item__title\" *stepTitle>{{ '@pry.restitution.broadcast' | i18n }}</h4>\n      <div class=\"\">\n        <h3>{{ '@pry.restitution.access' | i18n }}</h3>\n        {{ '@pry.restitution.choice' | i18n }}\n        <ul>\n          <li>\n            {{ '@pry.restitution.public' | i18n }}\n          </li>\n        </ul>\n        {{ '@pry.restitution.or' | i18n }}\n        <ul>\n          <li>\n            {{ '@pry.restitution.private' | i18n }}\n          </li>\n        </ul>\n      </div>\n      <pry-share\n        [(ngModel)]=\"visibility\"\n        [users$]=\"users$\"\n        labelProperty=\"name\"\n        valueProperty=\"id\"\n        [disabled]=\"consultMode\"\n      ></pry-share>\n      <div class=\"m-btn-group -space-evenly actions\" *ngIf=\"!consultMode; else consult\">\n        <button (click)=\"prev(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n          {{ '@pry.restitution.close' | i18n }}\n        </button>\n        <button\n          (click)=\"goNext(stepper)\"\n          [disabled]=\"noDataSourceSelected() || isSubmitDisabled()\"\n          type=\"button\"\n          class=\"a-btn a-btn--primary\"\n        >\n          {{ '@pry.restitution.broadcast' | i18n }}\n        </button>\n      </div>\n    </pry-step>\n  </pry-stepper>\n</div>\n\n<ng-template #consult>\n  <div class=\"m-btn-group -space-evenly actions\">\n    <button (click)=\"prev(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n      {{ '@pry.restitution.close' | i18n }}\n    </button>\n    <button (click)=\"goNext(stepper)\" type=\"button\" class=\"a-btn a-btn--primary\">\n      {{ '@pry.restitution.next' | i18n }}\n    </button>\n  </div>\n</ng-template>\n<ng-template #noDatasource>\n  <p class=\"search-home__container-search\">{{ '@pry.restitution.noDataSource' | i18n }}</p>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.PrySelectImageComponent, selector: "pry-select-image", inputs: ["iconUrl", "size", "mode"], outputs: ["toggled", "changed"] }, { kind: "component", type: i1.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.PryStepperComponent, selector: "pry-stepper", inputs: ["isConsultMode"], outputs: ["lastStepCompleted"] }, { kind: "component", type: i5.PryStepComponent, selector: "pry-step", inputs: ["setActiveState"] }, { kind: "directive", type: i5.PryStepTitleDirective, selector: "[stepTitle]" }, { kind: "component", type: i1.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "component", type: i1.WidgetInstanciatorComponent, selector: "pry-widget-instanciator", inputs: ["widgetIndex", "staticManifest", "standalone", "open$"], outputs: ["manifestModified", "widgetInstance"] }, { kind: "component", type: i1.PryShareComponent, selector: "pry-share", inputs: ["value", "labelProperty", "valueProperty", "users$"] }, { kind: "component", type: i6.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "component", type: PryCatalogCssComponent, selector: "pry-restitution-css" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslateIdPipe, name: "translateId" }, { kind: "pipe", type: i1.I18nPipe, name: "i18n" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pry-restitution', template: "<pry-restitution-css></pry-restitution-css>\n<div class=\"o-restitution\">\n  <h3 class=\"a-h2 o-restitution__title\">\n    {{ (consultMode ? '@pry.restitution.consult_title' : '@pry.restitution.create_title') | i18n }}\n  </h3>\n  <pry-stepper #stepper [isConsultMode]=\"consultMode || edit\" (lastStepCompleted)=\"lastStepCompleted()\">\n    <pry-step>\n      <h4 class=\"m-stepper-item__title\" *stepTitle>{{ '@pry.restitution.configure' | i18n }}</h4>\n      <div>\n        <div class=\"m-form-label-field\">\n          <label for=\"restitution\" class=\"a-label\">{{ '@pry.restitution.restitution_type' | i18n }}</label>\n          <pry-select\n            id=\"restitution\"\n            class=\"a-pry-select\"\n            [itemsAsOption]=\"true\"\n            [items]=\"types$ | async\"\n            [labelTranslate]=\"true\"\n            [(ngModel)]=\"form.selectedWidget\"\n            [disabled]=\"consultMode\"\n            bindIcon=\"icon\"\n            bindLabel=\"label\"\n            bindValue=\"type\"\n          >\n          </pry-select>\n        </div>\n        <div *ngIf=\"form.selectedWidget !== ''\">\n          <div class=\"m-form-label-field\">\n            <label for=\"graphTitle\" class=\"a-label\">{{ '@pry.restitution.graph_title' | i18n }}</label>\n            <input\n              name=\"title\"\n              id=\"graphTitle\"\n              class=\"a-form-field\"\n              [(ngModel)]=\"form.title\"\n              type=\"text\"\n              [disabled]=\"consultMode\"\n              maxlength=\"30\"\n              ngDefaultControl\n            />\n          </div>\n          <div class=\"m-form-label-field\">\n            <label for=\"description\" class=\"a-label\">{{ '@pry.restitution.description' | i18n }}</label>\n            <textarea\n              name=\"description\"\n              id=\"description\"\n              class=\"a-form-field\"\n              [(ngModel)]=\"form.description\"\n              style=\"resize: none\"\n              [disabled]=\"consultMode\"\n              maxlength=\"255\"\n              ngDefaultControl\n            >\n            </textarea>\n          </div>\n          <div class=\"m-form-label-field -width-full\">\n            <label class=\"a-label\">{{ '@pry.presentation.form.image' | i18n }}</label>\n            <div class=\"o-file-input\">\n              <pry-select-image (changed)=\"image = $event\" [iconUrl]=\"image\" [mode]=\"type\"></pry-select-image>\n              <pry-checkbox [(ngModel)]=\"form.cover\" name=\"cover\"> {{ '@pry.restitution.cover' | i18n }}</pry-checkbox>\n            </div>\n          </div>\n          <div class=\"m-btn-group -space-evenly actions\">\n            <button (click)=\"cancel(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n              {{ '@pry.restitution.close' | i18n }}\n            </button>\n            <button (click)=\"goNext(stepper)\" [disabled]=\"isSubmitDisabled()\" class=\"a-btn a-btn--primary\">\n              {{ '@pry.restitution.validate' | i18n }}\n            </button>\n          </div>\n        </div>\n      </div>\n    </pry-step>\n    <pry-step>\n      <h4 class=\"m-stepper-item__title\" *stepTitle>{{ '@pry.restitution.dataSource' | i18n }}</h4>\n      <div class=\"overflow\">\n        <div class=\"o-catalog__search\">\n          <input\n            id=\"catalog-search\"\n            type=\"text\"\n            class=\"a-form-field\"\n            name=\"search\"\n            [placeholder]=\"'Recherchez une donn\u00E9e'\"\n            [ngModel]=\"search$ | async\"\n            (ngModelChange)=\"this.search$.next($event)\"\n            ngDefaultControl\n          />\n          <pry-icon iconSvg=\"search\" [width]=\"17\" [height]=\"17\"></pry-icon>\n        </div>\n\n        <div class=\"o-datasources\">\n          <div *ngIf=\"form.selectedDataSource.length > 0\">\n            <h4 class=\"a-h4\">{{ '@pry.restitution.selection' | i18n }}</h4>\n            <ul class=\"o-datasources__list o-datasources__list--selected\">\n              <li class=\"o-datasources__item\" *ngFor=\"let id of form.selectedDataSource\">\n                <button (click)=\"toggleDatasource(id)\" type=\"button\" class=\"a-btn a-btn--icon-text\">\n                  <span class=\"u-visually-hidden\">{{ '@pry.restitution.unselectDataSource' | i18n }}</span>\n                  {{ idToNameDatasource[id] }}\n                  <pry-icon [iconSvg]=\"'close'\" [width]=\"18\" [height]=\"18\"></pry-icon>\n                </button>\n              </li>\n            </ul>\n          </div>\n\n          <ng-container *ngIf=\"filteredDataSource$ | async as datasource\">\n            <h4 class=\"a-h4\">{{ '@pry.restitution.select' | i18n }}</h4>\n            <ul *ngIf=\"datasource.length > 0; else noDatasource\" class=\"o-datasources__list\">\n              <li class=\"o-datasources__item\" *ngFor=\"let ds of datasource\" (click)=\"toggleDatasource(ds.id)\">\n                <div class=\"o-datasources__card\">\n                  <div class=\"o-datasources__card__name\">\n                    <pry-checkbox\n                      [ngModel]=\"form.selectedDataSource.includes(ds.id)\"\n                      (click)=\"$event.preventDefault()\"\n                    ></pry-checkbox>\n                    <span class=\"u-visually-hidden\">{{ '@pry.restitution.selectDataSource' | i18n }}</span>\n                    <p class=\"a-p\">\n                      {{ ds.id | translateId: { type: 'datasource', output: 'name' } | async }}\n                      <pry-icon *ngIf=\"isGeo(ds)\" iconSvg=\"globe\"></pry-icon>\n                    </p>\n                  </div>\n                </div>\n              </li>\n            </ul>\n          </ng-container>\n        </div>\n\n        <div class=\"m-btn-group -space-evenly actions\">\n          <button (click)=\"prev(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n            {{ '@pry.restitution.close' | i18n }}\n          </button>\n          <button (click)=\"submit(stepper)\" [disabled]=\"noDataSourceSelected()\" class=\"a-btn a-btn--primary\">\n            {{ '@pry.restitution.validate' | i18n }}\n          </button>\n        </div>\n      </div>\n    </pry-step>\n    <pry-step>\n      <h4 class=\"m-stepper-item__title\" *stepTitle>{{ '@pry.restitution.visualize' | i18n }}</h4>\n      <div class=\"widget-instanciator\">\n        <pry-widget-instanciator\n          [standalone]=\"true\"\n          [staticManifest]=\"customManifest\"\n          [open$]=\"openSettings$\"\n          (manifestModified)=\"updateManifest($event)\"\n        ></pry-widget-instanciator>\n      </div>\n      <div class=\"m-btn-group -space-evenly actions\" *ngIf=\"!consultMode; else consult\">\n        <button (click)=\"prev(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n          {{ '@pry.restitution.close' | i18n }}\n        </button>\n        <button (click)=\"goNext(stepper)\" type=\"button\" class=\"a-btn a-btn--primary\">\n          {{ '@pry.restitution.validate' | i18n }}\n        </button>\n      </div>\n    </pry-step>\n    <pry-step>\n      <h4 class=\"m-stepper-item__title\" *stepTitle>{{ '@pry.restitution.broadcast' | i18n }}</h4>\n      <div class=\"\">\n        <h3>{{ '@pry.restitution.access' | i18n }}</h3>\n        {{ '@pry.restitution.choice' | i18n }}\n        <ul>\n          <li>\n            {{ '@pry.restitution.public' | i18n }}\n          </li>\n        </ul>\n        {{ '@pry.restitution.or' | i18n }}\n        <ul>\n          <li>\n            {{ '@pry.restitution.private' | i18n }}\n          </li>\n        </ul>\n      </div>\n      <pry-share\n        [(ngModel)]=\"visibility\"\n        [users$]=\"users$\"\n        labelProperty=\"name\"\n        valueProperty=\"id\"\n        [disabled]=\"consultMode\"\n      ></pry-share>\n      <div class=\"m-btn-group -space-evenly actions\" *ngIf=\"!consultMode; else consult\">\n        <button (click)=\"prev(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n          {{ '@pry.restitution.close' | i18n }}\n        </button>\n        <button\n          (click)=\"goNext(stepper)\"\n          [disabled]=\"noDataSourceSelected() || isSubmitDisabled()\"\n          type=\"button\"\n          class=\"a-btn a-btn--primary\"\n        >\n          {{ '@pry.restitution.broadcast' | i18n }}\n        </button>\n      </div>\n    </pry-step>\n  </pry-stepper>\n</div>\n\n<ng-template #consult>\n  <div class=\"m-btn-group -space-evenly actions\">\n    <button (click)=\"prev(stepper)\" type=\"button\" class=\"a-btn a-btn--secondary\">\n      {{ '@pry.restitution.close' | i18n }}\n    </button>\n    <button (click)=\"goNext(stepper)\" type=\"button\" class=\"a-btn a-btn--primary\">\n      {{ '@pry.restitution.next' | i18n }}\n    </button>\n  </div>\n</ng-template>\n<ng-template #noDatasource>\n  <p class=\"search-home__container-search\">{{ '@pry.restitution.noDataSource' | i18n }}</p>\n</ng-template>\n" }]
+        }], ctorParameters: function () { return [{ type: i1.ToolboxManifestService }, { type: i2.Store }, { type: i1.ToolboxMenuService }]; }, propDecorators: { selectedRestitution: [{
+                type: Input
+            }], edit: [{
+                type: Input
+            }], restitutionCreated: [{
+                type: Output
+            }], isDataSourceSelected: [{
+                type: Input
+            }], bindId: [{
+                type: Input
+            }] } });
+
+class PryRestitutionCatalogComponent {
+    constructor(store, overlay, viewContainerRef) {
+        this.store = store;
+        this.overlay = overlay;
+        this.viewContainerRef = viewContainerRef;
+        this.search$ = new BehaviorSubject('');
+        this.modalOpen = false;
+        this.isOverlayOpen = false;
+        this.mode = ViewMode;
+        this.selectedMode = ViewMode.CATALOG;
+        this.selectedRestitution = null;
+        this.PryVisibilityType = PryVisibilityType;
+        this.store.dispatch(ConfigActions.loadWidgets());
+        this.store.dispatch(ConfigActions.getMapStyles());
+        this.restitutions$ = this.store
+            .select(ConfigSelectors.catalog)
+            .pipe(map((restitutionList) => [...restitutionList].sort((a, b) => a.modificationDate ? b.modificationDate.localeCompare(a.modificationDate) : 1)));
+        this.filteredRestitution$ = combineLatest([this.restitutions$, this.search$]).pipe(map(([restitutions, search]) => restitutions.filter((restitution) => search.length === 0 || restitution.name.toLowerCase().includes(search.toLowerCase()))));
+    }
+    selectMode(newMode) {
+        this.selectedMode = newMode;
+    }
+    selectRestitution(restitution) {
+        this.selectedRestitution = restitution;
+        this.selectMode(this.mode.CONSULT);
+    }
+    closeRestitution($event) {
+        this.selectedRestitution = null;
+        this.selectMode(this.mode.CATALOG);
+    }
+    deleteRestitution(restitution) {
+        this.store.dispatch(ConfigActions.deleteRestitution({ id: restitution.id }));
+        this.confirmRemoveRef?.dispose();
+        this.confirmRemoveRef = undefined;
+        this.store.dispatch(ConfigActions.closeOverlay({ id: this.constructor.name + '-modal' }));
+    }
+    editRestitution(restitution) {
+        this.selectedRestitution = restitution;
+        this.selectMode(ViewMode.EDITION);
+    }
+    toggleRemoveConfirm($event, restitution) {
+        if (!this.confirmRemoveRef) {
+            this.restitution = restitution;
+            this.confirmRemoveRef = this.overlay.create(new OverlayConfig({
+                hasBackdrop: true,
+                panelClass: ['o-modal-wrapper'],
+                backdropClass: 'backdrop'
+            }));
+            this.store.dispatch(ConfigActions.addingOverlay({ id: this.constructor.name + '-modal' }));
+            this.confirmRemoveRef?.backdropClick().subscribe(() => this.toggleRemoveConfirm($event, restitution));
+            this.confirmRemoveRef?.attach(new TemplatePortal(this.templateModal, this.viewContainerRef));
+            setTimeout(() => {
+                this.cancelRemove.nativeElement.focus();
+            }, 10);
+        }
+        else {
+            this.confirmRemoveRef.dispose();
+            this.confirmRemoveRef = undefined;
+            this.store.dispatch(ConfigActions.closeOverlay({ id: this.constructor.name + '-modal' }));
+            this.openModal?.nativeElement.focus();
+        }
+    }
+    cancelRemoveConfirm() {
+        this.confirmRemoveRef?.dispose();
+        this.confirmRemoveRef = undefined;
+        this.store.dispatch(ConfigActions.closeOverlay({ id: this.constructor.name + '-modal' }));
+    }
+    focusCrossElement() {
+        if (this.cross) {
+            this.cross?.nativeElement.focus();
+        }
+    }
+    focusValidation() {
+        this.confirm.nativeElement.focus();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionCatalogComponent, deps: [{ token: i2.Store }, { token: i2$1.Overlay }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryRestitutionCatalogComponent, selector: "pry-restitution-catalog", inputs: { modalOpen: "modalOpen" }, viewQueries: [{ propertyName: "templateModal", first: true, predicate: ["templateModal"], descendants: true, read: TemplateRef }, { propertyName: "openModal", first: true, predicate: ["openModal"], descendants: true, read: ElementRef }, { propertyName: "cancelRemove", first: true, predicate: ["cancelRemove"], descendants: true }, { propertyName: "cross", first: true, predicate: ["cross"], descendants: true }, { propertyName: "confirm", first: true, predicate: ["confirm"], descendants: true }], ngImport: i0, template: "<pry-restitution-css></pry-restitution-css>\n<div class=\"o-manifest-layout o-restitution-catalog\">\n  <ng-template [ngIf]=\"selectedMode === mode.CATALOG\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button\n        type=\"button\"\n        (click)=\"selectMode(mode.CREATION)\"\n        [pryTooltip]=\"infoTooltipCreateRestitution\"\n        class=\"a-btn a-btn--primary\"\n        *pryAccess=\"{ module: 'dashboard', page: 'restitution', action: 'create' }\"\n      >\n        {{ '@pry.restitution.create_title' | i18n }}\n      </button>\n      <div>\n        <div class=\"o-catalog__search\">\n          <label id=\"catalog-search-label\" for=\"catalog-search\" class=\"u-visually-hidden\">\n            <span>{{ '@pry.toolbox.catalog.filter.name' | i18n }}</span>\n          </label>\n          <input\n            id=\"catalog-search\"\n            type=\"text\"\n            class=\"a-form-field\"\n            [placeholder]=\"'@pry.restitution.search' | i18n\"\n            [ngModel]=\"search$ | async\"\n            (ngModelChange)=\"this.search$.next($event)\"\n          />\n\n          <pry-icon iconSvg=\"search\" [width]=\"17\" [height]=\"17\"></pry-icon>\n        </div>\n      </div>\n    </div>\n    <div class=\"o-manifest-layout__content\">\n      <h1 class=\"a-h1\">{{ '@pry.restitution.catalog' | i18n }}</h1>\n\n      <div class=\"o-presentation-wrapper\">\n        <ul class=\"o-presentation\">\n          <li class=\"o-presentation__item\" *ngFor=\"let restitution of filteredRestitution$ | async\">\n            <div class=\"o-presentation__item__header\">\n              <ng-container *ngIf=\"restitution.visibility?.type === PryVisibilityType.PRIVATE\">\n                <pry-icon\n                  iconSvg=\"private\"\n                  [pryTooltip]=\"private\"\n                  class=\"is-private\"\n                  [height]=\"17\"\n                  [width]=\"17\"\n                ></pry-icon>\n              </ng-container>\n              <img\n                alt=\"\"\n                [height]=\"restitution.cover ? 600 : 128\"\n                [width]=\"restitution.cover ? 600 : 128\"\n                [class.is-full-width]=\"restitution.cover\"\n                [src]=\"restitution.image | getSecuredImage: [600, 600] | async\"\n                class=\"pointer\"\n                (click)=\"selectRestitution(restitution)\"\n                [pryTooltip]=\"infoTooltipEye\"\n              />\n            </div>\n\n            <div class=\"o-presentation__item__txt\">\n              <h3 class=\"a-h3\">{{ restitution.name }}</h3>\n              <p class=\"a-p -date\">{{ restitution.modificationDate | sinceDate }}</p>\n            </div>\n\n            <div class=\"o-presentation__item__footer\">\n              <ul class=\"m-actions-list\">\n                <li>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn icon-only\"\n                    (click)=\"selectRestitution(restitution)\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'restitution', action: 'consult' }\"\n                  >\n                    <pry-icon iconSvg=\"eye\" [pryTooltip]=\"infoTooltipEye\"></pry-icon>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn&#45;&#45;icon-only\"\n                    (click)=\"editRestitution(restitution)\"\n                    [disabled]=\"!restitution.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'restitution', action: 'edit' }\"\n                  >\n                    <pry-icon iconSvg=\"edit\" [pryTooltip]=\"infoTooltipUpdate\"></pry-icon>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn&#45;&#45;icon-only\"\n                    (click)=\"toggleRemoveConfirm($event, restitution)\"\n                    [disabled]=\"!restitution.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'restitution', action: 'delete' }\"\n                  >\n                    <pry-icon iconSvg=\"delete\" [pryTooltip]=\"infoTooltipDelete\"></pry-icon>\n                  </button>\n                </li>\n              </ul>\n            </div>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </ng-template>\n\n  <ng-template [ngIf]=\"selectedMode === mode.CONSULT\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button type=\"button\" (click)=\"selectMode(mode.CATALOG)\" class=\"a-btn a-btn--primary\">\n        {{ '@pry.restitution.backToCatalog' | i18n }}\n      </button>\n    </div>\n    <div class=\"o-manifest-layout__content\">\n      <pry-restitution\n        [selectedRestitution]=\"selectedRestitution\"\n        [edit]=\"false\"\n        (restitutionCreated)=\"closeRestitution($event)\"\n        class=\"restitution\"\n      ></pry-restitution>\n    </div>\n  </ng-template>\n  <ng-template [ngIf]=\"selectedMode === mode.CREATION\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button type=\"button\" (click)=\"selectMode(mode.CATALOG)\" class=\"a-btn a-btn--primary\">\n        {{ '@pry.restitution.backToCatalog' | i18n }}\n      </button>\n    </div>\n    <div class=\"o-manifest-layout__content\">\n      <pry-restitution (restitutionCreated)=\"closeRestitution($event)\" class=\"restitution\"></pry-restitution>\n    </div>\n  </ng-template>\n  <ng-template [ngIf]=\"selectedMode === mode.EDITION\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button type=\"button\" (click)=\"selectMode(mode.CATALOG)\" class=\"a-btn a-btn--primary\">\n        {{ '@pry.restitution.backToCatalog' | i18n }}\n      </button>\n    </div>\n    <div class=\"o-manifest-layout__content\">\n      <pry-restitution\n        (restitutionCreated)=\"closeRestitution($event)\"\n        [selectedRestitution]=\"selectedRestitution\"\n        class=\"restitution\"\n      ></pry-restitution>\n    </div>\n  </ng-template>\n</div>\n\n<ng-template #templateModal>\n  <div\n    class=\"o-modal\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"dialog confirm delete presentation\"\n    tabindex=\"0\"\n    #deleteModal\n    *ngIf=\"restitution\"\n    (keydown.escape)=\"toggleRemoveConfirm($event, restitution)\"\n  >\n    <div class=\"o-modal__top\">\n      <div class=\"o-modal__top__title\">\n        <h2 class=\"a-h2\">\n          {{ '@pry.widget.modalTitle' | i18n }}\n        </h2>\n      </div>\n      <div class=\"o-modal__top__close\">\n        <button\n          class=\"a-btn a-btn--icon-only\"\n          #cross\n          (keydown.shift.tab)=\"focusValidation()\"\n          (click)=\"cancelRemoveConfirm()\"\n        >\n          <pry-icon iconSvg=\"close\" [height]=\"35\" [width]=\"35\"></pry-icon>\n          <span class=\"u-visually-hidden\">{{ '@pry.toolbox.close' | i18n }}</span>\n        </button>\n      </div>\n    </div>\n    <div class=\"m-btn-group\">\n      <button type=\"button\" #cancelRemove (click)=\"cancelRemoveConfirm()\" class=\"a-btn a-btn--secondary\">\n        {{ '@pry.toolbox.manifest.close' | i18n }}\n      </button>\n      <button\n        type=\"submit\"\n        class=\"a-btn a-btn--primary\"\n        #confirm\n        (click)=\"deleteRestitution(restitution)\"\n        (keydown.tab)=\"focusCrossElement()\"\n      >\n        {{ '@pry.toolbox.manifest.validate' | i18n }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipEye>\n  <div class=\"card-title-tooltip__wrapper\">\n    <span class=\"card-title-tooltip__name\">{{ '@pry.restitution.consult' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipUpdate>\n  <div class=\"card-title-tooltip__wrapper\">\n    <span class=\"card-title-tooltip__name\">{{ '@pry.restitution.update' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipDelete>\n  <div class=\"card-title-tooltip__wrapper\">\n    <span class=\"card-title-tooltip__name\">{{ '@pry.restitution.delete' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipCreateRestitution>\n  <div class=\"card-title-tooltip__wrapper\">\n    <span class=\"card-title-tooltip__name\">{{ '@pry.restitution.create_title' | i18n }}</span>\n  </div>\n</ng-template>\n<ng-template #private>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.restitution.lock' | i18n }}</span>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.PryAccessDirective, selector: "[pryAccess]", inputs: ["pryAccess"] }, { kind: "component", type: i1.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "component", type: PryRestitutionComponent, selector: "pry-restitution", inputs: ["selectedRestitution", "edit", "isDataSourceSelected", "bindId"], outputs: ["restitutionCreated"] }, { kind: "component", type: PryCatalogCssComponent, selector: "pry-restitution-css" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.GetSecuredImagePipe, name: "getSecuredImage" }, { kind: "pipe", type: i1.I18nPipe, name: "i18n" }, { kind: "pipe", type: i8.PrySinceDatePipe, name: "sinceDate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionCatalogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pry-restitution-catalog', template: "<pry-restitution-css></pry-restitution-css>\n<div class=\"o-manifest-layout o-restitution-catalog\">\n  <ng-template [ngIf]=\"selectedMode === mode.CATALOG\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button\n        type=\"button\"\n        (click)=\"selectMode(mode.CREATION)\"\n        [pryTooltip]=\"infoTooltipCreateRestitution\"\n        class=\"a-btn a-btn--primary\"\n        *pryAccess=\"{ module: 'dashboard', page: 'restitution', action: 'create' }\"\n      >\n        {{ '@pry.restitution.create_title' | i18n }}\n      </button>\n      <div>\n        <div class=\"o-catalog__search\">\n          <label id=\"catalog-search-label\" for=\"catalog-search\" class=\"u-visually-hidden\">\n            <span>{{ '@pry.toolbox.catalog.filter.name' | i18n }}</span>\n          </label>\n          <input\n            id=\"catalog-search\"\n            type=\"text\"\n            class=\"a-form-field\"\n            [placeholder]=\"'@pry.restitution.search' | i18n\"\n            [ngModel]=\"search$ | async\"\n            (ngModelChange)=\"this.search$.next($event)\"\n          />\n\n          <pry-icon iconSvg=\"search\" [width]=\"17\" [height]=\"17\"></pry-icon>\n        </div>\n      </div>\n    </div>\n    <div class=\"o-manifest-layout__content\">\n      <h1 class=\"a-h1\">{{ '@pry.restitution.catalog' | i18n }}</h1>\n\n      <div class=\"o-presentation-wrapper\">\n        <ul class=\"o-presentation\">\n          <li class=\"o-presentation__item\" *ngFor=\"let restitution of filteredRestitution$ | async\">\n            <div class=\"o-presentation__item__header\">\n              <ng-container *ngIf=\"restitution.visibility?.type === PryVisibilityType.PRIVATE\">\n                <pry-icon\n                  iconSvg=\"private\"\n                  [pryTooltip]=\"private\"\n                  class=\"is-private\"\n                  [height]=\"17\"\n                  [width]=\"17\"\n                ></pry-icon>\n              </ng-container>\n              <img\n                alt=\"\"\n                [height]=\"restitution.cover ? 600 : 128\"\n                [width]=\"restitution.cover ? 600 : 128\"\n                [class.is-full-width]=\"restitution.cover\"\n                [src]=\"restitution.image | getSecuredImage: [600, 600] | async\"\n                class=\"pointer\"\n                (click)=\"selectRestitution(restitution)\"\n                [pryTooltip]=\"infoTooltipEye\"\n              />\n            </div>\n\n            <div class=\"o-presentation__item__txt\">\n              <h3 class=\"a-h3\">{{ restitution.name }}</h3>\n              <p class=\"a-p -date\">{{ restitution.modificationDate | sinceDate }}</p>\n            </div>\n\n            <div class=\"o-presentation__item__footer\">\n              <ul class=\"m-actions-list\">\n                <li>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn icon-only\"\n                    (click)=\"selectRestitution(restitution)\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'restitution', action: 'consult' }\"\n                  >\n                    <pry-icon iconSvg=\"eye\" [pryTooltip]=\"infoTooltipEye\"></pry-icon>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn&#45;&#45;icon-only\"\n                    (click)=\"editRestitution(restitution)\"\n                    [disabled]=\"!restitution.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'restitution', action: 'edit' }\"\n                  >\n                    <pry-icon iconSvg=\"edit\" [pryTooltip]=\"infoTooltipUpdate\"></pry-icon>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    type=\"button\"\n                    class=\"a-btn a-btn&#45;&#45;icon-only\"\n                    (click)=\"toggleRemoveConfirm($event, restitution)\"\n                    [disabled]=\"!restitution.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'restitution', action: 'delete' }\"\n                  >\n                    <pry-icon iconSvg=\"delete\" [pryTooltip]=\"infoTooltipDelete\"></pry-icon>\n                  </button>\n                </li>\n              </ul>\n            </div>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </ng-template>\n\n  <ng-template [ngIf]=\"selectedMode === mode.CONSULT\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button type=\"button\" (click)=\"selectMode(mode.CATALOG)\" class=\"a-btn a-btn--primary\">\n        {{ '@pry.restitution.backToCatalog' | i18n }}\n      </button>\n    </div>\n    <div class=\"o-manifest-layout__content\">\n      <pry-restitution\n        [selectedRestitution]=\"selectedRestitution\"\n        [edit]=\"false\"\n        (restitutionCreated)=\"closeRestitution($event)\"\n        class=\"restitution\"\n      ></pry-restitution>\n    </div>\n  </ng-template>\n  <ng-template [ngIf]=\"selectedMode === mode.CREATION\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button type=\"button\" (click)=\"selectMode(mode.CATALOG)\" class=\"a-btn a-btn--primary\">\n        {{ '@pry.restitution.backToCatalog' | i18n }}\n      </button>\n    </div>\n    <div class=\"o-manifest-layout__content\">\n      <pry-restitution (restitutionCreated)=\"closeRestitution($event)\" class=\"restitution\"></pry-restitution>\n    </div>\n  </ng-template>\n  <ng-template [ngIf]=\"selectedMode === mode.EDITION\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button type=\"button\" (click)=\"selectMode(mode.CATALOG)\" class=\"a-btn a-btn--primary\">\n        {{ '@pry.restitution.backToCatalog' | i18n }}\n      </button>\n    </div>\n    <div class=\"o-manifest-layout__content\">\n      <pry-restitution\n        (restitutionCreated)=\"closeRestitution($event)\"\n        [selectedRestitution]=\"selectedRestitution\"\n        class=\"restitution\"\n      ></pry-restitution>\n    </div>\n  </ng-template>\n</div>\n\n<ng-template #templateModal>\n  <div\n    class=\"o-modal\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"dialog confirm delete presentation\"\n    tabindex=\"0\"\n    #deleteModal\n    *ngIf=\"restitution\"\n    (keydown.escape)=\"toggleRemoveConfirm($event, restitution)\"\n  >\n    <div class=\"o-modal__top\">\n      <div class=\"o-modal__top__title\">\n        <h2 class=\"a-h2\">\n          {{ '@pry.widget.modalTitle' | i18n }}\n        </h2>\n      </div>\n      <div class=\"o-modal__top__close\">\n        <button\n          class=\"a-btn a-btn--icon-only\"\n          #cross\n          (keydown.shift.tab)=\"focusValidation()\"\n          (click)=\"cancelRemoveConfirm()\"\n        >\n          <pry-icon iconSvg=\"close\" [height]=\"35\" [width]=\"35\"></pry-icon>\n          <span class=\"u-visually-hidden\">{{ '@pry.toolbox.close' | i18n }}</span>\n        </button>\n      </div>\n    </div>\n    <div class=\"m-btn-group\">\n      <button type=\"button\" #cancelRemove (click)=\"cancelRemoveConfirm()\" class=\"a-btn a-btn--secondary\">\n        {{ '@pry.toolbox.manifest.close' | i18n }}\n      </button>\n      <button\n        type=\"submit\"\n        class=\"a-btn a-btn--primary\"\n        #confirm\n        (click)=\"deleteRestitution(restitution)\"\n        (keydown.tab)=\"focusCrossElement()\"\n      >\n        {{ '@pry.toolbox.manifest.validate' | i18n }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipEye>\n  <div class=\"card-title-tooltip__wrapper\">\n    <span class=\"card-title-tooltip__name\">{{ '@pry.restitution.consult' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipUpdate>\n  <div class=\"card-title-tooltip__wrapper\">\n    <span class=\"card-title-tooltip__name\">{{ '@pry.restitution.update' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipDelete>\n  <div class=\"card-title-tooltip__wrapper\">\n    <span class=\"card-title-tooltip__name\">{{ '@pry.restitution.delete' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #infoTooltipCreateRestitution>\n  <div class=\"card-title-tooltip__wrapper\">\n    <span class=\"card-title-tooltip__name\">{{ '@pry.restitution.create_title' | i18n }}</span>\n  </div>\n</ng-template>\n<ng-template #private>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.restitution.lock' | i18n }}</span>\n  </div>\n</ng-template>\n" }]
+        }], ctorParameters: function () { return [{ type: i2.Store }, { type: i2$1.Overlay }, { type: i0.ViewContainerRef }]; }, propDecorators: { templateModal: [{
+                type: ViewChild,
+                args: ['templateModal', { read: TemplateRef, static: false }]
+            }], openModal: [{
+                type: ViewChild,
+                args: ['openModal', { read: ElementRef }]
+            }], cancelRemove: [{
+                type: ViewChild,
+                args: ['cancelRemove']
+            }], cross: [{
+                type: ViewChild,
+                args: ['cross', { static: false }]
+            }], confirm: [{
+                type: ViewChild,
+                args: ['confirm']
+            }], modalOpen: [{
+                type: Input
+            }] } });
+
+class PryRestitutionListComponent extends SubscriptionnerDirective {
+    constructor(toolboxMenuService, translateService, toolboxManifestService, store) {
+        super();
+        this.toolboxMenuService = toolboxMenuService;
+        this.translateService = translateService;
+        this.toolboxManifestService = toolboxManifestService;
+        this.store = store;
+        this.search$ = new BehaviorSubject('');
+        this.type$ = new BehaviorSubject(undefined);
+        this.selectedRestitution = null;
+        this.mode = ViewMode;
+        this.selectedMode = ViewMode.CATALOG;
+        this.modeAuto = false;
+        this.PryVisibilityType = PryVisibilityType;
+        this.store.dispatch(ConfigActions.loadWidgets());
+        this.filteredWidgets$ = combineLatest([this.toolboxMenuService.menuList$, this.search$, this.type$]).pipe(map(([menus, search, type]) => menus.filter((menu) => (search.length === 0 ||
+            this.translateService.instant(menu.label).toLocaleLowerCase().includes(search.toLocaleLowerCase())) &&
+            (!type || this.toolboxManifestService.get(menu.type).type === type))));
+        this.types$ = this.toolboxMenuService.types$;
+        this.store.select(ConfigSelectors.catalog).subscribe((catalog) => (this.catalog = catalog));
+        this.automaticGridMode$ = this.store
+            .select(DashboardSelectors.gridLayout)
+            .pipe(map((layout) => layout !== DashboardGridLayout.MANUAL));
+        this.subscriptions.add(this.automaticGridMode$.subscribe((modeAuto) => (this.modeAuto = modeAuto)));
+    }
+    dragStart($event, type) {
+        if (!this.modeAuto) {
+            this.toolboxManifestService.dataTransfer($event, type);
+        }
+    }
+    selectMode(newMode) {
+        this.selectedMode = newMode;
+    }
+    selectRestitution(catalogEntry) {
+        if (catalogEntry.isCustom) {
+            this.catalog?.forEach((widget) => {
+                if (widget.id === catalogEntry.type) {
+                    this.selectedRestitution = widget;
+                    this.selectMode(this.mode.CONSULT);
+                }
+            });
+        }
+    }
+    closeRestitution($event) {
+        this.selectedRestitution = null;
+        this.selectMode(this.mode.CATALOG);
+    }
+    viewInDashboard(widget) {
+        this.store.dispatch(DashboardActions.addWidgetToPresentation({ widgetType: widget.type }));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionListComponent, deps: [{ token: i1.ToolboxMenuService }, { token: i1.PryI18nService }, { token: i1.ToolboxManifestService }, { token: i2.Store }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryRestitutionListComponent, selector: "pry-catalog", usesInheritance: true, ngImport: i0, template: "<pry-restitution-css></pry-restitution-css>\n<div class=\"o-catalog\">\n  <ng-template [ngIf]=\"selectedMode === mode.CATALOG\">\n    <h2 class=\"a-h2\">{{ '@pry.restitution.catalog' | i18n }}</h2>\n    <div class=\"o-catalog__filters\">\n      <div class=\"o-catalog__filters__by-name\">\n        <label id=\"catalog-search-label\" for=\"catalog-search\" class=\"a-label u-visually-hidden\">\n          <span>{{ '@pry.toolbox.catalog.filter.name' | i18n }}</span>\n        </label>\n        <pry-icon iconSvg=\"search\" [width]=\"17\" [height]=\"17\"></pry-icon>\n        <input\n          id=\"catalog-search\"\n          type=\"text\"\n          class=\"a-form-field\"\n          [placeholder]=\"'@pry.action.search' | i18n\"\n          [ngModel]=\"search$ | async\"\n          (ngModelChange)=\"this.search$.next($event)\"\n        />\n      </div>\n      <label class=\"a-label\">{{ '@pry.action.filterByType' | i18n }}</label>\n      <div class=\"o-catalog__filters__by-type\">\n        <ul class=\"o-catalog__filters__by-type__list\">\n          <li *ngFor=\"let typeOpt of types$ | async\">\n            <input\n              type=\"radio\"\n              class=\"a-form-field u-sr-only\"\n              name=\"catalog-filter\"\n              id=\"catalog-button-{{ typeOpt.type }}\"\n              [checked]=\"typeOpt.type === (type$ | async)\"\n              (change)=\"type$.next(typeOpt.type)\"\n            />\n            <label\n              class=\"a-label\"\n              id=\"catalog-button-label-{{ typeOpt.type }}\"\n              for=\"catalog-button-{{ typeOpt.type }}\"\n              [title]=\"typeOpt.label | i18n\"\n            >\n              <span class=\"u-sr-only\">{{ typeOpt.label | i18n }} </span>\n              <pry-icon [width]=\"18\" [height]=\"18\" [iconSvg]=\"typeOpt.icon\"></pry-icon>\n            </label>\n          </li>\n        </ul>\n        <button\n          type=\"button\"\n          class=\"a-btn a-btn--icon-text -link-like\"\n          (click)=\"type$.next(undefined)\"\n          [disabled]=\"!type$.getValue()\"\n          [class.u-visually-hidden]=\"!type$.getValue()\"\n        >\n          <pry-icon [width]=\"15\" [height]=\"15\" iconSvg=\"delete\"></pry-icon>\n          {{ '@pry.toolbox.catalog.filter.delete' | i18n }}\n        </button>\n      </div>\n    </div>\n    <ul class=\"o-catalog__list\" role=\"list\" aria-live=\"polite\">\n      <li\n        *ngFor=\"let widget of filteredWidgets$ | async\"\n        class=\"o-catalog__list__item\"\n        [class.is-point]=\"automaticGridMode$ | async\"\n        [draggable]=\"!(automaticGridMode$ | async)\"\n        role=\"listitem\"\n        aria-grabbed=\"false\"\n        aria-haspopup=\"true\"\n        tabindex=\"-1\"\n        [title]=\"widget.description ?? widget.label | i18n\"\n        (dragstart)=\"dragStart($event, widget.type)\"\n      >\n        <ng-container *ngIf=\"automaticGridMode$ | async\">\n          <button\n            type=\"button\"\n            class=\"a-btn a-btn--icon-only\"\n            (click)=\"viewInDashboard(widget)\"\n            [title]=\"'@pry.restitution.add_icon' | i18n\"\n          >\n            <pry-icon [width]=\"25\" [height]=\"25\" iconSvg=\"add_column\" class=\"o-catalog__list__icon\"></pry-icon>\n            <span class=\"u-visually-hidden\">{{ '@pry.restitution.add_icon' | i18n }}</span>\n          </button>\n        </ng-container>\n        <img\n          [alt]=\"widget.label\"\n          [src]=\"widget.icon | getSecuredImage: [600, 600] | async\"\n          [height]=\"widget.cover ? 600 : 53\"\n          [width]=\"widget.cover ? 600 : 53\"\n          [class.is-full-width]=\"widget.cover\"\n        />\n        <p class=\"o-catalog__list__item__libelle\" *ngIf=\"widget.isCustom; else translate\">{{ widget.label }}</p>\n        <ng-template #translate>\n          <p class=\"o-catalog__list__item__libelle\">{{ widget.label | i18n }}</p>\n        </ng-template>\n        <ng-container *ngIf=\"widget.visibility?.type === PryVisibilityType.PRIVATE\">\n          <pry-icon iconSvg=\"private\" [pryTooltip]=\"private\" class=\"is-private\" [height]=\"17\" [width]=\"17\"></pry-icon>\n        </ng-container>\n        <div class=\"o-catalog__list__item__action\" *ngIf=\"widget.isCustom\">\n          <button type=\"button\" class=\"a-btn a-btn--ghost\" (click)=\"selectRestitution(widget)\">\n            {{ '@pry.restitution.view' | i18n }}\n          </button>\n        </div>\n      </li>\n    </ul>\n  </ng-template>\n\n  <ng-template [ngIf]=\"selectedMode === mode.CONSULT\">\n    <div class=\"o-catalog__create\">\n      <button class=\"a-btn a-btn--secondary\" (click)=\"closeRestitution()\">\n        {{ '@pry.restitution.cancel' | i18n }}\n      </button>\n    </div>\n\n    <pry-restitution\n      [selectedRestitution]=\"selectedRestitution\"\n      [edit]=\"false\"\n      (restitutionCreated)=\"closeRestitution($event)\"\n    ></pry-restitution>\n  </ng-template>\n\n  <ng-template [ngIf]=\"selectedMode === mode.CREATION\">\n    <div class=\"o-catalog__create\">\n      <button class=\"a-btn a-btn--ghost\" (click)=\"selectMode(mode.CATALOG)\">\n        {{ '@pry.restitution.cancel' | i18n }}\n      </button>\n    </div>\n\n    <pry-restitution (restitutionCreated)=\"closeRestitution($event)\"></pry-restitution>\n  </ng-template>\n</div>\n\n<ng-template #private>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.restitution.lock' | i18n }}</span>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "component", type: PryRestitutionComponent, selector: "pry-restitution", inputs: ["selectedRestitution", "edit", "isDataSourceSelected", "bindId"], outputs: ["restitutionCreated"] }, { kind: "component", type: PryCatalogCssComponent, selector: "pry-restitution-css" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.GetSecuredImagePipe, name: "getSecuredImage" }, { kind: "pipe", type: i1.I18nPipe, name: "i18n" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pry-catalog', template: "<pry-restitution-css></pry-restitution-css>\n<div class=\"o-catalog\">\n  <ng-template [ngIf]=\"selectedMode === mode.CATALOG\">\n    <h2 class=\"a-h2\">{{ '@pry.restitution.catalog' | i18n }}</h2>\n    <div class=\"o-catalog__filters\">\n      <div class=\"o-catalog__filters__by-name\">\n        <label id=\"catalog-search-label\" for=\"catalog-search\" class=\"a-label u-visually-hidden\">\n          <span>{{ '@pry.toolbox.catalog.filter.name' | i18n }}</span>\n        </label>\n        <pry-icon iconSvg=\"search\" [width]=\"17\" [height]=\"17\"></pry-icon>\n        <input\n          id=\"catalog-search\"\n          type=\"text\"\n          class=\"a-form-field\"\n          [placeholder]=\"'@pry.action.search' | i18n\"\n          [ngModel]=\"search$ | async\"\n          (ngModelChange)=\"this.search$.next($event)\"\n        />\n      </div>\n      <label class=\"a-label\">{{ '@pry.action.filterByType' | i18n }}</label>\n      <div class=\"o-catalog__filters__by-type\">\n        <ul class=\"o-catalog__filters__by-type__list\">\n          <li *ngFor=\"let typeOpt of types$ | async\">\n            <input\n              type=\"radio\"\n              class=\"a-form-field u-sr-only\"\n              name=\"catalog-filter\"\n              id=\"catalog-button-{{ typeOpt.type }}\"\n              [checked]=\"typeOpt.type === (type$ | async)\"\n              (change)=\"type$.next(typeOpt.type)\"\n            />\n            <label\n              class=\"a-label\"\n              id=\"catalog-button-label-{{ typeOpt.type }}\"\n              for=\"catalog-button-{{ typeOpt.type }}\"\n              [title]=\"typeOpt.label | i18n\"\n            >\n              <span class=\"u-sr-only\">{{ typeOpt.label | i18n }} </span>\n              <pry-icon [width]=\"18\" [height]=\"18\" [iconSvg]=\"typeOpt.icon\"></pry-icon>\n            </label>\n          </li>\n        </ul>\n        <button\n          type=\"button\"\n          class=\"a-btn a-btn--icon-text -link-like\"\n          (click)=\"type$.next(undefined)\"\n          [disabled]=\"!type$.getValue()\"\n          [class.u-visually-hidden]=\"!type$.getValue()\"\n        >\n          <pry-icon [width]=\"15\" [height]=\"15\" iconSvg=\"delete\"></pry-icon>\n          {{ '@pry.toolbox.catalog.filter.delete' | i18n }}\n        </button>\n      </div>\n    </div>\n    <ul class=\"o-catalog__list\" role=\"list\" aria-live=\"polite\">\n      <li\n        *ngFor=\"let widget of filteredWidgets$ | async\"\n        class=\"o-catalog__list__item\"\n        [class.is-point]=\"automaticGridMode$ | async\"\n        [draggable]=\"!(automaticGridMode$ | async)\"\n        role=\"listitem\"\n        aria-grabbed=\"false\"\n        aria-haspopup=\"true\"\n        tabindex=\"-1\"\n        [title]=\"widget.description ?? widget.label | i18n\"\n        (dragstart)=\"dragStart($event, widget.type)\"\n      >\n        <ng-container *ngIf=\"automaticGridMode$ | async\">\n          <button\n            type=\"button\"\n            class=\"a-btn a-btn--icon-only\"\n            (click)=\"viewInDashboard(widget)\"\n            [title]=\"'@pry.restitution.add_icon' | i18n\"\n          >\n            <pry-icon [width]=\"25\" [height]=\"25\" iconSvg=\"add_column\" class=\"o-catalog__list__icon\"></pry-icon>\n            <span class=\"u-visually-hidden\">{{ '@pry.restitution.add_icon' | i18n }}</span>\n          </button>\n        </ng-container>\n        <img\n          [alt]=\"widget.label\"\n          [src]=\"widget.icon | getSecuredImage: [600, 600] | async\"\n          [height]=\"widget.cover ? 600 : 53\"\n          [width]=\"widget.cover ? 600 : 53\"\n          [class.is-full-width]=\"widget.cover\"\n        />\n        <p class=\"o-catalog__list__item__libelle\" *ngIf=\"widget.isCustom; else translate\">{{ widget.label }}</p>\n        <ng-template #translate>\n          <p class=\"o-catalog__list__item__libelle\">{{ widget.label | i18n }}</p>\n        </ng-template>\n        <ng-container *ngIf=\"widget.visibility?.type === PryVisibilityType.PRIVATE\">\n          <pry-icon iconSvg=\"private\" [pryTooltip]=\"private\" class=\"is-private\" [height]=\"17\" [width]=\"17\"></pry-icon>\n        </ng-container>\n        <div class=\"o-catalog__list__item__action\" *ngIf=\"widget.isCustom\">\n          <button type=\"button\" class=\"a-btn a-btn--ghost\" (click)=\"selectRestitution(widget)\">\n            {{ '@pry.restitution.view' | i18n }}\n          </button>\n        </div>\n      </li>\n    </ul>\n  </ng-template>\n\n  <ng-template [ngIf]=\"selectedMode === mode.CONSULT\">\n    <div class=\"o-catalog__create\">\n      <button class=\"a-btn a-btn--secondary\" (click)=\"closeRestitution()\">\n        {{ '@pry.restitution.cancel' | i18n }}\n      </button>\n    </div>\n\n    <pry-restitution\n      [selectedRestitution]=\"selectedRestitution\"\n      [edit]=\"false\"\n      (restitutionCreated)=\"closeRestitution($event)\"\n    ></pry-restitution>\n  </ng-template>\n\n  <ng-template [ngIf]=\"selectedMode === mode.CREATION\">\n    <div class=\"o-catalog__create\">\n      <button class=\"a-btn a-btn--ghost\" (click)=\"selectMode(mode.CATALOG)\">\n        {{ '@pry.restitution.cancel' | i18n }}\n      </button>\n    </div>\n\n    <pry-restitution (restitutionCreated)=\"closeRestitution($event)\"></pry-restitution>\n  </ng-template>\n</div>\n\n<ng-template #private>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.restitution.lock' | i18n }}</span>\n  </div>\n</ng-template>\n" }]
+        }], ctorParameters: function () { return [{ type: i1.ToolboxMenuService }, { type: i1.PryI18nService }, { type: i1.ToolboxManifestService }, { type: i2.Store }]; } });
+
+const enTranslations = {
+    '@pry': {
+        restitution: {
+            restitution_type: 'Restitution type',
+            data_type: 'Data type',
+            graph_title: 'Title',
+            description: 'Description',
+            image: 'Image',
+            close: 'Cancel',
+            validate: 'Save',
+            broadcast: 'Submit',
+            view: 'View',
+            create: 'Create restitution',
+            cancel: 'Cancel',
+            configure: 'Configure',
+            visualize: 'Visualize',
+            access: 'Do you want to give access / invite users?',
+            public: 'Make this participatory survey accessible to all users in the restitution catalog',
+            private: 'Invite certain users of your choice to respond to this participatory survey',
+            choice: 'You can :',
+            or: 'Or',
+            create_title: 'Create a restitution',
+            consult_title: 'Consult a restitution',
+            search: 'Search',
+            backToCatalog: 'Back to catalog',
+            consult: 'Consult',
+            catalog: 'Restitutions catalog',
+            add_icon: 'Add this restitution on the presentation',
+            selection: 'Selected data source(s):',
+            select: 'Select one or more data source(s) :',
+            selectDataSource: 'Select this data source',
+            unselectDataSource: 'Unselect this data source',
+            dataSource: 'Data',
+            noDataSource: 'No data available',
+            delete: 'Delete restitution',
+            next: 'Next',
+            lock: 'Private restitution',
+            update: 'Edit information',
+            cover: 'Image will cover the whole restitution card',
+            noDataSourceSelected: 'No data source selected'
+        }
+    }
+};
+
+const frTranslations = {
+    '@pry': {
+        restitution: {
+            restitution_type: 'Type de restitution',
+            data_type: 'Type de données',
+            graph_title: 'Titre de la restitution',
+            description: 'Description',
+            image: 'Image',
+            close: 'Annuler',
+            validate: 'Valider',
+            broadcast: 'Diffuser',
+            view: 'Consulter',
+            create: 'Créer une restitution',
+            cancel: 'Annuler',
+            configure: 'Configurer',
+            visualize: 'Visualiser',
+            access: 'Vous souhaitez donner accès / inviter des utilisateurs ?',
+            public: 'Rendre accessible cette restitution à tous les utilisateurs',
+            private: 'Rendre accessible à certains utilisateurs de votre choix cette restitution',
+            choice: 'Vous pouvez :',
+            or: 'Ou',
+            create_title: 'Créer une restitution',
+            consult_title: 'Consulter une restitution',
+            search: 'Rechercher',
+            backToCatalog: 'Retour au catalogue',
+            consult: 'Consulter',
+            catalog: 'Catalogue des restitutions',
+            add_icon: 'Ajouter cette restitution sur la présentation',
+            selection: 'Source(s) de données sélectionnées:',
+            select: 'Sélectionner une ou plusieurs source(s) de données :',
+            selectDataSource: 'Sélectionner la source de données',
+            unselectDataSource: 'Désélectionner la source de données',
+            dataSource: 'Donnée(s)',
+            noDataSource: 'Aucunes donnée disponible',
+            delete: 'Supprimer la restitution',
+            next: 'Suivant',
+            lock: 'Restitution privée',
+            update: 'Modifier les informations',
+            cover: "L'image doit couvrir la carte de la restitution",
+            noDataSourceSelected: 'Aucune source de données sélectionnée'
+        }
+    }
+};
+
+class PryRestitutionModule {
+    constructor(pryTranslateService) {
+        this.pryTranslateService = pryTranslateService;
+        this.pryTranslateService.addLangObject('fr', 'restitution', frTranslations);
+        this.pryTranslateService.addLangObject('en', 'restitution', enTranslations);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionModule, deps: [{ token: i1.PryI18nService }], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionModule, declarations: [PryRestitutionListComponent,
+            PryRestitutionComponent,
+            PryCatalogCssComponent,
+            PryRestitutionCatalogComponent], imports: [CommonModule,
+            PryCoreModule,
+            PryIconModule,
+            FormsModule,
+            PryStepperModule,
+            PrySelectModule,
+            PryDashboardModule,
+            PryShareModule,
+            PrySearchModule,
+            PryI18nModule,
+            PryCardModule,
+            PryCheckboxModule,
+            PryOverlayModule,
+            PrySinceDateModule], exports: [PryRestitutionListComponent, PryRestitutionComponent, PryRestitutionCatalogComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionModule, providers: [DatePipe], imports: [CommonModule,
+            PryCoreModule,
+            PryIconModule,
+            FormsModule,
+            PryStepperModule,
+            PrySelectModule,
+            PryDashboardModule,
+            PryShareModule,
+            PrySearchModule,
+            PryI18nModule,
+            PryCardModule,
+            PryCheckboxModule,
+            PryOverlayModule,
+            PrySinceDateModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryRestitutionModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    providers: [DatePipe],
+                    declarations: [
+                        PryRestitutionListComponent,
+                        PryRestitutionComponent,
+                        PryCatalogCssComponent,
+                        PryRestitutionCatalogComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        PryCoreModule,
+                        PryIconModule,
+                        FormsModule,
+                        PryStepperModule,
+                        PrySelectModule,
+                        PryDashboardModule,
+                        PryShareModule,
+                        PrySearchModule,
+                        PryI18nModule,
+                        PryCardModule,
+                        PryCheckboxModule,
+                        PryOverlayModule,
+                        PrySinceDateModule
+                    ],
+                    exports: [PryRestitutionListComponent, PryRestitutionComponent, PryRestitutionCatalogComponent]
+                }]
+        }], ctorParameters: function () { return [{ type: i1.PryI18nService }]; } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { PryRestitutionCatalogComponent, PryRestitutionComponent, PryRestitutionListComponent, PryRestitutionModule };
+//# sourceMappingURL=provoly-dashboard-restitution.mjs.map