@valtimo/decision 5.8.0 → 5.9.0

package/fesm2015/valtimo-decision.mjs

@@ -2,16 +2,25 @@ import * as i0 from '@angular/core';
 import { Injectable, Component, EventEmitter, Output, ViewChild, ViewEncapsulation, NgModule } from '@angular/core';
 import * as i1 from '@valtimo/config';
 import { ROLE_ADMIN } from '@valtimo/config';
+import { Subject, startWith, BehaviorSubject, switchMap, map, tap, filter, combineLatest, from, take, catchError, of } from 'rxjs';
 import * as i2 from '@angular/common/http';
 import * as i2$1 from '@angular/router';
 import { RouterModule } from '@angular/router';
-import * as i3 from '@valtimo/components';
-import { WidgetModule, ListModule, ModalModule } from '@valtimo/components';
-import * as i3$1 from '@ngx-translate/core';
-import { TranslateModule } from '@ngx-translate/core';
+import * as i5 from '@valtimo/components';
+import { WidgetModule, ListModule, ModalModule, SpinnerModule } from '@valtimo/components';
+import * as i7 from '@angular/common';
 import { CommonModule } from '@angular/common';
+import * as i4 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
 import { AuthGuardService } from '@valtimo/security';
+import { __awaiter } from 'tslib';
+import DmnJS from 'dmn-js/dist/dmn-modeler.development.js';
+import { migrateDiagram } from '@bpmn-io/dmn-migrate';
+import * as i5$1 from '@valtimo/layout';
+import * as i6 from '@valtimo/user-interface';
+import { SelectModule } from '@valtimo/user-interface';
 import DmnViewer from 'dmn-js';
+import * as i3 from 'ngx-toastr';
 import { FormsModule } from '@angular/forms';
 
 /*
@@ -61,6 +70,12 @@ class DecisionService {
     getDecisions() {
         return this.http.get(`${this.valtimoApiConfig.endpointUri}camunda-rest/engine/default/decision-definition`);
     }
+    getDecisionById(decisionId) {
+        return this.http.get(`${this.valtimoApiConfig.endpointUri}camunda-rest/engine/default/decision-definition/${decisionId}`);
+    }
+    getLatestDecisionByKey(decisionKey) {
+        return this.http.get(`${this.valtimoApiConfig.endpointUri}camunda-rest/engine/default/decision-definition/key/${decisionKey}`);
+    }
     getDecisionXml(decisionId) {
         return this.http.get(`${this.valtimoApiConfig.endpointUri}camunda-rest/engine/default/decision-definition/${decisionId}/xml`);
     }
@@ -74,6 +89,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 }]
         }], ctorParameters: function () { return [{ type: i1.ConfigService }, { type: i2.HttpClient }]; } });
 
+class DecisionStateService {
+    constructor() {
+        this._refreshDecisions$ = new Subject();
+    }
+    get refreshDecisions$() {
+        return this._refreshDecisions$.asObservable().pipe(startWith(null));
+    }
+    refreshDecisions() {
+        this._refreshDecisions$.next(null);
+    }
+}
+DecisionStateService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+DecisionStateService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionStateService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionStateService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
 /*
  * Copyright 2015-2020 Ritense BV, the Netherlands.
  *
@@ -90,33 +125,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
  * limitations under the License.
  */
 class DecisionListComponent {
-    constructor(decisionService, router) {
+    constructor(decisionService, router, configService, stateService) {
         this.decisionService = decisionService;
         this.router = router;
+        this.configService = configService;
+        this.stateService = stateService;
         this.fields = [
             { key: 'key', label: 'Key' },
             { key: 'name', label: 'Name' },
             { key: 'version', label: 'Version' },
         ];
-    }
-    ngOnInit() {
-        this.loadDecisions();
-    }
-    loadDecisions() {
-        this.decisionService.getDecisions().subscribe((decisions) => {
-            this.decisions = decisions;
-        });
+        this.loading$ = new BehaviorSubject(true);
+        this.decisionsLatestVersions$ = this.stateService.refreshDecisions$.pipe(switchMap(() => this.decisionService.getDecisions()), map(decisions => decisions.reduce((acc, curr) => {
+            const findInAcc = acc.find(decision => decision.key === curr.key);
+            if (findInAcc && findInAcc.version > curr.version) {
+                return acc;
+            }
+            else if (findInAcc && findInAcc.version < curr.version) {
+                const newAcc = acc.filter(decision => decision.key !== curr.key);
+                return [...newAcc, curr];
+            }
+            return [...acc, curr];
+        }, [])), tap(() => this.loading$.next(false)));
+        this.experimentalEditing = this.configService.config.featureToggles.experimentalDmnEditing;
     }
     viewDecisionTable(decision) {
-        this.router.navigate(['/decision-tables', decision.id]);
+        if (this.experimentalEditing) {
+            this.router.navigate(['/decision-tables/edit', decision.id]);
+        }
+        else {
+            this.router.navigate(['/decision-tables', decision.id]);
+        }
     }
 }
-DecisionListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionListComponent, deps: [{ token: DecisionService }, { token: i2$1.Router }], target: i0.ɵɵFactoryTarget.Component });
-DecisionListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: DecisionListComponent, selector: "valtimo-decision-list", 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-widget>\n  <valtimo-list\n    [items]=\"decisions\"\n    [fields]=\"fields\"\n    (rowClicked)=\"viewDecisionTable($event)\"\n    [header]=\"true\"\n    [viewMode]=\"true\"\n    [isSearchable]=\"true\"\n  >\n    <div header>\n      <h3 class=\"list-header-title\">{{ 'Decision tables' | translate }}</h3>\n      <h5 class=\"list-header-description\">{{ 'Overview of all Decision tables' | translate }}</h5>\n    </div>\n  </valtimo-list>\n</valtimo-widget>\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: i3.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { type: i3.ListComponent, selector: "valtimo-list", inputs: ["items", "fields", "pagination", "viewMode", "isSearchable", "header", "actions", "paginationIdentifier", "initialSortState"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged"] }], pipes: { "translate": i3$1.TranslatePipe } });
+DecisionListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionListComponent, deps: [{ token: DecisionService }, { token: i2$1.Router }, { token: i1.ConfigService }, { token: DecisionStateService }], target: i0.ɵɵFactoryTarget.Component });
+DecisionListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: DecisionListComponent, selector: "valtimo-decision-list", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container *ngIf=\"decisionsLatestVersions$ | async as decisions\">\n  <ng-container *ngIf=\"(loading$ | async) === false\">\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"decisions\"\n        [fields]=\"fields\"\n        (rowClicked)=\"viewDecisionTable($event)\"\n        [header]=\"true\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Decision tables' | translate }}</h3>\n          <h5 class=\"list-header-description\">\n            {{ 'Overview of all Decision tables' | translate }}\n          </h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"loading$ | async\">\n  <valtimo-spinner></valtimo-spinner>\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: i5.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { type: i5.ListComponent, selector: "valtimo-list", inputs: ["items", "fields", "pagination", "viewMode", "isSearchable", "header", "actions", "paginationIdentifier", "initialSortState"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged"] }, { type: i5.SpinnerComponent, selector: "valtimo-spinner", inputs: ["useBootstrapSpinner", "name", "type", "size", "color", "bdColor", "fullScreen", "noMarginTop"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i7.AsyncPipe, "translate": i4.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-decision-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-widget>\n  <valtimo-list\n    [items]=\"decisions\"\n    [fields]=\"fields\"\n    (rowClicked)=\"viewDecisionTable($event)\"\n    [header]=\"true\"\n    [viewMode]=\"true\"\n    [isSearchable]=\"true\"\n  >\n    <div header>\n      <h3 class=\"list-header-title\">{{ 'Decision tables' | translate }}</h3>\n      <h5 class=\"list-header-description\">{{ 'Overview of all Decision tables' | translate }}</h5>\n    </div>\n  </valtimo-list>\n</valtimo-widget>\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: DecisionService }, { type: i2$1.Router }]; } });
+            args: [{ selector: 'valtimo-decision-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<ng-container *ngIf=\"decisionsLatestVersions$ | async as decisions\">\n  <ng-container *ngIf=\"(loading$ | async) === false\">\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"decisions\"\n        [fields]=\"fields\"\n        (rowClicked)=\"viewDecisionTable($event)\"\n        [header]=\"true\"\n        [viewMode]=\"true\"\n        [isSearchable]=\"true\"\n      >\n        <div header>\n          <h3 class=\"list-header-title\">{{ 'Decision tables' | translate }}</h3>\n          <h5 class=\"list-header-description\">\n            {{ 'Overview of all Decision tables' | translate }}\n          </h5>\n        </div>\n      </valtimo-list>\n    </valtimo-widget>\n  </ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"loading$ | async\">\n  <valtimo-spinner></valtimo-spinner>\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: DecisionService }, { type: i2$1.Router }, { type: i1.ConfigService }, { type: DecisionStateService }]; } });
 
 /*
  * Copyright 2015-2020 Ritense BV, the Netherlands.
@@ -134,8 +181,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
  * limitations under the License.
  */
 class DecisionDeployComponent {
-    constructor(decisionService) {
+    constructor(decisionService, stateService) {
         this.decisionService = decisionService;
+        this.stateService = stateService;
         this.dmn = null;
         this.deploySuccessful = new EventEmitter();
     }
@@ -147,18 +195,19 @@ class DecisionDeployComponent {
         this.decisionService.deployDmn(this.dmn).subscribe(() => {
             this.modal.hide();
             this.deploySuccessful.emit();
+            this.stateService.refreshDecisions();
         });
     }
     openModal() {
         this.modal.show();
     }
 }
-DecisionDeployComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionDeployComponent, deps: [{ token: DecisionService }], target: i0.ɵɵFactoryTarget.Component });
-DecisionDeployComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: DecisionDeployComponent, selector: "valtimo-decision-deploy", outputs: { deploySuccessful: "deploySuccessful" }, viewQueries: [{ propertyName: "modal", first: true, predicate: ["decisionDeployModal"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-modal\n  #decisionDeployModal\n  elementId=\"decisionDeployModal\"\n  title=\"Upload Decision table\"\n  [showFooter]=\"true\"\n>\n  <div body>\n    <div class=\"mt-3\">{{ 'decisions.upload.description' | translate }}</div>\n    <div class=\"form-group mt-3 mb-3\">\n      <input type=\"file\" id=\"file\" accept=\".dmn\" (change)=\"onChange($event.target.files)\" />\n    </div>\n  </div>\n  <div footer>\n    <div class=\"mb-0 p-3 text-right\">\n      <button\n        [disabled]=\"!dmn\"\n        class=\"btn btn-primary btn-space\"\n        type=\"button\"\n        (click)=\"deployDmn()\"\n      >\n        <i class=\"icon mdi mdi-upload mr-1\"></i>\n        {{ 'Upload' | translate }}\n      </button>\n    </div>\n  </div>\n</valtimo-modal>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], components: [{ type: i3.ModalComponent, selector: "valtimo-modal", inputs: ["elementId", "title", "subtitle", "templateBelowSubtitle", "showFooter"] }], pipes: { "translate": i3$1.TranslatePipe } });
+DecisionDeployComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionDeployComponent, deps: [{ token: DecisionService }, { token: DecisionStateService }], target: i0.ɵɵFactoryTarget.Component });
+DecisionDeployComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: DecisionDeployComponent, selector: "valtimo-decision-deploy", outputs: { deploySuccessful: "deploySuccessful" }, viewQueries: [{ propertyName: "modal", first: true, predicate: ["decisionDeployModal"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-modal\n  #decisionDeployModal\n  elementId=\"decisionDeployModal\"\n  title=\"Upload Decision table\"\n  [showFooter]=\"true\"\n>\n  <div body>\n    <div class=\"mt-3\">{{ 'decisions.upload.description' | translate }}</div>\n    <div class=\"form-group mt-3 mb-3\">\n      <input type=\"file\" id=\"file\" accept=\".dmn\" (change)=\"onChange($event.target.files)\" />\n    </div>\n  </div>\n  <div footer>\n    <div class=\"mb-0 p-3 text-right\">\n      <button\n        [disabled]=\"!dmn\"\n        class=\"btn btn-primary btn-space\"\n        type=\"button\"\n        (click)=\"deployDmn()\"\n      >\n        <i class=\"icon mdi mdi-upload mr-1\"></i>\n        {{ 'Upload' | translate }}\n      </button>\n    </div>\n  </div>\n</valtimo-modal>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], components: [{ type: i5.ModalComponent, selector: "valtimo-modal", inputs: ["elementId", "title", "subtitle", "templateBelowSubtitle", "showFooter"] }], pipes: { "translate": i4.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionDeployComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-decision-deploy', 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-modal\n  #decisionDeployModal\n  elementId=\"decisionDeployModal\"\n  title=\"Upload Decision table\"\n  [showFooter]=\"true\"\n>\n  <div body>\n    <div class=\"mt-3\">{{ 'decisions.upload.description' | translate }}</div>\n    <div class=\"form-group mt-3 mb-3\">\n      <input type=\"file\" id=\"file\" accept=\".dmn\" (change)=\"onChange($event.target.files)\" />\n    </div>\n  </div>\n  <div footer>\n    <div class=\"mb-0 p-3 text-right\">\n      <button\n        [disabled]=\"!dmn\"\n        class=\"btn btn-primary btn-space\"\n        type=\"button\"\n        (click)=\"deployDmn()\"\n      >\n        <i class=\"icon mdi mdi-upload mr-1\"></i>\n        {{ 'Upload' | translate }}\n      </button>\n    </div>\n  </div>\n</valtimo-modal>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
-        }], ctorParameters: function () { return [{ type: DecisionService }]; }, propDecorators: { deploySuccessful: [{
+        }], ctorParameters: function () { return [{ type: DecisionService }, { type: DecisionStateService }]; }, propDecorators: { deploySuccessful: [{
                 type: Output
             }], modal: [{
                 type: ViewChild,
@@ -181,13 +230,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
  * limitations under the License.
  */
 class DecisionComponent {
+    constructor(configService) {
+        this.configService = configService;
+        this.experimentalEditing = this.configService.config.featureToggles.experimentalDmnEditing;
+    }
 }
-DecisionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DecisionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: DecisionComponent, selector: "valtimo-decision", viewQueries: [{ propertyName: "deploy", first: true, predicate: ["decisionDeploy"], descendants: true }, { propertyName: "list", first: true, predicate: ["decisionList"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<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 (click)=\"this.deploy.openModal()\" class=\"btn btn-secondary btn-space mr-0\">\n          <i class=\"icon mdi mdi-upload mr-1\"></i>\n          {{ 'Upload' | translate }}\n        </button>\n      </div>\n    </div>\n    <valtimo-decision-list #decisionList></valtimo-decision-list>\n    <valtimo-decision-deploy\n      #decisionDeploy\n      (deploySuccessful)=\"this.list.loadDecisions()\"\n    ></valtimo-decision-deploy>\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 */\n"], components: [{ type: DecisionListComponent, selector: "valtimo-decision-list" }, { type: DecisionDeployComponent, selector: "valtimo-decision-deploy", outputs: ["deploySuccessful"] }], pipes: { "translate": i3$1.TranslatePipe } });
+DecisionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionComponent, deps: [{ token: i1.ConfigService }], target: i0.ɵɵFactoryTarget.Component });
+DecisionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: DecisionComponent, selector: "valtimo-decision", viewQueries: [{ propertyName: "deploy", first: true, predicate: ["decisionDeploy"], descendants: true }, { propertyName: "list", first: true, predicate: ["decisionList"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2020 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<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 (click)=\"this.deploy.openModal()\" class=\"btn btn-secondary btn-space\">\n          <i class=\"icon mdi mdi-upload mr-1\"></i>\n          {{ 'Upload' | translate }}\n        </button>\n        <!--        <button-->\n        <!--          *ngIf=\"experimentalEditing\"-->\n        <!--          class=\"btn btn-primary btn-space\"-->\n        <!--          [routerLink]=\"'edit/create'\"-->\n        <!--        >-->\n        <!--          <i class=\"icon mdi mdi-plus mr-1\"></i>-->\n        <!--          {{ 'Create decision table' | translate }}-->\n        <!--        </button>-->\n      </div>\n    </div>\n    <valtimo-decision-list #decisionList></valtimo-decision-list>\n    <valtimo-decision-deploy #decisionDeploy></valtimo-decision-deploy>\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 */\n"], components: [{ type: DecisionListComponent, selector: "valtimo-decision-list" }, { type: DecisionDeployComponent, selector: "valtimo-decision-deploy", outputs: ["deploySuccessful"] }], pipes: { "translate": i4.TranslatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-decision', 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 (click)=\"this.deploy.openModal()\" class=\"btn btn-secondary btn-space mr-0\">\n          <i class=\"icon mdi mdi-upload mr-1\"></i>\n          {{ 'Upload' | translate }}\n        </button>\n      </div>\n    </div>\n    <valtimo-decision-list #decisionList></valtimo-decision-list>\n    <valtimo-decision-deploy\n      #decisionDeploy\n      (deploySuccessful)=\"this.list.loadDecisions()\"\n    ></valtimo-decision-deploy>\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 */\n"] }]
-        }], propDecorators: { deploy: [{
+            args: [{ selector: 'valtimo-decision', 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 (click)=\"this.deploy.openModal()\" class=\"btn btn-secondary btn-space\">\n          <i class=\"icon mdi mdi-upload mr-1\"></i>\n          {{ 'Upload' | translate }}\n        </button>\n        <!--        <button-->\n        <!--          *ngIf=\"experimentalEditing\"-->\n        <!--          class=\"btn btn-primary btn-space\"-->\n        <!--          [routerLink]=\"'edit/create'\"-->\n        <!--        >-->\n        <!--          <i class=\"icon mdi mdi-plus mr-1\"></i>-->\n        <!--          {{ 'Create decision table' | translate }}-->\n        <!--        </button>-->\n      </div>\n    </div>\n    <valtimo-decision-list #decisionList></valtimo-decision-list>\n    <valtimo-decision-deploy #decisionDeploy></valtimo-decision-deploy>\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 */\n"] }]
+        }], ctorParameters: function () { return [{ type: i1.ConfigService }]; }, propDecorators: { deploy: [{
                 type: ViewChild,
                 args: ['decisionDeploy']
             }], list: [{
@@ -195,25 +248,236 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 args: ['decisionList']
             }] } });
 
-/*
- * 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 EMPTY_DECISION = {
+    id: '',
+    dmnXml: `<?xml version="1.0" encoding="UTF-8"?>
+<definitions xmlns="https://www.omg.org/spec/DMN/20191111/MODEL/" xmlns:dmndi="https://www.omg.org/spec/DMN/20191111/DMNDI/" xmlns:dc="http://www.omg.org/spec/DMN/20180521/DC/" id="Definitions_1h198v9" name="DRD" namespace="http://camunda.org/schema/1.0/dmn" xmlns:modeler="http://camunda.org/schema/modeler/1.0" exporter="Camunda Modeler" exporterVersion="5.2.0" modeler:executionPlatform="Camunda Cloud" modeler:executionPlatformVersion="8.0.0">
+  <decision id="Decision_1e18q76" name="Decision 1">
+    <decisionTable id="DecisionTable_1apu23m">
+      <input id="Input_1">
+        <inputExpression id="InputExpression_1" typeRef="string">
+          <text></text>
+        </inputExpression>
+      </input>
+      <output id="Output_1" typeRef="string" />
+    </decisionTable>
+  </decision>
+  <dmndi:DMNDI>
+    <dmndi:DMNDiagram>
+      <dmndi:DMNShape dmnElementRef="Decision_1e18q76">
+        <dc:Bounds height="80" width="180" x="160" y="100" />
+      </dmndi:DMNShape>
+    </dmndi:DMNDiagram>
+  </dmndi:DMNDI>
+</definitions>
+`,
+};
+
+class DecisionModelerComponent {
+    constructor(decisionService, route, router, alertService, translateService, layoutService) {
+        this.decisionService = decisionService;
+        this.route = route;
+        this.router = router;
+        this.alertService = alertService;
+        this.translateService = translateService;
+        this.layoutService = layoutService;
+        this.CLASS_NAMES = {
+            drd: 'dmn-icon-lasso-tool',
+            decisionTable: 'dmn-icon-decision-table',
+            literalExpression: 'dmn-icon-literal-expression',
+        };
+        this.versionSelectionDisabled$ = new BehaviorSubject(true);
+        this.isCreating$ = new BehaviorSubject(false);
+        this.decisionId$ = this.route.params.pipe(map(params => params === null || params === void 0 ? void 0 : params.id), tap(decisionId => this.isCreating$.next(decisionId === 'create')), filter(decisionId => !!decisionId && decisionId !== 'create'), tap(() => this.versionSelectionDisabled$.next(true)));
+        this.selectionId$ = new BehaviorSubject('');
+        this.decision$ = this.decisionId$.pipe(switchMap(decisionId => this.decisionService.getDecisionById(decisionId)), tap(decision => {
+            if (decision) {
+                this.selectionId$.next(decision.id);
+            }
+        }));
+        this.decisionTitle$ = this.decision$.pipe(map(decision => (decision === null || decision === void 0 ? void 0 : decision.key) || ''));
+        this.createdDecisionVersionSelectItems$ = new BehaviorSubject([]);
+        this.decisionVersionSelectItems$ = combineLatest([
+            this.decision$,
+            this.decisionService.getDecisions(),
+            this.createdDecisionVersionSelectItems$,
+        ]).pipe(map(([currentDecision, decisions, createdDecisionVersionSelectItems]) => {
+            const decisionsWithKey = decisions.filter(decision => decision.key === currentDecision.key);
+            return [
+                ...decisionsWithKey.map(decision => ({
+                    id: decision.id,
+                    text: decision.version.toString(),
+                })),
+                ...createdDecisionVersionSelectItems,
+            ].sort((a, b) => Number(b.text) - Number(a.text));
+        }), tap(() => this.versionSelectionDisabled$.next(false)));
+        this.decisionXml$ = this.decisionId$.pipe(switchMap(decisionId => this.decisionService.getDecisionXml(decisionId)), tap(decisionXml => {
+            if (decisionXml) {
+                this.loadDecisionXml(decisionXml);
+            }
+        }));
+        this.setTabEvents = () => {
+            const $tabs = this.$tabs;
+            const dmnModeler = this.dmnModeler;
+            $tabs.delegate('.tab', 'click', function (e) {
+                return __awaiter(this, void 0, void 0, function* () {
+                    // get index of view from clicked tab
+                    const viewIdx = parseInt(this.getAttribute('data-id'), 10);
+                    // get view using index
+                    const view = dmnModeler.getViews()[viewIdx];
+                    // open view
+                    try {
+                        yield dmnModeler.open(view);
+                    }
+                    catch (err) {
+                        console.error('error opening tab', err);
+                    }
+                });
+            });
+        };
+        this.setModelerEvents = () => {
+            const $tabs = this.$tabs;
+            const CLASS_NAMES = this.CLASS_NAMES;
+            this.dmnModeler.on('views.changed', function (event) {
+                // get views from event
+                const { views, activeView } = event;
+                // clear tabs
+                $tabs.empty();
+                // create a new tab for each view
+                views.forEach(function (v, idx) {
+                    const className = CLASS_NAMES[v.type];
+                    const tab = $(`
+            <div class="tab ${v === activeView ? 'active' : ''}" data-id="${idx}">
+              <span class="${className}"></span>
+              ${v.element.name || v.element.id}
+            </div>
+          `);
+                    $tabs.append(tab);
+                });
+            });
+        };
+    }
+    ngAfterViewInit() {
+        this.setProperties();
+        this.setTabEvents();
+        this.setModelerEvents();
+    }
+    switchVersion(decisionId) {
+        if (decisionId) {
+            this.router.navigate(['/decision-tables/edit', decisionId]);
+        }
+    }
+    deploy() {
+        from(this.dmnModeler.saveXML({ format: true }))
+            .pipe(map(result => result.xml), map(xml => new File([xml], 'decision.dmn', {
+            type: 'text/xml',
+        })), switchMap(file => this.decisionService.deployDmn(file)), tap(res => {
+            const deployedDefinitions = res.deployedDecisionDefinitions;
+            const deployedDecisionDefinition = deployedDefinitions[Object.keys(deployedDefinitions)[0]];
+            const deployedId = deployedDecisionDefinition.id;
+            this.createdDecisionVersionSelectItems$
+                .pipe(take(1))
+                .subscribe(createdDecisionVersionSelectItems => {
+                if (deployedDecisionDefinition) {
+                    this.createdDecisionVersionSelectItems$.next([
+                        ...createdDecisionVersionSelectItems,
+                        {
+                            id: deployedId,
+                            text: deployedDecisionDefinition.version.toString(),
+                        },
+                    ]);
+                }
+                if (deployedId) {
+                    setTimeout(() => {
+                        this.switchVersion(deployedId);
+                        this.alertService.success(this.translateService.instant('decisions.deploySuccess'));
+                    });
+                }
+            });
+        }), catchError(() => {
+            this.alertService.error(this.translateService.instant('decisions.deployFailure'));
+            return of(null);
+        }))
+            .subscribe();
+    }
+    download() {
+        from(this.dmnModeler.saveXML({ format: true }))
+            .pipe(map(result => result.xml), map(xml => new File([xml], 'decision.dmn', {
+            type: 'text/xml',
+        })), tap(file => {
+            const link = document.createElement('a');
+            link.download = 'diagram.dmn';
+            link.href = window.URL.createObjectURL(file);
+            link.click();
+            window.URL.revokeObjectURL(link.href);
+            link.remove();
+        }))
+            .subscribe();
+    }
+    setProperties() {
+        const isCreating = this.isCreating$.getValue();
+        this.$container = $('.editor-container');
+        this.$tabs = $('.editor-tabs');
+        this.dmnModeler = new DmnJS({
+            container: this.$container,
+            height: 500,
+            width: '100%',
+            keyboard: {
+                bindTo: window,
+            },
+        });
+        if (isCreating) {
+            this.loadEmptyDecisionTable();
+        }
+    }
+    loadEmptyDecisionTable() {
+        this.loadDecisionXml(EMPTY_DECISION);
+    }
+    loadDecisionXml(decision) {
+        from(this.dmnModeler.importXML(decision.dmnXml))
+            .pipe(tap(() => {
+            this.setEditor();
+        }), catchError(() => {
+            this.migrateAndLoadDecisionXml(decision);
+            return of(null);
+        }))
+            .subscribe();
+    }
+    migrateAndLoadDecisionXml(decision) {
+        from(migrateDiagram(decision.dmnXml))
+            .pipe(switchMap(decisionXml => this.dmnModeler.importXML(decisionXml)), tap(() => {
+            this.setEditor();
+        }), catchError(() => {
+            this.alertService.error(this.translateService.instant('decisions.loadFailure'));
+            return of(null);
+        }))
+            .subscribe();
+    }
+    setEditor() {
+        const dmnModeler = this.dmnModeler;
+        const activeView = dmnModeler.getActiveView();
+        // apply initial logic in DRD view
+        if (activeView.type === 'drd') {
+            const activeEditor = dmnModeler.getActiveViewer();
+            // access active editor components
+            const canvas = activeEditor.get('canvas');
+            // zoom to fit full viewport
+            canvas.zoom('fit-viewport');
+        }
+    }
+}
+DecisionModelerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionModelerComponent, deps: [{ token: DecisionService }, { token: i2$1.ActivatedRoute }, { token: i2$1.Router }, { token: i5.AlertService }, { token: i4.TranslateService }, { token: i5$1.LayoutService }], target: i0.ɵɵFactoryTarget.Component });
+DecisionModelerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: DecisionModelerComponent, selector: "valtimo-decision-modeler", 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<div\n  [ngClass]=\"{'main-content pt-0': !layoutService.isFullscreen}\"\n  class=\"mb-5\"\n  *ngIf=\"{\n    decisionXml: decisionXml$ | async\n  } as obs\"\n>\n  <div [ngClass]=\"{'container-fluid': !layoutService.isFullscreen}\">\n    <ng-container *ngTemplateOutlet=\"buttons\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"createButtons\"></ng-container>\n    <div [ngClass]=\"{'mt-4': !layoutService.isFullscreen}\" class=\"modeler pl-3 pr-3 mb-3\">\n      <ng-container *ngTemplateOutlet=\"diagramHeader\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"diagram\"></ng-container>\n    </div>\n  </div>\n</div>\n\n<ng-template #buttons>\n  <div\n    class=\"text-right\"\n    *ngIf=\"(isCreating$ | async) === false && {selectionId: selectionId$ | async} as obs\"\n  >\n    <div class=\"btn-group mt-m3px mb-3\" *ngIf=\"obs.selectionId && !layoutService.isFullscreen\">\n      <button class=\"btn btn-primary btn-space\" (click)=\"download()\">\n        <i class=\"icon mdi mdi-download mr-1\"></i>{{ 'processManagement.download' | translate }}\n      </button>\n      <button\n        class=\"btn btn-success btn-space\"\n        (click)=\"deploy()\"\n        [ngClass]=\"{'mr-0': obs.selectionId !== null}\"\n      >\n        <i class=\"icon mdi mdi-upload mr-1\"></i>{{ 'decisions.deploy' | translate }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #createButtons>\n  <div class=\"text-right\" *ngIf=\"isCreating$ | async\">\n    <div class=\"btn-group mt-m3px mb-3\" *ngIf=\"!layoutService.isFullscreen\">\n      <button class=\"btn btn-success btn-space\" (click)=\"deploy()\">\n        <i class=\"icon mdi mdi-upload mr-1\"></i>{{ 'decisions.deploy' | translate }}\n      </button>\n      <!--      <button-->\n      <!--        *ngIf=\"selectedVersion === null\"-->\n      <!--        class=\"btn btn-danger btn-space mr-0\"-->\n      <!--        (click)=\"reset()\"-->\n      <!--      >-->\n      <!--        <i class=\"icon mdi mdi-delete mr-1\"></i>{{ 'processManagement.clear' | translate }}-->\n      <!--      </button>-->\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #diagramHeader>\n  <div class=\"row pt-4 pb-3 bg-light diagram-header justify-content-between\">\n    <ng-container *ngTemplateOutlet=\"decisionTitle\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"versionSelection\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"fullScreenToggle\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #decisionTitle>\n  <div class=\"col-md-5 d-flex align-items-center\">\n    <h2 class=\"decision-title\">\n      {{ decisionTitle$ | async }}\n    </h2>\n  </div>\n</ng-template>\n\n<ng-template #versionSelection>\n  <div class=\"col-md-2 d-flex justify-content-center align-items-center\">\n    <ng-container\n      *ngIf=\"\n        (isCreating$ | async) === false && {\n          versionSelectItems: decisionVersionSelectItems$ | async,\n          defaultSelectionId: selectionId$ | async,\n          disabled: versionSelectionDisabled$ | async\n        } as obs\n      \"\n    >\n      <v-select\n        name=\"version\"\n        [title]=\"'decisions.version' | translate\"\n        [disabled]=\"obs.disabled\"\n        [clearable]=\"false\"\n        [loading]=\"!obs.versionSelectItems\"\n        [items]=\"obs.versionSelectItems\"\n        [defaultSelectionId]=\"obs.defaultSelectionId\"\n        [widthInPx]=\"100\"\n        (selectedChange)=\"switchVersion($event)\"\n      ></v-select>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-template #fullScreenToggle>\n  <div class=\"col-md-2 d-flex fullscreen-toggle align-items-start justify-content-end\">\n    <i\n      (click)=\"layoutService.toggleFullscreen()\"\n      [ngClass]=\"{\n        'mdi-fullscreen': !layoutService.isFullscreen,\n        'mdi-fullscreen-exit': layoutService.isFullscreen\n      }\"\n      class=\"mdi\"\n    ></i>\n  </div>\n</ng-template>\n\n<ng-template #diagram>\n  <div class=\"row bg-white diagram mb-3\">\n    <div class=\"dmn-modeler\">\n      <div class=\"test-container\">\n        <div class=\"editor-parent\">\n          <div class=\"editor-container\"></div>\n          <div class=\"editor-tabs\"></div>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */#save-button{position:absolute;bottom:10px;left:10px;background:white;border:solid 1px #ccc;border-radius:2px;padding:8px;font-family:Arial,sans-serif;font-weight:700;cursor:default;font-size:14px;color:#444}.dmn-modeler{display:flex;flex-direction:column;width:100%;padding:1rem}.diagram,.diagram-header{border:1px solid #dee2e6}.decision-title{color:#6b6b6b;font-size:1.5rem;margin:0}.fullscreen-toggle{font-size:2rem}.fullscreen-toggle>i{cursor:pointer}\n"], components: [{ type: i6.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "clearable", "disabled", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder"], outputs: ["selectedChange", "clear"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], pipes: { "async": i7.AsyncPipe, "translate": i4.TranslatePipe } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionModelerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'valtimo-decision-modeler', 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\n  [ngClass]=\"{'main-content pt-0': !layoutService.isFullscreen}\"\n  class=\"mb-5\"\n  *ngIf=\"{\n    decisionXml: decisionXml$ | async\n  } as obs\"\n>\n  <div [ngClass]=\"{'container-fluid': !layoutService.isFullscreen}\">\n    <ng-container *ngTemplateOutlet=\"buttons\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"createButtons\"></ng-container>\n    <div [ngClass]=\"{'mt-4': !layoutService.isFullscreen}\" class=\"modeler pl-3 pr-3 mb-3\">\n      <ng-container *ngTemplateOutlet=\"diagramHeader\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"diagram\"></ng-container>\n    </div>\n  </div>\n</div>\n\n<ng-template #buttons>\n  <div\n    class=\"text-right\"\n    *ngIf=\"(isCreating$ | async) === false && {selectionId: selectionId$ | async} as obs\"\n  >\n    <div class=\"btn-group mt-m3px mb-3\" *ngIf=\"obs.selectionId && !layoutService.isFullscreen\">\n      <button class=\"btn btn-primary btn-space\" (click)=\"download()\">\n        <i class=\"icon mdi mdi-download mr-1\"></i>{{ 'processManagement.download' | translate }}\n      </button>\n      <button\n        class=\"btn btn-success btn-space\"\n        (click)=\"deploy()\"\n        [ngClass]=\"{'mr-0': obs.selectionId !== null}\"\n      >\n        <i class=\"icon mdi mdi-upload mr-1\"></i>{{ 'decisions.deploy' | translate }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #createButtons>\n  <div class=\"text-right\" *ngIf=\"isCreating$ | async\">\n    <div class=\"btn-group mt-m3px mb-3\" *ngIf=\"!layoutService.isFullscreen\">\n      <button class=\"btn btn-success btn-space\" (click)=\"deploy()\">\n        <i class=\"icon mdi mdi-upload mr-1\"></i>{{ 'decisions.deploy' | translate }}\n      </button>\n      <!--      <button-->\n      <!--        *ngIf=\"selectedVersion === null\"-->\n      <!--        class=\"btn btn-danger btn-space mr-0\"-->\n      <!--        (click)=\"reset()\"-->\n      <!--      >-->\n      <!--        <i class=\"icon mdi mdi-delete mr-1\"></i>{{ 'processManagement.clear' | translate }}-->\n      <!--      </button>-->\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #diagramHeader>\n  <div class=\"row pt-4 pb-3 bg-light diagram-header justify-content-between\">\n    <ng-container *ngTemplateOutlet=\"decisionTitle\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"versionSelection\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"fullScreenToggle\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #decisionTitle>\n  <div class=\"col-md-5 d-flex align-items-center\">\n    <h2 class=\"decision-title\">\n      {{ decisionTitle$ | async }}\n    </h2>\n  </div>\n</ng-template>\n\n<ng-template #versionSelection>\n  <div class=\"col-md-2 d-flex justify-content-center align-items-center\">\n    <ng-container\n      *ngIf=\"\n        (isCreating$ | async) === false && {\n          versionSelectItems: decisionVersionSelectItems$ | async,\n          defaultSelectionId: selectionId$ | async,\n          disabled: versionSelectionDisabled$ | async\n        } as obs\n      \"\n    >\n      <v-select\n        name=\"version\"\n        [title]=\"'decisions.version' | translate\"\n        [disabled]=\"obs.disabled\"\n        [clearable]=\"false\"\n        [loading]=\"!obs.versionSelectItems\"\n        [items]=\"obs.versionSelectItems\"\n        [defaultSelectionId]=\"obs.defaultSelectionId\"\n        [widthInPx]=\"100\"\n        (selectedChange)=\"switchVersion($event)\"\n      ></v-select>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-template #fullScreenToggle>\n  <div class=\"col-md-2 d-flex fullscreen-toggle align-items-start justify-content-end\">\n    <i\n      (click)=\"layoutService.toggleFullscreen()\"\n      [ngClass]=\"{\n        'mdi-fullscreen': !layoutService.isFullscreen,\n        'mdi-fullscreen-exit': layoutService.isFullscreen\n      }\"\n      class=\"mdi\"\n    ></i>\n  </div>\n</ng-template>\n\n<ng-template #diagram>\n  <div class=\"row bg-white diagram mb-3\">\n    <div class=\"dmn-modeler\">\n      <div class=\"test-container\">\n        <div class=\"editor-parent\">\n          <div class=\"editor-container\"></div>\n          <div class=\"editor-tabs\"></div>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", styles: ["/*!\n * Copyright 2015-2020 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */#save-button{position:absolute;bottom:10px;left:10px;background:white;border:solid 1px #ccc;border-radius:2px;padding:8px;font-family:Arial,sans-serif;font-weight:700;cursor:default;font-size:14px;color:#444}.dmn-modeler{display:flex;flex-direction:column;width:100%;padding:1rem}.diagram,.diagram-header{border:1px solid #dee2e6}.decision-title{color:#6b6b6b;font-size:1.5rem;margin:0}.fullscreen-toggle{font-size:2rem}.fullscreen-toggle>i{cursor:pointer}\n"] }]
+        }], ctorParameters: function () { return [{ type: DecisionService }, { type: i2$1.ActivatedRoute }, { type: i2$1.Router }, { type: i5.AlertService }, { type: i4.TranslateService }, { type: i5$1.LayoutService }]; } });
+
 class DecisionDisplayComponent {
-    constructor(decisionService, route) {
+    constructor(decisionService, route, toasterService) {
         this.decisionService = decisionService;
         this.route = route;
+        this.toasterService = toasterService;
     }
     ngOnInit() {
         this.viewer = new DmnViewer({
@@ -224,10 +488,27 @@ class DecisionDisplayComponent {
     }
     loadDecisionXml() {
         this.decisionService.getDecisionXml(this.decisionId).subscribe((decision) => {
-            this.viewer.importXML(decision.dmnXml);
+            this.viewer.importXML(decision.dmnXml, error => {
+                if (error) {
+                    this.migrateAndLoadDecisionXml(decision);
+                }
+            });
             this.decisionXml = decision.dmnXml;
         });
     }
+    migrateAndLoadDecisionXml(decision) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const decisionXml = yield migrateDiagram(decision.dmnXml);
+            if (decisionXml) {
+                this.viewer.importXML(decisionXml, error => {
+                    if (error) {
+                        console.log('error');
+                    }
+                });
+                this.decisionXml = decisionXml;
+            }
+        });
+    }
     download() {
         const file = new Blob([this.decisionXml], { type: 'text/xml' });
         const link = document.createElement('a');
@@ -238,12 +519,12 @@ class DecisionDisplayComponent {
         link.remove();
     }
 }
-DecisionDisplayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionDisplayComponent, deps: [{ token: DecisionService }, { token: i2$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
-DecisionDisplayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: DecisionDisplayComponent, selector: "valtimo-decision-display", 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<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 (click)=\"download()\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"fa fa-save\"></i> &nbsp;\n          <span>{{ 'Download' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <div id=\"canvas\" class=\"canvas-dmn\"></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 */.canvas-dmn{height:70vh}\n"], pipes: { "translate": i3$1.TranslatePipe }, encapsulation: i0.ViewEncapsulation.None });
+DecisionDisplayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionDisplayComponent, deps: [{ token: DecisionService }, { token: i2$1.ActivatedRoute }, { token: i3.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
+DecisionDisplayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: DecisionDisplayComponent, selector: "valtimo-decision-display", 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<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 (click)=\"download()\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"fa fa-save\"></i> &nbsp;\n          <span>{{ 'Download' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <div id=\"canvas\" class=\"canvas-dmn\"></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 */.canvas-dmn{height:70vh}\n"], pipes: { "translate": i4.TranslatePipe }, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionDisplayComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-decision-display', encapsulation: ViewEncapsulation.None, 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 (click)=\"download()\" class=\"btn btn-primary btn-space mr-0\">\n          <i class=\"fa fa-save\"></i> &nbsp;\n          <span>{{ 'Download' | translate }}</span>\n        </button>\n      </div>\n    </div>\n    <div id=\"canvas\" class=\"canvas-dmn\"></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 */.canvas-dmn{height:70vh}\n"] }]
-        }], ctorParameters: function () { return [{ type: DecisionService }, { type: i2$1.ActivatedRoute }]; } });
+        }], ctorParameters: function () { return [{ type: DecisionService }, { type: i2$1.ActivatedRoute }, { type: i3.ToastrService }]; } });
 
 /*
  * Copyright 2015-2020 Ritense BV, the Netherlands.
@@ -273,6 +554,18 @@ const routes = [
         canActivate: [AuthGuardService],
         data: { title: 'Decision tables', roles: [ROLE_ADMIN] },
     },
+    {
+        path: 'decision-tables/edit/:id',
+        component: DecisionModelerComponent,
+        canActivate: [AuthGuardService],
+        data: { title: 'Edit decision table', roles: [ROLE_ADMIN] },
+    },
+    {
+        path: 'decision-tables/edit/create',
+        component: DecisionModelerComponent,
+        canActivate: [AuthGuardService],
+        data: { title: 'Create decision table', roles: [ROLE_ADMIN] },
+    },
 ];
 class DecisionRoutingModule {
 }
@@ -309,13 +602,16 @@ DecisionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version:
 DecisionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionModule, declarations: [DecisionComponent,
         DecisionDeployComponent,
         DecisionDisplayComponent,
-        DecisionListComponent], imports: [DecisionRoutingModule,
+        DecisionListComponent,
+        DecisionModelerComponent], imports: [DecisionRoutingModule,
         WidgetModule,
         ListModule,
         TranslateModule,
         ModalModule,
         CommonModule,
-        FormsModule], exports: [DecisionComponent] });
+        FormsModule,
+        SelectModule,
+        SpinnerModule], exports: [DecisionComponent, DecisionModelerComponent] });
 DecisionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionModule, imports: [[
             DecisionRoutingModule,
             WidgetModule,
@@ -324,6 +620,8 @@ DecisionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
             ModalModule,
             CommonModule,
             FormsModule,
+            SelectModule,
+            SpinnerModule,
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: DecisionModule, decorators: [{
             type: NgModule,
@@ -333,6 +631,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         DecisionDeployComponent,
                         DecisionDisplayComponent,
                         DecisionListComponent,
+                        DecisionModelerComponent,
                     ],
                     imports: [
                         DecisionRoutingModule,
@@ -342,8 +641,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         ModalModule,
                         CommonModule,
                         FormsModule,
+                        SelectModule,
+                        SpinnerModule,
                     ],
-                    exports: [DecisionComponent],
+                    exports: [DecisionComponent, DecisionModelerComponent],
                 }]
         }] });
 
@@ -367,5 +668,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { DecisionComponent, DecisionModule };
+export { DecisionComponent, DecisionModelerComponent, DecisionModule };
 //# sourceMappingURL=valtimo-decision.mjs.map