@valtimo/plugin-management 5.5.0 → 5.7.0

package/fesm2015/valtimo-plugin-management.mjs

@@ -1,24 +1,22 @@
 import * as i0 from '@angular/core';
 import { Injectable, Component, EventEmitter, Output, ViewChild, NgModule } from '@angular/core';
-import { combineLatest, Subject, BehaviorSubject } from 'rxjs';
+import { Subject, BehaviorSubject, combineLatest, of } from 'rxjs';
 import { map, take, switchMap, tap } from 'rxjs/operators';
-import * as i1 from '@valtimo/config';
-import { ROLE_ADMIN } from '@valtimo/config';
-import * as i2 from '@valtimo/plugin';
+import * as i1 from '@valtimo/plugin';
 import { PluginTranslatePipeModule, PluginConfigurationContainerModule } from '@valtimo/plugin';
-import * as i3 from '@angular/platform-browser';
-import * as i4 from '@angular/common/http';
+import * as i2 from '@angular/platform-browser';
 import * as i1$1 from '@angular/router';
 import { RouterModule } from '@angular/router';
-import * as i4$1 from '@angular/common';
+import * as i5 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { AuthGuardService } from '@valtimo/security';
-import * as i2$1 from '@ngx-translate/core';
+import { ROLE_ADMIN } from '@valtimo/config';
+import * as i3 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
-import * as i2$2 from '@valtimo/user-interface';
+import * as i2$1 from '@valtimo/user-interface';
 import { PageModule, ParagraphModule, TitleModule, TableModule, StepperModule, ModalModule, ButtonModule, CardModule } from '@valtimo/user-interface';
-import * as i3$1 from 'ngx-logger';
-import * as i5 from '@angular/flex-layout/flex';
+import * as i4 from 'ngx-logger';
+import * as i6 from '@angular/flex-layout/flex';
 import { FlexLayoutModule } from '@angular/flex-layout';
 
 /*
@@ -37,62 +35,6 @@ import { FlexLayoutModule } from '@angular/flex-layout';
  * limitations under the License.
  */
 
-/*
- * Copyright 2015-2020 Ritense BV, the Netherlands.
- *
- * Licensed under EUPL, Version 1.2 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" basis,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-class PluginManagementService {
-    constructor(configService, pluginService, sanitizer, http) {
-        this.configService = configService;
-        this.pluginService = pluginService;
-        this.sanitizer = sanitizer;
-        this.http = http;
-        this.VALTIMO_API_ENDPOINT_URI = this.configService.config.valtimoApi.endpointUri;
-    }
-    getPluginDefinitions() {
-        return this.http.get(`${this.VALTIMO_API_ENDPOINT_URI}plugin/definition`);
-    }
-    getPluginFunctions(pluginDefinitionId) {
-        return this.http.get(`${this.VALTIMO_API_ENDPOINT_URI}plugin/definition/${pluginDefinitionId}/action`);
-    }
-    getAllPluginConfigurations() {
-        return this.http.get(`${this.VALTIMO_API_ENDPOINT_URI}plugin/configuration`);
-    }
-    getAllPluginConfigurationsWithLogos() {
-        return this.returnPluginConfigurationsWithLogos(this.getAllPluginConfigurations());
-    }
-    savePluginConfiguration(pluginConfiguration) {
-        return this.http.post(`${this.VALTIMO_API_ENDPOINT_URI}plugin/configuration`, pluginConfiguration);
-    }
-    returnPluginConfigurationsWithLogos(pluginConfigurations$) {
-        return combineLatest([pluginConfigurations$, this.pluginService.pluginSpecifications$]).pipe(map(([pluginConfigurations, pluginSpecifications]) => pluginConfigurations === null || pluginConfigurations === void 0 ? void 0 : pluginConfigurations.map(pluginConfiguration => {
-            const pluginSpecification = pluginSpecifications.find(specification => { var _a; return specification.pluginId === ((_a = pluginConfiguration === null || pluginConfiguration === void 0 ? void 0 : pluginConfiguration.pluginDefinition) === null || _a === void 0 ? void 0 : _a.key); });
-            return Object.assign(Object.assign({}, pluginConfiguration), ((pluginSpecification === null || pluginSpecification === void 0 ? void 0 : pluginSpecification.pluginLogoBase64) && {
-                pluginLogoBase64: this.sanitizer.bypassSecurityTrustResourceUrl(pluginSpecification === null || pluginSpecification === void 0 ? void 0 : pluginSpecification.pluginLogoBase64),
-            }));
-        })));
-    }
-}
-PluginManagementService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementService, deps: [{ token: i1.ConfigService }, { token: i2.PluginService }, { token: i3.DomSanitizer }, { token: i4.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
-PluginManagementService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: function () { return [{ type: i1.ConfigService }, { type: i2.PluginService }, { type: i3.DomSanitizer }, { type: i4.HttpClient }]; } });
-
 /*
  * Copyright 2015-2020 Ritense BV, the Netherlands.
  *
@@ -117,6 +59,7 @@ class PluginManagementStateService {
         this._inputDisabled$ = new BehaviorSubject(false);
         this._refresh$ = new BehaviorSubject(null);
         this._save$ = new Subject();
+        this._saveEdit$ = new Subject();
         this._delete$ = new Subject();
         this._hideModalSaveButton$ = new BehaviorSubject(false);
         this._pluginDefinitions$ = new BehaviorSubject(undefined);
@@ -131,6 +74,7 @@ class PluginManagementStateService {
             }));
         })));
         this._selectedPluginDefinition$ = new BehaviorSubject(undefined);
+        this._selectedPluginConfiguration$ = new BehaviorSubject(undefined);
     }
     get showModal$() {
         return this._showModal$.asObservable();
@@ -153,9 +97,15 @@ class PluginManagementStateService {
     get selectedPluginDefinition$() {
         return this._selectedPluginDefinition$.asObservable();
     }
+    get selectedPluginConfiguration$() {
+        return this._selectedPluginConfiguration$.asObservable();
+    }
     get save$() {
         return this._save$.asObservable();
     }
+    get saveEdit$() {
+        return this._saveEdit$.asObservable();
+    }
     get delete$() {
         return this._delete$.asObservable();
     }
@@ -183,12 +133,21 @@ class PluginManagementStateService {
     selectPluginDefinition(definition) {
         this._selectedPluginDefinition$.next(definition);
     }
+    selectPluginConfiguration(configuration) {
+        this._selectedPluginConfiguration$.next(configuration);
+    }
     clearSelectedPluginDefinition() {
         this._selectedPluginDefinition$.next(undefined);
     }
+    clearSelectedPluginConfiguration() {
+        this._selectedPluginConfiguration$.next(undefined);
+    }
     save() {
         this._save$.next(null);
     }
+    saveEdit() {
+        this._saveEdit$.next(null);
+    }
     delete() {
         this._delete$.next(null);
     }
@@ -199,17 +158,18 @@ class PluginManagementStateService {
         this._hideModalSaveButton$.next(false);
     }
     clear() {
-        this._selectedPluginDefinition$.next(undefined);
+        this.clearSelectedPluginDefinition();
+        this.clearSelectedPluginConfiguration();
     }
 }
-PluginManagementStateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementStateService, deps: [{ token: i2.PluginService }, { token: i3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Injectable });
+PluginManagementStateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementStateService, deps: [{ token: i1.PluginService }, { token: i2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Injectable });
 PluginManagementStateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementStateService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementStateService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i2.PluginService }, { type: i3.DomSanitizer }]; } });
+        }], ctorParameters: function () { return [{ type: i1.PluginService }, { type: i2.DomSanitizer }]; } });
 
 /*
  * Copyright 2015-2020 Ritense BV, the Netherlands.
@@ -279,12 +239,12 @@ class PluginAddSelectComponent {
         });
     }
 }
-PluginAddSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginAddSelectComponent, deps: [{ token: PluginManagementService }, { token: PluginManagementStateService }, { token: i2$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-PluginAddSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginAddSelectComponent, selector: "valtimo-plugin-add-select", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container *ngIf=\"pluginDefinitionsWithLogos$ | async as pluginDefinitions; else loading\">\n  <div fxLayout=\"row wrap\" fxLayoutGap=\"22px grid\">\n    <ng-container\n      *ngTemplateOutlet=\"pluginDefinitionsTemplate; context: {pluginDefinitions: pluginDefinitions}\"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        noPluginDefinitionsTemplate;\n        context: {pluginDefinitions: pluginDefinitions}\n      \"\n    ></ng-container>\n  </div>\n</ng-container>\n\n<ng-template #noPluginDefinitionsTemplate let-pluginDefinitions=\"pluginDefinitions\">\n  <div fxFlex=\"100%\" *ngIf=\"pluginDefinitions?.length === 0\">\n    <v-paragraph [center]=\"true\" [fullWidth]=\"true\">{{\n      'pluginManagement.noDefinitions' | translate\n    }}</v-paragraph>\n  </div>\n</ng-template>\n\n<ng-template #pluginDefinitionsTemplate let-pluginDefinitions=\"pluginDefinitions\">\n  <div fxFlex=\"33.3%\" *ngFor=\"let pluginDefinition of pluginDefinitions\">\n    <v-card\n      [title]=\"'title' | pluginTranslate: pluginDefinition.key | async\"\n      [description]=\"'description' | pluginTranslate: pluginDefinition.key | async\"\n      [selectable]=\"true\"\n      [selected]=\"(selectedPluginDefinition$ | async)?.key === pluginDefinition.key\"\n      [fullHeight]=\"true\"\n      (selectEvent)=\"selectPluginDefinition(pluginDefinition)\"\n      (deselectEvent)=\"deselectPluginDefinition()\"\n    >\n      <div *ngIf=\"pluginDefinition.pluginLogoBase64\" role=\"header\">\n        <img\n          class=\"plugin-definition-logo\"\n          [title]=\"'title' | pluginTranslate: pluginDefinition.key | async\"\n          [src]=\"pluginDefinition.pluginLogoBase64\"\n        />\n      </div>\n    </v-card>\n  </div>\n</ng-template>\n\n<ng-template #loading>\n  <div fxLayout=\"row wrap\" fxLayoutGap=\"22px grid\">\n    <ng-container *ngTemplateOutlet=\"loadingCard\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"loadingCard\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"loadingCard\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #loadingCard>\n  <div fxFlex=\"33.3%\">\n    <v-card [loading]=\"true\" [loadingDescription]=\"true\" [loadingTitle]=\"true\"></v-card>\n  </div>\n</ng-template>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */.btn-back{position:absolute}.cards-container{display:flex;flex-flow:row wrap;width:100%}.card{width:calc(33.3% - 20px);margin-right:30px}.card:nth-child(3n+3){margin-right:0}.card-header{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.plugin-definition-logo{object-fit:contain;height:60px;width:100%}\n"], components: [{ type: i2$2.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic"] }, { type: i2$2.CardComponent, selector: "v-card", inputs: ["titleTranslationKey", "title", "descriptionTranslationKey", "description", "selectable", "selected", "fullHeight", "loading", "loadingTitle", "loadingDescription"], outputs: ["selectEvent", "deselectEvent"] }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i5.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i4$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i5.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i4$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i4$1.AsyncPipe, "translate": i2$1.TranslatePipe, "pluginTranslate": i2.PluginTranslatePipe } });
+PluginAddSelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginAddSelectComponent, deps: [{ token: i1.PluginManagementService }, { token: PluginManagementStateService }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
+PluginAddSelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginAddSelectComponent, selector: "valtimo-plugin-add-select", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container *ngIf=\"pluginDefinitionsWithLogos$ | async as pluginDefinitions; else loading\">\n  <div fxLayout=\"row wrap\" fxLayoutGap=\"22px grid\">\n    <ng-container\n      *ngTemplateOutlet=\"pluginDefinitionsTemplate; context: {pluginDefinitions: pluginDefinitions}\"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        noPluginDefinitionsTemplate;\n        context: {pluginDefinitions: pluginDefinitions}\n      \"\n    ></ng-container>\n  </div>\n</ng-container>\n\n<ng-template #noPluginDefinitionsTemplate let-pluginDefinitions=\"pluginDefinitions\">\n  <div fxFlex=\"100%\" *ngIf=\"pluginDefinitions?.length === 0\">\n    <v-paragraph [center]=\"true\" [fullWidth]=\"true\">{{\n      'pluginManagement.noDefinitions' | translate\n    }}</v-paragraph>\n  </div>\n</ng-template>\n\n<ng-template #pluginDefinitionsTemplate let-pluginDefinitions=\"pluginDefinitions\">\n  <div fxFlex=\"33.3%\" *ngFor=\"let pluginDefinition of pluginDefinitions\">\n    <v-card\n      [title]=\"'title' | pluginTranslate: pluginDefinition.key | async\"\n      [description]=\"'description' | pluginTranslate: pluginDefinition.key | async\"\n      [selectable]=\"true\"\n      [selected]=\"(selectedPluginDefinition$ | async)?.key === pluginDefinition.key\"\n      [fullHeight]=\"true\"\n      (selectEvent)=\"selectPluginDefinition(pluginDefinition)\"\n      (deselectEvent)=\"deselectPluginDefinition()\"\n    >\n      <div *ngIf=\"pluginDefinition.pluginLogoBase64\" role=\"header\">\n        <img\n          class=\"plugin-definition-logo\"\n          [title]=\"'title' | pluginTranslate: pluginDefinition.key | async\"\n          [src]=\"pluginDefinition.pluginLogoBase64\"\n        />\n      </div>\n    </v-card>\n  </div>\n</ng-template>\n\n<ng-template #loading>\n  <div fxLayout=\"row wrap\" fxLayoutGap=\"22px grid\">\n    <ng-container *ngTemplateOutlet=\"loadingCard\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"loadingCard\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"loadingCard\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #loadingCard>\n  <div fxFlex=\"33.3%\">\n    <v-card [loading]=\"true\" [loadingDescription]=\"true\" [loadingTitle]=\"true\"></v-card>\n  </div>\n</ng-template>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */.btn-back{position:absolute}.cards-container{display:flex;flex-flow:row wrap;width:100%}.card{width:calc(33.3% - 20px);margin-right:30px}.card:nth-child(3n+3){margin-right:0}.card-header{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.plugin-definition-logo{object-fit:contain;height:60px;width:100%}\n"], components: [{ type: i2$1.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading"] }, { type: i2$1.CardComponent, selector: "v-card", inputs: ["titleTranslationKey", "title", "descriptionTranslationKey", "description", "selectable", "selected", "fullHeight", "loading", "loadingTitle", "loadingDescription"], outputs: ["selectEvent", "deselectEvent"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i6.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i5.AsyncPipe, "translate": i3.TranslatePipe, "pluginTranslate": i1.PluginTranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginAddSelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-plugin-add-select', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container *ngIf=\"pluginDefinitionsWithLogos$ | async as pluginDefinitions; else loading\">\n  <div fxLayout=\"row wrap\" fxLayoutGap=\"22px grid\">\n    <ng-container\n      *ngTemplateOutlet=\"pluginDefinitionsTemplate; context: {pluginDefinitions: pluginDefinitions}\"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        noPluginDefinitionsTemplate;\n        context: {pluginDefinitions: pluginDefinitions}\n      \"\n    ></ng-container>\n  </div>\n</ng-container>\n\n<ng-template #noPluginDefinitionsTemplate let-pluginDefinitions=\"pluginDefinitions\">\n  <div fxFlex=\"100%\" *ngIf=\"pluginDefinitions?.length === 0\">\n    <v-paragraph [center]=\"true\" [fullWidth]=\"true\">{{\n      'pluginManagement.noDefinitions' | translate\n    }}</v-paragraph>\n  </div>\n</ng-template>\n\n<ng-template #pluginDefinitionsTemplate let-pluginDefinitions=\"pluginDefinitions\">\n  <div fxFlex=\"33.3%\" *ngFor=\"let pluginDefinition of pluginDefinitions\">\n    <v-card\n      [title]=\"'title' | pluginTranslate: pluginDefinition.key | async\"\n      [description]=\"'description' | pluginTranslate: pluginDefinition.key | async\"\n      [selectable]=\"true\"\n      [selected]=\"(selectedPluginDefinition$ | async)?.key === pluginDefinition.key\"\n      [fullHeight]=\"true\"\n      (selectEvent)=\"selectPluginDefinition(pluginDefinition)\"\n      (deselectEvent)=\"deselectPluginDefinition()\"\n    >\n      <div *ngIf=\"pluginDefinition.pluginLogoBase64\" role=\"header\">\n        <img\n          class=\"plugin-definition-logo\"\n          [title]=\"'title' | pluginTranslate: pluginDefinition.key | async\"\n          [src]=\"pluginDefinition.pluginLogoBase64\"\n        />\n      </div>\n    </v-card>\n  </div>\n</ng-template>\n\n<ng-template #loading>\n  <div fxLayout=\"row wrap\" fxLayoutGap=\"22px grid\">\n    <ng-container *ngTemplateOutlet=\"loadingCard\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"loadingCard\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"loadingCard\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #loadingCard>\n  <div fxFlex=\"33.3%\">\n    <v-card [loading]=\"true\" [loadingDescription]=\"true\" [loadingTitle]=\"true\"></v-card>\n  </div>\n</ng-template>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */.btn-back{position:absolute}.cards-container{display:flex;flex-flow:row wrap;width:100%}.card{width:calc(33.3% - 20px);margin-right:30px}.card:nth-child(3n+3){margin-right:0}.card-header{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.plugin-definition-logo{object-fit:contain;height:60px;width:100%}\n"] }]
-        }], ctorParameters: function () { return [{ type: PluginManagementService }, { type: PluginManagementStateService }, { type: i2$1.TranslateService }]; } });
+        }], ctorParameters: function () { return [{ type: i1.PluginManagementService }, { type: PluginManagementStateService }, { type: i3.TranslateService }]; } });
 
 /*
  * Copyright 2015-2020 Ritense BV, the Netherlands.
@@ -308,6 +268,7 @@ class PluginConfigureComponent {
         this.configuration = new EventEmitter();
         this.save$ = this.stateService.save$;
         this.pluginDefinitionKey$ = this.stateService.selectedPluginDefinition$.pipe(map(definition => definition === null || definition === void 0 ? void 0 : definition.key));
+        this.prefillConfiguration$ = of(undefined);
         this.disabled$ = this.stateService.inputDisabled$;
     }
     onValid(valid) {
@@ -318,10 +279,10 @@ class PluginConfigureComponent {
     }
 }
 PluginConfigureComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginConfigureComponent, deps: [{ token: PluginManagementStateService }], target: i0.ɵɵFactoryTarget.Component });
-PluginConfigureComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginConfigureComponent, selector: "valtimo-plugin-configure", outputs: { valid: "valid", configuration: "configuration" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-plugin-configuration-container\n  [pluginDefinitionKey]=\"pluginDefinitionKey$ | async\"\n  [save$]=\"save$\"\n  [disabled$]=\"disabled$\"\n  (valid)=\"onValid($event)\"\n  (configuration)=\"onFunctionConfiguration($event)\"\n  type=\"configuration\"\n></valtimo-plugin-configuration-container>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], components: [{ type: i2.PluginConfigurationContainerComponent, selector: "valtimo-plugin-configuration-container", inputs: ["type", "pluginDefinitionKey", "functionKey", "save$", "disabled$", "prefillConfiguration$"], outputs: ["valid", "configuration"] }], pipes: { "async": i4$1.AsyncPipe } });
+PluginConfigureComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginConfigureComponent, selector: "valtimo-plugin-configure", outputs: { valid: "valid", configuration: "configuration" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-plugin-configuration-container\n  *ngIf=\"pluginDefinitionKey$ | async as pluginDefinitionKey\"\n  [pluginDefinitionKey]=\"pluginDefinitionKey\"\n  [prefillConfiguration$]=\"prefillConfiguration$\"\n  [save$]=\"save$\"\n  [disabled$]=\"disabled$\"\n  (valid)=\"onValid($event)\"\n  (configuration)=\"onFunctionConfiguration($event)\"\n  type=\"configuration\"\n></valtimo-plugin-configuration-container>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], components: [{ type: i1.PluginConfigurationContainerComponent, selector: "valtimo-plugin-configuration-container", inputs: ["type", "pluginDefinitionKey", "functionKey", "save$", "disabled$", "prefillConfiguration$"], outputs: ["valid", "configuration"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i5.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginConfigureComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-plugin-configure', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-plugin-configuration-container\n  [pluginDefinitionKey]=\"pluginDefinitionKey$ | async\"\n  [save$]=\"save$\"\n  [disabled$]=\"disabled$\"\n  (valid)=\"onValid($event)\"\n  (configuration)=\"onFunctionConfiguration($event)\"\n  type=\"configuration\"\n></valtimo-plugin-configuration-container>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+            args: [{ selector: 'valtimo-plugin-configure', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-plugin-configuration-container\n  *ngIf=\"pluginDefinitionKey$ | async as pluginDefinitionKey\"\n  [pluginDefinitionKey]=\"pluginDefinitionKey\"\n  [prefillConfiguration$]=\"prefillConfiguration$\"\n  [save$]=\"save$\"\n  [disabled$]=\"disabled$\"\n  (valid)=\"onValid($event)\"\n  (configuration)=\"onFunctionConfiguration($event)\"\n  type=\"configuration\"\n></valtimo-plugin-configuration-container>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
         }], ctorParameters: function () { return [{ type: PluginManagementStateService }]; }, propDecorators: { valid: [{
                 type: Output
             }], configuration: [{
@@ -366,13 +327,10 @@ class PluginAddModalComponent {
     }
     hide() {
         this.stateService.disableInput();
-        this.modalService.closeModal();
-        this.modalService.appearingDelayMs$.pipe(take(1)).subscribe(appearingDelay => {
-            setTimeout(() => {
-                this.returnToFirstStep();
-                this.stateService.enableInput();
-                this.stateService.clear();
-            }, appearingDelay);
+        this.modalService.closeModal(() => {
+            this.returnToFirstStep();
+            this.stateService.enableInput();
+            this.stateService.clear();
         });
     }
     onValid(valid) {
@@ -417,16 +375,162 @@ class PluginAddModalComponent {
         this.modalService.openModal(this.pluginAddModal);
     }
 }
-PluginAddModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginAddModalComponent, deps: [{ token: PluginManagementStateService }, { token: i2$2.ModalService }, { token: PluginManagementService }, { token: i3$1.NGXLogger }], target: i0.ɵɵFactoryTarget.Component });
-PluginAddModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginAddModalComponent, selector: "valtimo-plugin-add-modal", viewQueries: [{ propertyName: "pluginAddModal", first: true, predicate: ["pluginAddModal"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<v-stepper-container\n  (completeEvent)=\"complete()\"\n  (cancelClickEvent)=\"hide()\"\n  [disabled]=\"inputDisabled$ | async\"\n  [returnToFirstStepSubject$]=\"returnToFirstStepSubject$\"\n>\n  <v-modal #pluginAddModal (closeEvent)=\"hide()\">\n    <div role=\"header\">\n      <v-stepper-header></v-stepper-header>\n    </div>\n    <div role=\"content\">\n      <v-stepper-content>\n        <v-stepper-step titleTranslationKey=\"pluginManagement.addSteps.step0\">\n          <valtimo-plugin-add-select></valtimo-plugin-add-select>\n        </v-stepper-step>\n        <v-stepper-step titleTranslationKey=\"pluginManagement.addSteps.step1\">\n          <valtimo-plugin-configure\n            (valid)=\"onValid($event)\"\n            (configuration)=\"onConfiguration($event)\"\n          ></valtimo-plugin-configure>\n        </v-stepper-step>\n      </v-stepper-content>\n    </div>\n    <div role=\"footer\">\n      <v-stepper-footer>\n        <v-stepper-footer-step\n          nextButtonTranslationKey=\"pluginManagement.addSteps.step1\"\n          [nextButtonEnabled]=\"selectedPluginDefinition$ | async\"\n        ></v-stepper-footer-step>\n        <v-stepper-footer-step\n          completeButtonTranslationKey=\"pluginManagement.addSteps.complete\"\n          [completeButtonEnabled]=\"configurationValid$ | async\"\n        ></v-stepper-footer-step>\n      </v-stepper-footer>\n    </div>\n  </v-modal>\n</v-stepper-container>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], components: [{ type: i2$2.StepperContainerComponent, selector: "v-stepper-container", inputs: ["returnToFirstStepSubject$", "disabled"], outputs: ["cancelClickEvent", "completeEvent", "nextStepEvent"] }, { type: i2$2.ModalComponent, selector: "v-modal", inputs: ["appearingDelayMs", "maxWidthPx"], outputs: ["closeEvent"] }, { type: i2$2.StepperHeaderComponent, selector: "v-stepper-header" }, { type: i2$2.StepperContentComponent, selector: "v-stepper-content" }, { type: i2$2.StepperStepComponent, selector: "v-stepper-step", inputs: ["titleTranslationKey"] }, { type: PluginAddSelectComponent, selector: "valtimo-plugin-add-select" }, { type: PluginConfigureComponent, selector: "valtimo-plugin-configure", outputs: ["valid", "configuration"] }, { type: i2$2.StepperFooterComponent, selector: "v-stepper-footer" }, { type: i2$2.StepperFooterStepComponent, selector: "v-stepper-footer-step", inputs: ["nextButtonEnabled", "completeButtonEnabled", "nextButtonTranslationKey", "cancelButtonTranslationKey", "completeButtonTranslationKey", "completeButtonMdiIcon", "showCompleteButton"] }], pipes: { "async": i4$1.AsyncPipe } });
+PluginAddModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginAddModalComponent, deps: [{ token: PluginManagementStateService }, { token: i2$1.ModalService }, { token: i1.PluginManagementService }, { token: i4.NGXLogger }], target: i0.ɵɵFactoryTarget.Component });
+PluginAddModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginAddModalComponent, selector: "valtimo-plugin-add-modal", viewQueries: [{ propertyName: "pluginAddModal", first: true, predicate: ["pluginAddModal"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<v-stepper-container\n  (completeEvent)=\"complete()\"\n  (cancelClickEvent)=\"hide()\"\n  [disabled]=\"inputDisabled$ | async\"\n  [returnToFirstStepSubject$]=\"returnToFirstStepSubject$\"\n>\n  <v-modal #pluginAddModal (closeEvent)=\"hide()\">\n    <div role=\"header\">\n      <v-stepper-header></v-stepper-header>\n    </div>\n    <div role=\"content\">\n      <v-stepper-content>\n        <v-stepper-step titleTranslationKey=\"pluginManagement.addSteps.step0\">\n          <valtimo-plugin-add-select></valtimo-plugin-add-select>\n        </v-stepper-step>\n        <v-stepper-step titleTranslationKey=\"pluginManagement.addSteps.step1\">\n          <valtimo-plugin-configure\n            (valid)=\"onValid($event)\"\n            (configuration)=\"onConfiguration($event)\"\n          ></valtimo-plugin-configure>\n        </v-stepper-step>\n      </v-stepper-content>\n    </div>\n    <div role=\"footer\">\n      <v-stepper-footer>\n        <v-stepper-footer-step\n          nextButtonTranslationKey=\"pluginManagement.addSteps.step1\"\n          [nextButtonEnabled]=\"selectedPluginDefinition$ | async\"\n        ></v-stepper-footer-step>\n        <v-stepper-footer-step\n          completeButtonTranslationKey=\"pluginManagement.addSteps.complete\"\n          [completeButtonEnabled]=\"configurationValid$ | async\"\n        ></v-stepper-footer-step>\n      </v-stepper-footer>\n    </div>\n  </v-modal>\n</v-stepper-container>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], components: [{ type: i2$1.StepperContainerComponent, selector: "v-stepper-container", inputs: ["returnToFirstStepSubject$", "disabled"], outputs: ["cancelClickEvent", "completeEvent", "nextStepEvent"] }, { type: i2$1.ModalComponent, selector: "v-modal", inputs: ["appearingDelayMs", "maxWidthPx"], outputs: ["closeEvent"] }, { type: i2$1.StepperHeaderComponent, selector: "v-stepper-header" }, { type: i2$1.StepperContentComponent, selector: "v-stepper-content" }, { type: i2$1.StepperStepComponent, selector: "v-stepper-step", inputs: ["titleTranslationKey"] }, { type: PluginAddSelectComponent, selector: "valtimo-plugin-add-select" }, { type: PluginConfigureComponent, selector: "valtimo-plugin-configure", outputs: ["valid", "configuration"] }, { type: i2$1.StepperFooterComponent, selector: "v-stepper-footer" }, { type: i2$1.StepperFooterStepComponent, selector: "v-stepper-footer-step", inputs: ["nextButtonEnabled", "completeButtonEnabled", "nextButtonTranslationKey", "cancelButtonTranslationKey", "completeButtonTranslationKey", "completeButtonMdiIcon", "showCompleteButton"] }], pipes: { "async": i5.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginAddModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-plugin-add-modal', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<v-stepper-container\n  (completeEvent)=\"complete()\"\n  (cancelClickEvent)=\"hide()\"\n  [disabled]=\"inputDisabled$ | async\"\n  [returnToFirstStepSubject$]=\"returnToFirstStepSubject$\"\n>\n  <v-modal #pluginAddModal (closeEvent)=\"hide()\">\n    <div role=\"header\">\n      <v-stepper-header></v-stepper-header>\n    </div>\n    <div role=\"content\">\n      <v-stepper-content>\n        <v-stepper-step titleTranslationKey=\"pluginManagement.addSteps.step0\">\n          <valtimo-plugin-add-select></valtimo-plugin-add-select>\n        </v-stepper-step>\n        <v-stepper-step titleTranslationKey=\"pluginManagement.addSteps.step1\">\n          <valtimo-plugin-configure\n            (valid)=\"onValid($event)\"\n            (configuration)=\"onConfiguration($event)\"\n          ></valtimo-plugin-configure>\n        </v-stepper-step>\n      </v-stepper-content>\n    </div>\n    <div role=\"footer\">\n      <v-stepper-footer>\n        <v-stepper-footer-step\n          nextButtonTranslationKey=\"pluginManagement.addSteps.step1\"\n          [nextButtonEnabled]=\"selectedPluginDefinition$ | async\"\n        ></v-stepper-footer-step>\n        <v-stepper-footer-step\n          completeButtonTranslationKey=\"pluginManagement.addSteps.complete\"\n          [completeButtonEnabled]=\"configurationValid$ | async\"\n        ></v-stepper-footer-step>\n      </v-stepper-footer>\n    </div>\n  </v-modal>\n</v-stepper-container>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
-        }], ctorParameters: function () { return [{ type: PluginManagementStateService }, { type: i2$2.ModalService }, { type: PluginManagementService }, { type: i3$1.NGXLogger }]; }, propDecorators: { pluginAddModal: [{
+        }], ctorParameters: function () { return [{ type: PluginManagementStateService }, { type: i2$1.ModalService }, { type: i1.PluginManagementService }, { type: i4.NGXLogger }]; }, propDecorators: { pluginAddModal: [{
                 type: ViewChild,
                 args: ['pluginAddModal']
             }] } });
 
+/*
+ * Copyright 2015-2020 Ritense BV, the Netherlands.
+ *
+ * Licensed under EUPL, Version 1.2 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+class PluginEditComponent {
+    constructor(stateService) {
+        this.stateService = stateService;
+        this.valid = new EventEmitter();
+        this.configuration = new EventEmitter();
+        this.saveEdit$ = this.stateService.saveEdit$;
+        this.pluginDefinitionKey$ = this.stateService.selectedPluginConfiguration$.pipe(map(configuration => { var _a; return (_a = configuration === null || configuration === void 0 ? void 0 : configuration.pluginDefinition) === null || _a === void 0 ? void 0 : _a.key; }));
+        this.prefillConfiguration$ = this.stateService.selectedPluginConfiguration$.pipe(map(configuration => configuration
+            ? Object.assign(Object.assign({}, configuration.properties), { configurationTitle: configuration.title }) : undefined));
+        this.disabled$ = this.stateService.inputDisabled$;
+    }
+    onValid(valid) {
+        this.valid.emit(valid);
+    }
+    onFunctionConfiguration(configuration) {
+        this.configuration.emit(configuration);
+    }
+}
+PluginEditComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginEditComponent, deps: [{ token: PluginManagementStateService }], target: i0.ɵɵFactoryTarget.Component });
+PluginEditComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginEditComponent, selector: "valtimo-plugin-edit", outputs: { valid: "valid", configuration: "configuration" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-plugin-configuration-container\n  *ngIf=\"pluginDefinitionKey$ | async as pluginDefinitionKey\"\n  [pluginDefinitionKey]=\"pluginDefinitionKey\"\n  [prefillConfiguration$]=\"prefillConfiguration$\"\n  [save$]=\"saveEdit$\"\n  [disabled$]=\"disabled$\"\n  (valid)=\"onValid($event)\"\n  (configuration)=\"onFunctionConfiguration($event)\"\n  type=\"configuration\"\n></valtimo-plugin-configuration-container>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], components: [{ type: i1.PluginConfigurationContainerComponent, selector: "valtimo-plugin-configuration-container", inputs: ["type", "pluginDefinitionKey", "functionKey", "save$", "disabled$", "prefillConfiguration$"], outputs: ["valid", "configuration"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i5.AsyncPipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginEditComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'valtimo-plugin-edit', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-plugin-configuration-container\n  *ngIf=\"pluginDefinitionKey$ | async as pluginDefinitionKey\"\n  [pluginDefinitionKey]=\"pluginDefinitionKey\"\n  [prefillConfiguration$]=\"prefillConfiguration$\"\n  [save$]=\"saveEdit$\"\n  [disabled$]=\"disabled$\"\n  (valid)=\"onValid($event)\"\n  (configuration)=\"onFunctionConfiguration($event)\"\n  type=\"configuration\"\n></valtimo-plugin-configuration-container>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+        }], ctorParameters: function () { return [{ type: PluginManagementStateService }]; }, propDecorators: { valid: [{
+                type: Output
+            }], configuration: [{
+                type: Output
+            }] } });
+
+/*
+ * Copyright 2015-2020 Ritense BV, the Netherlands.
+ *
+ * Licensed under EUPL, Version 1.2 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+class PluginEditModalComponent {
+    constructor(stateService, modalService, pluginManagementService, logger) {
+        this.stateService = stateService;
+        this.modalService = modalService;
+        this.pluginManagementService = pluginManagementService;
+        this.logger = logger;
+        this.inputDisabled$ = this.stateService.inputDisabled$;
+        this.selectedPluginConfiguration$ = this.stateService.selectedPluginConfiguration$;
+        this.configurationValid$ = new BehaviorSubject(false);
+    }
+    ngOnInit() {
+        this.openShowSubscription();
+        this.openHideSubscription();
+    }
+    save() {
+        this.stateService.saveEdit();
+    }
+    delete() {
+        this.stateService.disableInput();
+        this.stateService.selectedPluginConfiguration$
+            .pipe(take(1))
+            .subscribe(selectedPluginConfiguration => {
+            this.pluginManagementService
+                .deletePluginConfiguration(selectedPluginConfiguration.id)
+                .subscribe(() => {
+                this.stateService.refresh();
+                this.hide();
+            }, () => {
+                this.logger.error('Something went wrong with deleting the plugin configuration.');
+                this.stateService.enableInput();
+            });
+        });
+    }
+    hide() {
+        this.modalService.closeModal(() => {
+            this.stateService.enableInput();
+            this.stateService.clear();
+        });
+    }
+    onPluginValid(valid) {
+        this.configurationValid$.next(valid);
+    }
+    onPluginConfiguration(configuration) {
+        this.stateService.disableInput();
+        this.stateService.selectedPluginConfiguration$
+            .pipe(take(1))
+            .subscribe(selectedPluginConfiguration => {
+            const configurationTitle = configuration.configurationTitle;
+            const configurationData = Object.assign({}, configuration);
+            delete configurationData['configurationTitle'];
+            this.pluginManagementService
+                .updatePluginConfiguration(selectedPluginConfiguration.id, configurationTitle, configurationData)
+                .subscribe(() => {
+                this.stateService.refresh();
+                this.hide();
+            }, () => {
+                this.logger.error('Something went wrong with updating the plugin configuration.');
+                this.stateService.enableInput();
+            });
+        });
+    }
+    openShowSubscription() {
+        this.showSubscription = this.stateService.showModal$.subscribe(modalType => {
+            if (modalType === 'edit') {
+                this.show();
+            }
+        });
+    }
+    openHideSubscription() {
+        this.hideSubscription = this.stateService.hideModal$.subscribe(() => {
+            this.hide();
+        });
+    }
+    show() {
+        this.modalService.openModal(this.pluginEditModal);
+    }
+}
+PluginEditModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginEditModalComponent, deps: [{ token: PluginManagementStateService }, { token: i2$1.ModalService }, { token: i1.PluginManagementService }, { token: i4.NGXLogger }], target: i0.ɵɵFactoryTarget.Component });
+PluginEditModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginEditModalComponent, selector: "valtimo-plugin-edit-modal", viewQueries: [{ propertyName: "pluginEditModal", first: true, predicate: ["pluginEditModal"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<v-modal\n  #pluginEditModal\n  (closeEvent)=\"hide()\"\n  *ngIf=\"{selectedConfiguration: selectedPluginConfiguration$ | async} as obs\"\n>\n  <div role=\"header\">\n    <div class=\"edit-configuration-title\">\n      <v-title [margin]=\"false\" type=\"h2\">{{\n        obs.selectedConfiguration?.title +\n          ' - ' +\n          ('title' | pluginTranslate: obs.selectedConfiguration?.pluginDefinition?.key | async)\n      }}</v-title>\n    </div>\n  </div>\n  <div role=\"content\">\n    <valtimo-plugin-edit\n      (valid)=\"onPluginValid($event)\"\n      (configuration)=\"onPluginConfiguration($event)\"\n    ></valtimo-plugin-edit>\n  </div>\n  <div role=\"footer\">\n    <div class=\"edit-plugin-buttons\">\n      <v-button\n        [disabled]=\"inputDisabled$ | async\"\n        (clickEvent)=\"delete()\"\n        [mdiIcon]=\"'delete'\"\n        type=\"danger\"\n        >{{ 'pluginManagement.remove' | translate }}</v-button\n      >\n      <v-button\n        [disabled]=\"(configurationValid$ | async) === false || (inputDisabled$ | async)\"\n        (clickEvent)=\"save()\"\n        [mdiIcon]=\"'check'\"\n        type=\"success\"\n        >{{ 'pluginManagement.save' | translate }}</v-button\n      >\n    </div>\n  </div>\n</v-modal>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */.edit-plugin-buttons{display:flex;width:100%;justify-content:space-between}.edit-configuration-title{display:flex;width:100%;justify-content:center}\n"], components: [{ type: i2$1.ModalComponent, selector: "v-modal", inputs: ["appearingDelayMs", "maxWidthPx"], outputs: ["closeEvent"] }, { type: i2$1.TitleComponent, selector: "v-title", inputs: ["type", "margin"] }, { type: PluginEditComponent, selector: "valtimo-plugin-edit", outputs: ["valid", "configuration"] }, { type: i2$1.ButtonComponent, selector: "v-button", inputs: ["type", "mdiIcon", "disabled", "title", "titleTranslationKey"], outputs: ["clickEvent"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i5.AsyncPipe, "pluginTranslate": i1.PluginTranslatePipe, "translate": i3.TranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginEditModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'valtimo-plugin-edit-modal', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<v-modal\n  #pluginEditModal\n  (closeEvent)=\"hide()\"\n  *ngIf=\"{selectedConfiguration: selectedPluginConfiguration$ | async} as obs\"\n>\n  <div role=\"header\">\n    <div class=\"edit-configuration-title\">\n      <v-title [margin]=\"false\" type=\"h2\">{{\n        obs.selectedConfiguration?.title +\n          ' - ' +\n          ('title' | pluginTranslate: obs.selectedConfiguration?.pluginDefinition?.key | async)\n      }}</v-title>\n    </div>\n  </div>\n  <div role=\"content\">\n    <valtimo-plugin-edit\n      (valid)=\"onPluginValid($event)\"\n      (configuration)=\"onPluginConfiguration($event)\"\n    ></valtimo-plugin-edit>\n  </div>\n  <div role=\"footer\">\n    <div class=\"edit-plugin-buttons\">\n      <v-button\n        [disabled]=\"inputDisabled$ | async\"\n        (clickEvent)=\"delete()\"\n        [mdiIcon]=\"'delete'\"\n        type=\"danger\"\n        >{{ 'pluginManagement.remove' | translate }}</v-button\n      >\n      <v-button\n        [disabled]=\"(configurationValid$ | async) === false || (inputDisabled$ | async)\"\n        (clickEvent)=\"save()\"\n        [mdiIcon]=\"'check'\"\n        type=\"success\"\n        >{{ 'pluginManagement.save' | translate }}</v-button\n      >\n    </div>\n  </div>\n</v-modal>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */.edit-plugin-buttons{display:flex;width:100%;justify-content:space-between}.edit-configuration-title{display:flex;width:100%;justify-content:center}\n"] }]
+        }], ctorParameters: function () { return [{ type: PluginManagementStateService }, { type: i2$1.ModalService }, { type: i1.PluginManagementService }, { type: i4.NGXLogger }]; }, propDecorators: { pluginEditModal: [{
+                type: ViewChild,
+                args: ['pluginEditModal']
+            }] } });
+
 /*
  * Copyright 2015-2020 Ritense BV, the Netherlands.
  *
@@ -473,13 +577,17 @@ class PluginManagementComponent {
     showAddModal() {
         this.stateService.showModal('add');
     }
+    rowClicked(configuration) {
+        this.stateService.selectPluginConfiguration(configuration);
+        this.stateService.showModal('edit');
+    }
 }
-PluginManagementComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementComponent, deps: [{ token: PluginManagementService }, { token: i2$1.TranslateService }, { token: PluginManagementStateService }, { token: i2.PluginTranslationService }], target: i0.ɵɵFactoryTarget.Component });
-PluginManagementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginManagementComponent, selector: "valtimo-plugin-management", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<v-page-container\n  *ngIf=\"{\n    pluginConfigurations: pluginConfigurations$ | async,\n    columns: columns$ | async,\n    loading: loading$ | async\n  } as obs\"\n>\n  <v-page-header>\n    <v-page-header-introduction>\n      <v-title>{{ 'pages.plugins.title' | translate }}</v-title>\n      <v-paragraph>{{ 'pages.plugins.description' | translate }}</v-paragraph>\n    </v-page-header-introduction>\n    <v-page-header-actions>\n      <v-button\n        (clickEvent)=\"showAddModal()\"\n        type=\"primary\"\n        mdiIcon=\"plus\"\n        [disabled]=\"obs.loading\"\n      >\n        {{ 'pluginManagement.add' | translate }}\n      </v-button>\n    </v-page-header-actions>\n  </v-page-header>\n  <v-page-content>\n    <v-table\n      [loading]=\"obs.loading\"\n      [items]=\"obs.pluginConfigurations\"\n      [columns]=\"obs.columns\"\n      [showEditButtons]=\"false\"\n      [amountOfLoadingRows]=\"2\"\n      [itemsTranslationKey]=\"'pluginManagement.tableItemsText'\"\n      [showPagination]=\"false\"\n    ></v-table>\n  </v-page-content>\n</v-page-container>\n\n<valtimo-plugin-add-modal></valtimo-plugin-add-modal>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], components: [{ type: i2$2.PageContainerComponent, selector: "v-page-container" }, { type: i2$2.PageHeaderComponent, selector: "v-page-header" }, { type: i2$2.PageHeaderIntroductionComponent, selector: "v-page-header-introduction" }, { type: i2$2.TitleComponent, selector: "v-title", inputs: ["type", "margin"] }, { type: i2$2.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic"] }, { type: i2$2.PageHeaderActionsComponent, selector: "v-page-header-actions" }, { type: i2$2.ButtonComponent, selector: "v-button", inputs: ["type", "mdiIcon", "disabled", "title", "titleTranslationKey"], outputs: ["clickEvent"] }, { type: i2$2.PageContentComponent, selector: "v-page-content" }, { type: i2$2.TableComponent, selector: "v-table", inputs: ["items", "columns", "loading", "showEditButtons", "showPagination", "editButtonTranslationKey", "itemsTranslationKey", "noResultsTranslationKey", "mobileBreakpointPx", "amountOfLoadingRows", "collectionSize", "maxPaginationItemSize", "page", "size"], outputs: ["editButtonClicked", "paginationSizeSet", "paginationPageSet"] }, { type: PluginAddModalComponent, selector: "valtimo-plugin-add-modal" }], directives: [{ type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4$1.AsyncPipe, "translate": i2$1.TranslatePipe } });
+PluginManagementComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementComponent, deps: [{ token: i1.PluginManagementService }, { token: i3.TranslateService }, { token: PluginManagementStateService }, { token: i1.PluginTranslationService }], target: i0.ɵɵFactoryTarget.Component });
+PluginManagementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginManagementComponent, selector: "valtimo-plugin-management", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<v-page-container\n  *ngIf=\"{\n    pluginConfigurations: pluginConfigurations$ | async,\n    columns: columns$ | async,\n    loading: loading$ | async\n  } as obs\"\n>\n  <v-page-header>\n    <v-page-header-introduction>\n      <v-title>{{ 'pages.plugins.title' | translate }}</v-title>\n      <v-paragraph>{{ 'pages.plugins.description' | translate }}</v-paragraph>\n    </v-page-header-introduction>\n    <v-page-header-actions>\n      <v-button\n        (clickEvent)=\"showAddModal()\"\n        type=\"primary\"\n        mdiIcon=\"plus\"\n        [disabled]=\"obs.loading\"\n      >\n        {{ 'pluginManagement.add' | translate }}\n      </v-button>\n    </v-page-header-actions>\n  </v-page-header>\n  <v-page-content>\n    <v-table\n      [loading]=\"obs.loading\"\n      [items]=\"obs.pluginConfigurations\"\n      [columns]=\"obs.columns\"\n      [showEditButtons]=\"true\"\n      [amountOfLoadingRows]=\"2\"\n      [itemsTranslationKey]=\"'pluginManagement.tableItemsText'\"\n      [showPagination]=\"false\"\n      (editButtonClicked)=\"rowClicked($event)\"\n    ></v-table>\n  </v-page-content>\n</v-page-container>\n\n<valtimo-plugin-add-modal></valtimo-plugin-add-modal>\n\n<valtimo-plugin-edit-modal></valtimo-plugin-edit-modal>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], components: [{ type: i2$1.PageContainerComponent, selector: "v-page-container" }, { type: i2$1.PageHeaderComponent, selector: "v-page-header" }, { type: i2$1.PageHeaderIntroductionComponent, selector: "v-page-header-introduction" }, { type: i2$1.TitleComponent, selector: "v-title", inputs: ["type", "margin"] }, { type: i2$1.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading"] }, { type: i2$1.PageHeaderActionsComponent, selector: "v-page-header-actions" }, { type: i2$1.ButtonComponent, selector: "v-button", inputs: ["type", "mdiIcon", "disabled", "title", "titleTranslationKey"], outputs: ["clickEvent"] }, { type: i2$1.PageContentComponent, selector: "v-page-content" }, { type: i2$1.TableComponent, selector: "v-table", inputs: ["items", "columns", "loading", "showEditButtons", "showPagination", "editButtonTranslationKey", "itemsTranslationKey", "noResultsTranslationKey", "mobileBreakpointPx", "amountOfLoadingRows", "collectionSize", "maxPaginationItemSize", "page", "size"], outputs: ["editButtonClicked", "paginationSizeSet", "paginationPageSet"] }, { type: PluginAddModalComponent, selector: "valtimo-plugin-add-modal" }, { type: PluginEditModalComponent, selector: "valtimo-plugin-edit-modal" }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i5.AsyncPipe, "translate": i3.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-plugin-management', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<v-page-container\n  *ngIf=\"{\n    pluginConfigurations: pluginConfigurations$ | async,\n    columns: columns$ | async,\n    loading: loading$ | async\n  } as obs\"\n>\n  <v-page-header>\n    <v-page-header-introduction>\n      <v-title>{{ 'pages.plugins.title' | translate }}</v-title>\n      <v-paragraph>{{ 'pages.plugins.description' | translate }}</v-paragraph>\n    </v-page-header-introduction>\n    <v-page-header-actions>\n      <v-button\n        (clickEvent)=\"showAddModal()\"\n        type=\"primary\"\n        mdiIcon=\"plus\"\n        [disabled]=\"obs.loading\"\n      >\n        {{ 'pluginManagement.add' | translate }}\n      </v-button>\n    </v-page-header-actions>\n  </v-page-header>\n  <v-page-content>\n    <v-table\n      [loading]=\"obs.loading\"\n      [items]=\"obs.pluginConfigurations\"\n      [columns]=\"obs.columns\"\n      [showEditButtons]=\"false\"\n      [amountOfLoadingRows]=\"2\"\n      [itemsTranslationKey]=\"'pluginManagement.tableItemsText'\"\n      [showPagination]=\"false\"\n    ></v-table>\n  </v-page-content>\n</v-page-container>\n\n<valtimo-plugin-add-modal></valtimo-plugin-add-modal>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
-        }], ctorParameters: function () { return [{ type: PluginManagementService }, { type: i2$1.TranslateService }, { type: PluginManagementStateService }, { type: i2.PluginTranslationService }]; } });
+            args: [{ selector: 'valtimo-plugin-management', template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<v-page-container\n  *ngIf=\"{\n    pluginConfigurations: pluginConfigurations$ | async,\n    columns: columns$ | async,\n    loading: loading$ | async\n  } as obs\"\n>\n  <v-page-header>\n    <v-page-header-introduction>\n      <v-title>{{ 'pages.plugins.title' | translate }}</v-title>\n      <v-paragraph>{{ 'pages.plugins.description' | translate }}</v-paragraph>\n    </v-page-header-introduction>\n    <v-page-header-actions>\n      <v-button\n        (clickEvent)=\"showAddModal()\"\n        type=\"primary\"\n        mdiIcon=\"plus\"\n        [disabled]=\"obs.loading\"\n      >\n        {{ 'pluginManagement.add' | translate }}\n      </v-button>\n    </v-page-header-actions>\n  </v-page-header>\n  <v-page-content>\n    <v-table\n      [loading]=\"obs.loading\"\n      [items]=\"obs.pluginConfigurations\"\n      [columns]=\"obs.columns\"\n      [showEditButtons]=\"true\"\n      [amountOfLoadingRows]=\"2\"\n      [itemsTranslationKey]=\"'pluginManagement.tableItemsText'\"\n      [showPagination]=\"false\"\n      (editButtonClicked)=\"rowClicked($event)\"\n    ></v-table>\n  </v-page-content>\n</v-page-container>\n\n<valtimo-plugin-add-modal></valtimo-plugin-add-modal>\n\n<valtimo-plugin-edit-modal></valtimo-plugin-edit-modal>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.PluginManagementService }, { type: i3.TranslateService }, { type: PluginManagementStateService }, { type: i1.PluginTranslationService }]; } });
 
 /*
  * Copyright 2015-2020 Ritense BV, the Netherlands.
@@ -539,7 +647,9 @@ PluginManagementModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", v
 PluginManagementModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementModule, declarations: [PluginManagementComponent,
         PluginAddModalComponent,
         PluginAddSelectComponent,
-        PluginConfigureComponent], imports: [CommonModule,
+        PluginConfigureComponent,
+        PluginEditModalComponent,
+        PluginEditComponent], imports: [CommonModule,
         PluginManagementRoutingModule,
         TranslateModule,
         FlexLayoutModule,
@@ -555,7 +665,9 @@ PluginManagementModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0",
         PluginConfigurationContainerModule], exports: [PluginManagementComponent,
         PluginAddModalComponent,
         PluginAddSelectComponent,
-        PluginConfigureComponent] });
+        PluginConfigureComponent,
+        PluginEditModalComponent,
+        PluginEditComponent] });
 PluginManagementModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginManagementModule, providers: [PluginManagementStateService], imports: [[
             CommonModule,
             PluginManagementRoutingModule,
@@ -581,6 +693,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         PluginAddModalComponent,
                         PluginAddSelectComponent,
                         PluginConfigureComponent,
+                        PluginEditModalComponent,
+                        PluginEditComponent,
                     ],
                     imports: [
                         CommonModule,
@@ -603,6 +717,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         PluginAddModalComponent,
                         PluginAddSelectComponent,
                         PluginConfigureComponent,
+                        PluginEditModalComponent,
+                        PluginEditComponent,
                     ],
                 }]
         }] });
@@ -627,5 +743,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { PluginAddModalComponent, PluginAddSelectComponent, PluginConfigureComponent, PluginManagementComponent, PluginManagementModule, PluginManagementService, PluginManagementStateService };
+export { PluginAddModalComponent, PluginAddSelectComponent, PluginConfigureComponent, PluginEditComponent, PluginEditModalComponent, PluginManagementComponent, PluginManagementModule, PluginManagementStateService };
 //# sourceMappingURL=valtimo-plugin-management.mjs.map