@valtimo/case-management 13.37.0 → 13.38.0

package/fesm2022/valtimo-case-management.mjs

@@ -1202,11 +1202,11 @@ class CaseManagementAddTabModalComponent {
             : { uniqueKey: { value: control.value } };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementAddTabModalComponent, deps: [{ token: i1$4.FormBuilder }, { token: i2.IconService }, { token: TabService }, { token: i2$1.ConfigService }, { token: i2$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementAddTabModalComponent, isStandalone: false, selector: "valtimo-case-management-add-tab-modal", inputs: { params: "params", open: "open" }, outputs: { closeModalEvent: "closeModalEvent" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal valtimoCdsModal *ngIf=\"{selectedTabType: selectedTabType$ | async} as obs\" [open]=\"open\">\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onCloseModal()\" [cdsLayer]=\"1\">\n    <h3 cdsModalHeaderHeading>\n      {{\n        !obs.selectedTabType\n          ? ('caseManagement.tabManagement.addModal.title'\n            | translate: {documentDefinitionName: (params.caseDefinitionKey | titlecase)})\n          : ('caseManagement.tabManagement.titles.' + obs.selectedTabType | translate)\n      }}\n    </h3>\n  </cds-modal-header>\n\n  <section [formGroup]=\"form\" cdsModalContent class=\"valtimo-add-tab-modal__content\" [cdsLayer]=\"1\">\n    <valtimo-tab-form\n      *ngIf=\"obs.selectedTabType; else tabTypeSelection\"\n      [tabType]=\"obs.selectedTabType\"\n    ></valtimo-tab-form>\n\n    <ng-template #tabTypeSelection>\n      <span> {{ 'caseManagement.tabManagement.addModal.description' | translate }} </span>\n\n      <div *ngIf=\"tabTypes$ | async as tabTypes\" class=\"valtimo-add-tab-modal__types\">\n        <cds-tooltip\n          *ngFor=\"let tabType of tabTypes\"\n          [caret]=\"true\"\n          enterDelayMs=\"0\"\n          leaveDelayMs=\"0\"\n          [description]=\"tabType.disabledTooltipTranslationKey | translate\"\n          [disabled]=\"!tabType.disabled\"\n          align=\"bottom\"\n        >\n          <button\n            cdsButton=\"secondary\"\n            [disabled]=\"tabType.disabled\"\n            (click)=\"onTabTypeSelect(tabType.type)\"\n          >\n            {{ tabType.title | translate }}\n\n            <svg [cdsIcon]=\"tabType.icon\" size=\"16\" class=\"cds--btn__icon\"></svg>\n          </button>\n        </cds-tooltip>\n      </div>\n    </ng-template>\n  </section>\n\n  <cds-modal-footer class=\"valtimo-add-tab-modal__footer\" [cdsLayer]=\"1\">\n    <button class=\"valtimo-add-tab-modal__cancel\" cdsButton=\"ghost\" (click)=\"onCloseModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <div class=\"valtimo-add-tab-modal__actions\" *ngIf=\"obs.selectedTabType\">\n      <button cdsButton=\"secondary\" (click)=\"backClick()\">\n        {{ 'interface.back' | translate }}\n      </button>\n\n      <button cdsButton=\"primary\" [disabled]=\"form.invalid\" (click)=\"addTab(obs.selectedTabType)\">\n        {{ 'caseManagement.tabManagement.addModal.addTab' | translate }}\n      </button>\n    </div>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-add-tab-modal__footer .cds--modal-footer{justify-content:unset;display:grid;grid-template-columns:1fr 1fr 2fr;grid-template-areas:\"cancel . actions\"}.valtimo-add-tab-modal__cancel{grid-area:cancel;width:100%}.valtimo-add-tab-modal__actions{grid-area:actions;display:flex}.valtimo-add-tab-modal__types{display:grid;grid-template:1fr/repeat(3,1fr);gap:16px}.valtimo-add-tab-modal__types button{width:100%}.valtimo-add-tab-modal__content{display:flex;flex-direction:column;gap:24px}.cds--popover--open{z-index:999999!important}\n/*!\n * Copyright 2015-2025 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: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: TabFormComponent, selector: "valtimo-tab-form", inputs: ["tabType"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementAddTabModalComponent, isStandalone: false, selector: "valtimo-case-management-add-tab-modal", inputs: { params: "params", open: "open" }, outputs: { closeModalEvent: "closeModalEvent" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal valtimoCdsModal *ngIf=\"{selectedTabType: selectedTabType$ | async} as obs\" [open]=\"open\">\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onCloseModal()\" [cdsLayer]=\"1\">\n    <h3 cdsModalHeaderHeading>\n      {{\n        !obs.selectedTabType\n          ? ('caseManagement.tabManagement.addModal.title'\n            | translate: {documentDefinitionName: (params.caseDefinitionKey | titlecase)})\n          : ('caseManagement.tabManagement.titles.' + obs.selectedTabType | translate)\n      }}\n    </h3>\n  </cds-modal-header>\n\n  <section [formGroup]=\"form\" cdsModalContent class=\"valtimo-add-tab-modal__content\" [cdsLayer]=\"1\">\n    <valtimo-tab-form\n      *ngIf=\"obs.selectedTabType; else tabTypeSelection\"\n      [tabType]=\"obs.selectedTabType\"\n    ></valtimo-tab-form>\n\n    <ng-template #tabTypeSelection>\n      <span> {{ 'caseManagement.tabManagement.addModal.description' | translate }} </span>\n\n      <div *ngIf=\"tabTypes$ | async as tabTypes\" class=\"valtimo-add-tab-modal__types\">\n        <cds-tooltip\n          *ngFor=\"let tabType of tabTypes\"\n          [caret]=\"true\"\n          enterDelayMs=\"0\"\n          leaveDelayMs=\"0\"\n          [description]=\"tabType.disabledTooltipTranslationKey | translate\"\n          [disabled]=\"!tabType.disabled\"\n          align=\"bottom\"\n        >\n          <button\n            cdsButton=\"secondary\"\n            [disabled]=\"tabType.disabled\"\n            (click)=\"onTabTypeSelect(tabType.type)\"\n          >\n            {{ tabType.title | translate }}\n\n            <svg [cdsIcon]=\"tabType.icon\" size=\"16\" class=\"cds--btn__icon\"></svg>\n          </button>\n        </cds-tooltip>\n      </div>\n    </ng-template>\n  </section>\n\n  <cds-modal-footer class=\"valtimo-add-tab-modal__footer\" [cdsLayer]=\"1\">\n    <button class=\"valtimo-add-tab-modal__cancel\" cdsButton=\"ghost\" (click)=\"onCloseModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <div class=\"valtimo-add-tab-modal__actions\" *ngIf=\"obs.selectedTabType\">\n      <button cdsButton=\"secondary\" (click)=\"backClick()\">\n        {{ 'interface.back' | translate }}\n      </button>\n\n      <button cdsButton=\"primary\" [disabled]=\"form.invalid\" (click)=\"addTab(obs.selectedTabType)\">\n        {{ 'interface.create' | translate }}\n      </button>\n    </div>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-add-tab-modal__footer .cds--modal-footer{justify-content:unset;display:grid;grid-template-columns:1fr 1fr 2fr;grid-template-areas:\"cancel . actions\"}.valtimo-add-tab-modal__cancel{grid-area:cancel;width:100%}.valtimo-add-tab-modal__actions{grid-area:actions;display:flex}.valtimo-add-tab-modal__types{display:grid;grid-template:1fr/repeat(3,1fr);gap:16px}.valtimo-add-tab-modal__types button{width:100%}.valtimo-add-tab-modal__content{display:flex;flex-direction:column;gap:24px}.cds--popover--open{z-index:999999!important}\n/*!\n * Copyright 2015-2025 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: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: TabFormComponent, selector: "valtimo-tab-form", inputs: ["tabType"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementAddTabModalComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'valtimo-case-management-add-tab-modal', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal valtimoCdsModal *ngIf=\"{selectedTabType: selectedTabType$ | async} as obs\" [open]=\"open\">\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onCloseModal()\" [cdsLayer]=\"1\">\n    <h3 cdsModalHeaderHeading>\n      {{\n        !obs.selectedTabType\n          ? ('caseManagement.tabManagement.addModal.title'\n            | translate: {documentDefinitionName: (params.caseDefinitionKey | titlecase)})\n          : ('caseManagement.tabManagement.titles.' + obs.selectedTabType | translate)\n      }}\n    </h3>\n  </cds-modal-header>\n\n  <section [formGroup]=\"form\" cdsModalContent class=\"valtimo-add-tab-modal__content\" [cdsLayer]=\"1\">\n    <valtimo-tab-form\n      *ngIf=\"obs.selectedTabType; else tabTypeSelection\"\n      [tabType]=\"obs.selectedTabType\"\n    ></valtimo-tab-form>\n\n    <ng-template #tabTypeSelection>\n      <span> {{ 'caseManagement.tabManagement.addModal.description' | translate }} </span>\n\n      <div *ngIf=\"tabTypes$ | async as tabTypes\" class=\"valtimo-add-tab-modal__types\">\n        <cds-tooltip\n          *ngFor=\"let tabType of tabTypes\"\n          [caret]=\"true\"\n          enterDelayMs=\"0\"\n          leaveDelayMs=\"0\"\n          [description]=\"tabType.disabledTooltipTranslationKey | translate\"\n          [disabled]=\"!tabType.disabled\"\n          align=\"bottom\"\n        >\n          <button\n            cdsButton=\"secondary\"\n            [disabled]=\"tabType.disabled\"\n            (click)=\"onTabTypeSelect(tabType.type)\"\n          >\n            {{ tabType.title | translate }}\n\n            <svg [cdsIcon]=\"tabType.icon\" size=\"16\" class=\"cds--btn__icon\"></svg>\n          </button>\n        </cds-tooltip>\n      </div>\n    </ng-template>\n  </section>\n\n  <cds-modal-footer class=\"valtimo-add-tab-modal__footer\" [cdsLayer]=\"1\">\n    <button class=\"valtimo-add-tab-modal__cancel\" cdsButton=\"ghost\" (click)=\"onCloseModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <div class=\"valtimo-add-tab-modal__actions\" *ngIf=\"obs.selectedTabType\">\n      <button cdsButton=\"secondary\" (click)=\"backClick()\">\n        {{ 'interface.back' | translate }}\n      </button>\n\n      <button cdsButton=\"primary\" [disabled]=\"form.invalid\" (click)=\"addTab(obs.selectedTabType)\">\n        {{ 'caseManagement.tabManagement.addModal.addTab' | translate }}\n      </button>\n    </div>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-add-tab-modal__footer .cds--modal-footer{justify-content:unset;display:grid;grid-template-columns:1fr 1fr 2fr;grid-template-areas:\"cancel . actions\"}.valtimo-add-tab-modal__cancel{grid-area:cancel;width:100%}.valtimo-add-tab-modal__actions{grid-area:actions;display:flex}.valtimo-add-tab-modal__types{display:grid;grid-template:1fr/repeat(3,1fr);gap:16px}.valtimo-add-tab-modal__types button{width:100%}.valtimo-add-tab-modal__content{display:flex;flex-direction:column;gap:24px}.cds--popover--open{z-index:999999!important}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+            args: [{ standalone: false, selector: 'valtimo-case-management-add-tab-modal', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal valtimoCdsModal *ngIf=\"{selectedTabType: selectedTabType$ | async} as obs\" [open]=\"open\">\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onCloseModal()\" [cdsLayer]=\"1\">\n    <h3 cdsModalHeaderHeading>\n      {{\n        !obs.selectedTabType\n          ? ('caseManagement.tabManagement.addModal.title'\n            | translate: {documentDefinitionName: (params.caseDefinitionKey | titlecase)})\n          : ('caseManagement.tabManagement.titles.' + obs.selectedTabType | translate)\n      }}\n    </h3>\n  </cds-modal-header>\n\n  <section [formGroup]=\"form\" cdsModalContent class=\"valtimo-add-tab-modal__content\" [cdsLayer]=\"1\">\n    <valtimo-tab-form\n      *ngIf=\"obs.selectedTabType; else tabTypeSelection\"\n      [tabType]=\"obs.selectedTabType\"\n    ></valtimo-tab-form>\n\n    <ng-template #tabTypeSelection>\n      <span> {{ 'caseManagement.tabManagement.addModal.description' | translate }} </span>\n\n      <div *ngIf=\"tabTypes$ | async as tabTypes\" class=\"valtimo-add-tab-modal__types\">\n        <cds-tooltip\n          *ngFor=\"let tabType of tabTypes\"\n          [caret]=\"true\"\n          enterDelayMs=\"0\"\n          leaveDelayMs=\"0\"\n          [description]=\"tabType.disabledTooltipTranslationKey | translate\"\n          [disabled]=\"!tabType.disabled\"\n          align=\"bottom\"\n        >\n          <button\n            cdsButton=\"secondary\"\n            [disabled]=\"tabType.disabled\"\n            (click)=\"onTabTypeSelect(tabType.type)\"\n          >\n            {{ tabType.title | translate }}\n\n            <svg [cdsIcon]=\"tabType.icon\" size=\"16\" class=\"cds--btn__icon\"></svg>\n          </button>\n        </cds-tooltip>\n      </div>\n    </ng-template>\n  </section>\n\n  <cds-modal-footer class=\"valtimo-add-tab-modal__footer\" [cdsLayer]=\"1\">\n    <button class=\"valtimo-add-tab-modal__cancel\" cdsButton=\"ghost\" (click)=\"onCloseModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <div class=\"valtimo-add-tab-modal__actions\" *ngIf=\"obs.selectedTabType\">\n      <button cdsButton=\"secondary\" (click)=\"backClick()\">\n        {{ 'interface.back' | translate }}\n      </button>\n\n      <button cdsButton=\"primary\" [disabled]=\"form.invalid\" (click)=\"addTab(obs.selectedTabType)\">\n        {{ 'interface.create' | translate }}\n      </button>\n    </div>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-add-tab-modal__footer .cds--modal-footer{justify-content:unset;display:grid;grid-template-columns:1fr 1fr 2fr;grid-template-areas:\"cancel . actions\"}.valtimo-add-tab-modal__cancel{grid-area:cancel;width:100%}.valtimo-add-tab-modal__actions{grid-area:actions;display:flex}.valtimo-add-tab-modal__types{display:grid;grid-template:1fr/repeat(3,1fr);gap:16px}.valtimo-add-tab-modal__types button{width:100%}.valtimo-add-tab-modal__content{display:flex;flex-direction:column;gap:24px}.cds--popover--open{z-index:999999!important}\n/*!\n * Copyright 2015-2025 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: () => [{ type: i1$4.FormBuilder }, { type: i2.IconService }, { type: TabService }, { type: i2$1.ConfigService }, { type: i2$2.ActivatedRoute }], propDecorators: { params: [{
                 type: Input
             }], open: [{
@@ -1433,7 +1433,7 @@ class CaseManagementTabsComponent {
         ]);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementTabsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i2.IconService }, { token: TabManagementService }, { token: TabService }, { token: i3.TranslateService }, { token: i2$2.Router }, { token: i2$2.ActivatedRoute }, { token: i2$1.EditPermissionsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementTabsComponent, isStandalone: false, selector: "valtimo-case-management-tabs", viewQueries: [{ propertyName: "tabContentColumnTemplate", first: true, predicate: ["tabContentColumn"], descendants: true }, { propertyName: "tabTypeColumnTemplate", first: true, predicate: ["tabTypeColumn"], descendants: true }, { propertyName: "moveButtonsTemplate", first: true, predicate: ["moveButtonsTemplate"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    routeParams: caseManagementRouteParams$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n  } as obs\"\n>\n  <valtimo-carbon-list\n    *ngIf=\"{fields: fields$ | async, loading: loading$ | async, tabs: tabs$ | async} as obs\"\n    [actionItems]=\"actionItems\"\n    [items]=\"obs.tabs\"\n    [fields]=\"obs.fields\"\n    [header]=\"false\"\n    [loading]=\"obs.loading\"\n    (rowClicked)=\"onRowClicked($event)\"\n    [dragAndDrop]=\"true\"\n    [dragAndDropDisabled]=\"dragAndDropDisabled() || !(hasEditPermissions$ | async)\"\n    (itemsReordered)=\"onItemsReorderedEvent($event)\"\n  >\n    <ng-container carbonToolbarContent>\n      <ng-container [ngTemplateOutlet]=\"addTabButton\"></ng-container>\n    </ng-container>\n\n    <valtimo-no-results\n      [action]=\"addTabButton\"\n      [description]=\"'case.tabs.noResultsDescription' | translate\"\n      [title]=\"'case.tabs.noResults' | translate\"\n    ></valtimo-no-results>\n  </valtimo-carbon-list>\n\n  <ng-template #tabTypeColumn let-data=\"data\">\n    {{\n      isTranslated('caseManagement.tabType.' + data.item.type)\n        ? ('caseManagement.tabType.' + data.item.type | translate)\n        : data.item.type\n    }}\n  </ng-template>\n\n  <ng-template #tabContentColumn let-data=\"data\">\n    {{\n      isTranslated('case.tabs.' + data.item.contentKey)\n        ? ('case.tabs.' + data.item.contentKey | translate)\n        : data.item.contentKey\n    }}\n  </ng-template>\n\n  <ng-template #addTabButton>\n    <button cdsButton=\"primary\" *ngIf=\"obs.hasEditPermissions\" (click)=\"openAddTabModal()\">\n      {{ 'caseManagement.tabManagement.addModal.addTab' | translate }}\n\n      <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  </ng-template>\n\n  <valtimo-case-management-add-tab-modal\n    *ngIf=\"openAddModal$ | async\"\n    [params]=\"obs.routeParams\"\n    [open]=\"openAddModal$ | async\"\n    (closeModalEvent)=\"onCloseAddModalEvent($event)\"\n  ></valtimo-case-management-add-tab-modal>\n\n  <valtimo-case-management-edit-tab-modal\n    *ngIf=\"openEditModal$ | async\"\n    [tab]=\"tab$ | async\"\n    (closeModalEvent)=\"onCloseEditModalEvent($event)\"\n    [open]=\"openEditModal$ | async\"\n  ></valtimo-case-management-edit-tab-modal>\n\n  <valtimo-confirmation-modal\n    confirmButtonTextTranslationKey=\"interface.delete\"\n    confirmButtonType=\"danger\"\n    contentTranslationKey=\"caseManagement.tabManagement.deleteModal.description\"\n    [outputOnConfirm]=\"deleteRowKey$ | async\"\n    [showModalSubject$]=\"showDeleteModal$\"\n    titleTranslationKey=\"caseManagement.tabManagement.deleteModal.title\"\n    (confirmEvent)=\"onConfirmEvent($event)\"\n  ></valtimo-confirmation-modal>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: CaseManagementAddTabModalComponent, selector: "valtimo-case-management-add-tab-modal", inputs: ["params", "open"], outputs: ["closeModalEvent"] }, { kind: "component", type: CaseManagementEditTabModalComponent, selector: "valtimo-case-management-edit-tab-modal", inputs: ["open", "tab"], outputs: ["closeModalEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementTabsComponent, isStandalone: false, selector: "valtimo-case-management-tabs", viewQueries: [{ propertyName: "tabContentColumnTemplate", first: true, predicate: ["tabContentColumn"], descendants: true }, { propertyName: "tabTypeColumnTemplate", first: true, predicate: ["tabTypeColumn"], descendants: true }, { propertyName: "moveButtonsTemplate", first: true, predicate: ["moveButtonsTemplate"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    routeParams: caseManagementRouteParams$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n  } as obs\"\n>\n  <valtimo-carbon-list\n    *ngIf=\"{fields: fields$ | async, loading: loading$ | async, tabs: tabs$ | async} as obs\"\n    [actionItems]=\"actionItems\"\n    [items]=\"obs.tabs\"\n    [fields]=\"obs.fields\"\n    [header]=\"false\"\n    [loading]=\"obs.loading\"\n    (rowClicked)=\"onRowClicked($event)\"\n    [dragAndDrop]=\"true\"\n    [dragAndDropDisabled]=\"dragAndDropDisabled() || !(hasEditPermissions$ | async)\"\n    (itemsReordered)=\"onItemsReorderedEvent($event)\"\n  >\n    <ng-container carbonToolbarContent>\n      <ng-container [ngTemplateOutlet]=\"addTabButton\"></ng-container>\n    </ng-container>\n\n    <valtimo-no-results\n      [action]=\"addTabButton\"\n      [description]=\"'case.tabs.noResultsDescription' | translate\"\n      [title]=\"'case.tabs.noResults' | translate\"\n    ></valtimo-no-results>\n  </valtimo-carbon-list>\n\n  <ng-template #tabTypeColumn let-data=\"data\">\n    {{\n      isTranslated('caseManagement.tabType.' + data.item.type)\n        ? ('caseManagement.tabType.' + data.item.type | translate)\n        : data.item.type\n    }}\n  </ng-template>\n\n  <ng-template #tabContentColumn let-data=\"data\">\n    {{\n      isTranslated('case.tabs.' + data.item.contentKey)\n        ? ('case.tabs.' + data.item.contentKey | translate)\n        : data.item.contentKey\n    }}\n  </ng-template>\n\n  <ng-template #addTabButton>\n    <button cdsButton=\"primary\" *ngIf=\"obs.hasEditPermissions\" (click)=\"openAddTabModal()\">\n      {{ 'caseManagement.tabManagement.addModal.addTab' | translate }}\n\n      <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  </ng-template>\n\n  <valtimo-case-management-add-tab-modal\n    *ngIf=\"openAddModal$ | async\"\n    [params]=\"obs.routeParams\"\n    [open]=\"openAddModal$ | async\"\n    (closeModalEvent)=\"onCloseAddModalEvent($event)\"\n  ></valtimo-case-management-add-tab-modal>\n\n  <valtimo-case-management-edit-tab-modal\n    *ngIf=\"openEditModal$ | async\"\n    [tab]=\"tab$ | async\"\n    (closeModalEvent)=\"onCloseEditModalEvent($event)\"\n    [open]=\"openEditModal$ | async\"\n  ></valtimo-case-management-edit-tab-modal>\n\n  <valtimo-confirmation-modal\n    confirmButtonTextTranslationKey=\"interface.delete\"\n    confirmButtonType=\"danger\"\n    contentTranslationKey=\"caseManagement.tabManagement.deleteModal.description\"\n    [outputOnConfirm]=\"deleteRowKey$ | async\"\n    [showModalSubject$]=\"showDeleteModal$\"\n    titleTranslationKey=\"caseManagement.tabManagement.deleteModal.title\"\n    (confirmEvent)=\"onConfirmEvent($event)\"\n  ></valtimo-confirmation-modal>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: CaseManagementAddTabModalComponent, selector: "valtimo-case-management-add-tab-modal", inputs: ["params", "open"], outputs: ["closeModalEvent"] }, { kind: "component", type: CaseManagementEditTabModalComponent, selector: "valtimo-case-management-edit-tab-modal", inputs: ["open", "tab"], outputs: ["closeModalEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementTabsComponent, decorators: [{
             type: Component,
@@ -1838,11 +1838,11 @@ class CaseManagementStatusModalComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementStatusModalComponent, deps: [{ token: i1$4.FormBuilder }, { token: i2.IconService }, { token: i1$2.CaseStatusService }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementStatusModalComponent, isStandalone: false, selector: "valtimo-case-management-status-modal", inputs: { type: "type", prefill: "prefill", usedKeys: "usedKeys", caseDefinitionKey: "caseDefinitionKey" }, outputs: { closeModalEvent: "closeModalEvent" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  valtimoCdsModal\n  *ngIf=\"{\n    isAdd: isAdd$ | async,\n    isEdit: isEdit$ | async,\n    isClosed: isClosed$ | async,\n    editingKey: editingKey$ | async,\n    disabled: disabled$ | async,\n  } as obs\"\n  [open]=\"!obs.isClosed\"\n  size=\"sm\"\n  (close)=\"onClose()\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onClose()\" [cdsLayer]=\"1\">\n    <h3 cdsModalHeaderHeading>\n      {{ obs.isAdd ? ('caseManagement.statuses.add' | translate) : '' }}\n      {{ obs.isEdit ? ('caseManagement.statuses.edit' | translate) : '' }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent [cdsLayer]=\"1\">\n    <ng-container *ngTemplateOutlet=\"statusForm; context: {obs: obs}\"></ng-container>\n  </section>\n\n  <cds-modal-footer [cdsLayer]=\"1\">\n    <ng-container *ngTemplateOutlet=\"buttons; context: {obs: obs}\"></ng-container>\n  </cds-modal-footer>\n</cds-modal>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <div class=\"dropdown-color-tag\">\n    <cds-tag *ngIf=\"item && item.content\" class=\"cds-tag--no-margin\" [type]=\"item?.tagType\">\n      {{ 'interface.tagType.' + item?.tagType | translate }}\n    </cds-tag>\n  </div>\n</ng-template>\n\n<ng-template #statusForm let-obs=\"obs\">\n  <form [formGroup]=\"statusFormGroup\" class=\"status-form\">\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.title' | translate }}\n\n      <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.titleInput\" [attr.modal-primary-focus]=\"true\" />\n    </cds-label>\n\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.label' | translate }}\n\n      <input cdsText formControlName=\"label\" [attr.data-test-id]=\"testIds.labelInput\" />\n    </cds-label>\n\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.key' | translate }}\n\n      <div class=\"edit-key-input\">\n        <input\n          cdsText\n          formControlName=\"key\"\n          [attr.data-test-id]=\"testIds.keyInput\"\n          [readOnly]=\"!obs.editingKey\"\n          [placeholder]=\"\n            obs.isAdd && !obs.editingKey\n              ? ('caseManagement.statuses.keyAutoGenerated' | translate)\n              : ''\n          \"\n        />\n\n        <cds-icon-button\n          *ngIf=\"!obs.editingKey && obs.isAdd\"\n          [attr.data-test-id]=\"testIds.editKeyButton\"\n          [disabled]=\"obs.disabled\"\n          (click)=\"editKeyButtonClick()\"\n          kind=\"secondary\"\n        >\n          <svg class=\"cds--btn__icon\" cdsIcon=\"edit\" size=\"16\"></svg>\n        </cds-icon-button>\n      </div>\n    </cds-label>\n\n    <div class=\"horizontal-inputs\">\n      <cds-label>\n        {{ 'caseManagement.statuses.columns.color' | translate }}\n\n        <cds-dropdown\n          [id]=\"'status-color-dropdown'\"\n          [attr.data-test-id]=\"testIds.colorDropdown\"\n          [appendInline]=\"false\"\n          [placeholder]=\"'caseManagement.statuses.colorPlaceholder' | translate\"\n          (selected)=\"colorDropdownChange($event)\"\n        >\n          <cds-dropdown-list [items]=\"colorListItems$\" [listTpl]=\"colorDropdownItemTemplate\">\n          </cds-dropdown-list>\n        </cds-dropdown>\n      </cds-label>\n\n      <cds-toggle\n        [attr.data-test-id]=\"testIds.visibilityToggle\"\n        [label]=\"'caseManagement.statuses.visibleTitle' | translate\"\n        [onText]=\"'caseManagement.statuses.visible' | translate\"\n        [offText]=\"'caseManagement.statuses.invisible' | translate\"\n        [disabled]=\"obs.disabled\"\n        [checked]=\"visibleInCaseListByDefault?.value\"\n        (checkedChange)=\"toggleCheckedChange($event)\"\n      ></cds-toggle>\n    </div>\n\n    <cds-toggle\n      [label]=\"'caseManagement.statuses.showRetentionPeriod' | translate\"\n      [onText]=\"'interface.yes' | translate\"\n      [offText]=\"'interface.no' | translate\"\n      [disabled]=\"obs.disabled\"\n      [checked]=\"showRetentionPeriod$ | async\"\n      (checkedChange)=\"toggleRetentionPeriod($event)\"\n    ></cds-toggle>\n\n    <cds-label class=\"status-form-retention-period__label\" *ngIf=\"showRetentionPeriod$ | async\">\n      <div>\n        {{ 'caseManagement.statuses.columns.retentionPeriod' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'caseManagement.statuses.columns.retentionPeriodTooltip' | translate\"\n        ></v-tooltip-icon>\n      </div>\n\n      <input cdsText formControlName=\"retentionPeriodInDays\" />\n    </cds-label>\n\n    <cds-notification\n      class=\"deployment-warning-notification\"\n      *ngIf=\"!obs.editingKey && !obs.isAdd\"\n      [notificationObj]=\"{\n        type: 'warning',\n        message:\n          ('caseManagement.statuses.retentionPeriodExistingCasesWarning'\n          | translate: notificationContent),\n        showClose: false,\n        lowContrast: true,\n      }\"\n    ></cds-notification>\n  </form>\n</ng-template>\n\n<ng-template #buttons let-obs=\"obs\">\n  <button cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"onClose()\" [disabled]=\"obs.disabled\">\n    {{ 'interface.cancel' | translate }}\n  </button>\n\n  <button\n    *ngIf=\"obs.isAdd\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.addConfirmButton\"\n    [disabled]=\"invalid || pristine || obs.disabled\"\n    (click)=\"addStatus()\"\n  >\n    {{ 'interface.add' | translate }}\n  </button>\n\n  <button\n    *ngIf=\"obs.isEdit\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.saveButton\"\n    [disabled]=\"invalid || pristine || obs.disabled\"\n    (click)=\"editStatus()\"\n  >\n    {{ 'interface.save' | translate }}\n  </button>\n</ng-template>\n", styles: [".status-form{display:flex;flex-direction:column;gap:16px}::ng-deep .status-form-retention-period__label .cds--text-input__field-wrapper{flex-direction:column;gap:8px}::ng-deep .status-form-retention-period__label .cds--text-input__field-wrapper div{display:flex;align-items:center}.edit-key-input{height:40px;display:flex;width:100%;flex-direction:row;gap:16px;align-items:flex-end}.edit-key-input input:read-only{color:var(--cds-text-disabled)}::ng-deep .horizontal-inputs{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}::ng-deep .horizontal-inputs .cds--label{width:100%;display:flex;flex-direction:column;gap:8px}::ng-deep .dropdown-color-tag .cds--tag{margin-top:-4px;margin-left:2px}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i2.Notification, selector: "cds-notification, cds-inline-notification, ibm-notification, ibm-inline-notification", inputs: ["notificationObj"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "component", type: i7.TooltipIconComponent, selector: "v-tooltip-icon", inputs: ["tooltip", "disabled"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: i2.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementStatusModalComponent, isStandalone: false, selector: "valtimo-case-management-status-modal", inputs: { type: "type", prefill: "prefill", usedKeys: "usedKeys", caseDefinitionKey: "caseDefinitionKey" }, outputs: { closeModalEvent: "closeModalEvent" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  valtimoCdsModal\n  *ngIf=\"{\n    isAdd: isAdd$ | async,\n    isEdit: isEdit$ | async,\n    isClosed: isClosed$ | async,\n    editingKey: editingKey$ | async,\n    disabled: disabled$ | async,\n  } as obs\"\n  [open]=\"!obs.isClosed\"\n  size=\"sm\"\n  (close)=\"onClose()\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onClose()\" [cdsLayer]=\"1\">\n    <h3 cdsModalHeaderHeading>\n      {{ obs.isAdd ? ('caseManagement.statuses.add' | translate) : '' }}\n      {{ obs.isEdit ? ('caseManagement.statuses.edit' | translate) : '' }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent [cdsLayer]=\"1\">\n    <ng-container *ngTemplateOutlet=\"statusForm; context: {obs: obs}\"></ng-container>\n  </section>\n\n  <cds-modal-footer [cdsLayer]=\"1\">\n    <ng-container *ngTemplateOutlet=\"buttons; context: {obs: obs}\"></ng-container>\n  </cds-modal-footer>\n</cds-modal>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <div class=\"dropdown-color-tag\">\n    <cds-tag *ngIf=\"item && item.content\" class=\"cds-tag--no-margin\" [type]=\"item?.tagType\">\n      {{ 'interface.tagType.' + item?.tagType | translate }}\n    </cds-tag>\n  </div>\n</ng-template>\n\n<ng-template #statusForm let-obs=\"obs\">\n  <form [formGroup]=\"statusFormGroup\" class=\"status-form\">\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.title' | translate }}\n\n      <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.titleInput\" [attr.modal-primary-focus]=\"true\" />\n    </cds-label>\n\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.label' | translate }}\n\n      <input cdsText formControlName=\"label\" [attr.data-test-id]=\"testIds.labelInput\" />\n    </cds-label>\n\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.key' | translate }}\n\n      <div class=\"edit-key-input\">\n        <input\n          cdsText\n          formControlName=\"key\"\n          [attr.data-test-id]=\"testIds.keyInput\"\n          [readOnly]=\"!obs.editingKey\"\n          [placeholder]=\"\n            obs.isAdd && !obs.editingKey\n              ? ('caseManagement.statuses.keyAutoGenerated' | translate)\n              : ''\n          \"\n        />\n\n        <cds-icon-button\n          *ngIf=\"!obs.editingKey && obs.isAdd\"\n          [attr.data-test-id]=\"testIds.editKeyButton\"\n          [disabled]=\"obs.disabled\"\n          (click)=\"editKeyButtonClick()\"\n          kind=\"secondary\"\n        >\n          <svg class=\"cds--btn__icon\" cdsIcon=\"edit\" size=\"16\"></svg>\n        </cds-icon-button>\n      </div>\n    </cds-label>\n\n    <div class=\"horizontal-inputs\">\n      <cds-label>\n        {{ 'caseManagement.statuses.columns.color' | translate }}\n\n        <cds-dropdown\n          [id]=\"'status-color-dropdown'\"\n          [attr.data-test-id]=\"testIds.colorDropdown\"\n          [appendInline]=\"false\"\n          [placeholder]=\"'caseManagement.statuses.colorPlaceholder' | translate\"\n          (selected)=\"colorDropdownChange($event)\"\n        >\n          <cds-dropdown-list [items]=\"colorListItems$\" [listTpl]=\"colorDropdownItemTemplate\">\n          </cds-dropdown-list>\n        </cds-dropdown>\n      </cds-label>\n\n      <cds-toggle\n        [attr.data-test-id]=\"testIds.visibilityToggle\"\n        [label]=\"'caseManagement.statuses.visibleTitle' | translate\"\n        [onText]=\"'caseManagement.statuses.visible' | translate\"\n        [offText]=\"'caseManagement.statuses.invisible' | translate\"\n        [disabled]=\"obs.disabled\"\n        [checked]=\"visibleInCaseListByDefault?.value\"\n        (checkedChange)=\"toggleCheckedChange($event)\"\n      ></cds-toggle>\n    </div>\n\n    <cds-toggle\n      [label]=\"'caseManagement.statuses.showRetentionPeriod' | translate\"\n      [onText]=\"'interface.yes' | translate\"\n      [offText]=\"'interface.no' | translate\"\n      [disabled]=\"obs.disabled\"\n      [checked]=\"showRetentionPeriod$ | async\"\n      (checkedChange)=\"toggleRetentionPeriod($event)\"\n    ></cds-toggle>\n\n    <cds-label class=\"status-form-retention-period__label\" *ngIf=\"showRetentionPeriod$ | async\">\n      <div>\n        {{ 'caseManagement.statuses.columns.retentionPeriod' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'caseManagement.statuses.columns.retentionPeriodTooltip' | translate\"\n        ></v-tooltip-icon>\n      </div>\n\n      <input cdsText formControlName=\"retentionPeriodInDays\" />\n    </cds-label>\n\n    <cds-notification\n      class=\"deployment-warning-notification\"\n      *ngIf=\"!obs.editingKey && !obs.isAdd\"\n      [notificationObj]=\"{\n        type: 'warning',\n        message:\n          ('caseManagement.statuses.retentionPeriodExistingCasesWarning'\n          | translate: notificationContent),\n        showClose: false,\n        lowContrast: true,\n      }\"\n    ></cds-notification>\n  </form>\n</ng-template>\n\n<ng-template #buttons let-obs=\"obs\">\n  <button cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"onClose()\" [disabled]=\"obs.disabled\">\n    {{ 'interface.cancel' | translate }}\n  </button>\n\n  <button\n    *ngIf=\"obs.isAdd\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.addConfirmButton\"\n    [disabled]=\"invalid || pristine || obs.disabled\"\n    (click)=\"addStatus()\"\n  >\n    {{ 'interface.create' | translate }}\n  </button>\n\n  <button\n    *ngIf=\"obs.isEdit\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.saveButton\"\n    [disabled]=\"invalid || pristine || obs.disabled\"\n    (click)=\"editStatus()\"\n  >\n    {{ 'interface.save' | translate }}\n  </button>\n</ng-template>\n", styles: [".status-form{display:flex;flex-direction:column;gap:16px}::ng-deep .status-form-retention-period__label .cds--text-input__field-wrapper{flex-direction:column;gap:8px}::ng-deep .status-form-retention-period__label .cds--text-input__field-wrapper div{display:flex;align-items:center}.edit-key-input{height:40px;display:flex;width:100%;flex-direction:row;gap:16px;align-items:flex-end}.edit-key-input input:read-only{color:var(--cds-text-disabled)}::ng-deep .horizontal-inputs{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}::ng-deep .horizontal-inputs .cds--label{width:100%;display:flex;flex-direction:column;gap:8px}::ng-deep .dropdown-color-tag .cds--tag{margin-top:-4px;margin-left:2px}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i2.Notification, selector: "cds-notification, cds-inline-notification, ibm-notification, ibm-inline-notification", inputs: ["notificationObj"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "component", type: i7.TooltipIconComponent, selector: "v-tooltip-icon", inputs: ["tooltip", "disabled"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: i2.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementStatusModalComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'valtimo-case-management-status-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  valtimoCdsModal\n  *ngIf=\"{\n    isAdd: isAdd$ | async,\n    isEdit: isEdit$ | async,\n    isClosed: isClosed$ | async,\n    editingKey: editingKey$ | async,\n    disabled: disabled$ | async,\n  } as obs\"\n  [open]=\"!obs.isClosed\"\n  size=\"sm\"\n  (close)=\"onClose()\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onClose()\" [cdsLayer]=\"1\">\n    <h3 cdsModalHeaderHeading>\n      {{ obs.isAdd ? ('caseManagement.statuses.add' | translate) : '' }}\n      {{ obs.isEdit ? ('caseManagement.statuses.edit' | translate) : '' }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent [cdsLayer]=\"1\">\n    <ng-container *ngTemplateOutlet=\"statusForm; context: {obs: obs}\"></ng-container>\n  </section>\n\n  <cds-modal-footer [cdsLayer]=\"1\">\n    <ng-container *ngTemplateOutlet=\"buttons; context: {obs: obs}\"></ng-container>\n  </cds-modal-footer>\n</cds-modal>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <div class=\"dropdown-color-tag\">\n    <cds-tag *ngIf=\"item && item.content\" class=\"cds-tag--no-margin\" [type]=\"item?.tagType\">\n      {{ 'interface.tagType.' + item?.tagType | translate }}\n    </cds-tag>\n  </div>\n</ng-template>\n\n<ng-template #statusForm let-obs=\"obs\">\n  <form [formGroup]=\"statusFormGroup\" class=\"status-form\">\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.title' | translate }}\n\n      <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.titleInput\" [attr.modal-primary-focus]=\"true\" />\n    </cds-label>\n\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.label' | translate }}\n\n      <input cdsText formControlName=\"label\" [attr.data-test-id]=\"testIds.labelInput\" />\n    </cds-label>\n\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.key' | translate }}\n\n      <div class=\"edit-key-input\">\n        <input\n          cdsText\n          formControlName=\"key\"\n          [attr.data-test-id]=\"testIds.keyInput\"\n          [readOnly]=\"!obs.editingKey\"\n          [placeholder]=\"\n            obs.isAdd && !obs.editingKey\n              ? ('caseManagement.statuses.keyAutoGenerated' | translate)\n              : ''\n          \"\n        />\n\n        <cds-icon-button\n          *ngIf=\"!obs.editingKey && obs.isAdd\"\n          [attr.data-test-id]=\"testIds.editKeyButton\"\n          [disabled]=\"obs.disabled\"\n          (click)=\"editKeyButtonClick()\"\n          kind=\"secondary\"\n        >\n          <svg class=\"cds--btn__icon\" cdsIcon=\"edit\" size=\"16\"></svg>\n        </cds-icon-button>\n      </div>\n    </cds-label>\n\n    <div class=\"horizontal-inputs\">\n      <cds-label>\n        {{ 'caseManagement.statuses.columns.color' | translate }}\n\n        <cds-dropdown\n          [id]=\"'status-color-dropdown'\"\n          [attr.data-test-id]=\"testIds.colorDropdown\"\n          [appendInline]=\"false\"\n          [placeholder]=\"'caseManagement.statuses.colorPlaceholder' | translate\"\n          (selected)=\"colorDropdownChange($event)\"\n        >\n          <cds-dropdown-list [items]=\"colorListItems$\" [listTpl]=\"colorDropdownItemTemplate\">\n          </cds-dropdown-list>\n        </cds-dropdown>\n      </cds-label>\n\n      <cds-toggle\n        [attr.data-test-id]=\"testIds.visibilityToggle\"\n        [label]=\"'caseManagement.statuses.visibleTitle' | translate\"\n        [onText]=\"'caseManagement.statuses.visible' | translate\"\n        [offText]=\"'caseManagement.statuses.invisible' | translate\"\n        [disabled]=\"obs.disabled\"\n        [checked]=\"visibleInCaseListByDefault?.value\"\n        (checkedChange)=\"toggleCheckedChange($event)\"\n      ></cds-toggle>\n    </div>\n\n    <cds-toggle\n      [label]=\"'caseManagement.statuses.showRetentionPeriod' | translate\"\n      [onText]=\"'interface.yes' | translate\"\n      [offText]=\"'interface.no' | translate\"\n      [disabled]=\"obs.disabled\"\n      [checked]=\"showRetentionPeriod$ | async\"\n      (checkedChange)=\"toggleRetentionPeriod($event)\"\n    ></cds-toggle>\n\n    <cds-label class=\"status-form-retention-period__label\" *ngIf=\"showRetentionPeriod$ | async\">\n      <div>\n        {{ 'caseManagement.statuses.columns.retentionPeriod' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'caseManagement.statuses.columns.retentionPeriodTooltip' | translate\"\n        ></v-tooltip-icon>\n      </div>\n\n      <input cdsText formControlName=\"retentionPeriodInDays\" />\n    </cds-label>\n\n    <cds-notification\n      class=\"deployment-warning-notification\"\n      *ngIf=\"!obs.editingKey && !obs.isAdd\"\n      [notificationObj]=\"{\n        type: 'warning',\n        message:\n          ('caseManagement.statuses.retentionPeriodExistingCasesWarning'\n          | translate: notificationContent),\n        showClose: false,\n        lowContrast: true,\n      }\"\n    ></cds-notification>\n  </form>\n</ng-template>\n\n<ng-template #buttons let-obs=\"obs\">\n  <button cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"onClose()\" [disabled]=\"obs.disabled\">\n    {{ 'interface.cancel' | translate }}\n  </button>\n\n  <button\n    *ngIf=\"obs.isAdd\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.addConfirmButton\"\n    [disabled]=\"invalid || pristine || obs.disabled\"\n    (click)=\"addStatus()\"\n  >\n    {{ 'interface.add' | translate }}\n  </button>\n\n  <button\n    *ngIf=\"obs.isEdit\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.saveButton\"\n    [disabled]=\"invalid || pristine || obs.disabled\"\n    (click)=\"editStatus()\"\n  >\n    {{ 'interface.save' | translate }}\n  </button>\n</ng-template>\n", styles: [".status-form{display:flex;flex-direction:column;gap:16px}::ng-deep .status-form-retention-period__label .cds--text-input__field-wrapper{flex-direction:column;gap:8px}::ng-deep .status-form-retention-period__label .cds--text-input__field-wrapper div{display:flex;align-items:center}.edit-key-input{height:40px;display:flex;width:100%;flex-direction:row;gap:16px;align-items:flex-end}.edit-key-input input:read-only{color:var(--cds-text-disabled)}::ng-deep .horizontal-inputs{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}::ng-deep .horizontal-inputs .cds--label{width:100%;display:flex;flex-direction:column;gap:8px}::ng-deep .dropdown-color-tag .cds--tag{margin-top:-4px;margin-left:2px}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+            args: [{ standalone: false, selector: 'valtimo-case-management-status-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  valtimoCdsModal\n  *ngIf=\"{\n    isAdd: isAdd$ | async,\n    isEdit: isEdit$ | async,\n    isClosed: isClosed$ | async,\n    editingKey: editingKey$ | async,\n    disabled: disabled$ | async,\n  } as obs\"\n  [open]=\"!obs.isClosed\"\n  size=\"sm\"\n  (close)=\"onClose()\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onClose()\" [cdsLayer]=\"1\">\n    <h3 cdsModalHeaderHeading>\n      {{ obs.isAdd ? ('caseManagement.statuses.add' | translate) : '' }}\n      {{ obs.isEdit ? ('caseManagement.statuses.edit' | translate) : '' }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent [cdsLayer]=\"1\">\n    <ng-container *ngTemplateOutlet=\"statusForm; context: {obs: obs}\"></ng-container>\n  </section>\n\n  <cds-modal-footer [cdsLayer]=\"1\">\n    <ng-container *ngTemplateOutlet=\"buttons; context: {obs: obs}\"></ng-container>\n  </cds-modal-footer>\n</cds-modal>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <div class=\"dropdown-color-tag\">\n    <cds-tag *ngIf=\"item && item.content\" class=\"cds-tag--no-margin\" [type]=\"item?.tagType\">\n      {{ 'interface.tagType.' + item?.tagType | translate }}\n    </cds-tag>\n  </div>\n</ng-template>\n\n<ng-template #statusForm let-obs=\"obs\">\n  <form [formGroup]=\"statusFormGroup\" class=\"status-form\">\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.title' | translate }}\n\n      <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.titleInput\" [attr.modal-primary-focus]=\"true\" />\n    </cds-label>\n\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.label' | translate }}\n\n      <input cdsText formControlName=\"label\" [attr.data-test-id]=\"testIds.labelInput\" />\n    </cds-label>\n\n    <cds-label>\n      {{ 'caseManagement.statuses.columns.key' | translate }}\n\n      <div class=\"edit-key-input\">\n        <input\n          cdsText\n          formControlName=\"key\"\n          [attr.data-test-id]=\"testIds.keyInput\"\n          [readOnly]=\"!obs.editingKey\"\n          [placeholder]=\"\n            obs.isAdd && !obs.editingKey\n              ? ('caseManagement.statuses.keyAutoGenerated' | translate)\n              : ''\n          \"\n        />\n\n        <cds-icon-button\n          *ngIf=\"!obs.editingKey && obs.isAdd\"\n          [attr.data-test-id]=\"testIds.editKeyButton\"\n          [disabled]=\"obs.disabled\"\n          (click)=\"editKeyButtonClick()\"\n          kind=\"secondary\"\n        >\n          <svg class=\"cds--btn__icon\" cdsIcon=\"edit\" size=\"16\"></svg>\n        </cds-icon-button>\n      </div>\n    </cds-label>\n\n    <div class=\"horizontal-inputs\">\n      <cds-label>\n        {{ 'caseManagement.statuses.columns.color' | translate }}\n\n        <cds-dropdown\n          [id]=\"'status-color-dropdown'\"\n          [attr.data-test-id]=\"testIds.colorDropdown\"\n          [appendInline]=\"false\"\n          [placeholder]=\"'caseManagement.statuses.colorPlaceholder' | translate\"\n          (selected)=\"colorDropdownChange($event)\"\n        >\n          <cds-dropdown-list [items]=\"colorListItems$\" [listTpl]=\"colorDropdownItemTemplate\">\n          </cds-dropdown-list>\n        </cds-dropdown>\n      </cds-label>\n\n      <cds-toggle\n        [attr.data-test-id]=\"testIds.visibilityToggle\"\n        [label]=\"'caseManagement.statuses.visibleTitle' | translate\"\n        [onText]=\"'caseManagement.statuses.visible' | translate\"\n        [offText]=\"'caseManagement.statuses.invisible' | translate\"\n        [disabled]=\"obs.disabled\"\n        [checked]=\"visibleInCaseListByDefault?.value\"\n        (checkedChange)=\"toggleCheckedChange($event)\"\n      ></cds-toggle>\n    </div>\n\n    <cds-toggle\n      [label]=\"'caseManagement.statuses.showRetentionPeriod' | translate\"\n      [onText]=\"'interface.yes' | translate\"\n      [offText]=\"'interface.no' | translate\"\n      [disabled]=\"obs.disabled\"\n      [checked]=\"showRetentionPeriod$ | async\"\n      (checkedChange)=\"toggleRetentionPeriod($event)\"\n    ></cds-toggle>\n\n    <cds-label class=\"status-form-retention-period__label\" *ngIf=\"showRetentionPeriod$ | async\">\n      <div>\n        {{ 'caseManagement.statuses.columns.retentionPeriod' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'caseManagement.statuses.columns.retentionPeriodTooltip' | translate\"\n        ></v-tooltip-icon>\n      </div>\n\n      <input cdsText formControlName=\"retentionPeriodInDays\" />\n    </cds-label>\n\n    <cds-notification\n      class=\"deployment-warning-notification\"\n      *ngIf=\"!obs.editingKey && !obs.isAdd\"\n      [notificationObj]=\"{\n        type: 'warning',\n        message:\n          ('caseManagement.statuses.retentionPeriodExistingCasesWarning'\n          | translate: notificationContent),\n        showClose: false,\n        lowContrast: true,\n      }\"\n    ></cds-notification>\n  </form>\n</ng-template>\n\n<ng-template #buttons let-obs=\"obs\">\n  <button cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"onClose()\" [disabled]=\"obs.disabled\">\n    {{ 'interface.cancel' | translate }}\n  </button>\n\n  <button\n    *ngIf=\"obs.isAdd\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.addConfirmButton\"\n    [disabled]=\"invalid || pristine || obs.disabled\"\n    (click)=\"addStatus()\"\n  >\n    {{ 'interface.create' | translate }}\n  </button>\n\n  <button\n    *ngIf=\"obs.isEdit\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.saveButton\"\n    [disabled]=\"invalid || pristine || obs.disabled\"\n    (click)=\"editStatus()\"\n  >\n    {{ 'interface.save' | translate }}\n  </button>\n</ng-template>\n", styles: [".status-form{display:flex;flex-direction:column;gap:16px}::ng-deep .status-form-retention-period__label .cds--text-input__field-wrapper{flex-direction:column;gap:8px}::ng-deep .status-form-retention-period__label .cds--text-input__field-wrapper div{display:flex;align-items:center}.edit-key-input{height:40px;display:flex;width:100%;flex-direction:row;gap:16px;align-items:flex-end}.edit-key-input input:read-only{color:var(--cds-text-disabled)}::ng-deep .horizontal-inputs{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}::ng-deep .horizontal-inputs .cds--label{width:100%;display:flex;flex-direction:column;gap:8px}::ng-deep .dropdown-color-tag .cds--tag{margin-top:-4px;margin-left:2px}\n/*!\n * Copyright 2015-2025 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: () => [{ type: i1$4.FormBuilder }, { type: i2.IconService }, { type: i1$2.CaseStatusService }, { type: i3.TranslateService }], propDecorators: { type: [{
                 type: Input
             }], prefill: [{
@@ -1993,7 +1993,7 @@ class CaseManagementStatusesComponent {
         ]);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementStatusesComponent, deps: [{ token: i1$2.CaseStatusService }, { token: i2$2.ActivatedRoute }, { token: i2$1.EnvironmentService }, { token: i2$1.EditPermissionsService }, { token: CaseManagementService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CaseManagementStatusesComponent, isStandalone: false, selector: "valtimo-case-management-statuses", viewQueries: [{ propertyName: "colorColumnTemplate", first: true, predicate: ["colorColumnTemplate"], descendants: true }, { propertyName: "retentionPeriodColumnTemplate", first: true, predicate: ["retentionPeriodColumnTemplate"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-carbon-list\n  *ngIf=\"{\n    loading: loading$ | async,\n    caseStatuses: caseStatuses$ | async,\n    isDraftVersion: isDraftVersion$ | async,\n  } as obs\"\n  [items]=\"obs.caseStatuses\"\n  [fields]=\"fields$ | async\"\n  [header]=\"false\"\n  [loading]=\"obs.loading\"\n  [dragAndDrop]=\"true\"\n  [dragAndDropDisabled]=\"obs.loading || !(hasEditPermissions$ | async)\"\n  [actionItems]=\"ACTION_ITEMS\"\n  (rowClicked)=\"openEditModal($event)\"\n  (itemsReordered)=\"onItemsReordered($event)\"\n>\n  <ng-container carbonToolbarContent *ngTemplateOutlet=\"addStatusButton\"></ng-container>\n\n  <valtimo-no-results\n    [action]=\"addStatusButton\"\n    [description]=\"\n      obs.isDraftVersion\n        ? ('caseManagement.statuses.noResults.description' | translate)\n        : ('caseManagement.statuses.noResultsFinalVersion.description' | translate)\n    \"\n    [title]=\"'caseManagement.statuses.noResults.title' | translate\"\n  ></valtimo-no-results>\n</valtimo-carbon-list>\n\n<valtimo-case-management-status-modal\n  [type]=\"statusModalType$ | async\"\n  [prefill]=\"prefillStatus$ | async\"\n  [usedKeys]=\"usedKeys$ | async\"\n  [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n  (closeModalEvent)=\"closeModal($event)\"\n></valtimo-case-management-status-modal>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"caseManagement.statuses.deleteText\"\n  [outputOnConfirm]=\"statusToDelete$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"interface.delete\"\n  (confirmEvent)=\"confirmDeleteStatus($event)\"\n></valtimo-confirmation-modal>\n\n<ng-template #addStatusButton>\n  <button\n    *ngIf=\"hasEditPermissions$ | async\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.addButton\"\n    [disabled]=\"loading$ | async\"\n    (click)=\"openAddModal()\"\n  >\n    {{ 'caseManagement.statuses.add' | translate }}\n\n    <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n  </button>\n</ng-template>\n\n<ng-template #colorColumnTemplate let-data=\"data\">\n  <cds-tag class=\"cds-tag--no-margin\" [type]=\"data?.item?.tagType\">\n    {{ 'interface.tagType.' + data?.item?.tagType | translate }}\n  </cds-tag>\n</ng-template>\n\n<ng-template #retentionPeriodColumnTemplate let-data=\"data\">\n  @if (data?.item?.retentionPeriodInDays === 0) {\n    {{ 'caseManagement.statuses.columns.deletedImmediately' | translate }}\n  } @else if (data?.item?.retentionPeriodInDays === -1 ) {\n    {{ '-' }}\n  } @else {\n    {{ data?.item?.retentionPeriodInDays }}\n  }\n</ng-template>\n", styles: ["::ng-deep .cds-tag--no-margin{margin:0}.loading-spinner{margin:16px 12px 12px}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: CaseManagementStatusModalComponent, selector: "valtimo-case-management-status-modal", inputs: ["type", "prefill", "usedKeys", "caseDefinitionKey"], outputs: ["closeModalEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CaseManagementStatusesComponent, isStandalone: false, selector: "valtimo-case-management-statuses", viewQueries: [{ propertyName: "colorColumnTemplate", first: true, predicate: ["colorColumnTemplate"], descendants: true }, { propertyName: "retentionPeriodColumnTemplate", first: true, predicate: ["retentionPeriodColumnTemplate"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-carbon-list\n  *ngIf=\"{\n    loading: loading$ | async,\n    caseStatuses: caseStatuses$ | async,\n    isDraftVersion: isDraftVersion$ | async,\n  } as obs\"\n  [items]=\"obs.caseStatuses\"\n  [fields]=\"fields$ | async\"\n  [header]=\"false\"\n  [loading]=\"obs.loading\"\n  [dragAndDrop]=\"true\"\n  [dragAndDropDisabled]=\"obs.loading || !(hasEditPermissions$ | async)\"\n  [actionItems]=\"ACTION_ITEMS\"\n  (rowClicked)=\"openEditModal($event)\"\n  (itemsReordered)=\"onItemsReordered($event)\"\n>\n  <ng-container carbonToolbarContent *ngTemplateOutlet=\"addStatusButton\"></ng-container>\n\n  <valtimo-no-results\n    [action]=\"addStatusButton\"\n    [description]=\"\n      obs.isDraftVersion\n        ? ('caseManagement.statuses.noResults.description' | translate)\n        : ('caseManagement.statuses.noResultsFinalVersion.description' | translate)\n    \"\n    [title]=\"'caseManagement.statuses.noResults.title' | translate\"\n  ></valtimo-no-results>\n</valtimo-carbon-list>\n\n<valtimo-case-management-status-modal\n  [type]=\"statusModalType$ | async\"\n  [prefill]=\"prefillStatus$ | async\"\n  [usedKeys]=\"usedKeys$ | async\"\n  [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n  (closeModalEvent)=\"closeModal($event)\"\n></valtimo-case-management-status-modal>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"caseManagement.statuses.deleteText\"\n  [outputOnConfirm]=\"statusToDelete$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"interface.delete\"\n  (confirmEvent)=\"confirmDeleteStatus($event)\"\n></valtimo-confirmation-modal>\n\n<ng-template #addStatusButton>\n  <button\n    *ngIf=\"hasEditPermissions$ | async\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.addButton\"\n    [disabled]=\"loading$ | async\"\n    (click)=\"openAddModal()\"\n  >\n    {{ 'caseManagement.statuses.add' | translate }}\n\n    <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n  </button>\n</ng-template>\n\n<ng-template #colorColumnTemplate let-data=\"data\">\n  <cds-tag class=\"cds-tag--no-margin\" [type]=\"data?.item?.tagType\">\n    {{ 'interface.tagType.' + data?.item?.tagType | translate }}\n  </cds-tag>\n</ng-template>\n\n<ng-template #retentionPeriodColumnTemplate let-data=\"data\">\n  @if (data?.item?.retentionPeriodInDays === 0) {\n    {{ 'caseManagement.statuses.columns.deletedImmediately' | translate }}\n  } @else if (data?.item?.retentionPeriodInDays === -1 ) {\n    {{ '-' }}\n  } @else {\n    {{ data?.item?.retentionPeriodInDays }}\n  }\n</ng-template>\n", styles: ["::ng-deep .cds-tag--no-margin{margin:0}.loading-spinner{margin:16px 12px 12px}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: CaseManagementStatusModalComponent, selector: "valtimo-case-management-status-modal", inputs: ["type", "prefill", "usedKeys", "caseDefinitionKey"], outputs: ["closeModalEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementStatusesComponent, decorators: [{
             type: Component,
@@ -2243,11 +2243,11 @@ class CaseManagementTagsModalComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementTagsModalComponent, deps: [{ token: i1$4.FormBuilder }, { token: i2.IconService }, { token: i3.TranslateService }, { token: i1$2.CaseTagService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementTagsModalComponent, isStandalone: false, selector: "valtimo-case-management-tags-modal", inputs: { type: "type", prefill: "prefill", usedKeys: "usedKeys", caseDefinitionKey: "caseDefinitionKey", caseDefinitionVersionTag: "caseDefinitionVersionTag" }, outputs: { closeModalEvent: "closeModalEvent" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  valtimoCdsModal\n  *ngIf=\"{\n    isAdd: isAdd$ | async,\n    isEdit: isEdit$ | async,\n    isClosed: isClosed$ | async,\n    editingKey: editingKey$ | async,\n    disabled: disabled$ | async,\n  } as obs\"\n  [open]=\"!obs.isClosed\"\n  size=\"sm\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"close()\">\n    <h3 cdsModalHeaderHeading>\n      {{ obs.isEdit ? ('caseManagement.caseTags.edit' | translate) : '' }}\n      {{ obs.isAdd ? ('caseManagement.caseTags.add' | translate) : '' }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent [cdsLayer]=\"1\">\n    <form [formGroup]=\"caseTagFormGroup\" class=\"case-tag-form\">\n      <cds-label>\n        {{ 'caseManagement.caseTags.columns.title' | translate }}\n        <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.titleInput\" [attr.modal-primary-focus]=\"true\" />\n      </cds-label>\n\n      <cds-label>\n        {{ 'caseManagement.caseTags.columns.key' | translate }}\n        <div class=\"edit-key-input\">\n          <input\n            cdsText\n            formControlName=\"key\"\n            [attr.data-test-id]=\"testIds.keyInput\"\n            [readOnly]=\"!obs.editingKey\"\n            [placeholder]=\"\n              obs.isAdd && !obs.editingKey\n                ? ('caseManagement.caseTags.keyAutoGenerated' | translate)\n                : ''\n            \"\n          />\n          <cds-icon-button\n            *ngIf=\"!obs.editingKey && obs.isAdd\"\n            [attr.data-test-id]=\"testIds.editKeyButton\"\n            [disabled]=\"obs.disabled\"\n            (click)=\"editKeyButtonClick()\"\n            kind=\"secondary\"\n          >\n            <svg class=\"cds--btn__icon\" cdsIcon=\"edit\" size=\"16\"></svg>\n          </cds-icon-button>\n        </div>\n      </cds-label>\n\n      <div class=\"horizontal-inputs\">\n        <cds-label>\n          {{ 'caseManagement.caseTags.columns.color' | translate }}\n          <cds-dropdown\n            id=\"status-color-dropdown\"\n            [attr.data-test-id]=\"testIds.colorDropdown\"\n            [appendInline]=\"false\"\n            [placeholder]=\"'caseManagement.caseTags.colorPlaceholder' | translate\"\n            (selected)=\"colorDropdownChange($event)\"\n          >\n            <cds-dropdown-list\n              [items]=\"colorListItems$\"\n              [listTpl]=\"colorDropdownItemTemplate\"\n            ></cds-dropdown-list>\n          </cds-dropdown>\n        </cds-label>\n      </div>\n    </form>\n  </section>\n\n  <cds-modal-footer>\n    <button cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"close()\" [disabled]=\"obs.disabled\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"obs.isAdd\"\n      cdsButton=\"primary\"\n      [attr.data-test-id]=\"testIds.addConfirmButton\"\n      [disabled]=\"invalid || pristine || obs.disabled\"\n      (click)=\"addCaseTag()\"\n    >\n      {{ 'interface.add' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"obs.isEdit\"\n      cdsButton=\"primary\"\n      [attr.data-test-id]=\"testIds.saveButton\"\n      [disabled]=\"invalid || pristine || obs.disabled\"\n      (click)=\"editCaseTag()\"\n    >\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <cds-tag\n    *ngIf=\"item && item.content\"\n    class=\"cds-tag--no-margin case-tag-margins\"\n    [type]=\"item?.tagType\"\n  >\n    {{ 'interface.tagType.' + item?.tagType | translate }}\n  </cds-tag>\n</ng-template>\n", styles: [".case-tag-form{display:flex;flex-direction:column;gap:16px}.edit-key-input{height:40px;display:flex;width:100%;flex-direction:row;gap:16px;align-items:flex-end}.edit-key-input input:read-only{color:var(--cds-text-disabled)}::ng-deep .horizontal-inputs{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}::ng-deep .horizontal-inputs .cds--label{width:100%;display:flex;flex-direction:column;gap:8px}.case-tag-margins{margin-top:-4px;margin-left:2px}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementTagsModalComponent, isStandalone: false, selector: "valtimo-case-management-tags-modal", inputs: { type: "type", prefill: "prefill", usedKeys: "usedKeys", caseDefinitionKey: "caseDefinitionKey", caseDefinitionVersionTag: "caseDefinitionVersionTag" }, outputs: { closeModalEvent: "closeModalEvent" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  valtimoCdsModal\n  *ngIf=\"{\n    isAdd: isAdd$ | async,\n    isEdit: isEdit$ | async,\n    isClosed: isClosed$ | async,\n    editingKey: editingKey$ | async,\n    disabled: disabled$ | async,\n  } as obs\"\n  [open]=\"!obs.isClosed\"\n  size=\"sm\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"close()\">\n    <h3 cdsModalHeaderHeading>\n      {{ obs.isEdit ? ('caseManagement.caseTags.edit' | translate) : '' }}\n      {{ obs.isAdd ? ('caseManagement.caseTags.add' | translate) : '' }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent [cdsLayer]=\"1\">\n    <form [formGroup]=\"caseTagFormGroup\" class=\"case-tag-form\">\n      <cds-label>\n        {{ 'caseManagement.caseTags.columns.title' | translate }}\n        <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.titleInput\" [attr.modal-primary-focus]=\"true\" />\n      </cds-label>\n\n      <cds-label>\n        {{ 'caseManagement.caseTags.columns.key' | translate }}\n        <div class=\"edit-key-input\">\n          <input\n            cdsText\n            formControlName=\"key\"\n            [attr.data-test-id]=\"testIds.keyInput\"\n            [readOnly]=\"!obs.editingKey\"\n            [placeholder]=\"\n              obs.isAdd && !obs.editingKey\n                ? ('caseManagement.caseTags.keyAutoGenerated' | translate)\n                : ''\n            \"\n          />\n          <cds-icon-button\n            *ngIf=\"!obs.editingKey && obs.isAdd\"\n            [attr.data-test-id]=\"testIds.editKeyButton\"\n            [disabled]=\"obs.disabled\"\n            (click)=\"editKeyButtonClick()\"\n            kind=\"secondary\"\n          >\n            <svg class=\"cds--btn__icon\" cdsIcon=\"edit\" size=\"16\"></svg>\n          </cds-icon-button>\n        </div>\n      </cds-label>\n\n      <div class=\"horizontal-inputs\">\n        <cds-label>\n          {{ 'caseManagement.caseTags.columns.color' | translate }}\n          <cds-dropdown\n            id=\"status-color-dropdown\"\n            [attr.data-test-id]=\"testIds.colorDropdown\"\n            [appendInline]=\"false\"\n            [placeholder]=\"'caseManagement.caseTags.colorPlaceholder' | translate\"\n            (selected)=\"colorDropdownChange($event)\"\n          >\n            <cds-dropdown-list\n              [items]=\"colorListItems$\"\n              [listTpl]=\"colorDropdownItemTemplate\"\n            ></cds-dropdown-list>\n          </cds-dropdown>\n        </cds-label>\n      </div>\n    </form>\n  </section>\n\n  <cds-modal-footer>\n    <button cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"close()\" [disabled]=\"obs.disabled\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"obs.isAdd\"\n      cdsButton=\"primary\"\n      [attr.data-test-id]=\"testIds.addConfirmButton\"\n      [disabled]=\"invalid || pristine || obs.disabled\"\n      (click)=\"addCaseTag()\"\n    >\n      {{ 'interface.create' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"obs.isEdit\"\n      cdsButton=\"primary\"\n      [attr.data-test-id]=\"testIds.saveButton\"\n      [disabled]=\"invalid || pristine || obs.disabled\"\n      (click)=\"editCaseTag()\"\n    >\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <cds-tag\n    *ngIf=\"item && item.content\"\n    class=\"cds-tag--no-margin case-tag-margins\"\n    [type]=\"item?.tagType\"\n  >\n    {{ 'interface.tagType.' + item?.tagType | translate }}\n  </cds-tag>\n</ng-template>\n", styles: [".case-tag-form{display:flex;flex-direction:column;gap:16px}.edit-key-input{height:40px;display:flex;width:100%;flex-direction:row;gap:16px;align-items:flex-end}.edit-key-input input:read-only{color:var(--cds-text-disabled)}::ng-deep .horizontal-inputs{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}::ng-deep .horizontal-inputs .cds--label{width:100%;display:flex;flex-direction:column;gap:8px}.case-tag-margins{margin-top:-4px;margin-left:2px}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementTagsModalComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'valtimo-case-management-tags-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  valtimoCdsModal\n  *ngIf=\"{\n    isAdd: isAdd$ | async,\n    isEdit: isEdit$ | async,\n    isClosed: isClosed$ | async,\n    editingKey: editingKey$ | async,\n    disabled: disabled$ | async,\n  } as obs\"\n  [open]=\"!obs.isClosed\"\n  size=\"sm\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"close()\">\n    <h3 cdsModalHeaderHeading>\n      {{ obs.isEdit ? ('caseManagement.caseTags.edit' | translate) : '' }}\n      {{ obs.isAdd ? ('caseManagement.caseTags.add' | translate) : '' }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent [cdsLayer]=\"1\">\n    <form [formGroup]=\"caseTagFormGroup\" class=\"case-tag-form\">\n      <cds-label>\n        {{ 'caseManagement.caseTags.columns.title' | translate }}\n        <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.titleInput\" [attr.modal-primary-focus]=\"true\" />\n      </cds-label>\n\n      <cds-label>\n        {{ 'caseManagement.caseTags.columns.key' | translate }}\n        <div class=\"edit-key-input\">\n          <input\n            cdsText\n            formControlName=\"key\"\n            [attr.data-test-id]=\"testIds.keyInput\"\n            [readOnly]=\"!obs.editingKey\"\n            [placeholder]=\"\n              obs.isAdd && !obs.editingKey\n                ? ('caseManagement.caseTags.keyAutoGenerated' | translate)\n                : ''\n            \"\n          />\n          <cds-icon-button\n            *ngIf=\"!obs.editingKey && obs.isAdd\"\n            [attr.data-test-id]=\"testIds.editKeyButton\"\n            [disabled]=\"obs.disabled\"\n            (click)=\"editKeyButtonClick()\"\n            kind=\"secondary\"\n          >\n            <svg class=\"cds--btn__icon\" cdsIcon=\"edit\" size=\"16\"></svg>\n          </cds-icon-button>\n        </div>\n      </cds-label>\n\n      <div class=\"horizontal-inputs\">\n        <cds-label>\n          {{ 'caseManagement.caseTags.columns.color' | translate }}\n          <cds-dropdown\n            id=\"status-color-dropdown\"\n            [attr.data-test-id]=\"testIds.colorDropdown\"\n            [appendInline]=\"false\"\n            [placeholder]=\"'caseManagement.caseTags.colorPlaceholder' | translate\"\n            (selected)=\"colorDropdownChange($event)\"\n          >\n            <cds-dropdown-list\n              [items]=\"colorListItems$\"\n              [listTpl]=\"colorDropdownItemTemplate\"\n            ></cds-dropdown-list>\n          </cds-dropdown>\n        </cds-label>\n      </div>\n    </form>\n  </section>\n\n  <cds-modal-footer>\n    <button cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"close()\" [disabled]=\"obs.disabled\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"obs.isAdd\"\n      cdsButton=\"primary\"\n      [attr.data-test-id]=\"testIds.addConfirmButton\"\n      [disabled]=\"invalid || pristine || obs.disabled\"\n      (click)=\"addCaseTag()\"\n    >\n      {{ 'interface.add' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"obs.isEdit\"\n      cdsButton=\"primary\"\n      [attr.data-test-id]=\"testIds.saveButton\"\n      [disabled]=\"invalid || pristine || obs.disabled\"\n      (click)=\"editCaseTag()\"\n    >\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <cds-tag\n    *ngIf=\"item && item.content\"\n    class=\"cds-tag--no-margin case-tag-margins\"\n    [type]=\"item?.tagType\"\n  >\n    {{ 'interface.tagType.' + item?.tagType | translate }}\n  </cds-tag>\n</ng-template>\n", styles: [".case-tag-form{display:flex;flex-direction:column;gap:16px}.edit-key-input{height:40px;display:flex;width:100%;flex-direction:row;gap:16px;align-items:flex-end}.edit-key-input input:read-only{color:var(--cds-text-disabled)}::ng-deep .horizontal-inputs{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}::ng-deep .horizontal-inputs .cds--label{width:100%;display:flex;flex-direction:column;gap:8px}.case-tag-margins{margin-top:-4px;margin-left:2px}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+            args: [{ standalone: false, selector: 'valtimo-case-management-tags-modal', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  valtimoCdsModal\n  *ngIf=\"{\n    isAdd: isAdd$ | async,\n    isEdit: isEdit$ | async,\n    isClosed: isClosed$ | async,\n    editingKey: editingKey$ | async,\n    disabled: disabled$ | async,\n  } as obs\"\n  [open]=\"!obs.isClosed\"\n  size=\"sm\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"close()\">\n    <h3 cdsModalHeaderHeading>\n      {{ obs.isEdit ? ('caseManagement.caseTags.edit' | translate) : '' }}\n      {{ obs.isAdd ? ('caseManagement.caseTags.add' | translate) : '' }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent [cdsLayer]=\"1\">\n    <form [formGroup]=\"caseTagFormGroup\" class=\"case-tag-form\">\n      <cds-label>\n        {{ 'caseManagement.caseTags.columns.title' | translate }}\n        <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.titleInput\" [attr.modal-primary-focus]=\"true\" />\n      </cds-label>\n\n      <cds-label>\n        {{ 'caseManagement.caseTags.columns.key' | translate }}\n        <div class=\"edit-key-input\">\n          <input\n            cdsText\n            formControlName=\"key\"\n            [attr.data-test-id]=\"testIds.keyInput\"\n            [readOnly]=\"!obs.editingKey\"\n            [placeholder]=\"\n              obs.isAdd && !obs.editingKey\n                ? ('caseManagement.caseTags.keyAutoGenerated' | translate)\n                : ''\n            \"\n          />\n          <cds-icon-button\n            *ngIf=\"!obs.editingKey && obs.isAdd\"\n            [attr.data-test-id]=\"testIds.editKeyButton\"\n            [disabled]=\"obs.disabled\"\n            (click)=\"editKeyButtonClick()\"\n            kind=\"secondary\"\n          >\n            <svg class=\"cds--btn__icon\" cdsIcon=\"edit\" size=\"16\"></svg>\n          </cds-icon-button>\n        </div>\n      </cds-label>\n\n      <div class=\"horizontal-inputs\">\n        <cds-label>\n          {{ 'caseManagement.caseTags.columns.color' | translate }}\n          <cds-dropdown\n            id=\"status-color-dropdown\"\n            [attr.data-test-id]=\"testIds.colorDropdown\"\n            [appendInline]=\"false\"\n            [placeholder]=\"'caseManagement.caseTags.colorPlaceholder' | translate\"\n            (selected)=\"colorDropdownChange($event)\"\n          >\n            <cds-dropdown-list\n              [items]=\"colorListItems$\"\n              [listTpl]=\"colorDropdownItemTemplate\"\n            ></cds-dropdown-list>\n          </cds-dropdown>\n        </cds-label>\n      </div>\n    </form>\n  </section>\n\n  <cds-modal-footer>\n    <button cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"close()\" [disabled]=\"obs.disabled\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"obs.isAdd\"\n      cdsButton=\"primary\"\n      [attr.data-test-id]=\"testIds.addConfirmButton\"\n      [disabled]=\"invalid || pristine || obs.disabled\"\n      (click)=\"addCaseTag()\"\n    >\n      {{ 'interface.create' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"obs.isEdit\"\n      cdsButton=\"primary\"\n      [attr.data-test-id]=\"testIds.saveButton\"\n      [disabled]=\"invalid || pristine || obs.disabled\"\n      (click)=\"editCaseTag()\"\n    >\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <cds-tag\n    *ngIf=\"item && item.content\"\n    class=\"cds-tag--no-margin case-tag-margins\"\n    [type]=\"item?.tagType\"\n  >\n    {{ 'interface.tagType.' + item?.tagType | translate }}\n  </cds-tag>\n</ng-template>\n", styles: [".case-tag-form{display:flex;flex-direction:column;gap:16px}.edit-key-input{height:40px;display:flex;width:100%;flex-direction:row;gap:16px;align-items:flex-end}.edit-key-input input:read-only{color:var(--cds-text-disabled)}::ng-deep .horizontal-inputs{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}::ng-deep .horizontal-inputs .cds--label{width:100%;display:flex;flex-direction:column;gap:8px}.case-tag-margins{margin-top:-4px;margin-left:2px}\n/*!\n * Copyright 2015-2025 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: () => [{ type: i1$4.FormBuilder }, { type: i2.IconService }, { type: i3.TranslateService }, { type: i1$2.CaseTagService }], propDecorators: { type: [{
                 type: Input
             }], prefill: [{
@@ -2394,7 +2394,7 @@ class CaseManagementTagsComponent {
         ]);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementTagsComponent, deps: [{ token: i1$2.CaseTagService }, { token: i2$2.ActivatedRoute }, { token: i2$1.EditPermissionsService }, { token: CaseManagementService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementTagsComponent, isStandalone: false, selector: "valtimo-case-management-tags", viewQueries: [{ propertyName: "colorColumnTemplate", first: true, predicate: ["colorColumnTemplate"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-carbon-list\n  *ngIf=\"{\n    loading: loading$ | async,\n    caseTags: caseTags$ | async,\n    fields: fields$ | async,\n    isDraftVersion: isDraftVersion$ | async,\n  } as obs\"\n  [items]=\"obs.caseTags\"\n  [fields]=\"obs.fields\"\n  [header]=\"false\"\n  [loading]=\"obs.loading\"\n  [actionItems]=\"ACTION_ITEMS\"\n  [dragAndDrop]=\"true\"\n  [dragAndDropDisabled]=\"!(hasEditPermissions$ | async)\"\n  (itemsReordered)=\"onItemsReorderedEvent($event)\"\n  (rowClicked)=\"openEditModal($event)\"\n>\n  <ng-container carbonToolbarContent *ngTemplateOutlet=\"addTagButton\"></ng-container>\n\n  <valtimo-no-results\n    [action]=\"addTagButton\"\n    [description]=\"\n      obs.isDraftVersion\n        ? ('caseManagement.caseTags.noResults.description' | translate)\n        : ('caseManagement.caseTags.noResultsFinalVersion.description' | translate)\n    \"\n    [title]=\"'caseManagement.caseTags.noResults.title' | translate\"\n  ></valtimo-no-results>\n</valtimo-carbon-list>\n\n<valtimo-case-management-tags-modal\n  [type]=\"statusModalType$ | async\"\n  [prefill]=\"prefillCaseTag$ | async\"\n  [usedKeys]=\"usedKeys$ | async\"\n  [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n  [caseDefinitionVersionTag]=\"caseDefinitionVersionTag$ | async\"\n  (closeModalEvent)=\"closeModal($event)\"\n></valtimo-case-management-tags-modal>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"caseManagement.caseTags.deleteText\"\n  [outputOnConfirm]=\"caseTagToDelete$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"interface.delete\"\n  (confirmEvent)=\"confirmDeleteCaseTag($event)\"\n></valtimo-confirmation-modal>\n\n<ng-template #addTagButton>\n  <button\n    *ngIf=\"hasEditPermissions$ | async\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.addButton\"\n    [disabled]=\"loading$ | async\"\n    (click)=\"openAddModal()\"\n  >\n    {{ 'caseManagement.caseTags.add' | translate }}\n\n    <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n  </button>\n</ng-template>\n\n<ng-template #colorColumnTemplate let-data=\"data\">\n  <cds-tag class=\"cds-tag--no-margin\" [type]=\"data?.item?.tagType\">\n    {{ 'interface.tagType.' + data?.item?.tagType | translate }}\n  </cds-tag>\n</ng-template>\n", styles: ["::ng-deep .cds-tag--no-margin{margin:0}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: CaseManagementTagsModalComponent, selector: "valtimo-case-management-tags-modal", inputs: ["type", "prefill", "usedKeys", "caseDefinitionKey", "caseDefinitionVersionTag"], outputs: ["closeModalEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementTagsComponent, isStandalone: false, selector: "valtimo-case-management-tags", viewQueries: [{ propertyName: "colorColumnTemplate", first: true, predicate: ["colorColumnTemplate"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-carbon-list\n  *ngIf=\"{\n    loading: loading$ | async,\n    caseTags: caseTags$ | async,\n    fields: fields$ | async,\n    isDraftVersion: isDraftVersion$ | async,\n  } as obs\"\n  [items]=\"obs.caseTags\"\n  [fields]=\"obs.fields\"\n  [header]=\"false\"\n  [loading]=\"obs.loading\"\n  [actionItems]=\"ACTION_ITEMS\"\n  [dragAndDrop]=\"true\"\n  [dragAndDropDisabled]=\"!(hasEditPermissions$ | async)\"\n  (itemsReordered)=\"onItemsReorderedEvent($event)\"\n  (rowClicked)=\"openEditModal($event)\"\n>\n  <ng-container carbonToolbarContent *ngTemplateOutlet=\"addTagButton\"></ng-container>\n\n  <valtimo-no-results\n    [action]=\"addTagButton\"\n    [description]=\"\n      obs.isDraftVersion\n        ? ('caseManagement.caseTags.noResults.description' | translate)\n        : ('caseManagement.caseTags.noResultsFinalVersion.description' | translate)\n    \"\n    [title]=\"'caseManagement.caseTags.noResults.title' | translate\"\n  ></valtimo-no-results>\n</valtimo-carbon-list>\n\n<valtimo-case-management-tags-modal\n  [type]=\"statusModalType$ | async\"\n  [prefill]=\"prefillCaseTag$ | async\"\n  [usedKeys]=\"usedKeys$ | async\"\n  [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n  [caseDefinitionVersionTag]=\"caseDefinitionVersionTag$ | async\"\n  (closeModalEvent)=\"closeModal($event)\"\n></valtimo-case-management-tags-modal>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"caseManagement.caseTags.deleteText\"\n  [outputOnConfirm]=\"caseTagToDelete$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"interface.delete\"\n  (confirmEvent)=\"confirmDeleteCaseTag($event)\"\n></valtimo-confirmation-modal>\n\n<ng-template #addTagButton>\n  <button\n    *ngIf=\"hasEditPermissions$ | async\"\n    cdsButton=\"primary\"\n    [attr.data-test-id]=\"testIds.addButton\"\n    [disabled]=\"loading$ | async\"\n    (click)=\"openAddModal()\"\n  >\n    {{ 'caseManagement.caseTags.add' | translate }}\n\n    <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n  </button>\n</ng-template>\n\n<ng-template #colorColumnTemplate let-data=\"data\">\n  <cds-tag class=\"cds-tag--no-margin\" [type]=\"data?.item?.tagType\">\n    {{ 'interface.tagType.' + data?.item?.tagType | translate }}\n  </cds-tag>\n</ng-template>\n", styles: ["::ng-deep .cds-tag--no-margin{margin:0}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: CaseManagementTagsModalComponent, selector: "valtimo-case-management-tags-modal", inputs: ["type", "prefill", "usedKeys", "caseDefinitionKey", "caseDefinitionVersionTag"], outputs: ["closeModalEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementTagsComponent, decorators: [{
             type: Component,
@@ -2886,11 +2886,11 @@ class CaseManagementSearchFieldsComponent {
         this.searchFieldClicked(searchField, false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementSearchFieldsComponent, deps: [{ token: i1$2.DocumentService }, { token: i2$2.ActivatedRoute }, { token: i3.TranslateService }, { token: i2.IconService }, { token: i2$1.EditPermissionsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CaseManagementSearchFieldsComponent, isStandalone: false, selector: "valtimo-case-management-search-fields", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    caseDefinitionKey: caseDefinitionKey$ | async,\n    disableInput: disableInput$ | async,\n    downloadName: downloadName$ | async,\n    downloadUrl: downloadUrl$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n    jsonEditorModel: jsonEditorModel$ | async,\n    searchFields: translatedSearchFields$ | async,\n    showActionItems: showActionItems$ | async,\n    valid: valid$ | async,\n  } as obs\"\n>\n  <ng-container *ngTemplateOutlet=\"content; context: {obs: obs}\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"modal; context: {obs: obs}\"></ng-container>\n</ng-container>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"searchFieldsOverview.deleteSearchFieldConfirmation\"\n  [outputOnConfirm]=\"selectedDeleteSearchField$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"interface.delete\"\n  (confirmEvent)=\"onDeleteSelectedSearchFieldConfirm($event)\"\n></valtimo-confirmation-modal>\n\n<ng-template #buttons let-obs=\"obs\">\n  <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n\n  <button\n    cdsButton=\"primary\"\n    data-test-id=\"case-management-search-add\"\n    *ngIf=\"obs.hasEditPermissions\"\n    [disabled]=\"loadingSearchFields || obs.disableInput\"\n    (click)=\"searchFieldClicked($event, true)\"\n  >\n    <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n    {{ 'searchFieldsOverview.addRow' | translate }}\n  </button>\n</ng-template>\n\n<ng-template #content let-obs=\"obs\">\n  @if (!jsonEditorActive()) {\n    <valtimo-carbon-list\n      data-test-id=\"searchFieldsList\"\n      [actionItems]=\"actionItems\"\n      [showActionItems]=\"obs.hasEditPermissions\"\n      [fields]=\"fields\"\n      [header]=\"false\"\n      [items]=\"obs.searchFields\"\n      [loading]=\"!obs.searchFields\"\n      (rowClicked)=\"searchFieldClicked($event, false)\"\n      [dragAndDrop]=\"true\"\n      [dragAndDropDisabled]=\"obs.disableInput\"\n      (itemsReordered)=\"onItemsReordered(obs.caseDefinitionKey, $event)\"\n    >\n      <ng-container\n        carbonToolbarContent\n        *ngTemplateOutlet=\"buttons; context: {obs: obs}\"\n      ></ng-container>\n\n      <valtimo-no-results\n        [title]=\"'searchFieldsOverview.noSearchfieldsTitle' | translate\"\n        [description]=\"'searchFieldsOverview.noSearchfieldsDescription' | translate\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  } @else {\n    <valtimo-json-editor\n      [model]=\"obs.jsonEditorModel\"\n      [fitPage]=\"true\"\n      [showEditButton]=\"obs.hasEditPermissions\"\n      (saveEvent)=\"updateSearchFields(obs.caseDefinitionKey, $event)\"\n    >\n      <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n      <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n    </valtimo-json-editor>\n  }\n</ng-template>\n\n<ng-template #modal let-obs=\"obs\">\n  <cds-modal\n    valtimoCdsModal\n    [title]=\"\n      searchFieldActionTypeIsAdd\n        ? ('searchFieldsOverview.addRow' | translate)\n        : ('searchFieldsOverview.edit' | translate)\n    \"\n    [open]=\"modalShowing$ | async\"\n    [showFooter]=\"true\"\n    size=\"sm\"\n    (close)=\"onModalClose()\"\n  >\n    <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onModalClose()\">\n      <h3 cdsModalHeaderHeading>\n        {{\n          (searchFieldActionTypeIsAdd ? 'searchFieldsOverview.addRow' : 'searchFieldsOverview.edit')\n            | translate\n        }}\n      </h3>\n    </cds-modal-header>\n\n    <section cdsModalContent [cdsLayer]=\"1\">\n      <v-form\n        (valueChange)=\"formValueChange($event)\"\n        *ngIf=\"\n          (showFields$ | async) && {\n            searchField: selectedSearchField$ | async,\n          } as searchObs\n        \"\n      >\n        <v-input\n          name=\"title\"\n          dataTestId=\"case-management-search-title\"\n          [title]=\"'searchFieldsOverview.title' | translate\"\n          [margin]=\"true\"\n          [defaultValue]=\"searchObs.searchField?.title\"\n          [disabled]=\"obs.disableInput\"\n          [required]=\"false\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </v-input>\n\n        <v-input\n          name=\"key\"\n          dataTestId=\"case-management-search-key\"\n          [title]=\"'searchFieldsOverview.key' | translate\"\n          [margin]=\"true\"\n          [defaultValue]=\"searchObs.searchField?.key\"\n          [disabled]=\"obs.disableInput || !searchFieldActionTypeIsAdd\"\n          [required]=\"true\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.key' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </v-input>\n\n        <valtimo-value-path-selector\n          name=\"path\"\n          [label]=\"'searchFieldsOverview.path' | translate\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n          [marginXl]=\"true\"\n          [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n          [caseDefinitionVersionTag]=\"caseDefinitionVersionTag$ | async\"\n          [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n          [defaultValue]=\"searchObs.searchField?.path\"\n          [disabled]=\"obs.disableInput\"\n        ></valtimo-value-path-selector>\n\n        <v-select\n          *ngIf=\"dataTypeItems$ | async as dataTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"dataTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.dataType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"dataType\"\n          [defaultSelectionId]=\"searchObs.searchField?.dataType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-dataTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"(showMatchTypes$ | async) && (matchTypeItems$ | async) as matchTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"matchTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.matchType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"matchType\"\n          [defaultSelectionId]=\"searchObs.searchField?.matchType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-matchTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"fieldTypeItems$ | async as fieldTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"fieldTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.fieldType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"fieldType\"\n          [defaultSelectionId]=\"searchObs.searchField?.fieldType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-fieldTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"\n            (fieldTypeIsDropdown$ | async) &&\n            (dropdownDataProviderNames$ | async) as dropdownDataProviderNames\n          \"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"dropdownDataProviderNames\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"false\"\n          name=\"dropdownDataProvider\"\n          [defaultSelectionId]=\"searchObs.searchField?.dropdownDataProvider\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-dropdownDataProvider\"\n        ></v-select>\n\n        <valtimo-carbon-multi-input\n          *ngIf=\"\n            (showInputDropdownTable$ | async) &&\n            (initialDropdownValues$ | async) as initialDropdownValues\n          \"\n          name=\"dropdownValues\"\n          [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n          type=\"keyValue\"\n          [disabled]=\"obs.disableInput\"\n          [defaultValues]=\"initialDropdownValues\"\n          [margin]=\"true\"\n          [required]=\"false\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n          (valueChange)=\"dropdownDatalistChange($event)\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </valtimo-carbon-multi-input>\n\n        <v-table\n          *ngIf=\"\n            (showReadonlyDropdownTable$ | async) &&\n            (initialDropdownValues$ | async) as initialDropdownValues\n          \"\n          [items]=\"initialDropdownValues\"\n          [columns]=\"dropdownColumns$ | async\"\n          [showEditButtons]=\"false\"\n          [itemsTranslationKey]=\"'searchFieldsOverview'\"\n          [showPagination]=\"false\"\n          [mobileBreakpointPx]=\"200\"\n          [carbonTheme]=\"CARBON_THEME\"\n        ></v-table>\n      </v-form>\n    </section>\n\n    <cds-modal-footer>\n      <ng-container *ngTemplateOutlet=\"buttonsFooterModal; context: {obs: obs}\"></ng-container>\n    </cds-modal-footer>\n  </cds-modal>\n</ng-template>\n\n<ng-template #buttonsFooterModal let-obs=\"obs\">\n  <button\n    data-test-id=\"case-management-search-close\"\n    cdsButton=\"secondary\"\n    (click)=\"onModalClose()\"\n    [disabled]=\"obs.disableInput\"\n  >\n    {{ 'interface.cancel' | translate }}\n  </button>\n\n  <button\n    data-test-id=\"case-management-search-save\"\n    cdsButton=\"primary\"\n    [disabled]=\"obs.disableInput || !obs.valid\"\n    (click)=\"saveSearchField(obs.caseDefinitionKey)\"\n  >\n    {{ 'searchFieldsOverview.submit' | translate }}\n  </button>\n</ng-template>\n\n<ng-template #viewToggle>\n  <cds-tooltip [description]=\"'JSON editor'\">\n    <button\n      [cdsButton]=\"buttonTheme()\"\n      data-test-id=\"case-management-search-fields-switch-view\"\n      iconOnly=\"true\"\n      (click)=\"switchView()\"\n    >\n      <svg cdsIcon=\"code\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n</ng-template>\n\n<ng-template #downloadButton let-obs=\"obs\">\n  <button\n    cdsButton=\"ghost\"\n    iconOnly=\"true\"\n    data-test-id=\"case-management-search-download\"\n    [disabled]=\"\n      !obs.downloadUrl || !obs.downloadName || obs.searchFields?.length <= 0 || obs.disableInput\n    \"\n    (click)=\"onDownloadClick()\"\n  >\n    <svg cdsIcon=\"download\" size=\"16\"></svg>\n  </button>\n</ng-template>\n", styles: ["valtimo-list::ng-deep table{border-top:1px solid rgba(0,0,0,.125)}.case-management-search-fields__buttons{display:flex;gap:16px}.case-management-search-fields__buttons .center-link{display:flex;align-items:center}.case-management-search-fields__move-buttons{width:100%;justify-content:flex-end;display:flex;flex-direction:row;position:relative}.case-management-search-fields__move-buttons button:not(:last-child){margin-right:8px}.list-actions{width:1px}.modal-header::ng-deep{background-color:#f3f4f7}::ng-deep .tab-container{min-height:unset!important}::ng-deep .cds--tab-content{padding-top:0!important}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i7.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "warn", "warnText", "dataTestId"], outputs: ["selectedChange"] }, { kind: "component", type: i7.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "smallMargin", "disabled", "step", "min", "maxLength", "tooltip", "required", "hideNumberSpinBox", "smallLabel", "rows", "clear$", "carbonTheme", "placeholder", "dataTestId", "trim", "presetsTitle", "presetOptions"], outputs: ["valueChange"] }, { kind: "component", type: i7.FormComponent, selector: "v-form", inputs: ["className"], outputs: ["valueChange"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i7.CarbonMultiInputComponent, selector: "valtimo-carbon-multi-input", inputs: ["addRowText", "addButtonType", "addRowTranslationKey", "arbitraryAmountTitles", "arbitraryValueAmount", "defaultValues", "deleteRowText", "deleteRowTranslationKey", "disabled", "dropdownColumnTitle", "dropdownItems", "dropdownWidth", "fullWidth", "hideAddButton", "hideDeleteButton", "initialAmountOfRows", "keyColumnTitle", "margin", "maxRows", "minimumAmountOfRows", "name", "required", "title", "titleTranslationKey", "tooltip", "type", "valueColumnTitle", "valuePathSelectorCaseDefinitionKey", "valuePathSelectorPrefixes", "valuePathSelectorShowCaseDefinitionSelector", "valuePathSelectorNotation", "keyColumnFlex", "dropdownColumnFlex", "valueColumnFlex"], outputs: ["valueChange", "allValuesValidEvent"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "component", type: i7.TableComponent, selector: "v-table", inputs: ["items", "columns", "loading", "showEditButtons", "showPagination", "editButtonTranslationKey", "itemsTranslationKey", "noResultsTranslationKey", "mobileBreakpointPx", "amountOfLoadingRows", "collectionSize", "page", "size"], outputs: ["editButtonClicked", "paginationSizeSet", "paginationPageSet"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "component", type: i7.ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "excludePrefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: i7.JsonEditorComponent, selector: "valtimo-json-editor", inputs: ["disabled", "model", "editorOptions", "fitPage", "formatOnLoad", "heightPx", "heightStyle", "jsonSchema", "showEditButton", "widthPx"], outputs: ["changeEvent", "discardEvent", "keepEditingEvent", "saveEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CaseManagementSearchFieldsComponent, isStandalone: false, selector: "valtimo-case-management-search-fields", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    caseDefinitionKey: caseDefinitionKey$ | async,\n    disableInput: disableInput$ | async,\n    downloadName: downloadName$ | async,\n    downloadUrl: downloadUrl$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n    jsonEditorModel: jsonEditorModel$ | async,\n    searchFields: translatedSearchFields$ | async,\n    showActionItems: showActionItems$ | async,\n    valid: valid$ | async,\n  } as obs\"\n>\n  <ng-container *ngTemplateOutlet=\"content; context: {obs: obs}\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"modal; context: {obs: obs}\"></ng-container>\n</ng-container>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"searchFieldsOverview.deleteSearchFieldConfirmation\"\n  [outputOnConfirm]=\"selectedDeleteSearchField$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"interface.delete\"\n  (confirmEvent)=\"onDeleteSelectedSearchFieldConfirm($event)\"\n></valtimo-confirmation-modal>\n\n<ng-template #buttons let-obs=\"obs\">\n  <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n\n  <button\n    cdsButton=\"primary\"\n    data-test-id=\"case-management-search-add\"\n    *ngIf=\"obs.hasEditPermissions\"\n    [disabled]=\"loadingSearchFields || obs.disableInput\"\n    (click)=\"searchFieldClicked($event, true)\"\n  >\n    <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n    {{ 'searchFieldsOverview.addRow' | translate }}\n  </button>\n</ng-template>\n\n<ng-template #content let-obs=\"obs\">\n  @if (!jsonEditorActive()) {\n    <valtimo-carbon-list\n      data-test-id=\"searchFieldsList\"\n      [actionItems]=\"actionItems\"\n      [showActionItems]=\"obs.hasEditPermissions\"\n      [fields]=\"fields\"\n      [header]=\"false\"\n      [items]=\"obs.searchFields\"\n      [loading]=\"!obs.searchFields\"\n      (rowClicked)=\"searchFieldClicked($event, false)\"\n      [dragAndDrop]=\"true\"\n      [dragAndDropDisabled]=\"obs.disableInput\"\n      (itemsReordered)=\"onItemsReordered(obs.caseDefinitionKey, $event)\"\n    >\n      <ng-container\n        carbonToolbarContent\n        *ngTemplateOutlet=\"buttons; context: {obs: obs}\"\n      ></ng-container>\n\n      <valtimo-no-results\n        [title]=\"'searchFieldsOverview.noSearchfieldsTitle' | translate\"\n        [description]=\"'searchFieldsOverview.noSearchfieldsDescription' | translate\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  } @else {\n    <valtimo-json-editor\n      [model]=\"obs.jsonEditorModel\"\n      [fitPage]=\"true\"\n      [showEditButton]=\"obs.hasEditPermissions\"\n      (saveEvent)=\"updateSearchFields(obs.caseDefinitionKey, $event)\"\n    >\n      <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n      <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n    </valtimo-json-editor>\n  }\n</ng-template>\n\n<ng-template #modal let-obs=\"obs\">\n  <cds-modal\n    valtimoCdsModal\n    [title]=\"\n      searchFieldActionTypeIsAdd\n        ? ('searchFieldsOverview.addRow' | translate)\n        : ('searchFieldsOverview.edit' | translate)\n    \"\n    [open]=\"modalShowing$ | async\"\n    [showFooter]=\"true\"\n    size=\"sm\"\n    (close)=\"onModalClose()\"\n  >\n    <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onModalClose()\">\n      <h3 cdsModalHeaderHeading>\n        {{\n          (searchFieldActionTypeIsAdd ? 'searchFieldsOverview.addRow' : 'searchFieldsOverview.edit')\n            | translate\n        }}\n      </h3>\n    </cds-modal-header>\n\n    <section cdsModalContent [cdsLayer]=\"1\">\n      <v-form\n        (valueChange)=\"formValueChange($event)\"\n        *ngIf=\"\n          (showFields$ | async) && {\n            searchField: selectedSearchField$ | async,\n          } as searchObs\n        \"\n      >\n        <v-input\n          name=\"title\"\n          dataTestId=\"case-management-search-title\"\n          [title]=\"'searchFieldsOverview.title' | translate\"\n          [margin]=\"true\"\n          [defaultValue]=\"searchObs.searchField?.title\"\n          [disabled]=\"obs.disableInput\"\n          [required]=\"false\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </v-input>\n\n        <v-input\n          name=\"key\"\n          dataTestId=\"case-management-search-key\"\n          [title]=\"'searchFieldsOverview.key' | translate\"\n          [margin]=\"true\"\n          [defaultValue]=\"searchObs.searchField?.key\"\n          [disabled]=\"obs.disableInput || !searchFieldActionTypeIsAdd\"\n          [required]=\"true\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.key' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </v-input>\n\n        <valtimo-value-path-selector\n          name=\"path\"\n          [label]=\"'searchFieldsOverview.path' | translate\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n          [marginXl]=\"true\"\n          [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n          [caseDefinitionVersionTag]=\"caseDefinitionVersionTag$ | async\"\n          [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n          [defaultValue]=\"searchObs.searchField?.path\"\n          [disabled]=\"obs.disableInput\"\n        ></valtimo-value-path-selector>\n\n        <v-select\n          *ngIf=\"dataTypeItems$ | async as dataTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"dataTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.dataType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"dataType\"\n          [defaultSelectionId]=\"searchObs.searchField?.dataType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-dataTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"(showMatchTypes$ | async) && (matchTypeItems$ | async) as matchTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"matchTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.matchType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"matchType\"\n          [defaultSelectionId]=\"searchObs.searchField?.matchType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-matchTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"fieldTypeItems$ | async as fieldTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"fieldTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.fieldType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"fieldType\"\n          [defaultSelectionId]=\"searchObs.searchField?.fieldType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-fieldTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"\n            (fieldTypeIsDropdown$ | async) &&\n            (dropdownDataProviderNames$ | async) as dropdownDataProviderNames\n          \"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"dropdownDataProviderNames\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"false\"\n          name=\"dropdownDataProvider\"\n          [defaultSelectionId]=\"searchObs.searchField?.dropdownDataProvider\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-dropdownDataProvider\"\n        ></v-select>\n\n        <valtimo-carbon-multi-input\n          *ngIf=\"\n            (showInputDropdownTable$ | async) &&\n            (initialDropdownValues$ | async) as initialDropdownValues\n          \"\n          name=\"dropdownValues\"\n          [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n          type=\"keyValue\"\n          [disabled]=\"obs.disableInput\"\n          [defaultValues]=\"initialDropdownValues\"\n          [margin]=\"true\"\n          [required]=\"false\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n          (valueChange)=\"dropdownDatalistChange($event)\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </valtimo-carbon-multi-input>\n\n        <v-table\n          *ngIf=\"\n            (showReadonlyDropdownTable$ | async) &&\n            (initialDropdownValues$ | async) as initialDropdownValues\n          \"\n          [items]=\"initialDropdownValues\"\n          [columns]=\"dropdownColumns$ | async\"\n          [showEditButtons]=\"false\"\n          [itemsTranslationKey]=\"'searchFieldsOverview'\"\n          [showPagination]=\"false\"\n          [mobileBreakpointPx]=\"200\"\n          [carbonTheme]=\"CARBON_THEME\"\n        ></v-table>\n      </v-form>\n    </section>\n\n    <cds-modal-footer>\n      <ng-container *ngTemplateOutlet=\"buttonsFooterModal; context: {obs: obs}\"></ng-container>\n    </cds-modal-footer>\n  </cds-modal>\n</ng-template>\n\n<ng-template #buttonsFooterModal let-obs=\"obs\">\n  <button\n    data-test-id=\"case-management-search-close\"\n    cdsButton=\"secondary\"\n    (click)=\"onModalClose()\"\n    [disabled]=\"obs.disableInput\"\n  >\n    {{ 'interface.cancel' | translate }}\n  </button>\n\n  <button\n    data-test-id=\"case-management-search-save\"\n    cdsButton=\"primary\"\n    [disabled]=\"obs.disableInput || !obs.valid\"\n    (click)=\"saveSearchField(obs.caseDefinitionKey)\"\n  >\n    {{ (searchFieldActionTypeIsAdd ? 'interface.create' : 'interface.save') | translate }}\n  </button>\n</ng-template>\n\n<ng-template #viewToggle>\n  <cds-tooltip [description]=\"'JSON editor'\">\n    <button\n      [cdsButton]=\"buttonTheme()\"\n      data-test-id=\"case-management-search-fields-switch-view\"\n      iconOnly=\"true\"\n      (click)=\"switchView()\"\n    >\n      <svg cdsIcon=\"code\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n</ng-template>\n\n<ng-template #downloadButton let-obs=\"obs\">\n  <button\n    cdsButton=\"ghost\"\n    iconOnly=\"true\"\n    data-test-id=\"case-management-search-download\"\n    [disabled]=\"\n      !obs.downloadUrl || !obs.downloadName || obs.searchFields?.length <= 0 || obs.disableInput\n    \"\n    (click)=\"onDownloadClick()\"\n  >\n    <svg cdsIcon=\"download\" size=\"16\"></svg>\n  </button>\n</ng-template>\n", styles: ["valtimo-list::ng-deep table{border-top:1px solid rgba(0,0,0,.125)}.case-management-search-fields__buttons{display:flex;gap:16px}.case-management-search-fields__buttons .center-link{display:flex;align-items:center}.case-management-search-fields__move-buttons{width:100%;justify-content:flex-end;display:flex;flex-direction:row;position:relative}.case-management-search-fields__move-buttons button:not(:last-child){margin-right:8px}.list-actions{width:1px}.modal-header::ng-deep{background-color:#f3f4f7}::ng-deep .tab-container{min-height:unset!important}::ng-deep .cds--tab-content{padding-top:0!important}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i7.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "warn", "warnText", "dataTestId"], outputs: ["selectedChange"] }, { kind: "component", type: i7.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "smallMargin", "disabled", "step", "min", "maxLength", "tooltip", "required", "hideNumberSpinBox", "smallLabel", "rows", "clear$", "carbonTheme", "placeholder", "dataTestId", "trim", "presetsTitle", "presetOptions"], outputs: ["valueChange"] }, { kind: "component", type: i7.FormComponent, selector: "v-form", inputs: ["className"], outputs: ["valueChange"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i7.CarbonMultiInputComponent, selector: "valtimo-carbon-multi-input", inputs: ["addRowText", "addButtonType", "addRowTranslationKey", "arbitraryAmountTitles", "arbitraryValueAmount", "defaultValues", "deleteRowText", "deleteRowTranslationKey", "disabled", "dropdownColumnTitle", "dropdownItems", "dropdownWidth", "fullWidth", "hideAddButton", "hideDeleteButton", "initialAmountOfRows", "keyColumnTitle", "margin", "maxRows", "minimumAmountOfRows", "name", "required", "title", "titleTranslationKey", "tooltip", "type", "valueColumnTitle", "valuePathSelectorCaseDefinitionKey", "valuePathSelectorPrefixes", "valuePathSelectorShowCaseDefinitionSelector", "valuePathSelectorNotation", "keyColumnFlex", "dropdownColumnFlex", "valueColumnFlex"], outputs: ["valueChange", "allValuesValidEvent"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "component", type: i7.TableComponent, selector: "v-table", inputs: ["items", "columns", "loading", "showEditButtons", "showPagination", "editButtonTranslationKey", "itemsTranslationKey", "noResultsTranslationKey", "mobileBreakpointPx", "amountOfLoadingRows", "collectionSize", "page", "size"], outputs: ["editButtonClicked", "paginationSizeSet", "paginationPageSet"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "component", type: i7.ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "excludePrefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: i7.JsonEditorComponent, selector: "valtimo-json-editor", inputs: ["disabled", "model", "editorOptions", "fitPage", "formatOnLoad", "heightPx", "heightStyle", "jsonSchema", "showEditButton", "widthPx"], outputs: ["changeEvent", "discardEvent", "keepEditingEvent", "saveEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementSearchFieldsComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'valtimo-case-management-search-fields', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    caseDefinitionKey: caseDefinitionKey$ | async,\n    disableInput: disableInput$ | async,\n    downloadName: downloadName$ | async,\n    downloadUrl: downloadUrl$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n    jsonEditorModel: jsonEditorModel$ | async,\n    searchFields: translatedSearchFields$ | async,\n    showActionItems: showActionItems$ | async,\n    valid: valid$ | async,\n  } as obs\"\n>\n  <ng-container *ngTemplateOutlet=\"content; context: {obs: obs}\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"modal; context: {obs: obs}\"></ng-container>\n</ng-container>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"searchFieldsOverview.deleteSearchFieldConfirmation\"\n  [outputOnConfirm]=\"selectedDeleteSearchField$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"interface.delete\"\n  (confirmEvent)=\"onDeleteSelectedSearchFieldConfirm($event)\"\n></valtimo-confirmation-modal>\n\n<ng-template #buttons let-obs=\"obs\">\n  <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n\n  <button\n    cdsButton=\"primary\"\n    data-test-id=\"case-management-search-add\"\n    *ngIf=\"obs.hasEditPermissions\"\n    [disabled]=\"loadingSearchFields || obs.disableInput\"\n    (click)=\"searchFieldClicked($event, true)\"\n  >\n    <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n    {{ 'searchFieldsOverview.addRow' | translate }}\n  </button>\n</ng-template>\n\n<ng-template #content let-obs=\"obs\">\n  @if (!jsonEditorActive()) {\n    <valtimo-carbon-list\n      data-test-id=\"searchFieldsList\"\n      [actionItems]=\"actionItems\"\n      [showActionItems]=\"obs.hasEditPermissions\"\n      [fields]=\"fields\"\n      [header]=\"false\"\n      [items]=\"obs.searchFields\"\n      [loading]=\"!obs.searchFields\"\n      (rowClicked)=\"searchFieldClicked($event, false)\"\n      [dragAndDrop]=\"true\"\n      [dragAndDropDisabled]=\"obs.disableInput\"\n      (itemsReordered)=\"onItemsReordered(obs.caseDefinitionKey, $event)\"\n    >\n      <ng-container\n        carbonToolbarContent\n        *ngTemplateOutlet=\"buttons; context: {obs: obs}\"\n      ></ng-container>\n\n      <valtimo-no-results\n        [title]=\"'searchFieldsOverview.noSearchfieldsTitle' | translate\"\n        [description]=\"'searchFieldsOverview.noSearchfieldsDescription' | translate\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  } @else {\n    <valtimo-json-editor\n      [model]=\"obs.jsonEditorModel\"\n      [fitPage]=\"true\"\n      [showEditButton]=\"obs.hasEditPermissions\"\n      (saveEvent)=\"updateSearchFields(obs.caseDefinitionKey, $event)\"\n    >\n      <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n      <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n    </valtimo-json-editor>\n  }\n</ng-template>\n\n<ng-template #modal let-obs=\"obs\">\n  <cds-modal\n    valtimoCdsModal\n    [title]=\"\n      searchFieldActionTypeIsAdd\n        ? ('searchFieldsOverview.addRow' | translate)\n        : ('searchFieldsOverview.edit' | translate)\n    \"\n    [open]=\"modalShowing$ | async\"\n    [showFooter]=\"true\"\n    size=\"sm\"\n    (close)=\"onModalClose()\"\n  >\n    <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onModalClose()\">\n      <h3 cdsModalHeaderHeading>\n        {{\n          (searchFieldActionTypeIsAdd ? 'searchFieldsOverview.addRow' : 'searchFieldsOverview.edit')\n            | translate\n        }}\n      </h3>\n    </cds-modal-header>\n\n    <section cdsModalContent [cdsLayer]=\"1\">\n      <v-form\n        (valueChange)=\"formValueChange($event)\"\n        *ngIf=\"\n          (showFields$ | async) && {\n            searchField: selectedSearchField$ | async,\n          } as searchObs\n        \"\n      >\n        <v-input\n          name=\"title\"\n          dataTestId=\"case-management-search-title\"\n          [title]=\"'searchFieldsOverview.title' | translate\"\n          [margin]=\"true\"\n          [defaultValue]=\"searchObs.searchField?.title\"\n          [disabled]=\"obs.disableInput\"\n          [required]=\"false\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </v-input>\n\n        <v-input\n          name=\"key\"\n          dataTestId=\"case-management-search-key\"\n          [title]=\"'searchFieldsOverview.key' | translate\"\n          [margin]=\"true\"\n          [defaultValue]=\"searchObs.searchField?.key\"\n          [disabled]=\"obs.disableInput || !searchFieldActionTypeIsAdd\"\n          [required]=\"true\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.key' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </v-input>\n\n        <valtimo-value-path-selector\n          name=\"path\"\n          [label]=\"'searchFieldsOverview.path' | translate\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n          [marginXl]=\"true\"\n          [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n          [caseDefinitionVersionTag]=\"caseDefinitionVersionTag$ | async\"\n          [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n          [defaultValue]=\"searchObs.searchField?.path\"\n          [disabled]=\"obs.disableInput\"\n        ></valtimo-value-path-selector>\n\n        <v-select\n          *ngIf=\"dataTypeItems$ | async as dataTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"dataTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.dataType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"dataType\"\n          [defaultSelectionId]=\"searchObs.searchField?.dataType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-dataTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"(showMatchTypes$ | async) && (matchTypeItems$ | async) as matchTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"matchTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.matchType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"matchType\"\n          [defaultSelectionId]=\"searchObs.searchField?.matchType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-matchTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"fieldTypeItems$ | async as fieldTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"fieldTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.fieldType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"fieldType\"\n          [defaultSelectionId]=\"searchObs.searchField?.fieldType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-fieldTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"\n            (fieldTypeIsDropdown$ | async) &&\n            (dropdownDataProviderNames$ | async) as dropdownDataProviderNames\n          \"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"dropdownDataProviderNames\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"false\"\n          name=\"dropdownDataProvider\"\n          [defaultSelectionId]=\"searchObs.searchField?.dropdownDataProvider\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-dropdownDataProvider\"\n        ></v-select>\n\n        <valtimo-carbon-multi-input\n          *ngIf=\"\n            (showInputDropdownTable$ | async) &&\n            (initialDropdownValues$ | async) as initialDropdownValues\n          \"\n          name=\"dropdownValues\"\n          [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n          type=\"keyValue\"\n          [disabled]=\"obs.disableInput\"\n          [defaultValues]=\"initialDropdownValues\"\n          [margin]=\"true\"\n          [required]=\"false\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n          (valueChange)=\"dropdownDatalistChange($event)\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </valtimo-carbon-multi-input>\n\n        <v-table\n          *ngIf=\"\n            (showReadonlyDropdownTable$ | async) &&\n            (initialDropdownValues$ | async) as initialDropdownValues\n          \"\n          [items]=\"initialDropdownValues\"\n          [columns]=\"dropdownColumns$ | async\"\n          [showEditButtons]=\"false\"\n          [itemsTranslationKey]=\"'searchFieldsOverview'\"\n          [showPagination]=\"false\"\n          [mobileBreakpointPx]=\"200\"\n          [carbonTheme]=\"CARBON_THEME\"\n        ></v-table>\n      </v-form>\n    </section>\n\n    <cds-modal-footer>\n      <ng-container *ngTemplateOutlet=\"buttonsFooterModal; context: {obs: obs}\"></ng-container>\n    </cds-modal-footer>\n  </cds-modal>\n</ng-template>\n\n<ng-template #buttonsFooterModal let-obs=\"obs\">\n  <button\n    data-test-id=\"case-management-search-close\"\n    cdsButton=\"secondary\"\n    (click)=\"onModalClose()\"\n    [disabled]=\"obs.disableInput\"\n  >\n    {{ 'interface.cancel' | translate }}\n  </button>\n\n  <button\n    data-test-id=\"case-management-search-save\"\n    cdsButton=\"primary\"\n    [disabled]=\"obs.disableInput || !obs.valid\"\n    (click)=\"saveSearchField(obs.caseDefinitionKey)\"\n  >\n    {{ 'searchFieldsOverview.submit' | translate }}\n  </button>\n</ng-template>\n\n<ng-template #viewToggle>\n  <cds-tooltip [description]=\"'JSON editor'\">\n    <button\n      [cdsButton]=\"buttonTheme()\"\n      data-test-id=\"case-management-search-fields-switch-view\"\n      iconOnly=\"true\"\n      (click)=\"switchView()\"\n    >\n      <svg cdsIcon=\"code\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n</ng-template>\n\n<ng-template #downloadButton let-obs=\"obs\">\n  <button\n    cdsButton=\"ghost\"\n    iconOnly=\"true\"\n    data-test-id=\"case-management-search-download\"\n    [disabled]=\"\n      !obs.downloadUrl || !obs.downloadName || obs.searchFields?.length <= 0 || obs.disableInput\n    \"\n    (click)=\"onDownloadClick()\"\n  >\n    <svg cdsIcon=\"download\" size=\"16\"></svg>\n  </button>\n</ng-template>\n", styles: ["valtimo-list::ng-deep table{border-top:1px solid rgba(0,0,0,.125)}.case-management-search-fields__buttons{display:flex;gap:16px}.case-management-search-fields__buttons .center-link{display:flex;align-items:center}.case-management-search-fields__move-buttons{width:100%;justify-content:flex-end;display:flex;flex-direction:row;position:relative}.case-management-search-fields__move-buttons button:not(:last-child){margin-right:8px}.list-actions{width:1px}.modal-header::ng-deep{background-color:#f3f4f7}::ng-deep .tab-container{min-height:unset!important}::ng-deep .cds--tab-content{padding-top:0!important}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+            args: [{ standalone: false, selector: 'valtimo-case-management-search-fields', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    caseDefinitionKey: caseDefinitionKey$ | async,\n    disableInput: disableInput$ | async,\n    downloadName: downloadName$ | async,\n    downloadUrl: downloadUrl$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n    jsonEditorModel: jsonEditorModel$ | async,\n    searchFields: translatedSearchFields$ | async,\n    showActionItems: showActionItems$ | async,\n    valid: valid$ | async,\n  } as obs\"\n>\n  <ng-container *ngTemplateOutlet=\"content; context: {obs: obs}\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"modal; context: {obs: obs}\"></ng-container>\n</ng-container>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"searchFieldsOverview.deleteSearchFieldConfirmation\"\n  [outputOnConfirm]=\"selectedDeleteSearchField$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"interface.delete\"\n  (confirmEvent)=\"onDeleteSelectedSearchFieldConfirm($event)\"\n></valtimo-confirmation-modal>\n\n<ng-template #buttons let-obs=\"obs\">\n  <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n\n  <button\n    cdsButton=\"primary\"\n    data-test-id=\"case-management-search-add\"\n    *ngIf=\"obs.hasEditPermissions\"\n    [disabled]=\"loadingSearchFields || obs.disableInput\"\n    (click)=\"searchFieldClicked($event, true)\"\n  >\n    <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n    {{ 'searchFieldsOverview.addRow' | translate }}\n  </button>\n</ng-template>\n\n<ng-template #content let-obs=\"obs\">\n  @if (!jsonEditorActive()) {\n    <valtimo-carbon-list\n      data-test-id=\"searchFieldsList\"\n      [actionItems]=\"actionItems\"\n      [showActionItems]=\"obs.hasEditPermissions\"\n      [fields]=\"fields\"\n      [header]=\"false\"\n      [items]=\"obs.searchFields\"\n      [loading]=\"!obs.searchFields\"\n      (rowClicked)=\"searchFieldClicked($event, false)\"\n      [dragAndDrop]=\"true\"\n      [dragAndDropDisabled]=\"obs.disableInput\"\n      (itemsReordered)=\"onItemsReordered(obs.caseDefinitionKey, $event)\"\n    >\n      <ng-container\n        carbonToolbarContent\n        *ngTemplateOutlet=\"buttons; context: {obs: obs}\"\n      ></ng-container>\n\n      <valtimo-no-results\n        [title]=\"'searchFieldsOverview.noSearchfieldsTitle' | translate\"\n        [description]=\"'searchFieldsOverview.noSearchfieldsDescription' | translate\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  } @else {\n    <valtimo-json-editor\n      [model]=\"obs.jsonEditorModel\"\n      [fitPage]=\"true\"\n      [showEditButton]=\"obs.hasEditPermissions\"\n      (saveEvent)=\"updateSearchFields(obs.caseDefinitionKey, $event)\"\n    >\n      <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n      <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n    </valtimo-json-editor>\n  }\n</ng-template>\n\n<ng-template #modal let-obs=\"obs\">\n  <cds-modal\n    valtimoCdsModal\n    [title]=\"\n      searchFieldActionTypeIsAdd\n        ? ('searchFieldsOverview.addRow' | translate)\n        : ('searchFieldsOverview.edit' | translate)\n    \"\n    [open]=\"modalShowing$ | async\"\n    [showFooter]=\"true\"\n    size=\"sm\"\n    (close)=\"onModalClose()\"\n  >\n    <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onModalClose()\">\n      <h3 cdsModalHeaderHeading>\n        {{\n          (searchFieldActionTypeIsAdd ? 'searchFieldsOverview.addRow' : 'searchFieldsOverview.edit')\n            | translate\n        }}\n      </h3>\n    </cds-modal-header>\n\n    <section cdsModalContent [cdsLayer]=\"1\">\n      <v-form\n        (valueChange)=\"formValueChange($event)\"\n        *ngIf=\"\n          (showFields$ | async) && {\n            searchField: selectedSearchField$ | async,\n          } as searchObs\n        \"\n      >\n        <v-input\n          name=\"title\"\n          dataTestId=\"case-management-search-title\"\n          [title]=\"'searchFieldsOverview.title' | translate\"\n          [margin]=\"true\"\n          [defaultValue]=\"searchObs.searchField?.title\"\n          [disabled]=\"obs.disableInput\"\n          [required]=\"false\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </v-input>\n\n        <v-input\n          name=\"key\"\n          dataTestId=\"case-management-search-key\"\n          [title]=\"'searchFieldsOverview.key' | translate\"\n          [margin]=\"true\"\n          [defaultValue]=\"searchObs.searchField?.key\"\n          [disabled]=\"obs.disableInput || !searchFieldActionTypeIsAdd\"\n          [required]=\"true\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.key' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </v-input>\n\n        <valtimo-value-path-selector\n          name=\"path\"\n          [label]=\"'searchFieldsOverview.path' | translate\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n          [marginXl]=\"true\"\n          [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n          [caseDefinitionVersionTag]=\"caseDefinitionVersionTag$ | async\"\n          [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n          [defaultValue]=\"searchObs.searchField?.path\"\n          [disabled]=\"obs.disableInput\"\n        ></valtimo-value-path-selector>\n\n        <v-select\n          *ngIf=\"dataTypeItems$ | async as dataTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"dataTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.dataType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"dataType\"\n          [defaultSelectionId]=\"searchObs.searchField?.dataType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-dataTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"(showMatchTypes$ | async) && (matchTypeItems$ | async) as matchTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"matchTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.matchType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"matchType\"\n          [defaultSelectionId]=\"searchObs.searchField?.matchType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-matchTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"fieldTypeItems$ | async as fieldTypeItems\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"fieldTypeItems\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.fieldType' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"true\"\n          name=\"fieldType\"\n          [defaultSelectionId]=\"searchObs.searchField?.fieldType\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-fieldTypes\"\n        ></v-select>\n\n        <v-select\n          *ngIf=\"\n            (fieldTypeIsDropdown$ | async) &&\n            (dropdownDataProviderNames$ | async) as dropdownDataProviderNames\n          \"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          [items]=\"dropdownDataProviderNames\"\n          [placeholder]=\"'searchFieldsOverview.searchFieldPlaceholder' | translate\"\n          [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n          [disabled]=\"obs.disableInput\"\n          [margin]=\"true\"\n          [required]=\"false\"\n          name=\"dropdownDataProvider\"\n          [defaultSelectionId]=\"searchObs.searchField?.dropdownDataProvider\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n          [carbonTheme]=\"CARBON_THEME\"\n          dataTestId=\"case-management-search-dropdownDataProvider\"\n        ></v-select>\n\n        <valtimo-carbon-multi-input\n          *ngIf=\"\n            (showInputDropdownTable$ | async) &&\n            (initialDropdownValues$ | async) as initialDropdownValues\n          \"\n          name=\"dropdownValues\"\n          [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n          type=\"keyValue\"\n          [disabled]=\"obs.disableInput\"\n          [defaultValues]=\"initialDropdownValues\"\n          [margin]=\"true\"\n          [required]=\"false\"\n          [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n          (valueChange)=\"dropdownDatalistChange($event)\"\n          [carbonTheme]=\"CARBON_THEME\"\n        >\n        </valtimo-carbon-multi-input>\n\n        <v-table\n          *ngIf=\"\n            (showReadonlyDropdownTable$ | async) &&\n            (initialDropdownValues$ | async) as initialDropdownValues\n          \"\n          [items]=\"initialDropdownValues\"\n          [columns]=\"dropdownColumns$ | async\"\n          [showEditButtons]=\"false\"\n          [itemsTranslationKey]=\"'searchFieldsOverview'\"\n          [showPagination]=\"false\"\n          [mobileBreakpointPx]=\"200\"\n          [carbonTheme]=\"CARBON_THEME\"\n        ></v-table>\n      </v-form>\n    </section>\n\n    <cds-modal-footer>\n      <ng-container *ngTemplateOutlet=\"buttonsFooterModal; context: {obs: obs}\"></ng-container>\n    </cds-modal-footer>\n  </cds-modal>\n</ng-template>\n\n<ng-template #buttonsFooterModal let-obs=\"obs\">\n  <button\n    data-test-id=\"case-management-search-close\"\n    cdsButton=\"secondary\"\n    (click)=\"onModalClose()\"\n    [disabled]=\"obs.disableInput\"\n  >\n    {{ 'interface.cancel' | translate }}\n  </button>\n\n  <button\n    data-test-id=\"case-management-search-save\"\n    cdsButton=\"primary\"\n    [disabled]=\"obs.disableInput || !obs.valid\"\n    (click)=\"saveSearchField(obs.caseDefinitionKey)\"\n  >\n    {{ (searchFieldActionTypeIsAdd ? 'interface.create' : 'interface.save') | translate }}\n  </button>\n</ng-template>\n\n<ng-template #viewToggle>\n  <cds-tooltip [description]=\"'JSON editor'\">\n    <button\n      [cdsButton]=\"buttonTheme()\"\n      data-test-id=\"case-management-search-fields-switch-view\"\n      iconOnly=\"true\"\n      (click)=\"switchView()\"\n    >\n      <svg cdsIcon=\"code\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n</ng-template>\n\n<ng-template #downloadButton let-obs=\"obs\">\n  <button\n    cdsButton=\"ghost\"\n    iconOnly=\"true\"\n    data-test-id=\"case-management-search-download\"\n    [disabled]=\"\n      !obs.downloadUrl || !obs.downloadName || obs.searchFields?.length <= 0 || obs.disableInput\n    \"\n    (click)=\"onDownloadClick()\"\n  >\n    <svg cdsIcon=\"download\" size=\"16\"></svg>\n  </button>\n</ng-template>\n", styles: ["valtimo-list::ng-deep table{border-top:1px solid rgba(0,0,0,.125)}.case-management-search-fields__buttons{display:flex;gap:16px}.case-management-search-fields__buttons .center-link{display:flex;align-items:center}.case-management-search-fields__move-buttons{width:100%;justify-content:flex-end;display:flex;flex-direction:row;position:relative}.case-management-search-fields__move-buttons button:not(:last-child){margin-right:8px}.list-actions{width:1px}.modal-header::ng-deep{background-color:#f3f4f7}::ng-deep .tab-container{min-height:unset!important}::ng-deep .cds--tab-content{padding-top:0!important}\n/*!\n * Copyright 2015-2025 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: () => [{ type: i1$2.DocumentService }, { type: i2$2.ActivatedRoute }, { type: i3.TranslateService }, { type: i2.IconService }, { type: i2$1.EditPermissionsService }] });
 
 /*
@@ -3339,11 +3339,11 @@ class CaseManagementListColumnsComponent {
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementListColumnsComponent, deps: [{ token: i1$2.DocumentService }, { token: i2$2.ActivatedRoute }, { token: i3.TranslateService }, { token: i2.IconService }, { token: i2$1.EditPermissionsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CaseManagementListColumnsComponent, isStandalone: false, selector: "valtimo-case-management-list-columns", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    caseListColumn: translatedCaseListColumns$ | async,\n    disableInput: disableInput$ | async,\n    downloadName: downloadName$ | async,\n    downloadUrl: downloadUrl$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n    jsonEditorModel: jsonEditorModel$ | async,\n    loadingCaseListColumns: loadingCaseListColumns$ | async,\n    params: params$ | async,\n  } as obs\"\n>\n  <ng-container *ngTemplateOutlet=\"content; context: {obs: obs}\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"createEditModal\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"deleteModal\"></ng-container>\n</ng-container>\n\n<ng-template #content let-obs=\"obs\">\n  @if (!jsonEditorActive()) {\n    <valtimo-carbon-list\n      [actionItems]=\"actionItems\"\n      [loading]=\"obs.loadingCaseListColumns\"\n      [items]=\"obs?.caseListColumn || []\"\n      [fields]=\"fields\"\n      [viewMode]=\"false\"\n      [header]=\"false\"\n      (rowClicked)=\"columnRowClicked($event)\"\n      [dragAndDrop]=\"true\"\n      [dragAndDropDisabled]=\"obs.disableInput\"\n      (itemsReordered)=\"onItemsReordered(obs.params.caseDefinitionKey, $event)\"\n      [attr.data-test-id]=\"testIds.columnsList\"\n    >\n      <ng-container\n        carbonToolbarContent\n        *ngTemplateOutlet=\"buttons; context: {obs: obs}\"\n      ></ng-container>\n\n      <valtimo-no-results\n        [title]=\"'listColumn.noConfigWarningTitle' | translate\"\n        [description]=\"'listColumn.noConfigWarning' | translate\"\n        illustration=\"valtimo-layout/img/emptystate-empty.svg\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  } @else {\n    <valtimo-json-editor\n      [model]=\"obs.jsonEditorModel\"\n      [fitPage]=\"true\"\n      [showEditButton]=\"obs.hasEditPermissions\"\n      (saveEvent)=\"updateCaseListColumns(obs.params.caseDefinitionKey, $event)\"\n      [attr.data-test-id]=\"testIds.jsonEditor\"\n    >\n      <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n      <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n    </valtimo-json-editor>\n  }\n</ng-template>\n\n<ng-template #buttons let-obs=\"obs\">\n  <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n\n  <button\n    *ngIf=\"obs.hasEditPermissions\"\n    (click)=\"openModal('create')\"\n    cdsButton=\"primary\"\n    [disabled]=\"obs.loadingCaseListColumns || !(hasEditPermissions$ | async)\"\n    [attr.data-test-id]=\"testIds.addListColumn\"\n  >\n    {{ 'listColumn.addButtonText' | translate }}\n    <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n  </button>\n</ng-template>\n\n<ng-template #noConfigWarning>\n  <div class=\"pl-2 pr-2 pb-2 pt-2\">\n    <cds-notification\n      [notificationObj]=\"{\n        type: 'info',\n        title: 'listColumn.noConfigWarningTitle' | translate,\n        message: 'listColumn.noConfigWarning' | translate,\n        showClose: false,\n      }\"\n    >\n    </cds-notification>\n  </div>\n</ng-template>\n\n<ng-template #createEditModal>\n  <cds-modal\n    valtimoCdsModal\n    *ngIf=\"{\n      type: currentModalType$ | async,\n      show: showModal$ | async,\n      valid: valid$ | async,\n      disableInput: disableInput$ | async,\n      validKey: validKey$ | async,\n      disableDefaultSort: disableDefaultSort$ | async,\n      showEnum: showEnum$ | async,\n      isYesNo: isYesNo$ | async,\n      showTagAmount: showTagAmount$ | async,\n      params: params$ | async,\n    } as modalObs\"\n    [open]=\"modalObs.show\"\n    size=\"sm\"\n    (close)=\"closeModal()\"\n  >\n    <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\" [cdsLayer]=\"1\">\n      <h3 cdsModalHeaderHeading>\n        {{\n          modalObs.type === 'create'\n            ? ('listColumn.addButtonText' | translate)\n            : ('listColumn.editColumnTitle' | translate)\n        }}\n      </h3>\n    </cds-modal-header>\n\n    <section cdsModalContent [cdsLayer]=\"1\">\n      <ng-container *ngTemplateOutlet=\"modalContent; context: {modalObs: modalObs}\"></ng-container>\n    </section>\n    <ng-container *ngTemplateOutlet=\"modalFooter; context: {modalObs: modalObs}\"></ng-container>\n  </cds-modal>\n</ng-template>\n\n<ng-template #modalContent let-modalObs=\"modalObs\">\n  <form [formGroup]=\"formGroup\" class=\"list-column-form\">\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.titleTitle' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.titleTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.title\" />\n    </cds-label>\n\n    <cds-label\n      [disabled]=\"modalObs.disableInput || modalObs.type === 'edit'\"\n      [invalid]=\"modalObs.validKey === false\"\n      [invalidText]=\"'listColumn.uniqueKeyWarning' | translate\"\n    >\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.key' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.keyTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input\n        cdsText\n        formControlName=\"key\"\n        [invalid]=\"modalObs.validKey === false\"\n        [attr.data-test-id]=\"testIds.key\"\n      />\n    </cds-label>\n\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.path' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.pathTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <valtimo-value-path-selector\n        formControlName=\"path\"\n        [caseDefinitionKey]=\"modalObs.params?.caseDefinitionKey\"\n        [caseDefinitionVersionTag]=\"modalObs.params?.caseDefinitionVersionTag\"\n        [excludePrefixes]=\"[ValuePathSelectorPrefix.TASK]\"\n        [attr.data-test-id]=\"testIds.valuePathSelector\"\n      ></valtimo-value-path-selector>\n    </cds-label>\n\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.displayType' | translate }}\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.displayTypeTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-dropdown\n        formControlName=\"displayType\"\n        [disabled]=\"modalObs.disableInput\"\n        (selected)=\"selectedDisplayType($event)\"\n        [attr.data-test-id]=\"testIds.displayType\"\n      >\n        <cds-dropdown-list [items]=\"(viewTypeItems$ | async) || []\"></cds-dropdown-list>\n      </cds-dropdown>\n    </cds-label>\n\n    <cds-label *ngIf=\"modalObs.showTagAmount\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.tagAmount' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.tagAmountTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-number\n        formControlName=\"tagAmount\"\n        [min]=\"1\"\n        [step]=\"1\"\n        [attr.data-test-id]=\"testIds.tagAmount\"\n      ></cds-number>\n    </cds-label>\n\n    <cds-label *ngIf=\"showDateFormat$ | async\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.dateFormat' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.dateFormatTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input cdsText formControlName=\"dateFormat\" [attr.data-test-id]=\"testIds.dateFormat\" />\n    </cds-label>\n\n    <cds-label *ngIf=\"modalObs.showEnum || modalObs.isYesNo\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{\n          modalObs.isYesNo\n            ? ('listColumn.enumTitleOptional' | translate)\n            : ('listColumn.enumTitle' | translate)\n        }}\n\n        <v-tooltip-icon\n          [tooltip]=\"\n            modalObs.isYesNo\n              ? ('listColumn.enumTooltipOptional' | translate)\n              : ('listColumn.enumTooltip' | translate)\n          \"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <valtimo-carbon-multi-input\n        *ngIf=\"(showModal$ | async) || (modalShowing$ | async)\"\n        type=\"keyValue\"\n        (valueChange)=\"enumValueChange($event)\"\n        [defaultValues]=\"defaultEnumValues$ | async\"\n        [hideAddButton]=\"modalObs.isYesNo\"\n        [hideDeleteButton]=\"modalObs.isYesNo\"\n        [maxRows]=\"modalObs.isYesNo ? 1 : null\"\n        [keyColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.Yes' | translate)\"\n        [valueColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.No' | translate)\"\n        [attr.data-test-id]=\"testIds.multiInput\"\n      ></valtimo-carbon-multi-input>\n    </cds-label>\n\n    <cds-checkbox\n      *ngIf=\"displaySortable\"\n      formControlName=\"sortable\"\n      [disabled]=\"modalObs.showTagAmount || modalObs.disableInput\"\n      [attr.data-test-id]=\"testIds.sortableCheckbox\"\n      >{{ 'listColumn.sortable' | translate }}\n    </cds-checkbox>\n\n    <cds-label\n      *ngIf=\"displaySortable\"\n      [disabled]=\"modalObs.disableInput || modalObs.disableDefaultSort || modalObs.showTagAmount\"\n    >\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.defaultSortTitle' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.defaultSortTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-dropdown\n        formControlName=\"defaultSort\"\n        [disabled]=\"modalObs.disableInput || modalObs.disableDefaultSort || modalObs.showTagAmount\"\n        [attr.data-test-id]=\"testIds.defaultSort\"\n      >\n        <cds-dropdown-list [items]=\"(sortItems$ | async) || []\"></cds-dropdown-list>\n      </cds-dropdown>\n\n      <cds-inline-notification\n        *ngIf=\"modalObs.disableDefaultSort && !modalObs.disableInput && !modalObs.showTagAmount\"\n        class=\"default-sort-disabled-notice\"\n        [notificationObj]=\"{\n          type: 'info',\n          title: '',\n          message: ('listColumn.defaultSortDisabledNotice' | translate),\n          showClose: false,\n          lowContrast: true\n        }\"\n      ></cds-inline-notification>\n    </cds-label>\n\n    <cds-label *ngIf=\"displayExportButton\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.exportField' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.exportTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-toggle\n        formControlName=\"exportable\"\n        data-testid=\"export-selector-toggle\"\n        [onText]=\"'listColumn.sortableYes' | translate\"\n        [offText]=\"'listColumn.sortableNo' | translate\"\n        [keyColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.Yes' | translate)\"\n        [valueColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.No' | translate)\"\n        [required]=\"false\"\n        [size]=\"'sm'\"\n        [attr.data-test-id]=\"testIds.exportable\"\n      ></cds-toggle>\n    </cds-label>\n  </form>\n</ng-template>\n\n<ng-template #modalFooter let-modalObs=\"modalObs\">\n  <cds-modal-footer [cdsLayer]=\"1\">\n    <ng-container>\n      <button\n        cdsButton=\"secondary\"\n        [attr.modal-primary-focus]=\"true\"\n        (click)=\"closeModal()\"\n        [disabled]=\"modalObs.disableInput\"\n        [attr.data-test-id]=\"testIds.cancelButton\"\n      >\n        {{ 'listColumn.close' | translate }}\n      </button>\n\n      <button\n        cdsButton=\"primary\"\n        [attr.modal-primary-focus]=\"true\"\n        [disabled]=\"modalObs.valid === false\"\n        (click)=\"saveCaseListColumns()\"\n        [disabled]=\"\n          modalObs.disableInput || modalObs.valid === false || modalObs.validKey === false\n        \"\n        [attr.data-test-id]=\"testIds.saveButton\"\n      >\n        {{ 'listColumn.save' | translate }}\n      </button>\n    </ng-container>\n  </cds-modal-footer>\n</ng-template>\n\n<ng-template #deleteModal>\n  <valtimo-confirmation-modal\n    [showModalSubject$]=\"showDeleteModal$\"\n    [outputOnConfirm]=\"deleteRowKey$ | async\"\n    (confirmEvent)=\"deleteRowConfirmation($event)\"\n    confirmButtonTextTranslationKey=\"listColumn.deleteColumn\"\n    titleTranslationKey=\"listColumn.deleteColumn\"\n    contentTranslationKey=\"listColumn.deleteColumnConfirmation\"\n    [attr.data-test-id]=\"testIds.confirmationModal\"\n  ></valtimo-confirmation-modal>\n</ng-template>\n\n<ng-template #viewToggle>\n  <cds-tooltip [description]=\"'JSON editor'\">\n    <button\n      [cdsButton]=\"buttonTheme()\"\n      [attr.data-test-id]=\"testIds.switchView\"\n      iconOnly=\"true\"\n      (click)=\"switchView()\"\n    >\n      <svg cdsIcon=\"code\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n</ng-template>\n\n<ng-template #downloadButton let-obs=\"obs\">\n  <button\n    cdsButton=\"ghost\"\n    iconOnly=\"true\"\n    (click)=\"onDownloadClick()\"\n    [disabled]=\"\n      !obs.downloadUrl ||\n      !obs.downloadName ||\n      obs.caseListColumn?.length < 1 ||\n      obs.disableInput ||\n      obs.loadingCaseListColumns\n    \"\n    [attr.data-test-id]=\"testIds.downloadButton\"\n  >\n    <svg cdsIcon=\"download\" size=\"16\"></svg>\n  </button>\n</ng-template>\n", styles: ["::ng-deep .tab-container{min-height:unset!important}::ng-deep .cds--inline-notification{max-width:100%}.default-sort-disabled-notice{display:block;margin-top:.5rem}::ng-deep .cds--label{width:100%}.label-with-tooltip{display:flex;align-items:center}.display-type-dropdown{width:300px}.list-column-form{display:flex;flex-direction:column;gap:16px;margin-bottom:3rem}.select-label{padding-bottom:.5rem;width:250px}.center-link{display:flex;align-items:center}.case-list-columns__actions{display:flex;gap:8px}.list-columns__buttons{display:flex;gap:16px;flex-direction:row;justify-content:flex-end}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "component", type: i2.Notification, selector: "cds-notification, cds-inline-notification, ibm-notification, ibm-inline-notification", inputs: ["notificationObj"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "component", type: i2.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "component", type: i7.TooltipIconComponent, selector: "v-tooltip-icon", inputs: ["tooltip", "disabled"] }, { kind: "component", type: i7.CarbonMultiInputComponent, selector: "valtimo-carbon-multi-input", inputs: ["addRowText", "addButtonType", "addRowTranslationKey", "arbitraryAmountTitles", "arbitraryValueAmount", "defaultValues", "deleteRowText", "deleteRowTranslationKey", "disabled", "dropdownColumnTitle", "dropdownItems", "dropdownWidth", "fullWidth", "hideAddButton", "hideDeleteButton", "initialAmountOfRows", "keyColumnTitle", "margin", "maxRows", "minimumAmountOfRows", "name", "required", "title", "titleTranslationKey", "tooltip", "type", "valueColumnTitle", "valuePathSelectorCaseDefinitionKey", "valuePathSelectorPrefixes", "valuePathSelectorShowCaseDefinitionSelector", "valuePathSelectorNotation", "keyColumnFlex", "dropdownColumnFlex", "valueColumnFlex"], outputs: ["valueChange", "allValuesValidEvent"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "component", type: i2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "component", type: i7.ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "excludePrefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: i2.NumberComponent, selector: "cds-number, ibm-number", inputs: ["readonly", "theme", "disabled", "skeleton", "invalid", "id", "placeholder", "size", "required", "value", "min", "max", "label", "helperText", "invalidText", "step", "precision", "warn", "warnText", "ariaLabel", "decrementLabel", "incrementLabel", "fluid"], outputs: ["change"] }, { kind: "component", type: i7.JsonEditorComponent, selector: "valtimo-json-editor", inputs: ["disabled", "model", "editorOptions", "fitPage", "formatOnLoad", "heightPx", "heightStyle", "jsonSchema", "showEditButton", "widthPx"], outputs: ["changeEvent", "discardEvent", "keepEditingEvent", "saveEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CaseManagementListColumnsComponent, isStandalone: false, selector: "valtimo-case-management-list-columns", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    caseListColumn: translatedCaseListColumns$ | async,\n    disableInput: disableInput$ | async,\n    downloadName: downloadName$ | async,\n    downloadUrl: downloadUrl$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n    jsonEditorModel: jsonEditorModel$ | async,\n    loadingCaseListColumns: loadingCaseListColumns$ | async,\n    params: params$ | async,\n  } as obs\"\n>\n  <ng-container *ngTemplateOutlet=\"content; context: {obs: obs}\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"createEditModal\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"deleteModal\"></ng-container>\n</ng-container>\n\n<ng-template #content let-obs=\"obs\">\n  @if (!jsonEditorActive()) {\n    <valtimo-carbon-list\n      [actionItems]=\"actionItems\"\n      [loading]=\"obs.loadingCaseListColumns\"\n      [items]=\"obs?.caseListColumn || []\"\n      [fields]=\"fields\"\n      [viewMode]=\"false\"\n      [header]=\"false\"\n      (rowClicked)=\"columnRowClicked($event)\"\n      [dragAndDrop]=\"true\"\n      [dragAndDropDisabled]=\"obs.disableInput\"\n      (itemsReordered)=\"onItemsReordered(obs.params.caseDefinitionKey, $event)\"\n      [attr.data-test-id]=\"testIds.columnsList\"\n    >\n      <ng-container\n        carbonToolbarContent\n        *ngTemplateOutlet=\"buttons; context: {obs: obs}\"\n      ></ng-container>\n\n      <valtimo-no-results\n        [title]=\"'listColumn.noConfigWarningTitle' | translate\"\n        [description]=\"'listColumn.noConfigWarning' | translate\"\n        illustration=\"valtimo-layout/img/emptystate-empty.svg\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  } @else {\n    <valtimo-json-editor\n      [model]=\"obs.jsonEditorModel\"\n      [fitPage]=\"true\"\n      [showEditButton]=\"obs.hasEditPermissions\"\n      (saveEvent)=\"updateCaseListColumns(obs.params.caseDefinitionKey, $event)\"\n      [attr.data-test-id]=\"testIds.jsonEditor\"\n    >\n      <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n      <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n    </valtimo-json-editor>\n  }\n</ng-template>\n\n<ng-template #buttons let-obs=\"obs\">\n  <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n\n  <button\n    *ngIf=\"obs.hasEditPermissions\"\n    (click)=\"openModal('create')\"\n    cdsButton=\"primary\"\n    [disabled]=\"obs.loadingCaseListColumns || !(hasEditPermissions$ | async)\"\n    [attr.data-test-id]=\"testIds.addListColumn\"\n  >\n    {{ 'listColumn.addButtonText' | translate }}\n    <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n  </button>\n</ng-template>\n\n<ng-template #noConfigWarning>\n  <div class=\"pl-2 pr-2 pb-2 pt-2\">\n    <cds-notification\n      [notificationObj]=\"{\n        type: 'info',\n        title: 'listColumn.noConfigWarningTitle' | translate,\n        message: 'listColumn.noConfigWarning' | translate,\n        showClose: false,\n      }\"\n    >\n    </cds-notification>\n  </div>\n</ng-template>\n\n<ng-template #createEditModal>\n  <cds-modal\n    valtimoCdsModal\n    *ngIf=\"{\n      type: currentModalType$ | async,\n      show: showModal$ | async,\n      valid: valid$ | async,\n      disableInput: disableInput$ | async,\n      validKey: validKey$ | async,\n      disableDefaultSort: disableDefaultSort$ | async,\n      showEnum: showEnum$ | async,\n      isYesNo: isYesNo$ | async,\n      showTagAmount: showTagAmount$ | async,\n      params: params$ | async,\n    } as modalObs\"\n    [open]=\"modalObs.show\"\n    size=\"sm\"\n    (close)=\"closeModal()\"\n  >\n    <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\" [cdsLayer]=\"1\">\n      <h3 cdsModalHeaderHeading>\n        {{\n          modalObs.type === 'create'\n            ? ('listColumn.addButtonText' | translate)\n            : ('listColumn.editColumnTitle' | translate)\n        }}\n      </h3>\n    </cds-modal-header>\n\n    <section cdsModalContent [cdsLayer]=\"1\">\n      <ng-container *ngTemplateOutlet=\"modalContent; context: {modalObs: modalObs}\"></ng-container>\n    </section>\n    <ng-container *ngTemplateOutlet=\"modalFooter; context: {modalObs: modalObs}\"></ng-container>\n  </cds-modal>\n</ng-template>\n\n<ng-template #modalContent let-modalObs=\"modalObs\">\n  <form [formGroup]=\"formGroup\" class=\"list-column-form\">\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.titleTitle' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.titleTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.title\" />\n    </cds-label>\n\n    <cds-label\n      [disabled]=\"modalObs.disableInput || modalObs.type === 'edit'\"\n      [invalid]=\"modalObs.validKey === false\"\n      [invalidText]=\"'listColumn.uniqueKeyWarning' | translate\"\n    >\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.key' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.keyTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input\n        cdsText\n        formControlName=\"key\"\n        [invalid]=\"modalObs.validKey === false\"\n        [attr.data-test-id]=\"testIds.key\"\n      />\n    </cds-label>\n\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.path' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.pathTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <valtimo-value-path-selector\n        formControlName=\"path\"\n        [caseDefinitionKey]=\"modalObs.params?.caseDefinitionKey\"\n        [caseDefinitionVersionTag]=\"modalObs.params?.caseDefinitionVersionTag\"\n        [excludePrefixes]=\"[ValuePathSelectorPrefix.TASK]\"\n        [attr.data-test-id]=\"testIds.valuePathSelector\"\n      ></valtimo-value-path-selector>\n    </cds-label>\n\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.displayType' | translate }}\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.displayTypeTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-dropdown\n        formControlName=\"displayType\"\n        [disabled]=\"modalObs.disableInput\"\n        (selected)=\"selectedDisplayType($event)\"\n        [attr.data-test-id]=\"testIds.displayType\"\n      >\n        <cds-dropdown-list [items]=\"(viewTypeItems$ | async) || []\"></cds-dropdown-list>\n      </cds-dropdown>\n    </cds-label>\n\n    <cds-label *ngIf=\"modalObs.showTagAmount\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.tagAmount' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.tagAmountTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-number\n        formControlName=\"tagAmount\"\n        [min]=\"1\"\n        [step]=\"1\"\n        [attr.data-test-id]=\"testIds.tagAmount\"\n      ></cds-number>\n    </cds-label>\n\n    <cds-label *ngIf=\"showDateFormat$ | async\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.dateFormat' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.dateFormatTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input cdsText formControlName=\"dateFormat\" [attr.data-test-id]=\"testIds.dateFormat\" />\n    </cds-label>\n\n    <cds-label *ngIf=\"modalObs.showEnum || modalObs.isYesNo\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{\n          modalObs.isYesNo\n            ? ('listColumn.enumTitleOptional' | translate)\n            : ('listColumn.enumTitle' | translate)\n        }}\n\n        <v-tooltip-icon\n          [tooltip]=\"\n            modalObs.isYesNo\n              ? ('listColumn.enumTooltipOptional' | translate)\n              : ('listColumn.enumTooltip' | translate)\n          \"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <valtimo-carbon-multi-input\n        *ngIf=\"(showModal$ | async) || (modalShowing$ | async)\"\n        type=\"keyValue\"\n        (valueChange)=\"enumValueChange($event)\"\n        [defaultValues]=\"defaultEnumValues$ | async\"\n        [hideAddButton]=\"modalObs.isYesNo\"\n        [hideDeleteButton]=\"modalObs.isYesNo\"\n        [maxRows]=\"modalObs.isYesNo ? 1 : null\"\n        [keyColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.Yes' | translate)\"\n        [valueColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.No' | translate)\"\n        [attr.data-test-id]=\"testIds.multiInput\"\n      ></valtimo-carbon-multi-input>\n    </cds-label>\n\n    <cds-checkbox\n      *ngIf=\"displaySortable\"\n      formControlName=\"sortable\"\n      [disabled]=\"modalObs.showTagAmount || modalObs.disableInput\"\n      [attr.data-test-id]=\"testIds.sortableCheckbox\"\n      >{{ 'listColumn.sortable' | translate }}\n    </cds-checkbox>\n\n    <cds-label\n      *ngIf=\"displaySortable\"\n      [disabled]=\"modalObs.disableInput || modalObs.disableDefaultSort || modalObs.showTagAmount\"\n    >\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.defaultSortTitle' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.defaultSortTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-dropdown\n        formControlName=\"defaultSort\"\n        [disabled]=\"modalObs.disableInput || modalObs.disableDefaultSort || modalObs.showTagAmount\"\n        [attr.data-test-id]=\"testIds.defaultSort\"\n      >\n        <cds-dropdown-list [items]=\"(sortItems$ | async) || []\"></cds-dropdown-list>\n      </cds-dropdown>\n\n      <cds-inline-notification\n        *ngIf=\"modalObs.disableDefaultSort && !modalObs.disableInput && !modalObs.showTagAmount\"\n        class=\"default-sort-disabled-notice\"\n        [notificationObj]=\"{\n          type: 'info',\n          title: '',\n          message: ('listColumn.defaultSortDisabledNotice' | translate),\n          showClose: false,\n          lowContrast: true\n        }\"\n      ></cds-inline-notification>\n    </cds-label>\n\n    <cds-label *ngIf=\"displayExportButton\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.exportField' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.exportTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-toggle\n        formControlName=\"exportable\"\n        data-testid=\"export-selector-toggle\"\n        [onText]=\"'listColumn.sortableYes' | translate\"\n        [offText]=\"'listColumn.sortableNo' | translate\"\n        [keyColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.Yes' | translate)\"\n        [valueColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.No' | translate)\"\n        [required]=\"false\"\n        [size]=\"'sm'\"\n        [attr.data-test-id]=\"testIds.exportable\"\n      ></cds-toggle>\n    </cds-label>\n  </form>\n</ng-template>\n\n<ng-template #modalFooter let-modalObs=\"modalObs\">\n  <cds-modal-footer [cdsLayer]=\"1\">\n    <ng-container>\n      <button\n        cdsButton=\"secondary\"\n        [attr.modal-primary-focus]=\"true\"\n        (click)=\"closeModal()\"\n        [disabled]=\"modalObs.disableInput\"\n        [attr.data-test-id]=\"testIds.cancelButton\"\n      >\n        {{ 'listColumn.close' | translate }}\n      </button>\n\n      <button\n        cdsButton=\"primary\"\n        [attr.modal-primary-focus]=\"true\"\n        [disabled]=\"modalObs.valid === false\"\n        (click)=\"saveCaseListColumns()\"\n        [disabled]=\"\n          modalObs.disableInput || modalObs.valid === false || modalObs.validKey === false\n        \"\n        [attr.data-test-id]=\"testIds.saveButton\"\n      >\n        {{ (modalObs.type === 'create' ? 'interface.create' : 'listColumn.save') | translate }}\n      </button>\n    </ng-container>\n  </cds-modal-footer>\n</ng-template>\n\n<ng-template #deleteModal>\n  <valtimo-confirmation-modal\n    [showModalSubject$]=\"showDeleteModal$\"\n    [outputOnConfirm]=\"deleteRowKey$ | async\"\n    (confirmEvent)=\"deleteRowConfirmation($event)\"\n    confirmButtonTextTranslationKey=\"listColumn.deleteColumn\"\n    titleTranslationKey=\"listColumn.deleteColumn\"\n    contentTranslationKey=\"listColumn.deleteColumnConfirmation\"\n    [attr.data-test-id]=\"testIds.confirmationModal\"\n  ></valtimo-confirmation-modal>\n</ng-template>\n\n<ng-template #viewToggle>\n  <cds-tooltip [description]=\"'JSON editor'\">\n    <button\n      [cdsButton]=\"buttonTheme()\"\n      [attr.data-test-id]=\"testIds.switchView\"\n      iconOnly=\"true\"\n      (click)=\"switchView()\"\n    >\n      <svg cdsIcon=\"code\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n</ng-template>\n\n<ng-template #downloadButton let-obs=\"obs\">\n  <button\n    cdsButton=\"ghost\"\n    iconOnly=\"true\"\n    (click)=\"onDownloadClick()\"\n    [disabled]=\"\n      !obs.downloadUrl ||\n      !obs.downloadName ||\n      obs.caseListColumn?.length < 1 ||\n      obs.disableInput ||\n      obs.loadingCaseListColumns\n    \"\n    [attr.data-test-id]=\"testIds.downloadButton\"\n  >\n    <svg cdsIcon=\"download\" size=\"16\"></svg>\n  </button>\n</ng-template>\n", styles: ["::ng-deep .tab-container{min-height:unset!important}::ng-deep .cds--inline-notification{max-width:100%}.default-sort-disabled-notice{display:block;margin-top:.5rem}::ng-deep .cds--label{width:100%}.label-with-tooltip{display:flex;align-items:center}.display-type-dropdown{width:300px}.list-column-form{display:flex;flex-direction:column;gap:16px;margin-bottom:3rem}.select-label{padding-bottom:.5rem;width:250px}.center-link{display:flex;align-items:center}.case-list-columns__actions{display:flex;gap:8px}.list-columns__buttons{display:flex;gap:16px;flex-direction:row;justify-content:flex-end}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "component", type: i2.Notification, selector: "cds-notification, cds-inline-notification, ibm-notification, ibm-inline-notification", inputs: ["notificationObj"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "component", type: i2.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "component", type: i7.TooltipIconComponent, selector: "v-tooltip-icon", inputs: ["tooltip", "disabled"] }, { kind: "component", type: i7.CarbonMultiInputComponent, selector: "valtimo-carbon-multi-input", inputs: ["addRowText", "addButtonType", "addRowTranslationKey", "arbitraryAmountTitles", "arbitraryValueAmount", "defaultValues", "deleteRowText", "deleteRowTranslationKey", "disabled", "dropdownColumnTitle", "dropdownItems", "dropdownWidth", "fullWidth", "hideAddButton", "hideDeleteButton", "initialAmountOfRows", "keyColumnTitle", "margin", "maxRows", "minimumAmountOfRows", "name", "required", "title", "titleTranslationKey", "tooltip", "type", "valueColumnTitle", "valuePathSelectorCaseDefinitionKey", "valuePathSelectorPrefixes", "valuePathSelectorShowCaseDefinitionSelector", "valuePathSelectorNotation", "keyColumnFlex", "dropdownColumnFlex", "valueColumnFlex"], outputs: ["valueChange", "allValuesValidEvent"] }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "component", type: i2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "component", type: i7.ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "excludePrefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: i2.NumberComponent, selector: "cds-number, ibm-number", inputs: ["readonly", "theme", "disabled", "skeleton", "invalid", "id", "placeholder", "size", "required", "value", "min", "max", "label", "helperText", "invalidText", "step", "precision", "warn", "warnText", "ariaLabel", "decrementLabel", "incrementLabel", "fluid"], outputs: ["change"] }, { kind: "component", type: i7.JsonEditorComponent, selector: "valtimo-json-editor", inputs: ["disabled", "model", "editorOptions", "fitPage", "formatOnLoad", "heightPx", "heightStyle", "jsonSchema", "showEditButton", "widthPx"], outputs: ["changeEvent", "discardEvent", "keepEditingEvent", "saveEvent"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementListColumnsComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'valtimo-case-management-list-columns', template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    caseListColumn: translatedCaseListColumns$ | async,\n    disableInput: disableInput$ | async,\n    downloadName: downloadName$ | async,\n    downloadUrl: downloadUrl$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n    jsonEditorModel: jsonEditorModel$ | async,\n    loadingCaseListColumns: loadingCaseListColumns$ | async,\n    params: params$ | async,\n  } as obs\"\n>\n  <ng-container *ngTemplateOutlet=\"content; context: {obs: obs}\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"createEditModal\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"deleteModal\"></ng-container>\n</ng-container>\n\n<ng-template #content let-obs=\"obs\">\n  @if (!jsonEditorActive()) {\n    <valtimo-carbon-list\n      [actionItems]=\"actionItems\"\n      [loading]=\"obs.loadingCaseListColumns\"\n      [items]=\"obs?.caseListColumn || []\"\n      [fields]=\"fields\"\n      [viewMode]=\"false\"\n      [header]=\"false\"\n      (rowClicked)=\"columnRowClicked($event)\"\n      [dragAndDrop]=\"true\"\n      [dragAndDropDisabled]=\"obs.disableInput\"\n      (itemsReordered)=\"onItemsReordered(obs.params.caseDefinitionKey, $event)\"\n      [attr.data-test-id]=\"testIds.columnsList\"\n    >\n      <ng-container\n        carbonToolbarContent\n        *ngTemplateOutlet=\"buttons; context: {obs: obs}\"\n      ></ng-container>\n\n      <valtimo-no-results\n        [title]=\"'listColumn.noConfigWarningTitle' | translate\"\n        [description]=\"'listColumn.noConfigWarning' | translate\"\n        illustration=\"valtimo-layout/img/emptystate-empty.svg\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  } @else {\n    <valtimo-json-editor\n      [model]=\"obs.jsonEditorModel\"\n      [fitPage]=\"true\"\n      [showEditButton]=\"obs.hasEditPermissions\"\n      (saveEvent)=\"updateCaseListColumns(obs.params.caseDefinitionKey, $event)\"\n      [attr.data-test-id]=\"testIds.jsonEditor\"\n    >\n      <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n      <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n    </valtimo-json-editor>\n  }\n</ng-template>\n\n<ng-template #buttons let-obs=\"obs\">\n  <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n\n  <button\n    *ngIf=\"obs.hasEditPermissions\"\n    (click)=\"openModal('create')\"\n    cdsButton=\"primary\"\n    [disabled]=\"obs.loadingCaseListColumns || !(hasEditPermissions$ | async)\"\n    [attr.data-test-id]=\"testIds.addListColumn\"\n  >\n    {{ 'listColumn.addButtonText' | translate }}\n    <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n  </button>\n</ng-template>\n\n<ng-template #noConfigWarning>\n  <div class=\"pl-2 pr-2 pb-2 pt-2\">\n    <cds-notification\n      [notificationObj]=\"{\n        type: 'info',\n        title: 'listColumn.noConfigWarningTitle' | translate,\n        message: 'listColumn.noConfigWarning' | translate,\n        showClose: false,\n      }\"\n    >\n    </cds-notification>\n  </div>\n</ng-template>\n\n<ng-template #createEditModal>\n  <cds-modal\n    valtimoCdsModal\n    *ngIf=\"{\n      type: currentModalType$ | async,\n      show: showModal$ | async,\n      valid: valid$ | async,\n      disableInput: disableInput$ | async,\n      validKey: validKey$ | async,\n      disableDefaultSort: disableDefaultSort$ | async,\n      showEnum: showEnum$ | async,\n      isYesNo: isYesNo$ | async,\n      showTagAmount: showTagAmount$ | async,\n      params: params$ | async,\n    } as modalObs\"\n    [open]=\"modalObs.show\"\n    size=\"sm\"\n    (close)=\"closeModal()\"\n  >\n    <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\" [cdsLayer]=\"1\">\n      <h3 cdsModalHeaderHeading>\n        {{\n          modalObs.type === 'create'\n            ? ('listColumn.addButtonText' | translate)\n            : ('listColumn.editColumnTitle' | translate)\n        }}\n      </h3>\n    </cds-modal-header>\n\n    <section cdsModalContent [cdsLayer]=\"1\">\n      <ng-container *ngTemplateOutlet=\"modalContent; context: {modalObs: modalObs}\"></ng-container>\n    </section>\n    <ng-container *ngTemplateOutlet=\"modalFooter; context: {modalObs: modalObs}\"></ng-container>\n  </cds-modal>\n</ng-template>\n\n<ng-template #modalContent let-modalObs=\"modalObs\">\n  <form [formGroup]=\"formGroup\" class=\"list-column-form\">\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.titleTitle' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.titleTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.title\" />\n    </cds-label>\n\n    <cds-label\n      [disabled]=\"modalObs.disableInput || modalObs.type === 'edit'\"\n      [invalid]=\"modalObs.validKey === false\"\n      [invalidText]=\"'listColumn.uniqueKeyWarning' | translate\"\n    >\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.key' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.keyTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input\n        cdsText\n        formControlName=\"key\"\n        [invalid]=\"modalObs.validKey === false\"\n        [attr.data-test-id]=\"testIds.key\"\n      />\n    </cds-label>\n\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.path' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.pathTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <valtimo-value-path-selector\n        formControlName=\"path\"\n        [caseDefinitionKey]=\"modalObs.params?.caseDefinitionKey\"\n        [caseDefinitionVersionTag]=\"modalObs.params?.caseDefinitionVersionTag\"\n        [excludePrefixes]=\"[ValuePathSelectorPrefix.TASK]\"\n        [attr.data-test-id]=\"testIds.valuePathSelector\"\n      ></valtimo-value-path-selector>\n    </cds-label>\n\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.displayType' | translate }}\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.displayTypeTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-dropdown\n        formControlName=\"displayType\"\n        [disabled]=\"modalObs.disableInput\"\n        (selected)=\"selectedDisplayType($event)\"\n        [attr.data-test-id]=\"testIds.displayType\"\n      >\n        <cds-dropdown-list [items]=\"(viewTypeItems$ | async) || []\"></cds-dropdown-list>\n      </cds-dropdown>\n    </cds-label>\n\n    <cds-label *ngIf=\"modalObs.showTagAmount\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.tagAmount' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.tagAmountTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-number\n        formControlName=\"tagAmount\"\n        [min]=\"1\"\n        [step]=\"1\"\n        [attr.data-test-id]=\"testIds.tagAmount\"\n      ></cds-number>\n    </cds-label>\n\n    <cds-label *ngIf=\"showDateFormat$ | async\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.dateFormat' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.dateFormatTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input cdsText formControlName=\"dateFormat\" [attr.data-test-id]=\"testIds.dateFormat\" />\n    </cds-label>\n\n    <cds-label *ngIf=\"modalObs.showEnum || modalObs.isYesNo\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{\n          modalObs.isYesNo\n            ? ('listColumn.enumTitleOptional' | translate)\n            : ('listColumn.enumTitle' | translate)\n        }}\n\n        <v-tooltip-icon\n          [tooltip]=\"\n            modalObs.isYesNo\n              ? ('listColumn.enumTooltipOptional' | translate)\n              : ('listColumn.enumTooltip' | translate)\n          \"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <valtimo-carbon-multi-input\n        *ngIf=\"(showModal$ | async) || (modalShowing$ | async)\"\n        type=\"keyValue\"\n        (valueChange)=\"enumValueChange($event)\"\n        [defaultValues]=\"defaultEnumValues$ | async\"\n        [hideAddButton]=\"modalObs.isYesNo\"\n        [hideDeleteButton]=\"modalObs.isYesNo\"\n        [maxRows]=\"modalObs.isYesNo ? 1 : null\"\n        [keyColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.Yes' | translate)\"\n        [valueColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.No' | translate)\"\n        [attr.data-test-id]=\"testIds.multiInput\"\n      ></valtimo-carbon-multi-input>\n    </cds-label>\n\n    <cds-checkbox\n      *ngIf=\"displaySortable\"\n      formControlName=\"sortable\"\n      [disabled]=\"modalObs.showTagAmount || modalObs.disableInput\"\n      [attr.data-test-id]=\"testIds.sortableCheckbox\"\n      >{{ 'listColumn.sortable' | translate }}\n    </cds-checkbox>\n\n    <cds-label\n      *ngIf=\"displaySortable\"\n      [disabled]=\"modalObs.disableInput || modalObs.disableDefaultSort || modalObs.showTagAmount\"\n    >\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.defaultSortTitle' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.defaultSortTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-dropdown\n        formControlName=\"defaultSort\"\n        [disabled]=\"modalObs.disableInput || modalObs.disableDefaultSort || modalObs.showTagAmount\"\n        [attr.data-test-id]=\"testIds.defaultSort\"\n      >\n        <cds-dropdown-list [items]=\"(sortItems$ | async) || []\"></cds-dropdown-list>\n      </cds-dropdown>\n\n      <cds-inline-notification\n        *ngIf=\"modalObs.disableDefaultSort && !modalObs.disableInput && !modalObs.showTagAmount\"\n        class=\"default-sort-disabled-notice\"\n        [notificationObj]=\"{\n          type: 'info',\n          title: '',\n          message: ('listColumn.defaultSortDisabledNotice' | translate),\n          showClose: false,\n          lowContrast: true\n        }\"\n      ></cds-inline-notification>\n    </cds-label>\n\n    <cds-label *ngIf=\"displayExportButton\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.exportField' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.exportTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-toggle\n        formControlName=\"exportable\"\n        data-testid=\"export-selector-toggle\"\n        [onText]=\"'listColumn.sortableYes' | translate\"\n        [offText]=\"'listColumn.sortableNo' | translate\"\n        [keyColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.Yes' | translate)\"\n        [valueColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.No' | translate)\"\n        [required]=\"false\"\n        [size]=\"'sm'\"\n        [attr.data-test-id]=\"testIds.exportable\"\n      ></cds-toggle>\n    </cds-label>\n  </form>\n</ng-template>\n\n<ng-template #modalFooter let-modalObs=\"modalObs\">\n  <cds-modal-footer [cdsLayer]=\"1\">\n    <ng-container>\n      <button\n        cdsButton=\"secondary\"\n        [attr.modal-primary-focus]=\"true\"\n        (click)=\"closeModal()\"\n        [disabled]=\"modalObs.disableInput\"\n        [attr.data-test-id]=\"testIds.cancelButton\"\n      >\n        {{ 'listColumn.close' | translate }}\n      </button>\n\n      <button\n        cdsButton=\"primary\"\n        [attr.modal-primary-focus]=\"true\"\n        [disabled]=\"modalObs.valid === false\"\n        (click)=\"saveCaseListColumns()\"\n        [disabled]=\"\n          modalObs.disableInput || modalObs.valid === false || modalObs.validKey === false\n        \"\n        [attr.data-test-id]=\"testIds.saveButton\"\n      >\n        {{ 'listColumn.save' | translate }}\n      </button>\n    </ng-container>\n  </cds-modal-footer>\n</ng-template>\n\n<ng-template #deleteModal>\n  <valtimo-confirmation-modal\n    [showModalSubject$]=\"showDeleteModal$\"\n    [outputOnConfirm]=\"deleteRowKey$ | async\"\n    (confirmEvent)=\"deleteRowConfirmation($event)\"\n    confirmButtonTextTranslationKey=\"listColumn.deleteColumn\"\n    titleTranslationKey=\"listColumn.deleteColumn\"\n    contentTranslationKey=\"listColumn.deleteColumnConfirmation\"\n    [attr.data-test-id]=\"testIds.confirmationModal\"\n  ></valtimo-confirmation-modal>\n</ng-template>\n\n<ng-template #viewToggle>\n  <cds-tooltip [description]=\"'JSON editor'\">\n    <button\n      [cdsButton]=\"buttonTheme()\"\n      [attr.data-test-id]=\"testIds.switchView\"\n      iconOnly=\"true\"\n      (click)=\"switchView()\"\n    >\n      <svg cdsIcon=\"code\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n</ng-template>\n\n<ng-template #downloadButton let-obs=\"obs\">\n  <button\n    cdsButton=\"ghost\"\n    iconOnly=\"true\"\n    (click)=\"onDownloadClick()\"\n    [disabled]=\"\n      !obs.downloadUrl ||\n      !obs.downloadName ||\n      obs.caseListColumn?.length < 1 ||\n      obs.disableInput ||\n      obs.loadingCaseListColumns\n    \"\n    [attr.data-test-id]=\"testIds.downloadButton\"\n  >\n    <svg cdsIcon=\"download\" size=\"16\"></svg>\n  </button>\n</ng-template>\n", styles: ["::ng-deep .tab-container{min-height:unset!important}::ng-deep .cds--inline-notification{max-width:100%}.default-sort-disabled-notice{display:block;margin-top:.5rem}::ng-deep .cds--label{width:100%}.label-with-tooltip{display:flex;align-items:center}.display-type-dropdown{width:300px}.list-column-form{display:flex;flex-direction:column;gap:16px;margin-bottom:3rem}.select-label{padding-bottom:.5rem;width:250px}.center-link{display:flex;align-items:center}.case-list-columns__actions{display:flex;gap:8px}.list-columns__buttons{display:flex;gap:16px;flex-direction:row;justify-content:flex-end}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+            args: [{ standalone: false, selector: 'valtimo-case-management-list-columns', template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    caseListColumn: translatedCaseListColumns$ | async,\n    disableInput: disableInput$ | async,\n    downloadName: downloadName$ | async,\n    downloadUrl: downloadUrl$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n    jsonEditorModel: jsonEditorModel$ | async,\n    loadingCaseListColumns: loadingCaseListColumns$ | async,\n    params: params$ | async,\n  } as obs\"\n>\n  <ng-container *ngTemplateOutlet=\"content; context: {obs: obs}\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"createEditModal\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"deleteModal\"></ng-container>\n</ng-container>\n\n<ng-template #content let-obs=\"obs\">\n  @if (!jsonEditorActive()) {\n    <valtimo-carbon-list\n      [actionItems]=\"actionItems\"\n      [loading]=\"obs.loadingCaseListColumns\"\n      [items]=\"obs?.caseListColumn || []\"\n      [fields]=\"fields\"\n      [viewMode]=\"false\"\n      [header]=\"false\"\n      (rowClicked)=\"columnRowClicked($event)\"\n      [dragAndDrop]=\"true\"\n      [dragAndDropDisabled]=\"obs.disableInput\"\n      (itemsReordered)=\"onItemsReordered(obs.params.caseDefinitionKey, $event)\"\n      [attr.data-test-id]=\"testIds.columnsList\"\n    >\n      <ng-container\n        carbonToolbarContent\n        *ngTemplateOutlet=\"buttons; context: {obs: obs}\"\n      ></ng-container>\n\n      <valtimo-no-results\n        [title]=\"'listColumn.noConfigWarningTitle' | translate\"\n        [description]=\"'listColumn.noConfigWarning' | translate\"\n        illustration=\"valtimo-layout/img/emptystate-empty.svg\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  } @else {\n    <valtimo-json-editor\n      [model]=\"obs.jsonEditorModel\"\n      [fitPage]=\"true\"\n      [showEditButton]=\"obs.hasEditPermissions\"\n      (saveEvent)=\"updateCaseListColumns(obs.params.caseDefinitionKey, $event)\"\n      [attr.data-test-id]=\"testIds.jsonEditor\"\n    >\n      <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n      <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n    </valtimo-json-editor>\n  }\n</ng-template>\n\n<ng-template #buttons let-obs=\"obs\">\n  <ng-container *ngTemplateOutlet=\"viewToggle\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"downloadButton; context: {obs: obs}\"></ng-container>\n\n  <button\n    *ngIf=\"obs.hasEditPermissions\"\n    (click)=\"openModal('create')\"\n    cdsButton=\"primary\"\n    [disabled]=\"obs.loadingCaseListColumns || !(hasEditPermissions$ | async)\"\n    [attr.data-test-id]=\"testIds.addListColumn\"\n  >\n    {{ 'listColumn.addButtonText' | translate }}\n    <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n  </button>\n</ng-template>\n\n<ng-template #noConfigWarning>\n  <div class=\"pl-2 pr-2 pb-2 pt-2\">\n    <cds-notification\n      [notificationObj]=\"{\n        type: 'info',\n        title: 'listColumn.noConfigWarningTitle' | translate,\n        message: 'listColumn.noConfigWarning' | translate,\n        showClose: false,\n      }\"\n    >\n    </cds-notification>\n  </div>\n</ng-template>\n\n<ng-template #createEditModal>\n  <cds-modal\n    valtimoCdsModal\n    *ngIf=\"{\n      type: currentModalType$ | async,\n      show: showModal$ | async,\n      valid: valid$ | async,\n      disableInput: disableInput$ | async,\n      validKey: validKey$ | async,\n      disableDefaultSort: disableDefaultSort$ | async,\n      showEnum: showEnum$ | async,\n      isYesNo: isYesNo$ | async,\n      showTagAmount: showTagAmount$ | async,\n      params: params$ | async,\n    } as modalObs\"\n    [open]=\"modalObs.show\"\n    size=\"sm\"\n    (close)=\"closeModal()\"\n  >\n    <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\" [cdsLayer]=\"1\">\n      <h3 cdsModalHeaderHeading>\n        {{\n          modalObs.type === 'create'\n            ? ('listColumn.addButtonText' | translate)\n            : ('listColumn.editColumnTitle' | translate)\n        }}\n      </h3>\n    </cds-modal-header>\n\n    <section cdsModalContent [cdsLayer]=\"1\">\n      <ng-container *ngTemplateOutlet=\"modalContent; context: {modalObs: modalObs}\"></ng-container>\n    </section>\n    <ng-container *ngTemplateOutlet=\"modalFooter; context: {modalObs: modalObs}\"></ng-container>\n  </cds-modal>\n</ng-template>\n\n<ng-template #modalContent let-modalObs=\"modalObs\">\n  <form [formGroup]=\"formGroup\" class=\"list-column-form\">\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.titleTitle' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.titleTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input cdsText formControlName=\"title\" [attr.data-test-id]=\"testIds.title\" />\n    </cds-label>\n\n    <cds-label\n      [disabled]=\"modalObs.disableInput || modalObs.type === 'edit'\"\n      [invalid]=\"modalObs.validKey === false\"\n      [invalidText]=\"'listColumn.uniqueKeyWarning' | translate\"\n    >\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.key' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.keyTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input\n        cdsText\n        formControlName=\"key\"\n        [invalid]=\"modalObs.validKey === false\"\n        [attr.data-test-id]=\"testIds.key\"\n      />\n    </cds-label>\n\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.path' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.pathTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <valtimo-value-path-selector\n        formControlName=\"path\"\n        [caseDefinitionKey]=\"modalObs.params?.caseDefinitionKey\"\n        [caseDefinitionVersionTag]=\"modalObs.params?.caseDefinitionVersionTag\"\n        [excludePrefixes]=\"[ValuePathSelectorPrefix.TASK]\"\n        [attr.data-test-id]=\"testIds.valuePathSelector\"\n      ></valtimo-value-path-selector>\n    </cds-label>\n\n    <cds-label [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.displayType' | translate }}\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.displayTypeTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-dropdown\n        formControlName=\"displayType\"\n        [disabled]=\"modalObs.disableInput\"\n        (selected)=\"selectedDisplayType($event)\"\n        [attr.data-test-id]=\"testIds.displayType\"\n      >\n        <cds-dropdown-list [items]=\"(viewTypeItems$ | async) || []\"></cds-dropdown-list>\n      </cds-dropdown>\n    </cds-label>\n\n    <cds-label *ngIf=\"modalObs.showTagAmount\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.tagAmount' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.tagAmountTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-number\n        formControlName=\"tagAmount\"\n        [min]=\"1\"\n        [step]=\"1\"\n        [attr.data-test-id]=\"testIds.tagAmount\"\n      ></cds-number>\n    </cds-label>\n\n    <cds-label *ngIf=\"showDateFormat$ | async\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip\">\n        {{ 'listColumn.dateFormat' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.dateFormatTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <input cdsText formControlName=\"dateFormat\" [attr.data-test-id]=\"testIds.dateFormat\" />\n    </cds-label>\n\n    <cds-label *ngIf=\"modalObs.showEnum || modalObs.isYesNo\" [disabled]=\"modalObs.disableInput\">\n      <span class=\"label-with-tooltip select-label\">\n        {{\n          modalObs.isYesNo\n            ? ('listColumn.enumTitleOptional' | translate)\n            : ('listColumn.enumTitle' | translate)\n        }}\n\n        <v-tooltip-icon\n          [tooltip]=\"\n            modalObs.isYesNo\n              ? ('listColumn.enumTooltipOptional' | translate)\n              : ('listColumn.enumTooltip' | translate)\n          \"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <valtimo-carbon-multi-input\n        *ngIf=\"(showModal$ | async) || (modalShowing$ | async)\"\n        type=\"keyValue\"\n        (valueChange)=\"enumValueChange($event)\"\n        [defaultValues]=\"defaultEnumValues$ | async\"\n        [hideAddButton]=\"modalObs.isYesNo\"\n        [hideDeleteButton]=\"modalObs.isYesNo\"\n        [maxRows]=\"modalObs.isYesNo ? 1 : null\"\n        [keyColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.Yes' | translate)\"\n        [valueColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.No' | translate)\"\n        [attr.data-test-id]=\"testIds.multiInput\"\n      ></valtimo-carbon-multi-input>\n    </cds-label>\n\n    <cds-checkbox\n      *ngIf=\"displaySortable\"\n      formControlName=\"sortable\"\n      [disabled]=\"modalObs.showTagAmount || modalObs.disableInput\"\n      [attr.data-test-id]=\"testIds.sortableCheckbox\"\n      >{{ 'listColumn.sortable' | translate }}\n    </cds-checkbox>\n\n    <cds-label\n      *ngIf=\"displaySortable\"\n      [disabled]=\"modalObs.disableInput || modalObs.disableDefaultSort || modalObs.showTagAmount\"\n    >\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.defaultSortTitle' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.defaultSortTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-dropdown\n        formControlName=\"defaultSort\"\n        [disabled]=\"modalObs.disableInput || modalObs.disableDefaultSort || modalObs.showTagAmount\"\n        [attr.data-test-id]=\"testIds.defaultSort\"\n      >\n        <cds-dropdown-list [items]=\"(sortItems$ | async) || []\"></cds-dropdown-list>\n      </cds-dropdown>\n\n      <cds-inline-notification\n        *ngIf=\"modalObs.disableDefaultSort && !modalObs.disableInput && !modalObs.showTagAmount\"\n        class=\"default-sort-disabled-notice\"\n        [notificationObj]=\"{\n          type: 'info',\n          title: '',\n          message: ('listColumn.defaultSortDisabledNotice' | translate),\n          showClose: false,\n          lowContrast: true\n        }\"\n      ></cds-inline-notification>\n    </cds-label>\n\n    <cds-label *ngIf=\"displayExportButton\">\n      <span class=\"label-with-tooltip select-label\">\n        {{ 'listColumn.exportField' | translate }}\n\n        <v-tooltip-icon\n          [tooltip]=\"'listColumn.exportTooltip' | translate\"\n          [disabled]=\"modalObs.disableInput\"\n        ></v-tooltip-icon>\n      </span>\n\n      <cds-toggle\n        formControlName=\"exportable\"\n        data-testid=\"export-selector-toggle\"\n        [onText]=\"'listColumn.sortableYes' | translate\"\n        [offText]=\"'listColumn.sortableNo' | translate\"\n        [keyColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.Yes' | translate)\"\n        [valueColumnTitle]=\"modalObs.isYesNo && ('viewTypeConverter.No' | translate)\"\n        [required]=\"false\"\n        [size]=\"'sm'\"\n        [attr.data-test-id]=\"testIds.exportable\"\n      ></cds-toggle>\n    </cds-label>\n  </form>\n</ng-template>\n\n<ng-template #modalFooter let-modalObs=\"modalObs\">\n  <cds-modal-footer [cdsLayer]=\"1\">\n    <ng-container>\n      <button\n        cdsButton=\"secondary\"\n        [attr.modal-primary-focus]=\"true\"\n        (click)=\"closeModal()\"\n        [disabled]=\"modalObs.disableInput\"\n        [attr.data-test-id]=\"testIds.cancelButton\"\n      >\n        {{ 'listColumn.close' | translate }}\n      </button>\n\n      <button\n        cdsButton=\"primary\"\n        [attr.modal-primary-focus]=\"true\"\n        [disabled]=\"modalObs.valid === false\"\n        (click)=\"saveCaseListColumns()\"\n        [disabled]=\"\n          modalObs.disableInput || modalObs.valid === false || modalObs.validKey === false\n        \"\n        [attr.data-test-id]=\"testIds.saveButton\"\n      >\n        {{ (modalObs.type === 'create' ? 'interface.create' : 'listColumn.save') | translate }}\n      </button>\n    </ng-container>\n  </cds-modal-footer>\n</ng-template>\n\n<ng-template #deleteModal>\n  <valtimo-confirmation-modal\n    [showModalSubject$]=\"showDeleteModal$\"\n    [outputOnConfirm]=\"deleteRowKey$ | async\"\n    (confirmEvent)=\"deleteRowConfirmation($event)\"\n    confirmButtonTextTranslationKey=\"listColumn.deleteColumn\"\n    titleTranslationKey=\"listColumn.deleteColumn\"\n    contentTranslationKey=\"listColumn.deleteColumnConfirmation\"\n    [attr.data-test-id]=\"testIds.confirmationModal\"\n  ></valtimo-confirmation-modal>\n</ng-template>\n\n<ng-template #viewToggle>\n  <cds-tooltip [description]=\"'JSON editor'\">\n    <button\n      [cdsButton]=\"buttonTheme()\"\n      [attr.data-test-id]=\"testIds.switchView\"\n      iconOnly=\"true\"\n      (click)=\"switchView()\"\n    >\n      <svg cdsIcon=\"code\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n</ng-template>\n\n<ng-template #downloadButton let-obs=\"obs\">\n  <button\n    cdsButton=\"ghost\"\n    iconOnly=\"true\"\n    (click)=\"onDownloadClick()\"\n    [disabled]=\"\n      !obs.downloadUrl ||\n      !obs.downloadName ||\n      obs.caseListColumn?.length < 1 ||\n      obs.disableInput ||\n      obs.loadingCaseListColumns\n    \"\n    [attr.data-test-id]=\"testIds.downloadButton\"\n  >\n    <svg cdsIcon=\"download\" size=\"16\"></svg>\n  </button>\n</ng-template>\n", styles: ["::ng-deep .tab-container{min-height:unset!important}::ng-deep .cds--inline-notification{max-width:100%}.default-sort-disabled-notice{display:block;margin-top:.5rem}::ng-deep .cds--label{width:100%}.label-with-tooltip{display:flex;align-items:center}.display-type-dropdown{width:300px}.list-column-form{display:flex;flex-direction:column;gap:16px;margin-bottom:3rem}.select-label{padding-bottom:.5rem;width:250px}.center-link{display:flex;align-items:center}.case-list-columns__actions{display:flex;gap:8px}.list-columns__buttons{display:flex;gap:16px;flex-direction:row;justify-content:flex-end}\n/*!\n * Copyright 2015-2025 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: () => [{ type: i1$2.DocumentService }, { type: i2$2.ActivatedRoute }, { type: i3.TranslateService }, { type: i2.IconService }, { type: i2$1.EditPermissionsService }] });
 
 /*
@@ -3915,7 +3915,7 @@ class CaseManagementSelectVersionModalComponent {
         this.closeEvent.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementSelectVersionModalComponent, deps: [{ token: i2$2.ActivatedRoute }, { token: i2$2.Router }, { token: CaseManagementService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementSelectVersionModalComponent, isStandalone: false, selector: "valtimo-case-management-select-version-modal", inputs: { open: "open", previousSelectedVersion: "previousSelectedVersion", caseDefinitionKey: "caseDefinitionKey", caseDefinitionTitle: "caseDefinitionTitle" }, outputs: { closeEvent: "closeEvent", selectedVersion: "selectedVersion" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal valtimoCdsModal showFooter=\"true\" [open]=\"open\" (close)=\"onCloseModal()\">\n  <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCloseModal()\">\n    <h3 cdsModalHeaderHeading>\n      {{\n        'caseManagement.allVersionsModal.title'\n          | translate: {value: (caseDefinitionTitle$ | async) ?? ''}\n      }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent>\n    <valtimo-carbon-list\n      [hideToolbar]=\"true\"\n      [items]=\"versionItems$ | async\"\n      [fields]=\"FIELDS\"\n      (rowClicked)=\"selectActiveVersion($event)\"\n      [pagination]=\"pagination$ | async\"\n      paginationIdentifier=\"caseManagementList\"\n      (paginationClicked)=\"paginationClicked($event)\"\n      (paginationSet)=\"paginationSet($event)\"\n      cdsLayer=\"1\"\n    >\n      <valtimo-no-results\n        [title]=\"'caseManagement.allVersionsModal.noResults.description' | translate\"\n        [description]=\"'caseManagement.allVersionsModal.noResults.title' | translate\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  </section>\n\n  <cds-modal-footer>\n    <button cdsButton=\"ghost\" (click)=\"onCloseModal()\">\n      {{ 'caseManagement.allVersionsModal.closeButton' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n", styles: ["::ng-deep .cds--modal-footer{justify-content:flex-start!important}\n/*!\n * Copyright 2015-2025 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: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementSelectVersionModalComponent, isStandalone: false, selector: "valtimo-case-management-select-version-modal", inputs: { open: "open", previousSelectedVersion: "previousSelectedVersion", caseDefinitionKey: "caseDefinitionKey", caseDefinitionTitle: "caseDefinitionTitle" }, outputs: { closeEvent: "closeEvent", selectedVersion: "selectedVersion" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal valtimoCdsModal showFooter=\"true\" [open]=\"open\" (close)=\"onCloseModal()\">\n  <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCloseModal()\">\n    <h3 cdsModalHeaderHeading>\n      {{\n        'caseManagement.allVersionsModal.title'\n          | translate: {value: (caseDefinitionTitle$ | async) ?? ''}\n      }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent>\n    <valtimo-carbon-list\n      [hideToolbar]=\"true\"\n      [items]=\"versionItems$ | async\"\n      [fields]=\"FIELDS\"\n      (rowClicked)=\"selectActiveVersion($event)\"\n      [pagination]=\"pagination$ | async\"\n      paginationIdentifier=\"caseManagementList\"\n      (paginationClicked)=\"paginationClicked($event)\"\n      (paginationSet)=\"paginationSet($event)\"\n      cdsLayer=\"1\"\n    >\n      <valtimo-no-results\n        [title]=\"'caseManagement.allVersionsModal.noResults.description' | translate\"\n        [description]=\"'caseManagement.allVersionsModal.noResults.title' | translate\"\n      ></valtimo-no-results>\n    </valtimo-carbon-list>\n  </section>\n\n  <cds-modal-footer>\n    <button cdsButton=\"ghost\" (click)=\"onCloseModal()\">\n      {{ 'caseManagement.allVersionsModal.closeButton' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n", styles: ["::ng-deep .cds--modal-footer{justify-content:flex-start!important}\n/*!\n * Copyright 2015-2025 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: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementSelectVersionModalComponent, decorators: [{
             type: Component,
@@ -4963,6 +4963,7 @@ class CaseManagementWidgetTabEditModalComponent {
             name: this.widgetTabName?.value,
             contentKey: '-',
             type: ApiTabType.WIDGETS,
+            showTasks: this.tabItem.showTasks,
         }, this.tabItem.key)
             .pipe(
         // Refresh the cached widgets first so persisting the layout doesn't
@@ -5661,7 +5662,7 @@ class CaseManagementActionsComponent {
         ]);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementActionsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i2$2.ActivatedRoute }, { token: StartableItemManagementService }, { token: i2$1.EditPermissionsService }, { token: i4$1.ProcessLinkStateService }, { token: i4$1.ProcessLinkStepService }, { token: i4$1.BuildingBlockStateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementActionsComponent, isStandalone: true, selector: "valtimo-case-management-actions", providers: [StartableItemManagementService, ProcessLinkStateService, ProcessLinkStepService, ProcessLinkButtonService], viewQueries: [{ propertyName: "typeColumnTemplate", first: true, predicate: ["typeColumn"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    routeParams: caseManagementRouteParams$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n  } as obs\"\n>\n  <cds-inline-notification\n    [notificationObj]=\"{\n      type: 'info',\n      title: '',\n      message: ('caseManagement.actions.infoNotification.message' | translate),\n      showClose: false,\n      lowContrast: true\n    }\"\n  ></cds-inline-notification>\n\n  <valtimo-carbon-list\n    *ngIf=\"{fields: fields$ | async, loading: loading$ | async, items: items$ | async} as listObs\"\n    [items]=\"listObs.items\"\n    [fields]=\"listObs.fields\"\n    [header]=\"false\"\n    [loading]=\"listObs.loading\"\n    [dragAndDrop]=\"true\"\n    [dragAndDropDisabled]=\"dragAndDropDisabled() || !obs.hasEditPermissions\"\n    [actionItems]=\"ACTION_ITEMS\"\n    [showActionItems]=\"obs.hasEditPermissions\"\n    (rowClicked)=\"onRowClicked($event)\"\n    (itemsReordered)=\"onItemsReorderedEvent($event)\"\n  >\n    <ng-container carbonToolbarContent>\n      <ng-container [ngTemplateOutlet]=\"addItemButton\"></ng-container>\n    </ng-container>\n\n    <valtimo-no-results\n      [action]=\"addItemButton\"\n      [description]=\"'caseManagement.actions.noResultsDescription' | translate\"\n      [title]=\"'caseManagement.actions.noResults' | translate\"\n    ></valtimo-no-results>\n  </valtimo-carbon-list>\n\n  <ng-template #typeColumn let-data=\"data\">\n    <cds-tag\n      class=\"cds-tag--no-margin\"\n      [type]=\"data.item.type === StartableItemType.PROCESS ? 'blue' : 'purple'\"\n    >\n      {{ 'caseManagement.actions.type.' + data.item.type | translate }}\n    </cds-tag>\n  </ng-template>\n\n  <ng-template #addItemButton>\n    <button\n      *ngIf=\"obs.hasEditPermissions\"\n      cdsButton=\"primary\"\n      (click)=\"onAddItemClick()\"\n    >\n      {{ 'caseManagement.actions.addItem' | translate }}\n\n      <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  </ng-template>\n</ng-container>\n\n<valtimo-case-management-actions-modal\n  (configureBuildingBlockEvent)=\"onConfigureBuildingBlock($event)\"\n></valtimo-case-management-actions-modal>\n\n<valtimo-process-link-modal></valtimo-process-link-modal>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"caseManagement.actions.deleteModal.content\"\n  [outputOnConfirm]=\"itemToDelete$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"caseManagement.actions.deleteModal.title\"\n  (confirmEvent)=\"onDeleteConfirm($event)\"\n></valtimo-confirmation-modal>\n", styles: [":host ::ng-deep cds-inline-notification{max-inline-size:unset;margin-bottom:16px}:host ::ng-deep .cds-tag--no-margin{margin:0}\n/*!\n * Copyright 2015-2026 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: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: CarbonListModule }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: NotificationModule }, { kind: "component", type: i2.Notification, selector: "cds-notification, cds-inline-notification, ibm-notification, ibm-inline-notification", inputs: ["notificationObj"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: CaseManagementActionsModalComponent, selector: "valtimo-case-management-actions-modal", outputs: ["configureBuildingBlockEvent"] }, { kind: "ngmodule", type: ConfirmationModalModule }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "ngmodule", type: ProcessLinkModule }, { kind: "component", type: i4$1.ProcessLinkModalComponent, selector: "valtimo-process-link-modal" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementActionsComponent, isStandalone: true, selector: "valtimo-case-management-actions", providers: [StartableItemManagementService, ProcessLinkStateService, ProcessLinkStepService, ProcessLinkButtonService], viewQueries: [{ propertyName: "typeColumnTemplate", first: true, predicate: ["typeColumn"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container\n  *ngIf=\"{\n    routeParams: caseManagementRouteParams$ | async,\n    hasEditPermissions: hasEditPermissions$ | async,\n  } as obs\"\n>\n  <cds-inline-notification\n    [notificationObj]=\"{\n      type: 'info',\n      title: '',\n      message: ('caseManagement.actions.infoNotification.message' | translate),\n      showClose: false,\n      lowContrast: true\n    }\"\n  ></cds-inline-notification>\n\n  <valtimo-carbon-list\n    *ngIf=\"{fields: fields$ | async, loading: loading$ | async, items: items$ | async} as listObs\"\n    [items]=\"listObs.items\"\n    [fields]=\"listObs.fields\"\n    [header]=\"false\"\n    [loading]=\"listObs.loading\"\n    [dragAndDrop]=\"true\"\n    [dragAndDropDisabled]=\"dragAndDropDisabled() || !obs.hasEditPermissions\"\n    [actionItems]=\"ACTION_ITEMS\"\n    [showActionItems]=\"obs.hasEditPermissions\"\n    (rowClicked)=\"onRowClicked($event)\"\n    (itemsReordered)=\"onItemsReorderedEvent($event)\"\n  >\n    <ng-container carbonToolbarContent>\n      <ng-container [ngTemplateOutlet]=\"addItemButton\"></ng-container>\n    </ng-container>\n\n    <valtimo-no-results\n      [action]=\"addItemButton\"\n      [description]=\"'caseManagement.actions.noResultsDescription' | translate\"\n      [title]=\"'caseManagement.actions.noResults' | translate\"\n    ></valtimo-no-results>\n  </valtimo-carbon-list>\n\n  <ng-template #typeColumn let-data=\"data\">\n    <cds-tag\n      class=\"cds-tag--no-margin\"\n      [type]=\"data.item.type === StartableItemType.PROCESS ? 'blue' : 'purple'\"\n    >\n      {{ 'caseManagement.actions.type.' + data.item.type | translate }}\n    </cds-tag>\n  </ng-template>\n\n  <ng-template #addItemButton>\n    <button\n      *ngIf=\"obs.hasEditPermissions\"\n      cdsButton=\"primary\"\n      (click)=\"onAddItemClick()\"\n    >\n      {{ 'caseManagement.actions.addItem' | translate }}\n\n      <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  </ng-template>\n</ng-container>\n\n<valtimo-case-management-actions-modal\n  (configureBuildingBlockEvent)=\"onConfigureBuildingBlock($event)\"\n></valtimo-case-management-actions-modal>\n\n<valtimo-process-link-modal></valtimo-process-link-modal>\n\n<valtimo-confirmation-modal\n  confirmButtonTextTranslationKey=\"interface.delete\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"caseManagement.actions.deleteModal.content\"\n  [outputOnConfirm]=\"itemToDelete$ | async\"\n  [showModalSubject$]=\"showDeleteModal$\"\n  titleTranslationKey=\"caseManagement.actions.deleteModal.title\"\n  (confirmEvent)=\"onDeleteConfirm($event)\"\n></valtimo-confirmation-modal>\n", styles: [":host ::ng-deep cds-inline-notification{max-inline-size:unset;margin-bottom:16px}:host ::ng-deep .cds-tag--no-margin{margin:0}\n/*!\n * Copyright 2015-2026 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: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: CarbonListModule }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: NotificationModule }, { kind: "component", type: i2.Notification, selector: "cds-notification, cds-inline-notification, ibm-notification, ibm-inline-notification", inputs: ["notificationObj"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: CaseManagementActionsModalComponent, selector: "valtimo-case-management-actions-modal", outputs: ["configureBuildingBlockEvent"] }, { kind: "ngmodule", type: ConfirmationModalModule }, { kind: "component", type: i7.ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "ngmodule", type: ProcessLinkModule }, { kind: "component", type: i4$1.ProcessLinkModalComponent, selector: "valtimo-process-link-modal" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementActionsComponent, decorators: [{
             type: Component,
@@ -6155,6 +6156,7 @@ class CaseManagementCreateComponent {
         this.open = false;
         this.closeModal = new EventEmitter();
         this.testIds = CASE_MANAGEMENT_CREATE_TEST_IDS;
+        this.descriptionMaxLength = 256;
         this.formGroup = this.fb.group({
             name: this.fb.control('', Validators.required),
             caseDefinitionKey: this.fb.control({ value: '', disabled: true }, [
@@ -6162,7 +6164,7 @@ class CaseManagementCreateComponent {
                 Validators.pattern('[A-Za-z0-9-]*'),
             ]),
             caseDefinitionVersion: this.fb.control('', Validators.required),
-            description: this.fb.control(''),
+            description: this.fb.control('', Validators.maxLength(this.descriptionMaxLength)),
         });
         this._editActive$ = new BehaviorSubject(false);
         this.editActive$ = this._editActive$.pipe(tap((editActive) => {
@@ -6230,16 +6232,17 @@ class CaseManagementCreateComponent {
         setTimeout(() => {
             this.formGroup.reset();
             this.idError$.next(null);
+            this.versionError$.next(null);
             this._editActive$.next(false);
             this.editDisabled$.next(true);
         }, CARBON_CONSTANTS.modalAnimationMs);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementCreateComponent, deps: [{ token: i1$2.DocumentService }, { token: i1$4.FormBuilder }, { token: i2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementCreateComponent, isStandalone: false, selector: "valtimo-case-management-create", inputs: { open: "open" }, outputs: { closeModal: "closeModal" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  *ngIf=\"{\n    editDisabled: editDisabled$ | async,\n    idError: idError$ | async,\n    versionError: versionError$ | async,\n    editActive: editActive$ | async,\n  } as obs\"\n  [open]=\"open\"\n  showFooter=\"true\"\n  valtimoCdsModal\n  class=\"valtimo-definition-create\"\n  (close)=\"onCloseModal()\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onCloseModal()\">\n    <h3 cdsModalHeaderHeading>\n      {{ 'caseManagement.createDefinition.modalTitle' | translate }}\n    </h3>\n  </cds-modal-header>\n\n  <form\n    [formGroup]=\"formGroup\"\n    cdsModalContent\n    [cdsLayer]=\"1\"\n    class=\"valtimo-definition-create__content\"\n  >\n    <cds-label>\n      {{ 'caseManagement.createDefinition.name' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.nameTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <input\n        formControlName=\"name\"\n        cdsText\n        placeholder=\"{{ 'caseManagement.createDefinition.namePlaceholder' | translate }}\"\n        [attr.modal-primary-focus]=\"true\"\n        [attr.data-test-id]=\"testIds.nameInput\"\n        (focusout)=\"onFocusOut()\"\n      />\n    </cds-label>\n\n    <cds-label [invalid]=\"!!obs.idError\" [invalidText]=\"obs.idError | translate\">\n      {{ 'caseManagement.createDefinition.key' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.keyTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <div class=\"valtimo-definition-create__name\">\n        <input\n          cdsText\n          [attr.data-test-id]=\"testIds.keyInput\"\n          formControlName=\"caseDefinitionKey\"\n          [invalid]=\"!!obs.idError\"\n          [placeholder]=\"'caseManagement.createDefinition.keyPlaceholder' | translate\"\n          [attr.modal-primary-focus]=\"true\"\n        />\n\n        <button\n          *ngIf=\"!obs.editActive\"\n          cdsButton=\"secondary\"\n          [attr.data-test-id]=\"testIds.keyEditButton\"\n          [disabled]=\"obs.editDisabled\"\n          [iconOnly]=\"true\"\n          size=\"md\"\n          (click)=\"enableEdit()\"\n        >\n          <svg cdsIcon=\"edit\" size=\"16\"></svg>\n        </button>\n      </div>\n    </cds-label>\n\n    <cds-label [invalid]=\"!!obs.versionError\" [invalidText]=\"obs.versionError | translate\">\n      {{ 'caseManagement.createDefinition.version' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.versionTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <input\n        formControlName=\"caseDefinitionVersion\"\n        [attr.data-test-id]=\"testIds.versionInput\"\n        cdsText\n        placeholder=\"{{ 'caseManagement.createDefinition.versionPlaceholder' | translate }}\"\n        [invalid]=\"!!obs.versionError\"\n        [attr.modal-primary-focus]=\"true\"\n        (focusout)=\"onFocusOut()\"\n      />\n    </cds-label>\n\n    <cds-textarea-label>\n      {{ 'caseManagement.createDefinition.description' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.descriptionTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <textarea\n        cdsTextArea\n        formControlName=\"description\"\n        [attr.data-test-id]=\"testIds.descriptionInput\"\n        placeholder=\"{{ 'caseManagement.createDefinition.descriptionPlaceholder' | translate }}\"\n        [rows]=\"3\"\n        [cols]=\"150\"\n        [attr.modal-primary-focus]=\"true\"\n        (focusout)=\"onFocusOut()\"\n      ></textarea>\n    </cds-textarea-label>\n  </form>\n\n  <cds-modal-footer>\n    <button [attr.data-test-id]=\"testIds.closeButton\" cdsButton=\"secondary\" (click)=\"onCloseModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button\n      [attr.data-test-id]=\"testIds.saveButton\"\n      cdsButton=\"primary\"\n      [disabled]=\"formGroup.invalid\"\n      (click)=\"onCloseModal(true)\"\n    >\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-definition-create__content{display:flex;flex-direction:column;gap:16px}.valtimo-definition-create__name{width:100%;display:flex;gap:8px}:host ::ng-deep .cds--label{display:flex;align-items:center;gap:12px}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "component", type: i2.TextareaLabelComponent, selector: "cds-textarea-label, ibm-textarea-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textAreaTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i2.TextArea, selector: "[cdsTextArea], [ibmTextArea]", inputs: ["theme", "invalid", "skeleton"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: CaseManagementCreateComponent, isStandalone: false, selector: "valtimo-case-management-create", inputs: { open: "open" }, outputs: { closeModal: "closeModal" }, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  *ngIf=\"{\n    editDisabled: editDisabled$ | async,\n    idError: idError$ | async,\n    versionError: versionError$ | async,\n    editActive: editActive$ | async,\n  } as obs\"\n  [open]=\"open\"\n  showFooter=\"true\"\n  valtimoCdsModal\n  class=\"valtimo-definition-create\"\n  (close)=\"onCloseModal()\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onCloseModal()\">\n    <h3 cdsModalHeaderHeading>\n      {{ 'caseManagement.createDefinition.modalTitle' | translate }}\n    </h3>\n  </cds-modal-header>\n\n  <form\n    [formGroup]=\"formGroup\"\n    cdsModalContent\n    [cdsLayer]=\"1\"\n    class=\"valtimo-definition-create__content\"\n  >\n    <cds-label>\n      {{ 'caseManagement.createDefinition.name' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.nameTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <input\n        formControlName=\"name\"\n        cdsText\n        placeholder=\"{{ 'caseManagement.createDefinition.namePlaceholder' | translate }}\"\n        [attr.modal-primary-focus]=\"true\"\n        [attr.data-test-id]=\"testIds.nameInput\"\n        (focusout)=\"onFocusOut()\"\n      />\n    </cds-label>\n\n    <cds-label [invalid]=\"!!obs.idError\" [invalidText]=\"obs.idError | translate\">\n      {{ 'caseManagement.createDefinition.key' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.keyTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <div class=\"valtimo-definition-create__name\">\n        <input\n          cdsText\n          [attr.data-test-id]=\"testIds.keyInput\"\n          formControlName=\"caseDefinitionKey\"\n          [invalid]=\"!!obs.idError\"\n          [placeholder]=\"'caseManagement.createDefinition.keyPlaceholder' | translate\"\n          [attr.modal-primary-focus]=\"true\"\n        />\n\n        <button\n          *ngIf=\"!obs.editActive\"\n          cdsButton=\"secondary\"\n          [attr.data-test-id]=\"testIds.keyEditButton\"\n          [disabled]=\"obs.editDisabled\"\n          [iconOnly]=\"true\"\n          size=\"md\"\n          (click)=\"enableEdit()\"\n        >\n          <svg cdsIcon=\"edit\" size=\"16\"></svg>\n        </button>\n      </div>\n    </cds-label>\n\n    <cds-label [invalid]=\"!!obs.versionError\" [invalidText]=\"obs.versionError | translate\">\n      {{ 'caseManagement.createDefinition.version' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.versionTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <input\n        formControlName=\"caseDefinitionVersion\"\n        [attr.data-test-id]=\"testIds.versionInput\"\n        cdsText\n        placeholder=\"{{ 'caseManagement.createDefinition.versionPlaceholder' | translate }}\"\n        [invalid]=\"!!obs.versionError\"\n        [attr.modal-primary-focus]=\"true\"\n        (focusout)=\"onFocusOut()\"\n      />\n    </cds-label>\n\n    <cds-textarea-label>\n      {{ 'caseManagement.createDefinition.description' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"\n          'caseManagement.createDefinition.descriptionTooltip'\n            | translate: {maxLength: descriptionMaxLength}\n        \"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <textarea\n        cdsTextArea\n        formControlName=\"description\"\n        [attr.data-test-id]=\"testIds.descriptionInput\"\n        [attr.maxlength]=\"descriptionMaxLength\"\n        placeholder=\"{{ 'caseManagement.createDefinition.descriptionPlaceholder' | translate }}\"\n        [rows]=\"3\"\n        [cols]=\"150\"\n        [attr.modal-primary-focus]=\"true\"\n        (focusout)=\"onFocusOut()\"\n      ></textarea>\n    </cds-textarea-label>\n  </form>\n\n  <cds-modal-footer>\n    <button [attr.data-test-id]=\"testIds.closeButton\" cdsButton=\"secondary\" (click)=\"onCloseModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button\n      [attr.data-test-id]=\"testIds.saveButton\"\n      cdsButton=\"primary\"\n      [disabled]=\"formGroup.invalid\"\n      (click)=\"onCloseModal(true)\"\n    >\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-definition-create__content{display:flex;flex-direction:column;gap:16px}.valtimo-definition-create__name{width:100%;display:flex;gap:8px}:host ::ng-deep .cds--label{display:flex;align-items:center;gap:12px}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "component", type: i2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "component", type: i2.TextareaLabelComponent, selector: "cds-textarea-label, ibm-textarea-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textAreaTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i2.TextArea, selector: "[cdsTextArea], [ibmTextArea]", inputs: ["theme", "invalid", "skeleton"] }, { kind: "directive", type: i1$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i7.ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "component", type: i2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "directive", type: i2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementCreateComponent, decorators: [{
             type: Component,
-            args: [{ standalone: false, selector: 'valtimo-case-management-create', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  *ngIf=\"{\n    editDisabled: editDisabled$ | async,\n    idError: idError$ | async,\n    versionError: versionError$ | async,\n    editActive: editActive$ | async,\n  } as obs\"\n  [open]=\"open\"\n  showFooter=\"true\"\n  valtimoCdsModal\n  class=\"valtimo-definition-create\"\n  (close)=\"onCloseModal()\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onCloseModal()\">\n    <h3 cdsModalHeaderHeading>\n      {{ 'caseManagement.createDefinition.modalTitle' | translate }}\n    </h3>\n  </cds-modal-header>\n\n  <form\n    [formGroup]=\"formGroup\"\n    cdsModalContent\n    [cdsLayer]=\"1\"\n    class=\"valtimo-definition-create__content\"\n  >\n    <cds-label>\n      {{ 'caseManagement.createDefinition.name' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.nameTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <input\n        formControlName=\"name\"\n        cdsText\n        placeholder=\"{{ 'caseManagement.createDefinition.namePlaceholder' | translate }}\"\n        [attr.modal-primary-focus]=\"true\"\n        [attr.data-test-id]=\"testIds.nameInput\"\n        (focusout)=\"onFocusOut()\"\n      />\n    </cds-label>\n\n    <cds-label [invalid]=\"!!obs.idError\" [invalidText]=\"obs.idError | translate\">\n      {{ 'caseManagement.createDefinition.key' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.keyTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <div class=\"valtimo-definition-create__name\">\n        <input\n          cdsText\n          [attr.data-test-id]=\"testIds.keyInput\"\n          formControlName=\"caseDefinitionKey\"\n          [invalid]=\"!!obs.idError\"\n          [placeholder]=\"'caseManagement.createDefinition.keyPlaceholder' | translate\"\n          [attr.modal-primary-focus]=\"true\"\n        />\n\n        <button\n          *ngIf=\"!obs.editActive\"\n          cdsButton=\"secondary\"\n          [attr.data-test-id]=\"testIds.keyEditButton\"\n          [disabled]=\"obs.editDisabled\"\n          [iconOnly]=\"true\"\n          size=\"md\"\n          (click)=\"enableEdit()\"\n        >\n          <svg cdsIcon=\"edit\" size=\"16\"></svg>\n        </button>\n      </div>\n    </cds-label>\n\n    <cds-label [invalid]=\"!!obs.versionError\" [invalidText]=\"obs.versionError | translate\">\n      {{ 'caseManagement.createDefinition.version' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.versionTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <input\n        formControlName=\"caseDefinitionVersion\"\n        [attr.data-test-id]=\"testIds.versionInput\"\n        cdsText\n        placeholder=\"{{ 'caseManagement.createDefinition.versionPlaceholder' | translate }}\"\n        [invalid]=\"!!obs.versionError\"\n        [attr.modal-primary-focus]=\"true\"\n        (focusout)=\"onFocusOut()\"\n      />\n    </cds-label>\n\n    <cds-textarea-label>\n      {{ 'caseManagement.createDefinition.description' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.descriptionTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <textarea\n        cdsTextArea\n        formControlName=\"description\"\n        [attr.data-test-id]=\"testIds.descriptionInput\"\n        placeholder=\"{{ 'caseManagement.createDefinition.descriptionPlaceholder' | translate }}\"\n        [rows]=\"3\"\n        [cols]=\"150\"\n        [attr.modal-primary-focus]=\"true\"\n        (focusout)=\"onFocusOut()\"\n      ></textarea>\n    </cds-textarea-label>\n  </form>\n\n  <cds-modal-footer>\n    <button [attr.data-test-id]=\"testIds.closeButton\" cdsButton=\"secondary\" (click)=\"onCloseModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button\n      [attr.data-test-id]=\"testIds.saveButton\"\n      cdsButton=\"primary\"\n      [disabled]=\"formGroup.invalid\"\n      (click)=\"onCloseModal(true)\"\n    >\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-definition-create__content{display:flex;flex-direction:column;gap:16px}.valtimo-definition-create__name{width:100%;display:flex;gap:8px}:host ::ng-deep .cds--label{display:flex;align-items:center;gap:12px}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+            args: [{ standalone: false, selector: 'valtimo-case-management-create', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright 2015-2025 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<cds-modal\n  *ngIf=\"{\n    editDisabled: editDisabled$ | async,\n    idError: idError$ | async,\n    versionError: versionError$ | async,\n    editActive: editActive$ | async,\n  } as obs\"\n  [open]=\"open\"\n  showFooter=\"true\"\n  valtimoCdsModal\n  class=\"valtimo-definition-create\"\n  (close)=\"onCloseModal()\"\n>\n  <cds-modal-header showCloseButton=\"true\" (closeSelect)=\"onCloseModal()\">\n    <h3 cdsModalHeaderHeading>\n      {{ 'caseManagement.createDefinition.modalTitle' | translate }}\n    </h3>\n  </cds-modal-header>\n\n  <form\n    [formGroup]=\"formGroup\"\n    cdsModalContent\n    [cdsLayer]=\"1\"\n    class=\"valtimo-definition-create__content\"\n  >\n    <cds-label>\n      {{ 'caseManagement.createDefinition.name' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.nameTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <input\n        formControlName=\"name\"\n        cdsText\n        placeholder=\"{{ 'caseManagement.createDefinition.namePlaceholder' | translate }}\"\n        [attr.modal-primary-focus]=\"true\"\n        [attr.data-test-id]=\"testIds.nameInput\"\n        (focusout)=\"onFocusOut()\"\n      />\n    </cds-label>\n\n    <cds-label [invalid]=\"!!obs.idError\" [invalidText]=\"obs.idError | translate\">\n      {{ 'caseManagement.createDefinition.key' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.keyTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <div class=\"valtimo-definition-create__name\">\n        <input\n          cdsText\n          [attr.data-test-id]=\"testIds.keyInput\"\n          formControlName=\"caseDefinitionKey\"\n          [invalid]=\"!!obs.idError\"\n          [placeholder]=\"'caseManagement.createDefinition.keyPlaceholder' | translate\"\n          [attr.modal-primary-focus]=\"true\"\n        />\n\n        <button\n          *ngIf=\"!obs.editActive\"\n          cdsButton=\"secondary\"\n          [attr.data-test-id]=\"testIds.keyEditButton\"\n          [disabled]=\"obs.editDisabled\"\n          [iconOnly]=\"true\"\n          size=\"md\"\n          (click)=\"enableEdit()\"\n        >\n          <svg cdsIcon=\"edit\" size=\"16\"></svg>\n        </button>\n      </div>\n    </cds-label>\n\n    <cds-label [invalid]=\"!!obs.versionError\" [invalidText]=\"obs.versionError | translate\">\n      {{ 'caseManagement.createDefinition.version' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"'caseManagement.createDefinition.versionTooltip' | translate\"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <input\n        formControlName=\"caseDefinitionVersion\"\n        [attr.data-test-id]=\"testIds.versionInput\"\n        cdsText\n        placeholder=\"{{ 'caseManagement.createDefinition.versionPlaceholder' | translate }}\"\n        [invalid]=\"!!obs.versionError\"\n        [attr.modal-primary-focus]=\"true\"\n        (focusout)=\"onFocusOut()\"\n      />\n    </cds-label>\n\n    <cds-textarea-label>\n      {{ 'caseManagement.createDefinition.description' | translate }}\n\n      <cds-tooltip\n        [caret]=\"true\"\n        [description]=\"\n          'caseManagement.createDefinition.descriptionTooltip'\n            | translate: {maxLength: descriptionMaxLength}\n        \"\n      >\n        <svg class=\"tooltip-trigger\" cdsIcon=\"information\" size=\"16\"></svg>\n      </cds-tooltip>\n\n      <textarea\n        cdsTextArea\n        formControlName=\"description\"\n        [attr.data-test-id]=\"testIds.descriptionInput\"\n        [attr.maxlength]=\"descriptionMaxLength\"\n        placeholder=\"{{ 'caseManagement.createDefinition.descriptionPlaceholder' | translate }}\"\n        [rows]=\"3\"\n        [cols]=\"150\"\n        [attr.modal-primary-focus]=\"true\"\n        (focusout)=\"onFocusOut()\"\n      ></textarea>\n    </cds-textarea-label>\n  </form>\n\n  <cds-modal-footer>\n    <button [attr.data-test-id]=\"testIds.closeButton\" cdsButton=\"secondary\" (click)=\"onCloseModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button\n      [attr.data-test-id]=\"testIds.saveButton\"\n      cdsButton=\"primary\"\n      [disabled]=\"formGroup.invalid\"\n      (click)=\"onCloseModal(true)\"\n    >\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-definition-create__content{display:flex;flex-direction:column;gap:16px}.valtimo-definition-create__name{width:100%;display:flex;gap:8px}:host ::ng-deep .cds--label{display:flex;align-items:center;gap:12px}\n/*!\n * Copyright 2015-2025 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: () => [{ type: i1$2.DocumentService }, { type: i1$4.FormBuilder }, { type: i2.IconService }], propDecorators: { open: [{
                 type: Input
             }], closeModal: [{
@@ -6373,7 +6376,7 @@ class CaseManagementListComponent {
         this.showCreateModal$.next(true);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementListComponent, deps: [{ token: CaseManagementService }, { token: i2.IconService }, { token: i7.MenuService }, { token: i2$2.ActivatedRoute }, { token: i2$2.Router }, { token: i2$1.EnvironmentService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CaseManagementListComponent, isStandalone: false, selector: "valtimo-case-management-list", viewQueries: [{ propertyName: "statusColumnTemplate", first: true, predicate: ["statusColumnTemplate"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-carbon-list\n  [items]=\"caseListItems$ | async\"\n  [fields]=\"fields$ | async\"\n  (rowClicked)=\"redirectToDetails($event)\"\n  [pagination]=\"pagination$ | async\"\n  paginationIdentifier=\"caseManagementList\"\n  (paginationClicked)=\"paginationClicked($event)\"\n  (paginationSet)=\"paginationSet($event)\"\n>\n  <ng-container carbonToolbarContent [ngTemplateOutlet]=\"importCaseDefinitionButton\"></ng-container>\n\n  <valtimo-no-results\n    [action]=\"importCaseDefinitionButton\"\n    [description]=\"'caseManagement.noResults.description' | translate\"\n    [title]=\"'caseManagement.noResults.title' | translate\"\n  ></valtimo-no-results>\n</valtimo-carbon-list>\n\n<ng-template #loading>\n  <valtimo-carbon-list loading=\"true\"></valtimo-carbon-list>\n</ng-template>\n\n<valtimo-case-management-upload\n  [open]=\"showUploadModal$ | async\"\n  (closeModal)=\"onCloseUploadModal($event)\"\n></valtimo-case-management-upload>\n\n<valtimo-case-management-create\n  [open]=\"showCreateModal$ | async\"\n  (closeModal)=\"onCloseCreateModal($event)\"\n></valtimo-case-management-create>\n\n<ng-template #statusColumnTemplate let-data=\"data\">\n  @if (!data?.item?.active) {\n    <cds-tag type=\"purple\" class=\"cds-tag--no-margin\">\n      {{ 'caseManagement.inactive' | translate }}\n    </cds-tag>\n  }\n  @if (data?.item?.hasConfigurationIssues) {\n    <cds-tag type=\"red\" class=\"cds-tag--no-margin\">\n      {{ 'caseManagement.needsConfiguration' | translate }}\n    </cds-tag>\n  }\n</ng-template>\n\n<ng-template #importCaseDefinitionButton>\n  <div class=\"valtimo-case-management-list__actions\">\n    <button [attr.data-test-id]=\"testIds.uploadButton\" cdsButton=\"ghost\" (click)=\"showUploadModal()\">\n      {{ 'Upload' | translate }}\n\n      <svg cdsIcon=\"upload\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n\n    <button\n      *ngIf=\"canUpdateGlobalConfiguration$ | async\"\n      [attr.data-test-id]=\"testIds.createButton\"\n      cdsButton=\"primary\"\n      (click)=\"showCreateModal()\"\n    >\n      {{ 'interface.create' | translate }}\n\n      <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  </div>\n</ng-template>\n", styles: [".valtimo-case-management-list__actions{display:flex}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: CaseManagementUploadComponent, selector: "valtimo-case-management-upload", inputs: ["open"], outputs: ["closeModal"] }, { kind: "component", type: CaseManagementCreateComponent, selector: "valtimo-case-management-create", inputs: ["open"], outputs: ["closeModal"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CaseManagementListComponent, isStandalone: false, selector: "valtimo-case-management-list", viewQueries: [{ propertyName: "statusColumnTemplate", first: true, predicate: ["statusColumnTemplate"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<valtimo-carbon-list\n  [items]=\"caseListItems$ | async\"\n  [fields]=\"fields$ | async\"\n  (rowClicked)=\"redirectToDetails($event)\"\n  [pagination]=\"pagination$ | async\"\n  paginationIdentifier=\"caseManagementList\"\n  (paginationClicked)=\"paginationClicked($event)\"\n  (paginationSet)=\"paginationSet($event)\"\n>\n  <ng-container carbonToolbarContent [ngTemplateOutlet]=\"importCaseDefinitionButton\"></ng-container>\n\n  <valtimo-no-results\n    [action]=\"importCaseDefinitionButton\"\n    [description]=\"'caseManagement.noResults.description' | translate\"\n    [title]=\"'caseManagement.noResults.title' | translate\"\n  ></valtimo-no-results>\n</valtimo-carbon-list>\n\n<ng-template #loading>\n  <valtimo-carbon-list loading=\"true\"></valtimo-carbon-list>\n</ng-template>\n\n<valtimo-case-management-upload\n  [open]=\"showUploadModal$ | async\"\n  (closeModal)=\"onCloseUploadModal($event)\"\n></valtimo-case-management-upload>\n\n<valtimo-case-management-create\n  [open]=\"showCreateModal$ | async\"\n  (closeModal)=\"onCloseCreateModal($event)\"\n></valtimo-case-management-create>\n\n<ng-template #statusColumnTemplate let-data=\"data\">\n  @if (!data?.item?.active) {\n    <cds-tag type=\"purple\" class=\"cds-tag--no-margin\">\n      {{ 'caseManagement.inactive' | translate }}\n    </cds-tag>\n  }\n  @if (data?.item?.hasConfigurationIssues) {\n    <cds-tag type=\"red\" class=\"cds-tag--no-margin\">\n      {{ 'caseManagement.needsConfiguration' | translate }}\n    </cds-tag>\n  }\n</ng-template>\n\n<ng-template #importCaseDefinitionButton>\n  <div class=\"valtimo-case-management-list__actions\">\n    <button [attr.data-test-id]=\"testIds.uploadButton\" cdsButton=\"ghost\" (click)=\"showUploadModal()\">\n      {{ 'Upload' | translate }}\n\n      <svg cdsIcon=\"upload\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n\n    <button\n      *ngIf=\"canUpdateGlobalConfiguration$ | async\"\n      [attr.data-test-id]=\"testIds.createButton\"\n      cdsButton=\"primary\"\n      (click)=\"showCreateModal()\"\n    >\n      {{ 'interface.create' | translate }}\n\n      <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  </div>\n</ng-template>\n", styles: [".valtimo-case-management-list__actions{display:flex}\n/*!\n * Copyright 2015-2025 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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i7.CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "component", type: i7.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "component", type: i2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: CaseManagementUploadComponent, selector: "valtimo-case-management-upload", inputs: ["open"], outputs: ["closeModal"] }, { kind: "component", type: CaseManagementCreateComponent, selector: "valtimo-case-management-create", inputs: ["open"], outputs: ["closeModal"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CaseManagementListComponent, decorators: [{
             type: Component,