@valtimo/form-management 4.15.2-next-main.8

package/fesm2015/valtimo-form-management.js

@@ -0,0 +1,638 @@
+import { ɵɵdefineInjectable, ɵɵinject, Injectable, Component, ViewEncapsulation, NgModule, EventEmitter, ViewChild, Input, Output } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { ConfigService } from '@valtimo/config';
+import { Router, ActivatedRoute, RouterModule } from '@angular/router';
+import { AuthGuardService } from '@valtimo/security';
+import { FormControl, Validators, FormBuilder, ReactiveFormsModule, FormsModule } from '@angular/forms';
+import { AlertService, FormIoModule, WidgetModule, ListModule, DropzoneModule, ModalModule } from '@valtimo/components';
+import { combineLatest, BehaviorSubject, Subscription, Subject } from 'rxjs';
+import { take, first } from 'rxjs/operators';
+import { ROLE_ADMIN } from '@valtimo/contract';
+import { CommonModule } from '@angular/common';
+import { TranslateService, TranslateModule } from '@ngx-translate/core';
+import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
+import { DocumentService } from '@valtimo/document';
+
+/*
+ * 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 FormManagementService {
+    constructor(http, configService) {
+        this.http = http;
+        this.configService = configService;
+        this.valtimoApiConfig = configService.config.valtimoApi;
+    }
+    getFormDefinition(formDefinitionId) {
+        return this.http.get(`${this.valtimoApiConfig.endpointUri}form-management/${formDefinitionId}`);
+    }
+    queryFormDefinitions(params) {
+        return this.http.get(`${this.valtimoApiConfig.endpointUri}form-management`, { observe: 'response', params: params });
+    }
+    createFormDefinition(request) {
+        return this.http.post(`${this.valtimoApiConfig.endpointUri}form-management`, request);
+    }
+    modifyFormDefinition(request) {
+        return this.http.put(`${this.valtimoApiConfig.endpointUri}form-management`, request);
+    }
+    deleteFormDefinition(formDefinitionId) {
+        return this.http.delete(`${this.valtimoApiConfig.endpointUri}form-management/${formDefinitionId}`);
+    }
+}
+FormManagementService.ɵprov = ɵɵdefineInjectable({ factory: function FormManagementService_Factory() { return new FormManagementService(ɵɵinject(HttpClient), ɵɵinject(ConfigService)); }, token: FormManagementService, providedIn: "root" });
+FormManagementService.decorators = [
+    { type: Injectable, args: [{
+                providedIn: 'root'
+            },] }
+];
+FormManagementService.ctorParameters = () => [
+    { type: HttpClient },
+    { type: ConfigService }
+];
+
+/*
+ * 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 FormManagementComponent {
+    constructor() {
+    }
+    ngOnInit() {
+    }
+}
+FormManagementComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'valtimo-form-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<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\">\n    <div class=\"text-right\">\n      <div class=\"btn-group mt-m3px mb-3\">\n        <button [routerLink]=\"'create'\" [queryParams]=\"{'upload': 'true'}\" class=\"btn btn-secondary btn-space\">\n          <i class=\"icon mdi mdi-upload\"></i>&nbsp;\n          {{ 'Upload' | translate }}\n        </button>\n        <button [routerLink]=\"'create'\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"icon mdi mdi-plus\"></i> &nbsp;\n          <span>{{ 'Create new Form' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <valtimo-widget>\n      <valtimo-form-management-list></valtimo-form-management-list>\n    </valtimo-widget>\n  </div>\n</div>\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 */"]
+            },] }
+];
+FormManagementComponent.ctorParameters = () => [];
+
+/*
+ * 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 FormManagementCreateComponent {
+    constructor(formManagementService, formBuilder, router, alertService, route) {
+        this.formManagementService = formManagementService;
+        this.formBuilder = formBuilder;
+        this.router = router;
+        this.alertService = alertService;
+        this.route = route;
+    }
+    get formControls() {
+        return this.form.controls;
+    }
+    ngOnInit() {
+        this.form = this.formBuilder.group({
+            name: new FormControl('', Validators.required)
+        });
+    }
+    reset() {
+        this.form.setValue({
+            name: ''
+        });
+    }
+    createFormDefinition() {
+        const emptyForm = {
+            display: 'form',
+            components: []
+        };
+        const request = {
+            name: this.form.value.name,
+            formDefinition: JSON.stringify(emptyForm)
+        };
+        combineLatest([this.formManagementService.createFormDefinition(request), this.route.queryParams])
+            .pipe(take(1))
+            .subscribe(([formDefinition, params]) => {
+            this.alertService.success('Created new Form');
+            if ((params === null || params === void 0 ? void 0 : params.upload) === 'true') {
+                this.router.navigate(['/form-management/edit', formDefinition.id], { queryParams: { upload: 'true' } });
+            }
+            else {
+                this.router.navigate(['/form-management/edit', formDefinition.id]);
+            }
+        }, err => {
+            this.alertService.error('Error creating new Form');
+        });
+    }
+}
+FormManagementCreateComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'valtimo-form-management-create',
+                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<div class=\"main-content\">\n  <div class=\"container-fluid\">\n    <div class=\"col-12 px-0 mb-5\">\n      <valtimo-widget>\n        <div class=\"bg-white p-5\">\n          <form [formGroup]=\"form\" (ngSubmit)=\"createFormDefinition()\">\n            <div class=\"form-group row\">\n              <label class=\"col-12 col-sm-3 col-form-label text-sm-right\" for=\"name\">Name</label>\n              <div class=\"col-12 col-sm-8 col-lg-6\">\n                <input type=\"text\" id=\"name\" formControlName=\"name\"\n                       class=\"form-control\" placeholder=\"Form definition name\"\n                       [ngClass]=\"{'is-valid': formControls.name.touched && formControls.name.valid, 'is-invalid': formControls.name.touched && formControls.name.errors}\"\n                       required/>\n                <div *ngIf=\"formControls.name.touched && formControls.name.errors\"\n                     class=\"invalid-feedback\">\n                  <div *ngIf=\"formControls.name.errors.required\">Name is required</div>\n                </div>\n              </div>\n            </div>\n            <div class=\"row pt-3 mt-1\">\n              <div class=\"col-12 col-sm-6 text-left\">\n                <a [routerLink]=\"'/forms'\" class=\"btn btn-space btn-default\">Back</a>\n              </div>\n              <div class=\"col-12 col-sm-6 text-right\">\n                <button class=\"btn btn-space btn-secondary\" type=\"button\" (click)=\"reset()\">Reset\n                </button>\n                <button class=\"btn btn-space btn-primary\" type=\"submit\" [disabled]=\"form.invalid\">\n                  Submit\n                </button>\n              </div>\n            </div>\n          </form>\n        </div>\n      </valtimo-widget>\n    </div>\n  </div>\n</div>\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 */"]
+            },] }
+];
+FormManagementCreateComponent.ctorParameters = () => [
+    { type: FormManagementService },
+    { type: FormBuilder },
+    { type: Router },
+    { type: AlertService },
+    { type: ActivatedRoute }
+];
+
+/*
+ * 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 FormManagementEditComponent {
+    constructor(formManagementService, alertService, route, router) {
+        this.formManagementService = formManagementService;
+        this.alertService = alertService;
+        this.route = route;
+        this.router = router;
+        this.showModal$ = new BehaviorSubject(false);
+        this.reloading$ = new BehaviorSubject(false);
+        this.modifiedFormDefinition = null;
+        this.formDefinition = null;
+        this.alertSub = Subscription.EMPTY;
+        this.formDefinitionId = null;
+    }
+    ngOnInit() {
+        this.loadFormDefinition();
+        this.checkToOpenUploadModal();
+    }
+    ngOnDestroy() {
+        this.alertSub.unsubscribe();
+    }
+    loadFormDefinition() {
+        this.formDefinitionId = this.route.snapshot.paramMap.get('id');
+        this.formManagementService.getFormDefinition(this.formDefinitionId).subscribe(formDefinition => {
+            this.formDefinition = formDefinition;
+        }, () => {
+            this.alertService.error('Error retrieving Form Definition');
+        });
+    }
+    modifyFormDefinition() {
+        const form = JSON.stringify(this.modifiedFormDefinition != null ? this.modifiedFormDefinition : this.formDefinition.formDefinition);
+        const request = {
+            id: this.formDefinition.id,
+            name: this.formDefinition.name,
+            formDefinition: form
+        };
+        this.formManagementService.modifyFormDefinition(request).subscribe(() => {
+            this.router.navigate(['/form-management']);
+            this.alertService.success('Form deployed');
+        }, err => {
+            this.alertService.error('Error deploying Form');
+        });
+    }
+    formBuilderChanged(event) {
+        this.modifiedFormDefinition = event.form;
+    }
+    delete() {
+        if (!this.alertSub.closed) {
+            return;
+        }
+        const mssg = 'Delete Form?';
+        const confirmations = [
+            {
+                label: 'Cancel',
+                class: 'btn btn-default',
+                value: false
+            },
+            {
+                label: 'Delete',
+                class: 'btn btn-primary',
+                value: true
+            }
+        ];
+        this.alertService.notification(mssg, confirmations);
+        this.alertSub = this.alertService.getAlertConfirmChangeEmitter()
+            .pipe(first())
+            .subscribe(alert => {
+            if (alert.confirm === true) {
+                this.deleteFormDefinition();
+            }
+        });
+    }
+    deleteFormDefinition() {
+        this.formManagementService.deleteFormDefinition(this.formDefinition.id).subscribe(() => {
+            this.router.navigate(['/form-management']);
+            this.alertService.success('Form deleted');
+        }, err => {
+            this.alertService.error('Error deleting Form');
+        });
+    }
+    downloadFormDefinition() {
+        const file = new Blob([JSON.stringify(this.formDefinition)], { type: 'text/json' });
+        const link = document.createElement('a');
+        link.download = `form_${this.formDefinition.name}.json`;
+        link.href = window.URL.createObjectURL(file);
+        link.click();
+        window.URL.revokeObjectURL(link.href);
+        link.remove();
+    }
+    showModal() {
+        this.showModal$.next(true);
+    }
+    setFormDefinition(formDefinition) {
+        var _a;
+        this.reloading$.next(true);
+        const definition = JSON.parse(formDefinition);
+        const components = (_a = definition === null || definition === void 0 ? void 0 : definition.formDefinition) === null || _a === void 0 ? void 0 : _a.components;
+        const currentDefinition = this.modifiedFormDefinition || this.formDefinition.formDefinition;
+        const newDefinition = Object.assign(Object.assign({}, currentDefinition), (components && { components }));
+        this.modifiedFormDefinition = newDefinition;
+        this.formDefinition.formDefinition = newDefinition;
+        this.reloading$.next(false);
+    }
+    checkToOpenUploadModal() {
+        this.route.queryParams.pipe(take(1))
+            .subscribe((params) => {
+            if ((params === null || params === void 0 ? void 0 : params.upload) === 'true') {
+                this.showModal();
+            }
+        });
+    }
+}
+FormManagementEditComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'valtimo-form-management-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<div class=\"main-content pt-0\">\n  <div class=\"container-fluid\" *ngIf=\"formDefinition\">\n    <div class=\"btn-group mt-m3px mb-3 float-right\">\n      <button class='btn btn-primary btn-space' (click)=\"downloadFormDefinition()\">\n        <i class=\"fa fa-save\"></i>\n        {{ 'Download' | translate }}\n      </button>\n      <button class=\"btn btn-secondary btn-space\" (click)=\"showModal()\" [disabled]=\"formDefinition.readOnly\">\n        <i class=\"icon mdi mdi-upload\"></i>&nbsp;\n        {{ 'Upload' | translate }}\n      </button>\n      <button class='btn btn-danger btn-space' (click)=\"delete()\" [disabled]=\"formDefinition.readOnly\">\n        <i class=\"fa fa-trash\"></i>&nbsp;Delete\n      </button>\n      <button class='btn btn-success btn-space' (click)=\"modifyFormDefinition()\" [disabled]=\"formDefinition.readOnly\">\n        <i class=\"fa fa-upload\"></i>&nbsp;Deploy\n      </button>\n    </div>\n    <div class=\"clearfix\"></div>\n    <div class=\"bg-light formbuilder-header overflow-auto\">\n      <h3 class=\"formbuilder-title\">{{formDefinition.name}}\n        <div *ngIf=\"formDefinition.readOnly\" class=\"pull-right\">\n          <span class=\"badge badge-pill badge-info increase-size\">Read-only</span>\n        </div>\n      </h3>\n    </div>\n    <ng-container *ngIf=\"!(reloading$ | async)\">\n      <valtimo-form-io-builder [form]=\"formDefinition.formDefinition\" (change)=\"formBuilderChanged($event)\"></valtimo-form-io-builder>\n    </ng-container>\n  </div>\n</div>\n\n<valtimo-form-management-upload\n        [show$]=\"showModal$\"\n        (definitionUploaded)=\"setFormDefinition($event)\"\n></valtimo-form-management-upload>\n",
+                encapsulation: ViewEncapsulation.None,
+                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.formcomponent.gu-mirror,.formbuilder .btn.formcomponent.drag-copy{background-color:silver;border-color:silver;color:#fff;font-weight:400}.btn.formcomponent.gu-mirror:active,.btn.formcomponent.gu-mirror:hover,.formbuilder .btn.formcomponent.drag-copy:active,.formbuilder .btn.formcomponent.drag-copy:hover{box-shadow:none}.btn.formcomponent.gu-mirror:active,.formbuilder .btn.formcomponent.drag-copy:active{background-color:silver;border-color:silver}.formbuilder-header{border:1px solid #dee2e6;border-bottom:0;font-size:18px;height:80px;padding-left:18px;padding-right:18px}.formbuilder-header .formbuilder-title{margin-bottom:7px;margin-top:21px}.formbuilder-header .formbuilder-subtitle{margin-bottom:12px;margin-top:0}.formbuilder{background:#fff;border:1px solid #dee2e6;margin-left:0!important;margin-right:0!important;padding:1rem}.formbuilder .form-builder-panel .builder-group-button[aria-expanded=\"\"],.formbuilder .form-builder-panel .builder-group-button[aria-expanded=false]{color:#a9a9a9}.formbuilder .form-builder-panel .builder-group-button[aria-expanded=true]{color:#000}.formbuilder .drag-and-drop-alert{display:none}.formbuilder .formarea{background-color:#fff;border:1px solid silver;padding:10px}.increase-size{font-size:1rem}"]
+            },] }
+];
+FormManagementEditComponent.ctorParameters = () => [
+    { type: FormManagementService },
+    { type: AlertService },
+    { type: ActivatedRoute },
+    { type: Router }
+];
+
+/*
+ * 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.
+ */
+const ɵ0 = { title: 'Form management', roles: [ROLE_ADMIN] }, ɵ1 = { title: 'Create new Form', roles: [ROLE_ADMIN] }, ɵ2 = { title: 'Form Builder', roles: [ROLE_ADMIN] };
+const routes = [
+    {
+        path: 'form-management',
+        component: FormManagementComponent,
+        canActivate: [AuthGuardService],
+        data: ɵ0
+    },
+    {
+        path: 'form-management/create',
+        component: FormManagementCreateComponent,
+        canActivate: [AuthGuardService],
+        data: ɵ1
+    },
+    {
+        path: 'form-management/edit/:id',
+        component: FormManagementEditComponent,
+        canActivate: [AuthGuardService],
+        data: ɵ2
+    }
+];
+class FormManagementRoutingModule {
+}
+FormManagementRoutingModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    RouterModule.forChild(routes)
+                ],
+                exports: [
+                    RouterModule
+                ],
+                declarations: []
+            },] }
+];
+
+/*
+ * 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 FormManagementListComponent {
+    constructor(formManagementService, router) {
+        this.formManagementService = formManagementService;
+        this.router = router;
+        this.formDefinitions = [];
+        this.formDefinitionFields = [
+            { key: 'name', label: 'Name' },
+            { key: 'readOnly', label: 'Read-only' }
+        ];
+        this.pagination = {
+            collectionSize: 0,
+            page: 1,
+            size: 10,
+            maxPaginationItemSize: 5
+        };
+        this.pageParam = 0;
+    }
+    paginationClicked(page) {
+        this.pageParam = page - 1;
+        this.loadFormDefinitions();
+    }
+    ngOnInit() {
+    }
+    paginationSet() {
+        this.loadFormDefinitions();
+    }
+    loadFormDefinitions(searchTerm) {
+        const params = { page: this.pageParam, size: this.pagination.size };
+        if (searchTerm) {
+            params['searchTerm'] = searchTerm;
+        }
+        this.formManagementService.queryFormDefinitions(params).subscribe((results) => {
+            this.pagination.collectionSize = results.body.totalElements;
+            this.formDefinitions = results.body.content;
+        });
+    }
+    editFormDefinition(formDefinition) {
+        this.router.navigate(['/form-management/edit', formDefinition.id]);
+    }
+    searchTermEntered(searchTerm) {
+        this.loadFormDefinitions(searchTerm);
+    }
+}
+FormManagementListComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'valtimo-form-management-list',
+                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-list [items]=\"formDefinitions\"\n              [fields]=\"formDefinitionFields\"\n              [viewMode]=\"true\"\n              [isSearchable]=\"true\"\n              [pagination]=\"pagination\"\n              paginationIdentifier=\"formManagementList\"\n              (paginationClicked)=\"paginationClicked($event)\"\n              (paginationSet)=\"paginationSet()\"\n              (rowClicked)=\"editFormDefinition($event)\"\n              [header]=\"true\"\n              (search)=\"searchTermEntered($event)\"\n>\n  <div header>\n    <h3 class=\"list-header-title\">{{ 'Forms' | translate }}</h3>\n    <h5 class=\"list-header-description\">{{ 'Overview of all Forms' | translate }}</h5>\n  </div>\n</valtimo-list>\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 */"]
+            },] }
+];
+FormManagementListComponent.ctorParameters = () => [
+    { type: FormManagementService },
+    { type: Router }
+];
+
+/*
+ * 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 FormManagementUploadComponent {
+    constructor(documentService, translateService) {
+        this.documentService = documentService;
+        this.translateService = translateService;
+        this.definitionUploaded = new EventEmitter();
+        this.clear$ = new Subject();
+        this.jsonString$ = new BehaviorSubject('');
+        this.error$ = new BehaviorSubject('');
+        this.disabled$ = new BehaviorSubject(false);
+        this.file$ = new BehaviorSubject(undefined);
+    }
+    ngAfterViewInit() {
+        this.openShowSubscription();
+        this.openFileSubscription();
+    }
+    ngOnDestroy() {
+        this.showSubscription.unsubscribe();
+        this.fileSubscription.unsubscribe();
+        this.closeErrorSubscription();
+    }
+    setFile(file) {
+        this.clearError();
+        this.file$.next(file);
+    }
+    uploadDefinition() {
+        this.disable();
+        this.jsonString$
+            .pipe(take(1))
+            .subscribe((definition) => {
+            this.closeErrorSubscription();
+            this.clearError();
+            this.enable();
+            this.hideModal();
+            this.definitionUploaded.emit(definition);
+        });
+    }
+    openErrorSubscription(errorCode) {
+        this.closeErrorSubscription();
+        this.errorSubscription = this.translateService.stream(errorCode).subscribe(error => {
+            this.error$.next(error);
+        });
+    }
+    closeErrorSubscription() {
+        if (this.errorSubscription) {
+            this.errorSubscription.unsubscribe();
+        }
+    }
+    clearError() {
+        this.error$.next('');
+    }
+    openFileSubscription() {
+        this.fileSubscription = this.file$.subscribe(file => {
+            if (file) {
+                const reader = new FileReader();
+                reader.onloadend = () => {
+                    const result = reader.result.toString();
+                    if (this.stringIsValidJson(result)) {
+                        this.jsonString$.next(result);
+                    }
+                };
+                reader.readAsText(file);
+            }
+            else {
+                this.clearJsonString();
+            }
+        });
+    }
+    openShowSubscription() {
+        this.showSubscription = this.show$.subscribe(show => {
+            if (show) {
+                this.showModal();
+            }
+            else {
+                this.hideModal();
+            }
+            this.clearJsonString();
+            this.clearError();
+            this.clearDropzone();
+        });
+    }
+    clearJsonString() {
+        this.jsonString$.next('');
+    }
+    clearDropzone() {
+        this.clear$.next();
+    }
+    showModal() {
+        this.modal.show();
+    }
+    hideModal() {
+        this.modal.hide();
+    }
+    stringIsValidJson(string) {
+        var _a, _b;
+        try {
+            // tslint:disable-next-line
+            (_b = (_a = JSON.parse(string)) === null || _a === void 0 ? void 0 : _a.formDefinition) === null || _b === void 0 ? void 0 : _b.components;
+        }
+        catch (e) {
+            this.clearDropzone();
+            this.openErrorSubscription('dropzone.error.invalidFormDef');
+            return false;
+        }
+        return true;
+    }
+    disable() {
+        this.disabled$.next(true);
+    }
+    enable() {
+        this.disabled$.next(false);
+    }
+}
+FormManagementUploadComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'valtimo-form-management-upload',
+                template: "<valtimo-modal #uploadFormDefinitionModal [title]=\"'uploadFormDefinition' | translate\" showFooter=\"true\">\n  <div class=\"mt-2\" body>\n    <valtimo-dropzone\n            [clear$]=\"clear$\"\n            (fileSelected)=\"setFile($event)\"\n            [disabled]=\"disabled$ | async\"\n            [subtitle]=\"'dropzone.formJsonDocDef' | translate\"\n            [externalError$]=\"error$\"\n    ></valtimo-dropzone>\n  </div>\n  <div footer>\n    <ng-container *ngIf=\"(jsonString$ | async) && !(error$ | async); else pleaseSelect\">\n      <button [disabled]=\"disabled$ | async\" class=\"btn btn-primary\" (click)=\"uploadDefinition()\">\n        {{ 'Upload' | translate }}\n      </button>\n    </ng-container>\n  </div>\n</valtimo-modal>\n\n<ng-template #pleaseSelect>\n  <button class=\"btn btn-primary\" [disabled]=\"true\">\n    {{ 'Select a document definition' | translate }}\n  </button>\n</ng-template>\n",
+                styles: [""]
+            },] }
+];
+FormManagementUploadComponent.ctorParameters = () => [
+    { type: DocumentService },
+    { type: TranslateService }
+];
+FormManagementUploadComponent.propDecorators = {
+    modal: [{ type: ViewChild, args: ['uploadFormDefinitionModal',] }],
+    show$: [{ type: Input }],
+    definitionUploaded: [{ 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 FormManagementModule {
+}
+FormManagementModule.decorators = [
+    { type: NgModule, args: [{
+                declarations: [
+                    FormManagementComponent,
+                    FormManagementCreateComponent,
+                    FormManagementListComponent,
+                    FormManagementEditComponent,
+                    FormManagementUploadComponent
+                ],
+                imports: [
+                    FormManagementRoutingModule,
+                    FormIoModule,
+                    CommonModule,
+                    ReactiveFormsModule,
+                    FormsModule,
+                    WidgetModule,
+                    ListModule,
+                    TranslateModule,
+                    NgbTooltipModule,
+                    DropzoneModule,
+                    ModalModule
+                ],
+                exports: [FormManagementComponent]
+            },] }
+];
+
+/*
+ * 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.
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { FormManagementComponent, FormManagementModule, FormManagementService, FormManagementCreateComponent as ɵa, FormManagementListComponent as ɵb, FormManagementEditComponent as ɵc, FormManagementUploadComponent as ɵd, FormManagementRoutingModule as ɵe };
+//# sourceMappingURL=valtimo-form-management.js.map