@valtimo/dashboard 10.6.0 → 10.7.0

package/fesm2015/valtimo-dashboard.mjs

@@ -1,23 +1,30 @@
 import * as i0 from '@angular/core';
-import { Component, ViewChild, NgModule } from '@angular/core';
+import { Component, ViewChild, InjectionToken, Injectable, Inject, ViewContainerRef, ViewChildren, Input, ViewEncapsulation, NgModule, Pipe, EventEmitter, ChangeDetectionStrategy, Output } from '@angular/core';
 import moment from 'moment';
-import { take } from 'rxjs/operators';
-import { BehaviorSubject } from 'rxjs';
-import * as i1 from '@angular/router';
-import { RouterModule } from '@angular/router';
-import * as i2 from '@valtimo/context';
-import * as i3 from '@valtimo/task';
+import { BehaviorSubject, filter, combineLatest, map, Subscription, tap, take as take$1, startWith } from 'rxjs';
+import { take, map as map$1 } from 'rxjs/operators';
+import * as i1 from '@valtimo/task';
 import { TaskModule } from '@valtimo/task';
-import * as i4 from '@ngx-translate/core';
-import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
-import * as i5 from '@angular/common';
+import * as i2 from '@angular/router';
+import { RouterModule } from '@angular/router';
+import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i6 from '@valtimo/components';
-import { WidgetModule, ListModule, BpmnJsDiagramModule, AlertModule, SpinnerModule } from '@valtimo/components';
+import * as i4 from '@valtimo/components';
+import { WidgetModule, ListModule, BpmnJsDiagramModule, AlertModule, SpinnerModule, CarbonMultiInputModule } from '@valtimo/components';
+import * as i1$1 from '@ngx-translate/core';
+import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
+import pack from 'bin-pack-with-constraints';
+import * as i1$2 from '@angular/common/http';
+import { HttpClient } from '@angular/common/http';
+import * as i2$1 from '@valtimo/config';
+import { ROLE_USER } from '@valtimo/config';
+import * as i4$1 from 'carbon-components-angular';
+import { TabsModule, ThemeModule, LoadingModule, InputModule, DropdownModule, CheckboxModule } from 'carbon-components-angular';
 import { TranslateHttpLoader } from '@ngx-translate/http-loader';
 import { AuthGuardService } from '@valtimo/security';
-import { ROLE_USER } from '@valtimo/config';
-import { HttpClient } from '@angular/common/http';
+import * as i1$3 from '@angular/forms';
+import { Validators, ReactiveFormsModule } from '@angular/forms';
+import * as i2$2 from '@valtimo/document';
 
 /*
  * Copyright 2015-2023 Ritense BV, the Netherlands.
@@ -37,12 +44,9 @@ import { HttpClient } from '@angular/common/http';
 moment.locale(localStorage.getItem('langKey') || '');
 moment.defaultFormat = 'DD MMM YYYY HH:mm';
 class DashboardComponent {
-    constructor(router, contextService, taskService, route, translate) {
-        this.router = router;
-        this.contextService = contextService;
+    constructor(taskService, route) {
         this.taskService = taskService;
         this.route = route;
-        this.translate = translate;
         this.openTaskFields = [
             {
                 key: 'created',
@@ -87,12 +91,12 @@ class DashboardComponent {
         });
     }
 }
-DashboardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DashboardComponent, deps: [{ token: i1.Router }, { token: i2.ContextService }, { token: i3.TaskService }, { token: i1.ActivatedRoute }, { token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-DashboardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DashboardComponent, selector: "valtimo-dashboard", viewQueries: [{ propertyName: "taskDetail", first: true, predicate: ["taskDetail"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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 container-fluid\" *ngIf=\"{loading: loading$ | async} as obs\">\n  <h4 class=\"title\">\n    {{ 'dashboard.openTasks.title' | translate }}\n    <sup *ngIf=\"obs.loading === false\" class=\"ml-1 badge badge-pill badge-primary\">{{\n      openTasks?.length\n    }}</sup>\n  </h4>\n  <ng-container *ngIf=\"obs.loading === false; else loading\">\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"openTasks\"\n        [fields]=\"openTaskFields\"\n        (rowClicked)=\"rowOpenTaskClick($event)\"\n      ></valtimo-list>\n    </valtimo-widget>\n  </ng-container>\n  <valtimo-task-detail-modal\n    #taskDetail\n    (formSubmit)=\"getOpenTasks()\"\n    (assignmentOfTaskChanged)=\"getOpenTasks()\"\n  ></valtimo-task-detail-modal>\n</div>\n\n<ng-template #loading>\n  <valtimo-spinner></valtimo-spinner>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { kind: "component", type: i6.ListComponent, selector: "valtimo-list", inputs: ["items", "fields", "pagination", "viewMode", "isSearchable", "header", "actions", "paginationIdentifier", "initialSortState", "lastColumnTemplate"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged"] }, { kind: "component", type: i3.TaskDetailModalComponent, selector: "valtimo-task-detail-modal", outputs: ["formSubmit", "assignmentOfTaskChanged"] }, { kind: "component", type: i6.SpinnerComponent, selector: "valtimo-spinner", inputs: ["useBootstrapSpinner", "name", "type", "size", "color", "bdColor", "fullScreen", "noMarginTop"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DashboardComponent, decorators: [{
+DashboardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardComponent, deps: [{ token: i1.TaskService }, { token: i2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
+DashboardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DashboardComponent, selector: "valtimo-dashboard", viewQueries: [{ propertyName: "taskDetail", first: true, predicate: ["taskDetail"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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 container-fluid\" *ngIf=\"{loading: loading$ | async} as obs\">\n  <h4 class=\"title\">\n    {{ 'dashboard.openTasks.title' | translate }}\n    <sup *ngIf=\"obs.loading === false\" class=\"ml-1 badge badge-pill badge-primary\">{{\n      openTasks?.length\n    }}</sup>\n  </h4>\n  <ng-container *ngIf=\"obs.loading === false; else loading\">\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"openTasks\"\n        [fields]=\"openTaskFields\"\n        (rowClicked)=\"rowOpenTaskClick($event)\"\n      ></valtimo-list>\n    </valtimo-widget>\n  </ng-container>\n  <valtimo-task-detail-modal\n    #taskDetail\n    (formSubmit)=\"getOpenTasks()\"\n    (assignmentOfTaskChanged)=\"getOpenTasks()\"\n  ></valtimo-task-detail-modal>\n</div>\n\n<ng-template #loading>\n  <valtimo-spinner></valtimo-spinner>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.WidgetComponent, selector: "valtimo-widget", inputs: ["type", "name", "icon", "contrast", "divider", "title", "subtitle", "collapseAble", "collapse", "additionalClasses"] }, { kind: "component", type: i4.ListComponent, selector: "valtimo-list", inputs: ["items", "fields", "pagination", "viewMode", "isSearchable", "header", "actions", "paginationIdentifier", "initialSortState", "lastColumnTemplate"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged"] }, { kind: "component", type: i1.TaskDetailModalComponent, selector: "valtimo-task-detail-modal", outputs: ["formSubmit", "assignmentOfTaskChanged"] }, { kind: "component", type: i4.SpinnerComponent, selector: "valtimo-spinner", inputs: ["useBootstrapSpinner", "name", "type", "size", "color", "bdColor", "fullScreen", "noMarginTop"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-dashboard', template: "<!--\n  ~ Copyright 2015-2023 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 container-fluid\" *ngIf=\"{loading: loading$ | async} as obs\">\n  <h4 class=\"title\">\n    {{ 'dashboard.openTasks.title' | translate }}\n    <sup *ngIf=\"obs.loading === false\" class=\"ml-1 badge badge-pill badge-primary\">{{\n      openTasks?.length\n    }}</sup>\n  </h4>\n  <ng-container *ngIf=\"obs.loading === false; else loading\">\n    <valtimo-widget>\n      <valtimo-list\n        [items]=\"openTasks\"\n        [fields]=\"openTaskFields\"\n        (rowClicked)=\"rowOpenTaskClick($event)\"\n      ></valtimo-list>\n    </valtimo-widget>\n  </ng-container>\n  <valtimo-task-detail-modal\n    #taskDetail\n    (formSubmit)=\"getOpenTasks()\"\n    (assignmentOfTaskChanged)=\"getOpenTasks()\"\n  ></valtimo-task-detail-modal>\n</div>\n\n<ng-template #loading>\n  <valtimo-spinner></valtimo-spinner>\n</ng-template>\n" }]
-        }], ctorParameters: function () { return [{ type: i1.Router }, { type: i2.ContextService }, { type: i3.TaskService }, { type: i1.ActivatedRoute }, { type: i4.TranslateService }]; }, propDecorators: { taskDetail: [{
+        }], ctorParameters: function () { return [{ type: i1.TaskService }, { type: i2.ActivatedRoute }]; }, propDecorators: { taskDetail: [{
                 type: ViewChild,
                 args: ['taskDetail']
             }] } });
@@ -112,27 +116,122 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-const routes = [
-    {
-        path: '',
-        component: DashboardComponent,
-        canActivate: [AuthGuardService],
-        data: { title: 'Dashboard', roles: [ROLE_USER] },
-    },
-];
-class DashboardRoutingModule {
+const DATA_FEATURES = {
+    NUMBER: 'number',
+    TOTAL: 'total',
+};
+
+/*
+ * Copyright 2015-2023 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 DISPLAY_TYPE_TOKEN = new InjectionToken('Supported display types');
+const DATA_SOURCE_TOKEN = new InjectionToken('Supported data sources');
+
+/*
+ * Copyright 2015-2023 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 WIDGET_1X_HEIGHT = 220;
+const WIDGET_1X_MIN_WIDTH = 275;
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 WidgetService {
+    constructor(supportedDisplayTypesFromToken, supportedDataSourcesFromToken) {
+        this.supportedDisplayTypesFromToken = supportedDisplayTypesFromToken;
+        this.supportedDataSourcesFromToken = supportedDataSourcesFromToken;
+        this._supportedDisplayTypes$ = new BehaviorSubject(null);
+        this._supportedDataSources$ = new BehaviorSubject(null);
+        this.setSupportedDisplayTypes(supportedDisplayTypesFromToken);
+        this.setSupportedDataSources(supportedDataSourcesFromToken);
+    }
+    get supportedDisplayTypes$() {
+        return this._supportedDisplayTypes$.pipe(filter(specifications => !!specifications));
+    }
+    get supportedDataSources$() {
+        return this._supportedDataSources$.pipe(filter(specifications => !!specifications));
+    }
+    get supportedDisplayTypes() {
+        return this._supportedDisplayTypes$.getValue() || [];
+    }
+    get supportedDataSources() {
+        return this._supportedDataSources$.getValue() || [];
+    }
+    setSupportedDisplayTypes(supportedDisplayTypes) {
+        this._supportedDisplayTypes$.next(supportedDisplayTypes.filter(displayType => !!displayType));
+    }
+    setSupportedDataSources(supportedDataSources) {
+        this._supportedDataSources$.next(supportedDataSources.filter(dataSource => !!dataSource));
+    }
 }
-DashboardRoutingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DashboardRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DashboardRoutingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: DashboardRoutingModule, imports: [CommonModule, i1.RouterModule], exports: [RouterModule] });
-DashboardRoutingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DashboardRoutingModule, imports: [CommonModule, RouterModule.forChild(routes), RouterModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DashboardRoutingModule, decorators: [{
-            type: NgModule,
+WidgetService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetService, deps: [{ token: DISPLAY_TYPE_TOKEN }, { token: DATA_SOURCE_TOKEN }], target: i0.ɵɵFactoryTarget.Injectable });
+WidgetService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetService, decorators: [{
+            type: Injectable,
             args: [{
-                    declarations: [],
-                    imports: [CommonModule, RouterModule.forChild(routes)],
-                    exports: [RouterModule],
+                    providedIn: 'root',
                 }]
-        }] });
+        }], ctorParameters: function () {
+        return [{ type: Array, decorators: [{
+                        type: Inject,
+                        args: [DISPLAY_TYPE_TOKEN]
+                    }] }, { type: Array, decorators: [{
+                        type: Inject,
+                        args: [DATA_SOURCE_TOKEN]
+                    }] }];
+    } });
 
 /*
  * Copyright 2015-2023 Ritense BV, the Netherlands.
@@ -149,59 +248,1917 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-// AoT requires an exported function for factories
-function HttpLoaderFactory(httpClient) {
-    return new TranslateHttpLoader(httpClient);
+class WidgetLayoutService {
+    constructor(widgetService) {
+        this.widgetService = widgetService;
+        this._widgetContainerWidth$ = new BehaviorSubject(null);
+        this._widgetConfigurations$ = new BehaviorSubject([]);
+        this._widgetPackResult$ = new BehaviorSubject(null);
+        this.openLayoutSubscription();
+    }
+    get widgetPackResult$() {
+        return this._widgetPackResult$.asObservable().pipe(filter(result => !!result));
+    }
+    get widgetContainerWidth$() {
+        return this._widgetContainerWidth$.asObservable().pipe(filter(width => !!width));
+    }
+    get widgetConfigurationBins$() {
+        return combineLatest([
+            this.widgetService.supportedDisplayTypes$,
+            this._widgetConfigurations$,
+        ]).pipe(map(([displayTypes, configurations]) => configurations.map(configuration => {
+            const specification = displayTypes.find(type => type.displayTypeKey === configuration.displayType);
+            return {
+                configurationKey: configuration.key,
+                width: specification.width,
+                height: specification.height,
+            };
+        })));
+    }
+    ngOnDestroy() {
+        var _a;
+        (_a = this._layoutSubscription) === null || _a === void 0 ? void 0 : _a.unsubscribe();
+    }
+    setWidgetContainerWidth(width) {
+        this._widgetContainerWidth$.next(width);
+    }
+    setWidgetConfigurations(configurations) {
+        this._widgetConfigurations$.next(configurations);
+    }
+    openLayoutSubscription() {
+        this._layoutSubscription = combineLatest([
+            this.widgetContainerWidth$,
+            this.widgetConfigurationBins$,
+        ]).subscribe(([widgetContainerWidth, configurationBins]) => {
+            const amountOfMinWidthColumns = this.getAmountOfMinWidthColumns(widgetContainerWidth);
+            const widget1xWidth = this.getWidget1xWidth(widgetContainerWidth, amountOfMinWidthColumns);
+            const binsToFit = configurationBins.map(configurationBin => (Object.assign(Object.assign({}, configurationBin), { width: configurationBin.width * widget1xWidth, height: configurationBin.height * WIDGET_1X_HEIGHT })));
+            const heightConstraint = this.getHeightConstraint(configurationBins, amountOfMinWidthColumns);
+            const resultWithoutHeightConstraint = this.getPackResult(binsToFit, widgetContainerWidth);
+            const resultWithHeightConstraint = this.getPackResult(binsToFit, widgetContainerWidth, heightConstraint);
+            const resultWithHeightConstraintExceedsBoundary = this.checkIfPackResultExceedsBoundary(resultWithHeightConstraint, widgetContainerWidth);
+            const resultToUse = resultWithHeightConstraintExceedsBoundary
+                ? resultWithoutHeightConstraint
+                : resultWithHeightConstraint;
+            const resultWithMaxWidth = this.getResultWithMaxWidth(resultToUse, widgetContainerWidth);
+            this._widgetPackResult$.next(resultWithMaxWidth);
+        });
+    }
+    getPackResult(binsToFit, maxWidth, maxHeight) {
+        return pack(binsToFit, Object.assign({ maxWidth }, (maxHeight && { maxHeight })));
+    }
+    checkIfPackResultExceedsBoundary(result, maxWidth) {
+        return !!result.items.find(item => item.width + item.x > maxWidth);
+    }
+    getAmountOfMinWidthColumns(containerWidth) {
+        return Math.floor(containerWidth / WIDGET_1X_MIN_WIDTH);
+    }
+    getWidget1xWidth(containerWidth, amountOfMinWidthColumns) {
+        const widget1xWidth = Math.floor(containerWidth / (amountOfMinWidthColumns || 1));
+        return widget1xWidth;
+    }
+    getResultWithMaxWidth(result, containerWidth) {
+        return Object.assign(Object.assign({}, result), { items: result.items.map(item => (Object.assign(Object.assign({}, item), { width: item.width > containerWidth ? containerWidth : item.width }))) });
+    }
+    getHeightConstraint(binsToFit, amountOfMinWidthColumns) {
+        const amountOfSpacesNeeded = binsToFit.reduce((acc, curr) => acc + curr.height * curr.width, 0);
+        const minAmountOfRowsNeeded = Math.ceil(amountOfSpacesNeeded / amountOfMinWidthColumns);
+        const tallestWidgetHeightSpace = binsToFit.reduce((acc, curr) => (curr.height > acc ? curr.height : acc), 0);
+        const amountOfRowsNeeded = minAmountOfRowsNeeded < tallestWidgetHeightSpace
+            ? tallestWidgetHeightSpace
+            : minAmountOfRowsNeeded;
+        return amountOfRowsNeeded * WIDGET_1X_HEIGHT;
+    }
 }
-class DashboardModule {
+WidgetLayoutService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetLayoutService, deps: [{ token: WidgetService }], target: i0.ɵɵFactoryTarget.Injectable });
+WidgetLayoutService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetLayoutService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetLayoutService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: WidgetService }]; } });
+
+/*
+ * Copyright 2015-2023 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 DashboardService {
+    constructor(http, configService) {
+        this.http = http;
+        this.configService = configService;
+        this._endpointUri = this.configService.config.valtimoApi.endpointUri;
+    }
+    getDashboards() {
+        return this.http.get(`${this._endpointUri}v1/dashboard`);
+    }
 }
-DashboardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DashboardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DashboardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: DashboardModule, declarations: [DashboardComponent], imports: [CommonModule,
-        DashboardRoutingModule,
-        WidgetModule,
-        ListModule,
-        BpmnJsDiagramModule, i4.TranslateModule, AlertModule,
-        TaskModule,
-        SpinnerModule], exports: [DashboardComponent] });
-DashboardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DashboardModule, imports: [CommonModule,
-        DashboardRoutingModule,
-        WidgetModule,
-        ListModule,
-        BpmnJsDiagramModule,
-        TranslateModule.forRoot({
-            loader: {
-                provide: TranslateLoader,
-                useFactory: HttpLoaderFactory,
-                deps: [HttpClient],
-            },
-        }),
-        AlertModule,
-        TaskModule,
-        SpinnerModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DashboardModule, decorators: [{
-            type: NgModule,
+DashboardService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardService, deps: [{ token: i1$2.HttpClient }, { token: i2$1.ConfigService }], target: i0.ɵɵFactoryTarget.Injectable });
+DashboardService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardService, decorators: [{
+            type: Injectable,
             args: [{
-                    declarations: [DashboardComponent],
-                    imports: [
-                        CommonModule,
-                        DashboardRoutingModule,
-                        WidgetModule,
-                        ListModule,
-                        BpmnJsDiagramModule,
-                        TranslateModule.forRoot({
-                            loader: {
-                                provide: TranslateLoader,
-                                useFactory: HttpLoaderFactory,
-                                deps: [HttpClient],
-                            },
-                        }),
-                        AlertModule,
-                        TaskModule,
-                        SpinnerModule,
-                    ],
-                    exports: [DashboardComponent],
+                    providedIn: 'root',
                 }]
-        }] });
+        }], ctorParameters: function () { return [{ type: i1$2.HttpClient }, { type: i2$1.ConfigService }]; } });
+
+/*
+ * Copyright 2015-2023 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 WidgetTranslationService {
+    constructor(translateService, widgetService) {
+        this.translateService = translateService;
+        this.widgetService = widgetService;
+    }
+    translate(translateKey, key) {
+        return combineLatest([
+            this.widgetService.supportedDisplayTypes$,
+            this.widgetService.supportedDataSources$,
+            this.translateService.stream('key'),
+        ]).pipe(map$1(([supportedDisplayTypes, supportedDataSources]) => this.getTranslation(supportedDisplayTypes, supportedDataSources, key, translateKey)));
+    }
+    instant(translateKey, displayTypeKey) {
+        return this.getTranslation(this.widgetService.supportedDisplayTypes, this.widgetService.supportedDataSources, displayTypeKey, translateKey);
+    }
+    getTranslation(supportedDisplayTypes, supportedDataSources, key, translateKey) {
+        const currentLang = this.translateService.currentLang;
+        const displayTypeSpecification = supportedDisplayTypes.find(displayType => displayType.displayTypeKey === key);
+        const dataSourceSpecification = supportedDataSources.find(datasource => datasource.dataSourceKey === key);
+        let translation = '';
+        if (displayTypeSpecification &&
+            displayTypeSpecification.translations.hasOwnProperty(currentLang)) {
+            translation = displayTypeSpecification.translations[currentLang][translateKey];
+        }
+        else if (dataSourceSpecification &&
+            dataSourceSpecification.translations.hasOwnProperty(currentLang)) {
+            translation = dataSourceSpecification.translations[currentLang][translateKey];
+        }
+        return translation || `${key}.${translateKey}`;
+    }
+}
+WidgetTranslationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslationService, deps: [{ token: i1$1.TranslateService }, { token: WidgetService }], target: i0.ɵɵFactoryTarget.Injectable });
+WidgetTranslationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslationService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslationService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.TranslateService }, { type: WidgetService }]; } });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 WidgetDashboardContentComponent {
+    constructor(layoutService, widgetService, renderer) {
+        this.layoutService = layoutService;
+        this.widgetService = widgetService;
+        this.renderer = renderer;
+        this.isLoading$ = new BehaviorSubject(true);
+        this._widgetData$ = new BehaviorSubject([]);
+        this.widgetConfigurations$ = new BehaviorSubject(null);
+        this._subscriptions = new Subscription();
+    }
+    set widgetData(value) {
+        this.isLoading$.next(value.loading);
+        this._widgetData$.next(value.data);
+    }
+    set dashboard(value) {
+        this.setWidgetConfigurations(value);
+    }
+    ngAfterViewInit() {
+        this._observer = new ResizeObserver(event => {
+            this.observerMutation(event);
+        });
+        this._observer.observe(this._widgetContainerRef.nativeElement);
+        this.openPackResultSubscription();
+        this.renderWidgets();
+    }
+    ngOnDestroy() {
+        var _a, _b;
+        (_a = this._observer) === null || _a === void 0 ? void 0 : _a.disconnect();
+        (_b = this._subscriptions) === null || _b === void 0 ? void 0 : _b.unsubscribe();
+    }
+    setWidgetConfigurations(dashboard) {
+        this.widgetService.supportedDisplayTypes$.pipe(take(1)).subscribe(supportedDisplayTypes => {
+            var _a;
+            const supportedWidgetConfigurations = ((_a = dashboard.widgets) === null || _a === void 0 ? void 0 : _a.filter(widgetConfiguration => supportedDisplayTypes.find(type => type.displayTypeKey === widgetConfiguration.displayType))) || [];
+            this.layoutService.setWidgetConfigurations(supportedWidgetConfigurations);
+            this.widgetConfigurations$.next(supportedWidgetConfigurations);
+        });
+    }
+    observerMutation(event) {
+        var _a, _b;
+        const widgetContainerWidth = (_b = (_a = event[0]) === null || _a === void 0 ? void 0 : _a.borderBoxSize[0]) === null || _b === void 0 ? void 0 : _b.inlineSize;
+        if (typeof widgetContainerWidth === 'number' && widgetContainerWidth !== 0) {
+            this.layoutService.setWidgetContainerWidth(widgetContainerWidth);
+        }
+    }
+    openPackResultSubscription() {
+        this._subscriptions.add(this.layoutService.widgetPackResult$.subscribe(packResult => {
+            this.renderer.setStyle(this._widgetContainerRef.nativeElement, 'height', `${packResult.height}px`);
+            this._widgetConfigurationRefs.toArray().forEach(widgetConfigurationRef => {
+                const nativeElement = widgetConfigurationRef.nativeElement;
+                const configPackResult = packResult.items.find(result => result.item.configurationKey === nativeElement.id);
+                this.renderer.setStyle(nativeElement, 'height', `${configPackResult === null || configPackResult === void 0 ? void 0 : configPackResult.height}px`);
+                this.renderer.setStyle(nativeElement, 'width', `${configPackResult === null || configPackResult === void 0 ? void 0 : configPackResult.width}px`);
+                this.renderer.setStyle(nativeElement, 'left', `${configPackResult === null || configPackResult === void 0 ? void 0 : configPackResult.x}px`);
+                this.renderer.setStyle(nativeElement, 'top', `${configPackResult === null || configPackResult === void 0 ? void 0 : configPackResult.y}px`);
+            });
+        }));
+    }
+    renderWidgets() {
+        this._subscriptions.add(combineLatest([
+            this.widgetConfigurations$,
+            this.widgetService.supportedDisplayTypes$,
+            this._widgetData$,
+        ]).subscribe(([configurations, displayTypes, data]) => {
+            configurations === null || configurations === void 0 ? void 0 : configurations.forEach((configuration, index) => {
+                var _a;
+                const displayType = displayTypes.find(type => type.displayTypeKey === configuration.displayType);
+                const vcRef = this._widgetConfigurationContentVcRefs.toArray()[index];
+                if (displayType && data) {
+                    vcRef.clear();
+                    const componentInstance = vcRef.createComponent(displayType.displayComponent);
+                    componentInstance.setInput('displayTypeKey', configuration.displayType);
+                    componentInstance.setInput('displayTypeProperties', Object.assign({}, configuration.displayTypeProperties));
+                    componentInstance.setInput('data', (_a = data.find(dataItem => dataItem.key === configuration.key)) === null || _a === void 0 ? void 0 : _a.data);
+                }
+            });
+        }));
+    }
+}
+WidgetDashboardContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetDashboardContentComponent, deps: [{ token: WidgetLayoutService }, { token: WidgetService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+WidgetDashboardContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: WidgetDashboardContentComponent, selector: "valtimo-widget-dashboard-content", inputs: { widgetData: "widgetData", dashboard: "dashboard" }, providers: [WidgetLayoutService], viewQueries: [{ propertyName: "_widgetContainerRef", first: true, predicate: ["widgetContainer"], descendants: true }, { propertyName: "_widgetConfigurationRefs", predicate: ["widgetConfiguration"], descendants: true }, { propertyName: "_widgetConfigurationContentVcRefs", predicate: ["widgetConfigurationContent"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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 #widgetContainer [class.loading]=\"isLoading$ | async\" class=\"widget-container\">\n  <ng-container *ngIf=\"widgetConfigurations$ | async as widgetConfigurations\">\n    <ng-container *ngFor=\"let config of widgetConfigurations\">\n      <div #widgetConfiguration [id]=\"config.key\" class=\"widget-configuration\">\n        <div class=\"widget-configuration-content\">\n          <ng-container #widgetConfigurationContent></ng-container>\n        </div>\n      </div>\n    </ng-container>\n\n    <div *ngIf=\"widgetConfigurations.length === 0\" class=\"no-widgets-message\">\n      {{ 'dashboard.noWidgets' | translate }}\n    </div>\n  </ng-container>\n</div>\n\n<cds-loading *ngIf=\"isLoading$ | async\" class=\"widget-loader\"></cds-loading>\n", styles: ["/*!\n * Copyright 2015-2023 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 */.widget-container{margin-top:16px;width:calc(100% + 16px);margin-left:-8px;position:relative}.widget-configuration{position:absolute;display:flex;justify-content:center;align-items:center}.widget-configuration-content{width:calc(100% - 16px);height:calc(100% - 16px);background-color:#fff}.no-widgets-message{padding-top:16px;display:flex;justify-content:center;width:100%}.widget-loader{display:flex;justify-content:center;padding-top:32px}.loading{display:none}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$1.Loading, selector: "cds-loading, ibm-loading", inputs: ["title", "isActive", "size", "overlay"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetDashboardContentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'valtimo-widget-dashboard-content', providers: [WidgetLayoutService], template: "<!--\n  ~ Copyright 2015-2023 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 #widgetContainer [class.loading]=\"isLoading$ | async\" class=\"widget-container\">\n  <ng-container *ngIf=\"widgetConfigurations$ | async as widgetConfigurations\">\n    <ng-container *ngFor=\"let config of widgetConfigurations\">\n      <div #widgetConfiguration [id]=\"config.key\" class=\"widget-configuration\">\n        <div class=\"widget-configuration-content\">\n          <ng-container #widgetConfigurationContent></ng-container>\n        </div>\n      </div>\n    </ng-container>\n\n    <div *ngIf=\"widgetConfigurations.length === 0\" class=\"no-widgets-message\">\n      {{ 'dashboard.noWidgets' | translate }}\n    </div>\n  </ng-container>\n</div>\n\n<cds-loading *ngIf=\"isLoading$ | async\" class=\"widget-loader\"></cds-loading>\n", styles: ["/*!\n * Copyright 2015-2023 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 */.widget-container{margin-top:16px;width:calc(100% + 16px);margin-left:-8px;position:relative}.widget-configuration{position:absolute;display:flex;justify-content:center;align-items:center}.widget-configuration-content{width:calc(100% - 16px);height:calc(100% - 16px);background-color:#fff}.no-widgets-message{padding-top:16px;display:flex;justify-content:center;width:100%}.widget-loader{display:flex;justify-content:center;padding-top:32px}.loading{display:none}\n"] }]
+        }], ctorParameters: function () { return [{ type: WidgetLayoutService }, { type: WidgetService }, { type: i0.Renderer2 }]; }, propDecorators: { _widgetConfigurationRefs: [{
+                type: ViewChildren,
+                args: ['widgetConfiguration']
+            }], _widgetConfigurationContentVcRefs: [{
+                type: ViewChildren,
+                args: ['widgetConfigurationContent', { read: ViewContainerRef }]
+            }], _widgetContainerRef: [{
+                type: ViewChild,
+                args: ['widgetContainer']
+            }], widgetData: [{
+                type: Input
+            }], dashboard: [{
+                type: Input
+            }] } });
+
+/*
+ * Copyright 2015-2023 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 WidgetApiService {
+    constructor(configService, http) {
+        this.configService = configService;
+        this.http = http;
+        this._endpointUri = `${this.configService.config.valtimoApi.endpointUri}v1/dashboard`;
+    }
+    getWidgetData(dashboardKey) {
+        return this.http.get(`${this._endpointUri}/${dashboardKey}/data`);
+    }
+}
+WidgetApiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetApiService, deps: [{ token: i2$1.ConfigService }, { token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+WidgetApiService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetApiService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetApiService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: i2$1.ConfigService }, { type: i1$2.HttpClient }]; } });
+
+/*
+ * Copyright 2015-2023 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 WidgetDashboardComponent {
+    constructor(dashboardService, widgetApiService) {
+        this.dashboardService = dashboardService;
+        this.widgetApiService = widgetApiService;
+        this.dashboards$ = this.dashboardService.getDashboards().pipe(tap(dashboards => {
+            if (dashboards.length === 1) {
+                this.onTabSelected(dashboards[0].key);
+            }
+        }));
+        this.activeWidgetData$ = new BehaviorSubject({
+            data: [],
+            loading: true,
+        });
+    }
+    onTabSelected(dashboardKey) {
+        this.widgetApiService
+            .getWidgetData(dashboardKey)
+            .pipe(tap(() => {
+            this.activeWidgetData$.next({ data: [], loading: true });
+        }), take$1(1))
+            .subscribe((data) => this.activeWidgetData$.next({ data, loading: false }));
+    }
+    trackByIndex(index) {
+        return index;
+    }
+}
+WidgetDashboardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetDashboardComponent, deps: [{ token: DashboardService }, { token: WidgetApiService }], target: i0.ɵɵFactoryTarget.Component });
+WidgetDashboardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: WidgetDashboardComponent, selector: "valtimo-widget-dashboard", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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 *ngIf=\"dashboards$ | async as dashboards\" class=\"dashboards-container\">\n  <div *ngIf=\"dashboards.length === 1\">\n    <h4>{{ dashboards[0].title }}</h4>\n\n    <valtimo-widget-dashboard-content\n      [dashboard]=\"dashboards[0]\"\n      [widgetData]=\"activeWidgetData$ | async\"\n    ></valtimo-widget-dashboard-content>\n  </div>\n\n  <div *ngIf=\"dashboards.length > 1\">\n    <cds-tabs>\n      <cds-tab\n        *ngFor=\"let dashboard of dashboards; trackBy: trackByIndex\"\n        [heading]=\"dashboard.title\"\n        (selected)=\"onTabSelected(dashboard.key)\"\n      >\n        <valtimo-widget-dashboard-content\n          [dashboard]=\"dashboard\"\n          [widgetData]=\"activeWidgetData$ | async\"\n        ></valtimo-widget-dashboard-content>\n      </cds-tab>\n    </cds-tabs>\n  </div>\n</div>\n", styles: ["/*!\n * Copyright 2015-2023 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 */.dashboards-container .cds--tab-content{outline:0;padding:0}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$1.Tabs, selector: "cds-tabs, ibm-tabs", inputs: ["position", "cacheActive", "followFocus", "isNavigation", "ariaLabel", "ariaLabelledby", "type", "theme", "skeleton"] }, { kind: "component", type: i4$1.Tab, selector: "cds-tab, ibm-tab", inputs: ["heading", "title", "context", "active", "disabled", "tabIndex", "id", "cacheActive"], outputs: ["selected"] }, { kind: "component", type: WidgetDashboardContentComponent, selector: "valtimo-widget-dashboard-content", inputs: ["widgetData", "dashboard"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetDashboardComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'valtimo-widget-dashboard', encapsulation: ViewEncapsulation.None, template: "<!--\n  ~ Copyright 2015-2023 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 *ngIf=\"dashboards$ | async as dashboards\" class=\"dashboards-container\">\n  <div *ngIf=\"dashboards.length === 1\">\n    <h4>{{ dashboards[0].title }}</h4>\n\n    <valtimo-widget-dashboard-content\n      [dashboard]=\"dashboards[0]\"\n      [widgetData]=\"activeWidgetData$ | async\"\n    ></valtimo-widget-dashboard-content>\n  </div>\n\n  <div *ngIf=\"dashboards.length > 1\">\n    <cds-tabs>\n      <cds-tab\n        *ngFor=\"let dashboard of dashboards; trackBy: trackByIndex\"\n        [heading]=\"dashboard.title\"\n        (selected)=\"onTabSelected(dashboard.key)\"\n      >\n        <valtimo-widget-dashboard-content\n          [dashboard]=\"dashboard\"\n          [widgetData]=\"activeWidgetData$ | async\"\n        ></valtimo-widget-dashboard-content>\n      </cds-tab>\n    </cds-tabs>\n  </div>\n</div>\n", styles: ["/*!\n * Copyright 2015-2023 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 */.dashboards-container .cds--tab-content{outline:0;padding:0}\n"] }]
+        }], ctorParameters: function () { return [{ type: DashboardService }, { type: WidgetApiService }]; } });
+
+/*
+ * Copyright 2015-2023 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 routes = [
+    {
+        path: '',
+        component: WidgetDashboardComponent,
+        canActivate: [AuthGuardService],
+        data: { title: 'Dashboard', roles: [ROLE_USER], hidePageTitle: true },
+    },
+];
+class DashboardRoutingModule {
+}
+DashboardRoutingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+DashboardRoutingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: DashboardRoutingModule, imports: [CommonModule, i2.RouterModule], exports: [RouterModule] });
+DashboardRoutingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardRoutingModule, imports: [CommonModule, RouterModule.forChild(routes), RouterModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardRoutingModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [],
+                    imports: [CommonModule, RouterModule.forChild(routes)],
+                    exports: [RouterModule],
+                }]
+        }] });
+
+/*
+ * Copyright 2015-2023 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 WidgetTranslatePipe {
+    constructor(widgetTranslationService) {
+        this.widgetTranslationService = widgetTranslationService;
+    }
+    transform(translateKey, key) {
+        return this.widgetTranslationService.translate(translateKey, key);
+    }
+}
+WidgetTranslatePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslatePipe, deps: [{ token: WidgetTranslationService }], target: i0.ɵɵFactoryTarget.Pipe });
+WidgetTranslatePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslatePipe, name: "widgetTranslate" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslatePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'widgetTranslate',
+                }]
+        }], ctorParameters: function () { return [{ type: WidgetTranslationService }]; } });
+
+/*
+ * Copyright 2015-2023 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 WidgetTranslatePipeModule {
+}
+WidgetTranslatePipeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslatePipeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+WidgetTranslatePipeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslatePipeModule, declarations: [WidgetTranslatePipe], imports: [TranslateModule], exports: [WidgetTranslatePipe] });
+WidgetTranslatePipeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslatePipeModule, imports: [TranslateModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WidgetTranslatePipeModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [TranslateModule],
+                    declarations: [WidgetTranslatePipe],
+                    exports: [WidgetTranslatePipe],
+                }]
+        }] });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+// AoT requires an exported function for factories
+function HttpLoaderFactory(httpClient) {
+    return new TranslateHttpLoader(httpClient);
+}
+class DashboardModule {
+}
+DashboardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+DashboardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: DashboardModule, declarations: [DashboardComponent, WidgetDashboardComponent, WidgetDashboardContentComponent], imports: [CommonModule,
+        DashboardRoutingModule,
+        WidgetModule,
+        ListModule,
+        BpmnJsDiagramModule, i1$1.TranslateModule, AlertModule,
+        TaskModule,
+        SpinnerModule,
+        TabsModule,
+        ThemeModule,
+        WidgetTranslatePipeModule,
+        LoadingModule], exports: [DashboardComponent, WidgetDashboardComponent] });
+DashboardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardModule, providers: [
+        { provide: DISPLAY_TYPE_TOKEN, useValue: null, multi: true },
+        { provide: DATA_SOURCE_TOKEN, useValue: null, multi: true },
+    ], imports: [CommonModule,
+        DashboardRoutingModule,
+        WidgetModule,
+        ListModule,
+        BpmnJsDiagramModule,
+        TranslateModule.forRoot({
+            loader: {
+                provide: TranslateLoader,
+                useFactory: HttpLoaderFactory,
+                deps: [HttpClient],
+            },
+        }),
+        AlertModule,
+        TaskModule,
+        SpinnerModule,
+        TabsModule,
+        ThemeModule,
+        WidgetTranslatePipeModule,
+        LoadingModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DashboardModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [DashboardComponent, WidgetDashboardComponent, WidgetDashboardContentComponent],
+                    imports: [
+                        CommonModule,
+                        DashboardRoutingModule,
+                        WidgetModule,
+                        ListModule,
+                        BpmnJsDiagramModule,
+                        TranslateModule.forRoot({
+                            loader: {
+                                provide: TranslateLoader,
+                                useFactory: HttpLoaderFactory,
+                                deps: [HttpClient],
+                            },
+                        }),
+                        AlertModule,
+                        TaskModule,
+                        SpinnerModule,
+                        TabsModule,
+                        ThemeModule,
+                        WidgetTranslatePipeModule,
+                        LoadingModule,
+                    ],
+                    exports: [DashboardComponent, WidgetDashboardComponent],
+                    providers: [
+                        { provide: DISPLAY_TYPE_TOKEN, useValue: null, multi: true },
+                        { provide: DATA_SOURCE_TOKEN, useValue: null, multi: true },
+                    ],
+                }]
+        }] });
+
+/*
+ * Copyright 2015-2023 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 TestConfigurationComponent {
+    constructor(fb) {
+        this.fb = fb;
+        this.form = this.fb.group({
+            value: this.fb.control(null, [Validators.required]),
+            total: this.fb.control(null, [Validators.required]),
+        });
+        this.configurationEvent = new EventEmitter();
+        this._subscriptions = new Subscription();
+    }
+    set disabled(disabledValue) {
+        if (disabledValue) {
+            this.form.disable();
+        }
+        else {
+            this.form.enable();
+        }
+    }
+    get value() {
+        return this.form.get('value');
+    }
+    get total() {
+        return this.form.get('total');
+    }
+    set prefillConfiguration(configurationValue) {
+        if (configurationValue) {
+            this.value.setValue(configurationValue.value);
+            this.total.setValue(configurationValue.total);
+        }
+    }
+    ngOnInit() {
+        this.openFormSubscription();
+    }
+    ngOnDestroy() {
+        this._subscriptions.unsubscribe();
+    }
+    openFormSubscription() {
+        this._subscriptions.add(this.form.valueChanges.pipe(startWith(this.form.value)).subscribe(formValue => {
+            this.configurationEvent.emit({ valid: this.form.valid, data: formValue });
+        }));
+    }
+}
+TestConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TestConfigurationComponent, deps: [{ token: i1$3.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+TestConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TestConfigurationComponent, selector: "ng-component", inputs: { dataSourceKey: "dataSourceKey", disabled: "disabled", prefillConfiguration: "prefillConfiguration" }, outputs: { configurationEvent: "configurationEvent" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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<form [formGroup]=\"form\">\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'valueHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalidText]=\"'valueHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalid]=\"value.dirty && value.invalid\"\n    >\n      {{ 'value' | widgetTranslate : dataSourceKey | async }}\n\n      <input\n        cdsText\n        formControlName=\"value\"\n        [invalid]=\"value.dirty && value.invalid\"\n        type=\"number\"\n      />\n    </cds-label>\n  </div>\n\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'totalHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalidText]=\"'totalHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalid]=\"total.dirty && total.invalid\"\n    >\n      {{ 'total' | widgetTranslate : dataSourceKey | async }}\n\n      <input\n        cdsText\n        formControlName=\"total\"\n        [invalid]=\"total.dirty && total.invalid\"\n        type=\"number\"\n      />\n    </cds-label>\n  </div>\n</form>\n", styles: ["/*!\n * Copyright 2015-2023 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"], dependencies: [{ kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4$1.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i4$1.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: WidgetTranslatePipe, name: "widgetTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TestConfigurationComponent, decorators: [{
+            type: Component,
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2023 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<form [formGroup]=\"form\">\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'valueHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalidText]=\"'valueHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalid]=\"value.dirty && value.invalid\"\n    >\n      {{ 'value' | widgetTranslate : dataSourceKey | async }}\n\n      <input\n        cdsText\n        formControlName=\"value\"\n        [invalid]=\"value.dirty && value.invalid\"\n        type=\"number\"\n      />\n    </cds-label>\n  </div>\n\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'totalHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalidText]=\"'totalHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalid]=\"total.dirty && total.invalid\"\n    >\n      {{ 'total' | widgetTranslate : dataSourceKey | async }}\n\n      <input\n        cdsText\n        formControlName=\"total\"\n        [invalid]=\"total.dirty && total.invalid\"\n        type=\"number\"\n      />\n    </cds-label>\n  </div>\n</form>\n", styles: ["/*!\n * Copyright 2015-2023 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$3.FormBuilder }]; }, propDecorators: { dataSourceKey: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], prefillConfiguration: [{
+                type: Input
+            }], configurationEvent: [{
+                type: Output
+            }] } });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 testDataSourceSpecification = {
+    dataSourceKey: 'test',
+    configurationComponent: TestConfigurationComponent,
+    translations: {
+        de: {
+            title: 'Test-Datenquelle',
+            value: 'Wert (erforderlich)',
+            valueHelperText: 'Der im Widget angezeigte Wert',
+            total: 'Gesamtwert (erforderlich)',
+            totalHelperText: 'Der im Widget angezeigte Gesamtwert',
+        },
+        en: {
+            title: 'Test data source',
+            value: 'Value (required)',
+            valueHelperText: 'The value displayed in the widget',
+            total: 'Total value (required)',
+            totalHelperText: 'The total value displayed in the widget',
+        },
+        nl: {
+            title: 'Testdatabron',
+            value: 'Waarde (vereist)',
+            valueHelperText: 'De waarde die wordt weergegeven in de widget',
+            total: 'Totaalwaarde (vereist)',
+            totalHelperText: 'De totaalwaarde die wordt weergegeven in de widget',
+        },
+    },
+};
+
+/*
+ * Copyright 2015-2023 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 TestDataSourceModule {
+}
+TestDataSourceModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TestDataSourceModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+TestDataSourceModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: TestDataSourceModule, declarations: [TestConfigurationComponent], imports: [CommonModule, ReactiveFormsModule, WidgetTranslatePipeModule, InputModule], exports: [TestConfigurationComponent] });
+TestDataSourceModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TestDataSourceModule, providers: [{ provide: DATA_SOURCE_TOKEN, useValue: testDataSourceSpecification, multi: true }], imports: [CommonModule, ReactiveFormsModule, WidgetTranslatePipeModule, InputModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TestDataSourceModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [TestConfigurationComponent],
+                    imports: [CommonModule, ReactiveFormsModule, WidgetTranslatePipeModule, InputModule],
+                    exports: [TestConfigurationComponent],
+                    providers: [{ provide: DATA_SOURCE_TOKEN, useValue: testDataSourceSpecification, multi: true }],
+                }]
+        }] });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+var Operator;
+(function (Operator) {
+    Operator["NOT_EQUAL_TO"] = "!=";
+    Operator["EQUAL_TO"] = "==";
+    Operator["GREATER_THAN"] = ">";
+    Operator["GREATER_THAN_OR_EQUAL_TO"] = ">=";
+    Operator["LESS_THAN"] = "<";
+    Operator["LESS_THAN_OR_EQUAL_TO"] = "<=";
+})(Operator || (Operator = {}));
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 CaseCountConfigurationComponent {
+    constructor(fb, documentService, translateService, widgetTranslationService) {
+        this.fb = fb;
+        this.documentService = documentService;
+        this.translateService = translateService;
+        this.widgetTranslationService = widgetTranslationService;
+        this.form = this.fb.group({
+            documentDefinition: this.fb.control(null, [Validators.required]),
+            queryConditions: this.fb.control(null),
+        });
+        this._selectedDocumentDefinition$ = new BehaviorSubject('');
+        this.documentItems$ = combineLatest([
+            this.documentService.getAllDefinitions(),
+            this._selectedDocumentDefinition$,
+        ]).pipe(map(([documentDefinitions, selectedDocumentDefintion]) => documentDefinitions.content.map(definition => ({
+            content: definition.id.name,
+            selected: definition.id.name === selectedDocumentDefintion,
+        }))));
+        this._OPERATORS = [
+            Operator.NOT_EQUAL_TO,
+            Operator.EQUAL_TO,
+            Operator.GREATER_THAN,
+            Operator.GREATER_THAN_OR_EQUAL_TO,
+            Operator.LESS_THAN,
+            Operator.LESS_THAN_OR_EQUAL_TO,
+        ];
+        this.operatorItems$ = this.translateService
+            .stream('key')
+            .pipe(map(() => this._OPERATORS.map(operator => ({
+            id: operator,
+            content: this.widgetTranslationService.instant(operator, this.dataSourceKey),
+            selected: false,
+        }))));
+        this.defaultConditionValues$ = new BehaviorSubject(null);
+        this.allConditionsValid$ = new BehaviorSubject(true);
+        this.configurationEvent = new EventEmitter();
+        this._subscriptions = new Subscription();
+    }
+    set disabled(disabledValue) {
+        if (disabledValue) {
+            this.form.disable();
+        }
+        else {
+            this.form.enable();
+        }
+    }
+    get documentDefinition() {
+        return this.form.get('documentDefinition');
+    }
+    get queryConditions() {
+        return this.form.get('queryConditions');
+    }
+    set prefillConfiguration(configurationValue) {
+        if (configurationValue) {
+            this.documentDefinitionSelected({
+                item: {
+                    content: configurationValue.documentDefinition,
+                },
+            });
+            this.defaultConditionValues$.next(configurationValue.queryConditions.map(condition => ({
+                key: condition.queryPath,
+                dropdown: condition.queryOperator,
+                value: condition.queryValue,
+            })));
+        }
+    }
+    ngOnInit() {
+        this.openFormSubscription();
+    }
+    ngOnDestroy() {
+        this._subscriptions.unsubscribe();
+    }
+    documentDefinitionSelected(documentDefinitionItem) {
+        var _a, _b;
+        if (!documentDefinitionItem) {
+            return;
+        }
+        this._selectedDocumentDefinition$.next((_a = documentDefinitionItem === null || documentDefinitionItem === void 0 ? void 0 : documentDefinitionItem.item) === null || _a === void 0 ? void 0 : _a.content);
+        this.documentDefinition.setValue((_b = documentDefinitionItem === null || documentDefinitionItem === void 0 ? void 0 : documentDefinitionItem.item) === null || _b === void 0 ? void 0 : _b.content);
+    }
+    conditionsValueChange(values) {
+        if (values.length === 0) {
+            this.queryConditions.setValue(null);
+        }
+        else {
+            this.queryConditions.setValue(values.map(value => ({
+                queryPath: value.key,
+                queryOperator: value.dropdown,
+                queryValue: value.value,
+            })));
+        }
+    }
+    onAllConditionsValid(allConditionsValid) {
+        this.allConditionsValid$.next(allConditionsValid);
+    }
+    openFormSubscription() {
+        this._subscriptions.add(combineLatest([
+            this.form.valueChanges.pipe(startWith(this.form.value)),
+            this.allConditionsValid$,
+        ]).subscribe(([formValue, allConditionsValid]) => {
+            this.configurationEvent.emit({
+                valid: this.form.valid && allConditionsValid,
+                data: formValue,
+            });
+        }));
+    }
+}
+CaseCountConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CaseCountConfigurationComponent, deps: [{ token: i1$3.FormBuilder }, { token: i2$2.DocumentService }, { token: i1$1.TranslateService }, { token: WidgetTranslationService }], target: i0.ɵɵFactoryTarget.Component });
+CaseCountConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CaseCountConfigurationComponent, selector: "ng-component", inputs: { dataSourceKey: "dataSourceKey", disabled: "disabled", prefillConfiguration: "prefillConfiguration" }, outputs: { configurationEvent: "configurationEvent" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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<form\n  class=\"case-count-configuration-form\"\n  *ngIf=\"{documentItems: documentItems$ | async, operatorItems: operatorItems$} as obs\"\n  [formGroup]=\"form\"\n>\n  <div class=\"form__element\">\n    <cds-dropdown\n      formControlName=\"documentDefinition\"\n      [helperText]=\"'documentDefinitionHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalidText]=\"'documentDefinitionHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalid]=\"documentDefinition.dirty && documentDefinition.invalid\"\n      [label]=\"'documentDefinition' | widgetTranslate : dataSourceKey | async\"\n      (selected)=\"documentDefinitionSelected($event)\"\n    >\n      <cds-dropdown-list [items]=\"obs?.documentItems || []\" type=\"multi\"></cds-dropdown-list>\n    </cds-dropdown>\n  </div>\n\n  <div class=\"form__element conditions-multi-input\">\n    <cds-label\n      [helperText]=\"'conditionsHelperText' | widgetTranslate : dataSourceKey | async\"\n      class=\"conditions-label\"\n      >{{ 'conditions' | widgetTranslate : dataSourceKey | async }}</cds-label\n    >\n    <valtimo-carbon-multi-input\n      [addRowText]=\"'addCondition' | widgetTranslate : dataSourceKey | async\"\n      [defaultValues]=\"defaultConditionValues$ | async\"\n      [dropdownColumnTitle]=\"'operator' | widgetTranslate : dataSourceKey | async\"\n      [dropdownItems]=\"operatorItems$ | async\"\n      [fullWidth]=\"true\"\n      [initialAmountOfRows]=\"0\"\n      [keyColumnTitle]=\"'path' | widgetTranslate : dataSourceKey | async\"\n      [minimumAmountOfRows]=\"0\"\n      [valueColumnTitle]=\"'value' | widgetTranslate : dataSourceKey | async\"\n      type=\"keyDropdownValue\"\n      (allValuesValidEvent)=\"onAllConditionsValid($event)\"\n      (valueChange)=\"conditionsValueChange($event)\"\n    ></valtimo-carbon-multi-input>\n  </div>\n</form>\n", styles: ["/*!\n * Copyright 2015-2023 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 */.case-count-configuration-form .conditions-label{margin-bottom:16px}.case-count-configuration-form .conditions-multi-input .cds--form__helper-text{font-style:italic}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4$1.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "component", type: i4$1.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i4$1.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "component", type: i4.CarbonMultiInputComponent, selector: "valtimo-carbon-multi-input", inputs: ["name", "title", "titleTranslationKey", "type", "initialAmountOfRows", "minimumAmountOfRows", "maxRows", "addRowText", "addRowTranslationKey", "deleteRowText", "deleteRowTranslationKey", "disabled", "defaultValues", "margin", "tooltip", "required", "keyColumnTitle", "valueColumnTitle", "dropdownColumnTitle", "hideDeleteButton", "hideAddButton", "dropdownItems", "dropdownWidth", "fullWidth"], outputs: ["valueChange", "allValuesValidEvent"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: WidgetTranslatePipe, name: "widgetTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CaseCountConfigurationComponent, decorators: [{
+            type: Component,
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<!--\n  ~ Copyright 2015-2023 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<form\n  class=\"case-count-configuration-form\"\n  *ngIf=\"{documentItems: documentItems$ | async, operatorItems: operatorItems$} as obs\"\n  [formGroup]=\"form\"\n>\n  <div class=\"form__element\">\n    <cds-dropdown\n      formControlName=\"documentDefinition\"\n      [helperText]=\"'documentDefinitionHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalidText]=\"'documentDefinitionHelperText' | widgetTranslate : dataSourceKey | async\"\n      [invalid]=\"documentDefinition.dirty && documentDefinition.invalid\"\n      [label]=\"'documentDefinition' | widgetTranslate : dataSourceKey | async\"\n      (selected)=\"documentDefinitionSelected($event)\"\n    >\n      <cds-dropdown-list [items]=\"obs?.documentItems || []\" type=\"multi\"></cds-dropdown-list>\n    </cds-dropdown>\n  </div>\n\n  <div class=\"form__element conditions-multi-input\">\n    <cds-label\n      [helperText]=\"'conditionsHelperText' | widgetTranslate : dataSourceKey | async\"\n      class=\"conditions-label\"\n      >{{ 'conditions' | widgetTranslate : dataSourceKey | async }}</cds-label\n    >\n    <valtimo-carbon-multi-input\n      [addRowText]=\"'addCondition' | widgetTranslate : dataSourceKey | async\"\n      [defaultValues]=\"defaultConditionValues$ | async\"\n      [dropdownColumnTitle]=\"'operator' | widgetTranslate : dataSourceKey | async\"\n      [dropdownItems]=\"operatorItems$ | async\"\n      [fullWidth]=\"true\"\n      [initialAmountOfRows]=\"0\"\n      [keyColumnTitle]=\"'path' | widgetTranslate : dataSourceKey | async\"\n      [minimumAmountOfRows]=\"0\"\n      [valueColumnTitle]=\"'value' | widgetTranslate : dataSourceKey | async\"\n      type=\"keyDropdownValue\"\n      (allValuesValidEvent)=\"onAllConditionsValid($event)\"\n      (valueChange)=\"conditionsValueChange($event)\"\n    ></valtimo-carbon-multi-input>\n  </div>\n</form>\n", styles: ["/*!\n * Copyright 2015-2023 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 */.case-count-configuration-form .conditions-label{margin-bottom:16px}.case-count-configuration-form .conditions-multi-input .cds--form__helper-text{font-style:italic}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1$3.FormBuilder }, { type: i2$2.DocumentService }, { type: i1$1.TranslateService }, { type: WidgetTranslationService }]; }, propDecorators: { dataSourceKey: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], prefillConfiguration: [{
+                type: Input
+            }], configurationEvent: [{
+                type: Output
+            }] } });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 caseCountDataSourceSpecification = {
+    dataSourceKey: 'case-count',
+    configurationComponent: CaseCountConfigurationComponent,
+    translations: {
+        de: {
+            title: 'Fallzahl',
+            documentDefinition: 'Falltyp (erforderlich)',
+            documentDefinitionHelperText: 'Der Falltyp, für den die Anzahl abgerufen wird',
+            '!=': 'Nicht gleichzusetzen mit',
+            '==': 'Gleich',
+            '>': 'Größer als',
+            '>=': 'Größer als oder gleich wie',
+            '<': 'Weniger als',
+            '<=': 'Gleich oder kleiner als',
+            path: 'Pfad',
+            operator: 'Operator',
+            value: 'Wert',
+            conditions: 'Bedingungen',
+            conditionsHelperText: "Geben Sie optionale Bedingungen zum Abrufen der Anzahl der Fälle für den ausgewählten Falltyp an. Zum Beispiel: 'case:createdBy', 'Gleich', 'test@test.com'.",
+            addCondition: 'Bedingung hinzufügen',
+        },
+        en: {
+            title: 'Case count',
+            documentDefinition: 'Case type (required)',
+            documentDefinitionHelperText: 'The case type for which the count is retrieved',
+            '!=': 'Not equal to',
+            '==': 'Equal to',
+            '>': 'Greater than',
+            '>=': 'Greater than or equal to',
+            '<': 'Less than',
+            '<=': 'Less than or equal to',
+            path: 'Path (required)',
+            operator: 'Operator',
+            value: 'Value',
+            conditions: 'Conditions',
+            conditionsHelperText: "Specify optional conditions for retrieving the number of cases for the selected case type. For example: 'case:createdBy', 'Equal to', 'test@test.com'.",
+            addCondition: 'Add condition',
+        },
+        nl: {
+            title: 'Aantal dossiers',
+            documentDefinition: 'Dossiertype (vereist)',
+            documentDefinitionHelperText: 'Het dossiertype waarvoor de telling wordt opgehaald',
+            '!=': 'Niet gelijk aan',
+            '==': 'Gelijk aan',
+            '>': 'Groter dan',
+            '>=': 'Groter dan of gelijk aan',
+            '<': 'Minder dan',
+            '<=': 'Minder dan of gelijk aan',
+            path: 'Pad',
+            operator: 'Operator',
+            value: 'Waarde',
+            conditions: 'Condities',
+            conditionsHelperText: "Geef optionele condities op voor het ophalen van het aantal zaken voor het geselecteerde zaaktype. Bijvoorbeeld: 'case:createdBy', 'Gelijk aan', 'test@test.com'.",
+            addCondition: 'Conditie toevoegen',
+        },
+    },
+};
+
+/*
+ * Copyright 2015-2023 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 CaseCountDataSourceModule {
+}
+CaseCountDataSourceModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CaseCountDataSourceModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+CaseCountDataSourceModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: CaseCountDataSourceModule, declarations: [CaseCountConfigurationComponent], imports: [CommonModule,
+        ReactiveFormsModule,
+        WidgetTranslatePipeModule,
+        InputModule,
+        DropdownModule,
+        CarbonMultiInputModule], exports: [CaseCountConfigurationComponent] });
+CaseCountDataSourceModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CaseCountDataSourceModule, providers: [
+        { provide: DATA_SOURCE_TOKEN, useValue: caseCountDataSourceSpecification, multi: true },
+    ], imports: [CommonModule,
+        ReactiveFormsModule,
+        WidgetTranslatePipeModule,
+        InputModule,
+        DropdownModule,
+        CarbonMultiInputModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CaseCountDataSourceModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [CaseCountConfigurationComponent],
+                    imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        WidgetTranslatePipeModule,
+                        InputModule,
+                        DropdownModule,
+                        CarbonMultiInputModule,
+                    ],
+                    exports: [CaseCountConfigurationComponent],
+                    providers: [
+                        { provide: DATA_SOURCE_TOKEN, useValue: caseCountDataSourceSpecification, multi: true },
+                    ],
+                }]
+        }] });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 BarChartDisplayComponent {
+}
+BarChartDisplayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BarChartDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+BarChartDisplayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: BarChartDisplayComponent, selector: "valtimo-bar-chart-display", inputs: { displayTypeKey: "displayTypeKey", data: "data", displayTypeProperties: "displayTypeProperties" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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\nbar chart works\n", styles: ["/*!\n * Copyright 2015-2023 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 */:host{display:flex;padding:20px;width:100%;height:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BarChartDisplayComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'valtimo-bar-chart-display', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2023 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\nbar chart works\n", styles: ["/*!\n * Copyright 2015-2023 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 */:host{display:flex;padding:20px;width:100%;height:100%}\n"] }]
+        }], propDecorators: { displayTypeKey: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], displayTypeProperties: [{
+                type: Input
+            }] } });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 barChartSpecification = {
+    displayTypeKey: 'bar-chart',
+    displayComponent: BarChartDisplayComponent,
+    width: 1,
+    height: 2,
+    translations: {
+        nl: {
+            title: 'Staafdiagram',
+        },
+        en: {
+            title: 'Bar chart',
+        },
+        de: {
+            title: 'Balkendiagramm',
+        },
+    },
+    requiredDataFeatures: [],
+};
+
+/*
+ * Copyright 2015-2023 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 BarChartModule {
+}
+BarChartModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BarChartModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+BarChartModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: BarChartModule, declarations: [BarChartDisplayComponent], imports: [CommonModule], exports: [BarChartDisplayComponent] });
+BarChartModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BarChartModule, providers: [{ provide: DISPLAY_TYPE_TOKEN, useValue: barChartSpecification, multi: true }], imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BarChartModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [BarChartDisplayComponent],
+                    imports: [CommonModule],
+                    exports: [BarChartDisplayComponent],
+                    providers: [{ provide: DISPLAY_TYPE_TOKEN, useValue: barChartSpecification, multi: true }],
+                }]
+        }] });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 BigNumberConfigurationComponent {
+    constructor(fb) {
+        this.fb = fb;
+        this.form = this.fb.group({
+            title: this.fb.control('', [Validators.required]),
+            subtitle: this.fb.control(''),
+            label: this.fb.control(''),
+            useKPI: this.fb.control(false, [Validators.required]),
+            lowSeverityThreshold: this.fb.control(null),
+            mediumSeverityThreshold: this.fb.control(null),
+            highSeverityThreshold: this.fb.control(null),
+        });
+        this.configurationEvent = new EventEmitter();
+        this._subscriptions = new Subscription();
+    }
+    set disabled(disabledValue) {
+        if (disabledValue) {
+            this.form.disable();
+        }
+        else {
+            this.form.enable();
+        }
+    }
+    get title() {
+        return this.form.get('title');
+    }
+    get subtitle() {
+        return this.form.get('subtitle');
+    }
+    get label() {
+        return this.form.get('label');
+    }
+    get useKPI() {
+        return this.form.get('useKPI');
+    }
+    get lowSeverityThreshold() {
+        return this.form.get('lowSeverityThreshold');
+    }
+    get mediumSeverityThreshold() {
+        return this.form.get('mediumSeverityThreshold');
+    }
+    get highSeverityThreshold() {
+        return this.form.get('highSeverityThreshold');
+    }
+    set prefillConfiguration(configurationValue) {
+        if (configurationValue) {
+            this.title.setValue(configurationValue.title || '');
+            this.subtitle.setValue(configurationValue.subtitle || '');
+            this.label.setValue(configurationValue.label || '');
+            this.useKPI.setValue(configurationValue.useKPI || false);
+            this.lowSeverityThreshold.setValue(configurationValue.lowSeverityThreshold || null);
+            this.mediumSeverityThreshold.setValue(configurationValue.mediumSeverityThreshold || null);
+            this.highSeverityThreshold.setValue(configurationValue.highSeverityThreshold || null);
+        }
+    }
+    ngOnInit() {
+        this.openFormSubscription();
+        this.openKPISubscription();
+    }
+    ngOnDestroy() {
+        this._subscriptions.unsubscribe();
+    }
+    openFormSubscription() {
+        this._subscriptions.add(this.form.valueChanges.pipe(startWith(this.form.value)).subscribe(formValue => {
+            this.configurationEvent.emit({ valid: this.form.valid, data: formValue });
+        }));
+    }
+    openKPISubscription() {
+        this._subscriptions.add(this.useKPI.valueChanges.pipe(startWith(this.useKPI.value)).subscribe(useKpi => {
+            const validators = [Validators.required];
+            if (useKpi) {
+                this.lowSeverityThreshold.setValidators(validators);
+                this.mediumSeverityThreshold.setValidators(validators);
+                this.highSeverityThreshold.setValidators(validators);
+            }
+            else {
+                this.lowSeverityThreshold.clearValidators();
+                this.mediumSeverityThreshold.clearValidators();
+                this.highSeverityThreshold.clearValidators();
+            }
+            this.lowSeverityThreshold.updateValueAndValidity();
+            this.mediumSeverityThreshold.updateValueAndValidity();
+            this.highSeverityThreshold.updateValueAndValidity();
+        }));
+    }
+}
+BigNumberConfigurationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BigNumberConfigurationComponent, deps: [{ token: i1$3.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+BigNumberConfigurationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: BigNumberConfigurationComponent, selector: "ng-component", inputs: { displayTypeKey: "displayTypeKey", disabled: "disabled", prefillConfiguration: "prefillConfiguration" }, outputs: { configurationEvent: "configurationEvent" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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<form [formGroup]=\"form\">\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'formTitleHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalidText]=\"'formTitleHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalid]=\"title.dirty && title.invalid\"\n    >\n      {{ 'formTitle' | widgetTranslate : displayTypeKey | async }}\n\n      <input cdsText formControlName=\"title\" [invalid]=\"title.dirty && title.invalid\" />\n    </cds-label>\n  </div>\n\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'subtitleHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalidText]=\"'subtitleHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalid]=\"subtitle.dirty && subtitle.invalid\"\n    >\n      {{ 'subtitle' | widgetTranslate : displayTypeKey | async }}\n\n      <input cdsText formControlName=\"subtitle\" [invalid]=\"subtitle.dirty && subtitle.invalid\" />\n    </cds-label>\n  </div>\n\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'labelHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalidText]=\"'labelHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalid]=\"label.dirty && label.invalid\"\n    >\n      {{ 'label' | widgetTranslate : displayTypeKey | async }}\n\n      <input cdsText formControlName=\"label\" [invalid]=\"label.dirty && label.invalid\" />\n    </cds-label>\n  </div>\n\n  <div class=\"form__element\">\n    <cds-checkbox formControlName=\"useKPI\">\n      {{ 'useKPI' | widgetTranslate : displayTypeKey | async }}\n    </cds-checkbox>\n  </div>\n\n  <div class=\"form__row\" *ngIf=\"useKPI.value\">\n    <div class=\"form__element\">\n      <cds-label [invalid]=\"lowSeverityThreshold.dirty && lowSeverityThreshold.invalid\">\n        {{ 'lowSeverityThreshold' | widgetTranslate : displayTypeKey | async }}\n\n        <input\n          cdsText\n          [invalid]=\"lowSeverityThreshold.dirty && lowSeverityThreshold.invalid\"\n          formControlName=\"lowSeverityThreshold\"\n          type=\"number\"\n        />\n      </cds-label>\n    </div>\n\n    <div class=\"form__spacer\"></div>\n\n    <div class=\"form__element\">\n      <cds-label [invalid]=\"mediumSeverityThreshold.dirty && mediumSeverityThreshold.invalid\">\n        {{ 'mediumSeverityThreshold' | widgetTranslate : displayTypeKey | async }}\n\n        <input\n          cdsText\n          formControlName=\"mediumSeverityThreshold\"\n          [invalid]=\"mediumSeverityThreshold.dirty && mediumSeverityThreshold.invalid\"\n          type=\"number\"\n        />\n      </cds-label>\n    </div>\n\n    <div class=\"form__spacer\"></div>\n\n    <div class=\"form__element\">\n      <cds-label [invalid]=\"highSeverityThreshold.dirty && highSeverityThreshold.invalid\">\n        {{ 'highSeverityThreshold' | widgetTranslate : displayTypeKey | async }}\n\n        <input\n          cdsText\n          formControlName=\"highSeverityThreshold\"\n          [invalid]=\"highSeverityThreshold.dirty && highSeverityThreshold.invalid\"\n          type=\"number\"\n        />\n      </cds-label>\n    </div>\n  </div>\n</form>\n", dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4$1.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i4$1.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "component", type: i4$1.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: WidgetTranslatePipe, name: "widgetTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BigNumberConfigurationComponent, decorators: [{
+            type: Component,
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2023 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<form [formGroup]=\"form\">\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'formTitleHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalidText]=\"'formTitleHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalid]=\"title.dirty && title.invalid\"\n    >\n      {{ 'formTitle' | widgetTranslate : displayTypeKey | async }}\n\n      <input cdsText formControlName=\"title\" [invalid]=\"title.dirty && title.invalid\" />\n    </cds-label>\n  </div>\n\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'subtitleHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalidText]=\"'subtitleHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalid]=\"subtitle.dirty && subtitle.invalid\"\n    >\n      {{ 'subtitle' | widgetTranslate : displayTypeKey | async }}\n\n      <input cdsText formControlName=\"subtitle\" [invalid]=\"subtitle.dirty && subtitle.invalid\" />\n    </cds-label>\n  </div>\n\n  <div class=\"form__element\">\n    <cds-label\n      [helperText]=\"'labelHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalidText]=\"'labelHelperText' | widgetTranslate : displayTypeKey | async\"\n      [invalid]=\"label.dirty && label.invalid\"\n    >\n      {{ 'label' | widgetTranslate : displayTypeKey | async }}\n\n      <input cdsText formControlName=\"label\" [invalid]=\"label.dirty && label.invalid\" />\n    </cds-label>\n  </div>\n\n  <div class=\"form__element\">\n    <cds-checkbox formControlName=\"useKPI\">\n      {{ 'useKPI' | widgetTranslate : displayTypeKey | async }}\n    </cds-checkbox>\n  </div>\n\n  <div class=\"form__row\" *ngIf=\"useKPI.value\">\n    <div class=\"form__element\">\n      <cds-label [invalid]=\"lowSeverityThreshold.dirty && lowSeverityThreshold.invalid\">\n        {{ 'lowSeverityThreshold' | widgetTranslate : displayTypeKey | async }}\n\n        <input\n          cdsText\n          [invalid]=\"lowSeverityThreshold.dirty && lowSeverityThreshold.invalid\"\n          formControlName=\"lowSeverityThreshold\"\n          type=\"number\"\n        />\n      </cds-label>\n    </div>\n\n    <div class=\"form__spacer\"></div>\n\n    <div class=\"form__element\">\n      <cds-label [invalid]=\"mediumSeverityThreshold.dirty && mediumSeverityThreshold.invalid\">\n        {{ 'mediumSeverityThreshold' | widgetTranslate : displayTypeKey | async }}\n\n        <input\n          cdsText\n          formControlName=\"mediumSeverityThreshold\"\n          [invalid]=\"mediumSeverityThreshold.dirty && mediumSeverityThreshold.invalid\"\n          type=\"number\"\n        />\n      </cds-label>\n    </div>\n\n    <div class=\"form__spacer\"></div>\n\n    <div class=\"form__element\">\n      <cds-label [invalid]=\"highSeverityThreshold.dirty && highSeverityThreshold.invalid\">\n        {{ 'highSeverityThreshold' | widgetTranslate : displayTypeKey | async }}\n\n        <input\n          cdsText\n          formControlName=\"highSeverityThreshold\"\n          [invalid]=\"highSeverityThreshold.dirty && highSeverityThreshold.invalid\"\n          type=\"number\"\n        />\n      </cds-label>\n    </div>\n  </div>\n</form>\n" }]
+        }], ctorParameters: function () { return [{ type: i1$3.FormBuilder }]; }, propDecorators: { displayTypeKey: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], prefillConfiguration: [{
+                type: Input
+            }], configurationEvent: [{
+                type: Output
+            }] } });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+var WidgetSeverity;
+(function (WidgetSeverity) {
+    WidgetSeverity["BLACK"] = "valtimo-severity__black";
+    WidgetSeverity["GREEN"] = "valtimo-severity__green";
+    WidgetSeverity["YELLOW"] = "valtimo-severity__yellow";
+    WidgetSeverity["ORANGE"] = "valtimo-severity__orange";
+    WidgetSeverity["RED"] = "valtimo-severity__red";
+})(WidgetSeverity || (WidgetSeverity = {}));
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 BigNumberDisplayComponent {
+    get severityClass() {
+        var _a;
+        if (!this.displayTypeProperties.useKPI) {
+            return WidgetSeverity.BLACK;
+        }
+        const value = (_a = this.data) === null || _a === void 0 ? void 0 : _a.value;
+        if (value < this.displayTypeProperties.lowSeverityThreshold) {
+            return WidgetSeverity.GREEN;
+        }
+        else if (value < this.displayTypeProperties.mediumSeverityThreshold) {
+            return WidgetSeverity.YELLOW;
+        }
+        else if (value < this.displayTypeProperties.highSeverityThreshold) {
+            return WidgetSeverity.ORANGE;
+        }
+        return WidgetSeverity.RED;
+    }
+    get numberFontSize() {
+        if (!this.data) {
+            return 122;
+        }
+        return Math.floor(122 / this.data.value.toString().length) + 20;
+    }
+}
+BigNumberDisplayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BigNumberDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+BigNumberDisplayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: BigNumberDisplayComponent, selector: "valtimo-big-number-display", inputs: { displayTypeKey: "displayTypeKey", data: "data", displayTypeProperties: "displayTypeProperties" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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<section class=\"valtimo-big-number-widget__header\">\n  <h3 class=\"valtimo-big-number-widget__title\">{{ displayTypeProperties.title }}</h3>\n\n  <span *ngIf=\"displayTypeProperties.subtitle\" class=\"valtimo-big-number-widget__subtitle\">\n    {{ displayTypeProperties.subtitle }}\n  </span>\n</section>\n\n<section class=\"valtimo-big-number-widget__content\">\n  <span\n    [class]=\"['valtimo-big-number-widget__number', severityClass]\"\n    [style.fontSize.px]=\"numberFontSize\"\n    >{{ data?.value }}</span\n  >\n\n  <span *ngIf=\"displayTypeProperties.label\" class=\"valtimo-big-number-widget__label\">\n    {{ displayTypeProperties.label }}\n  </span>\n</section>\n", styles: ["/*!\n * Copyright 2015-2023 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 */:host{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:20px}.valtimo-big-number-widget__title{font-size:20px;margin-bottom:12px}.valtimo-big-number-widget__subtitle{font-size:14px}.valtimo-big-number-widget__number{font-weight:lighter;font-size:122px;line-height:.75em}.valtimo-big-number-widget__label{font-size:12px;margin-left:12px;margin-bottom:-1px}.valtimo-big-number-widget__content{display:flex;align-items:flex-end}.valtimo-severity__black{color:#000}.valtimo-severity__green{color:#42be65}.valtimo-severity__yellow{color:#f1c21b}.valtimo-severity__orange{color:#ff832b}.valtimo-severity__red{color:#da1e28}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BigNumberDisplayComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'valtimo-big-number-display', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2023 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<section class=\"valtimo-big-number-widget__header\">\n  <h3 class=\"valtimo-big-number-widget__title\">{{ displayTypeProperties.title }}</h3>\n\n  <span *ngIf=\"displayTypeProperties.subtitle\" class=\"valtimo-big-number-widget__subtitle\">\n    {{ displayTypeProperties.subtitle }}\n  </span>\n</section>\n\n<section class=\"valtimo-big-number-widget__content\">\n  <span\n    [class]=\"['valtimo-big-number-widget__number', severityClass]\"\n    [style.fontSize.px]=\"numberFontSize\"\n    >{{ data?.value }}</span\n  >\n\n  <span *ngIf=\"displayTypeProperties.label\" class=\"valtimo-big-number-widget__label\">\n    {{ displayTypeProperties.label }}\n  </span>\n</section>\n", styles: ["/*!\n * Copyright 2015-2023 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 */:host{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:20px}.valtimo-big-number-widget__title{font-size:20px;margin-bottom:12px}.valtimo-big-number-widget__subtitle{font-size:14px}.valtimo-big-number-widget__number{font-weight:lighter;font-size:122px;line-height:.75em}.valtimo-big-number-widget__label{font-size:12px;margin-left:12px;margin-bottom:-1px}.valtimo-big-number-widget__content{display:flex;align-items:flex-end}.valtimo-severity__black{color:#000}.valtimo-severity__green{color:#42be65}.valtimo-severity__yellow{color:#f1c21b}.valtimo-severity__orange{color:#ff832b}.valtimo-severity__red{color:#da1e28}\n"] }]
+        }], propDecorators: { displayTypeKey: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], displayTypeProperties: [{
+                type: Input
+            }] } });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 bigNumberSpecification = {
+    displayTypeKey: 'number',
+    displayComponent: BigNumberDisplayComponent,
+    configurationComponent: BigNumberConfigurationComponent,
+    width: 1,
+    height: 1,
+    translations: {
+        nl: {
+            title: 'Groot getal',
+            formTitle: 'Titel (vereist)',
+            formTitleHelperText: 'De titel die wordt weergegeven in de widget',
+            subtitle: 'Ondertitel',
+            subtitleHelperText: 'De ondertitel weergegeven in de widget',
+            label: 'Label',
+            labelHelperText: 'Het label dat wordt weergegeven in de widget',
+            useKPI: 'KPI gebruiken',
+            lowSeverityThreshold: 'Lage ernstdrempel (vereist)',
+            mediumSeverityThreshold: 'Middelmatige ernstdrempel (vereist)',
+            highSeverityThreshold: 'Hoge ernstdrempel (vereist)',
+        },
+        en: {
+            title: 'Big number',
+            formTitle: 'Title (required)',
+            formTitleHelperText: 'The title displayed in the widget',
+            subtitle: 'Subtitle',
+            subtitleHelperText: 'The subtitle displayed in the widget',
+            label: 'Label',
+            labelHelperText: 'The label displayed in the widget',
+            useKPI: 'Use KPI',
+            lowSeverityThreshold: 'Low severity threshold (required)',
+            mediumSeverityThreshold: 'Medium severity threshold (required)',
+            highSeverityThreshold: 'High severity threshold (required)',
+        },
+        de: {
+            title: 'Große Nummer',
+            formTitle: 'Titel (erforderlich)',
+            formTitleHelperText: 'Der im Widget angezeigte Titel',
+            subtitle: 'Untertitel',
+            subtitleHelperText: 'Der im Widget angezeigte Untertitel',
+            label: 'Beschriftung',
+            labelHelperText: 'Die im Widget angezeigte Beschriftung',
+            useKPI: 'Verwenden Sie KPI',
+            lowSeverityThreshold: 'Niedriger Schweregradschwellenwert (erforderlich)',
+            mediumSeverityThreshold: 'Mittlerer Schweregradschwellenwert (erforderlich)',
+            highSeverityThreshold: 'Hoher Schweregradschwellenwert (erforderlich)',
+        },
+    },
+    requiredDataFeatures: [DATA_FEATURES.NUMBER],
+};
+
+/*
+ * Copyright 2015-2023 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 BigNumberModule {
+}
+BigNumberModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BigNumberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+BigNumberModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: BigNumberModule, declarations: [BigNumberDisplayComponent, BigNumberConfigurationComponent], imports: [CommonModule,
+        ReactiveFormsModule,
+        WidgetTranslatePipeModule,
+        InputModule,
+        CheckboxModule], exports: [BigNumberDisplayComponent] });
+BigNumberModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BigNumberModule, providers: [{ provide: DISPLAY_TYPE_TOKEN, useValue: bigNumberSpecification, multi: true }], imports: [CommonModule,
+        ReactiveFormsModule,
+        WidgetTranslatePipeModule,
+        InputModule,
+        CheckboxModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BigNumberModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [BigNumberDisplayComponent, BigNumberConfigurationComponent],
+                    imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        WidgetTranslatePipeModule,
+                        InputModule,
+                        CheckboxModule,
+                    ],
+                    exports: [BigNumberDisplayComponent],
+                    providers: [{ provide: DISPLAY_TYPE_TOKEN, useValue: bigNumberSpecification, multi: true }],
+                }]
+        }] });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 MeterDisplayComponent {
+}
+MeterDisplayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MeterDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+MeterDisplayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MeterDisplayComponent, selector: "valtimo-meter-display", inputs: { displayTypeKey: "displayTypeKey", data: "data", displayTypeProperties: "displayTypeProperties" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2023 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\nmeter works\n", styles: ["/*!\n * Copyright 2015-2023 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 */:host{display:flex;padding:20px;width:100%;height:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MeterDisplayComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'valtimo-meter-display', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2023 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\nmeter works\n", styles: ["/*!\n * Copyright 2015-2023 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 */:host{display:flex;padding:20px;width:100%;height:100%}\n"] }]
+        }], propDecorators: { displayTypeKey: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], displayTypeProperties: [{
+                type: Input
+            }] } });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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 meterSpecification = {
+    displayTypeKey: 'meter',
+    displayComponent: MeterDisplayComponent,
+    width: 2,
+    height: 1,
+    translations: {
+        nl: {
+            title: 'Meter',
+        },
+        en: {
+            title: 'Meter',
+        },
+        de: {
+            title: 'Meter',
+        },
+    },
+    requiredDataFeatures: [],
+};
+
+/*
+ * Copyright 2015-2023 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 MeterModule {
+}
+MeterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MeterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+MeterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: MeterModule, declarations: [MeterDisplayComponent], imports: [CommonModule], exports: [MeterDisplayComponent] });
+MeterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MeterModule, providers: [{ provide: DISPLAY_TYPE_TOKEN, useValue: meterSpecification, multi: true }], imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MeterModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [MeterDisplayComponent],
+                    imports: [CommonModule],
+                    exports: [MeterDisplayComponent],
+                    providers: [{ provide: DISPLAY_TYPE_TOKEN, useValue: meterSpecification, multi: true }],
+                }]
+        }] });
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
+
+/*
+ * Copyright 2015-2023 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.
+ */
 
 /*
  * Copyright 2015-2023 Ritense BV, the Netherlands.
@@ -223,5 +2180,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { DashboardComponent, DashboardModule, HttpLoaderFactory };
+export { BarChartDisplayComponent, BarChartModule, BigNumberConfigurationComponent, BigNumberDisplayComponent, BigNumberModule, CaseCountConfigurationComponent, CaseCountDataSourceModule, DATA_FEATURES, DATA_SOURCE_TOKEN, DISPLAY_TYPE_TOKEN, DashboardComponent, DashboardModule, DashboardService, HttpLoaderFactory, MeterDisplayComponent, MeterModule, Operator, TestConfigurationComponent, TestDataSourceModule, WIDGET_1X_HEIGHT, WIDGET_1X_MIN_WIDTH, WidgetDashboardComponent, WidgetDashboardContentComponent, WidgetService, WidgetSeverity, WidgetTranslatePipe, WidgetTranslatePipeModule, WidgetTranslationService, barChartSpecification, bigNumberSpecification, caseCountDataSourceSpecification, meterSpecification, testDataSourceSpecification };
 //# sourceMappingURL=valtimo-dashboard.mjs.map