@provoly/dashboard 0.14.9 → 0.14.10

package/fesm2022/provoly-dashboard-presentation.mjs

@@ -12,22 +12,26 @@ import * as i4$2 from '@provoly/dashboard/components/sinceDate';
 import { PrySinceDateModule } from '@provoly/dashboard/components/sinceDate';
 import * as i5 from '@provoly/dashboard/toolbox';
 import { PryToolboxModule } from '@provoly/dashboard/toolbox';
-import { combineLatest, take, debounceTime, map, BehaviorSubject } from 'rxjs';
+import { BehaviorSubject, combineLatest, take, debounceTime, map } from 'rxjs';
 import * as i8 from '@provoly/dashboard/components/metadata-editor';
 import { MetadataActions, PryExpandPanelModule } from '@provoly/dashboard/components/metadata-editor';
+import { v4 } from 'uuid';
 import * as i1 from '@ngrx/store';
 import * as i2 from '@angular/router';
 import * as i2$1 from '@angular/cdk/overlay';
 import { OverlayConfig } from '@angular/cdk/overlay';
 import { TemplatePortal } from '@angular/cdk/portal';
-import { v4 } from 'uuid';
 import { A11yModule } from '@angular/cdk/a11y';
 
 class PryAddEditPresentationComponent extends SubscriptionnerDirective {
+    set selectedPresentation(presentation) {
+        this.selectedPresentation$.next(presentation);
+    }
     constructor(store, router) {
         super();
         this.store = store;
         this.router = router;
+        this.selectedPresentation$ = new BehaviorSubject(null);
         this.edition = false;
         this.editionStartUrl = '/';
         this.image = DEFAULT_RESTITUTION_ICON_URL;
@@ -49,18 +53,18 @@ class PryAddEditPresentationComponent extends SubscriptionnerDirective {
             description: new FormControl(null, [Validators.maxLength(200)]),
             cover: new FormControl(false)
         });
-        this.image = this.selectedPresentation?.image ?? DEFAULT_RESTITUTION_ICON_URL;
+        this.image = this.selectedPresentation$.value?.image ?? DEFAULT_RESTITUTION_ICON_URL;
     }
     ngAfterViewInit() {
-        if (this.selectedPresentation) {
-            setTimeout(() => {
-                this.form.patchValue(this.selectedPresentation);
-            });
-        }
+        setTimeout(() => {
+            if (this.selectedPresentation$.value)
+                this.form.patchValue(this.selectedPresentation$.value);
+        });
     }
     save() {
         const presentation = {
-            ...this.selectedPresentation,
+            ...this.selectedPresentation$.value,
+            id: this.selectedPresentation$.value?.id || v4(),
             name: this.form.value.name ?? '',
             description: this.form.value.description ?? '',
             cover: this.form.value.cover ?? false,
@@ -73,14 +77,14 @@ class PryAddEditPresentationComponent extends SubscriptionnerDirective {
             }));
         }));
         this.store.dispatch(DashboardActions.selectPresentation({
-            presentation: presentation,
+            presentation,
             viewMode: ViewMode.EDITION
         }));
     }
     configureDashboard(selectedPresentation) {
         this.store.dispatch(DashboardActions.selectPresentation({
             presentation: {
-                ...this.selectedPresentation,
+                ...this.selectedPresentation$.value,
                 name: this.form.value.name ?? '',
                 description: this.form.value.description ?? '',
                 image: this.image ?? DEFAULT_RESTITUTION_ICON_URL,
@@ -120,14 +124,14 @@ class PryAddEditPresentationComponent extends SubscriptionnerDirective {
     }
     addMetadata(metadata) {
         this.store.dispatch(DashboardActions.addManifestMetadata({
-            presentationId: this.selectedPresentation.id,
+            presentationId: this.selectedPresentation$.value?.id,
             metadataId: metadata.metadataId,
             value: metadata.value ?? ''
         }));
     }
     removeMetadata(metadata) {
         this.store.dispatch(DashboardActions.deleteManifestMetadata({
-            presentationId: this.selectedPresentation.id,
+            presentationId: this.selectedPresentation$.value?.id,
             metadataId: metadata.metadataId
         }));
     }
@@ -135,21 +139,21 @@ class PryAddEditPresentationComponent extends SubscriptionnerDirective {
         this.goBack.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryAddEditPresentationComponent, deps: [{ token: i1.Store }, { token: i2.Router, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryAddEditPresentationComponent, selector: "pry-add-edit-presentation", inputs: { selectedPresentation: "selectedPresentation", edition: "edition", editionStartUrl: "editionStartUrl" }, outputs: { goBack: "goBack" }, usesInheritance: true, ngImport: i0, template: "<div class=\"o-manifest-layout\">\n  <div class=\"o-manifest-layout__toolbox\">\n    <button class=\"a-btn a-btn--secondary\" type=\"button\" (click)=\"close()\">\n      {{ '@pry.toolbox.manifest.close' | i18n }}\n    </button>\n    <button class=\"a-btn a-btn--primary\" type=\"button\" (click)=\"save()\" [disabled]=\"form.invalid\">\n      {{ '@pry.toolbox.manifest.check' | i18n }}\n    </button>\n  </div>\n  <div class=\"o-manifest-layout__content\">\n    <h1 class=\"a-h1\">{{ '@pry.presentation.add' + '.pageTitle' | i18n }}</h1>\n    <div class=\"o-presentation-form-wrapper\">\n      <form [formGroup]=\"form\" class=\"o-presentation-form\">\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_name\">{{ '@pry.presentation.form.name' | i18n }}</label>\n          <input\n            type=\"text\"\n            id=\"presentation_name\"\n            formControlName=\"name\"\n            placeholder=\"{{ '@pry.presentation.form.name' | i18n }}\"\n            class=\"a-form-field\"\n            maxlength=\"50\"\n            required\n          />\n          <label\n            for=\"presentation_name\"\n            *ngIf=\"form.get('name')?.touched && form.get('name')?.hasError('required')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.required' | i18n }}\n          </label>\n          <label\n            for=\"presentation_name\"\n            *ngIf=\"form.get('name')?.hasError('maxlength')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.maxLength' | i18n : { len: '50' } }}\n          </label>\n        </div>\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_description\">{{\n            '@pry.presentation.form.description' | i18n\n          }}</label>\n          <textarea\n            formControlName=\"description\"\n            id=\"presentation_description\"\n            name=\"description\"\n            cols=\"30\"\n            rows=\"5\"\n            maxlength=\"200\"\n            placeholder=\"{{ '@pry.presentation.form.description' | i18n }}\"\n            class=\"a-form-field\"\n          ></textarea>\n          <label\n            for=\"presentation_description\"\n            *ngIf=\"form.get('description')?.hasError('maxlength')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.maxLength' | i18n : { len: '200' } }}\n          </label>\n        </div>\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_image\">{{ '@pry.presentation.form.image' | i18n }}</label>\n          <div class=\"o-file-input\">\n            <pry-select-image\n              id=\"presentation_image\"\n              (changed)=\"image = $event\"\n              [iconUrl]=\"image\"\n              [mode]=\"type\"\n            ></pry-select-image>\n            <pry-checkbox formControlName=\"cover\" name=\"cover\" ngDefaultControl>\n              {{ '@pry.presentation.form.cover' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n        <div class=\"m-form-label-field -width-full m-form-label-field--inline\">\n          <label class=\"a-label\">{{ '@pry.presentation.form.grid' | i18n }}</label>\n          <span class=\"a-label\">{{ '@pry.toolbox.layout.' + this.chosenLayout | i18n }}</span>\n          <pry-select-grid-layout *ngIf=\"!edition\"></pry-select-grid-layout>\n        </div>\n      </form>\n      <div class=\"o-presentation__metadata-editor\">\n        <pry-metadata-editor\n          [targetId]=\"selectedPresentation.id\"\n          [isModification]=\"true\"\n          [metadata]=\"selectedPresentation.metadata\"\n          initialMetadataSelection=\"_theme\"\n          (removeMeta)=\"removeMetadata($event)\"\n          (addMeta)=\"addMetadata($event)\"\n          [type]=\"'meta'\"\n        ></pry-metadata-editor>\n      </div>\n    </div>\n    <button class=\"a-btn a-btn--primary\" (click)=\"configureDashboard(selectedPresentation!)\" [disabled]=\"form.invalid\">\n      {{ '@pry.presentation.configuration' | i18n }}\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: i4.PrySelectImageComponent, selector: "pry-select-image", inputs: ["iconUrl", "size", "mode"], outputs: ["toggled", "changed"] }, { kind: "directive", type: i4$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5.SelectGridLayoutComponent, selector: "pry-select-grid-layout" }, { kind: "component", type: i6.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i8.PryMetadataEditorComponent, selector: "pry-metadata-editor", inputs: ["isModification", "targetId", "type", "metadata", "initialMetadataSelection"], outputs: ["addMeta", "removeMeta"] }, { kind: "pipe", type: i4.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryAddEditPresentationComponent, selector: "pry-add-edit-presentation", inputs: { edition: "edition", editionStartUrl: "editionStartUrl", selectedPresentation: "selectedPresentation" }, outputs: { goBack: "goBack" }, usesInheritance: true, ngImport: i0, template: "<div class=\"o-manifest-layout\">\n  <div class=\"o-manifest-layout__toolbox\">\n    <button class=\"a-btn a-btn--secondary\" type=\"button\" (click)=\"close()\">\n      {{ '@pry.toolbox.manifest.close' | i18n }}\n    </button>\n    <button class=\"a-btn a-btn--primary\" type=\"button\" (click)=\"save()\" [disabled]=\"form.invalid\">\n      {{ '@pry.toolbox.manifest.check' | i18n }}\n    </button>\n  </div>\n  <div class=\"o-manifest-layout__content\">\n    <h1 class=\"a-h1\">{{ '@pry.presentation.add' + '.pageTitle' | i18n }}</h1>\n    <div class=\"o-presentation-form-wrapper\">\n      <form [formGroup]=\"form\" class=\"o-presentation-form\">\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_name\">{{ '@pry.presentation.form.name' | i18n }}</label>\n          <input\n            type=\"text\"\n            id=\"presentation_name\"\n            formControlName=\"name\"\n            placeholder=\"{{ '@pry.presentation.form.name' | i18n }}\"\n            class=\"a-form-field\"\n            maxlength=\"50\"\n            required\n          />\n          <label\n            for=\"presentation_name\"\n            *ngIf=\"form.get('name')?.touched && form.get('name')?.hasError('required')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.required' | i18n }}\n          </label>\n          <label\n            for=\"presentation_name\"\n            *ngIf=\"form.get('name')?.hasError('maxlength')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.maxLength' | i18n : { len: '50' } }}\n          </label>\n        </div>\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_description\">{{\n            '@pry.presentation.form.description' | i18n\n          }}</label>\n          <textarea\n            formControlName=\"description\"\n            id=\"presentation_description\"\n            name=\"description\"\n            cols=\"30\"\n            rows=\"5\"\n            maxlength=\"200\"\n            placeholder=\"{{ '@pry.presentation.form.description' | i18n }}\"\n            class=\"a-form-field\"\n          ></textarea>\n          <label\n            for=\"presentation_description\"\n            *ngIf=\"form.get('description')?.hasError('maxlength')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.maxLength' | i18n : { len: '200' } }}\n          </label>\n        </div>\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_image\">{{ '@pry.presentation.form.image' | i18n }}</label>\n          <div class=\"o-file-input\">\n            <pry-select-image\n              id=\"presentation_image\"\n              (changed)=\"image = $event\"\n              [iconUrl]=\"image\"\n              [mode]=\"type\"\n            ></pry-select-image>\n            <pry-checkbox formControlName=\"cover\" name=\"cover\" ngDefaultControl>\n              {{ '@pry.presentation.form.cover' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n        <div class=\"m-form-label-field -width-full m-form-label-field--inline\">\n          <label class=\"a-label\">{{ '@pry.presentation.form.grid' | i18n }}</label>\n          <span class=\"a-label\">{{ '@pry.toolbox.layout.' + this.chosenLayout | i18n }}</span>\n          <pry-select-grid-layout *ngIf=\"!edition\"></pry-select-grid-layout>\n        </div>\n      </form>\n      <div class=\"o-presentation__metadata-editor\" *ngIf=\"selectedPresentation$ | async as selectedPresentation\">\n        <pry-metadata-editor\n          [targetId]=\"selectedPresentation.id\"\n          [isModification]=\"true\"\n          [metadata]=\"selectedPresentation.metadata\"\n          (removeMeta)=\"removeMetadata($event)\"\n          (addMeta)=\"addMetadata($event)\"\n          [type]=\"'meta'\"\n        ></pry-metadata-editor>\n      </div>\n    </div>\n    <button\n      class=\"a-btn a-btn--primary\"\n      (click)=\"configureDashboard(selectedPresentation$.value!)\"\n      [disabled]=\"form.invalid\"\n    >\n      {{ '@pry.presentation.configuration' | i18n }}\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: i4.PrySelectImageComponent, selector: "pry-select-image", inputs: ["iconUrl", "size", "mode"], outputs: ["toggled", "changed"] }, { kind: "directive", type: i4$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i5.SelectGridLayoutComponent, selector: "pry-select-grid-layout" }, { kind: "component", type: i6.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i8.PryMetadataEditorComponent, selector: "pry-metadata-editor", inputs: ["isModification", "targetId", "type", "metadata"], outputs: ["addMeta", "removeMeta"] }, { kind: "pipe", type: i4.I18nPipe, name: "i18n" }, { kind: "pipe", type: i6$1.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryAddEditPresentationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pry-add-edit-presentation', template: "<div class=\"o-manifest-layout\">\n  <div class=\"o-manifest-layout__toolbox\">\n    <button class=\"a-btn a-btn--secondary\" type=\"button\" (click)=\"close()\">\n      {{ '@pry.toolbox.manifest.close' | i18n }}\n    </button>\n    <button class=\"a-btn a-btn--primary\" type=\"button\" (click)=\"save()\" [disabled]=\"form.invalid\">\n      {{ '@pry.toolbox.manifest.check' | i18n }}\n    </button>\n  </div>\n  <div class=\"o-manifest-layout__content\">\n    <h1 class=\"a-h1\">{{ '@pry.presentation.add' + '.pageTitle' | i18n }}</h1>\n    <div class=\"o-presentation-form-wrapper\">\n      <form [formGroup]=\"form\" class=\"o-presentation-form\">\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_name\">{{ '@pry.presentation.form.name' | i18n }}</label>\n          <input\n            type=\"text\"\n            id=\"presentation_name\"\n            formControlName=\"name\"\n            placeholder=\"{{ '@pry.presentation.form.name' | i18n }}\"\n            class=\"a-form-field\"\n            maxlength=\"50\"\n            required\n          />\n          <label\n            for=\"presentation_name\"\n            *ngIf=\"form.get('name')?.touched && form.get('name')?.hasError('required')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.required' | i18n }}\n          </label>\n          <label\n            for=\"presentation_name\"\n            *ngIf=\"form.get('name')?.hasError('maxlength')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.maxLength' | i18n : { len: '50' } }}\n          </label>\n        </div>\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_description\">{{\n            '@pry.presentation.form.description' | i18n\n          }}</label>\n          <textarea\n            formControlName=\"description\"\n            id=\"presentation_description\"\n            name=\"description\"\n            cols=\"30\"\n            rows=\"5\"\n            maxlength=\"200\"\n            placeholder=\"{{ '@pry.presentation.form.description' | i18n }}\"\n            class=\"a-form-field\"\n          ></textarea>\n          <label\n            for=\"presentation_description\"\n            *ngIf=\"form.get('description')?.hasError('maxlength')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.maxLength' | i18n : { len: '200' } }}\n          </label>\n        </div>\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_image\">{{ '@pry.presentation.form.image' | i18n }}</label>\n          <div class=\"o-file-input\">\n            <pry-select-image\n              id=\"presentation_image\"\n              (changed)=\"image = $event\"\n              [iconUrl]=\"image\"\n              [mode]=\"type\"\n            ></pry-select-image>\n            <pry-checkbox formControlName=\"cover\" name=\"cover\" ngDefaultControl>\n              {{ '@pry.presentation.form.cover' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n        <div class=\"m-form-label-field -width-full m-form-label-field--inline\">\n          <label class=\"a-label\">{{ '@pry.presentation.form.grid' | i18n }}</label>\n          <span class=\"a-label\">{{ '@pry.toolbox.layout.' + this.chosenLayout | i18n }}</span>\n          <pry-select-grid-layout *ngIf=\"!edition\"></pry-select-grid-layout>\n        </div>\n      </form>\n      <div class=\"o-presentation__metadata-editor\">\n        <pry-metadata-editor\n          [targetId]=\"selectedPresentation.id\"\n          [isModification]=\"true\"\n          [metadata]=\"selectedPresentation.metadata\"\n          initialMetadataSelection=\"_theme\"\n          (removeMeta)=\"removeMetadata($event)\"\n          (addMeta)=\"addMetadata($event)\"\n          [type]=\"'meta'\"\n        ></pry-metadata-editor>\n      </div>\n    </div>\n    <button class=\"a-btn a-btn--primary\" (click)=\"configureDashboard(selectedPresentation!)\" [disabled]=\"form.invalid\">\n      {{ '@pry.presentation.configuration' | i18n }}\n    </button>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'pry-add-edit-presentation', template: "<div class=\"o-manifest-layout\">\n  <div class=\"o-manifest-layout__toolbox\">\n    <button class=\"a-btn a-btn--secondary\" type=\"button\" (click)=\"close()\">\n      {{ '@pry.toolbox.manifest.close' | i18n }}\n    </button>\n    <button class=\"a-btn a-btn--primary\" type=\"button\" (click)=\"save()\" [disabled]=\"form.invalid\">\n      {{ '@pry.toolbox.manifest.check' | i18n }}\n    </button>\n  </div>\n  <div class=\"o-manifest-layout__content\">\n    <h1 class=\"a-h1\">{{ '@pry.presentation.add' + '.pageTitle' | i18n }}</h1>\n    <div class=\"o-presentation-form-wrapper\">\n      <form [formGroup]=\"form\" class=\"o-presentation-form\">\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_name\">{{ '@pry.presentation.form.name' | i18n }}</label>\n          <input\n            type=\"text\"\n            id=\"presentation_name\"\n            formControlName=\"name\"\n            placeholder=\"{{ '@pry.presentation.form.name' | i18n }}\"\n            class=\"a-form-field\"\n            maxlength=\"50\"\n            required\n          />\n          <label\n            for=\"presentation_name\"\n            *ngIf=\"form.get('name')?.touched && form.get('name')?.hasError('required')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.required' | i18n }}\n          </label>\n          <label\n            for=\"presentation_name\"\n            *ngIf=\"form.get('name')?.hasError('maxlength')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.maxLength' | i18n : { len: '50' } }}\n          </label>\n        </div>\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_description\">{{\n            '@pry.presentation.form.description' | i18n\n          }}</label>\n          <textarea\n            formControlName=\"description\"\n            id=\"presentation_description\"\n            name=\"description\"\n            cols=\"30\"\n            rows=\"5\"\n            maxlength=\"200\"\n            placeholder=\"{{ '@pry.presentation.form.description' | i18n }}\"\n            class=\"a-form-field\"\n          ></textarea>\n          <label\n            for=\"presentation_description\"\n            *ngIf=\"form.get('description')?.hasError('maxlength')\"\n            class=\"a-label a-label--help -error\"\n          >\n            {{ '@pry.presentation.maxLength' | i18n : { len: '200' } }}\n          </label>\n        </div>\n        <div class=\"m-form-label-field -width-full\">\n          <label class=\"a-label\" for=\"presentation_image\">{{ '@pry.presentation.form.image' | i18n }}</label>\n          <div class=\"o-file-input\">\n            <pry-select-image\n              id=\"presentation_image\"\n              (changed)=\"image = $event\"\n              [iconUrl]=\"image\"\n              [mode]=\"type\"\n            ></pry-select-image>\n            <pry-checkbox formControlName=\"cover\" name=\"cover\" ngDefaultControl>\n              {{ '@pry.presentation.form.cover' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n        <div class=\"m-form-label-field -width-full m-form-label-field--inline\">\n          <label class=\"a-label\">{{ '@pry.presentation.form.grid' | i18n }}</label>\n          <span class=\"a-label\">{{ '@pry.toolbox.layout.' + this.chosenLayout | i18n }}</span>\n          <pry-select-grid-layout *ngIf=\"!edition\"></pry-select-grid-layout>\n        </div>\n      </form>\n      <div class=\"o-presentation__metadata-editor\" *ngIf=\"selectedPresentation$ | async as selectedPresentation\">\n        <pry-metadata-editor\n          [targetId]=\"selectedPresentation.id\"\n          [isModification]=\"true\"\n          [metadata]=\"selectedPresentation.metadata\"\n          (removeMeta)=\"removeMetadata($event)\"\n          (addMeta)=\"addMetadata($event)\"\n          [type]=\"'meta'\"\n        ></pry-metadata-editor>\n      </div>\n    </div>\n    <button\n      class=\"a-btn a-btn--primary\"\n      (click)=\"configureDashboard(selectedPresentation$.value!)\"\n      [disabled]=\"form.invalid\"\n    >\n      {{ '@pry.presentation.configuration' | i18n }}\n    </button>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1.Store }, { type: i2.Router, decorators: [{
                     type: Optional
-                }] }]; }, propDecorators: { selectedPresentation: [{
-                type: Input
-            }], edition: [{
+                }] }]; }, propDecorators: { edition: [{
                 type: Input
             }], editionStartUrl: [{
                 type: Input
             }], goBack: [{
                 type: Output
+            }], selectedPresentation: [{
+                type: Input
             }] } });
 
 class PryTitlePresentationComponent {
@@ -179,11 +183,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImpor
 
 class PryPresentationCssComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryPresentationCssComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryPresentationCssComponent, selector: "pry-presentation-css", ngImport: i0, template: '', isInline: true, styles: ["pry-add-edit-presentation{height:100%}.o-manifest-layout__content{display:flex;flex-direction:column;padding:20px;text-align:left}.o-manifest-layout__content .a-h1{line-height:38px;font-size:28px;text-align:left}.o-manifest-layout__content .a-btn{margin:0 auto}.o-manifest-layout__toolbox{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:.9375rem}.o-manifest-layout__toolbox .a-btn{border-radius:22px}.o-presentation-form-wrapper{display:flex;padding-bottom:.3125rem;gap:3rem}.o-presentation__metadata-editor{flex:1 50%}.o-presentation-form{display:flex;flex-direction:column;align-items:center;flex:1 50%}.o-presentation-form .a-presentation-form-input{padding:.25rem .75rem;margin-bottom:.75rem}.o-presentation-form .o-file-input{border:1px dashed black;display:flex;flex-direction:column;align-items:center;width:100%;padding:2.5rem 0;gap:15px}.o-presentation-form pry-select{width:100%}.o-presentation-form .a-btn[type=submit]{margin-top:20px}.a-presentation-title{padding:15px}.a-presentation__search{position:relative}.a-presentation__search .a-icon{position:absolute;right:.6875rem;bottom:.5625rem;opacity:.5;pointer-events:none}\n", ".o-presentation{margin:0;padding:0}.o-presentation li{list-style:none}.o-manifest-layout__toolbox{height:5.25rem}.o-manifest-layout__toolbox div:first-child{margin-left:auto}.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:visible}.o-presentation .a-h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.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}.description-container{position:relative;width:100%}.description{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:inherit;position:relative;line-height:2rem;box-sizing:border-box;pointer-events:none}.description:after{content:\"\";display:block;position:absolute;top:0;right:0;width:40px;height:48px;z-index:1;pointer-events:initial}.description:hover:after{cursor:pointer}.description-tooltip{position:absolute;max-width:50vw;visibility:hidden;background-color:#fff;padding:20px;-webkit-box-shadow:0 0 50px 0 rgba(0,0,0,.3);opacity:0;transition:opacity .5s ease;z-index:2}.description:hover+.description-tooltip{visibility:visible;transition:opacity .2s ease;opacity:1}.title-tooltip{transform:translateY(4rem)}h1.a-presentation-title{font-size:16px;padding-right:20px}.title-container{display:flex}.info-icon{position:relative;width:1.5rem;height:1.5rem;border-radius:50%;background-color:#ccc;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;align-self:center;margin-right:1rem}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryPresentationCssComponent, selector: "pry-presentation-css", ngImport: i0, template: '', isInline: true, styles: ["pry-add-edit-presentation{height:100%}.o-manifest-layout__content{display:flex;flex-direction:column;padding:20px;text-align:left}.o-manifest-layout__content .a-h1{line-height:38px;font-size:28px;text-align:left}.o-manifest-layout__content .a-btn{margin:0 auto}.o-manifest-layout__toolbox{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:.9375rem}.o-manifest-layout__toolbox .a-btn{border-radius:22px}.o-presentation-form-wrapper{display:flex;padding-bottom:.3125rem;gap:3rem}.o-presentation__metadata-editor{flex:1 50%}.o-presentation__metadata-editor pry-metadata-editor ng-select{position:relative;width:100%}.o-presentation-form{display:flex;flex-direction:column;align-items:center;flex:1 50%}.o-presentation-form .a-presentation-form-input{padding:.25rem .75rem;margin-bottom:.75rem}.o-presentation-form .o-file-input{border:1px dashed black;display:flex;flex-direction:column;align-items:center;width:100%;padding:2.5rem 0;gap:15px}.o-presentation-form pry-select{width:100%}.o-presentation-form .a-btn[type=submit]{margin-top:20px}.a-presentation-title{padding:15px}.a-presentation__search{position:relative}.a-presentation__search .a-icon{position:absolute;right:.6875rem;bottom:.5625rem;opacity:.5;pointer-events:none}\n", ".o-presentation{margin:0;padding:0}.o-presentation li{list-style:none}.o-manifest-layout__toolbox{height:5.25rem}.o-manifest-layout__toolbox div:first-child{margin-left:auto}.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:visible}.o-presentation .a-h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.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}.description-container{position:relative;width:100%}.description{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:inherit;position:relative;line-height:2rem;box-sizing:border-box;pointer-events:none}.description:after{content:\"\";display:block;position:absolute;top:0;right:0;width:40px;height:48px;z-index:1;pointer-events:initial}.description:hover:after{cursor:pointer}.description-tooltip{position:absolute;max-width:50vw;visibility:hidden;background-color:#fff;padding:20px;-webkit-box-shadow:0 0 50px 0 rgba(0,0,0,.3);opacity:0;transition:opacity .5s ease;z-index:2}.description:hover+.description-tooltip{visibility:visible;transition:opacity .2s ease;opacity:1}.title-tooltip{transform:translateY(4rem)}h1.a-presentation-title{font-size:16px;padding-right:20px}.title-container{display:flex}.info-icon{position:relative;width:1.5rem;height:1.5rem;border-radius:50%;background-color:#ccc;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;align-self:center;margin-right:1rem}\n"], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryPresentationCssComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pry-presentation-css', template: '', encapsulation: ViewEncapsulation.None, styles: ["pry-add-edit-presentation{height:100%}.o-manifest-layout__content{display:flex;flex-direction:column;padding:20px;text-align:left}.o-manifest-layout__content .a-h1{line-height:38px;font-size:28px;text-align:left}.o-manifest-layout__content .a-btn{margin:0 auto}.o-manifest-layout__toolbox{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:.9375rem}.o-manifest-layout__toolbox .a-btn{border-radius:22px}.o-presentation-form-wrapper{display:flex;padding-bottom:.3125rem;gap:3rem}.o-presentation__metadata-editor{flex:1 50%}.o-presentation-form{display:flex;flex-direction:column;align-items:center;flex:1 50%}.o-presentation-form .a-presentation-form-input{padding:.25rem .75rem;margin-bottom:.75rem}.o-presentation-form .o-file-input{border:1px dashed black;display:flex;flex-direction:column;align-items:center;width:100%;padding:2.5rem 0;gap:15px}.o-presentation-form pry-select{width:100%}.o-presentation-form .a-btn[type=submit]{margin-top:20px}.a-presentation-title{padding:15px}.a-presentation__search{position:relative}.a-presentation__search .a-icon{position:absolute;right:.6875rem;bottom:.5625rem;opacity:.5;pointer-events:none}\n", ".o-presentation{margin:0;padding:0}.o-presentation li{list-style:none}.o-manifest-layout__toolbox{height:5.25rem}.o-manifest-layout__toolbox div:first-child{margin-left:auto}.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:visible}.o-presentation .a-h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.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}.description-container{position:relative;width:100%}.description{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:inherit;position:relative;line-height:2rem;box-sizing:border-box;pointer-events:none}.description:after{content:\"\";display:block;position:absolute;top:0;right:0;width:40px;height:48px;z-index:1;pointer-events:initial}.description:hover:after{cursor:pointer}.description-tooltip{position:absolute;max-width:50vw;visibility:hidden;background-color:#fff;padding:20px;-webkit-box-shadow:0 0 50px 0 rgba(0,0,0,.3);opacity:0;transition:opacity .5s ease;z-index:2}.description:hover+.description-tooltip{visibility:visible;transition:opacity .2s ease;opacity:1}.title-tooltip{transform:translateY(4rem)}h1.a-presentation-title{font-size:16px;padding-right:20px}.title-container{display:flex}.info-icon{position:relative;width:1.5rem;height:1.5rem;border-radius:50%;background-color:#ccc;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;align-self:center;margin-right:1rem}\n"] }]
+            args: [{ selector: 'pry-presentation-css', template: '', encapsulation: ViewEncapsulation.None, styles: ["pry-add-edit-presentation{height:100%}.o-manifest-layout__content{display:flex;flex-direction:column;padding:20px;text-align:left}.o-manifest-layout__content .a-h1{line-height:38px;font-size:28px;text-align:left}.o-manifest-layout__content .a-btn{margin:0 auto}.o-manifest-layout__toolbox{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:.9375rem}.o-manifest-layout__toolbox .a-btn{border-radius:22px}.o-presentation-form-wrapper{display:flex;padding-bottom:.3125rem;gap:3rem}.o-presentation__metadata-editor{flex:1 50%}.o-presentation__metadata-editor pry-metadata-editor ng-select{position:relative;width:100%}.o-presentation-form{display:flex;flex-direction:column;align-items:center;flex:1 50%}.o-presentation-form .a-presentation-form-input{padding:.25rem .75rem;margin-bottom:.75rem}.o-presentation-form .o-file-input{border:1px dashed black;display:flex;flex-direction:column;align-items:center;width:100%;padding:2.5rem 0;gap:15px}.o-presentation-form pry-select{width:100%}.o-presentation-form .a-btn[type=submit]{margin-top:20px}.a-presentation-title{padding:15px}.a-presentation__search{position:relative}.a-presentation__search .a-icon{position:absolute;right:.6875rem;bottom:.5625rem;opacity:.5;pointer-events:none}\n", ".o-presentation{margin:0;padding:0}.o-presentation li{list-style:none}.o-manifest-layout__toolbox{height:5.25rem}.o-manifest-layout__toolbox div:first-child{margin-left:auto}.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:visible}.o-presentation .a-h3{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.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}.description-container{position:relative;width:100%}.description{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:inherit;position:relative;line-height:2rem;box-sizing:border-box;pointer-events:none}.description:after{content:\"\";display:block;position:absolute;top:0;right:0;width:40px;height:48px;z-index:1;pointer-events:initial}.description:hover:after{cursor:pointer}.description-tooltip{position:absolute;max-width:50vw;visibility:hidden;background-color:#fff;padding:20px;-webkit-box-shadow:0 0 50px 0 rgba(0,0,0,.3);opacity:0;transition:opacity .5s ease;z-index:2}.description:hover+.description-tooltip{visibility:visible;transition:opacity .2s ease;opacity:1}.title-tooltip{transform:translateY(4rem)}h1.a-presentation-title{font-size:16px;padding-right:20px}.title-container{display:flex}.info-icon{position:relative;width:1.5rem;height:1.5rem;border-radius:50%;background-color:#ccc;cursor:pointer;display:inline-flex;justify-content:center;align-items:center;align-self:center;margin-right:1rem}\n"] }]
         }] });
 
 class PryPresentationComponent extends SubscriptionnerDirective {
@@ -194,7 +198,7 @@ class PryPresentationComponent extends SubscriptionnerDirective {
         this.viewContainerRef = viewContainerRef;
         this.router = router;
         this.ngZone = ngZone;
-        this.selectedPresentation = null;
+        this.selectedPresentation$ = new BehaviorSubject(null);
         this.selectedMode = ViewMode.CATALOG;
         this.modalOpened = false;
         this.visibility = { type: PryVisibilityType.PRIVATE };
@@ -215,13 +219,13 @@ class PryPresentationComponent extends SubscriptionnerDirective {
             presentations.name.toLowerCase().includes(search.toLowerCase()))));
         this.subscriptions.add(this.store.select(DashboardSelectors.presentation).subscribe((presentation) => {
             if (!!presentation.current) {
-                this.selectedPresentation = presentation.current ?? null;
+                this.selectedPresentation$.next(presentation.current ?? null);
                 this.selectedMode = presentation?.viewMode ?? this.ViewMode.CATALOG;
             }
         }));
     }
     closeRestitution() {
-        this.selectedPresentation = null;
+        this.selectedPresentation$.next(null);
         this.selectedMode = ViewMode.CATALOG;
         this.store.dispatch(DashboardActions.selectPresentation({ presentation: undefined, viewMode: ViewMode.CATALOG }));
     }
@@ -272,8 +276,8 @@ class PryPresentationComponent extends SubscriptionnerDirective {
     }
     edit(presentation) {
         this.selectedMode = ViewMode.EDITION;
-        this.selectedPresentation = presentation;
-        this.store.dispatch(DashboardActions.selectPresentation({ presentation: this.selectedPresentation, viewMode: ViewMode.EDITION }));
+        this.selectedPresentation$.next(presentation);
+        this.store.dispatch(DashboardActions.selectPresentation({ presentation, viewMode: ViewMode.EDITION }));
         this.store.dispatch(DashboardActions.fetchStaticManifest({ id: presentation.id }));
         this.store.dispatch(DashboardActions.updateDisplayOptions({ mode: DisplayMode.EDIT }));
     }
@@ -286,8 +290,8 @@ class PryPresentationComponent extends SubscriptionnerDirective {
     toggleModal(presentation) {
         this.modalOpened = !this.modalOpened;
         if (this.modalOpened && presentation) {
-            this.selectedPresentation = presentation;
-            this.store.dispatch(DashboardActions.selectPresentation({ presentation: this.selectedPresentation, viewMode: ViewMode.CATALOG }));
+            this.selectedPresentation$.next(presentation);
+            this.store.dispatch(DashboardActions.selectPresentation({ presentation, viewMode: ViewMode.CATALOG }));
             /* we need to load manifest in order to be able to save it later */
             this.store.dispatch(DashboardActions.loadManifest({ id: presentation.id }));
             this.overlayRef = this.overlay.create(new OverlayConfig({
@@ -304,20 +308,20 @@ class PryPresentationComponent extends SubscriptionnerDirective {
         }
         else {
             this.overlayRef?.dispose();
-            this.selectedPresentation = null;
+            this.selectedPresentation$.next(null);
         }
     }
-    changeVisibility() {
-        if (this.selectedPresentation) {
+    changeVisibility(presentation) {
+        if (presentation) {
             this.store.dispatch(DashboardActions.saveManifest({
-                id: this.selectedPresentation.id ?? '',
-                name: this.selectedPresentation.name ?? '',
-                description: this.selectedPresentation.description ?? '',
-                image: this.selectedPresentation.image ?? '',
+                id: presentation.id ?? '',
+                name: presentation.name ?? '',
+                description: presentation.description ?? '',
+                image: presentation.image ?? '',
                 visibility: this.visibility
             }));
         }
-        this.toggleModal(this.selectedPresentation);
+        this.toggleModal(presentation);
     }
     focusCrossElement() {
         if (this.crossVisibility) {
@@ -332,11 +336,11 @@ class PryPresentationComponent extends SubscriptionnerDirective {
         this.submit.nativeElement.focus();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryPresentationComponent, deps: [{ token: i1.Store }, { token: i2$1.Overlay }, { token: i0.ViewContainerRef }, { token: i2.Router }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryPresentationComponent, selector: "pry-presentation", inputs: { editionStartUrl: "editionStartUrl", consultStartUrl: "consultStartUrl", meAsOwner: "meAsOwner" }, viewQueries: [{ propertyName: "template", first: true, predicate: ["modal"], descendants: true, read: TemplateRef }, { propertyName: "templateModal", first: true, predicate: ["templateModal"], descendants: true, read: TemplateRef }, { propertyName: "openModal", first: true, predicate: ["openModal"], descendants: true }, { propertyName: "confirm", first: true, predicate: ["confirm"], descendants: true }, { propertyName: "submit", first: true, predicate: ["submit"], descendants: true }, { propertyName: "cross", first: true, predicate: ["cross"], descendants: true }, { propertyName: "crossVisibility", first: true, predicate: ["crossVisibility"], descendants: true }, { propertyName: "visibilityModal", first: true, predicate: ["visibilityModal"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-presentation-css></pry-presentation-css>\n<div class=\"o-manifest-layout\" [ngSwitch]=\"selectedMode\">\n  <ng-container *ngSwitchCase=\"ViewMode.CATALOG\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button\n        [pryTooltip]=\"create\"\n        class=\"a-btn a-btn--primary a-btn--icon-text\"\n        type=\"button\"\n        (click)=\"creation()\"\n        *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'create' }\"\n      >\n        {{ '@pry.presentation.create' | i18n }}\n      </button>\n      <div>\n        <div class=\"a-presentation__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.presentation.search' | i18n\"\n            [ngModel]=\"search$ | async\"\n            (ngModelChange)=\"this.search$.next($event)\"\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.manifest.title' | i18n }}</h1>\n\n      <div class=\"o-presentation-wrapper\">\n        <ul class=\"o-presentation\">\n          <li class=\"o-presentation__item\" *ngFor=\"let presentation of filteredPresentations$ | async\">\n            <div class=\"o-presentation__item__header\">\n              <ng-container *ngIf=\"presentation.visibility.type === PryVisibilityType.PRIVATE\">\n                <pry-icon\n                  [iconSvg]=\"presentation.visibility.type.toLowerCase()\"\n                  [pryTooltip]=\"private\"\n                  class=\"is-private\"\n                  [height]=\"17\"\n                  [width]=\"17\"\n                ></pry-icon>\n              </ng-container>\n\n              <img\n                alt=\"\"\n                [height]=\"presentation.cover ? 600 : 128\"\n                [width]=\"presentation.cover ? 600 : 128\"\n                [class.is-full-width]=\"presentation.cover\"\n                [src]=\"presentation.image | getSecuredImage | async\"\n                (click)=\"fetch(presentation)\"\n                [pryTooltip]=\"view\"\n              />\n            </div>\n\n            <div class=\"o-presentation__item__txt\">\n              <h3 class=\"a-h3\">{{ presentation.name }}</h3>\n              <div class=\"a-p\">\n                <div class=\"description-container\">\n                  <span class=\"description\">\n                    {{ presentation.description }}\n                  </span>\n                  <div class=\"description-tooltip\">{{ presentation.description }}</div>\n                </div>\n              </div>\n              <p class=\"a-p -date\">{{ presentation.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)=\"default(presentation.id, presentation.name)\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'default' }\"\n                  >\n                    <pry-icon\n                      [iconSvg]=\"presentation.default ? 'home-fill' : 'home-line'\"\n                      [pryTooltip]=\"homeView\"\n                    ></pry-icon>\n                    <span class=\"u-visually-hidden\"></span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    class=\"a-btn a-btn--icon-only\"\n                    (click)=\"edit(presentation)\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'edit' }\"\n                  >\n                    <pry-icon iconSvg=\"edit\" [pryTooltip]=\"change\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.edition' | i18n }}</span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    (click)=\"toggleModal(presentation)\"\n                    class=\"a-btn a-btn--icon-only\"\n                    aria-haspopup=\"dialog\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'share' }\"\n                  >\n                    <pry-icon iconSvg=\"share\" [pryTooltip]=\"share\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.share' | i18n }}</span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    class=\"a-btn a-btn--icon-only\"\n                    #openModal\n                    (click)=\"delete(presentation.id)\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'delete' }\"\n                  >\n                    <pry-icon iconSvg=\"delete\" [pryTooltip]=\"erase\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.delete' | i18n }}</span>\n                  </button>\n                </li>\n              </ul>\n            </div>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"ViewMode.CREATION\">\n    <pry-add-edit-presentation\n      [selectedPresentation]=\"selectedPresentation!\"\n      (goBack)=\"closeRestitution()\"\n      [editionStartUrl]=\"editionStartUrl\"\n      [edition]=\"false\"\n    ></pry-add-edit-presentation>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"ViewMode.EDITION\">\n    <pry-add-edit-presentation\n      [selectedPresentation]=\"selectedPresentation!\"\n      (goBack)=\"closeRestitution()\"\n      [editionStartUrl]=\"editionStartUrl\"\n      [edition]=\"true\"\n    ></pry-add-edit-presentation>\n  </ng-container>\n</div>\n\n<ng-template #modal>\n  <div\n    class=\"o-modal\"\n    (click)=\"$event.stopPropagation()\"\n    #visibilityModal\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"dialog change visibility\"\n    *ngIf=\"selectedPresentation\"\n  >\n    <div class=\"o-modal__top\">\n      <div class=\"o-modal__top__title\">\n        <h2 class=\"a-h2\" id=\"dialog_title\">{{ '@pry.toolbox.rename' | i18n }}</h2>\n      </div>\n      <div class=\"o-modal__top__close\">\n        <button\n          class=\"a-btn a-btn--icon-only\"\n          #crossVisibility\n          (keydown.shift.tab)=\"focusValidation()\"\n          (click)=\"toggleModal()\"\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    <pry-share [ngModel]=\"selectedPresentation.visibility\" (ngModelChange)=\"visibility = $event\"></pry-share>\n    <div class=\"m-btn-group\">\n      <button type=\"button\" class=\"a-btn a-btn--secondary\" (click)=\"toggleModal()\">\n        {{ '@pry.toolbox.manifest.close' | i18n }}\n      </button>\n      <button\n        type=\"submit\"\n        class=\"a-btn a-btn--primary\"\n        #submit\n        (keydown.tab)=\"focusCrossElement()\"\n        (click)=\"changeVisibility()\"\n      >\n        {{ '@pry.toolbox.manifest.check' | i18n }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #create>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.create' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #view>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.view' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #private>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.private' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #homeView>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.homeView' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #share>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.share' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #erase>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.erase' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #change>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.change' | i18n }}</span>\n  </div>\n</ng-template>\n<ng-template #backToCatalog>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.backToCatalog' | i18n }}</span>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i4.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.PryAccessDirective, selector: "[pryAccess]", inputs: ["pryAccess"] }, { kind: "directive", type: i4$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i4.PryShareComponent, selector: "pry-share", inputs: ["value", "labelProperty", "valueProperty", "users$"] }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "directive", type: i6$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i6$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: PryAddEditPresentationComponent, selector: "pry-add-edit-presentation", inputs: ["selectedPresentation", "edition", "editionStartUrl"], outputs: ["goBack"] }, { kind: "component", type: PryPresentationCssComponent, selector: "pry-presentation-css" }, { kind: "pipe", type: i4.GetSecuredImagePipe, name: "getSecuredImage" }, { kind: "pipe", type: i4$2.PrySinceDatePipe, name: "sinceDate" }, { kind: "pipe", type: i4.I18nPipe, name: "i18n" }, { kind: "pipe", type: i6$1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PryPresentationComponent, selector: "pry-presentation", inputs: { editionStartUrl: "editionStartUrl", consultStartUrl: "consultStartUrl", meAsOwner: "meAsOwner" }, viewQueries: [{ propertyName: "template", first: true, predicate: ["modal"], descendants: true, read: TemplateRef }, { propertyName: "templateModal", first: true, predicate: ["templateModal"], descendants: true, read: TemplateRef }, { propertyName: "openModal", first: true, predicate: ["openModal"], descendants: true }, { propertyName: "confirm", first: true, predicate: ["confirm"], descendants: true }, { propertyName: "submit", first: true, predicate: ["submit"], descendants: true }, { propertyName: "cross", first: true, predicate: ["cross"], descendants: true }, { propertyName: "crossVisibility", first: true, predicate: ["crossVisibility"], descendants: true }, { propertyName: "visibilityModal", first: true, predicate: ["visibilityModal"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-presentation-css></pry-presentation-css>\n<div class=\"o-manifest-layout\" [ngSwitch]=\"selectedMode\">\n  <ng-container *ngSwitchCase=\"ViewMode.CATALOG\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button\n        [pryTooltip]=\"create\"\n        class=\"a-btn a-btn--primary a-btn--icon-text\"\n        type=\"button\"\n        (click)=\"creation()\"\n        *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'create' }\"\n      >\n        {{ '@pry.presentation.create' | i18n }}\n      </button>\n      <div>\n        <div class=\"a-presentation__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.presentation.search' | i18n\"\n            [ngModel]=\"search$ | async\"\n            (ngModelChange)=\"this.search$.next($event)\"\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.manifest.title' | i18n }}</h1>\n\n      <div class=\"o-presentation-wrapper\">\n        <ul class=\"o-presentation\">\n          <li class=\"o-presentation__item\" *ngFor=\"let presentation of filteredPresentations$ | async\">\n            <div class=\"o-presentation__item__header\">\n              <ng-container *ngIf=\"presentation.visibility.type === PryVisibilityType.PRIVATE\">\n                <pry-icon\n                  [iconSvg]=\"presentation.visibility.type.toLowerCase()\"\n                  [pryTooltip]=\"private\"\n                  class=\"is-private\"\n                  [height]=\"17\"\n                  [width]=\"17\"\n                ></pry-icon>\n              </ng-container>\n\n              <img\n                alt=\"\"\n                [height]=\"presentation.cover ? 600 : 128\"\n                [width]=\"presentation.cover ? 600 : 128\"\n                [class.is-full-width]=\"presentation.cover\"\n                [src]=\"presentation.image | getSecuredImage | async\"\n                (click)=\"fetch(presentation)\"\n                [pryTooltip]=\"view\"\n              />\n            </div>\n\n            <div class=\"o-presentation__item__txt\">\n              <h3 class=\"a-h3\">{{ presentation.name }}</h3>\n              <div class=\"a-p\">\n                <div class=\"description-container\">\n                  <span class=\"description\">\n                    {{ presentation.description }}\n                  </span>\n                  <div class=\"description-tooltip\">{{ presentation.description }}</div>\n                </div>\n              </div>\n              <p class=\"a-p -date\">{{ presentation.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)=\"default(presentation.id, presentation.name)\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'default' }\"\n                  >\n                    <pry-icon\n                      [iconSvg]=\"presentation.default ? 'home-fill' : 'home-line'\"\n                      [pryTooltip]=\"homeView\"\n                    ></pry-icon>\n                    <span class=\"u-visually-hidden\"></span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    class=\"a-btn a-btn--icon-only\"\n                    (click)=\"edit(presentation)\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'edit' }\"\n                  >\n                    <pry-icon iconSvg=\"edit\" [pryTooltip]=\"change\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.edition' | i18n }}</span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    (click)=\"toggleModal(presentation)\"\n                    class=\"a-btn a-btn--icon-only\"\n                    aria-haspopup=\"dialog\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'share' }\"\n                  >\n                    <pry-icon iconSvg=\"share\" [pryTooltip]=\"share\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.share' | i18n }}</span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    class=\"a-btn a-btn--icon-only\"\n                    #openModal\n                    (click)=\"delete(presentation.id)\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'delete' }\"\n                  >\n                    <pry-icon iconSvg=\"delete\" [pryTooltip]=\"erase\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.delete' | i18n }}</span>\n                  </button>\n                </li>\n              </ul>\n            </div>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"ViewMode.CREATION\">\n    <pry-add-edit-presentation\n      [selectedPresentation]=\"selectedPresentation$ | async\"\n      (goBack)=\"closeRestitution()\"\n      [editionStartUrl]=\"editionStartUrl\"\n      [edition]=\"false\"\n    ></pry-add-edit-presentation>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"ViewMode.EDITION\">\n    <pry-add-edit-presentation\n      [selectedPresentation]=\"selectedPresentation$ | async\"\n      (goBack)=\"closeRestitution()\"\n      [editionStartUrl]=\"editionStartUrl\"\n      [edition]=\"true\"\n    ></pry-add-edit-presentation>\n  </ng-container>\n</div>\n\n<ng-template #modal>\n  <div\n    class=\"o-modal\"\n    (click)=\"$event.stopPropagation()\"\n    #visibilityModal\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"dialog change visibility\"\n    *ngIf=\"selectedPresentation$ | async as selectedPresentation\"\n  >\n    <div class=\"o-modal__top\">\n      <div class=\"o-modal__top__title\">\n        <h2 class=\"a-h2\" id=\"dialog_title\">{{ '@pry.toolbox.rename' | i18n }}</h2>\n      </div>\n      <div class=\"o-modal__top__close\">\n        <button\n          class=\"a-btn a-btn--icon-only\"\n          #crossVisibility\n          (keydown.shift.tab)=\"focusValidation()\"\n          (click)=\"toggleModal()\"\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    <pry-share [ngModel]=\"selectedPresentation.visibility\" (ngModelChange)=\"visibility = $event\"></pry-share>\n    <div class=\"m-btn-group\">\n      <button type=\"button\" class=\"a-btn a-btn--secondary\" (click)=\"toggleModal()\">\n        {{ '@pry.toolbox.manifest.close' | i18n }}\n      </button>\n      <button\n        type=\"submit\"\n        class=\"a-btn a-btn--primary\"\n        #submit\n        (keydown.tab)=\"focusCrossElement()\"\n        (click)=\"changeVisibility(selectedPresentation)\"\n      >\n        {{ '@pry.toolbox.manifest.check' | i18n }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #create>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.create' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #view>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.view' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #private>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.private' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #homeView>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.homeView' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #share>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.share' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #erase>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.erase' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #change>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.change' | i18n }}</span>\n  </div>\n</ng-template>\n<ng-template #backToCatalog>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.backToCatalog' | i18n }}</span>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i4.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "directive", type: i4.PryAccessDirective, selector: "[pryAccess]", inputs: ["pryAccess"] }, { kind: "directive", type: i4$1.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$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i4.PryShareComponent, selector: "pry-share", inputs: ["value", "labelProperty", "valueProperty", "users$"] }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.PryTooltipDirective, selector: "[pryTooltip]", inputs: ["pryTooltip", "styleReversed", "pryTooltipContext", "pryTooltipPosition", "pryTooltipShowDelay"] }, { kind: "directive", type: i6$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i6$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: PryAddEditPresentationComponent, selector: "pry-add-edit-presentation", inputs: ["edition", "editionStartUrl", "selectedPresentation"], outputs: ["goBack"] }, { kind: "component", type: PryPresentationCssComponent, selector: "pry-presentation-css" }, { kind: "pipe", type: i4.GetSecuredImagePipe, name: "getSecuredImage" }, { kind: "pipe", type: i4$2.PrySinceDatePipe, name: "sinceDate" }, { kind: "pipe", type: i4.I18nPipe, name: "i18n" }, { kind: "pipe", type: i6$1.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PryPresentationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pry-presentation', template: "<pry-presentation-css></pry-presentation-css>\n<div class=\"o-manifest-layout\" [ngSwitch]=\"selectedMode\">\n  <ng-container *ngSwitchCase=\"ViewMode.CATALOG\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button\n        [pryTooltip]=\"create\"\n        class=\"a-btn a-btn--primary a-btn--icon-text\"\n        type=\"button\"\n        (click)=\"creation()\"\n        *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'create' }\"\n      >\n        {{ '@pry.presentation.create' | i18n }}\n      </button>\n      <div>\n        <div class=\"a-presentation__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.presentation.search' | i18n\"\n            [ngModel]=\"search$ | async\"\n            (ngModelChange)=\"this.search$.next($event)\"\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.manifest.title' | i18n }}</h1>\n\n      <div class=\"o-presentation-wrapper\">\n        <ul class=\"o-presentation\">\n          <li class=\"o-presentation__item\" *ngFor=\"let presentation of filteredPresentations$ | async\">\n            <div class=\"o-presentation__item__header\">\n              <ng-container *ngIf=\"presentation.visibility.type === PryVisibilityType.PRIVATE\">\n                <pry-icon\n                  [iconSvg]=\"presentation.visibility.type.toLowerCase()\"\n                  [pryTooltip]=\"private\"\n                  class=\"is-private\"\n                  [height]=\"17\"\n                  [width]=\"17\"\n                ></pry-icon>\n              </ng-container>\n\n              <img\n                alt=\"\"\n                [height]=\"presentation.cover ? 600 : 128\"\n                [width]=\"presentation.cover ? 600 : 128\"\n                [class.is-full-width]=\"presentation.cover\"\n                [src]=\"presentation.image | getSecuredImage | async\"\n                (click)=\"fetch(presentation)\"\n                [pryTooltip]=\"view\"\n              />\n            </div>\n\n            <div class=\"o-presentation__item__txt\">\n              <h3 class=\"a-h3\">{{ presentation.name }}</h3>\n              <div class=\"a-p\">\n                <div class=\"description-container\">\n                  <span class=\"description\">\n                    {{ presentation.description }}\n                  </span>\n                  <div class=\"description-tooltip\">{{ presentation.description }}</div>\n                </div>\n              </div>\n              <p class=\"a-p -date\">{{ presentation.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)=\"default(presentation.id, presentation.name)\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'default' }\"\n                  >\n                    <pry-icon\n                      [iconSvg]=\"presentation.default ? 'home-fill' : 'home-line'\"\n                      [pryTooltip]=\"homeView\"\n                    ></pry-icon>\n                    <span class=\"u-visually-hidden\"></span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    class=\"a-btn a-btn--icon-only\"\n                    (click)=\"edit(presentation)\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'edit' }\"\n                  >\n                    <pry-icon iconSvg=\"edit\" [pryTooltip]=\"change\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.edition' | i18n }}</span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    (click)=\"toggleModal(presentation)\"\n                    class=\"a-btn a-btn--icon-only\"\n                    aria-haspopup=\"dialog\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'share' }\"\n                  >\n                    <pry-icon iconSvg=\"share\" [pryTooltip]=\"share\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.share' | i18n }}</span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    class=\"a-btn a-btn--icon-only\"\n                    #openModal\n                    (click)=\"delete(presentation.id)\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'delete' }\"\n                  >\n                    <pry-icon iconSvg=\"delete\" [pryTooltip]=\"erase\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.delete' | i18n }}</span>\n                  </button>\n                </li>\n              </ul>\n            </div>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"ViewMode.CREATION\">\n    <pry-add-edit-presentation\n      [selectedPresentation]=\"selectedPresentation!\"\n      (goBack)=\"closeRestitution()\"\n      [editionStartUrl]=\"editionStartUrl\"\n      [edition]=\"false\"\n    ></pry-add-edit-presentation>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"ViewMode.EDITION\">\n    <pry-add-edit-presentation\n      [selectedPresentation]=\"selectedPresentation!\"\n      (goBack)=\"closeRestitution()\"\n      [editionStartUrl]=\"editionStartUrl\"\n      [edition]=\"true\"\n    ></pry-add-edit-presentation>\n  </ng-container>\n</div>\n\n<ng-template #modal>\n  <div\n    class=\"o-modal\"\n    (click)=\"$event.stopPropagation()\"\n    #visibilityModal\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"dialog change visibility\"\n    *ngIf=\"selectedPresentation\"\n  >\n    <div class=\"o-modal__top\">\n      <div class=\"o-modal__top__title\">\n        <h2 class=\"a-h2\" id=\"dialog_title\">{{ '@pry.toolbox.rename' | i18n }}</h2>\n      </div>\n      <div class=\"o-modal__top__close\">\n        <button\n          class=\"a-btn a-btn--icon-only\"\n          #crossVisibility\n          (keydown.shift.tab)=\"focusValidation()\"\n          (click)=\"toggleModal()\"\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    <pry-share [ngModel]=\"selectedPresentation.visibility\" (ngModelChange)=\"visibility = $event\"></pry-share>\n    <div class=\"m-btn-group\">\n      <button type=\"button\" class=\"a-btn a-btn--secondary\" (click)=\"toggleModal()\">\n        {{ '@pry.toolbox.manifest.close' | i18n }}\n      </button>\n      <button\n        type=\"submit\"\n        class=\"a-btn a-btn--primary\"\n        #submit\n        (keydown.tab)=\"focusCrossElement()\"\n        (click)=\"changeVisibility()\"\n      >\n        {{ '@pry.toolbox.manifest.check' | i18n }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #create>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.create' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #view>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.view' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #private>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.private' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #homeView>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.homeView' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #share>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.share' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #erase>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.erase' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #change>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.change' | i18n }}</span>\n  </div>\n</ng-template>\n<ng-template #backToCatalog>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.backToCatalog' | i18n }}</span>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'pry-presentation', template: "<pry-presentation-css></pry-presentation-css>\n<div class=\"o-manifest-layout\" [ngSwitch]=\"selectedMode\">\n  <ng-container *ngSwitchCase=\"ViewMode.CATALOG\">\n    <div class=\"o-manifest-layout__toolbox\">\n      <button\n        [pryTooltip]=\"create\"\n        class=\"a-btn a-btn--primary a-btn--icon-text\"\n        type=\"button\"\n        (click)=\"creation()\"\n        *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'create' }\"\n      >\n        {{ '@pry.presentation.create' | i18n }}\n      </button>\n      <div>\n        <div class=\"a-presentation__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.presentation.search' | i18n\"\n            [ngModel]=\"search$ | async\"\n            (ngModelChange)=\"this.search$.next($event)\"\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.manifest.title' | i18n }}</h1>\n\n      <div class=\"o-presentation-wrapper\">\n        <ul class=\"o-presentation\">\n          <li class=\"o-presentation__item\" *ngFor=\"let presentation of filteredPresentations$ | async\">\n            <div class=\"o-presentation__item__header\">\n              <ng-container *ngIf=\"presentation.visibility.type === PryVisibilityType.PRIVATE\">\n                <pry-icon\n                  [iconSvg]=\"presentation.visibility.type.toLowerCase()\"\n                  [pryTooltip]=\"private\"\n                  class=\"is-private\"\n                  [height]=\"17\"\n                  [width]=\"17\"\n                ></pry-icon>\n              </ng-container>\n\n              <img\n                alt=\"\"\n                [height]=\"presentation.cover ? 600 : 128\"\n                [width]=\"presentation.cover ? 600 : 128\"\n                [class.is-full-width]=\"presentation.cover\"\n                [src]=\"presentation.image | getSecuredImage | async\"\n                (click)=\"fetch(presentation)\"\n                [pryTooltip]=\"view\"\n              />\n            </div>\n\n            <div class=\"o-presentation__item__txt\">\n              <h3 class=\"a-h3\">{{ presentation.name }}</h3>\n              <div class=\"a-p\">\n                <div class=\"description-container\">\n                  <span class=\"description\">\n                    {{ presentation.description }}\n                  </span>\n                  <div class=\"description-tooltip\">{{ presentation.description }}</div>\n                </div>\n              </div>\n              <p class=\"a-p -date\">{{ presentation.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)=\"default(presentation.id, presentation.name)\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'default' }\"\n                  >\n                    <pry-icon\n                      [iconSvg]=\"presentation.default ? 'home-fill' : 'home-line'\"\n                      [pryTooltip]=\"homeView\"\n                    ></pry-icon>\n                    <span class=\"u-visually-hidden\"></span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    class=\"a-btn a-btn--icon-only\"\n                    (click)=\"edit(presentation)\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'edit' }\"\n                  >\n                    <pry-icon iconSvg=\"edit\" [pryTooltip]=\"change\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.edition' | i18n }}</span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    (click)=\"toggleModal(presentation)\"\n                    class=\"a-btn a-btn--icon-only\"\n                    aria-haspopup=\"dialog\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'share' }\"\n                  >\n                    <pry-icon iconSvg=\"share\" [pryTooltip]=\"share\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.share' | i18n }}</span>\n                  </button>\n                </li>\n                <li>\n                  <button\n                    class=\"a-btn a-btn--icon-only\"\n                    #openModal\n                    (click)=\"delete(presentation.id)\"\n                    [disabled]=\"!presentation.owner\"\n                    *pryAccess=\"{ module: 'dashboard', page: 'manifest', action: 'delete' }\"\n                  >\n                    <pry-icon iconSvg=\"delete\" [pryTooltip]=\"erase\"></pry-icon>\n                    <span class=\"u-visually-hidden\">{{ '@pry.presentation.delete' | i18n }}</span>\n                  </button>\n                </li>\n              </ul>\n            </div>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"ViewMode.CREATION\">\n    <pry-add-edit-presentation\n      [selectedPresentation]=\"selectedPresentation$ | async\"\n      (goBack)=\"closeRestitution()\"\n      [editionStartUrl]=\"editionStartUrl\"\n      [edition]=\"false\"\n    ></pry-add-edit-presentation>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"ViewMode.EDITION\">\n    <pry-add-edit-presentation\n      [selectedPresentation]=\"selectedPresentation$ | async\"\n      (goBack)=\"closeRestitution()\"\n      [editionStartUrl]=\"editionStartUrl\"\n      [edition]=\"true\"\n    ></pry-add-edit-presentation>\n  </ng-container>\n</div>\n\n<ng-template #modal>\n  <div\n    class=\"o-modal\"\n    (click)=\"$event.stopPropagation()\"\n    #visibilityModal\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-labelledby=\"dialog change visibility\"\n    *ngIf=\"selectedPresentation$ | async as selectedPresentation\"\n  >\n    <div class=\"o-modal__top\">\n      <div class=\"o-modal__top__title\">\n        <h2 class=\"a-h2\" id=\"dialog_title\">{{ '@pry.toolbox.rename' | i18n }}</h2>\n      </div>\n      <div class=\"o-modal__top__close\">\n        <button\n          class=\"a-btn a-btn--icon-only\"\n          #crossVisibility\n          (keydown.shift.tab)=\"focusValidation()\"\n          (click)=\"toggleModal()\"\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    <pry-share [ngModel]=\"selectedPresentation.visibility\" (ngModelChange)=\"visibility = $event\"></pry-share>\n    <div class=\"m-btn-group\">\n      <button type=\"button\" class=\"a-btn a-btn--secondary\" (click)=\"toggleModal()\">\n        {{ '@pry.toolbox.manifest.close' | i18n }}\n      </button>\n      <button\n        type=\"submit\"\n        class=\"a-btn a-btn--primary\"\n        #submit\n        (keydown.tab)=\"focusCrossElement()\"\n        (click)=\"changeVisibility(selectedPresentation)\"\n      >\n        {{ '@pry.toolbox.manifest.check' | i18n }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #create>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.create' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #view>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.view' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #private>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.private' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #homeView>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.homeView' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #share>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.share' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #erase>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.erase' | i18n }}</span>\n  </div>\n</ng-template>\n\n<ng-template #change>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.change' | i18n }}</span>\n  </div>\n</ng-template>\n<ng-template #backToCatalog>\n  <div class=\"m-tooltip\" role=\"tooltip\">\n    <span class=\"m-tooltip__text\">{{ '@pry.presentation.backToCatalog' | i18n }}</span>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: i1.Store }, { type: i2$1.Overlay }, { type: i0.ViewContainerRef }, { type: i2.Router }, { type: i0.NgZone }]; }, propDecorators: { template: [{
                 type: ViewChild,
                 args: ['modal', { read: TemplateRef }]