@provoly/hypervisor 0.0.60 → 0.0.62

package/fesm2022/provoly-hypervisor.mjs

@@ -1,25 +1,26 @@
 import * as i0 from '@angular/core';
-import { Injectable, Pipe, Component, Input, EventEmitter, Output, TemplateRef, ViewChild, ContentChildren, Directive, forwardRef, signal, computed, InjectionToken, NgModule, Inject } from '@angular/core';
+import { Injectable, Pipe, Component, Input, EventEmitter, Output, model as model$1, TemplateRef, ViewChild, ContentChildren, Directive, forwardRef, signal, computed, InjectionToken, NgModule, Inject } from '@angular/core';
 import * as i3 from '@provoly/dashboard';
-import { DEFAULT_ICON_URL, SubscriptionnerDirective, PryI18nModule, PryCoreModule, PrySinceDateModule, PryIconModule, PrySelectModule, PryDatePickerModule } from '@provoly/dashboard';
+import { DEFAULT_ICON_URL, SubscriptionnerDirective, FilterParamEncoder, PryI18nModule, PryCoreModule, PrySinceDateModule, PryIconModule, PrySelectModule, PryDatePickerModule } from '@provoly/dashboard';
 import * as i1$1 from '@ngrx/store';
 import { createAction, props, createReducer, on, createFeatureSelector, createSelector, StoreModule } from '@ngrx/store';
 import * as i3$1 from '@angular/cdk/overlay';
 import { OverlayConfig } from '@angular/cdk/overlay';
 import { TemplatePortal } from '@angular/cdk/portal';
-import { mergeMap, of, fromEvent, catchError, withLatestFrom, filter, auditTime, combineLatest, map as map$1, BehaviorSubject, Subject, debounceTime, switchMap, distinctUntilChanged } from 'rxjs';
+import { mergeMap, of, fromEvent, catchError, withLatestFrom, filter, auditTime, combineLatest, map as map$1, distinctUntilChanged, BehaviorSubject, Subject, debounceTime as debounceTime$1, switchMap } from 'rxjs';
 import equal from 'fast-deep-equal/es6';
 import * as i1 from '@angular/common/http';
 import { HttpParams } from '@angular/common/http';
-import * as i4 from '@provoly/dashboard/components/checkbox';
-import { PryCheckboxModule } from '@provoly/dashboard/components/checkbox';
-import * as i4$1 from '@angular/forms';
+import * as i5 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import * as i1$2 from '@angular/common';
 import { NgForOf, AsyncPipe, NgStyle, DatePipe, KeyValuePipe, JsonPipe } from '@angular/common';
+import { v4 } from 'uuid';
+import * as i4 from '@provoly/dashboard/components/checkbox';
+import { PryCheckboxModule } from '@provoly/dashboard/components/checkbox';
 import * as i2 from '@angular/router';
 import { RouterLink } from '@angular/router';
-import { map, startWith, catchError as catchError$1, debounceTime as debounceTime$1, mergeMap as mergeMap$1 } from 'rxjs/operators';
+import { map, startWith, debounceTime, catchError as catchError$1, mergeMap as mergeMap$1 } from 'rxjs/operators';
 import * as i1$3 from '@ngrx/effects';
 import { createEffect, ofType, EffectsModule } from '@ngrx/effects';
 
@@ -67,6 +68,12 @@ const EventActions = {
     associateProcedureFailure: createAction('[Event] Associate Procedure to Event Failure', props())
 };
 
+const padId = {
+    fn: (id) => {
+        return `${id}`.padStart(6, '0');
+    }
+};
+
 const HypervisorActions = {
     setUrl: createAction('[Event] Set Backend Url', props())
 };
@@ -211,6 +218,89 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
                 type: Input
             }] } });
 
+const ACTIONS_TYPES = {
+    values: ['CSU', 'DOUTE', 'SMS', 'AUTRE', 'SERVICE', 'EMAIL']
+};
+class ProcedureActionsComponent extends SubscriptionnerDirective {
+    constructor() {
+        super(...arguments);
+        this.moveStart = 0;
+        this.moveInitialIndex = 0;
+        this.initialActionList = [];
+        this.previousOffset = 0;
+        this.actions = [];
+        this.tmpActions = [];
+        this.modified = new EventEmitter();
+        this.ACTIONS_TYPES = ACTIONS_TYPES.values;
+        this.model = model$1;
+    }
+    static { this.CARD_HEIGHT = 75; }
+    onMouseDown($event) {
+        this.dragTarget = $event.target;
+    }
+    dragStart($event, action, index) {
+        if (this.dragTarget && this.dragTarget.style.maskImage.indexOf('six_dot') > -1) {
+            this.movingAction = action;
+            this.moveStart = $event.clientY;
+            this.moveInitialIndex = index;
+            this.initialActionList = [...this.actions];
+        }
+        else {
+            $event.preventDefault();
+        }
+    }
+    move($event) {
+        $event.preventDefault();
+        if (this.movingAction) {
+            const offsetInCards = Math.round(($event.clientY - this.moveStart) / ProcedureActionsComponent.CARD_HEIGHT);
+            if (this.previousOffset !== offsetInCards) {
+                this.previousOffset = offsetInCards;
+                const newIndex = Math.min(Math.max(this.moveInitialIndex + offsetInCards, 0), this.initialActionList.length - 1);
+                const newActions = [...this.initialActionList];
+                const element = newActions.splice(this.moveInitialIndex, 1)[0];
+                newActions.splice(newIndex, 0, element);
+                this.modified.next(newActions);
+            }
+        }
+    }
+    drop($event) {
+        $event.preventDefault();
+        this.move($event);
+        this.movingAction = undefined;
+    }
+    allowDrop($event) {
+        $event.preventDefault();
+    }
+    toggleActionStatus(index, $event) {
+        $event.preventDefault();
+        const newActions = [...this.actions];
+        if (newActions[index].status !== 'DONE') {
+            newActions[index] = {
+                ...newActions[index],
+                status: newActions[index].status === 'NEW' ? 'IN_PREGRESS' : 'NEW'
+            };
+            this.modified.next(newActions);
+        }
+    }
+    add() {
+        this.tmpActions.push({ type: '', status: 'NEW', id: v4() });
+    }
+    updateNew(idx, prop, $event) {
+        // @ts-ignore
+        this.tmpActions[idx][prop] = $event;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureActionsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ProcedureActionsComponent, selector: "hvy-procedure-actions", inputs: { actions: "actions" }, outputs: { modified: "modified" }, usesInheritance: true, ngImport: i0, template: "<div\n  class=\"o-hvy-events-detail__procedure__actions\"\n  (drag)=\"move($event)\"\n  (drop)=\"drop($event)\"\n  (dragover)=\"allowDrop($event)\"\n>\n  @for (action of actions; track action.id; let idx = $index) {\n    <div\n      class=\"o-hvy-events-detail__procedure__actions__action\"\n      [draggable]=\"true\"\n      (dragstart)=\"dragStart($event, action, idx)\"\n      (mousedown)=\"onMouseDown($event)\"\n    >\n      <pry-icon iconSvg=\"six_dot\" #handle></pry-icon>\n      <pry-checkbox\n        [ngModel]=\"action.status !== 'NEW'\"\n        (click)=\"toggleActionStatus(idx, $event)\"\n        [disabled]=\"action.status === 'DONE'\"\n      ></pry-checkbox>\n      <div [class.-done]=\"action.status === 'DONE'\">{{ action.name }}</div>\n      <pry-icon iconSvg=\"more_horiz\"></pry-icon>\n    </div>\n  } @empty {\n    <div>\n      {{ '@hvy.event.log.procedure.noAction' | i18n }}\n    </div>\n  }\n  @for (action of tmpActions; track action.id; let idx = $index) {\n    <div class=\"o-hvy-events-detail__procedure__actions__action-tmp\">\n      <pry-select\n        [ngModel]=\"action.type\"\n        [items]=\"ACTIONS_TYPES\"\n        (ngModelChange)=\"updateNew(idx, 'type', $event)\"\n        i18nPrefix=\"@hvy.procedure.action.\"\n      ></pry-select>\n    </div>\n  }\n  <div class=\"o-hvy-events-detail__procedure__button\">\n    <button class=\"a-btn a-btn--primary\" (click)=\"add()\">\n      <pry-icon iconSvg=\"add\"></pry-icon>\n      {{ '@hvy.procedure.action.add' | i18n }}\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: i4.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureActionsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'hvy-procedure-actions', template: "<div\n  class=\"o-hvy-events-detail__procedure__actions\"\n  (drag)=\"move($event)\"\n  (drop)=\"drop($event)\"\n  (dragover)=\"allowDrop($event)\"\n>\n  @for (action of actions; track action.id; let idx = $index) {\n    <div\n      class=\"o-hvy-events-detail__procedure__actions__action\"\n      [draggable]=\"true\"\n      (dragstart)=\"dragStart($event, action, idx)\"\n      (mousedown)=\"onMouseDown($event)\"\n    >\n      <pry-icon iconSvg=\"six_dot\" #handle></pry-icon>\n      <pry-checkbox\n        [ngModel]=\"action.status !== 'NEW'\"\n        (click)=\"toggleActionStatus(idx, $event)\"\n        [disabled]=\"action.status === 'DONE'\"\n      ></pry-checkbox>\n      <div [class.-done]=\"action.status === 'DONE'\">{{ action.name }}</div>\n      <pry-icon iconSvg=\"more_horiz\"></pry-icon>\n    </div>\n  } @empty {\n    <div>\n      {{ '@hvy.event.log.procedure.noAction' | i18n }}\n    </div>\n  }\n  @for (action of tmpActions; track action.id; let idx = $index) {\n    <div class=\"o-hvy-events-detail__procedure__actions__action-tmp\">\n      <pry-select\n        [ngModel]=\"action.type\"\n        [items]=\"ACTIONS_TYPES\"\n        (ngModelChange)=\"updateNew(idx, 'type', $event)\"\n        i18nPrefix=\"@hvy.procedure.action.\"\n      ></pry-select>\n    </div>\n  }\n  <div class=\"o-hvy-events-detail__procedure__button\">\n    <button class=\"a-btn a-btn--primary\" (click)=\"add()\">\n      <pry-icon iconSvg=\"add\"></pry-icon>\n      {{ '@hvy.procedure.action.add' | i18n }}\n    </button>\n  </div>\n</div>\n" }]
+        }], propDecorators: { actions: [{
+                type: Input
+            }], modified: [{
+                type: Output
+            }] } });
+
 class ForDatetimeLocalPipe {
     constructor(store) {
         this.store = store;
@@ -229,7 +319,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
         }], ctorParameters: () => [{ type: i1$1.Store }] });
 
 class EventDetailComponent extends SubscriptionnerDirective {
-    static { this.CARD_HEIGHT = 75; }
     set events(events) {
         this._events = events.filter((ev) => !!ev);
         this.eventModifications = new Array(this._events.length);
@@ -270,16 +359,13 @@ class EventDetailComponent extends SubscriptionnerDirective {
         this.errors = [];
         this.canCloseSome = false;
         this.newComentContent = '';
-        this.moveStart = 0;
-        this.moveInitialIndex = 0;
-        this.initialActionList = [];
-        this.previousOffset = 0;
         this.changeStatusContext = {
             comment: '',
             events: [],
             status: 'DONE',
             all: false
         };
+        this.padId = padId;
     }
     get events() {
         return this._events.map((evt, idx) => ({ ...evt, ...(this.eventModifications[idx] ?? {}) }));
@@ -533,72 +619,28 @@ class EventDetailComponent extends SubscriptionnerDirective {
         }
         this.changeStatusContext.comment = '';
     }
-    onMouseDown($event) {
-        this.dragTarget = $event.target;
-    }
-    dragStart($event, action, index) {
-        if (this.dragTarget && this.dragTarget.style.maskImage.indexOf('six_dot') > -1) {
-            this.movingAction = action;
-            this.moveStart = $event.clientY;
-            this.moveInitialIndex = index;
-            this.initialActionList = [...this.procedure.actions];
-        }
-        else {
-            $event.preventDefault();
-        }
-    }
-    move($event) {
-        $event.preventDefault();
-        if (this.movingAction) {
-            const offsetInCards = Math.round(($event.clientY - this.moveStart) / EventDetailComponent.CARD_HEIGHT);
-            if (this.previousOffset !== offsetInCards) {
-                this.previousOffset = offsetInCards;
-                const newIndex = Math.min(Math.max(this.moveInitialIndex + offsetInCards, 0), this.initialActionList.length - 1);
-                const newActions = [...this.initialActionList];
-                const element = newActions.splice(this.moveInitialIndex, 1)[0];
-                newActions.splice(newIndex, 0, element);
-                if (equal(newActions, this._procedure.actions)) {
-                    delete this.procedureModifications.actions;
-                }
-                else {
-                    this.procedureModifications.actions = newActions;
-                }
-            }
-        }
-    }
-    drop($event) {
-        $event.preventDefault();
-        this.move($event);
-        this.movingAction = undefined;
-        this._outputModifications();
-    }
-    allowDrop($event) {
-        $event.preventDefault();
-    }
     confirmDisabled() {
         return this.changeStatusContext.comment.length === 0;
     }
-    toggleActionStatus(index, $event) {
-        $event.preventDefault();
-        const newActions = [...this.procedure.actions];
-        newActions[index] = {
-            ...newActions[index],
-            status: newActions[index].status === 'DONE' ? 'NEW' : 'DONE'
-        };
-        if (equal(newActions, this._procedure.actions)) {
+    get calculatedProgress() {
+        return Math.round((this.procedure.actions.filter((action) => action.status === 'DONE').length / this.procedure.actions.length) *
+            100);
+    }
+    modifiedActions($event) {
+        if (equal($event, this._procedure.actions)) {
             delete this.procedureModifications.actions;
         }
         else {
-            this.procedureModifications.actions = newActions;
+            this.procedureModifications.actions = $event;
         }
         this._outputModifications();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: EventDetailComponent, deps: [{ token: EquipmentService }, { token: i1$1.Store }, { token: i3$1.Overlay }, { token: i0.ViewContainerRef }, { token: i3.PrySnackbarService }, { token: i3.PryI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: EventDetailComponent, selector: "hvy-event-detail", inputs: { title: "title", events: "events", procedure: "procedure", cancelModifications: "cancelModifications", equipmentName: "equipmentName" }, outputs: { modifiedEvents: "modifiedEvents", modifiedProcedure: "modifiedProcedure", eventErrors: "eventErrors" }, viewQueries: [{ propertyName: "confirmDialog", first: true, predicate: ["confirmDialog"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-events-detail\">\n  <div class=\"o-hvy-events-detail__header\">\n    <div class=\"o-hvy-events-detail__header__split\">\n      <h1>{{ title ?? '@hvy.event.detail' | i18n }}</h1>\n      @if (events.length > 1) {\n        @if (canCloseSome) {\n          <button class=\"a-btn a-btn--secondary -fix-right\" [disabled]=\"!canCloseSome\" (click)=\"closeAll()\">\n            {{ (canCloseSome ? '@hvy.event.log.event.close' : '@hvy.event.log.event.closed') | i18n }}\n          </button>\n        }\n        @if (!canCloseSome) {\n          <div\n            class=\"a-tooltip\"\n            [attr.data-tooltip]=\"'... TODO: get closing comment ...'\"\n            data-tooltip-position=\"bottom\"\n          >\n            <pry-icon iconSvg=\"i\" [height]=\"18\" [width]=\"18\">i</pry-icon>\n          </div>\n        }\n      }\n    </div>\n    <div class=\"o-hvy-events-detail__header__split\">\n      @if (canCloseSome) {\n        <button class=\"a-btn a-btn--secondary\">{{ '@hvy.event.log.procedure.delete' | i18n }}</button>\n      }\n    </div>\n  </div>\n  <div class=\"o-hvy-events-detail__container\">\n    <div class=\"o-hvy-events-detail__container__scrollable\">\n      <div class=\"o-hvy-events-detail__events\">\n        @for (event of events; track event.id; let idx = $index) {\n          <div class=\"o-hvy-events-detail__events__event\">\n            <div class=\"o-hvy-events-detail__events__event__header\">\n              <pry-icon\n                iconSvg=\"arrow_down_rounded\"\n                [class.-rotated]=\"opened[idx]\"\n                (click)=\"toggle(idx)\"\n                [width]=\"10\"\n                [height]=\"10\"\n              ></pry-icon>\n              <hvy-icon-display [event]=\"event\"></hvy-icon-display>\n              <h2>{{ event.name }}</h2>\n              <hvy-status-display\n                [item]=\"event\"\n                [modifiable]=\"event.status !== 'DONE'\"\n                (modified)=\"changeStatus($event, event)\"\n              ></hvy-status-display>\n            </div>\n            <div class=\"o-hvy-events-detail__events__event__content\">\n              @if (!opened[idx]) {\n                <div>{{ '@hvy.event.log.event.description' | i18n }} : {{ event.description }}</div>\n                <div>{{ '@hvy.event.log.event.address' | i18n }} : {{ event.address }}</div>\n              } @else {\n                @if (access(event); as accessValue) {\n                  <div class=\"o-hvy-events-detail__events__event__content__header\">\n                    <h3>{{ '@hvy.event.log.event.detail' | i18n }}</h3>\n                    <span class=\"required\">{{ '@hvy.event.log.event.mandatory' | i18n }}</span>\n                  </div>\n                  <table>\n                    <tbody>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.name' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('name', idx)\"\n                            [value]=\"event.name\"\n                            (change)=\"modifyEvent(idx, 'name', $event)\"\n                            [readonly]=\"accessValue.name\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.category' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <pry-select\n                            [ngModel]=\"event.category\"\n                            [items]=\"categories(event)\"\n                            [class.-error]=\"hasError('category', idx)\"\n                            (ngModelChange)=\"modifyEvent(idx, 'category', $event)\"\n                            i18nPrefix=\"@hvy.event.category.\"\n                            [disabled]=\"accessValue.category\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.criticality.name' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <pry-select\n                            [ngModel]=\"event.criticality\"\n                            [items]=\"criticalities\"\n                            [class.-error]=\"hasError('criticality', idx)\"\n                            i18nPrefix=\"@hvy.event.criticality.\"\n                            [disabled]=\"accessValue.criticality\"\n                            (ngModelChange)=\"modifyEvent(idx, 'criticality', $event)\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.description' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <textarea\n                            [ngModel]=\"event.description\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('description', idx)\"\n                            [readonly]=\"accessValue.description\"\n                            (ngModelChange)=\"modifyEvent(idx, 'description', $event)\"\n                          ></textarea>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.address' | i18n }} :</td>\n                        <td>\n                          <textarea\n                            [ngModel]=\"event.address\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('address', idx)\"\n                            [readonly]=\"accessValue.address\"\n                            (ngModelChange)=\"modifyEvent(idx, 'address', $event)\"\n                          ></textarea>\n                        </td>\n                      </tr>\n                      @if (['ALERT', 'REPORT'].includes(event.type)) {\n                        <tr>\n                          <td>{{ '@hvy.event.source' | i18n }} :</td>\n                          <td>\n                            <input\n                              type=\"text\"\n                              class=\"a-form-field\"\n                              [value]=\"event.externalSourceRef ?? ''\"\n                              [class.-error]=\"hasError('source', idx)\"\n                              [readonly]=\"accessValue.source\"\n                              (change)=\"modifyEvent(idx, 'source', $event)\"\n                            />\n                          </td>\n                        </tr>\n                      }\n                      <tr>\n                        <td>{{ '@hvy.event.equipment' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [value]=\"event.equipment?.name ?? ''\"\n                            [class.-error]=\"hasError('equipment', idx)\"\n                            [readonly]=\"accessValue.eqName\"\n                            (change)=\"changeEquipment(idx, $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.equipmentEntity' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('equipment', idx)\"\n                            [value]=\"event.equipment?.entity ?? ''\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.domain.name' | i18n }} :</td>\n                        <td>\n                          <pry-select\n                            [items]=\"DOMAINS\"\n                            [ngModel]=\"event.domain\"\n                            i18nPrefix=\"@hvy.event.domain.\"\n                            [class.-error]=\"hasError('domain', idx)\"\n                            (ngModelChange)=\"modifyEvent(idx, 'domain', $event)\"\n                            [disabled]=\"accessValue.domain\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>\n                          {{ '@hvy.event.startDate' | i18n }}\n                          @if (event.category === 'MANIFESTATION') {\n                            <span class=\"required\">*</span>\n                          }\n                          :\n                        </td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.startDate | forDateTimeLocal\"\n                            [class.-error]=\"hasError('startDate', idx)\"\n                            [readonly]=\"accessValue.startDate\"\n                            (change)=\"modifyEvent(idx, 'startDate', $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>\n                          {{ '@hvy.event.endDate' | i18n }}\n                          @if (event.category === 'MANIFESTATION') {\n                            <span class=\"required\">*</span>\n                          }\n                          :\n                        </td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.endDate | forDateTimeLocal\"\n                            [class.-error]=\"hasError('endDate', idx)\"\n                            [readonly]=\"accessValue.endDate\"\n                            (change)=\"modifyEvent(idx, 'endDate', $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.creationDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.creationDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.lastModificationDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.lastModificationDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.closeDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.closeDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                    </tbody>\n                  </table>\n                  <div class=\"o-hvy-events-detail__events__event__content__comments\">\n                    <h3>{{ '@hvy.event.log.event.comments.name' | i18n }} :</h3>\n                    <textarea\n                      [placeholder]=\"('@hvy.event.log.event.comments.placeholder' | i18n) + '...'\"\n                      [(ngModel)]=\"newComentContent\"\n                    ></textarea>\n                    <div class=\"o-hvy-events-detail__events__event__content__comments__button\">\n                      <button class=\"a-btn a-btn--primary\" [disabled]=\"newComentContent.length === 0\">\n                        {{ '@hvy.action.comment' | i18n }}\n                      </button>\n                    </div>\n                  </div>\n                }\n              }\n            </div>\n          </div>\n        }\n      </div>\n      <div class=\"o-hvy-events-detail__procedure\">\n        <div class=\"o-hvy-events-detail__procedure__header\">\n          <h2>\n            {{ (events.length === 1 ? '@hvy.event.log.procedure.name1' : '@hvy.event.log.procedure.name') | i18n }}\n          </h2>\n        </div>\n        @if (procedure) {\n          <div class=\"o-hvy-events-detail__procedure__description\">\n            <p>{{ procedure.description }}</p>\n          </div>\n          <div class=\"o-hvy-events-detail__procedure__progress\">\n            <p>{{ '@hvy.event.log.procedure.progress' | i18n }}</p>\n            <hvy-progress-display [progress]=\"procedure.progress\"></hvy-progress-display>\n          </div>\n          <div\n            class=\"o-hvy-events-detail__procedure__actions\"\n            (drag)=\"move($event)\"\n            (drop)=\"drop($event)\"\n            (dragover)=\"allowDrop($event)\"\n          >\n            @for (action of procedure.actions; track action.id; let idx = $index) {\n              <div\n                class=\"o-hvy-events-detail__procedure__actions__action\"\n                [draggable]=\"true\"\n                (dragstart)=\"dragStart($event, action, idx)\"\n                (mousedown)=\"onMouseDown($event)\"\n              >\n                <pry-icon iconSvg=\"six_dot\" #handle></pry-icon>\n                <pry-checkbox\n                  [ngModel]=\"action.status === 'DONE'\"\n                  (click)=\"toggleActionStatus(idx, $event)\"\n                ></pry-checkbox>\n                <div>{{ action.name }}</div>\n                <pry-icon iconSvg=\"more_horiz\"></pry-icon>\n              </div>\n            } @empty {\n              <div>\n                {{ '@hvy.event.log.procedure.noAction' | i18n }}\n              </div>\n            }\n          </div>\n          <div class=\"o-hvy-events-detail__procedure__button\">\n            <button class=\"a-btn a-btn--primary\">\n              <pry-icon iconSvg=\"add\"></pry-icon>\n              {{ '@hvy.event.log.procedure.addAction' | i18n }}\n            </button>\n          </div>\n        } @else {\n          <button class=\"a-btn a-btn--secondary\" [disabled]=\"!canAssociateProcedure\">\n            {{ '@hvy.action.associate' | i18n }}\n          </button>\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #confirmDialog>\n  <div\n    class=\"o-hvy-close-confirm__dialog\"\n    aria-labelledby=\"confirm\"\n    tabindex=\"-1\"\n    id=\"choice\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n  >\n    <h2>\n      {{\n        (changeStatusContext.events.length === 1 ? '@hvy.event.close.oneTitle' : '@hvy.event.close.multiTitle') | i18n\n      }}\n    </h2>\n    <p>{{ (changeStatusContext.events.length === 1 ? '@hvy.event.close.one' : '@hvy.event.close.multi') | i18n }}</p>\n    <ul>\n      @for (event of changeStatusContext.events; track event.id) {\n        <li>{{ event.name }}</li>\n      }\n    </ul>\n    <p class=\"o-hvy-close-confirm__dialog__comment-title\">\n      {{ '@hvy.event.close.comment' | i18n }}<span class=\"required\">*</span> :\n    </p>\n    <div class=\"o-hvy-close-confirm__dialog__comment\">\n      <textarea [(ngModel)]=\"changeStatusContext.comment\" class=\"a-form-field\" [maxLength]=\"255\"></textarea>\n    </div>\n    <div class=\"o-hvy-close-confirm__dialog__actions\">\n      <button class=\"a-btn a-btn--primary\" (click)=\"confirmedClose()\" [disabled]=\"confirmDisabled()\">\n        {{ '@hvy.action.validate' | i18n }}\n      </button>\n      <button class=\"a-btn a-btn--secondary\" (click)=\"toggleConfirm()\">{{ '@hvy.action.cancel' | i18n }}</button>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i4.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "component", type: IconDisplayComponent, selector: "hvy-icon-display", inputs: ["event"] }, { kind: "component", type: StatusDisplayComponent, selector: "hvy-status-display", inputs: ["item", "modifiable"], outputs: ["modified"] }, { kind: "component", type: ProgressDisplayComponent, selector: "hvy-progress-display", inputs: ["progress"] }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }, { kind: "pipe", type: ForDatetimeLocalPipe, name: "forDateTimeLocal" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: EventDetailComponent, selector: "hvy-event-detail", inputs: { title: "title", events: "events", procedure: "procedure", cancelModifications: "cancelModifications", equipmentName: "equipmentName" }, outputs: { modifiedEvents: "modifiedEvents", modifiedProcedure: "modifiedProcedure", eventErrors: "eventErrors" }, viewQueries: [{ propertyName: "confirmDialog", first: true, predicate: ["confirmDialog"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-events-detail\">\n  <div class=\"o-hvy-events-detail__header\">\n    <div class=\"o-hvy-events-detail__header__split\">\n      <h1>{{ title ?? '@hvy.event.detail' | i18n }}</h1>\n      @if (events.length > 1) {\n        @if (canCloseSome) {\n          <button class=\"a-btn a-btn--secondary -fix-right\" [disabled]=\"!canCloseSome\" (click)=\"closeAll()\">\n            {{ (canCloseSome ? '@hvy.event.log.event.close' : '@hvy.event.log.event.closed') | i18n }}\n          </button>\n        }\n        @if (!canCloseSome) {\n          <div\n            class=\"a-tooltip\"\n            [attr.data-tooltip]=\"'... TODO: get closing comment ...'\"\n            data-tooltip-position=\"bottom\"\n          >\n            <pry-icon iconSvg=\"i\" [height]=\"18\" [width]=\"18\">i</pry-icon>\n          </div>\n        }\n      }\n    </div>\n    <div class=\"o-hvy-events-detail__header__split\">\n      @if (canCloseSome) {\n        <button class=\"a-btn a-btn--secondary\">{{ '@hvy.event.log.procedure.delete' | i18n }}</button>\n      }\n    </div>\n  </div>\n  <div class=\"o-hvy-events-detail__container\">\n    <div class=\"o-hvy-events-detail__container__scrollable\">\n      <div class=\"o-hvy-events-detail__events\">\n        @for (event of events; track event.id; let idx = $index) {\n          <div class=\"o-hvy-events-detail__events__event\">\n            <div class=\"o-hvy-events-detail__events__event__header\">\n              <pry-icon\n                iconSvg=\"arrow_down_rounded\"\n                [class.-rotated]=\"opened[idx]\"\n                (click)=\"toggle(idx)\"\n                [width]=\"10\"\n                [height]=\"10\"\n              ></pry-icon>\n              <hvy-icon-display [event]=\"event\"></hvy-icon-display>\n              <h2>{{ event.name }}</h2>\n              <hvy-status-display\n                [item]=\"event\"\n                [modifiable]=\"event.status !== 'DONE'\"\n                (modified)=\"changeStatus($event, event)\"\n              ></hvy-status-display>\n            </div>\n            <div class=\"o-hvy-events-detail__events__event__content\">\n              @if (!opened[idx]) {\n                <div>{{ '@hvy.event.log.event.description' | i18n }} : {{ event.description }}</div>\n                <div>{{ '@hvy.event.log.event.address' | i18n }} : {{ event.address }}</div>\n              } @else {\n                @if (access(event); as accessValue) {\n                  <div class=\"o-hvy-events-detail__events__event__content__header\">\n                    <h3>{{ '@hvy.event.log.event.detail' | i18n }}</h3>\n                    <span class=\"required\">{{ '@hvy.event.log.event.mandatory' | i18n }}</span>\n                  </div>\n                  <table>\n                    <tbody>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.name' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('name', idx)\"\n                            [value]=\"event.name\"\n                            (change)=\"modifyEvent(idx, 'name', $event)\"\n                            [readonly]=\"accessValue.name\"\n                          />\n                        </td>\n                      </tr>\n                      @if (event.id > 0) {\n                        <tr>\n                          <td>{{ '@hvy.event.log.event.id' | i18n }}<span class=\"required\">*</span> :</td>\n                          <td>\n                            <input type=\"text\" class=\"a-form-field\" [value]=\"padId.fn(event.id)\" [readonly]=\"true\" />\n                          </td>\n                        </tr>\n                      }\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.category' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <pry-select\n                            [ngModel]=\"event.category\"\n                            [items]=\"categories(event)\"\n                            [class.-error]=\"hasError('category', idx)\"\n                            (ngModelChange)=\"modifyEvent(idx, 'category', $event)\"\n                            i18nPrefix=\"@hvy.event.category.\"\n                            [disabled]=\"accessValue.category\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.criticality.name' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <pry-select\n                            [ngModel]=\"event.criticality\"\n                            [items]=\"criticalities\"\n                            [class.-error]=\"hasError('criticality', idx)\"\n                            i18nPrefix=\"@hvy.event.criticality.\"\n                            [disabled]=\"accessValue.criticality\"\n                            (ngModelChange)=\"modifyEvent(idx, 'criticality', $event)\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.description' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <textarea\n                            [ngModel]=\"event.description\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('description', idx)\"\n                            [readonly]=\"accessValue.description\"\n                            (ngModelChange)=\"modifyEvent(idx, 'description', $event)\"\n                          ></textarea>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.address' | i18n }} :</td>\n                        <td>\n                          <textarea\n                            [ngModel]=\"event.address\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('address', idx)\"\n                            [readonly]=\"accessValue.address\"\n                            (ngModelChange)=\"modifyEvent(idx, 'address', $event)\"\n                          ></textarea>\n                        </td>\n                      </tr>\n                      @if (['ALERT', 'REPORT'].includes(event.type)) {\n                        <tr>\n                          <td>{{ '@hvy.event.source' | i18n }} :</td>\n                          <td>\n                            <input\n                              type=\"text\"\n                              class=\"a-form-field\"\n                              [value]=\"event.externalSourceRef ?? ''\"\n                              [class.-error]=\"hasError('source', idx)\"\n                              [readonly]=\"accessValue.source\"\n                              (change)=\"modifyEvent(idx, 'source', $event)\"\n                            />\n                          </td>\n                        </tr>\n                      }\n                      <tr>\n                        <td>{{ '@hvy.event.equipment' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [value]=\"event.equipment?.name ?? ''\"\n                            [class.-error]=\"hasError('equipment', idx)\"\n                            [readonly]=\"accessValue.eqName\"\n                            (change)=\"changeEquipment(idx, $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.equipmentEntity' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('equipment', idx)\"\n                            [value]=\"event.equipment?.entity ?? ''\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.domain.name' | i18n }} :</td>\n                        <td>\n                          <pry-select\n                            [items]=\"DOMAINS\"\n                            [ngModel]=\"event.domain\"\n                            i18nPrefix=\"@hvy.event.domain.\"\n                            [class.-error]=\"hasError('domain', idx)\"\n                            (ngModelChange)=\"modifyEvent(idx, 'domain', $event)\"\n                            [disabled]=\"accessValue.domain\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>\n                          {{ '@hvy.event.startDate' | i18n }}\n                          @if (event.category === 'MANIFESTATION') {\n                            <span class=\"required\">*</span>\n                          }\n                          :\n                        </td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.startDate | forDateTimeLocal\"\n                            [class.-error]=\"hasError('startDate', idx)\"\n                            [readonly]=\"accessValue.startDate\"\n                            (change)=\"modifyEvent(idx, 'startDate', $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>\n                          {{ '@hvy.event.endDate' | i18n }}\n                          @if (event.category === 'MANIFESTATION') {\n                            <span class=\"required\">*</span>\n                          }\n                          :\n                        </td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.endDate | forDateTimeLocal\"\n                            [class.-error]=\"hasError('endDate', idx)\"\n                            [readonly]=\"accessValue.endDate\"\n                            (change)=\"modifyEvent(idx, 'endDate', $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.creationDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.creationDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.lastModificationDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.lastModificationDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.closeDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.closeDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                    </tbody>\n                  </table>\n                  <div class=\"o-hvy-events-detail__events__event__content__comments\">\n                    <h3>{{ '@hvy.event.log.event.comments.name' | i18n }} :</h3>\n                    <textarea\n                      [placeholder]=\"('@hvy.event.log.event.comments.placeholder' | i18n) + '...'\"\n                      [(ngModel)]=\"newComentContent\"\n                    ></textarea>\n                    <div class=\"o-hvy-events-detail__events__event__content__comments__button\">\n                      <button class=\"a-btn a-btn--primary\" [disabled]=\"newComentContent.length === 0\">\n                        {{ '@hvy.action.comment' | i18n }}\n                      </button>\n                    </div>\n                  </div>\n                }\n              }\n            </div>\n          </div>\n        }\n      </div>\n      <div class=\"o-hvy-events-detail__procedure\">\n        <div class=\"o-hvy-events-detail__procedure__header\">\n          <h2>\n            {{ (events.length === 1 ? '@hvy.event.log.procedure.name1' : '@hvy.event.log.procedure.name') | i18n }}\n          </h2>\n        </div>\n        @if (procedure) {\n          <div class=\"o-hvy-events-detail__procedure__description\">\n            <p>{{ procedure.description }}</p>\n          </div>\n          <div class=\"o-hvy-events-detail__procedure__progress\">\n            <p>{{ '@hvy.event.log.procedure.progress' | i18n }}</p>\n            <hvy-progress-display [progress]=\"calculatedProgress\"></hvy-progress-display>\n          </div>\n          <hvy-procedure-actions\n            [actions]=\"procedure.actions\"\n            (modified)=\"modifiedActions($event)\"\n          ></hvy-procedure-actions>\n        } @else {\n          <button class=\"a-btn a-btn--secondary\" [disabled]=\"!canAssociateProcedure\">\n            {{ '@hvy.action.associate' | i18n }}\n          </button>\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #confirmDialog>\n  <div\n    class=\"o-hvy-close-confirm__dialog\"\n    aria-labelledby=\"confirm\"\n    tabindex=\"-1\"\n    id=\"choice\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n  >\n    <h2>\n      {{\n        (changeStatusContext.events.length === 1 ? '@hvy.event.close.oneTitle' : '@hvy.event.close.multiTitle') | i18n\n      }}\n    </h2>\n    <p>{{ (changeStatusContext.events.length === 1 ? '@hvy.event.close.one' : '@hvy.event.close.multi') | i18n }}</p>\n    <ul>\n      @for (event of changeStatusContext.events; track event.id) {\n        <li>{{ event.name }}</li>\n      }\n    </ul>\n    <p class=\"o-hvy-close-confirm__dialog__comment-title\">\n      {{ '@hvy.event.close.comment' | i18n }}<span class=\"required\">*</span> :\n    </p>\n    <div class=\"o-hvy-close-confirm__dialog__comment\">\n      <textarea [(ngModel)]=\"changeStatusContext.comment\" class=\"a-form-field\" [maxLength]=\"255\"></textarea>\n    </div>\n    <div class=\"o-hvy-close-confirm__dialog__actions\">\n      <button class=\"a-btn a-btn--primary\" (click)=\"confirmedClose()\" [disabled]=\"confirmDisabled()\">\n        {{ '@hvy.action.validate' | i18n }}\n      </button>\n      <button class=\"a-btn a-btn--secondary\" (click)=\"toggleConfirm()\">{{ '@hvy.action.cancel' | i18n }}</button>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "component", type: IconDisplayComponent, selector: "hvy-icon-display", inputs: ["event"] }, { kind: "component", type: StatusDisplayComponent, selector: "hvy-status-display", inputs: ["item", "modifiable"], outputs: ["modified"] }, { kind: "component", type: ProgressDisplayComponent, selector: "hvy-progress-display", inputs: ["progress"] }, { kind: "component", type: ProcedureActionsComponent, selector: "hvy-procedure-actions", inputs: ["actions"], outputs: ["modified"] }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }, { kind: "pipe", type: ForDatetimeLocalPipe, name: "forDateTimeLocal" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: EventDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'hvy-event-detail', template: "<div class=\"o-hvy-events-detail\">\n  <div class=\"o-hvy-events-detail__header\">\n    <div class=\"o-hvy-events-detail__header__split\">\n      <h1>{{ title ?? '@hvy.event.detail' | i18n }}</h1>\n      @if (events.length > 1) {\n        @if (canCloseSome) {\n          <button class=\"a-btn a-btn--secondary -fix-right\" [disabled]=\"!canCloseSome\" (click)=\"closeAll()\">\n            {{ (canCloseSome ? '@hvy.event.log.event.close' : '@hvy.event.log.event.closed') | i18n }}\n          </button>\n        }\n        @if (!canCloseSome) {\n          <div\n            class=\"a-tooltip\"\n            [attr.data-tooltip]=\"'... TODO: get closing comment ...'\"\n            data-tooltip-position=\"bottom\"\n          >\n            <pry-icon iconSvg=\"i\" [height]=\"18\" [width]=\"18\">i</pry-icon>\n          </div>\n        }\n      }\n    </div>\n    <div class=\"o-hvy-events-detail__header__split\">\n      @if (canCloseSome) {\n        <button class=\"a-btn a-btn--secondary\">{{ '@hvy.event.log.procedure.delete' | i18n }}</button>\n      }\n    </div>\n  </div>\n  <div class=\"o-hvy-events-detail__container\">\n    <div class=\"o-hvy-events-detail__container__scrollable\">\n      <div class=\"o-hvy-events-detail__events\">\n        @for (event of events; track event.id; let idx = $index) {\n          <div class=\"o-hvy-events-detail__events__event\">\n            <div class=\"o-hvy-events-detail__events__event__header\">\n              <pry-icon\n                iconSvg=\"arrow_down_rounded\"\n                [class.-rotated]=\"opened[idx]\"\n                (click)=\"toggle(idx)\"\n                [width]=\"10\"\n                [height]=\"10\"\n              ></pry-icon>\n              <hvy-icon-display [event]=\"event\"></hvy-icon-display>\n              <h2>{{ event.name }}</h2>\n              <hvy-status-display\n                [item]=\"event\"\n                [modifiable]=\"event.status !== 'DONE'\"\n                (modified)=\"changeStatus($event, event)\"\n              ></hvy-status-display>\n            </div>\n            <div class=\"o-hvy-events-detail__events__event__content\">\n              @if (!opened[idx]) {\n                <div>{{ '@hvy.event.log.event.description' | i18n }} : {{ event.description }}</div>\n                <div>{{ '@hvy.event.log.event.address' | i18n }} : {{ event.address }}</div>\n              } @else {\n                @if (access(event); as accessValue) {\n                  <div class=\"o-hvy-events-detail__events__event__content__header\">\n                    <h3>{{ '@hvy.event.log.event.detail' | i18n }}</h3>\n                    <span class=\"required\">{{ '@hvy.event.log.event.mandatory' | i18n }}</span>\n                  </div>\n                  <table>\n                    <tbody>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.name' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('name', idx)\"\n                            [value]=\"event.name\"\n                            (change)=\"modifyEvent(idx, 'name', $event)\"\n                            [readonly]=\"accessValue.name\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.category' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <pry-select\n                            [ngModel]=\"event.category\"\n                            [items]=\"categories(event)\"\n                            [class.-error]=\"hasError('category', idx)\"\n                            (ngModelChange)=\"modifyEvent(idx, 'category', $event)\"\n                            i18nPrefix=\"@hvy.event.category.\"\n                            [disabled]=\"accessValue.category\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.criticality.name' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <pry-select\n                            [ngModel]=\"event.criticality\"\n                            [items]=\"criticalities\"\n                            [class.-error]=\"hasError('criticality', idx)\"\n                            i18nPrefix=\"@hvy.event.criticality.\"\n                            [disabled]=\"accessValue.criticality\"\n                            (ngModelChange)=\"modifyEvent(idx, 'criticality', $event)\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.description' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <textarea\n                            [ngModel]=\"event.description\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('description', idx)\"\n                            [readonly]=\"accessValue.description\"\n                            (ngModelChange)=\"modifyEvent(idx, 'description', $event)\"\n                          ></textarea>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.address' | i18n }} :</td>\n                        <td>\n                          <textarea\n                            [ngModel]=\"event.address\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('address', idx)\"\n                            [readonly]=\"accessValue.address\"\n                            (ngModelChange)=\"modifyEvent(idx, 'address', $event)\"\n                          ></textarea>\n                        </td>\n                      </tr>\n                      @if (['ALERT', 'REPORT'].includes(event.type)) {\n                        <tr>\n                          <td>{{ '@hvy.event.source' | i18n }} :</td>\n                          <td>\n                            <input\n                              type=\"text\"\n                              class=\"a-form-field\"\n                              [value]=\"event.externalSourceRef ?? ''\"\n                              [class.-error]=\"hasError('source', idx)\"\n                              [readonly]=\"accessValue.source\"\n                              (change)=\"modifyEvent(idx, 'source', $event)\"\n                            />\n                          </td>\n                        </tr>\n                      }\n                      <tr>\n                        <td>{{ '@hvy.event.equipment' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [value]=\"event.equipment?.name ?? ''\"\n                            [class.-error]=\"hasError('equipment', idx)\"\n                            [readonly]=\"accessValue.eqName\"\n                            (change)=\"changeEquipment(idx, $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.equipmentEntity' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('equipment', idx)\"\n                            [value]=\"event.equipment?.entity ?? ''\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.domain.name' | i18n }} :</td>\n                        <td>\n                          <pry-select\n                            [items]=\"DOMAINS\"\n                            [ngModel]=\"event.domain\"\n                            i18nPrefix=\"@hvy.event.domain.\"\n                            [class.-error]=\"hasError('domain', idx)\"\n                            (ngModelChange)=\"modifyEvent(idx, 'domain', $event)\"\n                            [disabled]=\"accessValue.domain\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>\n                          {{ '@hvy.event.startDate' | i18n }}\n                          @if (event.category === 'MANIFESTATION') {\n                            <span class=\"required\">*</span>\n                          }\n                          :\n                        </td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.startDate | forDateTimeLocal\"\n                            [class.-error]=\"hasError('startDate', idx)\"\n                            [readonly]=\"accessValue.startDate\"\n                            (change)=\"modifyEvent(idx, 'startDate', $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>\n                          {{ '@hvy.event.endDate' | i18n }}\n                          @if (event.category === 'MANIFESTATION') {\n                            <span class=\"required\">*</span>\n                          }\n                          :\n                        </td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.endDate | forDateTimeLocal\"\n                            [class.-error]=\"hasError('endDate', idx)\"\n                            [readonly]=\"accessValue.endDate\"\n                            (change)=\"modifyEvent(idx, 'endDate', $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.creationDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.creationDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.lastModificationDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.lastModificationDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.closeDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.closeDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                    </tbody>\n                  </table>\n                  <div class=\"o-hvy-events-detail__events__event__content__comments\">\n                    <h3>{{ '@hvy.event.log.event.comments.name' | i18n }} :</h3>\n                    <textarea\n                      [placeholder]=\"('@hvy.event.log.event.comments.placeholder' | i18n) + '...'\"\n                      [(ngModel)]=\"newComentContent\"\n                    ></textarea>\n                    <div class=\"o-hvy-events-detail__events__event__content__comments__button\">\n                      <button class=\"a-btn a-btn--primary\" [disabled]=\"newComentContent.length === 0\">\n                        {{ '@hvy.action.comment' | i18n }}\n                      </button>\n                    </div>\n                  </div>\n                }\n              }\n            </div>\n          </div>\n        }\n      </div>\n      <div class=\"o-hvy-events-detail__procedure\">\n        <div class=\"o-hvy-events-detail__procedure__header\">\n          <h2>\n            {{ (events.length === 1 ? '@hvy.event.log.procedure.name1' : '@hvy.event.log.procedure.name') | i18n }}\n          </h2>\n        </div>\n        @if (procedure) {\n          <div class=\"o-hvy-events-detail__procedure__description\">\n            <p>{{ procedure.description }}</p>\n          </div>\n          <div class=\"o-hvy-events-detail__procedure__progress\">\n            <p>{{ '@hvy.event.log.procedure.progress' | i18n }}</p>\n            <hvy-progress-display [progress]=\"procedure.progress\"></hvy-progress-display>\n          </div>\n          <div\n            class=\"o-hvy-events-detail__procedure__actions\"\n            (drag)=\"move($event)\"\n            (drop)=\"drop($event)\"\n            (dragover)=\"allowDrop($event)\"\n          >\n            @for (action of procedure.actions; track action.id; let idx = $index) {\n              <div\n                class=\"o-hvy-events-detail__procedure__actions__action\"\n                [draggable]=\"true\"\n                (dragstart)=\"dragStart($event, action, idx)\"\n                (mousedown)=\"onMouseDown($event)\"\n              >\n                <pry-icon iconSvg=\"six_dot\" #handle></pry-icon>\n                <pry-checkbox\n                  [ngModel]=\"action.status === 'DONE'\"\n                  (click)=\"toggleActionStatus(idx, $event)\"\n                ></pry-checkbox>\n                <div>{{ action.name }}</div>\n                <pry-icon iconSvg=\"more_horiz\"></pry-icon>\n              </div>\n            } @empty {\n              <div>\n                {{ '@hvy.event.log.procedure.noAction' | i18n }}\n              </div>\n            }\n          </div>\n          <div class=\"o-hvy-events-detail__procedure__button\">\n            <button class=\"a-btn a-btn--primary\">\n              <pry-icon iconSvg=\"add\"></pry-icon>\n              {{ '@hvy.event.log.procedure.addAction' | i18n }}\n            </button>\n          </div>\n        } @else {\n          <button class=\"a-btn a-btn--secondary\" [disabled]=\"!canAssociateProcedure\">\n            {{ '@hvy.action.associate' | i18n }}\n          </button>\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #confirmDialog>\n  <div\n    class=\"o-hvy-close-confirm__dialog\"\n    aria-labelledby=\"confirm\"\n    tabindex=\"-1\"\n    id=\"choice\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n  >\n    <h2>\n      {{\n        (changeStatusContext.events.length === 1 ? '@hvy.event.close.oneTitle' : '@hvy.event.close.multiTitle') | i18n\n      }}\n    </h2>\n    <p>{{ (changeStatusContext.events.length === 1 ? '@hvy.event.close.one' : '@hvy.event.close.multi') | i18n }}</p>\n    <ul>\n      @for (event of changeStatusContext.events; track event.id) {\n        <li>{{ event.name }}</li>\n      }\n    </ul>\n    <p class=\"o-hvy-close-confirm__dialog__comment-title\">\n      {{ '@hvy.event.close.comment' | i18n }}<span class=\"required\">*</span> :\n    </p>\n    <div class=\"o-hvy-close-confirm__dialog__comment\">\n      <textarea [(ngModel)]=\"changeStatusContext.comment\" class=\"a-form-field\" [maxLength]=\"255\"></textarea>\n    </div>\n    <div class=\"o-hvy-close-confirm__dialog__actions\">\n      <button class=\"a-btn a-btn--primary\" (click)=\"confirmedClose()\" [disabled]=\"confirmDisabled()\">\n        {{ '@hvy.action.validate' | i18n }}\n      </button>\n      <button class=\"a-btn a-btn--secondary\" (click)=\"toggleConfirm()\">{{ '@hvy.action.cancel' | i18n }}</button>\n    </div>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'hvy-event-detail', template: "<div class=\"o-hvy-events-detail\">\n  <div class=\"o-hvy-events-detail__header\">\n    <div class=\"o-hvy-events-detail__header__split\">\n      <h1>{{ title ?? '@hvy.event.detail' | i18n }}</h1>\n      @if (events.length > 1) {\n        @if (canCloseSome) {\n          <button class=\"a-btn a-btn--secondary -fix-right\" [disabled]=\"!canCloseSome\" (click)=\"closeAll()\">\n            {{ (canCloseSome ? '@hvy.event.log.event.close' : '@hvy.event.log.event.closed') | i18n }}\n          </button>\n        }\n        @if (!canCloseSome) {\n          <div\n            class=\"a-tooltip\"\n            [attr.data-tooltip]=\"'... TODO: get closing comment ...'\"\n            data-tooltip-position=\"bottom\"\n          >\n            <pry-icon iconSvg=\"i\" [height]=\"18\" [width]=\"18\">i</pry-icon>\n          </div>\n        }\n      }\n    </div>\n    <div class=\"o-hvy-events-detail__header__split\">\n      @if (canCloseSome) {\n        <button class=\"a-btn a-btn--secondary\">{{ '@hvy.event.log.procedure.delete' | i18n }}</button>\n      }\n    </div>\n  </div>\n  <div class=\"o-hvy-events-detail__container\">\n    <div class=\"o-hvy-events-detail__container__scrollable\">\n      <div class=\"o-hvy-events-detail__events\">\n        @for (event of events; track event.id; let idx = $index) {\n          <div class=\"o-hvy-events-detail__events__event\">\n            <div class=\"o-hvy-events-detail__events__event__header\">\n              <pry-icon\n                iconSvg=\"arrow_down_rounded\"\n                [class.-rotated]=\"opened[idx]\"\n                (click)=\"toggle(idx)\"\n                [width]=\"10\"\n                [height]=\"10\"\n              ></pry-icon>\n              <hvy-icon-display [event]=\"event\"></hvy-icon-display>\n              <h2>{{ event.name }}</h2>\n              <hvy-status-display\n                [item]=\"event\"\n                [modifiable]=\"event.status !== 'DONE'\"\n                (modified)=\"changeStatus($event, event)\"\n              ></hvy-status-display>\n            </div>\n            <div class=\"o-hvy-events-detail__events__event__content\">\n              @if (!opened[idx]) {\n                <div>{{ '@hvy.event.log.event.description' | i18n }} : {{ event.description }}</div>\n                <div>{{ '@hvy.event.log.event.address' | i18n }} : {{ event.address }}</div>\n              } @else {\n                @if (access(event); as accessValue) {\n                  <div class=\"o-hvy-events-detail__events__event__content__header\">\n                    <h3>{{ '@hvy.event.log.event.detail' | i18n }}</h3>\n                    <span class=\"required\">{{ '@hvy.event.log.event.mandatory' | i18n }}</span>\n                  </div>\n                  <table>\n                    <tbody>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.name' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('name', idx)\"\n                            [value]=\"event.name\"\n                            (change)=\"modifyEvent(idx, 'name', $event)\"\n                            [readonly]=\"accessValue.name\"\n                          />\n                        </td>\n                      </tr>\n                      @if (event.id > 0) {\n                        <tr>\n                          <td>{{ '@hvy.event.log.event.id' | i18n }}<span class=\"required\">*</span> :</td>\n                          <td>\n                            <input type=\"text\" class=\"a-form-field\" [value]=\"padId.fn(event.id)\" [readonly]=\"true\" />\n                          </td>\n                        </tr>\n                      }\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.category' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <pry-select\n                            [ngModel]=\"event.category\"\n                            [items]=\"categories(event)\"\n                            [class.-error]=\"hasError('category', idx)\"\n                            (ngModelChange)=\"modifyEvent(idx, 'category', $event)\"\n                            i18nPrefix=\"@hvy.event.category.\"\n                            [disabled]=\"accessValue.category\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.criticality.name' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <pry-select\n                            [ngModel]=\"event.criticality\"\n                            [items]=\"criticalities\"\n                            [class.-error]=\"hasError('criticality', idx)\"\n                            i18nPrefix=\"@hvy.event.criticality.\"\n                            [disabled]=\"accessValue.criticality\"\n                            (ngModelChange)=\"modifyEvent(idx, 'criticality', $event)\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.description' | i18n }}<span class=\"required\">*</span> :</td>\n                        <td>\n                          <textarea\n                            [ngModel]=\"event.description\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('description', idx)\"\n                            [readonly]=\"accessValue.description\"\n                            (ngModelChange)=\"modifyEvent(idx, 'description', $event)\"\n                          ></textarea>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.log.event.address' | i18n }} :</td>\n                        <td>\n                          <textarea\n                            [ngModel]=\"event.address\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('address', idx)\"\n                            [readonly]=\"accessValue.address\"\n                            (ngModelChange)=\"modifyEvent(idx, 'address', $event)\"\n                          ></textarea>\n                        </td>\n                      </tr>\n                      @if (['ALERT', 'REPORT'].includes(event.type)) {\n                        <tr>\n                          <td>{{ '@hvy.event.source' | i18n }} :</td>\n                          <td>\n                            <input\n                              type=\"text\"\n                              class=\"a-form-field\"\n                              [value]=\"event.externalSourceRef ?? ''\"\n                              [class.-error]=\"hasError('source', idx)\"\n                              [readonly]=\"accessValue.source\"\n                              (change)=\"modifyEvent(idx, 'source', $event)\"\n                            />\n                          </td>\n                        </tr>\n                      }\n                      <tr>\n                        <td>{{ '@hvy.event.equipment' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [value]=\"event.equipment?.name ?? ''\"\n                            [class.-error]=\"hasError('equipment', idx)\"\n                            [readonly]=\"accessValue.eqName\"\n                            (change)=\"changeEquipment(idx, $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.equipmentEntity' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"text\"\n                            class=\"a-form-field\"\n                            [class.-error]=\"hasError('equipment', idx)\"\n                            [value]=\"event.equipment?.entity ?? ''\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.domain.name' | i18n }} :</td>\n                        <td>\n                          <pry-select\n                            [items]=\"DOMAINS\"\n                            [ngModel]=\"event.domain\"\n                            i18nPrefix=\"@hvy.event.domain.\"\n                            [class.-error]=\"hasError('domain', idx)\"\n                            (ngModelChange)=\"modifyEvent(idx, 'domain', $event)\"\n                            [disabled]=\"accessValue.domain\"\n                          ></pry-select>\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>\n                          {{ '@hvy.event.startDate' | i18n }}\n                          @if (event.category === 'MANIFESTATION') {\n                            <span class=\"required\">*</span>\n                          }\n                          :\n                        </td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.startDate | forDateTimeLocal\"\n                            [class.-error]=\"hasError('startDate', idx)\"\n                            [readonly]=\"accessValue.startDate\"\n                            (change)=\"modifyEvent(idx, 'startDate', $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>\n                          {{ '@hvy.event.endDate' | i18n }}\n                          @if (event.category === 'MANIFESTATION') {\n                            <span class=\"required\">*</span>\n                          }\n                          :\n                        </td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.endDate | forDateTimeLocal\"\n                            [class.-error]=\"hasError('endDate', idx)\"\n                            [readonly]=\"accessValue.endDate\"\n                            (change)=\"modifyEvent(idx, 'endDate', $event)\"\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.creationDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.creationDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.lastModificationDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.lastModificationDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                      <tr>\n                        <td>{{ '@hvy.event.closeDate' | i18n }} :</td>\n                        <td>\n                          <input\n                            type=\"datetime-local\"\n                            step=\"1\"\n                            class=\"a-form-field\"\n                            [value]=\"event.closeDate | forDateTimeLocal\"\n                            readonly\n                          />\n                        </td>\n                      </tr>\n                    </tbody>\n                  </table>\n                  <div class=\"o-hvy-events-detail__events__event__content__comments\">\n                    <h3>{{ '@hvy.event.log.event.comments.name' | i18n }} :</h3>\n                    <textarea\n                      [placeholder]=\"('@hvy.event.log.event.comments.placeholder' | i18n) + '...'\"\n                      [(ngModel)]=\"newComentContent\"\n                    ></textarea>\n                    <div class=\"o-hvy-events-detail__events__event__content__comments__button\">\n                      <button class=\"a-btn a-btn--primary\" [disabled]=\"newComentContent.length === 0\">\n                        {{ '@hvy.action.comment' | i18n }}\n                      </button>\n                    </div>\n                  </div>\n                }\n              }\n            </div>\n          </div>\n        }\n      </div>\n      <div class=\"o-hvy-events-detail__procedure\">\n        <div class=\"o-hvy-events-detail__procedure__header\">\n          <h2>\n            {{ (events.length === 1 ? '@hvy.event.log.procedure.name1' : '@hvy.event.log.procedure.name') | i18n }}\n          </h2>\n        </div>\n        @if (procedure) {\n          <div class=\"o-hvy-events-detail__procedure__description\">\n            <p>{{ procedure.description }}</p>\n          </div>\n          <div class=\"o-hvy-events-detail__procedure__progress\">\n            <p>{{ '@hvy.event.log.procedure.progress' | i18n }}</p>\n            <hvy-progress-display [progress]=\"calculatedProgress\"></hvy-progress-display>\n          </div>\n          <hvy-procedure-actions\n            [actions]=\"procedure.actions\"\n            (modified)=\"modifiedActions($event)\"\n          ></hvy-procedure-actions>\n        } @else {\n          <button class=\"a-btn a-btn--secondary\" [disabled]=\"!canAssociateProcedure\">\n            {{ '@hvy.action.associate' | i18n }}\n          </button>\n        }\n      </div>\n    </div>\n  </div>\n</div>\n\n<ng-template #confirmDialog>\n  <div\n    class=\"o-hvy-close-confirm__dialog\"\n    aria-labelledby=\"confirm\"\n    tabindex=\"-1\"\n    id=\"choice\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n  >\n    <h2>\n      {{\n        (changeStatusContext.events.length === 1 ? '@hvy.event.close.oneTitle' : '@hvy.event.close.multiTitle') | i18n\n      }}\n    </h2>\n    <p>{{ (changeStatusContext.events.length === 1 ? '@hvy.event.close.one' : '@hvy.event.close.multi') | i18n }}</p>\n    <ul>\n      @for (event of changeStatusContext.events; track event.id) {\n        <li>{{ event.name }}</li>\n      }\n    </ul>\n    <p class=\"o-hvy-close-confirm__dialog__comment-title\">\n      {{ '@hvy.event.close.comment' | i18n }}<span class=\"required\">*</span> :\n    </p>\n    <div class=\"o-hvy-close-confirm__dialog__comment\">\n      <textarea [(ngModel)]=\"changeStatusContext.comment\" class=\"a-form-field\" [maxLength]=\"255\"></textarea>\n    </div>\n    <div class=\"o-hvy-close-confirm__dialog__actions\">\n      <button class=\"a-btn a-btn--primary\" (click)=\"confirmedClose()\" [disabled]=\"confirmDisabled()\">\n        {{ '@hvy.action.validate' | i18n }}\n      </button>\n      <button class=\"a-btn a-btn--secondary\" (click)=\"toggleConfirm()\">{{ '@hvy.action.cancel' | i18n }}</button>\n    </div>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: EquipmentService }, { type: i1$1.Store }, { type: i3$1.Overlay }, { type: i0.ViewContainerRef }, { type: i3.PrySnackbarService }, { type: i3.PryI18nService }], propDecorators: { modifiedEvents: [{
                 type: Output
             }], modifiedProcedure: [{
@@ -756,7 +798,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
         }], ctorParameters: () => [{ type: i1$1.Store }] });
 
 const EVENT_LINK = {
-    fn: (event, store) => ['./', event.id]
+    fn: (event, store) => ['./', padId.fn(event.id)]
 };
 class EventListComponent extends SubscriptionnerDirective {
     constructor(store, el, router, scroll) {
@@ -801,7 +843,7 @@ class EventListComponent extends SubscriptionnerDirective {
         return this.router.navigate(this.EVENT_LINK.fn(event, this.store));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: EventListComponent, deps: [{ token: i1$1.Store }, { token: i0.ElementRef }, { token: i2.Router }, { token: InfiniteScrollService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: EventListComponent, selector: "hvy-event-list", usesInheritance: true, ngImport: i0, template: "<table class=\"o-hvy-events-table\">\n  <thead>\n    <tr class=\"o-hvy-events-table__header\">\n      <th class=\"-checkbox\">\n        <pry-checkbox [ngModel]=\"allSelected$ | async\" (ngModelChange)=\"selectAll($event)\"></pry-checkbox>\n      </th>\n      <th>{{ '@hvy.event.criticality.name' | i18n }}</th>\n      <th>{{ '@hvy.event.name' | i18n }}</th>\n      <th>\n        <hvy-event-column-order field=\"status\">{{ '@hvy.event.status.name' | i18n }}</hvy-event-column-order>\n      </th>\n      <th>\n        <hvy-event-column-order field=\"procedureProgress\"\n          >{{ '@hvy.procedure.progress' | i18n }}\n        </hvy-event-column-order>\n      </th>\n      <th>{{ '@hvy.event.category.name' | i18n }}</th>\n      <th>\n        <hvy-event-column-order field=\"lastModificationDate\"\n          >{{ '@hvy.event.lastModificationDate' | i18n }}\n        </hvy-event-column-order>\n      </th>\n      <th></th>\n    </tr>\n  </thead>\n  <tbody>\n    @for (event of events$ | async; track event.id) {\n      <tr class=\"o-hvy-events-table__line\" (click)=\"goTo(event)\">\n        <td class=\"o-hvy-events-table__line__cell\">\n          <pry-checkbox\n            [ngModel]=\"(selectedIds$ | async)!.includes(event.id)\"\n            (click)=\"select(event, $event)\"\n          ></pry-checkbox>\n        </td>\n        <td class=\"o-hvy-events-table__line__cell -centered\">\n          <hvy-icon-display [event]=\"event\"></hvy-icon-display>\n        </td>\n        <td class=\"o-hvy-events-table__line__cell\">\n          <div class=\"o-hvy-events-table__line__cell__name__main\">{{ event.name }}</div>\n          <div class=\"o-hvy-events-table__line__cell__name__sub\">\n            {{ event.equipment?.name ? event.equipment?.name : '' }}\n          </div>\n          <div class=\"o-hvy-events-table__line__cell__name__subsub\">\n            {{ event.address }}\n          </div>\n        </td>\n        <td class=\"o-hvy-events-table__line__cell -centered\">\n          <hvy-status-display [item]=\"event\"></hvy-status-display>\n        </td>\n        <td class=\"o-hvy-events-table__line__cell -centered\">{{ event.procedureProgress }} %</td>\n        <td class=\"o-hvy-events-table__line__cell\">{{ '@hvy.event.category.' + event.category | i18n }}</td>\n        <td class=\"o-hvy-events-table__line__cell\">\n          {{ event.lastModificationDate | sinceDate: { onlyLocale: true } }}\n        </td>\n        <td class=\"o-hvy-events-table__line__cell\">\n          <a\n            [routerLink]=\"EVENT_LINK.fn(event, _store)\"\n            [title]=\"\n              '@hvy.event.consult'\n                | i18n: { howMany: Math.max(1, event.linkedEvents), plural: event.linkedEvents > 1 ? 's' : '' }\n            \"\n          >\n            <div class=\"consult-link\">\n              <pry-icon iconSvg=\"eye\" [height]=\"30\" [width]=\"40\"></pry-icon>\n              @if (event.linkedEvents > 1) {\n                <div class=\"indicator-badge\">{{ event.linkedEvents }}</div>\n              }\n            </div>\n          </a>\n        </td>\n      </tr>\n    } @empty {\n      <tr>\n        <td class=\"o-hvy-events-table__empty\" colspan=\"50\">\n          <div>{{ '@hvy.event.log.empty' | i18n }}.</div>\n          <div>\n            <ng-content></ng-content>\n          </div>\n        </td>\n      </tr>\n    }\n  </tbody>\n</table>\n", dependencies: [{ kind: "component", type: i4.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "directive", type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: EventColumnOrderComponent, selector: "hvy-event-column-order" }, { kind: "component", type: IconDisplayComponent, selector: "hvy-icon-display", inputs: ["event"] }, { kind: "component", type: StatusDisplayComponent, selector: "hvy-status-display", inputs: ["item", "modifiable"], outputs: ["modified"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }, { kind: "pipe", type: i3.SinceDatePipe, name: "sinceDate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: EventListComponent, selector: "hvy-event-list", usesInheritance: true, ngImport: i0, template: "<table class=\"o-hvy-events-table\">\n  <thead>\n    <tr class=\"o-hvy-events-table__header\">\n      <th class=\"-checkbox\">\n        <pry-checkbox [ngModel]=\"allSelected$ | async\" (ngModelChange)=\"selectAll($event)\"></pry-checkbox>\n      </th>\n      <th>{{ '@hvy.event.criticality.name' | i18n }}</th>\n      <th>{{ '@hvy.event.name' | i18n }}</th>\n      <th>\n        <hvy-event-column-order field=\"status\">{{ '@hvy.event.status.name' | i18n }}</hvy-event-column-order>\n      </th>\n      <th>\n        <hvy-event-column-order field=\"procedureProgress\"\n          >{{ '@hvy.procedure.progress' | i18n }}\n        </hvy-event-column-order>\n      </th>\n      <th>{{ '@hvy.event.category.name' | i18n }}</th>\n      <th>\n        <hvy-event-column-order field=\"lastModificationDate\"\n          >{{ '@hvy.event.lastModificationDate' | i18n }}\n        </hvy-event-column-order>\n      </th>\n      <th></th>\n    </tr>\n  </thead>\n  <tbody>\n    @for (event of events$ | async; track event.id) {\n      <tr class=\"o-hvy-events-table__line\" (click)=\"goTo(event)\">\n        <td class=\"o-hvy-events-table__line__cell\">\n          <pry-checkbox\n            [ngModel]=\"(selectedIds$ | async)!.includes(event.id)\"\n            (click)=\"select(event, $event)\"\n          ></pry-checkbox>\n        </td>\n        <td class=\"o-hvy-events-table__line__cell -centered\">\n          <hvy-icon-display [event]=\"event\"></hvy-icon-display>\n        </td>\n        <td class=\"o-hvy-events-table__line__cell\">\n          <div class=\"o-hvy-events-table__line__cell__name__main\">{{ event.name }}</div>\n          <div class=\"o-hvy-events-table__line__cell__name__sub\">\n            {{ event.equipment?.name ? event.equipment?.name : '' }}\n          </div>\n          <div class=\"o-hvy-events-table__line__cell__name__subsub\">\n            {{ event.address }}\n          </div>\n        </td>\n        <td class=\"o-hvy-events-table__line__cell -centered\">\n          <hvy-status-display [item]=\"event\"></hvy-status-display>\n        </td>\n        <td class=\"o-hvy-events-table__line__cell -centered\">{{ event.procedureProgress }} %</td>\n        <td class=\"o-hvy-events-table__line__cell\">{{ '@hvy.event.category.' + event.category | i18n }}</td>\n        <td class=\"o-hvy-events-table__line__cell\">\n          {{ event.lastModificationDate | sinceDate: { onlyLocale: true } }}\n        </td>\n        <td class=\"o-hvy-events-table__line__cell\">\n          <a\n            [routerLink]=\"EVENT_LINK.fn(event, _store)\"\n            [title]=\"\n              '@hvy.event.consult'\n                | i18n: { howMany: Math.max(1, event.linkedEvents), plural: event.linkedEvents > 1 ? 's' : '' }\n            \"\n          >\n            <div class=\"consult-link\">\n              <pry-icon iconSvg=\"eye\" [height]=\"30\" [width]=\"40\"></pry-icon>\n              @if (event.linkedEvents > 1) {\n                <div class=\"indicator-badge\">{{ event.linkedEvents }}</div>\n              }\n            </div>\n          </a>\n        </td>\n      </tr>\n    } @empty {\n      <tr>\n        <td class=\"o-hvy-events-table__empty\" colspan=\"50\">\n          <div>{{ '@hvy.event.log.empty' | i18n }}.</div>\n          <div>\n            <ng-content></ng-content>\n          </div>\n        </td>\n      </tr>\n    }\n  </tbody>\n</table>\n", dependencies: [{ kind: "component", type: i4.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: EventColumnOrderComponent, selector: "hvy-event-column-order" }, { kind: "component", type: IconDisplayComponent, selector: "hvy-icon-display", inputs: ["event"] }, { kind: "component", type: StatusDisplayComponent, selector: "hvy-status-display", inputs: ["item", "modifiable"], outputs: ["modified"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }, { kind: "pipe", type: i3.SinceDatePipe, name: "sinceDate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: EventListComponent, decorators: [{
             type: Component,
@@ -837,6 +879,38 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
                 args: ['filter', { descendants: true }]
             }] } });
 
+class ImmediateFiltersComponent extends SubscriptionnerDirective {
+    constructor(store) {
+        super();
+        this.store = store;
+        this.filterSet = 'global';
+        this.delay = 400;
+    }
+    ngAfterViewInit() {
+        this.filters.forEach((filter) => {
+            filter.filterSet = this.filterSet;
+        });
+        combineLatest(this.filters.map((filter) => filter.changed.pipe(startWith(undefined))))
+            .pipe(debounceTime(this.delay), map(() => this.filters.map((filter) => filter.getParams()).reduce((p, c) => ({ ...p, ...c }), {})), distinctUntilChanged((b, a) => equal(b, a)))
+            .subscribe((filters) => {
+            this.store.dispatch(EventActions.filter({ filters, filterSet: this.filterSet }));
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ImmediateFiltersComponent, deps: [{ token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: ImmediateFiltersComponent, selector: "hvy-immediate-filters", inputs: { filterSet: "filterSet", delay: "delay" }, queries: [{ propertyName: "filters", predicate: ["filter"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-event-filters\">\n  <ng-content></ng-content>\n</div>\n" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ImmediateFiltersComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'hvy-immediate-filters', template: "<div class=\"o-hvy-event-filters\">\n  <ng-content></ng-content>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i1$1.Store }], propDecorators: { filterSet: [{
+                type: Input
+            }], delay: [{
+                type: Input
+            }], filters: [{
+                type: ContentChildren,
+                args: ['filter', { descendants: true }]
+            }] } });
+
 class HvyUnitFilterComponent extends SubscriptionnerDirective {
     set filterSet(filterSet) {
         this._filterSet$.next(filterSet);
@@ -848,17 +922,20 @@ class HvyUnitFilterComponent extends SubscriptionnerDirective {
         super();
         this.prop = 'no-prop-defined';
         this._filterSet$ = new BehaviorSubject('global');
+        this.changed = new EventEmitter();
     }
     getParams() {
         throw new Error('Must use sub implementation');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: HvyUnitFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.4", type: HvyUnitFilterComponent, inputs: { prop: "prop", filterSet: "filterSet" }, usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.4", type: HvyUnitFilterComponent, inputs: { prop: "prop", filterSet: "filterSet" }, outputs: { changed: "changed" }, usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: HvyUnitFilterComponent, decorators: [{
             type: Directive
         }], ctorParameters: () => [], propDecorators: { prop: [{
                 type: Input
+            }], changed: [{
+                type: Output
             }], filterSet: [{
                 type: Input
             }] } });
@@ -881,6 +958,7 @@ class DateFilterComponent extends HvyUnitFilterComponent {
     triggerChange($event) {
         // @ts-ignore
         this.value = $event instanceof Event ? $event.target?.value : $event;
+        this.changed.next();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: DateFilterComponent, deps: [{ token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: DateFilterComponent, selector: "hvy-date-filter", providers: [{ provide: HvyUnitFilterComponent, useExisting: forwardRef(() => DateFilterComponent) }], usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-date-filters\">\n  <input type=\"date\" class=\"a-form-field\"\n         [value]=\"value\"\n         (change)=\"triggerChange($event)\">\n</div>\n" }); }
@@ -994,6 +1072,7 @@ class ChoiceFilterComponent extends HvyUnitFilterComponent {
         if (!this.inhibate || this.inhibate !== this.filterSet) {
             this.triggerInhibate();
             this.value.set(value);
+            this.changed.next();
         }
     }
     triggerInhibate() {
@@ -1001,7 +1080,7 @@ class ChoiceFilterComponent extends HvyUnitFilterComponent {
         setTimeout(() => (this.inhibate = undefined), 50);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ChoiceFilterComponent, deps: [{ token: i1$1.Store }, { token: i3$1.Overlay }, { token: i0.ViewContainerRef }, { token: i3.PryI18nService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ChoiceFilterComponent, selector: "hvy-choice-filter", inputs: { label: "label", i18nPrefix: "i18nPrefix", choices: "choices" }, providers: [{ provide: HvyUnitFilterComponent, useExisting: forwardRef(() => ChoiceFilterComponent) }], viewQueries: [{ propertyName: "template", first: true, predicate: ["template"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<button (click)=\"toggleModal()\" #button class=\"o-hvy-choice-filter -horizontal\"\n        [class.-highlight]=\"displayValue() !== ('@hvy.event.filter.choice.all' | i18n)\" [class.-focus]=\"overlayRef\">\n  <div class=\"o-hvy-choice-filter__choice-value\">\n    <span class=\"o-hvy-choice-filter__label\">{{ label | i18n }} :</span>\n    <span class=\"o-hvy-choice-filter__value\" type=\"text\" id=\"select_{{id}}\">{{ displayValue() }}</span>\n  </div>\n  <pry-icon [iconSvg]=\"!!overlayRef ? 'chevron_top' : 'chevron_bottom'\" [width]=\"10\" [height]=\"10\"></pry-icon>\n</button>\n\n<ng-template #template>\n  <div\n    class=\"m-context-menu o-hvy-choice-filter\"\n    aria-labelledby=\"choice\"\n    tabindex=\"-1\"\n    id=\"choice\"\n    role=\"menu\"\n    aria-modal=\"true\"\n  >\n    <div class=\"o-hvy-choice-filter__all\">\n      <pry-checkbox [ngModel]=\"allSelected()\" (ngModelChange)=\"clickAll()\">\n        <span>{{ '@hvy.event.filter.choice.all' | i18n }}</span>\n      </pry-checkbox>\n    </div>\n    @for (elt of choices; track elt.key) {\n      @if (!elt.children) {\n        <pry-checkbox [ngModel]=\"isSelected(elt)\" (ngModelChange)=\"toggle(elt)\" class=\"o-hvy-choice-filter__root\">\n          <span>{{ i18nPrefix + elt.key | i18n }}</span>\n        </pry-checkbox>\n      } @else {\n        <pry-checkbox [ngModel]=\"isSelected(elt)\" (ngModelChange)=\"toggle(elt)\" class=\"o-hvy-choice-filter__root\">\n          <span>{{ i18nPrefix + elt.key | i18n }}</span>\n        </pry-checkbox>\n        @for (child of elt.children; track child.key) {\n          <pry-checkbox [ngModel]=\"isSelected(child)\" (ngModelChange)=\"toggle(child)\"\n                        class=\"o-hvy-choice-filter__child\">\n            <span>{{ i18nPrefix + child.key | i18n }}</span>\n          </pry-checkbox>\n        }\n      }\n    }\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i4.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "directive", type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ChoiceFilterComponent, selector: "hvy-choice-filter", inputs: { label: "label", i18nPrefix: "i18nPrefix", choices: "choices" }, providers: [{ provide: HvyUnitFilterComponent, useExisting: forwardRef(() => ChoiceFilterComponent) }], viewQueries: [{ propertyName: "template", first: true, predicate: ["template"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<button (click)=\"toggleModal()\" #button class=\"o-hvy-choice-filter -horizontal\"\n        [class.-highlight]=\"displayValue() !== ('@hvy.event.filter.choice.all' | i18n)\" [class.-focus]=\"overlayRef\">\n  <div class=\"o-hvy-choice-filter__choice-value\">\n    <span class=\"o-hvy-choice-filter__label\">{{ label | i18n }} :</span>\n    <span class=\"o-hvy-choice-filter__value\" type=\"text\" id=\"select_{{id}}\">{{ displayValue() }}</span>\n  </div>\n  <pry-icon [iconSvg]=\"!!overlayRef ? 'chevron_top' : 'chevron_bottom'\" [width]=\"10\" [height]=\"10\"></pry-icon>\n</button>\n\n<ng-template #template>\n  <div\n    class=\"m-context-menu o-hvy-choice-filter\"\n    aria-labelledby=\"choice\"\n    tabindex=\"-1\"\n    id=\"choice\"\n    role=\"menu\"\n    aria-modal=\"true\"\n  >\n    <div class=\"o-hvy-choice-filter__all\">\n      <pry-checkbox [ngModel]=\"allSelected()\" (ngModelChange)=\"clickAll()\">\n        <span>{{ '@hvy.event.filter.choice.all' | i18n }}</span>\n      </pry-checkbox>\n    </div>\n    @for (elt of choices; track elt.key) {\n      @if (!elt.children) {\n        <pry-checkbox [ngModel]=\"isSelected(elt)\" (ngModelChange)=\"toggle(elt)\" class=\"o-hvy-choice-filter__root\">\n          <span>{{ i18nPrefix + elt.key | i18n }}</span>\n        </pry-checkbox>\n      } @else {\n        <pry-checkbox [ngModel]=\"isSelected(elt)\" (ngModelChange)=\"toggle(elt)\" class=\"o-hvy-choice-filter__root\">\n          <span>{{ i18nPrefix + elt.key | i18n }}</span>\n        </pry-checkbox>\n        @for (child of elt.children; track child.key) {\n          <pry-checkbox [ngModel]=\"isSelected(child)\" (ngModelChange)=\"toggle(child)\"\n                        class=\"o-hvy-choice-filter__child\">\n            <span>{{ i18nPrefix + child.key | i18n }}</span>\n          </pry-checkbox>\n        }\n      }\n    }\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i4.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ChoiceFilterComponent, decorators: [{
             type: Component,
@@ -1017,13 +1096,43 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
                 args: ['template', { read: TemplateRef }]
             }] } });
 
+class TextFilterComponent extends HvyUnitFilterComponent {
+    constructor(store) {
+        super();
+        this.store = store;
+        this.value = '';
+        this.subscriptions.add(combineLatest([this.store.select(EventSelectors.filters), this._filterSet$]).subscribe(([filters, filterSet]) => {
+            this.value = (filters[filterSet] ?? {})[this.prop] ? (filters[filterSet] ?? {})[this.prop][0] ?? '' : '';
+        }));
+    }
+    getParams() {
+        if (this.value === '') {
+            return {};
+        }
+        return { [this.prop]: [this.value] };
+    }
+    triggerChange($event) {
+        // @ts-ignore
+        this.value = $event instanceof Event ? $event.target?.value : $event;
+        this.changed.next();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TextFilterComponent, deps: [{ token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: TextFilterComponent, selector: "hvy-text-filter", providers: [{ provide: HvyUnitFilterComponent, useExisting: forwardRef(() => TextFilterComponent) }], usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-text-filters\">\n  <input\n    class=\"a-form-field o-hvy-text-filters__search-input\"\n    type=\"text\"\n    [value]=\"value\"\n    (input)=\"triggerChange($event)\"\n    placeholder=\"{{ '@hvy.action.search' | i18n }}...\"\n  />\n  <pry-icon iconSvg=\"search\" class=\"o-hvy-text-filters__search-icon\"></pry-icon>\n</div>\n", dependencies: [{ kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TextFilterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'hvy-text-filter', providers: [{ provide: HvyUnitFilterComponent, useExisting: forwardRef(() => TextFilterComponent) }], template: "<div class=\"o-hvy-text-filters\">\n  <input\n    class=\"a-form-field o-hvy-text-filters__search-input\"\n    type=\"text\"\n    [value]=\"value\"\n    (input)=\"triggerChange($event)\"\n    placeholder=\"{{ '@hvy.action.search' | i18n }}...\"\n  />\n  <pry-icon iconSvg=\"search\" class=\"o-hvy-text-filters__search-icon\"></pry-icon>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i1$1.Store }] });
+
 const ProcedureActions = {
     load: createAction('[Procedure] Load Procedures', props()),
     loadSuccess: createAction('[Procedure] (bus) Load Procedure Success', props()),
     loadFailure: createAction('[Procedure] Load Procedures Failure', props()),
     sort: createAction('[Procedure] Set Procedure List Sorting', props()),
-    search: createAction('[Procedure] Set Search Query Value', props()),
-    setCategory: createAction('[Procedure] Set Category Value', props())
+    setCategory: createAction('[Procedure] Set Category Value', props()),
+    model: createAction('[Procedure] Get Procedure Model', props()),
+    modelSuccess: createAction('[Procedure] Get Procedure Model Success', props()),
+    modelFailure: createAction('[Procedure] Get Procedure Model Failure', props())
 };
 
 const procedureFeatureKey = '@hvy/procedure';
@@ -1047,16 +1156,24 @@ const internalReducer$1 = createReducer(procedureInitialState, on(ProcedureActio
     loading: false,
     procedures: [],
     noMoreProcedures: false
-})), on(ProcedureActions.search, (state, { search }) => ({
-    ...state,
-    procedures: [],
-    noMoreProcedures: false,
-    search
 })), on(ProcedureActions.sort, (state, { field, order }) => ({
     ...state,
     procedures: [],
     noMoreProcedures: false,
     sort: { field, order }
+})), on(ProcedureActions.model, (state) => ({
+    ...state,
+    model: undefined,
+    loading: true
+})), on(ProcedureActions.modelSuccess, (state, action) => ({
+    ...state,
+    model: action.model,
+    loading: false
+})), on(ProcedureActions.modelFailure, (state, action) => ({
+    ...state,
+    model: undefined,
+    loading: false,
+    error: action.error
 })));
 function procedureReducer(state, action) {
     return internalReducer$1(state, action);
@@ -1066,15 +1183,15 @@ const feature$1 = createFeatureSelector(procedureFeatureKey);
 const procedures = createSelector(feature$1, (state) => state.procedures);
 const noMoreProcedures = createSelector(feature$1, (state) => state.noMoreProcedures);
 const loading$1 = createSelector(feature$1, (state) => state.loading);
-const search = createSelector(feature$1, (state) => state.search);
 const sort = createSelector(feature$1, (state) => state.sort);
+const model = createSelector(feature$1, (state) => state.model);
 const ProcedureSelectors = {
     feature: feature$1,
     procedures,
     loading: loading$1,
     noMoreProcedures,
-    search,
-    sort
+    sort,
+    model
 };
 
 const PROCEDURE_PAGE_SIZE_FETCH = { value: 20 };
@@ -1084,28 +1201,37 @@ class ProcedureService {
         this.store = store;
     }
     list(startWith = 0, pageSize = PROCEDURE_PAGE_SIZE_FETCH.value) {
-        return this.store.select(HypSelectors.url).pipe(withLatestFrom(this.store.select(ProcedureSelectors.sort), this.store.select(ProcedureSelectors.search)), mergeMap(([url, sort, search]) => {
-            let params = new HttpParams();
+        return combineLatest([
+            this.store.select(HypSelectors.url),
+            this.store.select(ProcedureSelectors.sort),
+            this.store.select(EventSelectors.filters).pipe(map$1((filters) => filters['procedure'] ?? {}))
+        ]).pipe(mergeMap(([url, sort, filters]) => {
+            let params = new HttpParams({ encoder: new FilterParamEncoder() });
+            Object.keys(filters).forEach((filter) => {
+                filters[filter].forEach((filterValue) => {
+                    params = params.append(filter, filterValue);
+                });
+            });
             params = params.set('page', startWith / pageSize + 1);
-            if (search)
-                params = params.set('search', search);
             if (sort)
                 params = params.set('sort', sort.field).set('order', sort.order);
-            return this.httpClient.get(encodeURI(`${url}/procedures/catalog`), { params });
+            return this.httpClient.get(encodeURI(`${url}/procedures/model`), { params });
         }));
     }
     getTop10ByUsage(domain, nameSearch) {
         return this.store.select(HypSelectors.url).pipe(mergeMap((url) => {
             let params = new HttpParams();
-            params = params
-                .set('sort', 'useCount')
-                .set('order', 'desc')
-                .set('pageSize', '10');
+            params = params.set('sort', 'useCount').set('order', 'desc').set('pageSize', '10');
             if (nameSearch)
                 params = params.set('name', nameSearch);
             if (domain)
                 params = params.set('domain', domain);
-            return this.httpClient.get(encodeURI(`${url}/procedures/catalog`), { params });
+            return this.httpClient.get(encodeURI(`${url}/procedures/model`), { params });
+        }));
+    }
+    get(id) {
+        return this.store.select(HypSelectors.url).pipe(mergeMap((url) => {
+            return this.httpClient.get(encodeURI(`${url}/procedures/model/id/${id}`));
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureService, deps: [{ token: i1.HttpClient }, { token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Injectable }); }
@@ -1130,7 +1256,7 @@ class ProcedureAssociationModalComponent extends SubscriptionnerDirective {
         this.selectedEvents$ = this.store.select(EventSelectors.selectedEvents);
         this.procedures$ = combineLatest([
             this.onDomainSelect$.pipe(startWith()),
-            this.onProcedureSearch$.pipe(startWith(), debounceTime(500)),
+            this.onProcedureSearch$.pipe(startWith(), debounceTime$1(500)),
         ]).pipe(switchMap(([_, __]) => {
             const search = typeof this.procedureSelectValue === 'string' && this.procedureSelectValue.length > 2 ? this.procedureSelectValue : undefined;
             return this.procedureService.getTop10ByUsage(this.selectedDomain, search);
@@ -1157,7 +1283,7 @@ class ProcedureAssociationModalComponent extends SubscriptionnerDirective {
         this.dialog.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureAssociationModalComponent, deps: [{ token: i1$1.Store }, { token: ProcedureService }, { token: i3.PryDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ProcedureAssociationModalComponent, selector: "hvy-procedure-association-modal", usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-association-modal u-display-flex -column -align-center\">\n  <h3>{{ '@hvy.associationModal.title' | i18n }}</h3>\n  <span class=\"o-hvy-association-modal__description\">{{ '@hvy.associationModal.description' | i18n }}</span>\n  <div class=\"o-hvy-association-modal__content u-display-flex -justify-space-between\">\n    @if (selectedEvents$ | async; as selectedEvents) {\n      <div>\n        <label>\u00C9v\u00E9nements li\u00E9s ({{ selectedEvents.length }}) :</label>\n        <ul class=\"o-hvy-association-modal__events\">\n          @for (event of selectedEvents; track event.id) {\n            <li class=\"o-hvy-association-modal__event u-display-flex -align-center\">\n              <hvy-icon-display [event]=\"event\"></hvy-icon-display>\n              <div class=\"o-hvy-association-modal__event-detail u-display-flex -column\">\n                <span class=\"o-hvy-association-modal__event-name\">{{ event.name }}</span>\n                @if (event.equipment) {\n                  <span class=\"o-hvy-association-modal__equipment-name\">{{ event.equipment.name }}</span>\n                }\n              </div>\n            </li>\n          }\n        </ul>\n      </div>\n    }\n    <div class=\"o-hvy-association-modal__form\">\n      <div class=\"m-form-label-field\">\n        <label>{{ '@hvy.associationModal.categoryFilter' | i18n }}</label>\n        <pry-select\n          [items]=\"DOMAINS\"\n          [(ngModel)]=\"selectedDomain\"\n          (ngModelChange)=\"onDomainChange()\"\n          [placeholder]=\"'@hvy.associationModal.domainPlaceholder' | i18n\"\n          i18nPrefix=\"@hvy.event.domain.\"\n          id=\"category-filter\"></pry-select>\n      </div>\n      <div class=\"m-form-label-field\">\n        <label for=\"procedure-filter\">{{ '@hvy.associationModal.searchProcedure' | i18n }}<span class=\"text-error\">*</span> : </label>\n        <pry-select\n          [items]=\"procedures$ | async\"\n          bindLabel=\"name\"\n          [(ngModel)]=\"procedureSelectValue\"\n          (ngModelChange)=\"selectedProcedureChange($event)\"\n          [autocomplete]=\"true\"\n          [externalAutocompleteService]=\"true\"\n          [placeholder]=\"'@hvy.associationModal.procedurePlaceholder' | i18n\"\n          id=\"procedure-filter\"></pry-select>\n      </div>\n    </div>\n  </div>\n  <div class=\"o-hvy-association-modal__buttons u-display-flex -justify-center\">\n    <button class=\"a-btn a-btn--primary\" [disabled]=\"!isProcedureSelected()\" (click)=\"associateProcedure()\">{{ '@hvy.action.validate' | i18n }}</button>\n    <button class=\"a-btn a-btn--secondary\" (click)=\"closeModal()\">{{ '@hvy.action.cancel' | i18n }}</button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "component", type: IconDisplayComponent, selector: "hvy-icon-display", inputs: ["event"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ProcedureAssociationModalComponent, selector: "hvy-procedure-association-modal", usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-association-modal u-display-flex -column -align-center\">\n  <h3>{{ '@hvy.associationModal.title' | i18n }}</h3>\n  <span class=\"o-hvy-association-modal__description\">{{ '@hvy.associationModal.description' | i18n }}</span>\n  <div class=\"o-hvy-association-modal__content u-display-flex -justify-space-between\">\n    @if (selectedEvents$ | async; as selectedEvents) {\n      <div>\n        <label>\u00C9v\u00E9nements li\u00E9s ({{ selectedEvents.length }}) :</label>\n        <ul class=\"o-hvy-association-modal__events\">\n          @for (event of selectedEvents; track event.id) {\n            <li class=\"o-hvy-association-modal__event u-display-flex -align-center\">\n              <hvy-icon-display [event]=\"event\"></hvy-icon-display>\n              <div class=\"o-hvy-association-modal__event-detail u-display-flex -column\">\n                <span class=\"o-hvy-association-modal__event-name\">{{ event.name }}</span>\n                @if (event.equipment) {\n                  <span class=\"o-hvy-association-modal__equipment-name\">{{ event.equipment.name }}</span>\n                }\n              </div>\n            </li>\n          }\n        </ul>\n      </div>\n    }\n    <div class=\"o-hvy-association-modal__form\">\n      <div class=\"m-form-label-field\">\n        <label>{{ '@hvy.associationModal.categoryFilter' | i18n }}</label>\n        <pry-select\n          [items]=\"DOMAINS\"\n          [(ngModel)]=\"selectedDomain\"\n          (ngModelChange)=\"onDomainChange()\"\n          [placeholder]=\"'@hvy.associationModal.domainPlaceholder' | i18n\"\n          i18nPrefix=\"@hvy.event.domain.\"\n          id=\"category-filter\"></pry-select>\n      </div>\n      <div class=\"m-form-label-field\">\n        <label for=\"procedure-filter\">{{ '@hvy.associationModal.searchProcedure' | i18n }}<span class=\"text-error\">*</span> : </label>\n        <pry-select\n          [items]=\"procedures$ | async\"\n          bindLabel=\"name\"\n          [(ngModel)]=\"procedureSelectValue\"\n          (ngModelChange)=\"selectedProcedureChange($event)\"\n          [autocomplete]=\"true\"\n          [externalAutocompleteService]=\"true\"\n          [placeholder]=\"'@hvy.associationModal.procedurePlaceholder' | i18n\"\n          id=\"procedure-filter\"></pry-select>\n      </div>\n    </div>\n  </div>\n  <div class=\"o-hvy-association-modal__buttons u-display-flex -justify-center\">\n    <button class=\"a-btn a-btn--primary\" [disabled]=\"!isProcedureSelected()\" (click)=\"associateProcedure()\">{{ '@hvy.action.validate' | i18n }}</button>\n    <button class=\"a-btn a-btn--secondary\" (click)=\"closeModal()\">{{ '@hvy.action.cancel' | i18n }}</button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "component", type: IconDisplayComponent, selector: "hvy-icon-display", inputs: ["event"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureAssociationModalComponent, decorators: [{
             type: Component,
@@ -1257,6 +1383,10 @@ class EventService {
         }));
     }
     save(event) {
+        const toSend = { ...event };
+        if (event.id < 0) {
+            delete toSend.id;
+        }
         return this.store.select(HypSelectors.url).pipe(mergeMap((url) => {
             return this.httpClient.post(encodeURI(`${url}/events/${event.type.toLowerCase()}`), eventForWriteAPI(event));
         }));
@@ -1278,7 +1408,7 @@ class EventService {
     }
     associateProcedure(procedureId) {
         return this.store.select(HypSelectors.url).pipe(withLatestFrom(this.store.select(EventSelectors.selectedIds)), mergeMap(([url, selectedIds]) => {
-            return this.httpClient.put(encodeURI(`${url}/procedures/catalog/id/${procedureId}`), {
+            return this.httpClient.put(encodeURI(`${url}/procedures/model/id/${procedureId}`), {
                 id: procedureId,
                 events: selectedIds
             });
@@ -1384,7 +1514,7 @@ class EventSummaryPageComponent extends SubscriptionnerDirective {
         this.store.dispatch(EventSummaryActions.load());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: EventSummaryPageComponent, deps: [{ token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: EventSummaryPageComponent, selector: "hvy-event-summary-page", inputs: { pageTitle: "pageTitle", consultLink: "consultLink" }, usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-event-summary-page\">\n  <div class=\"o-hvy-event-summary-page__header u-display-flex -justify-space-between\">\n    @if (pageTitle) {\n      <h3 class=\"o-hvy-event-summary-page__title\">{{ pageTitle }}</h3>\n    }\n    <div class=\"m-filter__input-wrapper m-filter__input-wrapper--dropdown\">\n      <label class=\"a-label m-filter__label\" for=\"criticality-filter\"\n        >{{ '@hvy.event.criticality.name' | i18n }} :&nbsp;</label\n      >\n      <pry-select\n        id=\"criticality-filter\"\n        class=\"o-hvy-event-summary-page__filter\"\n        [items]=\"criticalityList\"\n        [ngModel]=\"selectedCriticality$ | async\"\n        (ngModelChange)=\"filterByCriticality($event)\"\n        [translate]=\"true\"\n        i18nPrefix=\"@hvy.eventSummary.criticalityLabels.\"\n      >\n      </pry-select>\n    </div>\n  </div>\n  <div class=\"o-hvy-event-summary-page__content\">\n    <div class=\"o-hvy-event-summary-page__content__sub\">\n      @for (summaryKey of statusList; track summaryKey) {\n        <hvy-event-summary-list\n          class=\"o-hvy-event-summary-page__summary-list\"\n          [status]=\"summaryKey\"\n          [totalEventCount]=\"summaries[summaryKey].count ?? 0\"\n          [events]=\"summaries[summaryKey].events\"\n          [consultLink]=\"consultLink\"\n        >\n        </hvy-event-summary-list>\n      }\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "component", type: EventSummaryListComponent, selector: "hvy-event-summary-list", inputs: ["events", "totalEventCount", "status", "consultLink", "itemLinkBase"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: EventSummaryPageComponent, selector: "hvy-event-summary-page", inputs: { pageTitle: "pageTitle", consultLink: "consultLink" }, usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-event-summary-page\">\n  <div class=\"o-hvy-event-summary-page__header u-display-flex -justify-space-between\">\n    @if (pageTitle) {\n      <h3 class=\"o-hvy-event-summary-page__title\">{{ pageTitle }}</h3>\n    }\n    <div class=\"m-filter__input-wrapper m-filter__input-wrapper--dropdown\">\n      <label class=\"a-label m-filter__label\" for=\"criticality-filter\"\n        >{{ '@hvy.event.criticality.name' | i18n }} :&nbsp;</label\n      >\n      <pry-select\n        id=\"criticality-filter\"\n        class=\"o-hvy-event-summary-page__filter\"\n        [items]=\"criticalityList\"\n        [ngModel]=\"selectedCriticality$ | async\"\n        (ngModelChange)=\"filterByCriticality($event)\"\n        [translate]=\"true\"\n        i18nPrefix=\"@hvy.eventSummary.criticalityLabels.\"\n      >\n      </pry-select>\n    </div>\n  </div>\n  <div class=\"o-hvy-event-summary-page__content\">\n    <div class=\"o-hvy-event-summary-page__content__sub\">\n      @for (summaryKey of statusList; track summaryKey) {\n        <hvy-event-summary-list\n          class=\"o-hvy-event-summary-page__summary-list\"\n          [status]=\"summaryKey\"\n          [totalEventCount]=\"summaries[summaryKey].count ?? 0\"\n          [events]=\"summaries[summaryKey].events\"\n          [consultLink]=\"consultLink\"\n        >\n        </hvy-event-summary-list>\n      }\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "component", type: EventSummaryListComponent, selector: "hvy-event-summary-list", inputs: ["events", "totalEventCount", "status", "consultLink", "itemLinkBase"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: EventSummaryPageComponent, decorators: [{
             type: Component,
@@ -1398,10 +1528,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
 class ProcedureColumnOrderComponent extends ColumnOrderComponent {
     constructor(store) {
         super(store);
-        this.subscriptions.add(this.store.select(ProcedureSelectors.sort).subscribe(sort => this.sortValue = sort));
+        this.subscriptions.add(this.store.select(ProcedureSelectors.sort).subscribe((sort) => (this.sortValue = sort)));
     }
     sort(order) {
-        throw Error('Sort not implemented.');
         this.store.dispatch(ProcedureActions.sort({ field: this.field, order }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureColumnOrderComponent, deps: [{ token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
@@ -1413,28 +1542,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
         }], ctorParameters: () => [{ type: i1$1.Store }] });
 
 const PROCEDURE_LINK = {
-    fn: (procedure, store) => ['./', procedure.id]
+    fn: (procedure, store) => ['./', padId.fn(procedure.id)]
 };
 class ProcedureListComponent extends SubscriptionnerDirective {
-    constructor(store, el, router, scroll) {
+    constructor(store, router, scroll) {
         super();
         this.store = store;
-        this.el = el;
         this.router = router;
         this.scroll = scroll;
         this.PROCEDURE_LINK = PROCEDURE_LINK;
         this.search = '';
-        this.search$ = new Subject;
+        this.search$ = new Subject();
+        this.DOMAINS = DOMAINS.values.map((d) => ({ key: d }));
+        this.padId = padId;
         this.store.dispatch(ProcedureActions.load({}));
         this.procedures$ = this.store.select(ProcedureSelectors.procedures);
-        this.subscriptions.add(this.search$.pipe(debounceTime$1(300), distinctUntilChanged()).subscribe((search) => {
-            throw Error('Search not implemented.');
-            this.store.dispatch(ProcedureActions.search({ search }));
-        }));
     }
     ngAfterViewInit() {
-        this.subscriptions.add(this.scroll.isEndOfPage(this.el.nativeElement, ProcedureSelectors.noMoreProcedures)
-            .subscribe(() => {
+        this.subscriptions.add(this.scroll.isEndOfPage(this.scrollable.nativeElement, ProcedureSelectors.noMoreProcedures).subscribe(() => {
             this.store.dispatch(ProcedureActions.load({ next: true }));
         }));
     }
@@ -1444,16 +1569,94 @@ class ProcedureListComponent extends SubscriptionnerDirective {
     goTo(procedure) {
         return this.router.navigate(this.PROCEDURE_LINK.fn(procedure, this.store));
     }
-    ngOnDestroy() {
-        this.store.dispatch(ProcedureActions.search({ search: undefined }));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureListComponent, deps: [{ token: i1$1.Store }, { token: i0.ElementRef }, { token: i2.Router }, { token: InfiniteScrollService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ProcedureListComponent, selector: "hvy-procedure-list", usesInheritance: true, ngImport: i0, template: "<div class=\"o-procedure-list\">\n  <div class=\"m-form-label-field o-procedure-list__search\">\n    <input class=\"a-form-field o-procedure-list__search-input\" type=\"text\" [(ngModel)]=\"search\" (ngModelChange)=\"emitSearch()\" placeholder=\"{{ '@hvy.action.search' | i18n }}...\">\n    <pry-icon iconSvg=\"search\" class=\"o-procedure-list__search-icon\"></pry-icon>\n  </div>\n  <table class=\"o-hvy-events-table\">\n    <thead>\n    <tr class=\"o-hvy-events-table__header\">\n      <th>\n        <hvy-procedure-column-order field=\"useCount\">{{ '@hvy.procedure.useCount' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"title\">{{ '@hvy.procedure.title' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"domain\">{{ '@hvy.procedure.domain' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"creator\">{{ '@hvy.procedure.author' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"id\">{{ '@hvy.procedure.id' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"creationDate\">{{ '@hvy.event.creationDate' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"lastModificationDate\"><span>{{ '@hvy.event.lastModificationDate' | i18n }}</span></hvy-procedure-column-order>\n      </th>\n      <th></th>\n    </tr>\n    </thead>\n    <tbody>\n      @for (procedure of procedures$ | async; track procedure.id) {\n        <tr class=\"o-hvy-events-table__line\" (click)=\"goTo(procedure)\">\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.useCount }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.name }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.domain }}</td>\n          <td class=\"o-hvy-events-table__line__cell -centered\">{{ procedure.creator }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.id }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.creationDate| date : 'dd/mm/YYYY HH:MM' }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.lastModificationDate | date : 'dd/mm/YYYY HH:MM' }}\n          </td>\n          <td class=\"o-hvy-events-table__line__cell\">\n            <a [routerLink]=\"PROCEDURE_LINK.fn(procedure, store)\">> {{ '@hvy.action.consult' | i18n }}</a>\n          </td>\n        </tr>\n      } @empty {\n        <tr>\n          <td class=\"o-hvy-events-table__empty\" colspan=\"50\">\n            <div>{{ '@hvy.procedure.noContent' | i18n }}</div>\n            <div>\n              <ng-content></ng-content>\n            </div>\n          </td>\n        </tr>\n      }\n    </tbody>\n  </table>\n</div>\n", dependencies: [{ 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: ProcedureColumnOrderComponent, selector: "hvy-procedure-column-order" }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureListComponent, deps: [{ token: i1$1.Store }, { token: i2.Router }, { token: InfiniteScrollService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ProcedureListComponent, selector: "hvy-procedure-model-list", viewQueries: [{ propertyName: "scrollable", first: true, predicate: ["scrollable"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"o-procedure-list\">\n  <div class=\"m-form-label-field o-procedure-list__action\">\n    <hvy-immediate-filters [filterSet]=\"'procedure'\">\n      <hvy-text-filter prop=\"search\" #filter></hvy-text-filter>\n      <hvy-choice-filter\n        i18nPrefix=\"@hvy.event.domain.\"\n        label=\"@hvy.event.domain.name\"\n        [choices]=\"DOMAINS\"\n        prop=\"domain\"\n        #filter\n      ></hvy-choice-filter>\n    </hvy-immediate-filters>\n  </div>\n  <div class=\"o-procedure-list__table\" #scrollable>\n    <table class=\"o-hvy-events-table\">\n      <thead>\n        <tr class=\"o-hvy-events-table__header\">\n          <th>\n            <hvy-procedure-column-order field=\"useCount\"\n              >{{ '@hvy.procedure.useCount' | i18n }}\n            </hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"title\">{{ '@hvy.procedure.title' | i18n }}</hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"domain\">{{ '@hvy.procedure.domain' | i18n }}</hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"creator\">{{\n              '@hvy.procedure.author' | i18n\n            }}</hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"id\">{{ '@hvy.procedure.id' | i18n }}</hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"creationDate\"\n              >{{ '@hvy.event.creationDate' | i18n }}\n            </hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"lastModificationDate\">\n              <span>{{ '@hvy.event.lastModificationDate' | i18n }}</span></hvy-procedure-column-order\n            >\n          </th>\n          <th></th>\n        </tr>\n      </thead>\n      <tbody>\n        @for (procedure of procedures$ | async; track procedure.id) {\n          <tr class=\"o-hvy-events-table__line\" (click)=\"goTo(procedure)\">\n            <td class=\"o-hvy-events-table__line__cell\">{{ procedure.useCount }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">{{ procedure.title }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">{{ procedure.domain }}</td>\n            <td class=\"o-hvy-events-table__line__cell -centered\">{{ procedure.creator }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">{{ padId.fn(procedure.id) }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">{{ procedure.creationDate | date: 'dd/mm/YYYY HH:MM' }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">\n              {{ procedure.lastModificationDate | date: 'dd/mm/YYYY HH:MM' }}\n            </td>\n            <td class=\"o-hvy-events-table__line__cell\">\n              <a [routerLink]=\"PROCEDURE_LINK.fn(procedure, store)\">\n                <div class=\"consult-link\">\n                  <pry-icon iconSvg=\"eye\" [height]=\"30\" [width]=\"40\"></pry-icon>\n                </div>\n              </a>\n            </td>\n          </tr>\n        } @empty {\n          <tr>\n            <td class=\"o-hvy-events-table__empty\" colspan=\"50\">\n              <div>{{ '@hvy.procedure.noContent' | i18n }}</div>\n              <div>\n                <ng-content></ng-content>\n              </div>\n            </td>\n          </tr>\n        }\n      </tbody>\n    </table>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: TextFilterComponent, selector: "hvy-text-filter" }, { kind: "component", type: ChoiceFilterComponent, selector: "hvy-choice-filter", inputs: ["label", "i18nPrefix", "choices"] }, { kind: "component", type: ProcedureColumnOrderComponent, selector: "hvy-procedure-column-order" }, { kind: "component", type: ImmediateFiltersComponent, selector: "hvy-immediate-filters", inputs: ["filterSet", "delay"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }, { kind: "pipe", type: i1$2.DatePipe, name: "date" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'hvy-procedure-list', template: "<div class=\"o-procedure-list\">\n  <div class=\"m-form-label-field o-procedure-list__search\">\n    <input class=\"a-form-field o-procedure-list__search-input\" type=\"text\" [(ngModel)]=\"search\" (ngModelChange)=\"emitSearch()\" placeholder=\"{{ '@hvy.action.search' | i18n }}...\">\n    <pry-icon iconSvg=\"search\" class=\"o-procedure-list__search-icon\"></pry-icon>\n  </div>\n  <table class=\"o-hvy-events-table\">\n    <thead>\n    <tr class=\"o-hvy-events-table__header\">\n      <th>\n        <hvy-procedure-column-order field=\"useCount\">{{ '@hvy.procedure.useCount' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"title\">{{ '@hvy.procedure.title' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"domain\">{{ '@hvy.procedure.domain' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"creator\">{{ '@hvy.procedure.author' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"id\">{{ '@hvy.procedure.id' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"creationDate\">{{ '@hvy.event.creationDate' | i18n }}</hvy-procedure-column-order>\n      </th>\n      <th>\n        <hvy-procedure-column-order field=\"lastModificationDate\"><span>{{ '@hvy.event.lastModificationDate' | i18n }}</span></hvy-procedure-column-order>\n      </th>\n      <th></th>\n    </tr>\n    </thead>\n    <tbody>\n      @for (procedure of procedures$ | async; track procedure.id) {\n        <tr class=\"o-hvy-events-table__line\" (click)=\"goTo(procedure)\">\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.useCount }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.name }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.domain }}</td>\n          <td class=\"o-hvy-events-table__line__cell -centered\">{{ procedure.creator }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.id }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.creationDate| date : 'dd/mm/YYYY HH:MM' }}</td>\n          <td class=\"o-hvy-events-table__line__cell\">{{ procedure.lastModificationDate | date : 'dd/mm/YYYY HH:MM' }}\n          </td>\n          <td class=\"o-hvy-events-table__line__cell\">\n            <a [routerLink]=\"PROCEDURE_LINK.fn(procedure, store)\">> {{ '@hvy.action.consult' | i18n }}</a>\n          </td>\n        </tr>\n      } @empty {\n        <tr>\n          <td class=\"o-hvy-events-table__empty\" colspan=\"50\">\n            <div>{{ '@hvy.procedure.noContent' | i18n }}</div>\n            <div>\n              <ng-content></ng-content>\n            </div>\n          </td>\n        </tr>\n      }\n    </tbody>\n  </table>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: i1$1.Store }, { type: i0.ElementRef }, { type: i2.Router }, { type: InfiniteScrollService }] });
+            args: [{ selector: 'hvy-procedure-model-list', template: "<div class=\"o-procedure-list\">\n  <div class=\"m-form-label-field o-procedure-list__action\">\n    <hvy-immediate-filters [filterSet]=\"'procedure'\">\n      <hvy-text-filter prop=\"search\" #filter></hvy-text-filter>\n      <hvy-choice-filter\n        i18nPrefix=\"@hvy.event.domain.\"\n        label=\"@hvy.event.domain.name\"\n        [choices]=\"DOMAINS\"\n        prop=\"domain\"\n        #filter\n      ></hvy-choice-filter>\n    </hvy-immediate-filters>\n  </div>\n  <div class=\"o-procedure-list__table\" #scrollable>\n    <table class=\"o-hvy-events-table\">\n      <thead>\n        <tr class=\"o-hvy-events-table__header\">\n          <th>\n            <hvy-procedure-column-order field=\"useCount\"\n              >{{ '@hvy.procedure.useCount' | i18n }}\n            </hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"title\">{{ '@hvy.procedure.title' | i18n }}</hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"domain\">{{ '@hvy.procedure.domain' | i18n }}</hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"creator\">{{\n              '@hvy.procedure.author' | i18n\n            }}</hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"id\">{{ '@hvy.procedure.id' | i18n }}</hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"creationDate\"\n              >{{ '@hvy.event.creationDate' | i18n }}\n            </hvy-procedure-column-order>\n          </th>\n          <th>\n            <hvy-procedure-column-order field=\"lastModificationDate\">\n              <span>{{ '@hvy.event.lastModificationDate' | i18n }}</span></hvy-procedure-column-order\n            >\n          </th>\n          <th></th>\n        </tr>\n      </thead>\n      <tbody>\n        @for (procedure of procedures$ | async; track procedure.id) {\n          <tr class=\"o-hvy-events-table__line\" (click)=\"goTo(procedure)\">\n            <td class=\"o-hvy-events-table__line__cell\">{{ procedure.useCount }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">{{ procedure.title }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">{{ procedure.domain }}</td>\n            <td class=\"o-hvy-events-table__line__cell -centered\">{{ procedure.creator }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">{{ padId.fn(procedure.id) }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">{{ procedure.creationDate | date: 'dd/mm/YYYY HH:MM' }}</td>\n            <td class=\"o-hvy-events-table__line__cell\">\n              {{ procedure.lastModificationDate | date: 'dd/mm/YYYY HH:MM' }}\n            </td>\n            <td class=\"o-hvy-events-table__line__cell\">\n              <a [routerLink]=\"PROCEDURE_LINK.fn(procedure, store)\">\n                <div class=\"consult-link\">\n                  <pry-icon iconSvg=\"eye\" [height]=\"30\" [width]=\"40\"></pry-icon>\n                </div>\n              </a>\n            </td>\n          </tr>\n        } @empty {\n          <tr>\n            <td class=\"o-hvy-events-table__empty\" colspan=\"50\">\n              <div>{{ '@hvy.procedure.noContent' | i18n }}</div>\n              <div>\n                <ng-content></ng-content>\n              </div>\n            </td>\n          </tr>\n        }\n      </tbody>\n    </table>\n  </div>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i1$1.Store }, { type: i2.Router }, { type: InfiniteScrollService }], propDecorators: { scrollable: [{
+                type: ViewChild,
+                args: ['scrollable']
+            }] } });
+
+class ProcedureModelDetailComponent extends SubscriptionnerDirective {
+    constructor(store) {
+        super();
+        this.store = store;
+        this.username = 'xxx';
+        this.modifications = {};
+        this.errors = [];
+        this.eventErrors = new EventEmitter();
+        this.modified = new EventEmitter();
+        this.DOMAINS = DOMAINS.values;
+    }
+    hasError(prop) {
+        return this.errors.find((err) => err.field === prop) ?? false;
+    }
+    validate(model) {
+        if (!!model) {
+            this.errors = [];
+            if (!model.title || model.title.length === 0) {
+                this.errors.push({ field: 'title', code: 'required' });
+            }
+            if (!model.domain || model.domain.length === 0) {
+                this.errors.push({ field: 'domain', code: 'required' });
+            }
+            if (!model.description || model.description.length === 0) {
+                this.errors.push({ field: 'description', code: 'required' });
+            }
+            this.eventErrors.next(this.errors);
+        }
+    }
+    modify(prop, $event) {
+        // @ts-ignore
+        const newValue = $event instanceof Event ? $event.target?.value : $event;
+        // @ts-ignore
+        if (this.model[prop] !== newValue) {
+            // @ts-ignore
+            this.modifications[prop] = newValue;
+            this._outputModifications();
+        }
+        else {
+            // @ts-ignore
+            delete this.modifications[prop];
+            this._outputModifications();
+        }
+    }
+    _outputModifications() {
+        this.validate(this.model);
+        this.modified.next([this.modifications, this.modifiedModel]);
+    }
+    get modifiedModel() {
+        return { ...this.model, ...(this.modifications ?? {}) };
+    }
+    updateActions($event) {
+        if (equal($event, this.model?.actions)) {
+            delete this.modifications.actions;
+        }
+        else {
+            this.modifications.actions = $event;
+        }
+        this._outputModifications();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureModelDetailComponent, deps: [{ token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ProcedureModelDetailComponent, selector: "hvy-procedure-model-detail", inputs: { model: "model", username: "username", title: "title" }, outputs: { eventErrors: "eventErrors", modified: "modified" }, usesInheritance: true, ngImport: i0, template: "<div class=\"o-hvy-procedure-detail\">\n  <h1>{{ title ?? '@hvy.procedure.detail' | i18n }}</h1>\n  <div class=\"o-hvy-procedure-detail__container\">\n    <div class=\"o-hvy-procedure-detail__container__scrollable\">\n      @if (model) {\n        <div class=\"o-hvy-procedure-detail__form\">\n          <table>\n            <tbody>\n              <tr>\n                <td>{{ '@hvy.procedure.title' | i18n }}<span class=\"required\">*</span> :</td>\n                <td>\n                  <input\n                    type=\"text\"\n                    class=\"a-form-field\"\n                    [class.-error]=\"hasError('title')\"\n                    [value]=\"model.title\"\n                    (change)=\"modify('title', $event)\"\n                  />\n                </td>\n              </tr>\n              <tr>\n                <td>{{ '@hvy.procedure.description' | i18n }}<span class=\"required\">*</span> :</td>\n                <td>\n                  <textarea\n                    [ngModel]=\"model.description\"\n                    class=\"a-form-field\"\n                    [class.-error]=\"hasError('description')\"\n                    (ngModelChange)=\"modify('description', $event)\"\n                  ></textarea>\n                </td>\n              </tr>\n              <tr>\n                <td>{{ '@hvy.event.domain.name' | i18n }}<span class=\"required\">*</span> :</td>\n                <td>\n                  <pry-select\n                    [items]=\"DOMAINS\"\n                    [ngModel]=\"model.domain\"\n                    i18nPrefix=\"@hvy.event.domain.\"\n                    [class.-error]=\"hasError('domain')\"\n                    (ngModelChange)=\"modify('domain', $event)\"\n                  ></pry-select>\n                </td>\n              </tr>\n              <tr>\n                <td>{{ '@hvy.procedure.creator' | i18n }} :</td>\n                <td>\n                  <input type=\"text\" class=\"a-form-field\" [value]=\"model.creator\" readonly />\n                </td>\n              </tr>\n            </tbody>\n          </table>\n        </div>\n        <div class=\"o-hvy-procedure-detail__actions\">\n          <h3>{{ '@hvy.procedure.actions' | i18n }}</h3>\n          <hvy-procedure-actions [actions]=\"model.actions\" (modified)=\"updateActions($event)\"></hvy-procedure-actions>\n        </div>\n      }\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "component", type: ProcedureActionsComponent, selector: "hvy-procedure-actions", inputs: ["actions"], outputs: ["modified"] }, { kind: "pipe", type: i3.I18nPipe, name: "i18n" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureModelDetailComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'hvy-procedure-model-detail', template: "<div class=\"o-hvy-procedure-detail\">\n  <h1>{{ title ?? '@hvy.procedure.detail' | i18n }}</h1>\n  <div class=\"o-hvy-procedure-detail__container\">\n    <div class=\"o-hvy-procedure-detail__container__scrollable\">\n      @if (model) {\n        <div class=\"o-hvy-procedure-detail__form\">\n          <table>\n            <tbody>\n              <tr>\n                <td>{{ '@hvy.procedure.title' | i18n }}<span class=\"required\">*</span> :</td>\n                <td>\n                  <input\n                    type=\"text\"\n                    class=\"a-form-field\"\n                    [class.-error]=\"hasError('title')\"\n                    [value]=\"model.title\"\n                    (change)=\"modify('title', $event)\"\n                  />\n                </td>\n              </tr>\n              <tr>\n                <td>{{ '@hvy.procedure.description' | i18n }}<span class=\"required\">*</span> :</td>\n                <td>\n                  <textarea\n                    [ngModel]=\"model.description\"\n                    class=\"a-form-field\"\n                    [class.-error]=\"hasError('description')\"\n                    (ngModelChange)=\"modify('description', $event)\"\n                  ></textarea>\n                </td>\n              </tr>\n              <tr>\n                <td>{{ '@hvy.event.domain.name' | i18n }}<span class=\"required\">*</span> :</td>\n                <td>\n                  <pry-select\n                    [items]=\"DOMAINS\"\n                    [ngModel]=\"model.domain\"\n                    i18nPrefix=\"@hvy.event.domain.\"\n                    [class.-error]=\"hasError('domain')\"\n                    (ngModelChange)=\"modify('domain', $event)\"\n                  ></pry-select>\n                </td>\n              </tr>\n              <tr>\n                <td>{{ '@hvy.procedure.creator' | i18n }} :</td>\n                <td>\n                  <input type=\"text\" class=\"a-form-field\" [value]=\"model.creator\" readonly />\n                </td>\n              </tr>\n            </tbody>\n          </table>\n        </div>\n        <div class=\"o-hvy-procedure-detail__actions\">\n          <h3>{{ '@hvy.procedure.actions' | i18n }}</h3>\n          <hvy-procedure-actions [actions]=\"model.actions\" (modified)=\"updateActions($event)\"></hvy-procedure-actions>\n        </div>\n      }\n    </div>\n  </div>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i1$1.Store }], propDecorators: { model: [{
+                type: Input
+            }], username: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], eventErrors: [{
+                type: Output
+            }], modified: [{
+                type: Output
+            }] } });
 
 const HYP_BASE_CONFIG = new InjectionToken('base config');
 
@@ -1471,7 +1674,8 @@ const enTranslations = {
                 name: 'Status',
                 NEW: 'Open',
                 IN_PROGRESS: 'In progress',
-                DONE: 'Done'
+                DONE: 'Done',
+                ASKED: 'Asked'
             },
             address: 'Address',
             source: 'External reference',
@@ -1496,6 +1700,7 @@ const enTranslations = {
                     detail: 'Information',
                     mandatory: '* Mandatory fields',
                     name: 'Name',
+                    id: 'Identifier',
                     category: 'Category',
                     close: 'Close all events',
                     closed: 'All closed',
@@ -1509,8 +1714,7 @@ const enTranslations = {
                     progress: 'Progress',
                     noAction: 'No actions',
                     name: 'Common procedure',
-                    name1: 'Procedure',
-                    addAction: 'Add action'
+                    name1: 'Procedure'
                 }
             },
             category: {
@@ -1541,6 +1745,11 @@ const enTranslations = {
                 multi: 'Close events',
                 comment: 'Close comment'
             },
+            installDate: 'Installation date',
+            managed: 'Managed equipment',
+            prm: 'PRM contract number',
+            presenceSensor: 'Presence sensor',
+            parent: 'Parent',
             consult: 'Consult {{howMany}} event{{plural}}'
         },
         eventSummary: {
@@ -1574,7 +1783,18 @@ const enTranslations = {
             missingProperty: 'Missing property',
             noContent: 'No existing procedures found',
             domain: 'Domain',
-            catalog: 'Procedure catalog'
+            catalog: 'Procedure catalog',
+            description: 'Description',
+            creator: 'Creator',
+            action: {
+                add: 'Add new Action',
+                CSU: 'Call CSU',
+                DOUTE: 'Ask for doubt removal',
+                SMS: 'Send a SMS',
+                AUTRE: 'Other',
+                SERVICE: 'Ask service',
+                EMAIL: 'Send an email'
+            }
         },
         associationModal: {
             title: 'Link a procedure',
@@ -1638,6 +1858,7 @@ const frTranslations = {
                     detail: 'Informations',
                     mandatory: '* Champs obligatoires',
                     name: 'Nom',
+                    id: 'Identifiant',
                     category: 'Catégorie',
                     close: 'Clôturer tous ces événements',
                     closed: 'Tous clôturés',
@@ -1651,8 +1872,7 @@ const frTranslations = {
                     progress: 'Progression',
                     noAction: "Pas d'action",
                     name: 'Procédure commune',
-                    name1: 'Procédure',
-                    addAction: 'Ajouter une action'
+                    name1: 'Procédure'
                 }
             },
             category: {
@@ -1721,7 +1941,20 @@ const frTranslations = {
             missingProperty: 'Propriété manquante',
             noContent: "Aucune procédure n'a été créée.",
             domain: 'Métier',
-            catalog: 'Bibliothèque des procédures'
+            catalog: 'Bibliothèque des procédures',
+            detail: "Détail d'une procédure",
+            actions: 'Actions associées',
+            description: 'Description',
+            creator: 'Créateur',
+            action: {
+                add: 'Ajouter une Action',
+                CSU: 'Appeler le CSU',
+                DOUTE: 'Demander une levée de doute',
+                SMS: 'Envoyer un SMS',
+                AUTRE: 'Autre',
+                SERVICE: 'Demander une intervention',
+                EMAIL: 'Envoyer un email'
+            }
         },
         associationModal: {
             title: 'Associer à une procédure',
@@ -1756,16 +1989,16 @@ class EventEffects {
         this.actions$ = actions$;
         this.eventService = eventService;
         this.store = store;
-        this.loadEvents$ = createEffect(() => this.actions$.pipe(ofType(EventActions.load), debounceTime$1(200), withLatestFrom(this.store.select(EventSelectors.events), this.store.select(EventSelectors.noMoreEvents)), filter(([action, events, noMore]) => !action.next || (action.next && !noMore)), mergeMap$1(([action, stateEvents]) => this.eventService.list(action.next ? stateEvents.length : 0).pipe(map((events) => EventActions.loadSuccess({ events, startingFrom: action.next ? stateEvents.length : 0 })), catchError$1((error) => [EventActions.loadFailure({ error: error })])))));
-        this.getEvent$ = createEffect(() => this.actions$.pipe(ofType(EventActions.get), debounceTime$1(200), mergeMap$1((action) => this.eventService.get(action.id).pipe(map((event) => EventActions.getSuccess({ event })), catchError$1((error) => [EventActions.getFailure({ error: error })])))));
-        this.getEventByName$ = createEffect(() => this.actions$.pipe(ofType(EventActions.getTooltipInfo), debounceTime$1(200), mergeMap$1((action) => this.eventService.getTooltipInfo(action.name).pipe(map((event) => EventActions.getTooltipInfoSuccess({ event })), catchError$1((error) => [EventActions.getTooltipInfoFailure({ error: error })])))));
-        this.getForProcedureEvent$ = createEffect(() => this.actions$.pipe(ofType(EventActions.getForProcedure), debounceTime$1(200), mergeMap$1((action) => this.eventService.getProcedure(action.id).pipe(map((procedure) => EventActions.getSuccess({ procedure })), catchError$1((error) => [EventActions.getFailure({ error: error })])))));
-        this.saveEvent$ = createEffect(() => this.actions$.pipe(ofType(EventActions.save), debounceTime$1(200), mergeMap$1((action) => this.eventService.save(action.event).pipe(map((event) => EventActions.saveSuccess({ event: action.event })), catchError$1((error) => [EventActions.saveFailure({ error: error })])))));
-        this.saveProcedure$ = createEffect(() => this.actions$.pipe(ofType(EventActions.saveProcedure), debounceTime$1(200), mergeMap$1((action) => this.eventService.saveProcedure(action.procedure).pipe(map((procedure) => EventActions.saveSuccess({ procedure: action.procedure })), catchError$1((error) => [EventActions.saveFailure({ error: error })])))));
-        this.refreshAfterSave$ = createEffect(() => this.actions$.pipe(ofType(EventActions.saveSuccess, EventActions.statusSuccess), debounceTime$1(200), map((action) => !!action.procedure
+        this.loadEvents$ = createEffect(() => this.actions$.pipe(ofType(EventActions.load), debounceTime(200), withLatestFrom(this.store.select(EventSelectors.events), this.store.select(EventSelectors.noMoreEvents)), filter(([action, events, noMore]) => !action.next || (action.next && !noMore)), mergeMap$1(([action, stateEvents]) => this.eventService.list(action.next ? stateEvents.length : 0).pipe(map((events) => EventActions.loadSuccess({ events, startingFrom: action.next ? stateEvents.length : 0 })), catchError$1((error) => [EventActions.loadFailure({ error: error })])))));
+        this.getEvent$ = createEffect(() => this.actions$.pipe(ofType(EventActions.get), debounceTime(200), mergeMap$1((action) => this.eventService.get(action.id).pipe(map((event) => EventActions.getSuccess({ event })), catchError$1((error) => [EventActions.getFailure({ error: error })])))));
+        this.getEventByName$ = createEffect(() => this.actions$.pipe(ofType(EventActions.getTooltipInfo), debounceTime(200), mergeMap$1((action) => this.eventService.getTooltipInfo(action.name).pipe(map((event) => EventActions.getTooltipInfoSuccess({ event })), catchError$1((error) => [EventActions.getTooltipInfoFailure({ error: error })])))));
+        this.getForProcedureEvent$ = createEffect(() => this.actions$.pipe(ofType(EventActions.getForProcedure), debounceTime(200), mergeMap$1((action) => this.eventService.getProcedure(action.id).pipe(map((procedure) => EventActions.getSuccess({ procedure })), catchError$1((error) => [EventActions.getFailure({ error: error })])))));
+        this.saveEvent$ = createEffect(() => this.actions$.pipe(ofType(EventActions.save), debounceTime(200), mergeMap$1((action) => this.eventService.save(action.event).pipe(map((event) => EventActions.saveSuccess({ event })), catchError$1((error) => [EventActions.saveFailure({ error: error })])))));
+        this.saveProcedure$ = createEffect(() => this.actions$.pipe(ofType(EventActions.saveProcedure), debounceTime(200), mergeMap$1((action) => this.eventService.saveProcedure(action.procedure).pipe(map((procedure) => EventActions.saveSuccess({ procedure })), catchError$1((error) => [EventActions.saveFailure({ error: error })])))));
+        this.refreshAfterSave$ = createEffect(() => this.actions$.pipe(ofType(EventActions.saveSuccess, EventActions.statusSuccess), debounceTime(200), map((action) => !!action.procedure
             ? EventActions.getForProcedure({ id: action.procedure.id })
             : EventActions.get({ id: action.event.id }))));
-        this.close$ = createEffect(() => this.actions$.pipe(ofType(EventActions.status), debounceTime$1(200), mergeMap$1((action) => {
+        this.close$ = createEffect(() => this.actions$.pipe(ofType(EventActions.status), debounceTime(200), mergeMap$1((action) => {
             if (!!action.event) {
                 return this.eventService.status(action.event, action.targetStatus, action.comment).pipe(mergeMap$1((event) => [
                     EventActions.statusSuccess({ event: action.event, procedure: action.procedure }),
@@ -1776,8 +2009,8 @@ class EventEffects {
                 return this.eventService.statusProcedure(action.procedure, action.targetStatus, action.comment).pipe(mergeMap$1((event) => [EventActions.statusSuccess({ procedure: action.procedure }), EventActions.load({})]), catchError$1((error) => [EventActions.statusFailure({ error: error })]));
             }
         })));
-        this.sort$ = createEffect(() => this.actions$.pipe(ofType(EventActions.sort), debounceTime$1(200), map(() => EventActions.load({}))));
-        this.filter$ = createEffect(() => this.actions$.pipe(ofType(EventActions.filter), filter((action) => action.filterSet === KNOWN_FILTER_SETS.EVENTS), debounceTime$1(200), map(() => EventActions.load({}))));
+        this.sort$ = createEffect(() => this.actions$.pipe(ofType(EventActions.sort), debounceTime(200), map(() => EventActions.load({}))));
+        this.filter$ = createEffect(() => this.actions$.pipe(ofType(EventActions.filter), filter((action) => action.filterSet === KNOWN_FILTER_SETS.EVENTS), debounceTime(200), map(() => EventActions.load({}))));
         this.associateProcedure$ = createEffect(() => this.actions$.pipe(ofType(EventActions.associateProcedure), mergeMap$1((action) => this.eventService.associateProcedure(action.procedureId).pipe(map(() => EventActions.load({})), catchError$1((error) => [EventActions.associateProcedureFailure({ error: error })])))));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: EventEffects, deps: [{ token: i1$3.Actions }, { token: EventService }, { token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Injectable }); }
@@ -1845,7 +2078,7 @@ class EventSummaryEffects {
     constructor(actions$, eventSummaryService) {
         this.actions$ = actions$;
         this.eventSummaryService = eventSummaryService;
-        this.loadSummaries$ = createEffect(() => this.actions$.pipe(ofType(EventSummaryActions.load), debounceTime$1(200), mergeMap$1((action) => this.eventSummaryService.list().pipe(map((summaries) => EventSummaryActions.loadSuccess({ summaries })), catchError$1((error) => [EventSummaryActions.loadFailure({ error: error })])))));
+        this.loadSummaries$ = createEffect(() => this.actions$.pipe(ofType(EventSummaryActions.load), debounceTime(200), mergeMap$1((action) => this.eventSummaryService.list().pipe(map((summaries) => EventSummaryActions.loadSuccess({ summaries })), catchError$1((error) => [EventSummaryActions.loadFailure({ error: error })])))));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: EventSummaryEffects, deps: [{ token: i1$3.Actions }, { token: EventSummaryService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: EventSummaryEffects }); }
@@ -1859,8 +2092,9 @@ class ProcedureEffects {
         this.actions$ = actions$;
         this.procedureService = procedureService;
         this.store = store;
-        this.loadProcedures$ = createEffect(() => this.actions$.pipe(ofType(ProcedureActions.load), debounceTime$1(200), withLatestFrom(this.store.select(ProcedureSelectors.procedures), this.store.select(ProcedureSelectors.noMoreProcedures)), filter(([action, stateProcedures, noMore]) => !noMore), mergeMap$1(([action, stateProcedures]) => this.procedureService.list(action.next ? stateProcedures.length : 0).pipe(map((procedures) => ProcedureActions.loadSuccess({ procedures, startingFrom: action.next ? stateProcedures.length : 0 })), catchError$1((error) => [ProcedureActions.loadFailure({ error: error })])))));
-        this.sort$ = createEffect(() => this.actions$.pipe(ofType(ProcedureActions.sort), debounceTime$1(200), map(() => ProcedureActions.load({}))));
+        this.loadProcedures$ = createEffect(() => this.actions$.pipe(ofType(ProcedureActions.load), debounceTime(200), withLatestFrom(this.store.select(ProcedureSelectors.procedures), this.store.select(ProcedureSelectors.noMoreProcedures)), filter(([action, stateProcedures, noMore]) => !noMore), mergeMap$1(([action, stateProcedures]) => this.procedureService.list(action.next ? stateProcedures.length : 0).pipe(map((procedures) => ProcedureActions.loadSuccess({ procedures, startingFrom: action.next ? stateProcedures.length : 0 })), catchError$1((error) => [ProcedureActions.loadFailure({ error: error })])))));
+        this.sort$ = createEffect(() => this.actions$.pipe(ofType(ProcedureActions.sort), debounceTime(200), map(() => ProcedureActions.load({}))));
+        this.model$ = createEffect(() => this.actions$.pipe(ofType(ProcedureActions.model), debounceTime(200), mergeMap$1((action) => this.procedureService.get(action.id).pipe(map((model) => ProcedureActions.modelSuccess({ model })), catchError$1((error) => [ProcedureActions.modelFailure({ error: error })])))));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureEffects, deps: [{ token: i1$3.Actions }, { token: ProcedureService }, { token: i1$1.Store }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ProcedureEffects }); }
@@ -1884,10 +2118,13 @@ const components = [
     ColumnOrderComponent,
     EventFiltersComponent,
     DateFilterComponent,
+    TextFilterComponent,
     ChoiceFilterComponent,
     ProcedureListComponent,
     ProcedureColumnOrderComponent,
-    ProcedureAssociationModalComponent
+    ProcedureAssociationModalComponent,
+    ProcedureModelDetailComponent,
+    ImmediateFiltersComponent
 ];
 class PvyHypervisorModule {
     static forRoot(options) {
@@ -1919,10 +2156,13 @@ class PvyHypervisorModule {
             ColumnOrderComponent,
             EventFiltersComponent,
             DateFilterComponent,
+            TextFilterComponent,
             ChoiceFilterComponent,
             ProcedureListComponent,
             ProcedureColumnOrderComponent,
-            ProcedureAssociationModalComponent], imports: [i1$1.StoreFeatureModule, i1$1.StoreFeatureModule, i1$1.StoreFeatureModule, i1$1.StoreFeatureModule, i1$3.EffectsFeatureModule, NgForOf,
+            ProcedureAssociationModalComponent,
+            ProcedureModelDetailComponent,
+            ImmediateFiltersComponent, ProcedureActionsComponent], imports: [i1$1.StoreFeatureModule, i1$1.StoreFeatureModule, i1$1.StoreFeatureModule, i1$1.StoreFeatureModule, i1$3.EffectsFeatureModule, NgForOf,
             AsyncPipe,
             PryI18nModule,
             PryCoreModule,
@@ -1950,10 +2190,13 @@ class PvyHypervisorModule {
             ColumnOrderComponent,
             EventFiltersComponent,
             DateFilterComponent,
+            TextFilterComponent,
             ChoiceFilterComponent,
             ProcedureListComponent,
             ProcedureColumnOrderComponent,
-            ProcedureAssociationModalComponent] }); }
+            ProcedureAssociationModalComponent,
+            ProcedureModelDetailComponent,
+            ImmediateFiltersComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: PvyHypervisorModule, imports: [StoreModule.forFeature(hypFeatureKey, hypervisorReducer),
             StoreModule.forFeature(eventFeatureKey, eventReducer),
             StoreModule.forFeature(eventSummaryFeatureKey, eventSummaryReducer),
@@ -1971,7 +2214,7 @@ class PvyHypervisorModule {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: PvyHypervisorModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [...components],
+                    declarations: [...components, ProcedureActionsComponent],
                     imports: [
                         StoreModule.forFeature(hypFeatureKey, hypervisorReducer),
                         StoreModule.forFeature(eventFeatureKey, eventReducer),
@@ -2009,5 +2252,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { CATEGORIES_BY_TYPE, ChoiceFilterComponent, ColumnOrderComponent, DOMAINS, DateFilterComponent, EVENT_LINK, EVENT_TO_ICON, EquipmentService, EventActions, EventColumnOrderComponent, EventDetailComponent, EventEffects, EventFiltersComponent, EventIconPipe, EventListComponent, EventSelectors, EventService, EventSummaryActions, EventSummaryEffects, EventSummaryItemComponent, EventSummaryListComponent, EventSummaryPageComponent, EventSummarySelectors, ForDatetimeLocalPipe, HYP_BASE_CONFIG, HypEventCategory, HypEventCriticality, HypEventStatus, HypEventType, HypSelectors, HypervisorActions, HypervisorEffects, HypervisorService, IconDisplayComponent, KNOWN_FILTER_SETS, PAGE_SIZE_FETCH, PROCEDURE_LINK, PROCEDURE_PAGE_SIZE_FETCH, ProcedureActions, ProcedureAssociationModalComponent, ProcedureColumnOrderComponent, ProcedureEffects, ProcedureListComponent, ProcedureSelectors, ProcedureService, ProgressDisplayComponent, PvyHypervisorModule, StatusDisplayComponent, enTranslations, eventFeatureKey, eventForWriteAPI, eventInitialState, eventReducer, eventSummaryFeatureKey, eventSummaryInitialState, eventSummaryReducer, frTranslations, hypFeatureKey, hypInitialState, hypervisorReducer, procedureFeatureKey, procedureForWriteAPI, procedureInitialState, procedureReducer };
+export { CATEGORIES_BY_TYPE, ChoiceFilterComponent, ColumnOrderComponent, DOMAINS, DateFilterComponent, EVENT_LINK, EVENT_TO_ICON, EquipmentService, EventActions, EventColumnOrderComponent, EventDetailComponent, EventEffects, EventFiltersComponent, EventIconPipe, EventListComponent, EventSelectors, EventService, EventSummaryActions, EventSummaryEffects, EventSummaryItemComponent, EventSummaryListComponent, EventSummaryPageComponent, EventSummarySelectors, ForDatetimeLocalPipe, HYP_BASE_CONFIG, HypEventCategory, HypEventCriticality, HypEventStatus, HypEventType, HypSelectors, HypervisorActions, HypervisorEffects, HypervisorService, IconDisplayComponent, ImmediateFiltersComponent, KNOWN_FILTER_SETS, PAGE_SIZE_FETCH, PROCEDURE_LINK, PROCEDURE_PAGE_SIZE_FETCH, ProcedureActions, ProcedureAssociationModalComponent, ProcedureColumnOrderComponent, ProcedureEffects, ProcedureListComponent, ProcedureModelDetailComponent, ProcedureSelectors, ProcedureService, ProgressDisplayComponent, PvyHypervisorModule, StatusDisplayComponent, TextFilterComponent, enTranslations, eventFeatureKey, eventForWriteAPI, eventInitialState, eventReducer, eventSummaryFeatureKey, eventSummaryInitialState, eventSummaryReducer, frTranslations, hypFeatureKey, hypInitialState, hypervisorReducer, padId, procedureFeatureKey, procedureForWriteAPI, procedureInitialState, procedureReducer };
 //# sourceMappingURL=provoly-hypervisor.mjs.map