npm - @eo-sdk/client - Versions diffs - 8.16.0-rc.2 → 8.16.0-rc.4 - Mend

@eo-sdk/client 8.16.0-rc.2 → 8.16.0-rc.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (41) hide show

package/bundles/eo-sdk-client.umd.js CHANGED Viewed

@@ -3593,7 +3593,8 @@
             }
         };
         OutsideClickDirective.prototype.onClick = function (event, targetElement) {
-            if (this.active && !this._elementRef.nativeElement.contains(targetElement)) {
+            var overlayContainer = document.querySelector('.cdk-overlay-container');
+            if (this.active && !this._elementRef.nativeElement.contains(targetElement) && overlayContainer ? !overlayContainer.contains(targetElement) : false) {
                 this.onOutsideEvent(event);
             }
         };
@@ -4169,6 +4170,7 @@
             _this.align = 'center';
             _this.isFormTable = false;
             _this.showPreview = false;
+            _this.hasPreviewFile = false;
             _this.onTogglePreview = new i0.EventEmitter();
             _this.visibleChange = new i0.EventEmitter();
             _this.hide = new i0.EventEmitter();
@@ -4224,7 +4226,7 @@
             // this.overlayRef.addPanelClass("example-overlay");
             this.overlayRef.attach(portal$1);
             this.overlayRef.backdropClick().subscribe(function (_) {
-                _this.visible = false;
+                _this.closeDialog();
             });
         };
         EoDialogComponent.prototype.getPositionStrategy = function () {
@@ -4293,7 +4295,7 @@
     EoDialogComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'eo-dialog',
-                    template: "<ng-template #dialogContent>\r\n  <div class=\"eo-dialog\" [ngClass]=\"styleClass || ''\" eoRtlAware=\"dir\">\r\n    <header class=\"eo-dialog-header\" [ngClass]=\"styleClass ? styleClass + '--header ' : ''\">\r\n      <h5 class=\"headline\">{{title}}</h5>\r\n      <h6 *ngIf=\"subtitle\" class=\"subtitle\">{{subtitle}}</h6>\r\n      <eo-icon [iconSrc]=\"'assets/_default/svg/ic_clear.svg'\" (click)=\"closeDialog()\" class=\"button white eo-dialog-close\"></eo-icon>\r\n      <ng-container *ngIf=\"isFormTable\">\r\n        <eo-icon *ngIf=\"showPreview\" [iconSrc]=\"'assets/_default/svg/ic_preview_close.svg'\"\r\n                 [iconTitle]=\"'eo.form.table.dialog.preview.hide' | translate\" (click)=\"togglePreview()\" class=\"button white eo-dialog-preview-toggle\"></eo-icon>\r\n        <eo-icon *ngIf=\"!showPreview\" [iconSrc]=\"'assets/_default/svg/ic_preview_show.svg'\"\r\n                 [iconTitle]=\"'eo.form.table.dialog.preview.show' | translate\" (click)=\"togglePreview()\" class=\"button white eo-dialog-preview-toggle\"></eo-icon>\r\n      </ng-container>\r\n    </header>\r\n    <div class=\"eo-dialog-content\" [ngClass]=\"styleClass ? styleClass + '--content ' : ''\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n",
+                    template: "<ng-template #dialogContent>\r\n  <div class=\"eo-dialog\" [ngClass]=\"styleClass || ''\" eoRtlAware=\"dir\">\r\n    <header class=\"eo-dialog-header\" [ngClass]=\"styleClass ? styleClass + '--header ' : ''\">\r\n      <h5 class=\"headline\">{{title}}</h5>\r\n      <h6 *ngIf=\"subtitle\" class=\"subtitle\">{{subtitle}}</h6>\r\n      <eo-icon [iconSrc]=\"'assets/_default/svg/ic_clear.svg'\" (click)=\"closeDialog()\" class=\"button white eo-dialog-close\"></eo-icon>\r\n      <ng-container *ngIf=\"isFormTable && hasPreviewFile\">\r\n        <eo-icon *ngIf=\"showPreview\" [iconSrc]=\"'assets/_default/svg/ic_preview_close.svg'\"\r\n                 [iconTitle]=\"'eo.form.table.dialog.preview.hide' | translate\" (click)=\"togglePreview()\" class=\"button white eo-dialog-preview-toggle\"></eo-icon>\r\n        <eo-icon *ngIf=\"!showPreview\" [iconSrc]=\"'assets/_default/svg/ic_preview_show.svg'\"\r\n                 [iconTitle]=\"'eo.form.table.dialog.preview.show' | translate\" (click)=\"togglePreview()\" class=\"button white eo-dialog-preview-toggle\"></eo-icon>\r\n      </ng-container>\r\n    </header>\r\n    <div class=\"eo-dialog-content\" [ngClass]=\"styleClass ? styleClass + '--content ' : ''\">\r\n      <ng-content></ng-content>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n",
                     encapsulation: i0.ViewEncapsulation.None,
                     styles: [".eo-dialog{-webkit-animation:none;animation:none;background-color:var(--panel-background);display:flex;flex:1;flex-direction:column;max-height:100%;max-width:100%;min-height:0;min-width:0}.eo-dialog-close{position:absolute;right:5px;top:5px;z-index:2}.eo-dialog-preview-toggle{position:absolute;right:5px;top:50px;z-index:2}.eo-dialog-header{background-color:var(--color-accent);color:var(--color-white);flex:0 0 auto;font-size:var(--font-headline);font-weight:var(--font-weight-light);padding:var(--app-pane-padding) calc(var(--app-pane-padding)*2.5) calc(var(--app-pane-padding)*2) var(--app-pane-padding)}.eo-dialog-header .headline{font-size:24px;font-weight:400;margin:0 25px 0 0}.eo-dialog-header .subtitle{font-size:15px;font-weight:400;margin:0}.eo-dialog-content{display:flex;flex:1;flex-direction:column;height:100%;max-height:520px;min-height:0;min-width:0;overflow:auto;position:relative}.eo-dialog-content>eo-tree{margin:var(--app-pane-padding)}.eo-dialog-content .empty{align-items:center;color:var(--text-color-caption);display:flex;flex:1;flex-direction:column;justify-content:center;min-height:0;min-width:0;padding:var(--app-pane-padding)}.eo-dialog-content .action-buttons{justify-content:flex-end;padding-top:32px}.eo-dialog-content button:not(:last-child){margin-right:5px}.object-form-table-dialog{background-color:var(--panel-background-grey);height:95vh;width:100%}.object-form-table-dialog .body{height:80vh;width:100%}.object-form-table-dialog .edit-body{display:flex;height:100%}.object-form-table-dialog .table-body{background-color:var(--panel-background-grey);display:flex;height:100%;width:100%}.object-form-table-dialog eo-split{padding:var(--app-pane-padding);width:auto!important}.object-form-table-dialog eo-split-area{box-shadow:0 2px 5px 0 rgba(0,0,0,.2)}.object-form-table-dialog eo-row-edit{background-color:var(--color-white);display:flex;flex:1;flex-direction:column;min-height:0;min-width:0}.object-form-table-dialog eo-row-edit .row-edit{display:flex;flex-direction:column;height:100%}.object-form-table-dialog eo-row-edit .row-edit .edit-header{display:flex;justify-content:space-between}.object-form-table-dialog eo-row-edit .row-edit .edit-header .new-indicator{color:var(--text-color-caption);font-size:var(--font-title);margin:8px 16px 0;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.object-form-table-dialog eo-row-edit .row-edit .edit-header .cancel-icon{color:var(--text-color-caption);margin:8px 8px 0}.object-form-table-dialog eo-row-edit .row-edit .edit-header .cancel-icon:hover{background:rgba(var(--color-black-rgb),.1)}.object-form-table-dialog eo-row-edit .row-edit .form{height:100%;overflow:auto}.object-form-table-dialog eo-row-edit .row-edit .actions{align-items:center;border-top:1px solid var(--panel-header-border-bottom-color);display:flex;flex:0;flex-direction:row;justify-content:flex-end;min-height:0;min-height:5em;min-width:0;padding-right:var(--app-pane-padding)}.object-form-table-dialog eo-row-edit .row-edit .actions button{height:3em;margin:0 calc(var(--app-pane-padding)/8);padding:0 calc(var(--app-pane-padding)/2)}.object-form-table-dialog eo-row-edit .row-edit .actions eo-checkbox{margin:0 calc(var(--app-pane-padding)/2)}.object-form-table-dialog eo-row-edit .row-edit .actions .add-label{color:var(--text-color-caption);font-size:var(--font-body);margin-right:var(--app-pane-padding)}.object-form-table-dialog .object-form-table{background-color:#fff;display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr;height:100%;width:100%}.object-form-table-dialog .object-form-table .grid-body{height:100%;position:relative;width:100%}.object-form-table-dialog .object-form-table .grid-body .ag-theme-balham .ag-header{background-color:unset!important}.object-form-table-dialog .object-form-table .grid-body ag-grid-angular{background-color:transparent;height:100%;width:100%}.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .copy-cell,.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .new-row{-webkit-animation-duration:4s;-webkit-animation-name:new-row;animation-duration:4s;animation-name:new-row}@-webkit-keyframes new-row{0%{background-color:var(--color-accent)}to{background-color:none}}@keyframes new-row{0%{background-color:var(--color-accent)}to{background-color:none}}.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .ag-cell{align-items:center;display:flex;font-size:var(--font-caption);line-height:var(--oft-row-height);padding:0 calc(var(--app-pane-padding)/4)}.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .ag-cell.ag-cell-focus{background-color:var(--list-item-hover-background);border-color:transparent!important;outline:0!important}.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .ag-cell svg{pointer-events:none}.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .ag-cell.col-boolean,.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .ag-cell.res-ico{justify-content:center}.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .ag-cell.col-number{justify-content:flex-end}.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .ag-cell .action-icon{cursor:pointer;display:flex}.object-form-table-dialog .object-form-table .grid-body ag-grid-angular .ag-cell .action-icon svg{fill:var(--text-color-caption)}.object-form-table-dialog .label{align-items:center;border-bottom:0;display:flex;flex-flow:row nowrap;padding:calc(var(--app-pane-padding)/4) calc(var(--app-pane-padding)/4) calc(var(--app-pane-padding)/2) calc(var(--app-pane-padding)/4)}.object-form-table-dialog .label span{display:block;flex:1 1 auto}.object-form-table-dialog .label eo-icon.stf{color:var(--text-color-caption);cursor:pointer;height:20px;margin:calc(var(--app-pane-padding)/4);width:20px}.object-form-table-dialog .label eo-icon.stf.add-row{background-color:var(--color-accent);border-radius:2px;color:#fff;height:24px;width:24px}.object-form-table-dialog .label button.add{border-radius:2px;padding:calc(var(--app-pane-padding)/2)}.object-form-table-dialog .label button.export{border:1px solid #000;border-radius:2px;color:#000;font-size:var(--font-hint);margin:0 calc(var(--app-pane-padding)/4);padding:calc(var(--app-pane-padding)/8) calc(var(--app-pane-padding)/4)}.object-form-table-dialog .eo-dialog-content{height:100%;max-height:none;overflow:hidden}.object-form-table-dialog .table-area{overflow:unset!important}.cdk-overlay-pane{position:absolute!important}"]
                 },] }
@@ -4318,6 +4320,7 @@
         align: [{ type: i0.Input }],
         isFormTable: [{ type: i0.Input }],
         showPreview: [{ type: i0.Input }],
+        hasPreviewFile: [{ type: i0.Input }],
         onTogglePreview: [{ type: i0.Output }],
         visibleChange: [{ type: i0.Output }],
         hide: [{ type: i0.Output }],
@@ -5542,11 +5545,13 @@
      * Component rendering the app-bar action of starting executable processes.
      */
     var AppProcessComponent = /** @class */ (function () {
-        function AppProcessComponent(router, toaster, translate, bpmService) {
+        function AppProcessComponent(router, toaster, translate, bpmService, pendingChanges) {
             this.router = router;
             this.toaster = toaster;
             this.translate = translate;
             this.bpmService = bpmService;
+            this.pendingChanges = pendingChanges;
+            this.pendingTaskIds = [];
         }
         AppProcessComponent.prototype.close = function (evt) {
             this.router.navigate([{ outlets: { modal: null } }], { replaceUrl: true });
@@ -5602,6 +5607,24 @@
         AppProcessComponent.prototype.cancelDialog = function () {
             this.processForm = null;
         };
+        AppProcessComponent.prototype.startPending = function () {
+            // because this method will be called every time the form status changes,
+            // pending task will only be started once until it was finished
+            if (!this.pendingChanges.hasPendingTask(this.pendingTaskIds[0] || ' ')) {
+                this.pendingTaskIds = [this.pendingChanges.startTask()];
+            }
+        };
+        AppProcessComponent.prototype.finishPending = function () {
+            this.pendingChanges.finishTask(this.pendingTaskIds[0]);
+        };
+        AppProcessComponent.prototype.onIndexDataChanged = function (event) {
+            if (event.dirty) {
+                this.startPending();
+            }
+            else {
+                this.finishPending();
+            }
+        };
         AppProcessComponent.prototype.ngOnInit = function () {
             var _this = this;
             this.bpmService.getExecutableProcesses(null, true)
@@ -5612,7 +5635,7 @@
     AppProcessComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'eo-app-process',
-                    template: "<eo-dialog [title]=\"'eo.bar.button.execute.actions.tooltip' | translate\"\r\n           [visible]=\"true\"\r\n           [minWidth]=\"400\"\r\n           [styleClass]=\"'more-actions'\"\r\n           (hide)=\"close($event)\">\r\n\r\n  <section *ngIf=\"processes?.length; else loading\">\r\n\r\n    <div class=\"process-item\" *ngFor=\"let process of processes\" (click)=\"selectProcess(process)\">\r\n      <eo-icon [iconId]=\"process.iconid\" *ngIf=\"process.iconid; else defaulticon\"></eo-icon>\r\n      <ng-template #defaulticon><eo-icon [iconSrc]=\"'assets/_default/svg/ic_bpm.svg'\"></eo-icon></ng-template>\r\n      <div class=\"pi-content\">\r\n        <div class=\"title\">{{process.title}}</div>\r\n        <div class=\"description\">{{process.description}}</div>\r\n      </div>\r\n    </div>\r\n\r\n  </section>\r\n\r\n  <ng-container *ngIf=\"!processForm; else tplProcessForm\" class=\"select-process\"></ng-container>\r\n\r\n  <ng-template #loading>\r\n    <eo-loading-spinner [size]=\"'medium'\"></eo-loading-spinner>\r\n  </ng-template>\r\n\r\n\r\n  <ng-template #tplProcessForm>\r\n\r\n    <eo-dialog [title]=\"selectedProcess?.title\"\r\n               [subtitle]=\"selectedProcess?.description\"\r\n               [visible]=\"true\"\r\n               [minWidth]=\"1000\"\r\n               [minHeight]=\"630\"\r\n               [styleClass]=\"'process-form-dialog'\"\r\n               (hide)=\"cancelDialog()\" #dialog>\r\n\r\n      <eo-process-form [formOptions]=\"processForm\"\r\n                      (onResetForm)=\"formReset($event)\"\r\n                      (onCancel)=\"(dialog.visible = false)\"\r\n                      (onSaveForm)=\"startProcessWithFormData($event)\">\r\n      </eo-process-form>\r\n    </eo-dialog>\r\n  </ng-template>\r\n\r\n</eo-dialog>\r\n",
+                    template: "<eo-dialog [title]=\"'eo.bar.button.execute.actions.tooltip' | translate\"\r\n           [visible]=\"true\"\r\n           [minWidth]=\"400\"\r\n           [styleClass]=\"'more-actions'\"\r\n           (hide)=\"close($event)\">\r\n\r\n  <section *ngIf=\"processes?.length; else loading\">\r\n\r\n    <div class=\"process-item\" *ngFor=\"let process of processes\" (click)=\"selectProcess(process)\">\r\n      <eo-icon [iconId]=\"process.iconid\" *ngIf=\"process.iconid; else defaulticon\"></eo-icon>\r\n      <ng-template #defaulticon><eo-icon [iconSrc]=\"'assets/_default/svg/ic_bpm.svg'\"></eo-icon></ng-template>\r\n      <div class=\"pi-content\">\r\n        <div class=\"title\">{{process.title}}</div>\r\n        <div class=\"description\">{{process.description}}</div>\r\n      </div>\r\n    </div>\r\n\r\n  </section>\r\n\r\n  <ng-container *ngIf=\"!processForm; else tplProcessForm\" class=\"select-process\"></ng-container>\r\n\r\n  <ng-template #loading>\r\n    <eo-loading-spinner [size]=\"'medium'\"></eo-loading-spinner>\r\n  </ng-template>\r\n\r\n\r\n  <ng-template #tplProcessForm>\r\n\r\n    <eo-dialog [title]=\"selectedProcess?.title\"\r\n               [subtitle]=\"selectedProcess?.description\"\r\n               [visible]=\"true\"\r\n               [dirtyCheck]=\"pendingTaskIds\"\r\n               [minWidth]=\"1000\"\r\n               [minHeight]=\"630\"\r\n               [styleClass]=\"'process-form-dialog'\"\r\n               (hide)=\"cancelDialog()\" #dialog>\r\n\r\n      <eo-process-form [formOptions]=\"processForm\"\r\n                      (onResetForm)=\"formReset($event)\"\r\n                      (onCancel)=\"(dialog.visible = false)\"\r\n                      (onSaveForm)=\"startProcessWithFormData($event)\"\r\n                      (statusChanged)=\"onIndexDataChanged($event)\">\r\n      </eo-process-form>\r\n    </eo-dialog>\r\n  </ng-template>\r\n\r\n</eo-dialog>\r\n",
                     styles: [".process-item{align-items:center;border-bottom:1px solid var(--list-item-border-color);cursor:pointer;display:flex;padding:var(--app-pane-padding)}.process-item:hover{background-color:var(--list-item-hover-background)}.process-item eo-icon{opacity:.7}.process-item .pi-content{padding:0 var(--app-pane-padding)}.process-item .pi-content .description{color:var(--text-color-caption)}eo-loading-spinner{display:flex;justify-content:center;padding:var(--app-pane-padding)}"]
                 },] }
     ];
@@ -5620,7 +5643,8 @@
         { type: i2.Router },
         { type: i1.NotificationsService },
         { type: i1.TranslateService },
-        { type: i1.BpmService }
+        { type: i1.BpmService },
+        { type: PendingChangesService }
     ]; };
     var routes = [
@@ -6866,7 +6890,7 @@
     var DatepickerComponent = /** @class */ (function () {
         function DatepickerComponent(translate, datepickerService) {
             this.datepickerService = datepickerService;
-            this.maxYear = 99999;
+            this.maxYear = 9999;
             this.minYear = 0;
             // ngModel for the year input
             // ngModel for the time inputs
@@ -11537,7 +11561,7 @@
     FormElementTableComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'eo-table',
-                    template: "<div class=\"object-form-table\" [ngClass]=\"{medium: _params.size === 'medium', large: _params.size === 'large'}\">\r\n  <div class=\"label\">\r\n    <span>{{_params.element.label}}</span>\r\n    <ng-container *ngIf=\"_params.situation !== 'SEARCH'\">\r\n\r\n      <eo-icon class=\"stf\" [iconSrc]=\"'assets/_default/svg/ic_expand.svg'\" [iconTitle]=\"('eo.form.table.options.btn.open'| translate)\" (click)=\"openDialog()\"></eo-icon>\r\n      <eo-icon class=\"stf\" [iconSrc]=\"'assets/_default/svg/ic_size_to_fit.svg'\" [iconTitle]=\"('eo.form.table.options.btn.fit'| translate)\" (click)=\"sizeToFit()\"></eo-icon>\r\n      <eo-icon class=\"stf\" *ngIf=\"gridOptions.rowData.length\" [iconSrc]=\"'assets/_default/svg/ic_content-download.svg'\" [iconTitle]=\"('eo.form.table.options.btn.csv'| translate)\" (click)=\"exportCSV()\"></eo-icon>\r\n      <eo-icon class=\"stf add-row\" *ngIf=\"!_params.element.readonly\" [iconSrc]=\"'assets/_default/svg/ic_add.svg'\" [iconTitle]=\"('eo.form.table.options.btn.add'| translate)\" (click)=\"addRow()\"></eo-icon>\r\n\r\n    </ng-container>\r\n  </div>\r\n  <div class=\"grid-body size-{{ params.size }}\">\r\n    <ag-grid-angular #agGrid *ngIf=\"gridReady\" class=\"ag-theme-balham\" [modules]=\"modules\"\r\n                     [gridOptions]=\"gridOptions\"\r\n                     (rowDoubleClicked)=\"editRow($event)\"\r\n                     (cellClicked)=\"onCellClicked($event)\"\r\n                     (sortChanged)=\"onSortChanged()\"\r\n                     (cellValueChanged)=\"onEditComplete($event)\"\r\n                     (columnResized)=\"onColumnResized($event.column)\">\r\n    </ag-grid-angular>\r\n  </div>\r\n</div>\r\n\r\n\r\n<eo-dialog\r\n[title]=\"params.element.label\"\r\n[visible]=\"showDialog\"\r\n[dirtyCheck]=\"rowEdit?.pendingTaskId\"\r\n[minWidth]=\"_params.situation !== 'SEARCH' ? '97vw' : 200\"\r\n[styleClass]=\"'object-form-table-dialog'\"\r\n(hide)=\"onClose()\"\r\n[isFormTable]=\"true\"\r\n[showPreview]=\"showPreview\"\r\n(onTogglePreview)=\"togglePreview()\">\r\n\r\n  <div class=\"body\">\r\n\r\n      <eo-split [gutterSize]=\"16\" [switchable]=\"true\">\r\n\r\n        <eo-split-area *ngIf=\"_params.situation !== 'SEARCH'\" class=\"table-area\" [size]=\"50\" [minSizePixel]=\"100\">\r\n          <div class=\"table-body\">\r\n            <div class=\"object-form-table\">\r\n              <div class=\"label\">\r\n                <span></span>\r\n                <ng-container>\r\n                  <eo-icon class=\"stf\" [iconSrc]=\"'assets/_default/svg/ic_size_to_fit.svg'\" [iconTitle]=\"('eo.form.table.options.btn.fit'| translate)\" (click)=\"sizeToFit(true)\"></eo-icon>\r\n                  <eo-icon class=\"stf\" *ngIf=\"gridOptions.rowData.length\" [iconSrc]=\"'assets/_default/svg/ic_content-download.svg'\" [iconTitle]=\"('eo.form.table.options.btn.csv'| translate)\" (click)=\"exportCSV()\"></eo-icon>\r\n                  <eo-icon class=\"stf add-row\" *ngIf=\"!_params.element.readonly\" [iconSrc]=\"'assets/_default/svg/ic_add.svg'\" [iconTitle]=\"('eo.form.table.options.btn.add'| translate)\" (click)=\"addRow()\"></eo-icon>\r\n                </ng-container>\r\n              </div>\r\n              <div class=\"grid-body\">\r\n                <ag-grid-angular #agGrid2 *ngIf=\"gridReady\" class=\"ag-theme-balham\" [modules]=\"modules\"\r\n                                [gridOptions]=\"overlayGridOptions\"\r\n                                (cellClicked)=\"onCellClicked($event);editRow($event)\"\r\n                                (mousedown)=\"onMouseDown($event)\"\r\n                                (sortChanged)=\"onSortChanged()\"\r\n                                 (cellValueChanged)=\"onEditComplete($event)\"\r\n                                 (columnResized)=\"onColumnResized($event.column, true)\">\r\n                </ag-grid-angular>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </eo-split-area>\r\n\r\n        <eo-split-area [size]=\"15\" [minSizePixel]=\"300\" *ngIf=\"editingRow\">\r\n          <div class=\"edit-body\">\r\n            <eo-row-edit [row]=\"editingRow\" #rowEdit\r\n                          (onSave)=\"updateRow($event)\"\r\n                          (onSaveCopy)=\"copyRow($event)\"\r\n                          (onDelete)=\"deleteRow($event)\"\r\n                          (onCancel)=\"cancelRowEdit()\"></eo-row-edit>\r\n          </div>\r\n        </eo-split-area>\r\n\r\n        <eo-split-area *ngIf=\"editingRow && showPreview\" [size]=\"10\" [minSizePixel]=\"150\">\r\n          <eo-media *ngIf=\"dmsObject\" [dmsObject]=\"dmsObject\"\r\n                    [useVersion]=\"dmsObject.id === dmsObject.content?.id\"></eo-media>\r\n        </eo-split-area>\r\n      </eo-split>\r\n  </div>\r\n</eo-dialog>\r\n\r\n",
+                    template: "<div class=\"object-form-table\" [ngClass]=\"{medium: _params.size === 'medium', large: _params.size === 'large'}\">\r\n  <div class=\"label\">\r\n    <span>{{_params.element.label}}</span>\r\n    <ng-container *ngIf=\"_params.situation !== 'SEARCH'\">\r\n\r\n      <eo-icon class=\"stf\" [iconSrc]=\"'assets/_default/svg/ic_expand.svg'\" [iconTitle]=\"('eo.form.table.options.btn.open'| translate)\" (click)=\"openDialog()\"></eo-icon>\r\n      <eo-icon class=\"stf\" [iconSrc]=\"'assets/_default/svg/ic_size_to_fit.svg'\" [iconTitle]=\"('eo.form.table.options.btn.fit'| translate)\" (click)=\"sizeToFit()\"></eo-icon>\r\n      <eo-icon class=\"stf\" *ngIf=\"gridOptions.rowData.length\" [iconSrc]=\"'assets/_default/svg/ic_content-download.svg'\" [iconTitle]=\"('eo.form.table.options.btn.csv'| translate)\" (click)=\"exportCSV()\"></eo-icon>\r\n      <eo-icon class=\"stf add-row\" *ngIf=\"!_params.element.readonly\" [iconSrc]=\"'assets/_default/svg/ic_add.svg'\" [iconTitle]=\"('eo.form.table.options.btn.add'| translate)\" (click)=\"addRow()\"></eo-icon>\r\n\r\n    </ng-container>\r\n  </div>\r\n  <div class=\"grid-body size-{{ params.size }}\">\r\n    <ag-grid-angular #agGrid *ngIf=\"gridReady\" class=\"ag-theme-balham\" [modules]=\"modules\"\r\n                     [gridOptions]=\"gridOptions\"\r\n                     (rowDoubleClicked)=\"editRow($event)\"\r\n                     (cellClicked)=\"onCellClicked($event)\"\r\n                     (sortChanged)=\"onSortChanged()\"\r\n                     (cellValueChanged)=\"onEditComplete($event)\"\r\n                     (columnResized)=\"onColumnResized($event.column)\">\r\n    </ag-grid-angular>\r\n  </div>\r\n</div>\r\n\r\n\r\n<eo-dialog\r\n[title]=\"params.element.label\"\r\n[visible]=\"showDialog\"\r\n[dirtyCheck]=\"rowEdit?.pendingTaskId\"\r\n[minWidth]=\"_params.situation !== 'SEARCH' ? '97vw' : 200\"\r\n[styleClass]=\"'object-form-table-dialog'\"\r\n(hide)=\"onClose()\"\r\n[isFormTable]=\"true\"\r\n[hasPreviewFile]=\"!!dmsObject?.content\"\r\n[showPreview]=\"showPreview\"\r\n(onTogglePreview)=\"togglePreview()\">\r\n\r\n  <div class=\"body\">\r\n\r\n      <eo-split [gutterSize]=\"16\" [switchable]=\"true\">\r\n\r\n        <eo-split-area *ngIf=\"_params.situation !== 'SEARCH'\" class=\"table-area\" [size]=\"50\" [minSizePixel]=\"100\">\r\n          <div class=\"table-body\">\r\n            <div class=\"object-form-table\">\r\n              <div class=\"label\">\r\n                <span></span>\r\n                <ng-container>\r\n                  <eo-icon class=\"stf\" [iconSrc]=\"'assets/_default/svg/ic_size_to_fit.svg'\" [iconTitle]=\"('eo.form.table.options.btn.fit'| translate)\" (click)=\"sizeToFit(true)\"></eo-icon>\r\n                  <eo-icon class=\"stf\" *ngIf=\"gridOptions.rowData.length\" [iconSrc]=\"'assets/_default/svg/ic_content-download.svg'\" [iconTitle]=\"('eo.form.table.options.btn.csv'| translate)\" (click)=\"exportCSV()\"></eo-icon>\r\n                  <eo-icon class=\"stf add-row\" *ngIf=\"!_params.element.readonly\" [iconSrc]=\"'assets/_default/svg/ic_add.svg'\" [iconTitle]=\"('eo.form.table.options.btn.add'| translate)\" (click)=\"addRow()\"></eo-icon>\r\n                </ng-container>\r\n              </div>\r\n              <div class=\"grid-body\">\r\n                <ag-grid-angular #agGrid2 *ngIf=\"gridReady\" class=\"ag-theme-balham\" [modules]=\"modules\"\r\n                                [gridOptions]=\"overlayGridOptions\"\r\n                                (cellClicked)=\"onCellClicked($event);editRow($event)\"\r\n                                (mousedown)=\"onMouseDown($event)\"\r\n                                (sortChanged)=\"onSortChanged()\"\r\n                                 (cellValueChanged)=\"onEditComplete($event)\"\r\n                                 (columnResized)=\"onColumnResized($event.column, true)\">\r\n                </ag-grid-angular>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </eo-split-area>\r\n\r\n        <eo-split-area [size]=\"15\" [minSizePixel]=\"300\" *ngIf=\"editingRow\">\r\n          <div class=\"edit-body\">\r\n            <eo-row-edit [row]=\"editingRow\" #rowEdit\r\n                          (onSave)=\"updateRow($event)\"\r\n                          (onSaveCopy)=\"copyRow($event)\"\r\n                          (onDelete)=\"deleteRow($event)\"\r\n                          (onCancel)=\"cancelRowEdit()\"></eo-row-edit>\r\n          </div>\r\n        </eo-split-area>\r\n\r\n        <eo-split-area *ngIf=\"editingRow && showPreview && !!dmsObject?.content\" [size]=\"10\" [minSizePixel]=\"150\">\r\n          <eo-media *ngIf=\"dmsObject\" [dmsObject]=\"dmsObject\"\r\n                    [useVersion]=\"dmsObject.id === dmsObject.content?.id\"></eo-media>\r\n        </eo-split-area>\r\n      </eo-split>\r\n  </div>\r\n</eo-dialog>\r\n\r\n",
                     providers: [
                         {
                             provide: forms.NG_VALUE_ACCESSOR,
@@ -14441,7 +14465,7 @@
                 };
                 if (this.pagination) {
                     this.pagingForm.get('page').setValue(this.pagination.page);
-                    this.pagingForm.get('page').setValidators([forms.Validators.required, forms.Validators.pattern('[0-9]+'), forms.Validators.min(1), forms.Validators.max(this.isGreater ? Infinity : this.pagination.pages)]);
+                    this.pagingForm.get('page').setValidators([forms.Validators.required, forms.Validators.pattern('[0-9]+'), forms.Validators.min(1), forms.Validators.max(this.isGreater ? 100000 : this.pagination.pages)]);
                 }
             },
             enumerable: false,
@@ -15723,6 +15747,7 @@
         };
         MediaComponent.prototype.toogleViewer = function () {
             this.open = !this.disabled && !!this.previewUri;
+            this.undockDisabled = this.previewUri === '';
             if (this.undockDisabled) {
                 this.isUndocked = false;
             }
@@ -15817,7 +15842,7 @@
                 }
             }
             else if (!src && !this.undockWin.document.querySelector('#no-file')) {
-                this.undockWin.document.write("<div id=\"no-file\" style=\"opacity: 0.06; display: flex; height: 100%; width: 100%; align-items: center; justify-content: center;\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"128\" height=\"128\" viewBox=\"0 0 48 48\">\n          <path d=\"M29 4H14.6c-.8 0-1.5.2-2 .6l27.2 27.2v-17L29 4zm-.7 11.6V7.8l7.8 7.8h-7.8zM43.4 40.8l-2.5 2.5-3.5-3.5c-.4.1-.8.2-1.2.2H14.6c-2 \n          0-3.6-1.6-3.6-3.6V13.5L5.9 8.4l2.5-2.5L11 8.4l28.7 28.7 3.1 3.1.6.6z\"/>\n          </svg>\n        <div>");
+                this.undockWin.document.write("<div id=\"no-file\" style=\"opacity: 0.06; display: flex; height: 100%; width: 100%; align-items: center; justify-content: center;\">\n          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"128\" height=\"128\" viewBox=\"0 0 48 48\">\n          <path d=\"M29 4H14.6c-.8 0-1.5.2-2 .6l27.2 27.2v-17L29 4zm-.7 11.6V7.8l7.8 7.8h-7.8zM43.4 40.8l-2.5 2.5-3.5-3.5c-.4.1-.8.2-1.2.2H14.6c-2\n          0-3.6-1.6-3.6-3.6V13.5L5.9 8.4l2.5-2.5L11 8.4l28.7 28.7 3.1 3.1.6.6z\"/>\n          </svg>\n        <div>");
             }
         };
         MediaComponent.prototype.loadDocument = function (uri, force) {
@@ -15914,7 +15939,7 @@
                     var win = _this.setApi(iframe);
                     onload && onload();
                     setTimeout(function () {
-                        // this.loading = false;
+                        // this.loading = false;
                         _this.searchPDF(_this.searchTerm, win);
                         _this.preventDropEvent(win);
                     }, 100);
@@ -17596,7 +17621,7 @@
         AddSubscriptionActionComponent.prototype.isExecutable = function (element) {
             var hasPrivilege = this.userService.getCurrentUser().hasPrivilege('MANAGE_SUBSCRIPTIONS');
             var isAllowedType = this.actionService.isAllowedType([element], ['sysemail']);
-            if (hasPrivilege && this.isAllowedState() && isAllowedType) {
+            if (hasPrivilege && this.isAllowedState() && isAllowedType && !element.isFinalized) {
                 return rxjs.of(!element.subscriptions.length);
             }
             else {
@@ -17890,7 +17915,7 @@
         AddResubmissionActionComponent.prototype.isExecutable = function (element) {
             var hasPrivilege = this.userService.getCurrentUser().hasPrivilege('MANAGE_RESUBMISSIONS');
             var isAllowedType = this.actionService.isAllowedType([element], ['sysemail']);
-            if (hasPrivilege && this.isAllowedState() && isAllowedType) {
+            if (hasPrivilege && this.isAllowedState() && isAllowedType && !element.isFinalized) {
                 return rxjs.of(!element.resubmissions.length);
             }
             else {
@@ -18273,6 +18298,7 @@
             this.onSaveForm = new i0.EventEmitter();
             this.onResetForm = new i0.EventEmitter();
             this.onCancel = new i0.EventEmitter();
+            this.statusChanged = new i0.EventEmitter();
         }
         ProcessFormComponent.prototype.saveForm = function () {
             var _this = this;
@@ -18289,6 +18315,7 @@
         ProcessFormComponent.prototype.onIndexDataChanged = function (event) {
             this.form = event;
             this.formData = event.data;
+            this.statusChanged.emit(event);
         };
         return ProcessFormComponent;
     }());
@@ -18304,7 +18331,8 @@
         formOptions: [{ type: i0.Input }],
         onSaveForm: [{ type: i0.Output }],
         onResetForm: [{ type: i0.Output }],
-        onCancel: [{ type: i0.Output }]
+        onCancel: [{ type: i0.Output }],
+        statusChanged: [{ type: i0.Output }]
     };
     var ProcessFormModule = /** @class */ (function () {
@@ -21397,23 +21425,6 @@
             _this.undockService = undockService;
             _this.selection = selection;
             _this.shortcutsService = shortcutsService;
-            // shortcut actions
-            _this.shortcuts = {
-                id: 'eo.page',
-                label: _this.translate.instant('eo.shortcuts.eo-page.title'),
-                labelKey: 'eo.shortcuts.eo-page.title',
-                actions: [{
-                        name: _this.translate.instant('eo.shortcuts.eo-page.action.undock'),
-                        nameKey: 'eo.shortcuts.eo-page.action.undock',
-                        shortcut: 'U',
-                        onExecuteAction: function () {
-                            _this.undock();
-                        },
-                        isHidden: function () {
-                            return _this.undockState.hasUndockedWindow || _this.undockState.isUndockedWindow;
-                        }
-                    }]
-            };
             _this.applySelection = {};
             // called when the current instance of the smart panel is running in an undocked
             // window to be able to notify outer components
@@ -21474,7 +21485,7 @@
     UndockSplitComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'eo-undock-split',
-                    template: "<ng-container [eoShortcuts]=\"shortcuts\"></ng-container>\r\n<ng-content></ng-content>\r\n\r\n",
+                    template: "<ng-container></ng-container>\r\n<ng-content></ng-content>\r\n\r\n",
                     providers: [UndockSplitService],
                     styles: [":host.undocked{bottom:0;left:0;position:fixed!important;right:0;top:0;z-index:10!important}"]
                 },] }
@@ -21915,7 +21926,7 @@
     var PrepareDetailsComponent = /** @class */ (function (_super) {
         __extends(PrepareDetailsComponent, _super);
-        function PrepareDetailsComponent(prepareService, router, pendingChanges, translate, notification, systemService, selection, backend) {
+        function PrepareDetailsComponent(prepareService, router, pendingChanges, translate, notification, systemService, selection, backend, capabilites) {
             var _this = _super.call(this) || this;
             _this.prepareService = prepareService;
             _this.router = router;
@@ -21925,6 +21936,7 @@
             _this.systemService = systemService;
             _this.selection = selection;
             _this.backend = backend;
+            _this.capabilites = capabilites;
             // preparation is divided into several phases
             // select an object type
             _this.PHASE_TYPE = 'type';
@@ -22381,6 +22393,9 @@
                 }
             }
         };
+        PrepareDetailsComponent.prototype.hasTemplateCapability = function () {
+            return this.capabilites.hasCapability('template');
+        };
         PrepareDetailsComponent.prototype.trackByIdFn = function (index, item) {
             return item.id;
         };
@@ -22409,7 +22424,7 @@
     PrepareDetailsComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'eo-prepare-details',
-                    template: "<div class=\"prepareDetails__wrapper\" *ngIf=\"!loading; else mainSpinner\">\r\n  <section class=\"prepareDetails\" *ngIf=\"preparedItem && preparePhase; else noItem\"\r\n    [ngClass]=\"{multifile: preparedItem.contentcount > 1, committing: committing}\">\r\n    <div class=\"eo-head\">\r\n\r\n      <div class=\"header-info\">\r\n        <div class=\"header-title\">{{header.title}}</div>\r\n        <div class=\"header-sub-title h-location\" *ngIf=\"!header.location.link; else linked\">{{header.location.label}}\r\n        </div>\r\n        <div class=\"header-sub-title h-subtitle\">{{header.subtitle}}</div>\r\n\r\n        <ng-template #linked>\r\n          <div class=\"header-sub-title h-subtitle-detailed\">\r\n            <span translate>eo.prepare.location.title.prefix</span>\r\n            <a [routerLink]=\"header.location.link\">{{header.location.label}}</a>\r\n          </div>\r\n        </ng-template>\r\n      </div>\r\n\r\n      <div class=\"actions\">\r\n        <eo-icon class=\"btn btn-download\"\r\n          *ngIf=\"preparePhase.name === 'content' ? selectedTemplateFile : preparePhase.data.previewFile\"\r\n          [iconSrc]=\"'assets/_default/svg/ic_content-download.svg'\"\r\n          [iconTitle]=\"('eo.action.download.dms.object.content.label' | translate)\" (click)=\"download()\"></eo-icon>\r\n        <eo-icon class=\"btn btn-delete\" [iconSrc]=\"'assets/_default/svg/ic_trash.svg'\"\r\n          (click)=\"showDeleteDialog = true;\"></eo-icon>\r\n        <!-- buttons while choosing a template -->\r\n        <ng-container *ngIf=\"chooseTemplate\">\r\n          <button class=\"btn-tpl-abort\" (click)=\"showTemplateSelector(false)\"\r\n            translate>eo.prepare.template.abort</button>\r\n          <button class=\"primary btn-tpl-apply\" (click)=\"addTemplate(selectedTemplate)\" [disabled]=\"!selectedTemplate\"\r\n            translate>eo.prepare.template.select</button>\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"preparePhase.name === 'indexdata'\">\r\n          <button (click)=\"commit()\" class=\"btn-idx-save\"\r\n            [ngClass]=\"{primary: preparedItem.state.parentisroot && preparedItem.contentcount > 1}\"\r\n            [disabled]=\"formState?.invalid || committing\" translate>eo.prepare.save</button>\r\n\r\n          <button (click)=\"commit(true)\" [disabled]=\"formState?.invalid || committing\" class=\"primary btn-idx-saveopen\"\r\n            [hidden]=\"preparedItem?.state.parentisroot && preparedItem?.contentcount > 1\"\r\n            translate>eo.prepare.saveopen</button>\r\n\r\n        </ng-container>\r\n      </div>\r\n\r\n    </div>\r\n\r\n    <div class=\"eo-body\" [ngSwitch]=\"preparePhase.name\" *ngIf=\"!committing; else spinner\">\r\n\r\n      <!-- PHASE TYPE -->\r\n      <div class=\"phase type\" *ngSwitchCase=\"'type'\">\r\n\r\n        <!-- with preview -->\r\n        <eo-split [gutterSize]=\"16\" [gutterColor]=\"'#fff'\" [visibleTransition]=\"true\"\r\n          *ngIf=\"preparePhase.data.previewFile; else nopreview\" [cacheLayout]=\"'prepare.details.phase.type'\">\r\n          <eo-split-area [size]=\"30\">\r\n\r\n            <div class=\"form-files\">\r\n              <div class=\"object-type-select empty\" *ngIf=\"preparedItem.types.length == 0\" translate>\r\n                eo.prepare.details.type.empty</div>\r\n              <div class=\"object-type-select empty\"\r\n                *ngIf=\"!preparedItem.state.typeselectedallowed && preparedItem.state.typeselected\"\r\n                [translateParams]=\"{type: preparedItem.selectedtype.label, filename: getFileNames(preparedItem)}\"\r\n                translate>eo.prepare.details.type.notallowed</div>\r\n\r\n              <div class=\"object-type-select\">\r\n                <div class=\"object-type\" *ngFor=\"let type of preparedItem.types; trackBy: trackByIdFn\"\r\n                  (click)=\"selectObjectType(type)\">\r\n                  <div class=\"type-icon\">\r\n                    <eo-icon [iconId]=\"type.icon.id\"></eo-icon>\r\n                  </div>\r\n                  <div class=\"content\">\r\n                    <div class=\"title\">{{type.label}}</div>\r\n                    <div class=\"description\">{{type.description}}</div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n\r\n              <div class=\"content-select\">\r\n                <h2 translate>eo.prepare.details.contents.title</h2>\r\n                <div class=\"content\"\r\n                  *ngFor=\"let content of preparedItem.contents; trackBy: trackByIndexFn; index as idx;\"\r\n                  [ngClass]=\"{selected: preparePhase.data.previewIndex == idx}\" (click)=\"setPreviewUri(idx)\">\r\n                  <span>{{content.path}}</span>\r\n                  <eo-icon class=\"btn btn-delete-content\" [iconSrc]=\"'assets/_default/svg/ic_trash.svg'\"\r\n                  (click)=\"showContentDeleteDialog = true; deletedContentIndex = idx;\"></eo-icon>\r\n                  <div *ngIf=\"content.existscount > 0\" class=\"attention\" title=\"{{'eo.prepare.content.existscount.message'|translate: ({count: content.existscount})}}\">!</div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </eo-split-area>\r\n          <eo-split-area [size]=\"70\">\r\n            <div class=\"eo-media-wrap\">\r\n              <eo-prepare-content-exists-info [content]=\"preparedItem.contents[preparePhase.data.previewIndex]\">\r\n              </eo-prepare-content-exists-info>\r\n              <eo-media [previewFile]=\"preparePhase.data.previewFile\"></eo-media>\r\n            </div>\r\n          </eo-split-area>\r\n        </eo-split>\r\n\r\n        <!-- without preview -->\r\n        <ng-template #nopreview>\r\n          <div class=\"form-files\">\r\n            <div class=\"object-type-select\">\r\n              <div class=\"object-type\" *ngFor=\"let type of preparedItem.types; trackBy: trackByIdFn\"\r\n                (click)=\"selectObjectType(type)\">\r\n                <div class=\"type-icon\">\r\n                  <eo-icon [iconId]=\"type.icon.id\"></eo-icon>\r\n                </div>\r\n                <div class=\"content\">\r\n                  <div class=\"title\">{{type.label}}</div>\r\n                  <div class=\"description\">{{type.description}}</div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </ng-template>\r\n\r\n      </div>\r\n\r\n      <!-- PHASE CONTENT -->\r\n      <div class=\"phase content\" *ngSwitchCase=\"'content'\">\r\n\r\n        <!-- panel for selecting a template to be used as items content -->\r\n        <eo-split [gutterSize]=\"16\" [gutterColor]=\"'#fff'\" [visibleTransition]=\"true\"\r\n          *ngIf=\"chooseTemplate; else attach\" [cacheLayout]=\"'prepare.details.phase.content'\">\r\n          <eo-split-area [size]=\"40\">\r\n\r\n            <!-- list of available templates -->\r\n            <eo-list-container #eoList [loading]=\"false\" class=\"templates\">\r\n              <div class=\"eo-header\">\r\n                <eo-icon class=\"eo-header-icon\" [iconSrc]=\"'assets/_default/svg/ic_template.svg'\"></eo-icon>\r\n                <div class=\"eo-header-info\">\r\n                  <div class=\"eo-header-title\" translate>eo.prepare.template.list.title</div>\r\n                </div>\r\n                <div class=\"eo-header-actions\">\r\n\r\n                  <eo-overlay #oFilter [iconSrc]=\"'assets/_default/svg/ic_filter.svg'\" [iconClass]=\"'primary'\"\r\n                    class=\"overlay-filter\" [title]=\"'eo.list.filter' | translate\"\r\n                    (active)=\"oFilter.onActiveChanged($event)\">\r\n                    <eo-custom-filter #cFilter (change)=\"cFilter.updateGrid(eoList.eoGridSubject, $event)\"\r\n                      (active)=\"oFilter.onActiveChanged($event)\">\r\n                      <eo-text-filter [title]=\"'eo.prepare.template.filter.text.title' | translate\"\r\n                        [matchFields]=\"['title', 'description', 'tags']\"\r\n                        [placeholder]=\"'eo.prepare.template.filter.text.title'\"></eo-text-filter>\r\n                      <eo-set-filter [operator]=\"'OR'\" [title]=\"'eo.prepare.template.filter.set.title' | translate\"\r\n                        *ngIf=\"tagFilterOptions?.length\" [options]=\"tagFilterOptions\"></eo-set-filter>\r\n                    </eo-custom-filter>\r\n                  </eo-overlay>\r\n\r\n                </div>\r\n              </div>\r\n              <div class=\"eo-body\">\r\n                <eo-grid #eoGrid *ngIf=\"gridOptions?.rowData\" [gridOptions]=\"gridOptions\" [fullWidth]=\"true\"\r\n                  [showHeader]=\"true\" [showFooter]=\"false\" [selectionLimit]=\"1\"\r\n                  (eoGridSelectionChanged)=\"selectTemplate($event[0])\">\r\n                </eo-grid>\r\n              </div>\r\n            </eo-list-container>\r\n\r\n          </eo-split-area>\r\n          <eo-split-area [size]=\"60\">\r\n\r\n            <!-- preview of selected template -->\r\n            <eo-media [previewFile]=\"selectedTemplateFile\"></eo-media>\r\n\r\n          </eo-split-area>\r\n        </eo-split>\r\n\r\n        <!-- add content general overview (upload, template, none) -->\r\n        <ng-template #attach>\r\n\r\n          <div class=\"info\" *ngIf=\"!uploadInProgress\" translate>eo.prepare.attachment.info</div>\r\n          <input type=\"file\" #file (change)=\"fileChangeListener($event.target.files)\">\r\n\r\n          <div class=\"attachments\" *ngIf=\"!uploadInProgress; else uploadspinner\">\r\n\r\n            <!-- upload a file -->\r\n            <div class=\"attachment att-file\" *ngIf=\"preparePhase.data.file\" (click)=\"upload()\">\r\n              <div class=\"img\">\r\n                <eo-icon [iconSrc]=\"'assets/_default/svg/ic_file_upload.svg'\"></eo-icon>\r\n              </div>\r\n              <h3 translate>eo.prepare.attachment.upload.title</h3>\r\n              <p translate>eo.prepare.attachment.upload.desc</p>\r\n            </div>\r\n\r\n            <!-- select a template -->\r\n            <div class=\"attachment att-tmpl\" *ngIf=\"preparePhase.data.templates.length > 0\"\r\n              (click)=\"showTemplateSelector(true)\">\r\n              <div class=\"img\">\r\n                <eo-icon [iconSrc]=\"'assets/_default/svg/ic_prepare_add.svg'\"></eo-icon>\r\n              </div>\r\n              <h3 translate>eo.prepare.attachment.template.title</h3>\r\n              <p translate>eo.prepare.attachment.template.desc</p>\r\n            </div>\r\n\r\n            <!-- no file -->\r\n            <div class=\"attachment att-none\" *ngIf=\"preparePhase.data.withoutFile\" (click)=\"noFile()\">\r\n              <div class=\"img\">\r\n                <eo-icon [iconSrc]=\"'assets/_default/svg/ic_no-file.svg'\"></eo-icon>\r\n              </div>\r\n              <h3 translate>eo.prepare.attachment.nofile.title</h3>\r\n              <p translate>eo.prepare.attachment.nofile.desc</p>\r\n            </div>\r\n\r\n          </div>\r\n\r\n        </ng-template>\r\n\r\n        <!-- upload progress indicator -->\r\n        <ng-template #uploadspinner>\r\n          <div class=\"upload-indicator\">\r\n            <eo-loading-spinner [size]=\"'large'\"></eo-loading-spinner>\r\n          </div>\r\n        </ng-template>\r\n      </div>\r\n\r\n      <!-- PHASE INDEXDATA -->\r\n      <div class=\"phase indexdata\" *ngSwitchCase=\"'indexdata'\">\r\n\r\n        <!-- form and preview -->\r\n        <eo-split [gutterSize]=\"16\" [gutterColor]=\"'#fff'\" [visibleTransition]=\"true\"\r\n          *ngIf=\"preparePhase.data.previewFile; else justform\" [cacheLayout]=\"'prepare.details.phase.indexdata'\">\r\n          <eo-split-area [size]=\"50\">\r\n\r\n            <div class=\"form-files\">\r\n\r\n              <!-- indexdata form -->\r\n              <ng-container *ngTemplateOutlet=\"justform\"></ng-container>\r\n\r\n              <!-- list of contents (in case of bulk upload) that can be previewed -->\r\n              <div class=\"content-select\">\r\n\r\n                <h2 translate>eo.prepare.details.contents.title</h2>\r\n                <div class=\"content\"\r\n                  *ngFor=\"let content of preparedItem.contents; trackBy: trackByIndexFn; index as idx\"\r\n                  [ngClass]=\"{selected: preparePhase.data.previewIndex === idx}\" (click)=\"setPreviewUri(idx)\">\r\n                  {{content.path}} <span *ngIf=\"content.existscount > 0\" class=\"attention\" title=\"{{'eo.prepare.content.existscount.message'|translate: ({count: content.existscount})}}\">!</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n          </eo-split-area>\r\n          <eo-split-area [size]=\"50\">\r\n            <div class=\"eo-media-wrap\">\r\n              <eo-prepare-content-exists-info [content]=\"preparedItem.contents[preparePhase.data.previewIndex]\">\r\n              </eo-prepare-content-exists-info>\r\n              <eo-media [previewFile]=\"preparePhase.data.previewFile\"></eo-media>\r\n            </div>\r\n          </eo-split-area>\r\n        </eo-split>\r\n\r\n        <!-- just the form -->\r\n        <ng-template #justform>\r\n          <div class=\"form-container situation-create\" *ngIf=\"formOptions\">\r\n            <eo-object-form #form [formOptions]=\"formOptions\" (statusChanged)=\"onFormStatusChanged($event)\">\r\n            </eo-object-form>\r\n          </div>\r\n        </ng-template>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n  </section>\r\n\r\n  <ng-template #spinner>\r\n    <div class=\"eo-body\">\r\n      <eo-loading-spinner size=\"medium\"></eo-loading-spinner>\r\n    </div>\r\n  </ng-template>\r\n\r\n</div>\r\n\r\n<ng-template #mainSpinner>\r\n  <div class=\"prepareDetails__main-spinner\">\r\n    <eo-loading-spinner size=\"medium\"></eo-loading-spinner>\r\n  </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #noItem>\r\n  <eo-error-message [emptyState]=\"{icon: emptyState.icon, text: emptyState.text, className: emptyState.className}\">\r\n    <ng-content select=\".error\"></ng-content>\r\n  </eo-error-message>\r\n</ng-template>\r\n\r\n<eo-dialog [title]=\"'eo.prepare.details.delete.dialog.title' | translate\"\r\n  [(visible)]=\"showDeleteDialog\" [focusOnShow]=\"false\" [minWidth]=\"400\" [styleClass]=\"'prepare-delete__dialog'\">\r\n\r\n<div>{{'eo.prepare.details.delete.dialog.message' | translate}}</div>\r\n\r\n  <div class=\"action-buttons prepare-delete--action-buttons flex-row\">\r\n    <button type=\"button\" class=\"button cancel\" (click)=\"showDeleteDialog = false\"\r\n      translate>eo.prepare.details.delete.dialog.cancel</button>\r\n    <button type=\"button\" #confirmDelete (click)=\"removeItem(preparedItem)\" class=\"button primary\"\r\n      translate>eo.prepare.details.delete.dialog.ok</button>\r\n  </div>\r\n</eo-dialog>\r\n\r\n<eo-dialog [title]=\"'eo.prepare.details.delete.content.dialog.title' | translate\"\r\n  [(visible)]=\"showContentDeleteDialog\" [minWidth]=\"400\" [styleClass]=\"'prepare-delete__dialog'\">\r\n\r\n<div>{{'eo.prepare.details.delete.content.dialog.message' | translate: ({contentPath: preparedItem?.contents ? preparedItem?.contents[deletedContentIndex]?.path : ''})}}</div>\r\n\r\n  <div class=\"action-buttons prepare-delete--action-buttons flex-row\">\r\n    <button type=\"button\" class=\"button cancel\" (click)=\"showContentDeleteDialog = false\"\r\n      translate>eo.prepare.details.delete.dialog.cancel</button>\r\n    <button type=\"button\" #confirmContentDelete (click)=\"removeItemContent(preparedItem, deletedContentIndex)\" class=\"button primary\"\r\n      translate>eo.prepare.details.delete.dialog.ok</button>\r\n  </div>\r\n</eo-dialog>\r\n",
+                    template: "<div class=\"prepareDetails__wrapper\" *ngIf=\"!loading; else mainSpinner\">\r\n  <section class=\"prepareDetails\" *ngIf=\"preparedItem && preparePhase; else noItem\"\r\n    [ngClass]=\"{multifile: preparedItem.contentcount > 1, committing: committing}\">\r\n    <div class=\"eo-head\">\r\n\r\n      <div class=\"header-info\">\r\n        <div class=\"header-title\">{{header.title}}</div>\r\n        <div class=\"header-sub-title h-location\" *ngIf=\"!header.location.link; else linked\">{{header.location.label}}\r\n        </div>\r\n        <div class=\"header-sub-title h-subtitle\">{{header.subtitle}}</div>\r\n\r\n        <ng-template #linked>\r\n          <div class=\"header-sub-title h-subtitle-detailed\">\r\n            <span translate>eo.prepare.location.title.prefix</span>\r\n            <a [routerLink]=\"header.location.link\">{{header.location.label}}</a>\r\n          </div>\r\n        </ng-template>\r\n      </div>\r\n\r\n      <div class=\"actions\">\r\n        <eo-icon class=\"btn btn-download\"\r\n          *ngIf=\"preparePhase.name === 'content' ? selectedTemplateFile : preparePhase.data.previewFile\"\r\n          [iconSrc]=\"'assets/_default/svg/ic_content-download.svg'\"\r\n          [iconTitle]=\"('eo.action.download.dms.object.content.label' | translate)\" (click)=\"download()\"></eo-icon>\r\n        <eo-icon class=\"btn btn-delete\" [iconSrc]=\"'assets/_default/svg/ic_trash.svg'\"\r\n          (click)=\"showDeleteDialog = true;\"></eo-icon>\r\n        <!-- buttons while choosing a template -->\r\n        <ng-container *ngIf=\"chooseTemplate\">\r\n          <button class=\"btn-tpl-abort\" (click)=\"showTemplateSelector(false)\"\r\n            translate>eo.prepare.template.abort</button>\r\n          <button class=\"primary btn-tpl-apply\" (click)=\"addTemplate(selectedTemplate)\" [disabled]=\"!selectedTemplate\"\r\n            translate>eo.prepare.template.select</button>\r\n        </ng-container>\r\n\r\n        <ng-container *ngIf=\"preparePhase.name === 'indexdata'\">\r\n          <button (click)=\"commit()\" class=\"btn-idx-save\"\r\n            [ngClass]=\"{primary: preparedItem.state.parentisroot && preparedItem.contentcount > 1}\"\r\n            [disabled]=\"formState?.invalid || committing\" translate>eo.prepare.save</button>\r\n\r\n          <button (click)=\"commit(true)\" [disabled]=\"formState?.invalid || committing\" class=\"primary btn-idx-saveopen\"\r\n            [hidden]=\"preparedItem?.state.parentisroot && preparedItem?.contentcount > 1\"\r\n            translate>eo.prepare.saveopen</button>\r\n\r\n        </ng-container>\r\n      </div>\r\n\r\n    </div>\r\n\r\n    <div class=\"eo-body\" [ngSwitch]=\"preparePhase.name\" *ngIf=\"!committing; else spinner\">\r\n\r\n      <!-- PHASE TYPE -->\r\n      <div class=\"phase type\" *ngSwitchCase=\"'type'\">\r\n\r\n        <!-- with preview -->\r\n        <eo-split [gutterSize]=\"16\" [gutterColor]=\"'#fff'\" [visibleTransition]=\"true\"\r\n          *ngIf=\"preparePhase.data.previewFile; else nopreview\" [cacheLayout]=\"'prepare.details.phase.type'\">\r\n          <eo-split-area [size]=\"30\">\r\n\r\n            <div class=\"form-files\">\r\n              <div class=\"object-type-select empty\" *ngIf=\"preparedItem.types.length == 0\" translate>\r\n                eo.prepare.details.type.empty</div>\r\n              <div class=\"object-type-select empty\"\r\n                *ngIf=\"!preparedItem.state.typeselectedallowed && preparedItem.state.typeselected\"\r\n                [translateParams]=\"{type: preparedItem.selectedtype.label, filename: getFileNames(preparedItem)}\"\r\n                translate>eo.prepare.details.type.notallowed</div>\r\n\r\n              <div class=\"object-type-select\">\r\n                <div class=\"object-type\" *ngFor=\"let type of preparedItem.types; trackBy: trackByIdFn\"\r\n                  (click)=\"selectObjectType(type)\">\r\n                  <div class=\"type-icon\">\r\n                    <eo-icon [iconId]=\"type.icon.id\"></eo-icon>\r\n                  </div>\r\n                  <div class=\"content\">\r\n                    <div class=\"title\">{{type.label}}</div>\r\n                    <div class=\"description\">{{type.description}}</div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n\r\n              <div class=\"content-select\">\r\n                <h2 translate>eo.prepare.details.contents.title</h2>\r\n                <div class=\"content\"\r\n                  *ngFor=\"let content of preparedItem.contents; trackBy: trackByIndexFn; index as idx;\"\r\n                  [ngClass]=\"{selected: preparePhase.data.previewIndex == idx}\" (click)=\"setPreviewUri(idx)\">\r\n                  <span>{{content.path}}</span>\r\n                  <eo-icon class=\"btn btn-delete-content\" [iconSrc]=\"'assets/_default/svg/ic_trash.svg'\"\r\n                  (click)=\"showContentDeleteDialog = true; deletedContentIndex = idx;\"></eo-icon>\r\n                  <div *ngIf=\"content.existscount > 0\" class=\"attention\" title=\"{{'eo.prepare.content.existscount.message'|translate: ({count: content.existscount})}}\">!</div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </eo-split-area>\r\n          <eo-split-area [size]=\"70\">\r\n            <div class=\"eo-media-wrap\">\r\n              <eo-prepare-content-exists-info [content]=\"preparedItem.contents[preparePhase.data.previewIndex]\">\r\n              </eo-prepare-content-exists-info>\r\n              <eo-media [previewFile]=\"preparePhase.data.previewFile\"></eo-media>\r\n            </div>\r\n          </eo-split-area>\r\n        </eo-split>\r\n\r\n        <!-- without preview -->\r\n        <ng-template #nopreview>\r\n          <div class=\"form-files\">\r\n            <div class=\"object-type-select\">\r\n              <div class=\"object-type\" *ngFor=\"let type of preparedItem.types; trackBy: trackByIdFn\"\r\n                (click)=\"selectObjectType(type)\">\r\n                <div class=\"type-icon\">\r\n                  <eo-icon [iconId]=\"type.icon.id\"></eo-icon>\r\n                </div>\r\n                <div class=\"content\">\r\n                  <div class=\"title\">{{type.label}}</div>\r\n                  <div class=\"description\">{{type.description}}</div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </ng-template>\r\n\r\n      </div>\r\n\r\n      <!-- PHASE CONTENT -->\r\n      <div class=\"phase content\" *ngSwitchCase=\"'content'\">\r\n\r\n        <!-- panel for selecting a template to be used as items content -->\r\n        <eo-split [gutterSize]=\"16\" [gutterColor]=\"'#fff'\" [visibleTransition]=\"true\"\r\n          *ngIf=\"chooseTemplate; else attach\" [cacheLayout]=\"'prepare.details.phase.content'\">\r\n          <eo-split-area [size]=\"40\">\r\n\r\n            <!-- list of available templates -->\r\n            <eo-list-container #eoList [loading]=\"false\" class=\"templates\">\r\n              <div class=\"eo-header\">\r\n                <eo-icon class=\"eo-header-icon\" [iconSrc]=\"'assets/_default/svg/ic_template.svg'\"></eo-icon>\r\n                <div class=\"eo-header-info\">\r\n                  <div class=\"eo-header-title\" translate>eo.prepare.template.list.title</div>\r\n                </div>\r\n                <div class=\"eo-header-actions\">\r\n\r\n                  <eo-overlay #oFilter [iconSrc]=\"'assets/_default/svg/ic_filter.svg'\" [iconClass]=\"'primary'\"\r\n                    class=\"overlay-filter\" [title]=\"'eo.list.filter' | translate\"\r\n                    (active)=\"oFilter.onActiveChanged($event)\">\r\n                    <eo-custom-filter #cFilter (change)=\"cFilter.updateGrid(eoList.eoGridSubject, $event)\"\r\n                      (active)=\"oFilter.onActiveChanged($event)\">\r\n                      <eo-text-filter [title]=\"'eo.prepare.template.filter.text.title' | translate\"\r\n                        [matchFields]=\"['title', 'description', 'tags']\"\r\n                        [placeholder]=\"'eo.prepare.template.filter.text.title'\"></eo-text-filter>\r\n                      <eo-set-filter [operator]=\"'OR'\" [title]=\"'eo.prepare.template.filter.set.title' | translate\"\r\n                        *ngIf=\"tagFilterOptions?.length\" [options]=\"tagFilterOptions\"></eo-set-filter>\r\n                    </eo-custom-filter>\r\n                  </eo-overlay>\r\n\r\n                </div>\r\n              </div>\r\n              <div class=\"eo-body\">\r\n                <eo-grid #eoGrid *ngIf=\"gridOptions?.rowData\" [gridOptions]=\"gridOptions\" [fullWidth]=\"true\"\r\n                  [showHeader]=\"true\" [showFooter]=\"false\" [selectionLimit]=\"1\"\r\n                  (eoGridSelectionChanged)=\"selectTemplate($event[0])\">\r\n                </eo-grid>\r\n              </div>\r\n            </eo-list-container>\r\n\r\n          </eo-split-area>\r\n          <eo-split-area [size]=\"60\">\r\n\r\n            <!-- preview of selected template -->\r\n            <eo-media [previewFile]=\"selectedTemplateFile\"></eo-media>\r\n\r\n          </eo-split-area>\r\n        </eo-split>\r\n\r\n        <!-- add content general overview (upload, template, none) -->\r\n        <ng-template #attach>\r\n\r\n          <div class=\"info\" *ngIf=\"!uploadInProgress\" translate>eo.prepare.attachment.info</div>\r\n          <input type=\"file\" #file (change)=\"fileChangeListener($event.target.files)\">\r\n\r\n          <div class=\"attachments\" *ngIf=\"!uploadInProgress; else uploadspinner\">\r\n\r\n            <!-- upload a file -->\r\n            <div class=\"attachment att-file\" *ngIf=\"preparePhase.data.file\" (click)=\"upload()\">\r\n              <div class=\"img\">\r\n                <eo-icon [iconSrc]=\"'assets/_default/svg/ic_file_upload.svg'\"></eo-icon>\r\n              </div>\r\n              <h3 translate>eo.prepare.attachment.upload.title</h3>\r\n              <p translate>eo.prepare.attachment.upload.desc</p>\r\n            </div>\r\n\r\n            <!-- select a template -->\r\n            <div class=\"attachment att-tmpl\" *ngIf=\"preparePhase.data.templates.length > 0 && hasTemplateCapability()\"\r\n              (click)=\"showTemplateSelector(true)\">\r\n              <div class=\"img\">\r\n                <eo-icon [iconSrc]=\"'assets/_default/svg/ic_prepare_add.svg'\"></eo-icon>\r\n              </div>\r\n              <h3 translate>eo.prepare.attachment.template.title</h3>\r\n              <p translate>eo.prepare.attachment.template.desc</p>\r\n            </div>\r\n\r\n            <!-- no file -->\r\n            <div class=\"attachment att-none\" *ngIf=\"preparePhase.data.withoutFile\" (click)=\"noFile()\">\r\n              <div class=\"img\">\r\n                <eo-icon [iconSrc]=\"'assets/_default/svg/ic_no-file.svg'\"></eo-icon>\r\n              </div>\r\n              <h3 translate>eo.prepare.attachment.nofile.title</h3>\r\n              <p translate>eo.prepare.attachment.nofile.desc</p>\r\n            </div>\r\n\r\n          </div>\r\n\r\n        </ng-template>\r\n\r\n        <!-- upload progress indicator -->\r\n        <ng-template #uploadspinner>\r\n          <div class=\"upload-indicator\">\r\n            <eo-loading-spinner [size]=\"'large'\"></eo-loading-spinner>\r\n          </div>\r\n        </ng-template>\r\n      </div>\r\n\r\n      <!-- PHASE INDEXDATA -->\r\n      <div class=\"phase indexdata\" *ngSwitchCase=\"'indexdata'\">\r\n\r\n        <!-- form and preview -->\r\n        <eo-split [gutterSize]=\"16\" [gutterColor]=\"'#fff'\" [visibleTransition]=\"true\"\r\n          *ngIf=\"preparePhase.data.previewFile; else justform\" [cacheLayout]=\"'prepare.details.phase.indexdata'\">\r\n          <eo-split-area [size]=\"50\">\r\n\r\n            <div class=\"form-files\">\r\n\r\n              <!-- indexdata form -->\r\n              <ng-container *ngTemplateOutlet=\"justform\"></ng-container>\r\n\r\n              <!-- list of contents (in case of bulk upload) that can be previewed -->\r\n              <div class=\"content-select\">\r\n\r\n                <h2 translate>eo.prepare.details.contents.title</h2>\r\n                <div class=\"content\"\r\n                  *ngFor=\"let content of preparedItem.contents; trackBy: trackByIndexFn; index as idx\"\r\n                  [ngClass]=\"{selected: preparePhase.data.previewIndex === idx}\" (click)=\"setPreviewUri(idx)\">\r\n                  {{content.path}} <span *ngIf=\"content.existscount > 0\" class=\"attention\" title=\"{{'eo.prepare.content.existscount.message'|translate: ({count: content.existscount})}}\">!</span>\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n          </eo-split-area>\r\n          <eo-split-area [size]=\"50\">\r\n            <div class=\"eo-media-wrap\">\r\n              <eo-prepare-content-exists-info [content]=\"preparedItem.contents[preparePhase.data.previewIndex]\">\r\n              </eo-prepare-content-exists-info>\r\n              <eo-media [previewFile]=\"preparePhase.data.previewFile\"></eo-media>\r\n            </div>\r\n          </eo-split-area>\r\n        </eo-split>\r\n\r\n        <!-- just the form -->\r\n        <ng-template #justform>\r\n          <div class=\"form-container situation-create\" *ngIf=\"formOptions\">\r\n            <eo-object-form #form [formOptions]=\"formOptions\" (statusChanged)=\"onFormStatusChanged($event)\">\r\n            </eo-object-form>\r\n          </div>\r\n        </ng-template>\r\n\r\n      </div>\r\n\r\n    </div>\r\n\r\n  </section>\r\n\r\n  <ng-template #spinner>\r\n    <div class=\"eo-body\">\r\n      <eo-loading-spinner size=\"medium\"></eo-loading-spinner>\r\n    </div>\r\n  </ng-template>\r\n\r\n</div>\r\n\r\n<ng-template #mainSpinner>\r\n  <div class=\"prepareDetails__main-spinner\">\r\n    <eo-loading-spinner size=\"medium\"></eo-loading-spinner>\r\n  </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #noItem>\r\n  <eo-error-message [emptyState]=\"{icon: emptyState.icon, text: emptyState.text, className: emptyState.className}\">\r\n    <ng-content select=\".error\"></ng-content>\r\n  </eo-error-message>\r\n</ng-template>\r\n\r\n<eo-dialog [title]=\"'eo.prepare.details.delete.dialog.title' | translate\"\r\n  [(visible)]=\"showDeleteDialog\" [focusOnShow]=\"false\" [minWidth]=\"400\" [styleClass]=\"'prepare-delete__dialog'\">\r\n\r\n<div>{{'eo.prepare.details.delete.dialog.message' | translate}}</div>\r\n\r\n  <div class=\"action-buttons prepare-delete--action-buttons flex-row\">\r\n    <button type=\"button\" class=\"button cancel\" (click)=\"showDeleteDialog = false\"\r\n      translate>eo.prepare.details.delete.dialog.cancel</button>\r\n    <button type=\"button\" #confirmDelete (click)=\"removeItem(preparedItem)\" class=\"button primary\"\r\n      translate>eo.prepare.details.delete.dialog.ok</button>\r\n  </div>\r\n</eo-dialog>\r\n\r\n<eo-dialog [title]=\"'eo.prepare.details.delete.content.dialog.title' | translate\"\r\n  [(visible)]=\"showContentDeleteDialog\" [minWidth]=\"400\" [styleClass]=\"'prepare-delete__dialog'\">\r\n\r\n<div>{{'eo.prepare.details.delete.content.dialog.message' | translate: ({contentPath: preparedItem?.contents ? preparedItem?.contents[deletedContentIndex]?.path : ''})}}</div>\r\n\r\n  <div class=\"action-buttons prepare-delete--action-buttons flex-row\">\r\n    <button type=\"button\" class=\"button cancel\" (click)=\"showContentDeleteDialog = false\"\r\n      translate>eo.prepare.details.delete.dialog.cancel</button>\r\n    <button type=\"button\" #confirmContentDelete (click)=\"removeItemContent(preparedItem, deletedContentIndex)\" class=\"button primary\"\r\n      translate>eo.prepare.details.delete.dialog.ok</button>\r\n  </div>\r\n</eo-dialog>\r\n",
                     styles: [":host{height:100%}:host .prepareDetails{background:var(--panel-background-grey);display:flex;flex:1;flex-direction:column;height:100%;min-height:0;min-width:0;overflow-y:auto}:host .prepareDetails .eo-media-wrap{display:flex;flex-flow:column;height:100%}:host .prepareDetails .eo-media-wrap eo-media{flex:1;position:relative}:host .prepareDetails__wrapper{height:100%}:host .prepareDetails__main-spinner{align-items:center;display:flex;height:100%;justify-content:center}:host .prepareDetails .content-select{display:none}:host .prepareDetails .eo-head{background-color:var(--color-white);display:flex;flex-flow:row nowrap}:host .prepareDetails .eo-head .header-info{color:var(--text-color-caption);flex:1 1 auto;font-size:var(--font-caption)}:host .prepareDetails .eo-head .header-info .header-title{color:var(--text-color-body);font-size:var(--font-title);padding-bottom:calc(var(--app-pane-padding)/2)}:host .prepareDetails .eo-head .header-info a{color:var(--color-accent);cursor:pointer;text-decoration:none}:host .prepareDetails .eo-head .actions{align-items:center;align-self:flex-start;display:flex}[dir=ltr] :host .prepareDetails .eo-head .actions button{margin-left:calc(var(--app-pane-padding)/2)}[dir=rtl] :host .prepareDetails .eo-head .actions button{margin-right:calc(var(--app-pane-padding)/2)}:host .prepareDetails .eo-head .actions eo-icon{cursor:pointer;padding:calc(var(--app-pane-padding)/4)}:host .prepareDetails .eo-body{overflow-y:hidden}:host .prepareDetails .eo-body eo-split-area{border-top:1px solid rgba(var(--color-black-rgb),.08);box-sizing:border-box}:host .prepareDetails .phase{height:100%;overflow-y:auto}:host .prepareDetails .phase.content{align-items:center;display:flex;flex-flow:column;justify-content:center}:host .prepareDetails .phase.content ::ng-deep eo-list-container.templates{background:linear-gradient(90deg,#fff 70%,var(--panel-background-lightgrey))}:host .prepareDetails .phase.content ::ng-deep eo-list-container.templates eo-grid ag-grid-angular.ag-theme-balham .chip:last-of-type:after{background:transparent!important}:host .prepareDetails .phase.content input[type=file]{display:none}:host .prepareDetails .phase.content .info{color:var(--text-color-caption);flex:0 0 auto;margin-bottom:var(--app-pane-padding)}:host .prepareDetails .phase.content .attachments{display:flex;flex:0 0 auto;flex-flow:row}:host .prepareDetails .phase.content .attachments .attachment:hover .img eo-icon{opacity:1}:host .prepareDetails .phase.content .attachments .attachment{background:var(--color-white);border-bottom:1px solid rgba(var(--color-black-rgb),.1);cursor:pointer;margin:calc(var(--app-pane-padding)/2);max-width:200px}:host .prepareDetails .phase.content .attachments .attachment .img{align-items:center;background:var(--color-accent);display:flex;flex-flow:column;justify-content:center;padding:calc(var(--app-pane-padding)*2) 0}:host .prepareDetails .phase.content .attachments .attachment .img eo-icon{-moz-transition:all var(--app-default-transition-duration) ease-in-out;-o-transition:all var(--app-default-transition-duration) ease-in-out;-webkit-transition:all var(--app-default-transition-duration) ease-in-out;color:var(--color-white);height:48px;opacity:.5;transition:all var(--app-default-transition-duration) ease-in-out;width:48px}:host .prepareDetails .phase.content .attachments .attachment h3{font-size:var(--font-subhead);font-weight:var(--font-weight-normal);margin:0;padding:calc(var(--app-pane-padding)/2) var(--app-pane-padding)}:host .prepareDetails .phase.content .attachments .attachment p{color:var(--text-color-caption);margin:0;padding:0 var(--app-pane-padding) var(--app-pane-padding) var(--app-pane-padding)}:host .prepareDetails .phase div[eosplitgutter]{background-color:var(--color-light-blue)!important}:host .prepareDetails .phase.type .form-files .object-type-select{flex:1 1 auto;overflow-y:auto;padding:var(--app-pane-padding)}:host .prepareDetails .phase.type .form-files .object-type-select .object-type{-moz-transition:all var(--app-default-transition-duration) ease-in-out;-o-transition:all var(--app-default-transition-duration) ease-in-out;-webkit-transition:all var(--app-default-transition-duration) ease-in-out;align-items:center;background:var(--color-white);cursor:pointer;display:flex;flex-flow:row nowrap;margin-bottom:1px;padding:calc(var(--app-pane-padding)/2);transition:all var(--app-default-transition-duration) ease-in-out}:host .prepareDetails .phase.type .form-files .object-type-select .object-type .type-icon{color:var(--text-color-hint)}:host .prepareDetails .phase.type .form-files .object-type-select .object-type .content{overflow:hidden;padding-left:calc(var(--app-pane-padding)/2)}:host .prepareDetails .phase.type .form-files .object-type-select .object-type .content .title{font-weight:var(--font-weight-bold);overflow:hidden;text-overflow:ellipsis}:host .prepareDetails .phase.type .form-files .object-type-select .object-type .content .description{color:var(--text-color-caption);overflow:hidden;text-overflow:ellipsis}:host .prepareDetails .phase .form-container eo-object-form{display:block;margin:var(--app-pane-padding)}:host .prepareDetails.committing .eo-head .actions .btn,:host .prepareDetails.committing .eo-head .actions button{display:none}:host .prepareDetails.committing .eo-body{align-items:center;display:flex;flex-flow:column;justify-content:center}:host .prepareDetails.multifile .form-files{bottom:0;display:flex;flex-flow:column;left:0;position:absolute;right:0;top:0}:host .prepareDetails.multifile .form-files .form-container{flex:1 1 auto;overflow-y:auto}:host .prepareDetails.multifile .content-select{border-top:1px solid var(--main-background);box-sizing:border-box;display:block;flex:0 0 30%;overflow-y:auto;padding:calc(var(--app-pane-padding)/2)}:host .prepareDetails.multifile .content-select h2{color:var(--text-color-caption);font-size:var(--font-subhead);font-weight:var(--font-weight-normal);margin:0;padding:calc(var(--app-pane-padding)/2);padding-bottom:var(--app-pane-padding)}:host .prepareDetails.multifile .content-select .content{-moz-transition:all var(--app-default-transition-duration) ease-in-out;-o-transition:all var(--app-default-transition-duration) ease-in-out;-webkit-transition:all var(--app-default-transition-duration) ease-in-out;background:var(--color-white);color:var(--text-color-caption);cursor:pointer;display:flex;gap:8px;justify-content:space-between;margin-bottom:calc(var(--app-pane-padding)/2);overflow:hidden;padding:calc(var(--app-pane-padding)/2);text-overflow:ellipsis;transition:all var(--app-default-transition-duration) ease-in-out}:host .prepareDetails.multifile .content-select .content>span{flex:1;overflow:hidden;text-overflow:ellipsis}:host .prepareDetails.multifile .content-select .content .btn-delete-content{color:var(--text-color-caption);flex:0 0 16px;height:16px;width:16px}:host .prepareDetails.multifile .content-select .content .btn-delete-content:hover{background-color:var(--text-color-hint)}:host .prepareDetails.multifile .content-select .content div.attention{border:1px solid var(--color-warning);border-radius:2px;color:var(--color-warning);display:block;flex:0 0 auto;line-height:1em;padding:0 4px;right:4px;top:8px}:host .prepareDetails.multifile .content-select .content.selected{color:var(--color-accent)}:host .prepareDetails.multifile .content-select .content:hover{background:var(--panel-background-lightgrey)}:host ::ng-deep eo-grid,:host ::ng-deep eo-grid ag-grid-angular.ag-theme-balham,:host ::ng-deep eo-grid ag-grid-angular.ag-theme-balham .ag-row{background:transparent}:host ::ng-deep eo-grid ag-grid-angular.ag-theme-balham .ag-row:hover{background:var(--panel-background-lightgrey)}:host ::ng-deep eo-grid ag-grid-angular.ag-theme-balham .ag-row .ag-cell{border-bottom-color:var(--panel-header-border-bottom-color)}:host ::ng-deep eo-list-container .eo-head{height:48px}:host ::ng-deep eo-list-container .eo-grid-footer,:host ::ng-deep eo-list-container .eo-grid-header,:host ::ng-deep eo-list-container .eo-head{background:transparent;border-color:var(--panel-header-border-bottom-color)}:host ::ng-deep .eo-head .eo-header .eo-header-actions eo-icon{color:var(--text-color-hint)!important}:host ::ng-deep .eo-head .eo-header .eo-header-actions eo-icon:hover{color:var(--text-color-caption)!important}:host ::ng-deep .eo-head .eo-header .eo-header-actions eo-icon.active{color:var(--color-accent)!important}:host ::ng-deep .eo-header-icon,:host ::ng-deep .eo-header-title,:host ::ng-deep .template{color:var(--text-color-caption)}:host ::ng-deep .template{cursor:pointer;margin-bottom:1px}:host ::ng-deep .template .title{font-size:var(--font-body);font-weight:var(--font-weight-bold)}:host ::ng-deep .template .description{color:var(--text-color-caption)}:host ::ng-deep .template .chip{display:initial!important}::ng-deep .prepare-delete__dialog{min-height:unset!important;padding:8px}::ng-deep .prepare-delete__dialog--header{background:#fff!important;color:rgba(var(--color-black-rgb),.54)!important;font-size:1.17em!important;font-weight:400!important;margin:0;padding:0 0 1em!important}"]
                 },] }
     ];
@@ -22421,7 +22436,8 @@
         { type: i1.NotificationsService },
         { type: i1.SystemService },
         { type: SelectionService },
-        { type: i1.BackendService }
+        { type: i1.BackendService },
+        { type: i1.CapabilitiesService }
     ]; };
     PrepareDetailsComponent.propDecorators = {
         file: [{ type: i0.ViewChild, args: ['file',] }],
@@ -24517,10 +24533,10 @@
             this.http = http;
             this.userService = userService;
             this.config = config;
-            this.__libraries__ = [{ "name": "@ag-grid-community/angular", "version": "22.1.2", "license": "MIT" }, { "name": "@ag-grid-community/client-side-row-model", "version": "22.1.1", "license": "MIT" }, { "name": "@ag-grid-community/core", "version": "22.1.1", "license": "MIT" }, { "name": "@ag-grid-community/csv-export", "version": "22.1.1", "license": "MIT" }, { "name": "@angular/animations", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/cdk", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/common", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/compiler", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/core", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/forms", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/platform-browser", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/platform-browser-dynamic", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/router", "version": "11.2.0", "license": "MIT" }, { "name": "@eo-sdk/core", "version": "8.16.0-rc.2", "license": "MIT" }, { "name": "@ngx-pwa/local-storage", "version": "11.1.0", "license": "MIT" }, { "name": "@ngx-translate/core", "version": "13.0.0", "license": "MIT" }, { "name": "@types/lodash", "version": "4.14.88", "license": "MIT" }, { "name": "core-js", "version": "2.5.7", "license": "MIT" }, { "name": "file-saver", "version": "2.0.5", "license": "MIT" }, { "name": "font-awesome", "version": "4.7.0", "license": "(OFL-1.1 AND MIT)" }, { "name": "keyboardevent-key-polyfill", "version": "1.1.0", "license": "CC0-1.0" }, { "name": "keycode-js", "version": "0.0.4", "license": "MIT" }, { "name": "mobile-drag-drop", "version": "2.2.0", "license": "MIT" }, { "name": "moment", "version": "2.22.2", "license": "MIT" }, { "name": "ngx-toastr", "version": "13.2.0", "license": "MIT" }, { "name": "primeicons", "version": "1.0.0-beta.6", "license": "MIT" }, { "name": "primeng", "version": "7.0.1", "license": "MIT" }, { "name": "reflect-metadata", "version": "0.1.10", "license": "Apache-2.0" }, { "name": "rxjs", "version": "6.6.3", "license": "Apache-2.0" }, { "name": "tslib", "version": "2.1.0", "license": "0BSD" }, { "name": "zone.js", "version": "0.10.3", "license": "MIT" }];
+            this.__libraries__ = [{ "name": "@ag-grid-community/angular", "version": "22.1.2", "license": "MIT" }, { "name": "@ag-grid-community/client-side-row-model", "version": "22.1.1", "license": "MIT" }, { "name": "@ag-grid-community/core", "version": "22.1.1", "license": "MIT" }, { "name": "@ag-grid-community/csv-export", "version": "22.1.1", "license": "MIT" }, { "name": "@angular/animations", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/cdk", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/common", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/compiler", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/core", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/forms", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/platform-browser", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/platform-browser-dynamic", "version": "11.2.0", "license": "MIT" }, { "name": "@angular/router", "version": "11.2.0", "license": "MIT" }, { "name": "@eo-sdk/core", "version": "8.16.0-rc.4", "license": "MIT" }, { "name": "@ngx-pwa/local-storage", "version": "11.1.0", "license": "MIT" }, { "name": "@ngx-translate/core", "version": "13.0.0", "license": "MIT" }, { "name": "@types/lodash", "version": "4.14.88", "license": "MIT" }, { "name": "core-js", "version": "2.5.7", "license": "MIT" }, { "name": "file-saver", "version": "2.0.5", "license": "MIT" }, { "name": "font-awesome", "version": "4.7.0", "license": "(OFL-1.1 AND MIT)" }, { "name": "keyboardevent-key-polyfill", "version": "1.1.0", "license": "CC0-1.0" }, { "name": "keycode-js", "version": "0.0.4", "license": "MIT" }, { "name": "mobile-drag-drop", "version": "2.2.0", "license": "MIT" }, { "name": "moment", "version": "2.22.2", "license": "MIT" }, { "name": "ngx-toastr", "version": "13.2.0", "license": "MIT" }, { "name": "primeicons", "version": "1.0.0-beta.6", "license": "MIT" }, { "name": "primeng", "version": "7.0.1", "license": "MIT" }, { "name": "reflect-metadata", "version": "0.1.10", "license": "Apache-2.0" }, { "name": "rxjs", "version": "6.6.3", "license": "Apache-2.0" }, { "name": "tslib", "version": "2.1.0", "license": "0BSD" }, { "name": "zone.js", "version": "0.10.3", "license": "MIT" }];
             this.ctrl = {
                 productName: 'yuuvis® RAD client',
-                clientVersion: '8.16.0-rc.2'
+                clientVersion: '8.16.0-rc.4'
             };
             this.licenses = {
                 'MIT': {
@@ -26628,9 +26644,9 @@
     exports.ɵcs = EoClientRoutingModule;
     exports.ɵct = ProcessStateComponent;
     exports.ɵd = AppProcessComponent;
-    exports.ɵe = PipesModule;
-    exports.ɵf = UnsubscribeOnDestroy;
-    exports.ɵg = PendingChangesService;
+    exports.ɵe = PendingChangesService;
+    exports.ɵf = PipesModule;
+    exports.ɵg = UnsubscribeOnDestroy;
     exports.ɵh = QueryScopeSelectComponent;
     exports.ɵi = IndexdataSummaryEntryComponent;
     exports.ɵj = OrderByPipe;