@valtimo/plugin 5.3.0 → 5.4.0

package/fesm2020/valtimo-plugin.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, Injectable, Inject, Pipe, NgModule, EventEmitter, ViewContainerRef, Component, ViewChild, Input, Output } from '@angular/core';
-import { BehaviorSubject, combineLatest, of, Subject } from 'rxjs';
+import { BehaviorSubject, combineLatest, take, of, Subject } from 'rxjs';
 import { map, tap, switchMap } from 'rxjs/operators';
 import * as i1 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
@@ -67,9 +67,9 @@ class PluginService {
         return this._availablePluginIds$;
     }
 }
-PluginService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginService, deps: [{ token: PLUGINS_TOKEN }], target: i0.ɵɵFactoryTarget.Injectable });
-PluginService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginService, decorators: [{
+PluginService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginService, deps: [{ token: PLUGINS_TOKEN }], target: i0.ɵɵFactoryTarget.Injectable });
+PluginService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -111,9 +111,9 @@ class PluginTranslationService {
         return translation || `${pluginDefinitionKey}.${translateKey}`;
     }
 }
-PluginTranslationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslationService, deps: [{ token: i1.TranslateService }, { token: PluginService }], target: i0.ɵɵFactoryTarget.Injectable });
-PluginTranslationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslationService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslationService, decorators: [{
+PluginTranslationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslationService, deps: [{ token: i1.TranslateService }, { token: PluginService }], target: i0.ɵɵFactoryTarget.Injectable });
+PluginTranslationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslationService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslationService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -176,9 +176,9 @@ class PluginTranslatePipe {
         return this.pluginTranslationService.translate(translateKey, pluginDefinitionKey);
     }
 }
-PluginTranslatePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslatePipe, deps: [{ token: PluginTranslationService }, { token: PluginService }], target: i0.ɵɵFactoryTarget.Pipe });
-PluginTranslatePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslatePipe, name: "pluginTranslate" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslatePipe, decorators: [{
+PluginTranslatePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslatePipe, deps: [{ token: PluginTranslationService }, { token: PluginService }], target: i0.ɵɵFactoryTarget.Pipe });
+PluginTranslatePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslatePipe, name: "pluginTranslate" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslatePipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'pluginTranslate',
@@ -198,10 +198,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
  */
 class PluginTranslatePipeModule {
 }
-PluginTranslatePipeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslatePipeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PluginTranslatePipeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslatePipeModule, declarations: [PluginTranslatePipe], imports: [TranslateModule], exports: [PluginTranslatePipe] });
-PluginTranslatePipeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslatePipeModule, imports: [[TranslateModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginTranslatePipeModule, decorators: [{
+PluginTranslatePipeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslatePipeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+PluginTranslatePipeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslatePipeModule, declarations: [PluginTranslatePipe], imports: [TranslateModule], exports: [PluginTranslatePipe] });
+PluginTranslatePipeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslatePipeModule, imports: [[TranslateModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginTranslatePipeModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [TranslateModule],
@@ -330,9 +330,9 @@ class PluginConfigurationContainerComponent {
         });
     }
 }
-PluginConfigurationContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginConfigurationContainerComponent, deps: [{ token: PluginService }], target: i0.ɵɵFactoryTarget.Component });
-PluginConfigurationContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: PluginConfigurationContainerComponent, selector: "valtimo-plugin-configuration-container", inputs: { type: "type", pluginDefinitionKey: "pluginDefinitionKey", functionKey: "functionKey", clear$: "clear$", save$: "save$", disabled: "disabled", error: "error" }, outputs: { valid: "valid", configuration: "configuration" }, viewQueries: [{ propertyName: "dynamicContainer", first: true, predicate: ["pluginConfigurationComponent"], descendants: true, read: ViewContainerRef, static: 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<ng-template #pluginConfigurationComponent></ng-template>\n<ng-container *ngIf=\"noConfigurationComponentAvailable$ | async\">\n  <v-paragraph [center]=\"true\">{{ 'plugin.noConfigurationComponent' | translate }}</v-paragraph>\n</ng-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.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3.AsyncPipe, "translate": i1.TranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginConfigurationContainerComponent, decorators: [{
+PluginConfigurationContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginConfigurationContainerComponent, deps: [{ token: PluginService }], target: i0.ɵɵFactoryTarget.Component });
+PluginConfigurationContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: PluginConfigurationContainerComponent, selector: "valtimo-plugin-configuration-container", inputs: { type: "type", pluginDefinitionKey: "pluginDefinitionKey", functionKey: "functionKey", clear$: "clear$", save$: "save$", disabled: "disabled", error: "error" }, outputs: { valid: "valid", configuration: "configuration" }, viewQueries: [{ propertyName: "dynamicContainer", first: true, predicate: ["pluginConfigurationComponent"], descendants: true, read: ViewContainerRef, static: 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<ng-template #pluginConfigurationComponent></ng-template>\n<ng-container *ngIf=\"noConfigurationComponentAvailable$ | async\">\n  <v-paragraph [center]=\"true\">{{ 'plugin.noConfigurationComponent' | translate }}</v-paragraph>\n</ng-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.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3.AsyncPipe, "translate": i1.TranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginConfigurationContainerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-plugin-configuration-container', 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-template #pluginConfigurationComponent></ng-template>\n<ng-container *ngIf=\"noConfigurationComponentAvailable$ | async\">\n  <v-paragraph [center]=\"true\">{{ 'plugin.noConfigurationComponent' | translate }}</v-paragraph>\n</ng-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: PluginService }]; }, propDecorators: { dynamicContainer: [{
@@ -375,10 +375,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
  */
 class PluginConfigurationContainerModule {
 }
-PluginConfigurationContainerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginConfigurationContainerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PluginConfigurationContainerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginConfigurationContainerModule, declarations: [PluginConfigurationContainerComponent], imports: [CommonModule, ParagraphModule, TranslateModule], exports: [PluginConfigurationContainerComponent] });
-PluginConfigurationContainerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginConfigurationContainerModule, imports: [[CommonModule, ParagraphModule, TranslateModule]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: PluginConfigurationContainerModule, decorators: [{
+PluginConfigurationContainerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginConfigurationContainerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+PluginConfigurationContainerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginConfigurationContainerModule, declarations: [PluginConfigurationContainerComponent], imports: [CommonModule, ParagraphModule, TranslateModule], exports: [PluginConfigurationContainerComponent] });
+PluginConfigurationContainerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginConfigurationContainerModule, imports: [[CommonModule, ParagraphModule, TranslateModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: PluginConfigurationContainerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [PluginConfigurationContainerComponent],
@@ -402,26 +402,46 @@ class OpenZaakConfigurationComponent {
     constructor() {
         this.valid = new EventEmitter();
         this.configuration = new EventEmitter();
+        this.formValue$ = new BehaviorSubject(null);
+        this.valid$ = new BehaviorSubject(false);
+    }
+    ngOnInit() {
+        this.openSaveSubscription();
+    }
+    ngOnDestroy() {
+        this.saveSubscription?.unsubscribe();
     }
     formValueChange(formValue) {
-        this.configuration.emit(formValue);
+        this.formValue$.next(formValue);
         this.handleValid(formValue);
     }
     handleValid(formValue) {
-        const valid = formValue.name &&
+        const valid = !!(formValue.configurationTitle &&
             formValue.url &&
             formValue.catalogusUrl &&
             formValue.rsin &&
             formValue.secret &&
-            formValue.clientId;
-        this.valid.emit(!!valid);
+            formValue.clientId);
+        this.valid$.next(valid);
+        this.valid.emit(valid);
+    }
+    openSaveSubscription() {
+        this.saveSubscription = this.save$?.subscribe(save => {
+            combineLatest([this.formValue$, this.valid$])
+                .pipe(take(1))
+                .subscribe(([formValue, valid]) => {
+                if (valid) {
+                    this.configuration.emit(formValue);
+                }
+            });
+        });
     }
 }
-OpenZaakConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: OpenZaakConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-OpenZaakConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: OpenZaakConfigurationComponent, selector: "valtimo-open-zaak-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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<v-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"name\"\n    [title]=\"'name' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"url\"\n    [title]=\"'url' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"clientId\"\n    [title]=\"'clientId' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"secret\"\n    [title]=\"'secret' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"rsin\"\n    [title]=\"'rsin' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"catalogusUrl\"\n    [title]=\"'catalogusUrl' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n</v-form>\n", styles: [""], components: [{ type: i2.FormComponent, selector: "v-form", outputs: ["valueChange"] }, { type: i2.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "disabled", "step", "min", "maxLength"], outputs: ["valueChange"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: OpenZaakConfigurationComponent, decorators: [{
+OpenZaakConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: OpenZaakConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+OpenZaakConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: OpenZaakConfigurationComponent, selector: "valtimo-open-zaak-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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<v-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"configurationTitle\"\n    [title]=\"'configurationTitle' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"url\"\n    [title]=\"'url' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"clientId\"\n    [title]=\"'clientId' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"secret\"\n    [title]=\"'secret' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"rsin\"\n    [title]=\"'rsin' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"catalogusUrl\"\n    [title]=\"'catalogusUrl' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n</v-form>\n", styles: [""], components: [{ type: i2.FormComponent, selector: "v-form", outputs: ["valueChange"] }, { type: i2.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "disabled", "step", "min", "maxLength"], outputs: ["valueChange"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: OpenZaakConfigurationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-open-zaak-configuration', 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-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"name\"\n    [title]=\"'name' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"url\"\n    [title]=\"'url' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"clientId\"\n    [title]=\"'clientId' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"secret\"\n    [title]=\"'secret' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"rsin\"\n    [title]=\"'rsin' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"catalogusUrl\"\n    [title]=\"'catalogusUrl' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n</v-form>\n", styles: [""] }]
+            args: [{ selector: 'valtimo-open-zaak-configuration', 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-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"configurationTitle\"\n    [title]=\"'configurationTitle' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"url\"\n    [title]=\"'url' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"clientId\"\n    [title]=\"'clientId' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"secret\"\n    [title]=\"'secret' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"rsin\"\n    [title]=\"'rsin' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"catalogusUrl\"\n    [title]=\"'catalogusUrl' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n</v-form>\n", styles: [""] }]
         }], propDecorators: { clear$: [{
                 type: Input
             }], save$: [{
@@ -477,9 +497,9 @@ class SelectZaakTypeComponent {
         this.selectedZaakTypeUrl$.next(zaakTypeUrl);
     }
 }
-SelectZaakTypeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SelectZaakTypeComponent, deps: [{ token: i1$1.OpenZaakService }, { token: i2.ModalService }, { token: PluginTranslationService }], target: i0.ɵɵFactoryTarget.Component });
-SelectZaakTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: { pluginId: "pluginId", disabled: "disabled" }, outputs: { zaakTypeSelected: "zaakTypeSelected" }, 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\n  *ngIf=\"{\n    zaakTypeLinkSelectItems: zaakTypeLinkSelectItems$ | async,\n    selectedZaakType: selectedZaakType$ | async\n  } as obs\"\n>\n  <v-select\n    (selectedChange)=\"selectZaakTypeLink($event)\"\n    [items]=\"obs.zaakTypeLinkSelectItems\"\n    [disabled]=\"!obs.zaakTypeLinkSelectItems || disabled\"\n    [notFoundText]=\"'noZaakTypeLinksFound' | pluginTranslate: pluginId | async\"\n    [title]=\"'documentDefinition' | pluginTranslate: pluginId | async\"\n    [margin]=\"true\"\n    [widthInPx]=\"350\"\n  ></v-select>\n  <div class=\"selected-zaak-type\">\n    <v-input-label [title]=\"'zaakType' | pluginTranslate: pluginId | async\"></v-input-label>\n    <v-paragraph *ngIf=\"obs.selectedZaakType?.omschrijving; else noSelectedZaakType\">{{\n      obs.selectedZaakType.omschrijving\n    }}</v-paragraph>\n  </div>\n</ng-container>\n\n<ng-template #noSelectedZaakType>\n  <v-paragraph>{{ 'noZaakTypeSelected' | pluginTranslate: pluginId | async }}</v-paragraph>\n</ng-template>\n", styles: [".selected-zaak-type{margin-block-end:var(--v-input-margin)}\n"], components: [{ type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }, { type: i2.InputLabelComponent, selector: "v-input-label", inputs: ["name", "title", "titleTranslationKey"] }, { type: i2.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SelectZaakTypeComponent, decorators: [{
+SelectZaakTypeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SelectZaakTypeComponent, deps: [{ token: i1$1.OpenZaakService }, { token: i2.ModalService }, { token: PluginTranslationService }], target: i0.ɵɵFactoryTarget.Component });
+SelectZaakTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: { pluginId: "pluginId", disabled: "disabled" }, outputs: { zaakTypeSelected: "zaakTypeSelected" }, 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\n  *ngIf=\"{\n    zaakTypeLinkSelectItems: zaakTypeLinkSelectItems$ | async,\n    selectedZaakType: selectedZaakType$ | async\n  } as obs\"\n>\n  <v-select\n    (selectedChange)=\"selectZaakTypeLink($event)\"\n    [items]=\"obs.zaakTypeLinkSelectItems\"\n    [disabled]=\"!obs.zaakTypeLinkSelectItems || disabled\"\n    [notFoundText]=\"'noZaakTypeLinksFound' | pluginTranslate: pluginId | async\"\n    [title]=\"'documentDefinition' | pluginTranslate: pluginId | async\"\n    [margin]=\"true\"\n    [widthInPx]=\"350\"\n  ></v-select>\n  <div class=\"selected-zaak-type\">\n    <v-input-label [title]=\"'zaakType' | pluginTranslate: pluginId | async\"></v-input-label>\n    <v-paragraph *ngIf=\"obs.selectedZaakType?.omschrijving; else noSelectedZaakType\">{{\n      obs.selectedZaakType.omschrijving\n    }}</v-paragraph>\n  </div>\n</ng-container>\n\n<ng-template #noSelectedZaakType>\n  <v-paragraph>{{ 'noZaakTypeSelected' | pluginTranslate: pluginId | async }}</v-paragraph>\n</ng-template>\n", styles: [".selected-zaak-type{margin-block-end:var(--v-input-margin)}\n"], components: [{ type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }, { type: i2.InputLabelComponent, selector: "v-input-label", inputs: ["name", "title", "titleTranslationKey"] }, { type: i2.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SelectZaakTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-select-zaak-type', 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\n  *ngIf=\"{\n    zaakTypeLinkSelectItems: zaakTypeLinkSelectItems$ | async,\n    selectedZaakType: selectedZaakType$ | async\n  } as obs\"\n>\n  <v-select\n    (selectedChange)=\"selectZaakTypeLink($event)\"\n    [items]=\"obs.zaakTypeLinkSelectItems\"\n    [disabled]=\"!obs.zaakTypeLinkSelectItems || disabled\"\n    [notFoundText]=\"'noZaakTypeLinksFound' | pluginTranslate: pluginId | async\"\n    [title]=\"'documentDefinition' | pluginTranslate: pluginId | async\"\n    [margin]=\"true\"\n    [widthInPx]=\"350\"\n  ></v-select>\n  <div class=\"selected-zaak-type\">\n    <v-input-label [title]=\"'zaakType' | pluginTranslate: pluginId | async\"></v-input-label>\n    <v-paragraph *ngIf=\"obs.selectedZaakType?.omschrijving; else noSelectedZaakType\">{{\n      obs.selectedZaakType.omschrijving\n    }}</v-paragraph>\n  </div>\n</ng-container>\n\n<ng-template #noSelectedZaakType>\n  <v-paragraph>{{ 'noZaakTypeSelected' | pluginTranslate: pluginId | async }}</v-paragraph>\n</ng-template>\n", styles: [".selected-zaak-type{margin-block-end:var(--v-input-margin)}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.OpenZaakService }, { type: i2.ModalService }, { type: PluginTranslationService }]; }, propDecorators: { pluginId: [{
@@ -529,9 +549,9 @@ class CreateZaakConfigurationComponent {
             .subscribe();
     }
 }
-CreateZaakConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: CreateZaakConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CreateZaakConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: CreateZaakConfigurationComponent, selector: "valtimo-create-zaak-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n", styles: [""], components: [{ type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: ["pluginId", "disabled"], outputs: ["zaakTypeSelected"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: CreateZaakConfigurationComponent, decorators: [{
+CreateZaakConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: CreateZaakConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+CreateZaakConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: CreateZaakConfigurationComponent, selector: "valtimo-create-zaak-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n", styles: [""], components: [{ type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: ["pluginId", "disabled"], outputs: ["zaakTypeSelected"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: CreateZaakConfigurationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-create-zaak-configuration', 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n", styles: [""] }]
         }], propDecorators: { clear$: [{
@@ -606,9 +626,9 @@ class SetBesluitConfigurationComponent {
             .subscribe();
     }
 }
-SetBesluitConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SetBesluitConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SetBesluitConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: SetBesluitConfigurationComponent, selector: "valtimo-set-besluit-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n<v-select\n  [items]=\"besluitSelectItems\"\n  [margin]=\"true\"\n  [widthInPx]=\"350\"\n  [title]=\"'besluit' | pluginTranslate: pluginId | async\"\n  [disabled]=\"(selectedZaakType$ | async) === null || disabled\"\n  [clearSelectionSubject$]=\"clearSubject$\"\n  (selectedChange)=\"selectBesluit($event)\"\n></v-select>\n", styles: [""], components: [{ type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: ["pluginId", "disabled"], outputs: ["zaakTypeSelected"] }, { type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SetBesluitConfigurationComponent, decorators: [{
+SetBesluitConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SetBesluitConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SetBesluitConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: SetBesluitConfigurationComponent, selector: "valtimo-set-besluit-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n<v-select\n  [items]=\"besluitSelectItems\"\n  [margin]=\"true\"\n  [widthInPx]=\"350\"\n  [title]=\"'besluit' | pluginTranslate: pluginId | async\"\n  [disabled]=\"(selectedZaakType$ | async) === null || disabled\"\n  [clearSelectionSubject$]=\"clearSubject$\"\n  (selectedChange)=\"selectBesluit($event)\"\n></v-select>\n", styles: [""], components: [{ type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: ["pluginId", "disabled"], outputs: ["zaakTypeSelected"] }, { type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SetBesluitConfigurationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-set-besluit-configuration', 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n<v-select\n  [items]=\"besluitSelectItems\"\n  [margin]=\"true\"\n  [widthInPx]=\"350\"\n  [title]=\"'besluit' | pluginTranslate: pluginId | async\"\n  [disabled]=\"(selectedZaakType$ | async) === null || disabled\"\n  [clearSelectionSubject$]=\"clearSubject$\"\n  (selectedChange)=\"selectBesluit($event)\"\n></v-select>\n", styles: [""] }]
         }], propDecorators: { clear$: [{
@@ -693,9 +713,9 @@ class SetResultaatConfigurationComponent {
             .subscribe();
     }
 }
-SetResultaatConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SetResultaatConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SetResultaatConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: SetResultaatConfigurationComponent, selector: "valtimo-set-resultaat-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n<v-select\n  [items]=\"resultaatSelectItems\"\n  [margin]=\"true\"\n  [widthInPx]=\"350\"\n  [title]=\"'zaakResultaat' | pluginTranslate: pluginId | async\"\n  [disabled]=\"(selectedZaakType$ | async) === null || disabled\"\n  [clearSelectionSubject$]=\"clearSubject$\"\n  (selectedChange)=\"selectResultaat($event)\"\n></v-select>\n", styles: [""], components: [{ type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: ["pluginId", "disabled"], outputs: ["zaakTypeSelected"] }, { type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SetResultaatConfigurationComponent, decorators: [{
+SetResultaatConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SetResultaatConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SetResultaatConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: SetResultaatConfigurationComponent, selector: "valtimo-set-resultaat-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n<v-select\n  [items]=\"resultaatSelectItems\"\n  [margin]=\"true\"\n  [widthInPx]=\"350\"\n  [title]=\"'zaakResultaat' | pluginTranslate: pluginId | async\"\n  [disabled]=\"(selectedZaakType$ | async) === null || disabled\"\n  [clearSelectionSubject$]=\"clearSubject$\"\n  (selectedChange)=\"selectResultaat($event)\"\n></v-select>\n", styles: [""], components: [{ type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: ["pluginId", "disabled"], outputs: ["zaakTypeSelected"] }, { type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SetResultaatConfigurationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-set-resultaat-configuration', 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n<v-select\n  [items]=\"resultaatSelectItems\"\n  [margin]=\"true\"\n  [widthInPx]=\"350\"\n  [title]=\"'zaakResultaat' | pluginTranslate: pluginId | async\"\n  [disabled]=\"(selectedZaakType$ | async) === null || disabled\"\n  [clearSelectionSubject$]=\"clearSubject$\"\n  (selectedChange)=\"selectResultaat($event)\"\n></v-select>\n", styles: [""] }]
         }], propDecorators: { clear$: [{
@@ -775,9 +795,9 @@ class SetStatusConfigurationComponent {
             .subscribe();
     }
 }
-SetStatusConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SetStatusConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SetStatusConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: SetStatusConfigurationComponent, selector: "valtimo-set-status-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n<v-select\n  [items]=\"statusesSelectItems\"\n  [margin]=\"true\"\n  [widthInPx]=\"350\"\n  [title]=\"'zaakStatus' | pluginTranslate: pluginId | async\"\n  [disabled]=\"(selectedZaakType$ | async) === null || disabled\"\n  [clearSelectionSubject$]=\"clearSubject$\"\n  (selectedChange)=\"selectStatus($event)\"\n></v-select>\n", styles: [""], components: [{ type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: ["pluginId", "disabled"], outputs: ["zaakTypeSelected"] }, { type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SetStatusConfigurationComponent, decorators: [{
+SetStatusConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SetStatusConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SetStatusConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: SetStatusConfigurationComponent, selector: "valtimo-set-status-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n<v-select\n  [items]=\"statusesSelectItems\"\n  [margin]=\"true\"\n  [widthInPx]=\"350\"\n  [title]=\"'zaakStatus' | pluginTranslate: pluginId | async\"\n  [disabled]=\"(selectedZaakType$ | async) === null || disabled\"\n  [clearSelectionSubject$]=\"clearSubject$\"\n  (selectedChange)=\"selectStatus($event)\"\n></v-select>\n", styles: [""], components: [{ type: SelectZaakTypeComponent, selector: "valtimo-select-zaak-type", inputs: ["pluginId", "disabled"], outputs: ["zaakTypeSelected"] }, { type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SetStatusConfigurationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-set-status-configuration', 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-select-zaak-type\n  [pluginId]=\"pluginId\"\n  [disabled]=\"disabled\"\n  (zaakTypeSelected)=\"selectZaakType($event)\"\n></valtimo-select-zaak-type>\n<v-select\n  [items]=\"statusesSelectItems\"\n  [margin]=\"true\"\n  [widthInPx]=\"350\"\n  [title]=\"'zaakStatus' | pluginTranslate: pluginId | async\"\n  [disabled]=\"(selectedZaakType$ | async) === null || disabled\"\n  [clearSelectionSubject$]=\"clearSubject$\"\n  (selectedChange)=\"selectStatus($event)\"\n></v-select>\n", styles: [""] }]
         }], propDecorators: { clear$: [{
@@ -813,8 +833,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
  */
 class OpenZaakPluginModule {
 }
-OpenZaakPluginModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: OpenZaakPluginModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-OpenZaakPluginModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: OpenZaakPluginModule, declarations: [OpenZaakConfigurationComponent,
+OpenZaakPluginModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: OpenZaakPluginModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+OpenZaakPluginModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: OpenZaakPluginModule, declarations: [OpenZaakConfigurationComponent,
         CreateZaakConfigurationComponent,
         SetBesluitConfigurationComponent,
         SetResultaatConfigurationComponent,
@@ -832,7 +852,7 @@ OpenZaakPluginModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", ve
         SetResultaatConfigurationComponent,
         SetStatusConfigurationComponent,
         SelectZaakTypeComponent] });
-OpenZaakPluginModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: OpenZaakPluginModule, imports: [[
+OpenZaakPluginModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: OpenZaakPluginModule, imports: [[
             CommonModule,
             TitleModule,
             FormModule,
@@ -842,7 +862,7 @@ OpenZaakPluginModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", ve
             InputLabelModule,
             ParagraphModule,
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: OpenZaakPluginModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: OpenZaakPluginModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -928,7 +948,7 @@ const openZaakPluginSpecification = {
             'set-status': 'Status instellen',
             'set-resultaat': 'Resultaat instellen',
             'set-besluit': 'Besluit instellen',
-            name: 'Configuratienaam',
+            configurationTitle: 'Configuratienaam',
             url: 'OpenZaak URL',
             clientId: 'Client ID',
             secret: 'Secret',
@@ -950,7 +970,7 @@ const openZaakPluginSpecification = {
             'set-status': 'Set status',
             'set-resultaat': 'Set result',
             'set-besluit': 'Set besluit',
-            name: 'Configuration name',
+            configurationTitle: 'Configuration name',
             url: 'OpenZaak URL',
             clientId: 'Client ID',
             secret: 'Secret',
@@ -972,7 +992,7 @@ const openZaakPluginSpecification = {
             'set-status': 'Status festlegen',
             'set-resultaat': 'Ergebnis einstellen',
             'set-besluit': 'Besluit setzen',
-            name: 'Konfigurationsname',
+            configurationTitle: 'Konfigurationsname',
             url: 'OpenZaak URL',
             clientId: 'Client ID',
             secret: 'Secret',
@@ -1005,21 +1025,44 @@ class SmartDocumentsConfigurationComponent {
     constructor() {
         this.valid = new EventEmitter();
         this.configuration = new EventEmitter();
+        this.formValue$ = new BehaviorSubject(null);
+        this.valid$ = new BehaviorSubject(false);
+    }
+    ngOnInit() {
+        this.openSaveSubscription();
+    }
+    ngOnDestroy() {
+        this.saveSubscription?.unsubscribe();
     }
     formValueChange(formValue) {
-        this.configuration.emit(formValue);
+        this.formValue$.next(formValue);
         this.handleValid(formValue);
     }
     handleValid(formValue) {
-        const valid = formValue.name && formValue.url && formValue.password && formValue.username;
-        this.valid.emit(!!valid);
+        const valid = !!(formValue.configurationTitle &&
+            formValue.url &&
+            formValue.password &&
+            formValue.username);
+        this.valid$.next(valid);
+        this.valid.emit(valid);
+    }
+    openSaveSubscription() {
+        this.saveSubscription = this.save$?.subscribe(save => {
+            combineLatest([this.formValue$, this.valid$])
+                .pipe(take(1))
+                .subscribe(([formValue, valid]) => {
+                if (valid) {
+                    this.configuration.emit(formValue);
+                }
+            });
+        });
     }
 }
-SmartDocumentsConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SmartDocumentsConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SmartDocumentsConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: SmartDocumentsConfigurationComponent, selector: "valtimo-smart-documents-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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<v-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"name\"\n    [title]=\"'name' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"url\"\n    [title]=\"'url' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"username\"\n    [title]=\"'username' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"password\"\n    [title]=\"'password' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n</v-form>\n", styles: [""], components: [{ type: i2.FormComponent, selector: "v-form", outputs: ["valueChange"] }, { type: i2.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "disabled", "step", "min", "maxLength"], outputs: ["valueChange"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SmartDocumentsConfigurationComponent, decorators: [{
+SmartDocumentsConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartDocumentsConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+SmartDocumentsConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: SmartDocumentsConfigurationComponent, selector: "valtimo-smart-documents-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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<v-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"configurationTitle\"\n    [title]=\"'configurationTitle' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"url\"\n    [title]=\"'url' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"username\"\n    [title]=\"'username' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"password\"\n    [title]=\"'password' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n</v-form>\n", styles: [""], components: [{ type: i2.FormComponent, selector: "v-form", outputs: ["valueChange"] }, { type: i2.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "disabled", "step", "min", "maxLength"], outputs: ["valueChange"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartDocumentsConfigurationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-smart-documents-configuration', 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-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"name\"\n    [title]=\"'name' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"url\"\n    [title]=\"'url' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"username\"\n    [title]=\"'username' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"password\"\n    [title]=\"'password' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n</v-form>\n", styles: [""] }]
+            args: [{ selector: 'valtimo-smart-documents-configuration', 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-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"configurationTitle\"\n    [title]=\"'configurationTitle' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"url\"\n    [title]=\"'url' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"username\"\n    [title]=\"'username' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"password\"\n    [title]=\"'password' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n</v-form>\n", styles: [""] }]
         }], propDecorators: { clear$: [{
                 type: Input
             }], save$: [{
@@ -1069,9 +1112,9 @@ class GenerateDocumentConfigurationComponent {
         this.valid.emit(!!valid);
     }
 }
-GenerateDocumentConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: GenerateDocumentConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-GenerateDocumentConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.9", type: GenerateDocumentConfigurationComponent, selector: "valtimo-generate-document-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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<v-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"templateGroup\"\n    [title]=\"'templateGroup' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"templateName\"\n    [title]=\"'templateName' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-select\n    [items]=\"FORMAT_SELECT_ITEMS\"\n    [margin]=\"true\"\n    [widthInPx]=\"150\"\n    name=\"format\"\n    [title]=\"'format' | pluginTranslate: pluginId | async\"\n    [disabled]=\"disabled\"\n  ></v-select>\n  <v-multi-input\n    name=\"templateData\"\n    [title]=\"'templateData' | pluginTranslate: pluginId | async\"\n    type=\"keyValue\"\n  ></v-multi-input>\n</v-form>\n", styles: [""], components: [{ type: i2.FormComponent, selector: "v-form", outputs: ["valueChange"] }, { type: i2.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "disabled", "step", "min", "maxLength"], outputs: ["valueChange"] }, { type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }, { type: i2.MultiInputComponent, selector: "v-multi-input", inputs: ["name", "title", "titleTranslationKey", "type", "initialAmountOfRows", "minimumAmountOfRows", "maxRows", "addRowText", "addRowTranslationKey", "deleteRowText", "deleteRowTranslationKey"], outputs: ["valueChange"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: GenerateDocumentConfigurationComponent, decorators: [{
+GenerateDocumentConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GenerateDocumentConfigurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+GenerateDocumentConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: GenerateDocumentConfigurationComponent, selector: "valtimo-generate-document-configuration", inputs: { clear$: "clear$", save$: "save$", disabled: "disabled", error: "error", pluginId: "pluginId" }, 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<v-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"templateGroup\"\n    [title]=\"'templateGroup' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"templateName\"\n    [title]=\"'templateName' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-select\n    [items]=\"FORMAT_SELECT_ITEMS\"\n    [margin]=\"true\"\n    [widthInPx]=\"150\"\n    name=\"format\"\n    [title]=\"'format' | pluginTranslate: pluginId | async\"\n    [disabled]=\"disabled\"\n  ></v-select>\n  <v-multi-input\n    name=\"templateData\"\n    [title]=\"'templateData' | pluginTranslate: pluginId | async\"\n    type=\"keyValue\"\n  ></v-multi-input>\n</v-form>\n", styles: [""], components: [{ type: i2.FormComponent, selector: "v-form", outputs: ["valueChange"] }, { type: i2.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "disabled", "step", "min", "maxLength"], outputs: ["valueChange"] }, { type: i2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$"], outputs: ["selectedChange", "clear"] }, { type: i2.MultiInputComponent, selector: "v-multi-input", inputs: ["name", "title", "titleTranslationKey", "type", "initialAmountOfRows", "minimumAmountOfRows", "maxRows", "addRowText", "addRowTranslationKey", "deleteRowText", "deleteRowTranslationKey"], outputs: ["valueChange"] }], pipes: { "async": i3.AsyncPipe, "pluginTranslate": PluginTranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GenerateDocumentConfigurationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-generate-document-configuration', 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-form (valueChange)=\"formValueChange($event)\">\n  <v-input\n    name=\"templateGroup\"\n    [title]=\"'templateGroup' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-input\n    name=\"templateName\"\n    [title]=\"'templateName' | pluginTranslate: pluginId | async\"\n    [fullWidth]=\"true\"\n    [margin]=\"true\"\n    [disabled]=\"disabled\"\n  >\n  </v-input>\n  <v-select\n    [items]=\"FORMAT_SELECT_ITEMS\"\n    [margin]=\"true\"\n    [widthInPx]=\"150\"\n    name=\"format\"\n    [title]=\"'format' | pluginTranslate: pluginId | async\"\n    [disabled]=\"disabled\"\n  ></v-select>\n  <v-multi-input\n    name=\"templateData\"\n    [title]=\"'templateData' | pluginTranslate: pluginId | async\"\n    type=\"keyValue\"\n  ></v-multi-input>\n</v-form>\n", styles: [""] }]
         }], propDecorators: { clear$: [{
@@ -1107,14 +1150,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImpor
  */
 class SmartDocumentsPluginModule {
 }
-SmartDocumentsPluginModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SmartDocumentsPluginModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SmartDocumentsPluginModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SmartDocumentsPluginModule, declarations: [SmartDocumentsConfigurationComponent, GenerateDocumentConfigurationComponent], imports: [CommonModule,
+SmartDocumentsPluginModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartDocumentsPluginModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+SmartDocumentsPluginModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartDocumentsPluginModule, declarations: [SmartDocumentsConfigurationComponent, GenerateDocumentConfigurationComponent], imports: [CommonModule,
         PluginTranslatePipeModule,
         FormModule,
         InputModule,
         SelectModule,
         MultiInputModule], exports: [SmartDocumentsConfigurationComponent, GenerateDocumentConfigurationComponent] });
-SmartDocumentsPluginModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SmartDocumentsPluginModule, imports: [[
+SmartDocumentsPluginModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartDocumentsPluginModule, imports: [[
             CommonModule,
             PluginTranslatePipeModule,
             FormModule,
@@ -1122,7 +1165,7 @@ SmartDocumentsPluginModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.
             SelectModule,
             MultiInputModule,
         ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.9", ngImport: i0, type: SmartDocumentsPluginModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: SmartDocumentsPluginModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [SmartDocumentsConfigurationComponent, GenerateDocumentConfigurationComponent],
@@ -1185,7 +1228,7 @@ const smartDocumentsPluginSpecification = {
         nl: {
             title: 'SmartDocuments',
             description: 'Automatiseer documenten met slimme templates.',
-            name: 'Configuratienaam',
+            configurationTitle: 'Configuratienaam',
             url: 'SmartDocuments URL',
             username: 'Gebruikersnaam',
             password: 'Wachtwoord',
@@ -1198,7 +1241,7 @@ const smartDocumentsPluginSpecification = {
         en: {
             title: 'SmartDocuments',
             description: 'Automate documents with smart templates.',
-            name: 'Configuration name',
+            configurationTitle: 'Configuration name',
             url: 'SmartDocuments URL',
             username: 'Username',
             password: 'Password',
@@ -1211,7 +1254,7 @@ const smartDocumentsPluginSpecification = {
         de: {
             title: 'SmartDocuments',
             description: 'Automatisieren Sie Dokumente mit intelligenten Templates.',
-            name: 'Konfigurationsname',
+            configurationTitle: 'Konfigurationsname',
             url: 'SmartDocuments URL',
             username: 'Nutzername',
             password: 'Passwort',