@valtimo/layout 13.29.0 → 13.31.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -21,7 +21,7 @@ import { filter, catchError } from 'rxjs/operators';
21
21
  import { isEqual, cloneDeep } from 'lodash';
22
22
  import { takeUntilDestroyed, toObservable, toSignal } from '@angular/core/rxjs-interop';
23
23
  import * as i1$2 from '@valtimo/form';
24
- import { TrashCan16, Filter16, Link16, Edit16, ArrowUp16, ArrowDown16, DragVertical16, Phone20, Email20, Calendar20, Information16 } from '@carbon/icons';
24
+ import { TrashCan16, Filter16, Link16, Edit16, ArrowUp16, ArrowDown16, DragVertical16, Phone16, Email16, Calendar16, Information16 } from '@carbon/icons';
25
25
  import * as i2$3 from '@valtimo/document';
26
26
  import * as i3$1 from '@valtimo/access-control';
27
27
  import Muuri from 'muuri';
@@ -225,8 +225,10 @@ const WidgetTypeTags = {
225
225
  [WidgetType.TABLE]: 'purple',
226
226
  [WidgetType.INTERACTIVE_TABLE]: 'red',
227
227
  [WidgetType.MAP]: 'cyan',
228
- [WidgetType.HIGHLIGHT]: 'warm-gray',
229
- [WidgetType.METROLINE]: 'gray',
228
+ [WidgetType.DIVIDER]: 'orange',
229
+ [WidgetType.METROLINE]: 'light-green',
230
+ [WidgetType.PERSON_CARD]: 'yellow',
231
+ [WidgetType.HIGHLIGHT]: 'periwinkle',
230
232
  };
231
233
 
232
234
  /*
@@ -2659,7 +2661,7 @@ class WidgetManagementProcessSelectorComponent {
2659
2661
  nameFormControl.enable();
2660
2662
  }
2661
2663
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementProcessSelectorComponent, deps: [{ token: i1$1.CdsThemeService }, { token: i2$3.DocumentService }, { token: i1$3.FormBuilder }, { token: WidgetWizardService }, { token: WIDGET_MANAGEMENT_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
2662
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementProcessSelectorComponent, isStandalone: true, selector: "valtimo-widget-management-process-selector", 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<form\n [attr.data-carbon-theme]=\"theme$ | async\"\n [formGroup]=\"formGroup\"\n class=\"valtimo-widget-management-process-selector\"\n>\n <cds-combo-box\n class=\"test\"\n [label]=\"'widgetTabManagement.processes.selectorLabel' | translate\"\n [items]=\"(processDefinitionItems$ | async) || []\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.processes.selectorPlaceholder' | translate\"\n formControlName=\"processDefinition\"\n (selected)=\"onProcessSelected($event)\"\n >\n <cds-dropdown-list></cds-dropdown-list>\n </cds-combo-box>\n\n <cds-text-label>\n {{ 'widgetTabManagement.processes.buttonTextLabel' | translate }}\n\n <input\n cdsText\n type=\"text\"\n formControlName=\"name\"\n [placeholder]=\"'widgetTabManagement.processes.buttonTextPlaceholder' | translate\"\n />\n </cds-text-label>\n</form>\n", styles: [".valtimo-widget-management-process-selector{display:grid;grid-template-columns:1fr 1fr;align-items:flex-end;gap:16px}.valtimo-widget-management-process-selector ::ng-deep .cds--text-input,.valtimo-widget-management-process-selector ::ng-deep .cds--list-box{background:var(--cds-layer-01)!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: "ngmodule", type: CommonModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "component", type: i3.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: LayerModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2664
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementProcessSelectorComponent, isStandalone: true, selector: "valtimo-widget-management-process-selector", 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<form\n [attr.data-carbon-theme]=\"theme$ | async\"\n [formGroup]=\"formGroup\"\n class=\"valtimo-widget-management-process-selector\"\n>\n <cds-combo-box\n class=\"test\"\n [label]=\"'widgetTabManagement.processes.selectorLabel' | translate\"\n [items]=\"(processDefinitionItems$ | async) || []\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.processes.selectorPlaceholder' | translate\"\n formControlName=\"processDefinition\"\n (selected)=\"onProcessSelected($event)\"\n >\n <cds-dropdown-list></cds-dropdown-list>\n </cds-combo-box>\n\n <cds-text-label>\n {{ 'widgetTabManagement.processes.buttonTextLabel' | translate }}\n\n <input\n cdsText\n type=\"text\"\n formControlName=\"name\"\n [placeholder]=\"'widgetTabManagement.processes.buttonTextPlaceholder' | translate\"\n />\n </cds-text-label>\n</form>\n", styles: [".valtimo-widget-management-process-selector{display:grid;grid-template-columns:1fr 1fr;align-items:flex-end;gap:16px}.valtimo-widget-management-process-selector ::ng-deep .cds--text-input,.valtimo-widget-management-process-selector ::ng-deep .cds--list-box{background:var(--cds-layer-02)!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: "ngmodule", type: CommonModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "component", type: i3.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: LayerModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2663
2665
  }
2664
2666
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementProcessSelectorComponent, decorators: [{
2665
2667
  type: Component,
@@ -2670,7 +2672,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
2670
2672
  ReactiveFormsModule,
2671
2673
  ComboBoxModule,
2672
2674
  LayerModule,
2673
- ], 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<form\n [attr.data-carbon-theme]=\"theme$ | async\"\n [formGroup]=\"formGroup\"\n class=\"valtimo-widget-management-process-selector\"\n>\n <cds-combo-box\n class=\"test\"\n [label]=\"'widgetTabManagement.processes.selectorLabel' | translate\"\n [items]=\"(processDefinitionItems$ | async) || []\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.processes.selectorPlaceholder' | translate\"\n formControlName=\"processDefinition\"\n (selected)=\"onProcessSelected($event)\"\n >\n <cds-dropdown-list></cds-dropdown-list>\n </cds-combo-box>\n\n <cds-text-label>\n {{ 'widgetTabManagement.processes.buttonTextLabel' | translate }}\n\n <input\n cdsText\n type=\"text\"\n formControlName=\"name\"\n [placeholder]=\"'widgetTabManagement.processes.buttonTextPlaceholder' | translate\"\n />\n </cds-text-label>\n</form>\n", styles: [".valtimo-widget-management-process-selector{display:grid;grid-template-columns:1fr 1fr;align-items:flex-end;gap:16px}.valtimo-widget-management-process-selector ::ng-deep .cds--text-input,.valtimo-widget-management-process-selector ::ng-deep .cds--list-box{background:var(--cds-layer-01)!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"] }]
2675
+ ], 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<form\n [attr.data-carbon-theme]=\"theme$ | async\"\n [formGroup]=\"formGroup\"\n class=\"valtimo-widget-management-process-selector\"\n>\n <cds-combo-box\n class=\"test\"\n [label]=\"'widgetTabManagement.processes.selectorLabel' | translate\"\n [items]=\"(processDefinitionItems$ | async) || []\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.processes.selectorPlaceholder' | translate\"\n formControlName=\"processDefinition\"\n (selected)=\"onProcessSelected($event)\"\n >\n <cds-dropdown-list></cds-dropdown-list>\n </cds-combo-box>\n\n <cds-text-label>\n {{ 'widgetTabManagement.processes.buttonTextLabel' | translate }}\n\n <input\n cdsText\n type=\"text\"\n formControlName=\"name\"\n [placeholder]=\"'widgetTabManagement.processes.buttonTextPlaceholder' | translate\"\n />\n </cds-text-label>\n</form>\n", styles: [".valtimo-widget-management-process-selector{display:grid;grid-template-columns:1fr 1fr;align-items:flex-end;gap:16px}.valtimo-widget-management-process-selector ::ng-deep .cds--text-input,.valtimo-widget-management-process-selector ::ng-deep .cds--list-box{background:var(--cds-layer-02)!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"] }]
2674
2676
  }], ctorParameters: () => [{ type: i1$1.CdsThemeService }, { type: i2$3.DocumentService }, { type: i1$3.FormBuilder }, { type: WidgetWizardService }, { type: undefined, decorators: [{
2675
2677
  type: Inject,
2676
2678
  args: [WIDGET_MANAGEMENT_SERVICE]
@@ -2772,7 +2774,7 @@ class WidgetManagementActionButtonComponent {
2772
2774
  }));
2773
2775
  }
2774
2776
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementActionButtonComponent, deps: [{ token: i1$3.FormBuilder }, { token: WidgetWizardService }], target: i0.ɵɵFactoryTarget.Component }); }
2775
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementActionButtonComponent, isStandalone: true, selector: "valtimo-widget-management-action-button", host: { properties: { "class": "this.class" } }, 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@if ($widgetContext() === 'case') {\n <cds-dropdown\n class=\"valtimo-widget-management-action-button__type\"\n [label]=\"'widgetTabManagement.actionButtonLabel' | translate\"\n [dropUp]=\"false\"\n (selected)=\"onTypeSelected($event)\"\n >\n <cds-dropdown-list [items]=\"dropdownItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n}\n\n@if ((buttonType$ | async) === 'process') {\n <valtimo-widget-management-process-selector></valtimo-widget-management-process-selector>\n} @else {\n <form class=\"valtimo-widget-management-action-button__form\" [formGroup]=\"formGroup\">\n <cds-text-label>\n {{ 'widgetTabManagement.externalLink.linkLabel' | translate }}\n\n <input\n cdsText\n formControlName=\"navigateTo\"\n [placeholder]=\"'widgetTabManagement.externalLink.linkPlaceholder' | translate\"\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'widgetTabManagement.externalLink.buttonTextLabel' | translate }}\n\n <input\n cdsText\n formControlName=\"name\"\n [placeholder]=\"'widgetTabManagement.externalLink.buttonTextPlaceholder' | translate\"\n />\n </cds-text-label>\n\n <cds-checkbox formControlName=\"openInNewTab\">\n {{ 'widgetTabManagement.externalLink.openInNewTabLabel' | translate }}\n </cds-checkbox>\n </form>\n}\n", styles: [".valtimo-widget-management-action-button{padding:12px 0 16px 16px;background:var(--cds-layer);display:flex;gap:16px}.valtimo-widget-management-action-button valtimo-widget-management-process-selector{padding-right:16px;width:100%}.valtimo-widget-management-action-button__type .cds--list-box,.valtimo-widget-management-action-button__form .cds--text-input{background:var(--cds-layer-02)}.valtimo-widget-management-action-button__type{width:300px}.valtimo-widget-management-action-button__form{padding-right:16px;display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:flex-end;width:100%}\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: "ngmodule", type: CommonModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "component", type: WidgetManagementProcessSelectorComponent, selector: "valtimo-widget-management-process-selector" }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i3.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2777
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementActionButtonComponent, isStandalone: true, selector: "valtimo-widget-management-action-button", host: { properties: { "class": "this.class" } }, 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@if ($widgetContext() === 'case') {\n <cds-dropdown\n class=\"valtimo-widget-management-action-button__type\"\n [label]=\"'widgetTabManagement.actionButtonLabel' | translate\"\n [dropUp]=\"false\"\n (selected)=\"onTypeSelected($event)\"\n >\n <cds-dropdown-list [items]=\"dropdownItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n}\n\n@if ((buttonType$ | async) === 'process') {\n <valtimo-widget-management-process-selector></valtimo-widget-management-process-selector>\n} @else {\n <form class=\"valtimo-widget-management-action-button__form\" [formGroup]=\"formGroup\">\n <cds-text-label>\n {{ 'widgetTabManagement.externalLink.linkLabel' | translate }}\n\n <input\n cdsText\n formControlName=\"navigateTo\"\n [placeholder]=\"'widgetTabManagement.externalLink.linkPlaceholder' | translate\"\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'widgetTabManagement.externalLink.buttonTextLabel' | translate }}\n\n <input\n cdsText\n formControlName=\"name\"\n [placeholder]=\"'widgetTabManagement.externalLink.buttonTextPlaceholder' | translate\"\n />\n </cds-text-label>\n\n <cds-checkbox formControlName=\"openInNewTab\">\n {{ 'widgetTabManagement.externalLink.openInNewTabLabel' | translate }}\n </cds-checkbox>\n </form>\n}\n", styles: [".valtimo-widget-management-action-button{display:flex;gap:16px}.valtimo-widget-management-action-button valtimo-widget-management-process-selector{padding-right:16px;width:100%}::ng-deep .valtimo-widget-management-action-button__type .cds--list-box,::ng-deep .valtimo-widget-management-action-button__form .cds--text-input{background:var(--cds-layer-01)}.valtimo-widget-management-action-button__type{width:300px}.valtimo-widget-management-action-button__form{padding-right:16px;display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:flex-end;width:100%}\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: "ngmodule", type: CommonModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "component", type: WidgetManagementProcessSelectorComponent, selector: "valtimo-widget-management-process-selector" }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i3.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
2776
2778
  }
2777
2779
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementActionButtonComponent, decorators: [{
2778
2780
  type: Component,
@@ -2784,7 +2786,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
2784
2786
  InputModule,
2785
2787
  ReactiveFormsModule,
2786
2788
  TranslateModule,
2787
- ], 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@if ($widgetContext() === 'case') {\n <cds-dropdown\n class=\"valtimo-widget-management-action-button__type\"\n [label]=\"'widgetTabManagement.actionButtonLabel' | translate\"\n [dropUp]=\"false\"\n (selected)=\"onTypeSelected($event)\"\n >\n <cds-dropdown-list [items]=\"dropdownItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n}\n\n@if ((buttonType$ | async) === 'process') {\n <valtimo-widget-management-process-selector></valtimo-widget-management-process-selector>\n} @else {\n <form class=\"valtimo-widget-management-action-button__form\" [formGroup]=\"formGroup\">\n <cds-text-label>\n {{ 'widgetTabManagement.externalLink.linkLabel' | translate }}\n\n <input\n cdsText\n formControlName=\"navigateTo\"\n [placeholder]=\"'widgetTabManagement.externalLink.linkPlaceholder' | translate\"\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'widgetTabManagement.externalLink.buttonTextLabel' | translate }}\n\n <input\n cdsText\n formControlName=\"name\"\n [placeholder]=\"'widgetTabManagement.externalLink.buttonTextPlaceholder' | translate\"\n />\n </cds-text-label>\n\n <cds-checkbox formControlName=\"openInNewTab\">\n {{ 'widgetTabManagement.externalLink.openInNewTabLabel' | translate }}\n </cds-checkbox>\n </form>\n}\n", styles: [".valtimo-widget-management-action-button{padding:12px 0 16px 16px;background:var(--cds-layer);display:flex;gap:16px}.valtimo-widget-management-action-button valtimo-widget-management-process-selector{padding-right:16px;width:100%}.valtimo-widget-management-action-button__type .cds--list-box,.valtimo-widget-management-action-button__form .cds--text-input{background:var(--cds-layer-02)}.valtimo-widget-management-action-button__type{width:300px}.valtimo-widget-management-action-button__form{padding-right:16px;display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:flex-end;width:100%}\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"] }]
2789
+ ], 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@if ($widgetContext() === 'case') {\n <cds-dropdown\n class=\"valtimo-widget-management-action-button__type\"\n [label]=\"'widgetTabManagement.actionButtonLabel' | translate\"\n [dropUp]=\"false\"\n (selected)=\"onTypeSelected($event)\"\n >\n <cds-dropdown-list [items]=\"dropdownItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n}\n\n@if ((buttonType$ | async) === 'process') {\n <valtimo-widget-management-process-selector></valtimo-widget-management-process-selector>\n} @else {\n <form class=\"valtimo-widget-management-action-button__form\" [formGroup]=\"formGroup\">\n <cds-text-label>\n {{ 'widgetTabManagement.externalLink.linkLabel' | translate }}\n\n <input\n cdsText\n formControlName=\"navigateTo\"\n [placeholder]=\"'widgetTabManagement.externalLink.linkPlaceholder' | translate\"\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'widgetTabManagement.externalLink.buttonTextLabel' | translate }}\n\n <input\n cdsText\n formControlName=\"name\"\n [placeholder]=\"'widgetTabManagement.externalLink.buttonTextPlaceholder' | translate\"\n />\n </cds-text-label>\n\n <cds-checkbox formControlName=\"openInNewTab\">\n {{ 'widgetTabManagement.externalLink.openInNewTabLabel' | translate }}\n </cds-checkbox>\n </form>\n}\n", styles: [".valtimo-widget-management-action-button{display:flex;gap:16px}.valtimo-widget-management-action-button valtimo-widget-management-process-selector{padding-right:16px;width:100%}::ng-deep .valtimo-widget-management-action-button__type .cds--list-box,::ng-deep .valtimo-widget-management-action-button__form .cds--text-input{background:var(--cds-layer-01)}.valtimo-widget-management-action-button__type{width:300px}.valtimo-widget-management-action-button__form{padding-right:16px;display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:flex-end;width:100%}\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"] }]
2788
2790
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: WidgetWizardService }], propDecorators: { class: [{
2789
2791
  type: HostBinding,
2790
2792
  args: ['class']
@@ -3174,6 +3176,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
3174
3176
  * See the License for the specific language governing permissions and
3175
3177
  * limitations under the License.
3176
3178
  */
3179
+ const SPECIFIC_WIDGET_TYPES = new Set([
3180
+ WidgetType.METROLINE,
3181
+ WidgetType.PERSON_CARD,
3182
+ WidgetType.HIGHLIGHT,
3183
+ ]);
3177
3184
  class WidgetWizardTypeStepComponent {
3178
3185
  constructor(widgetWizardService) {
3179
3186
  this.widgetWizardService = widgetWizardService;
@@ -3184,6 +3191,8 @@ class WidgetWizardTypeStepComponent {
3184
3191
  ? AVAILABLE_WIDGETS
3185
3192
  : AVAILABLE_WIDGETS.filter((typeSelection) => availableTypes.includes(typeSelection.type));
3186
3193
  });
3194
+ this.$genericWidgetTypes = computed(() => this.$availableWidgetTypes().filter(w => !SPECIFIC_WIDGET_TYPES.has(w.type)));
3195
+ this.$specificWidgetTypes = computed(() => this.$availableWidgetTypes().filter(w => SPECIFIC_WIDGET_TYPES.has(w.type)));
3187
3196
  this.$selectedWidget = this.widgetWizardService.$selectedWidget;
3188
3197
  }
3189
3198
  onSelectedEvent(event) {
@@ -3194,11 +3203,11 @@ class WidgetWizardTypeStepComponent {
3194
3203
  this.widgetWizardService.$selectedWidget.set(event.value);
3195
3204
  }
3196
3205
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetWizardTypeStepComponent, deps: [{ token: WidgetWizardService }], target: i0.ɵɵFactoryTarget.Component }); }
3197
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetWizardTypeStepComponent, isStandalone: true, selector: "ng-component", 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-tile-group\n [multiple]=\"false\"\n (selected)=\"onSelectedEvent($event)\"\n class=\"valtimo-widget-wizard-step__content\"\n>\n @for (widgetType of $availableWidgetTypes(); track widgetType.titleKey) {\n <cds-selection-tile\n class=\"valtimo-widget-wizard-step__tile\"\n [attr.data-test-id]=\"'widgetWizardTypeTile-' + widgetType.type\"\n [value]=\"widgetType\"\n [selected]=\"widgetType.type === $selectedWidget()?.type\"\n >\n <h3 class=\"valtimo-widget-wizard-step__tile-title\">{{ widgetType.titleKey | translate }}</h3>\n\n <span>{{ widgetType.descriptionKey | translate }}</span>\n\n <img [src]=\"widgetType.illustrationUrl\" [alt]=\"widgetType.titleKey | translate\" />\n </cds-selection-tile>\n }\n</cds-tile-group>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TilesModule }, { kind: "component", type: i3.SelectionTile, selector: "cds-selection-tile, ibm-selection-tile", inputs: ["theme", "id", "selected", "value", "disabled"], outputs: ["change"] }, { kind: "component", type: i3.TileGroup, selector: "cds-tile-group, ibm-tile-group", inputs: ["name", "multiple", "legend"], outputs: ["selected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3206
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetWizardTypeStepComponent, isStandalone: true, selector: "ng-component", 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@if ($genericWidgetTypes().length > 0) {\n <section class=\"valtimo-widget-wizard-type-step__group\">\n <p class=\"valtimo-widget-wizard-type-step__group-title\">\n {{ 'widgetTabManagement.type.generic.title' | translate }}\n </p>\n <p class=\"valtimo-widget-wizard-type-step__group-description\">\n {{ 'widgetTabManagement.type.generic.description' | translate }}\n </p>\n\n <cds-tile-group\n [multiple]=\"false\"\n (selected)=\"onSelectedEvent($event)\"\n class=\"valtimo-widget-wizard-step__content\"\n >\n @for (widgetType of $genericWidgetTypes(); track widgetType.titleKey) {\n <cds-selection-tile\n class=\"valtimo-widget-wizard-step__tile\"\n [attr.data-test-id]=\"'widgetWizardTypeTile-' + widgetType.type\"\n [value]=\"widgetType\"\n [selected]=\"widgetType.type === $selectedWidget()?.type\"\n >\n <h3 class=\"valtimo-widget-wizard-step__tile-title\">{{ widgetType.titleKey | translate }}</h3>\n\n <span>{{ widgetType.descriptionKey | translate }}</span>\n\n <img [src]=\"widgetType.illustrationUrl\" [alt]=\"widgetType.titleKey | translate\" />\n </cds-selection-tile>\n }\n </cds-tile-group>\n </section>\n}\n\n@if ($specificWidgetTypes().length > 0) {\n <section class=\"valtimo-widget-wizard-type-step__group\">\n <p class=\"valtimo-widget-wizard-type-step__group-title\">\n {{ 'widgetTabManagement.type.specific.title' | translate }}\n </p>\n <p class=\"valtimo-widget-wizard-type-step__group-description\">\n {{ 'widgetTabManagement.type.specific.description' | translate }}\n </p>\n\n <cds-tile-group\n [multiple]=\"false\"\n (selected)=\"onSelectedEvent($event)\"\n class=\"valtimo-widget-wizard-step__content\"\n >\n @for (widgetType of $specificWidgetTypes(); track widgetType.titleKey) {\n <cds-selection-tile\n class=\"valtimo-widget-wizard-step__tile\"\n [attr.data-test-id]=\"'widgetWizardTypeTile-' + widgetType.type\"\n [value]=\"widgetType\"\n [selected]=\"widgetType.type === $selectedWidget()?.type\"\n >\n <h3 class=\"valtimo-widget-wizard-step__tile-title\">{{ widgetType.titleKey | translate }}</h3>\n\n <span>{{ widgetType.descriptionKey | translate }}</span>\n\n <img [src]=\"widgetType.illustrationUrl\" [alt]=\"widgetType.titleKey | translate\" />\n </cds-selection-tile>\n }\n </cds-tile-group>\n </section>\n}\n", styles: [".valtimo-widget-wizard-type-step__group+.valtimo-widget-wizard-type-step__group{margin-top:24px}.valtimo-widget-wizard-type-step__group-title{font-weight:600;margin-bottom:4px}.valtimo-widget-wizard-type-step__group-description{margin-bottom:12px;font-size:.875rem;line-height:1.25rem;letter-spacing:.16px;color:#525252}.valtimo-widget-wizard-type-step__group cds-selection-tile{position:relative}\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: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TilesModule }, { kind: "component", type: i3.SelectionTile, selector: "cds-selection-tile, ibm-selection-tile", inputs: ["theme", "id", "selected", "value", "disabled"], outputs: ["change"] }, { kind: "component", type: i3.TileGroup, selector: "cds-tile-group, ibm-tile-group", inputs: ["name", "multiple", "legend"], outputs: ["selected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3198
3207
  }
3199
3208
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetWizardTypeStepComponent, decorators: [{
3200
3209
  type: Component,
3201
- args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule, TranslateModule, TilesModule], 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-tile-group\n [multiple]=\"false\"\n (selected)=\"onSelectedEvent($event)\"\n class=\"valtimo-widget-wizard-step__content\"\n>\n @for (widgetType of $availableWidgetTypes(); track widgetType.titleKey) {\n <cds-selection-tile\n class=\"valtimo-widget-wizard-step__tile\"\n [attr.data-test-id]=\"'widgetWizardTypeTile-' + widgetType.type\"\n [value]=\"widgetType\"\n [selected]=\"widgetType.type === $selectedWidget()?.type\"\n >\n <h3 class=\"valtimo-widget-wizard-step__tile-title\">{{ widgetType.titleKey | translate }}</h3>\n\n <span>{{ widgetType.descriptionKey | translate }}</span>\n\n <img [src]=\"widgetType.illustrationUrl\" [alt]=\"widgetType.titleKey | translate\" />\n </cds-selection-tile>\n }\n</cds-tile-group>\n" }]
3210
+ args: [{ changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule, TranslateModule, TilesModule], 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@if ($genericWidgetTypes().length > 0) {\n <section class=\"valtimo-widget-wizard-type-step__group\">\n <p class=\"valtimo-widget-wizard-type-step__group-title\">\n {{ 'widgetTabManagement.type.generic.title' | translate }}\n </p>\n <p class=\"valtimo-widget-wizard-type-step__group-description\">\n {{ 'widgetTabManagement.type.generic.description' | translate }}\n </p>\n\n <cds-tile-group\n [multiple]=\"false\"\n (selected)=\"onSelectedEvent($event)\"\n class=\"valtimo-widget-wizard-step__content\"\n >\n @for (widgetType of $genericWidgetTypes(); track widgetType.titleKey) {\n <cds-selection-tile\n class=\"valtimo-widget-wizard-step__tile\"\n [attr.data-test-id]=\"'widgetWizardTypeTile-' + widgetType.type\"\n [value]=\"widgetType\"\n [selected]=\"widgetType.type === $selectedWidget()?.type\"\n >\n <h3 class=\"valtimo-widget-wizard-step__tile-title\">{{ widgetType.titleKey | translate }}</h3>\n\n <span>{{ widgetType.descriptionKey | translate }}</span>\n\n <img [src]=\"widgetType.illustrationUrl\" [alt]=\"widgetType.titleKey | translate\" />\n </cds-selection-tile>\n }\n </cds-tile-group>\n </section>\n}\n\n@if ($specificWidgetTypes().length > 0) {\n <section class=\"valtimo-widget-wizard-type-step__group\">\n <p class=\"valtimo-widget-wizard-type-step__group-title\">\n {{ 'widgetTabManagement.type.specific.title' | translate }}\n </p>\n <p class=\"valtimo-widget-wizard-type-step__group-description\">\n {{ 'widgetTabManagement.type.specific.description' | translate }}\n </p>\n\n <cds-tile-group\n [multiple]=\"false\"\n (selected)=\"onSelectedEvent($event)\"\n class=\"valtimo-widget-wizard-step__content\"\n >\n @for (widgetType of $specificWidgetTypes(); track widgetType.titleKey) {\n <cds-selection-tile\n class=\"valtimo-widget-wizard-step__tile\"\n [attr.data-test-id]=\"'widgetWizardTypeTile-' + widgetType.type\"\n [value]=\"widgetType\"\n [selected]=\"widgetType.type === $selectedWidget()?.type\"\n >\n <h3 class=\"valtimo-widget-wizard-step__tile-title\">{{ widgetType.titleKey | translate }}</h3>\n\n <span>{{ widgetType.descriptionKey | translate }}</span>\n\n <img [src]=\"widgetType.illustrationUrl\" [alt]=\"widgetType.titleKey | translate\" />\n </cds-selection-tile>\n }\n </cds-tile-group>\n </section>\n}\n", styles: [".valtimo-widget-wizard-type-step__group+.valtimo-widget-wizard-type-step__group{margin-top:24px}.valtimo-widget-wizard-type-step__group-title{font-weight:600;margin-bottom:4px}.valtimo-widget-wizard-type-step__group-description{margin-bottom:12px;font-size:.875rem;line-height:1.25rem;letter-spacing:.16px;color:#525252}.valtimo-widget-wizard-type-step__group cds-selection-tile{position:relative}\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"] }]
3202
3211
  }], ctorParameters: () => [{ type: WidgetWizardService }] });
3203
3212
 
3204
3213
  /*
@@ -3761,7 +3770,7 @@ class WidgetManagementWizardComponent {
3761
3770
  this.cdr.detectChanges();
3762
3771
  }
3763
3772
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementWizardComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.KeyGeneratorService }, { token: i2$2.TranslateService }, { token: WidgetWizardService }], target: i0.ɵɵFactoryTarget.Component }); }
3764
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementWizardComponent, isStandalone: true, selector: "valtimo-widget-management-wizard", inputs: { open: "open", disableDuplicate: "disableDuplicate", editMode: "editMode" }, outputs: { closeEvent: "closeEvent" }, viewQueries: [{ propertyName: "_vcr", first: true, predicate: ["wizardStepRenderer"], descendants: true, read: ViewContainerRef }], 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 [open]=\"open\"\n showFooter=\"true\"\n size=\"lg\"\n valtimoCdsModal\n class=\"valtimo-widget-management-wizard\"\n (close)=\"onClose()\"\n>\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onClose()\">\n <h3 cdsModalHeaderHeading>\n {{ 'widgetTabManagement.wizard.' + (editMode ? 'edit' : 'create') | translate }}\n </h3>\n </cds-modal-header>\n\n <section cdsModalContent class=\"valtimo-widget-management-wizard__content\">\n <cds-progress-indicator\n [current]=\"$currentStepIndex()\"\n [spacing]=\"'equal'\"\n [steps]=\"steps$ | async\"\n (stepSelected)=\"onStepSelected($event)\"\n >\n </cds-progress-indicator>\n\n @if (stepLabel$ | async; as stepLabel) {\n <p>{{ stepLabel }}</p>\n }\n\n <ng-template #wizardStepRenderer></ng-template>\n </section>\n\n <cds-modal-footer class=\"valtimo-widget-management-wizard__footer\">\n <button class=\"valtimo-widget-management-wizard__cancel\" cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"onClose()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n @if ($currentStepIndex() !== 0) {\n <button\n class=\"valtimo-widget-management-wizard__back\"\n cdsButton=\"secondary\"\n [attr.data-test-id]=\"testIds.backButton\"\n [disabled]=\"$backButtonDisabled()\"\n (click)=\"onBackButtonClick()\"\n >\n {{ 'interface.back' | translate }}\n </button>\n }\n\n <button\n class=\"valtimo-widget-management-wizard__next\"\n cdsButton=\"primary\"\n [attr.data-test-id]=\"$currentStepIndex() === (numberOfSteps$ | async) - 1 ? testIds.saveButton : testIds.nextButton\"\n [disabled]=\"$nextButtonDisabled()\"\n (click)=\"onNextButtonClick()\"\n >\n {{\n 'interface.' + ($currentStepIndex() === (numberOfSteps$ | async) - 1 ? 'save' : 'next')\n | translate\n }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-widget-management-wizard__content{display:flex;flex-direction:column;gap:32px}.valtimo-widget-management-wizard__footer footer{display:grid;grid-template-columns:repeat(4,1fr);grid-template-areas:\"cancel . back next\"}.valtimo-widget-management-wizard__footer footer button{width:100%}.valtimo-widget-management-wizard__cancel{grid-area:cancel}.valtimo-widget-management-wizard__back{grid-area:back}.valtimo-widget-management-wizard__next{grid-area:next}.valtimo-widget-management-wizard .cds--modal-container{height:88%;background:var(--cds-layer-02)}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__content fieldset{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile{height:100%}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile-content{display:flex;flex-direction:column;max-width:260px;gap:16px;justify-content:space-between}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile:not(.cds--tile--disabled) .cds--tile-content{color:var(--cds-text-primary)}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile-title{font-size:20px}.valtimo-widget-management-wizard .cds--tile--selectable svg{display:none}.valtimo-widget-management-wizard .cds--tile--selectable.cds--tile--is-selected svg{display:block}.valtimo-widget-management-wizard .cds--tab-content{padding: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: "ngmodule", type: CommonModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ProgressIndicatorModule }, { kind: "component", type: i3.ProgressIndicator, selector: "cds-progress-indicator, ibm-progress-indicator", inputs: ["current", "steps", "translations", "orientation", "skeleton", "spacing"], outputs: ["stepSelected"] }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i3.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i3.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i3.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i3.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i3.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3773
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementWizardComponent, isStandalone: true, selector: "valtimo-widget-management-wizard", inputs: { open: "open", disableDuplicate: "disableDuplicate", editMode: "editMode" }, outputs: { closeEvent: "closeEvent" }, viewQueries: [{ propertyName: "_vcr", first: true, predicate: ["wizardStepRenderer"], descendants: true, read: ViewContainerRef }], 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 [open]=\"open\"\n showFooter=\"true\"\n size=\"lg\"\n valtimoCdsModal\n class=\"valtimo-widget-management-wizard\"\n (close)=\"onClose()\"\n>\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onClose()\">\n <h3 cdsModalHeaderHeading>\n {{ 'widgetTabManagement.wizard.' + (editMode ? 'edit' : 'create') | translate }}\n </h3>\n </cds-modal-header>\n\n <section cdsModalContent class=\"valtimo-widget-management-wizard__content\">\n <cds-progress-indicator\n [current]=\"$currentStepIndex()\"\n [spacing]=\"'equal'\"\n [steps]=\"steps$ | async\"\n (stepSelected)=\"onStepSelected($event)\"\n >\n </cds-progress-indicator>\n\n @if (stepLabel$ | async; as stepLabel) {\n <p>{{ stepLabel }}</p>\n }\n\n <ng-template #wizardStepRenderer></ng-template>\n </section>\n\n <cds-modal-footer class=\"valtimo-widget-management-wizard__footer\">\n <button class=\"valtimo-widget-management-wizard__cancel\" cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"onClose()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n @if ($currentStepIndex() !== 0) {\n <button\n class=\"valtimo-widget-management-wizard__back\"\n cdsButton=\"secondary\"\n [attr.data-test-id]=\"testIds.backButton\"\n [disabled]=\"$backButtonDisabled()\"\n (click)=\"onBackButtonClick()\"\n >\n {{ 'interface.back' | translate }}\n </button>\n }\n\n <button\n class=\"valtimo-widget-management-wizard__next\"\n cdsButton=\"primary\"\n [attr.data-test-id]=\"$currentStepIndex() === (numberOfSteps$ | async) - 1 ? testIds.saveButton : testIds.nextButton\"\n [disabled]=\"$nextButtonDisabled()\"\n (click)=\"onNextButtonClick()\"\n >\n {{\n 'interface.' + ($currentStepIndex() === (numberOfSteps$ | async) - 1 ? 'save' : 'next')\n | translate\n }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-widget-management-wizard__content{display:flex;flex-direction:column}.valtimo-widget-management-wizard__content cds-progress-indicator{margin-bottom:32px}.valtimo-widget-management-wizard__content>p{margin:0;padding-bottom:16px}.valtimo-widget-management-wizard__footer footer{display:grid;grid-template-columns:repeat(4,1fr);grid-template-areas:\"cancel . back next\"}.valtimo-widget-management-wizard__footer footer button{width:100%}.valtimo-widget-management-wizard__cancel{grid-area:cancel}.valtimo-widget-management-wizard__back{grid-area:back}.valtimo-widget-management-wizard__next{grid-area:next}.valtimo-widget-management-wizard .cds--modal-container{height:88%;background:var(--cds-layer-02)}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__content fieldset{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile{height:100%}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile-content{display:flex;flex-direction:column;max-width:260px;gap:16px;justify-content:space-between}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile:not(.cds--tile--disabled) .cds--tile-content{color:var(--cds-text-primary)}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile-title{font-size:20px}.valtimo-widget-management-wizard .cds--tile--selectable svg{display:none}.valtimo-widget-management-wizard .cds--tile--selectable.cds--tile--is-selected svg{display:block}.valtimo-widget-management-wizard .cds--tab-content{padding: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: "ngmodule", type: CommonModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ProgressIndicatorModule }, { kind: "component", type: i3.ProgressIndicator, selector: "cds-progress-indicator, ibm-progress-indicator", inputs: ["current", "steps", "translations", "orientation", "skeleton", "spacing"], outputs: ["stepSelected"] }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i3.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i3.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i3.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i3.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i3.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3765
3774
  }
3766
3775
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementWizardComponent, decorators: [{
3767
3776
  type: Component,
@@ -3772,7 +3781,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
3772
3781
  ModalModule,
3773
3782
  ButtonModule,
3774
3783
  ...WIDGET_STEPS,
3775
- ], 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 [open]=\"open\"\n showFooter=\"true\"\n size=\"lg\"\n valtimoCdsModal\n class=\"valtimo-widget-management-wizard\"\n (close)=\"onClose()\"\n>\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onClose()\">\n <h3 cdsModalHeaderHeading>\n {{ 'widgetTabManagement.wizard.' + (editMode ? 'edit' : 'create') | translate }}\n </h3>\n </cds-modal-header>\n\n <section cdsModalContent class=\"valtimo-widget-management-wizard__content\">\n <cds-progress-indicator\n [current]=\"$currentStepIndex()\"\n [spacing]=\"'equal'\"\n [steps]=\"steps$ | async\"\n (stepSelected)=\"onStepSelected($event)\"\n >\n </cds-progress-indicator>\n\n @if (stepLabel$ | async; as stepLabel) {\n <p>{{ stepLabel }}</p>\n }\n\n <ng-template #wizardStepRenderer></ng-template>\n </section>\n\n <cds-modal-footer class=\"valtimo-widget-management-wizard__footer\">\n <button class=\"valtimo-widget-management-wizard__cancel\" cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"onClose()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n @if ($currentStepIndex() !== 0) {\n <button\n class=\"valtimo-widget-management-wizard__back\"\n cdsButton=\"secondary\"\n [attr.data-test-id]=\"testIds.backButton\"\n [disabled]=\"$backButtonDisabled()\"\n (click)=\"onBackButtonClick()\"\n >\n {{ 'interface.back' | translate }}\n </button>\n }\n\n <button\n class=\"valtimo-widget-management-wizard__next\"\n cdsButton=\"primary\"\n [attr.data-test-id]=\"$currentStepIndex() === (numberOfSteps$ | async) - 1 ? testIds.saveButton : testIds.nextButton\"\n [disabled]=\"$nextButtonDisabled()\"\n (click)=\"onNextButtonClick()\"\n >\n {{\n 'interface.' + ($currentStepIndex() === (numberOfSteps$ | async) - 1 ? 'save' : 'next')\n | translate\n }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-widget-management-wizard__content{display:flex;flex-direction:column;gap:32px}.valtimo-widget-management-wizard__footer footer{display:grid;grid-template-columns:repeat(4,1fr);grid-template-areas:\"cancel . back next\"}.valtimo-widget-management-wizard__footer footer button{width:100%}.valtimo-widget-management-wizard__cancel{grid-area:cancel}.valtimo-widget-management-wizard__back{grid-area:back}.valtimo-widget-management-wizard__next{grid-area:next}.valtimo-widget-management-wizard .cds--modal-container{height:88%;background:var(--cds-layer-02)}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__content fieldset{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile{height:100%}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile-content{display:flex;flex-direction:column;max-width:260px;gap:16px;justify-content:space-between}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile:not(.cds--tile--disabled) .cds--tile-content{color:var(--cds-text-primary)}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile-title{font-size:20px}.valtimo-widget-management-wizard .cds--tile--selectable svg{display:none}.valtimo-widget-management-wizard .cds--tile--selectable.cds--tile--is-selected svg{display:block}.valtimo-widget-management-wizard .cds--tab-content{padding: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"] }]
3784
+ ], 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 [open]=\"open\"\n showFooter=\"true\"\n size=\"lg\"\n valtimoCdsModal\n class=\"valtimo-widget-management-wizard\"\n (close)=\"onClose()\"\n>\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onClose()\">\n <h3 cdsModalHeaderHeading>\n {{ 'widgetTabManagement.wizard.' + (editMode ? 'edit' : 'create') | translate }}\n </h3>\n </cds-modal-header>\n\n <section cdsModalContent class=\"valtimo-widget-management-wizard__content\">\n <cds-progress-indicator\n [current]=\"$currentStepIndex()\"\n [spacing]=\"'equal'\"\n [steps]=\"steps$ | async\"\n (stepSelected)=\"onStepSelected($event)\"\n >\n </cds-progress-indicator>\n\n @if (stepLabel$ | async; as stepLabel) {\n <p>{{ stepLabel }}</p>\n }\n\n <ng-template #wizardStepRenderer></ng-template>\n </section>\n\n <cds-modal-footer class=\"valtimo-widget-management-wizard__footer\">\n <button class=\"valtimo-widget-management-wizard__cancel\" cdsButton=\"ghost\" [attr.data-test-id]=\"testIds.cancelButton\" (click)=\"onClose()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n @if ($currentStepIndex() !== 0) {\n <button\n class=\"valtimo-widget-management-wizard__back\"\n cdsButton=\"secondary\"\n [attr.data-test-id]=\"testIds.backButton\"\n [disabled]=\"$backButtonDisabled()\"\n (click)=\"onBackButtonClick()\"\n >\n {{ 'interface.back' | translate }}\n </button>\n }\n\n <button\n class=\"valtimo-widget-management-wizard__next\"\n cdsButton=\"primary\"\n [attr.data-test-id]=\"$currentStepIndex() === (numberOfSteps$ | async) - 1 ? testIds.saveButton : testIds.nextButton\"\n [disabled]=\"$nextButtonDisabled()\"\n (click)=\"onNextButtonClick()\"\n >\n {{\n 'interface.' + ($currentStepIndex() === (numberOfSteps$ | async) - 1 ? 'save' : 'next')\n | translate\n }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-widget-management-wizard__content{display:flex;flex-direction:column}.valtimo-widget-management-wizard__content cds-progress-indicator{margin-bottom:32px}.valtimo-widget-management-wizard__content>p{margin:0;padding-bottom:16px}.valtimo-widget-management-wizard__footer footer{display:grid;grid-template-columns:repeat(4,1fr);grid-template-areas:\"cancel . back next\"}.valtimo-widget-management-wizard__footer footer button{width:100%}.valtimo-widget-management-wizard__cancel{grid-area:cancel}.valtimo-widget-management-wizard__back{grid-area:back}.valtimo-widget-management-wizard__next{grid-area:next}.valtimo-widget-management-wizard .cds--modal-container{height:88%;background:var(--cds-layer-02)}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__content fieldset{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile{height:100%}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile-content{display:flex;flex-direction:column;max-width:260px;gap:16px;justify-content:space-between}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile .cds--tile:not(.cds--tile--disabled) .cds--tile-content{color:var(--cds-text-primary)}.valtimo-widget-management-wizard .valtimo-widget-wizard-step__tile-title{font-size:20px}.valtimo-widget-management-wizard .cds--tile--selectable svg{display:none}.valtimo-widget-management-wizard .cds--tile--selectable.cds--tile--is-selected svg{display:block}.valtimo-widget-management-wizard .cds--tab-content{padding: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"] }]
3776
3785
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.KeyGeneratorService }, { type: i2$2.TranslateService }, { type: WidgetWizardService }], propDecorators: { _vcr: [{
3777
3786
  type: ViewChild,
3778
3787
  args: ['wizardStepRenderer', { read: ViewContainerRef }]
@@ -4410,6 +4419,7 @@ class WidgetPersonCardComponent {
4410
4419
  return '';
4411
4420
  return fullName
4412
4421
  .split(/\s+/)
4422
+ .slice(0, 2)
4413
4423
  .map(word => word.charAt(0).toUpperCase())
4414
4424
  .join('');
4415
4425
  });
@@ -4443,14 +4453,17 @@ class WidgetPersonCardComponent {
4443
4453
  this.$subtitle = computed(() => {
4444
4454
  const ageValue = this.$age();
4445
4455
  const city = this.$widgetData()?.city?.trim();
4446
- const ageLabel = ageValue !== null
4447
- ? this.translateService.instant('widgets.personCard.age', { age: ageValue })
4448
- : '-';
4449
- const cityLabel = city || '-';
4450
- return `${ageLabel} · ${cityLabel}`;
4456
+ const parts = [];
4457
+ if (ageValue !== null) {
4458
+ parts.push(this.translateService.instant('widgets.personCard.age', { age: ageValue }));
4459
+ }
4460
+ if (city) {
4461
+ parts.push(city);
4462
+ }
4463
+ return parts.join(' · ');
4451
4464
  });
4452
4465
  this._subscriptions = new Subscription();
4453
- this.iconService.registerAll([Phone20, Email20, Calendar20]);
4466
+ this.iconService.registerAll([Phone16, Email16, Calendar16]);
4454
4467
  this._subscriptions.add(this.translateService.onLangChange.subscribe(event => this.$currentLang.set(event.lang)));
4455
4468
  this._subscriptions.add(this.cdsThemeService.currentTheme$.subscribe(theme => this.$themeVariant.set(theme === CurrentCarbonTheme.G10 ? 'light' : 'dark')));
4456
4469
  }
@@ -4458,11 +4471,11 @@ class WidgetPersonCardComponent {
4458
4471
  this._subscriptions.unsubscribe();
4459
4472
  }
4460
4473
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetPersonCardComponent, deps: [{ token: i2$2.TranslateService }, { token: i3.IconService }, { token: i1$1.CdsThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
4461
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetPersonCardComponent, isStandalone: true, selector: "valtimo-widget-person-card", inputs: { widgetData: "widgetData" }, host: { properties: { "class": "this.class" } }, 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@let data = $widgetData();\n\n<div\n class=\"valtimo-widget-person-card__avatar\"\n [attr.aria-hidden]=\"true\"\n [style.background-color]=\"$avatarColors().background\"\n>\n @if (data) {\n <span\n class=\"valtimo-widget-person-card__initials\"\n [style.color]=\"$avatarColors().text\"\n >{{ $initials() }}</span>\n } @else {\n <cds-skeleton-text [lines]=\"1\" [maxLineWidth]=\"60\"></cds-skeleton-text>\n }\n</div>\n\n<div class=\"valtimo-widget-person-card__body\">\n <h3 class=\"valtimo-widget-person-card__name\">\n @if (data) {\n {{ data.fullName || '-' }}\n } @else {\n <cds-skeleton-text [lines]=\"1\" [maxLineWidth]=\"60\"></cds-skeleton-text>\n }\n </h3>\n\n <p class=\"valtimo-widget-person-card__subtitle\">{{ $subtitle() }}</p>\n\n <dl class=\"valtimo-widget-person-card__grid\">\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"phone\"\n size=\"20\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.phone || '-' }}</span>\n </div>\n\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"email\"\n size=\"20\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.email || '-' }}</span>\n </div>\n\n <div class=\"valtimo-widget-person-card__field\">\n <span class=\"valtimo-widget-person-card__field-icon valtimo-widget-person-card__bsn-icon\">\n BSN\n </span>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.bsn || '-' }}</span>\n </div>\n\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"calendar\"\n size=\"20\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{\n $formattedBirthDate() || '-'\n }}</span>\n </div>\n </dl>\n</div>\n", styles: [".valtimo-widget-person-card{container-type:inline-size;display:flex;flex-direction:row;align-items:flex-start;gap:16px;padding:16px}.valtimo-widget-person-card__avatar{flex:0 0 auto;width:64px;height:64px;border-radius:50%;background-color:#d5d3f0;display:flex;align-items:center;justify-content:center}.valtimo-widget-person-card__initials{font-size:22px;font-weight:600;line-height:1;color:#1a146a;text-transform:uppercase}.valtimo-widget-person-card__body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__name{margin:0;font-size:18px;font-weight:600;line-height:24px}.valtimo-widget-person-card__subtitle{margin:0;font-size:14px;line-height:20px;color:var(--widget-text-color, var(--cds-text-secondary))}.valtimo-widget-person-card__grid{margin:4px 0 0;display:grid;grid-template-columns:1fr;row-gap:6px}.valtimo-widget-person-card__field{display:flex;align-items:center;gap:8px;min-width:0}.valtimo-widget-person-card__field-icon{flex:0 0 auto;width:20px;height:20px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__bsn-icon{display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;letter-spacing:.5px;line-height:1}.valtimo-widget-person-card__field-value{font-size:14px;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@container (min-width: 480px){.valtimo-widget-person-card{gap:24px;padding:24px}.valtimo-widget-person-card__avatar{width:96px;height:96px}.valtimo-widget-person-card__initials{font-size:32px}.valtimo-widget-person-card__body{gap:6px}.valtimo-widget-person-card__name{font-size:24px;line-height:32px}.valtimo-widget-person-card__subtitle{font-size:16px;line-height:24px}.valtimo-widget-person-card__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,auto);grid-auto-flow:column;column-gap:32px;row-gap:8px}.valtimo-widget-person-card__field{gap:12px}.valtimo-widget-person-card__field-value{font-size:16px;line-height:24px}}\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: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i3.SkeletonText, selector: "cds-skeleton-text, ibm-skeleton-text", inputs: ["lines", "minLineWidth", "maxLineWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
4474
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetPersonCardComponent, isStandalone: true, selector: "valtimo-widget-person-card", inputs: { widgetData: "widgetData" }, host: { properties: { "class": "this.class" } }, 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@let data = $widgetData();\n\n<div\n class=\"valtimo-widget-person-card__avatar\"\n [attr.aria-hidden]=\"true\"\n [style.background-color]=\"$avatarColors().background\"\n>\n @if (data) {\n <span\n class=\"valtimo-widget-person-card__initials\"\n [style.color]=\"$avatarColors().text\"\n >{{ $initials() }}</span>\n } @else {\n <cds-skeleton-text [lines]=\"1\" [maxLineWidth]=\"60\"></cds-skeleton-text>\n }\n</div>\n\n<div class=\"valtimo-widget-person-card__body\">\n <h3 class=\"valtimo-widget-person-card__name\">\n @if (data) {\n {{ data.fullName || '-' }}\n } @else {\n <cds-skeleton-text [lines]=\"1\" [maxLineWidth]=\"60\"></cds-skeleton-text>\n }\n </h3>\n\n @if ($subtitle()) {\n <p class=\"valtimo-widget-person-card__subtitle\">{{ $subtitle() }}</p>\n }\n\n <dl class=\"valtimo-widget-person-card__grid\">\n @if (data?.phone) {\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"phone\"\n size=\"16\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.phone }}</span>\n </div>\n }\n\n @if (data?.email) {\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"email\"\n size=\"16\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.email }}</span>\n </div>\n }\n\n @if (data?.bsn) {\n <div class=\"valtimo-widget-person-card__field\">\n <span class=\"valtimo-widget-person-card__field-icon valtimo-widget-person-card__bsn-icon\">\n BSN\n </span>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.bsn }}</span>\n </div>\n }\n\n @if ($formattedBirthDate()) {\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"calendar\"\n size=\"16\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ $formattedBirthDate() }}</span>\n </div>\n }\n </dl>\n</div>\n", styles: [".valtimo-widget-person-card{container-type:inline-size;display:flex;flex-direction:row;align-items:flex-start;gap:16px;padding:24px}.valtimo-widget-person-card__avatar{flex:0 0 auto;width:64px;height:64px;border-radius:50%;background-color:#d5d3f0;display:flex;align-items:center;justify-content:center}.valtimo-widget-person-card__initials{font-size:24px;font-weight:600;line-height:24px;color:#1a146a;text-transform:uppercase}.valtimo-widget-person-card__body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__name{margin:0;font-size:18px;font-weight:600;line-height:24px}.valtimo-widget-person-card__subtitle{margin:0;font-size:14px;line-height:20px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__grid{margin:4px 0 0;display:grid;grid-template-columns:1fr;row-gap:6px}.valtimo-widget-person-card__field{display:flex;align-items:center;gap:8px;min-width:0}.valtimo-widget-person-card__field-icon{flex:0 0 auto;width:16px;height:16px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__bsn-icon{display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;letter-spacing:.5px;line-height:1}.valtimo-widget-person-card__field-value{font-size:14px;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@container (min-width: 480px){.valtimo-widget-person-card{gap:24px;padding:24px}.valtimo-widget-person-card__avatar{width:64px;height:64px}.valtimo-widget-person-card__body{gap:6px}.valtimo-widget-person-card__name{font-size:20px;line-height:28px}.valtimo-widget-person-card__subtitle{font-size:16px;line-height:24px}.valtimo-widget-person-card__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,auto);grid-auto-flow:column;column-gap:32px;row-gap:8px}.valtimo-widget-person-card__field-value{font-size:14px;line-height:20px}}\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: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i3.SkeletonText, selector: "cds-skeleton-text, ibm-skeleton-text", inputs: ["lines", "minLineWidth", "maxLineWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
4462
4475
  }
4463
4476
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetPersonCardComponent, decorators: [{
4464
4477
  type: Component,
4465
- args: [{ selector: 'valtimo-widget-person-card', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule, TranslateModule, IconModule, SkeletonModule], 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@let data = $widgetData();\n\n<div\n class=\"valtimo-widget-person-card__avatar\"\n [attr.aria-hidden]=\"true\"\n [style.background-color]=\"$avatarColors().background\"\n>\n @if (data) {\n <span\n class=\"valtimo-widget-person-card__initials\"\n [style.color]=\"$avatarColors().text\"\n >{{ $initials() }}</span>\n } @else {\n <cds-skeleton-text [lines]=\"1\" [maxLineWidth]=\"60\"></cds-skeleton-text>\n }\n</div>\n\n<div class=\"valtimo-widget-person-card__body\">\n <h3 class=\"valtimo-widget-person-card__name\">\n @if (data) {\n {{ data.fullName || '-' }}\n } @else {\n <cds-skeleton-text [lines]=\"1\" [maxLineWidth]=\"60\"></cds-skeleton-text>\n }\n </h3>\n\n <p class=\"valtimo-widget-person-card__subtitle\">{{ $subtitle() }}</p>\n\n <dl class=\"valtimo-widget-person-card__grid\">\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"phone\"\n size=\"20\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.phone || '-' }}</span>\n </div>\n\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"email\"\n size=\"20\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.email || '-' }}</span>\n </div>\n\n <div class=\"valtimo-widget-person-card__field\">\n <span class=\"valtimo-widget-person-card__field-icon valtimo-widget-person-card__bsn-icon\">\n BSN\n </span>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.bsn || '-' }}</span>\n </div>\n\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"calendar\"\n size=\"20\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{\n $formattedBirthDate() || '-'\n }}</span>\n </div>\n </dl>\n</div>\n", styles: [".valtimo-widget-person-card{container-type:inline-size;display:flex;flex-direction:row;align-items:flex-start;gap:16px;padding:16px}.valtimo-widget-person-card__avatar{flex:0 0 auto;width:64px;height:64px;border-radius:50%;background-color:#d5d3f0;display:flex;align-items:center;justify-content:center}.valtimo-widget-person-card__initials{font-size:22px;font-weight:600;line-height:1;color:#1a146a;text-transform:uppercase}.valtimo-widget-person-card__body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__name{margin:0;font-size:18px;font-weight:600;line-height:24px}.valtimo-widget-person-card__subtitle{margin:0;font-size:14px;line-height:20px;color:var(--widget-text-color, var(--cds-text-secondary))}.valtimo-widget-person-card__grid{margin:4px 0 0;display:grid;grid-template-columns:1fr;row-gap:6px}.valtimo-widget-person-card__field{display:flex;align-items:center;gap:8px;min-width:0}.valtimo-widget-person-card__field-icon{flex:0 0 auto;width:20px;height:20px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__bsn-icon{display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;letter-spacing:.5px;line-height:1}.valtimo-widget-person-card__field-value{font-size:14px;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@container (min-width: 480px){.valtimo-widget-person-card{gap:24px;padding:24px}.valtimo-widget-person-card__avatar{width:96px;height:96px}.valtimo-widget-person-card__initials{font-size:32px}.valtimo-widget-person-card__body{gap:6px}.valtimo-widget-person-card__name{font-size:24px;line-height:32px}.valtimo-widget-person-card__subtitle{font-size:16px;line-height:24px}.valtimo-widget-person-card__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,auto);grid-auto-flow:column;column-gap:32px;row-gap:8px}.valtimo-widget-person-card__field{gap:12px}.valtimo-widget-person-card__field-value{font-size:16px;line-height:24px}}\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"] }]
4478
+ args: [{ selector: 'valtimo-widget-person-card', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule, TranslateModule, IconModule, SkeletonModule], 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@let data = $widgetData();\n\n<div\n class=\"valtimo-widget-person-card__avatar\"\n [attr.aria-hidden]=\"true\"\n [style.background-color]=\"$avatarColors().background\"\n>\n @if (data) {\n <span\n class=\"valtimo-widget-person-card__initials\"\n [style.color]=\"$avatarColors().text\"\n >{{ $initials() }}</span>\n } @else {\n <cds-skeleton-text [lines]=\"1\" [maxLineWidth]=\"60\"></cds-skeleton-text>\n }\n</div>\n\n<div class=\"valtimo-widget-person-card__body\">\n <h3 class=\"valtimo-widget-person-card__name\">\n @if (data) {\n {{ data.fullName || '-' }}\n } @else {\n <cds-skeleton-text [lines]=\"1\" [maxLineWidth]=\"60\"></cds-skeleton-text>\n }\n </h3>\n\n @if ($subtitle()) {\n <p class=\"valtimo-widget-person-card__subtitle\">{{ $subtitle() }}</p>\n }\n\n <dl class=\"valtimo-widget-person-card__grid\">\n @if (data?.phone) {\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"phone\"\n size=\"16\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.phone }}</span>\n </div>\n }\n\n @if (data?.email) {\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"email\"\n size=\"16\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.email }}</span>\n </div>\n }\n\n @if (data?.bsn) {\n <div class=\"valtimo-widget-person-card__field\">\n <span class=\"valtimo-widget-person-card__field-icon valtimo-widget-person-card__bsn-icon\">\n BSN\n </span>\n <span class=\"valtimo-widget-person-card__field-value\">{{ data?.bsn }}</span>\n </div>\n }\n\n @if ($formattedBirthDate()) {\n <div class=\"valtimo-widget-person-card__field\">\n <svg\n class=\"valtimo-widget-person-card__field-icon\"\n cdsIcon=\"calendar\"\n size=\"16\"\n ></svg>\n <span class=\"valtimo-widget-person-card__field-value\">{{ $formattedBirthDate() }}</span>\n </div>\n }\n </dl>\n</div>\n", styles: [".valtimo-widget-person-card{container-type:inline-size;display:flex;flex-direction:row;align-items:flex-start;gap:16px;padding:24px}.valtimo-widget-person-card__avatar{flex:0 0 auto;width:64px;height:64px;border-radius:50%;background-color:#d5d3f0;display:flex;align-items:center;justify-content:center}.valtimo-widget-person-card__initials{font-size:24px;font-weight:600;line-height:24px;color:#1a146a;text-transform:uppercase}.valtimo-widget-person-card__body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__name{margin:0;font-size:18px;font-weight:600;line-height:24px}.valtimo-widget-person-card__subtitle{margin:0;font-size:14px;line-height:20px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__grid{margin:4px 0 0;display:grid;grid-template-columns:1fr;row-gap:6px}.valtimo-widget-person-card__field{display:flex;align-items:center;gap:8px;min-width:0}.valtimo-widget-person-card__field-icon{flex:0 0 auto;width:16px;height:16px;color:var(--widget-text-color, var(--cds-text-primary))}.valtimo-widget-person-card__bsn-icon{display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;letter-spacing:.5px;line-height:1}.valtimo-widget-person-card__field-value{font-size:14px;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@container (min-width: 480px){.valtimo-widget-person-card{gap:24px;padding:24px}.valtimo-widget-person-card__avatar{width:64px;height:64px}.valtimo-widget-person-card__body{gap:6px}.valtimo-widget-person-card__name{font-size:20px;line-height:28px}.valtimo-widget-person-card__subtitle{font-size:16px;line-height:24px}.valtimo-widget-person-card__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,auto);grid-auto-flow:column;column-gap:32px;row-gap:8px}.valtimo-widget-person-card__field-value{font-size:14px;line-height:20px}}\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"] }]
4466
4479
  }], ctorParameters: () => [{ type: i2$2.TranslateService }, { type: i3.IconService }, { type: i1$1.CdsThemeService }], propDecorators: { class: [{
4467
4480
  type: HostBinding,
4468
4481
  args: ['class']
@@ -5404,7 +5417,7 @@ class WidgetManagementFieldsComponent {
5404
5417
  this.widgetWizardService.$widgetContentValid.set(this.form.valid && this._contentValid());
5405
5418
  }
5406
5419
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementFieldsComponent, deps: [{ token: i1$3.FormBuilder }, { token: WidgetWizardService }], target: i0.ɵɵFactoryTarget.Component }); }
5407
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementFieldsComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, viewQueries: [{ propertyName: "_tab", first: true, predicate: Tab, 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<form\n *ngIf=\"$showTitleInput()\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-fields__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-fields__input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n</form>\n\n<ng-content></ng-content>\n\n<cds-tabs type=\"contained\">\n @for (column of $columns(); track $index) {\n <cds-tab\n [active]=\"activeTab() === $index\"\n [heading]=\"columnHeading\"\n [context]=\"{index: $index, count: $count}\"\n (selected)=\"onTabSelected($index)\"\n >\n <valtimo-widget-management-fields-column\n *ngIf=\"activeTab() === $index\"\n [isFieldWidget]=\"true\"\n [columnData]=\"$selectedWidgetContent()?.[$index]\"\n [showHideWhenEmptyCheckbox]=\"true\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event, $index)\"\n ></valtimo-widget-management-fields-column>\n </cds-tab>\n }\n\n <cds-tab\n *ngIf=\"$columns().length < $widgetWidth\"\n [heading]=\"addColumn\"\n [id]=\"'addColumn'\"\n class=\"valtimo-widget-management-fields__add\"\n ></cds-tab>\n</cds-tabs>\n\n<ng-template #addColumn>\n <button\n cdsButton=\"ghost\"\n [iconOnly]=\"true\"\n (click)=\"$event.stopImmediatePropagation(); onAddColumnClick()\"\n >\n <svg cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</ng-template>\n\n<ng-template #columnHeading let-data>\n <div class=\"valtimo-widget-management-fields__heading\">\n {{ 'widgetTabManagement.content.column' | translate: {number: data.index + 1} }}\n\n <button\n cdsButton=\"ghost\"\n [disabled]=\"data.count === 1\"\n [iconOnly]=\"true\"\n size=\"sm\"\n (click)=\"onDeleteColumnClick(data.index)\"\n >\n <svg cdsIcon=\"close\" size=\"16\"></svg>\n </button>\n </div>\n</ng-template>\n", styles: [".cds--tab-content{padding:0!important}.valtimo-widget-management-fields{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-fields__title-form{padding:8px 0 16px 16px;background:var(--cds-layer);display:flex;gap:16px}.valtimo-widget-management-fields__input{max-width:288px}.valtimo-widget-management-fields__input input{background:var(--cds-layer-02)}.valtimo-widget-management-fields__heading{display:flex;align-items:center}.valtimo-widget-management-fields #addColumn-header{padding:0!important}.valtimo-widget-management-fields .cds--tabs__nav-item{padding-right: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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i3.Tabs, selector: "cds-tabs, ibm-tabs", inputs: ["position", "cacheActive", "followFocus", "isNavigation", "ariaLabel", "ariaLabelledby", "type", "theme", "skeleton"] }, { kind: "component", type: i3.Tab, selector: "cds-tab, ibm-tab", inputs: ["heading", "title", "context", "active", "disabled", "tabIndex", "id", "cacheActive", "tabContent", "templateContext"], outputs: ["selected"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: WidgetManagementFieldsColumnComponent, selector: "valtimo-widget-management-fields-column", inputs: ["columnData", "addTranslateKey", "fieldWidthDropdown", "selectedCollection", "showHideWhenEmptyCheckbox", "showSortableCheckbox"], outputs: ["columnUpdateEvent"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5420
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementFieldsComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, viewQueries: [{ propertyName: "_tab", first: true, predicate: Tab, 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<form\n *ngIf=\"$showTitleInput()\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-fields__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-fields__input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n</form>\n\n<ng-content></ng-content>\n\n<cds-tabs type=\"contained\">\n @for (column of $columns(); track $index) {\n <cds-tab\n [active]=\"activeTab() === $index\"\n [heading]=\"columnHeading\"\n [context]=\"{index: $index, count: $count}\"\n (selected)=\"onTabSelected($index)\"\n >\n <valtimo-widget-management-fields-column\n *ngIf=\"activeTab() === $index\"\n [isFieldWidget]=\"true\"\n [columnData]=\"$selectedWidgetContent()?.[$index]\"\n [showHideWhenEmptyCheckbox]=\"true\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event, $index)\"\n ></valtimo-widget-management-fields-column>\n </cds-tab>\n }\n\n <cds-tab\n *ngIf=\"$columns().length < $widgetWidth\"\n [heading]=\"addColumn\"\n [id]=\"'addColumn'\"\n class=\"valtimo-widget-management-fields__add\"\n ></cds-tab>\n</cds-tabs>\n\n<ng-template #addColumn>\n <button\n cdsButton=\"ghost\"\n [iconOnly]=\"true\"\n (click)=\"$event.stopImmediatePropagation(); onAddColumnClick()\"\n >\n <svg cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</ng-template>\n\n<ng-template #columnHeading let-data>\n <div class=\"valtimo-widget-management-fields__heading\">\n {{ 'widgetTabManagement.content.column' | translate: {number: data.index + 1} }}\n\n <button\n cdsButton=\"ghost\"\n [disabled]=\"data.count === 1\"\n [iconOnly]=\"true\"\n size=\"sm\"\n (click)=\"onDeleteColumnClick(data.index)\"\n >\n <svg cdsIcon=\"close\" size=\"16\"></svg>\n </button>\n </div>\n</ng-template>\n", styles: [".cds--tab-content{padding:0!important}.valtimo-widget-management-fields{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-fields__title-form{background:var(--cds-layer-02);display:flex;gap:16px}.valtimo-widget-management-fields__input{max-width:288px}.valtimo-widget-management-fields__input input{background:var(--cds-layer-01)}.valtimo-widget-management-fields__heading{display:flex;align-items:center}.valtimo-widget-management-fields #addColumn-header{padding:0!important}.valtimo-widget-management-fields .cds--tabs__nav-item{padding-right: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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i3.Tabs, selector: "cds-tabs, ibm-tabs", inputs: ["position", "cacheActive", "followFocus", "isNavigation", "ariaLabel", "ariaLabelledby", "type", "theme", "skeleton"] }, { kind: "component", type: i3.Tab, selector: "cds-tab, ibm-tab", inputs: ["heading", "title", "context", "active", "disabled", "tabIndex", "id", "cacheActive", "tabContent", "templateContext"], outputs: ["selected"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: WidgetManagementFieldsColumnComponent, selector: "valtimo-widget-management-fields-column", inputs: ["columnData", "addTranslateKey", "fieldWidthDropdown", "selectedCollection", "showHideWhenEmptyCheckbox", "showSortableCheckbox"], outputs: ["columnUpdateEvent"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5408
5421
  }
5409
5422
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementFieldsComponent, decorators: [{
5410
5423
  type: Component,
@@ -5420,7 +5433,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
5420
5433
  InputLabelModule,
5421
5434
  MdiIconSelectorComponent,
5422
5435
  LayerModule,
5423
- ], 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<form\n *ngIf=\"$showTitleInput()\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-fields__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-fields__input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n</form>\n\n<ng-content></ng-content>\n\n<cds-tabs type=\"contained\">\n @for (column of $columns(); track $index) {\n <cds-tab\n [active]=\"activeTab() === $index\"\n [heading]=\"columnHeading\"\n [context]=\"{index: $index, count: $count}\"\n (selected)=\"onTabSelected($index)\"\n >\n <valtimo-widget-management-fields-column\n *ngIf=\"activeTab() === $index\"\n [isFieldWidget]=\"true\"\n [columnData]=\"$selectedWidgetContent()?.[$index]\"\n [showHideWhenEmptyCheckbox]=\"true\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event, $index)\"\n ></valtimo-widget-management-fields-column>\n </cds-tab>\n }\n\n <cds-tab\n *ngIf=\"$columns().length < $widgetWidth\"\n [heading]=\"addColumn\"\n [id]=\"'addColumn'\"\n class=\"valtimo-widget-management-fields__add\"\n ></cds-tab>\n</cds-tabs>\n\n<ng-template #addColumn>\n <button\n cdsButton=\"ghost\"\n [iconOnly]=\"true\"\n (click)=\"$event.stopImmediatePropagation(); onAddColumnClick()\"\n >\n <svg cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</ng-template>\n\n<ng-template #columnHeading let-data>\n <div class=\"valtimo-widget-management-fields__heading\">\n {{ 'widgetTabManagement.content.column' | translate: {number: data.index + 1} }}\n\n <button\n cdsButton=\"ghost\"\n [disabled]=\"data.count === 1\"\n [iconOnly]=\"true\"\n size=\"sm\"\n (click)=\"onDeleteColumnClick(data.index)\"\n >\n <svg cdsIcon=\"close\" size=\"16\"></svg>\n </button>\n </div>\n</ng-template>\n", styles: [".cds--tab-content{padding:0!important}.valtimo-widget-management-fields{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-fields__title-form{padding:8px 0 16px 16px;background:var(--cds-layer);display:flex;gap:16px}.valtimo-widget-management-fields__input{max-width:288px}.valtimo-widget-management-fields__input input{background:var(--cds-layer-02)}.valtimo-widget-management-fields__heading{display:flex;align-items:center}.valtimo-widget-management-fields #addColumn-header{padding:0!important}.valtimo-widget-management-fields .cds--tabs__nav-item{padding-right: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"] }]
5436
+ ], 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<form\n *ngIf=\"$showTitleInput()\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-fields__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-fields__input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n</form>\n\n<ng-content></ng-content>\n\n<cds-tabs type=\"contained\">\n @for (column of $columns(); track $index) {\n <cds-tab\n [active]=\"activeTab() === $index\"\n [heading]=\"columnHeading\"\n [context]=\"{index: $index, count: $count}\"\n (selected)=\"onTabSelected($index)\"\n >\n <valtimo-widget-management-fields-column\n *ngIf=\"activeTab() === $index\"\n [isFieldWidget]=\"true\"\n [columnData]=\"$selectedWidgetContent()?.[$index]\"\n [showHideWhenEmptyCheckbox]=\"true\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event, $index)\"\n ></valtimo-widget-management-fields-column>\n </cds-tab>\n }\n\n <cds-tab\n *ngIf=\"$columns().length < $widgetWidth\"\n [heading]=\"addColumn\"\n [id]=\"'addColumn'\"\n class=\"valtimo-widget-management-fields__add\"\n ></cds-tab>\n</cds-tabs>\n\n<ng-template #addColumn>\n <button\n cdsButton=\"ghost\"\n [iconOnly]=\"true\"\n (click)=\"$event.stopImmediatePropagation(); onAddColumnClick()\"\n >\n <svg cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</ng-template>\n\n<ng-template #columnHeading let-data>\n <div class=\"valtimo-widget-management-fields__heading\">\n {{ 'widgetTabManagement.content.column' | translate: {number: data.index + 1} }}\n\n <button\n cdsButton=\"ghost\"\n [disabled]=\"data.count === 1\"\n [iconOnly]=\"true\"\n size=\"sm\"\n (click)=\"onDeleteColumnClick(data.index)\"\n >\n <svg cdsIcon=\"close\" size=\"16\"></svg>\n </button>\n </div>\n</ng-template>\n", styles: [".cds--tab-content{padding:0!important}.valtimo-widget-management-fields{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-fields__title-form{background:var(--cds-layer-02);display:flex;gap:16px}.valtimo-widget-management-fields__input{max-width:288px}.valtimo-widget-management-fields__input input{background:var(--cds-layer-01)}.valtimo-widget-management-fields__heading{display:flex;align-items:center}.valtimo-widget-management-fields #addColumn-header{padding:0!important}.valtimo-widget-management-fields .cds--tabs__nav-item{padding-right: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"] }]
5424
5437
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: WidgetWizardService }], propDecorators: { class: [{
5425
5438
  type: HostBinding,
5426
5439
  args: ['class']
@@ -5506,7 +5519,7 @@ class WidgetManagementTableComponent {
5506
5519
  this.selectedCollection$.next(item);
5507
5520
  }
5508
5521
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementTableComponent, deps: [{ token: i1$1.CdsThemeService }, { token: i1$3.FormBuilder }, { token: i2$2.TranslateService }, { token: WidgetWizardService }, { token: WIDGET_MANAGEMENT_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
5509
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementTableComponent, isStandalone: true, selector: "valtimo-widget-management-table", inputs: { showFirstColumnOption: "showFirstColumnOption", sortableColumns: "sortableColumns" }, host: { properties: { "class": "this.class" } }, 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<form\n *ngIf=\"{theme: theme$ | async, params: params$ | async} as obs\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-table__form\"\n>\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"title\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.table.defaultPageSize' | translate\"\n [tooltip]=\"'widgetTabManagement.content.table.defaultPageSizeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"defaultPageSize\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.table.defaultPageSizePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.table.collection' | translate\"\n [tooltip]=\"collectionDataTooltip$ | async\"\n >\n </v-input-label>\n\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"collection\"\n [attr.data-carbon-theme]=\"obs.theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [type]=\"ValuePathType.COLLECTION\"\n (collectionSelected)=\"onCollectionSelected($event)\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"collection\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.table.collection' | translate\"\n type=\"text\"\n />\n }\n </cds-text-label>\n</form>\n\n<ng-content></ng-content>\n\n<span class=\"valtimo-widget-management-table__subtitle\">\n {{ 'widgetTabManagement.content.table.columns' | translate }}\n</span>\n\n<valtimo-widget-management-fields-column\n [addTranslateKey]=\"'widgetTabManagement.content.table.addColumn'\"\n [columnData]=\"$content()?.columns\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event)\"\n [selectedCollection]=\"selectedCollection$ | async\"\n [showSortableCheckbox]=\"sortableColumns\"\n></valtimo-widget-management-fields-column>\n\n<section *ngIf=\"showFirstColumnOption\" class=\"valtimo-widget-management-table__toggle\">\n <span class=\"valtimo-widget-management-table__subtitle\">\n {{ 'widgetTabManagement.content.table.options' | translate }}\n </span>\n\n <cds-toggle\n [checked]=\"$checked()\"\n [label]=\"'widgetTabManagement.content.table.firstColumnAsTitle' | translate\"\n [onText]=\"'interface.yes' | translate\"\n [offText]=\"'interface.no' | translate\"\n (checkedChange)=\"onCheckedChange($event)\"\n ></cds-toggle>\n</section>\n", styles: [".valtimo-widget-management-table{display:flex;flex-direction:column;gap:24px}.valtimo-widget-management-table__form{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);align-items:flex-end;padding:16px;background-color:var(--cds-layer-01)}.valtimo-widget-management-table__subtitle{font-size:16px;font-weight:600;line-height:22px}.valtimo-widget-management-table__toggle{display:flex;flex-direction:column;gap:8px}.valtimo-widget-management-table__path-selector{display:flex;flex-direction:column}.valtimo-widget-management-table .cds--text-input,.valtimo-widget-management-table .cds--list-box{background:var(--cds-layer-02)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "component", type: WidgetManagementFieldsColumnComponent, selector: "valtimo-widget-management-fields-column", inputs: ["columnData", "addTranslateKey", "fieldWidthDropdown", "selectedCollection", "showHideWhenEmptyCheckbox", "showSortableCheckbox"], outputs: ["columnUpdateEvent"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ToggleModule }, { kind: "component", type: i3.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5522
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementTableComponent, isStandalone: true, selector: "valtimo-widget-management-table", inputs: { showFirstColumnOption: "showFirstColumnOption", sortableColumns: "sortableColumns" }, host: { properties: { "class": "this.class" } }, 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<form\n *ngIf=\"{theme: theme$ | async, params: params$ | async} as obs\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-table__form\"\n>\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"title\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.table.defaultPageSize' | translate\"\n [tooltip]=\"'widgetTabManagement.content.table.defaultPageSizeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"defaultPageSize\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.table.defaultPageSizePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <div\n class=\"valtimo-widget-management-table__path-selector\"\n [attr.data-carbon-theme]=\"theme\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.table.collection' | translate\"\n [tooltip]=\"collectionDataTooltip$ | async\"\n >\n </v-input-label>\n\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"collection\"\n [attr.data-carbon-theme]=\"obs.theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [type]=\"ValuePathType.COLLECTION\"\n (collectionSelected)=\"onCollectionSelected($event)\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"collection\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.table.collection' | translate\"\n type=\"text\"\n />\n }\n </div>\n</form>\n\n<ng-content></ng-content>\n\n<span class=\"valtimo-widget-management-table__subtitle\">\n {{ 'widgetTabManagement.content.table.columns' | translate }}\n</span>\n\n<valtimo-widget-management-fields-column\n [addTranslateKey]=\"'widgetTabManagement.content.table.addColumn'\"\n [columnData]=\"$content()?.columns\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event)\"\n [selectedCollection]=\"selectedCollection$ | async\"\n [showSortableCheckbox]=\"sortableColumns\"\n></valtimo-widget-management-fields-column>\n\n<section *ngIf=\"showFirstColumnOption\" class=\"valtimo-widget-management-table__toggle\">\n <span class=\"valtimo-widget-management-table__subtitle\">\n {{ 'widgetTabManagement.content.table.options' | translate }}\n </span>\n\n <cds-toggle\n [checked]=\"$checked()\"\n [label]=\"'widgetTabManagement.content.table.firstColumnAsTitle' | translate\"\n [onText]=\"'interface.yes' | translate\"\n [offText]=\"'interface.no' | translate\"\n (checkedChange)=\"onCheckedChange($event)\"\n ></cds-toggle>\n</section>\n", styles: [".valtimo-widget-management-table{display:flex;flex-direction:column;gap:24px}.valtimo-widget-management-table__form{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);align-items:flex-end;background-color:var(--cds-layer-02)}.valtimo-widget-management-table__subtitle{font-size:16px;font-weight:600;line-height:22px}.valtimo-widget-management-table__toggle{display:flex;flex-direction:column;gap:8px}.valtimo-widget-management-table__path-selector{display:flex;flex-direction:column;padding:8px;background-color:var(--cds-layer-01)}.valtimo-widget-management-table__path-selector ::ng-deep .cds--text-input,.valtimo-widget-management-table__path-selector ::ng-deep .cds--list-box{background:var(--cds-layer-02)}.valtimo-widget-management-table ::ng-deep .cds--text-input,.valtimo-widget-management-table ::ng-deep .cds--list-box{background:var(--cds-layer-01)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "component", type: WidgetManagementFieldsColumnComponent, selector: "valtimo-widget-management-fields-column", inputs: ["columnData", "addTranslateKey", "fieldWidthDropdown", "selectedCollection", "showHideWhenEmptyCheckbox", "showSortableCheckbox"], outputs: ["columnUpdateEvent"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ToggleModule }, { kind: "component", type: i3.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5510
5523
  }
5511
5524
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementTableComponent, decorators: [{
5512
5525
  type: Component,
@@ -5522,7 +5535,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
5522
5535
  LayerModule,
5523
5536
  ValuePathSelectorComponent,
5524
5537
  MdiIconSelectorComponent,
5525
- ], 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<form\n *ngIf=\"{theme: theme$ | async, params: params$ | async} as obs\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-table__form\"\n>\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"title\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.table.defaultPageSize' | translate\"\n [tooltip]=\"'widgetTabManagement.content.table.defaultPageSizeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"defaultPageSize\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.table.defaultPageSizePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.table.collection' | translate\"\n [tooltip]=\"collectionDataTooltip$ | async\"\n >\n </v-input-label>\n\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"collection\"\n [attr.data-carbon-theme]=\"obs.theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [type]=\"ValuePathType.COLLECTION\"\n (collectionSelected)=\"onCollectionSelected($event)\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"collection\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.table.collection' | translate\"\n type=\"text\"\n />\n }\n </cds-text-label>\n</form>\n\n<ng-content></ng-content>\n\n<span class=\"valtimo-widget-management-table__subtitle\">\n {{ 'widgetTabManagement.content.table.columns' | translate }}\n</span>\n\n<valtimo-widget-management-fields-column\n [addTranslateKey]=\"'widgetTabManagement.content.table.addColumn'\"\n [columnData]=\"$content()?.columns\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event)\"\n [selectedCollection]=\"selectedCollection$ | async\"\n [showSortableCheckbox]=\"sortableColumns\"\n></valtimo-widget-management-fields-column>\n\n<section *ngIf=\"showFirstColumnOption\" class=\"valtimo-widget-management-table__toggle\">\n <span class=\"valtimo-widget-management-table__subtitle\">\n {{ 'widgetTabManagement.content.table.options' | translate }}\n </span>\n\n <cds-toggle\n [checked]=\"$checked()\"\n [label]=\"'widgetTabManagement.content.table.firstColumnAsTitle' | translate\"\n [onText]=\"'interface.yes' | translate\"\n [offText]=\"'interface.no' | translate\"\n (checkedChange)=\"onCheckedChange($event)\"\n ></cds-toggle>\n</section>\n", styles: [".valtimo-widget-management-table{display:flex;flex-direction:column;gap:24px}.valtimo-widget-management-table__form{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);align-items:flex-end;padding:16px;background-color:var(--cds-layer-01)}.valtimo-widget-management-table__subtitle{font-size:16px;font-weight:600;line-height:22px}.valtimo-widget-management-table__toggle{display:flex;flex-direction:column;gap:8px}.valtimo-widget-management-table__path-selector{display:flex;flex-direction:column}.valtimo-widget-management-table .cds--text-input,.valtimo-widget-management-table .cds--list-box{background:var(--cds-layer-02)}\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"] }]
5538
+ ], 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<form\n *ngIf=\"{theme: theme$ | async, params: params$ | async} as obs\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-table__form\"\n>\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"title\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.table.defaultPageSize' | translate\"\n [tooltip]=\"'widgetTabManagement.content.table.defaultPageSizeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"defaultPageSize\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.table.defaultPageSizePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <div\n class=\"valtimo-widget-management-table__path-selector\"\n [attr.data-carbon-theme]=\"theme\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.table.collection' | translate\"\n [tooltip]=\"collectionDataTooltip$ | async\"\n >\n </v-input-label>\n\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"collection\"\n [attr.data-carbon-theme]=\"obs.theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [type]=\"ValuePathType.COLLECTION\"\n (collectionSelected)=\"onCollectionSelected($event)\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"collection\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.table.collection' | translate\"\n type=\"text\"\n />\n }\n </div>\n</form>\n\n<ng-content></ng-content>\n\n<span class=\"valtimo-widget-management-table__subtitle\">\n {{ 'widgetTabManagement.content.table.columns' | translate }}\n</span>\n\n<valtimo-widget-management-fields-column\n [addTranslateKey]=\"'widgetTabManagement.content.table.addColumn'\"\n [columnData]=\"$content()?.columns\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event)\"\n [selectedCollection]=\"selectedCollection$ | async\"\n [showSortableCheckbox]=\"sortableColumns\"\n></valtimo-widget-management-fields-column>\n\n<section *ngIf=\"showFirstColumnOption\" class=\"valtimo-widget-management-table__toggle\">\n <span class=\"valtimo-widget-management-table__subtitle\">\n {{ 'widgetTabManagement.content.table.options' | translate }}\n </span>\n\n <cds-toggle\n [checked]=\"$checked()\"\n [label]=\"'widgetTabManagement.content.table.firstColumnAsTitle' | translate\"\n [onText]=\"'interface.yes' | translate\"\n [offText]=\"'interface.no' | translate\"\n (checkedChange)=\"onCheckedChange($event)\"\n ></cds-toggle>\n</section>\n", styles: [".valtimo-widget-management-table{display:flex;flex-direction:column;gap:24px}.valtimo-widget-management-table__form{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);align-items:flex-end;background-color:var(--cds-layer-02)}.valtimo-widget-management-table__subtitle{font-size:16px;font-weight:600;line-height:22px}.valtimo-widget-management-table__toggle{display:flex;flex-direction:column;gap:8px}.valtimo-widget-management-table__path-selector{display:flex;flex-direction:column;padding:8px;background-color:var(--cds-layer-01)}.valtimo-widget-management-table__path-selector ::ng-deep .cds--text-input,.valtimo-widget-management-table__path-selector ::ng-deep .cds--list-box{background:var(--cds-layer-02)}.valtimo-widget-management-table ::ng-deep .cds--text-input,.valtimo-widget-management-table ::ng-deep .cds--list-box{background:var(--cds-layer-01)}\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"] }]
5526
5539
  }], ctorParameters: () => [{ type: i1$1.CdsThemeService }, { type: i1$3.FormBuilder }, { type: i2$2.TranslateService }, { type: WidgetWizardService }, { type: undefined, decorators: [{
5527
5540
  type: Inject,
5528
5541
  args: [WIDGET_MANAGEMENT_SERVICE]
@@ -5729,7 +5742,7 @@ class WidgetManagementCollectionComponent {
5729
5742
  }));
5730
5743
  }
5731
5744
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementCollectionComponent, deps: [{ token: i1$1.CdsThemeService }, { token: i1$3.FormBuilder }, { token: i2$2.TranslateService }, { token: WidgetFieldsService }, { token: WidgetWizardService }, { token: WIDGET_MANAGEMENT_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
5732
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementCollectionComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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 *ngIf=\"{theme: theme$ | async, params: params$ | async} as obs\">\n <form [formGroup]=\"widgetForm\" class=\"valtimo-widget-management-collection__form\">\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"title\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.collection.defaultPageSize' | translate\"\n [tooltip]=\"'widgetTabManagement.content.collection.defaultPageSizeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"defaultPageSize\"\n cdsText\n [placeholder]=\"\n 'widgetTabManagement.content.collection.defaultPageSizePlaceholder' | translate\n \"\n type=\"text\"\n />\n </cds-text-label>\n\n <div class=\"valtimo-widget-management-collection__value-field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.collection.collection' | translate\"\n [tooltip]=\"collectionDataTooltip$ | async\"\n >\n </v-input-label>\n\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"collection\"\n [attr.data-carbon-theme]=\"theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [type]=\"ValuePathType.COLLECTION\"\n (collectionSelected)=\"onCollectionSelected($event)\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"collection\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.collection.collection' | translate\"\n type=\"text\"\n />\n }\n </div>\n </form>\n\n <ng-content></ng-content>\n\n <span class=\"valtimo-widget-management-collection__subtitle\">\n {{ 'widgetTabManagement.content.collection.cardTitle' | translate }}\n </span>\n\n <form [formGroup]=\"cardForm\" class=\"valtimo-widget-management-collection__card\">\n <section class=\"valtimo-widget-management-collection__card-title\">\n <div class=\"valtimo-widget-management-collection__path-selector\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.value' | translate\"\n [tooltip]=\"'widgetTabManagement.content.collection.valueTooltip' | translate\"\n >\n </v-input-label>\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"value\"\n [attr.data-carbon-theme]=\"theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [parentItem]=\"selectedCollection$ | async\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"value\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.value' | translate\"\n type=\"text\"\n />\n }\n </div>\n\n <cds-dropdown\n [attr.data-carbon-theme]=\"theme\"\n [label]=\"'widgetTabManagement.content.fields.type' | translate\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.fields.typePlaceholder' | translate\"\n (selected)=\"onTypeSelected(cardForm, $event)\"\n formControlName=\"type\"\n >\n <cds-dropdown-list [items]=\"getDisplayItemsSelected(cardForm)\"></cds-dropdown-list>\n </cds-dropdown>\n </section>\n\n <section class=\"valtimo-widget-management-collection__card-options\">\n @switch (cardForm.get('type').value.id) {\n @case (WidgetDisplayTypeKey.CURRENCY) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.currencyCode' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.currencyCodeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"\n 'widgetTabManagement.content.fields.currencyCodePlaceholder' | translate\n \"\n type=\"text\"\n formControlName=\"currencyCode\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.display' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.displayTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.displayPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"display\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate: {minFractionDigits: 2, maxFractionDigits: 2}\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfoPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.DATE) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.format' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.dateFormatTooltip' | translate\"\n ></v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.formatPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"format\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.DATE_TIME) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.format' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.dateTimeFormatTooltip' | translate\"\n ></v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.formatPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"format\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.ENUM) {\n <div class=\"valtimo-widget-management-collection__enum\" formArrayName=\"values\">\n @for (rowValue of cardForm.get('values')?.controls; track $index) {\n <form [formGroup]=\"rowValue\" class=\"valtimo-widget-management-collection__enum-form\">\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.enumValue' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.enumValueTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n [attr.data-carbon-theme]=\"theme\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.enumValue' | translate\"\n type=\"text\"\n formControlName=\"key\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.enumDisplay' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.enumDisplayTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.enumDisplay' | translate\"\n type=\"text\"\n formControlName=\"value\"\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger--ghost\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n class=\"valtimo-case-management-widget-field-column__delete-button enum\"\n (click)=\"onDeleteRowClick(cardForm.get('values'), $index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n cdsButton=\"primary\"\n size=\"sm\"\n (click)=\"onAddEnumValueClick(cardForm.get('values'))\"\n >\n {{ 'widgetTabManagement.content.fields.addEnum' | translate }}\n\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n </div>\n }\n @case (WidgetDisplayTypeKey.NUMBER) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate\n : {\n minFractionDigits: 0,\n maxFractionDigits: 3,\n }\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.PERCENT) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate\n : {\n minFractionDigits: 0,\n maxFractionDigits: 0,\n }\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n }\n </section>\n </form>\n\n <span class=\"valtimo-widget-management-collection__subtitle\">\n {{ 'widgetTabManagement.content.collection.cardFields' | translate }}\n </span>\n\n <valtimo-widget-management-fields-column\n [columnData]=\"$content()?.fields\"\n [fieldWidthDropdown]=\"fieldWidthDropdown\"\n [showHideWhenEmptyCheckbox]=\"true\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event)\"\n [selectedCollection]=\"selectedCollection$ | async\"\n >\n </valtimo-widget-management-fields-column>\n\n <ng-template #fieldWidthDropdown let-index=\"index\">\n <cds-dropdown\n [label]=\"'widgetTabManagement.content.collection.fieldWidth' | translate\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.collection.fieldWidthPlaceholder' | translate\"\n (selected)=\"onWidthSelected($event, index)\"\n >\n <cds-dropdown-list [items]=\"getSelectedWidthItem(index)\"></cds-dropdown-list>\n </cds-dropdown>\n </ng-template>\n</ng-container>\n", styles: [".valtimo-widget-management-collection{display:flex;flex-direction:column;gap:24px}.valtimo-widget-management-collection__form{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);align-items:flex-end;background:var(--cds-layer);padding:12px 16px 16px}.valtimo-widget-management-collection__subtitle{font-size:16px;font-weight:600;line-height:22px}.valtimo-widget-management-collection__value-field{display:flex;flex-direction:column}.valtimo-widget-management-collection__card{flex-direction:column;display:flex;gap:16px;background:var(--cds-layer);padding:16px}.valtimo-widget-management-collection__card-title{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;align-items:flex-end}.valtimo-widget-management-collection__card-options{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.valtimo-widget-management-collection__enum{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-collection__enum-form{display:grid;grid-template-columns:1fr 1fr auto;align-items:flex-end;gap:16px}.valtimo-widget-management-collection .cds--text-input,.valtimo-widget-management-collection .cds--list-box{background:var(--cds-layer-02)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "component", type: WidgetManagementFieldsColumnComponent, selector: "valtimo-widget-management-fields-column", inputs: ["columnData", "addTranslateKey", "fieldWidthDropdown", "selectedCollection", "showHideWhenEmptyCheckbox", "showSortableCheckbox"], outputs: ["columnUpdateEvent"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5745
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementCollectionComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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 *ngIf=\"{theme: theme$ | async, params: params$ | async} as obs\">\n <form [formGroup]=\"widgetForm\" class=\"valtimo-widget-management-collection__form\">\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"title\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.collection.defaultPageSize' | translate\"\n [tooltip]=\"'widgetTabManagement.content.collection.defaultPageSizeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"defaultPageSize\"\n cdsText\n [placeholder]=\"\n 'widgetTabManagement.content.collection.defaultPageSizePlaceholder' | translate\n \"\n type=\"text\"\n />\n </cds-text-label>\n\n <div class=\"valtimo-widget-management-collection__value-field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.collection.collection' | translate\"\n [tooltip]=\"collectionDataTooltip$ | async\"\n >\n </v-input-label>\n\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"collection\"\n [attr.data-carbon-theme]=\"theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [type]=\"ValuePathType.COLLECTION\"\n (collectionSelected)=\"onCollectionSelected($event)\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"collection\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.collection.collection' | translate\"\n type=\"text\"\n />\n }\n </div>\n </form>\n\n <ng-content></ng-content>\n\n <span class=\"valtimo-widget-management-collection__subtitle\">\n {{ 'widgetTabManagement.content.collection.cardTitle' | translate }}\n </span>\n\n <form [formGroup]=\"cardForm\" class=\"valtimo-widget-management-collection__card\">\n <section class=\"valtimo-widget-management-collection__card-title\">\n <div class=\"valtimo-widget-management-collection__path-selector\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.value' | translate\"\n [tooltip]=\"'widgetTabManagement.content.collection.valueTooltip' | translate\"\n >\n </v-input-label>\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"value\"\n [attr.data-carbon-theme]=\"theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [parentItem]=\"selectedCollection$ | async\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"value\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.value' | translate\"\n type=\"text\"\n />\n }\n </div>\n\n <cds-dropdown\n [attr.data-carbon-theme]=\"theme\"\n [label]=\"'widgetTabManagement.content.fields.type' | translate\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.fields.typePlaceholder' | translate\"\n (selected)=\"onTypeSelected(cardForm, $event)\"\n formControlName=\"type\"\n >\n <cds-dropdown-list [items]=\"getDisplayItemsSelected(cardForm)\"></cds-dropdown-list>\n </cds-dropdown>\n </section>\n\n <section class=\"valtimo-widget-management-collection__card-options\">\n @switch (cardForm.get('type').value.id) {\n @case (WidgetDisplayTypeKey.CURRENCY) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.currencyCode' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.currencyCodeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"\n 'widgetTabManagement.content.fields.currencyCodePlaceholder' | translate\n \"\n type=\"text\"\n formControlName=\"currencyCode\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.display' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.displayTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.displayPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"display\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate: {minFractionDigits: 2, maxFractionDigits: 2}\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfoPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.DATE) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.format' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.dateFormatTooltip' | translate\"\n ></v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.formatPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"format\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.DATE_TIME) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.format' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.dateTimeFormatTooltip' | translate\"\n ></v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.formatPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"format\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.ENUM) {\n <div class=\"valtimo-widget-management-collection__enum\" formArrayName=\"values\">\n @for (rowValue of cardForm.get('values')?.controls; track $index) {\n <form [formGroup]=\"rowValue\" class=\"valtimo-widget-management-collection__enum-form\">\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.enumValue' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.enumValueTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n [attr.data-carbon-theme]=\"theme\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.enumValue' | translate\"\n type=\"text\"\n formControlName=\"key\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.enumDisplay' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.enumDisplayTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.enumDisplay' | translate\"\n type=\"text\"\n formControlName=\"value\"\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger--ghost\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n class=\"valtimo-case-management-widget-field-column__delete-button enum\"\n (click)=\"onDeleteRowClick(cardForm.get('values'), $index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n cdsButton=\"primary\"\n size=\"sm\"\n (click)=\"onAddEnumValueClick(cardForm.get('values'))\"\n >\n {{ 'widgetTabManagement.content.fields.addEnum' | translate }}\n\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n </div>\n }\n @case (WidgetDisplayTypeKey.NUMBER) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate\n : {\n minFractionDigits: 0,\n maxFractionDigits: 3,\n }\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.PERCENT) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate\n : {\n minFractionDigits: 0,\n maxFractionDigits: 0,\n }\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n }\n </section>\n </form>\n\n <span class=\"valtimo-widget-management-collection__subtitle\">\n {{ 'widgetTabManagement.content.collection.cardFields' | translate }}\n </span>\n\n <valtimo-widget-management-fields-column\n [columnData]=\"$content()?.fields\"\n [fieldWidthDropdown]=\"fieldWidthDropdown\"\n [showHideWhenEmptyCheckbox]=\"true\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event)\"\n [selectedCollection]=\"selectedCollection$ | async\"\n >\n </valtimo-widget-management-fields-column>\n\n <ng-template #fieldWidthDropdown let-index=\"index\">\n <cds-dropdown\n [label]=\"'widgetTabManagement.content.collection.fieldWidth' | translate\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.collection.fieldWidthPlaceholder' | translate\"\n (selected)=\"onWidthSelected($event, index)\"\n >\n <cds-dropdown-list [items]=\"getSelectedWidthItem(index)\"></cds-dropdown-list>\n </cds-dropdown>\n </ng-template>\n</ng-container>\n", styles: [".valtimo-widget-management-collection{display:flex;flex-direction:column;gap:24px}.valtimo-widget-management-collection__form{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);align-items:flex-end;background:var(--cds-layer-02);padding:12px 16px 16px}.valtimo-widget-management-collection__subtitle{font-size:16px;font-weight:600;line-height:22px}.valtimo-widget-management-collection__value-field{display:flex;flex-direction:column}.valtimo-widget-management-collection__card{flex-direction:column;display:flex;gap:16px;background:var(--cds-layer-02);padding:16px}.valtimo-widget-management-collection__card-title{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;align-items:flex-end}.valtimo-widget-management-collection__card-options{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.valtimo-widget-management-collection__enum{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-collection__enum-form{display:grid;grid-template-columns:1fr 1fr auto;align-items:flex-end;gap:16px}.valtimo-widget-management-collection .cds--text-input,.valtimo-widget-management-collection .cds--list-box{background:var(--cds-layer-01)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "component", type: WidgetManagementFieldsColumnComponent, selector: "valtimo-widget-management-fields-column", inputs: ["columnData", "addTranslateKey", "fieldWidthDropdown", "selectedCollection", "showHideWhenEmptyCheckbox", "showSortableCheckbox"], outputs: ["columnUpdateEvent"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5733
5746
  }
5734
5747
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementCollectionComponent, decorators: [{
5735
5748
  type: Component,
@@ -5745,7 +5758,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
5745
5758
  InputLabelModule,
5746
5759
  ValuePathSelectorComponent,
5747
5760
  MdiIconSelectorComponent,
5748
- ], 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 *ngIf=\"{theme: theme$ | async, params: params$ | async} as obs\">\n <form [formGroup]=\"widgetForm\" class=\"valtimo-widget-management-collection__form\">\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"title\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.collection.defaultPageSize' | translate\"\n [tooltip]=\"'widgetTabManagement.content.collection.defaultPageSizeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"defaultPageSize\"\n cdsText\n [placeholder]=\"\n 'widgetTabManagement.content.collection.defaultPageSizePlaceholder' | translate\n \"\n type=\"text\"\n />\n </cds-text-label>\n\n <div class=\"valtimo-widget-management-collection__value-field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.collection.collection' | translate\"\n [tooltip]=\"collectionDataTooltip$ | async\"\n >\n </v-input-label>\n\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"collection\"\n [attr.data-carbon-theme]=\"theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [type]=\"ValuePathType.COLLECTION\"\n (collectionSelected)=\"onCollectionSelected($event)\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"collection\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.collection.collection' | translate\"\n type=\"text\"\n />\n }\n </div>\n </form>\n\n <ng-content></ng-content>\n\n <span class=\"valtimo-widget-management-collection__subtitle\">\n {{ 'widgetTabManagement.content.collection.cardTitle' | translate }}\n </span>\n\n <form [formGroup]=\"cardForm\" class=\"valtimo-widget-management-collection__card\">\n <section class=\"valtimo-widget-management-collection__card-title\">\n <div class=\"valtimo-widget-management-collection__path-selector\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.value' | translate\"\n [tooltip]=\"'widgetTabManagement.content.collection.valueTooltip' | translate\"\n >\n </v-input-label>\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"value\"\n [attr.data-carbon-theme]=\"theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [parentItem]=\"selectedCollection$ | async\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"value\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.value' | translate\"\n type=\"text\"\n />\n }\n </div>\n\n <cds-dropdown\n [attr.data-carbon-theme]=\"theme\"\n [label]=\"'widgetTabManagement.content.fields.type' | translate\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.fields.typePlaceholder' | translate\"\n (selected)=\"onTypeSelected(cardForm, $event)\"\n formControlName=\"type\"\n >\n <cds-dropdown-list [items]=\"getDisplayItemsSelected(cardForm)\"></cds-dropdown-list>\n </cds-dropdown>\n </section>\n\n <section class=\"valtimo-widget-management-collection__card-options\">\n @switch (cardForm.get('type').value.id) {\n @case (WidgetDisplayTypeKey.CURRENCY) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.currencyCode' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.currencyCodeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"\n 'widgetTabManagement.content.fields.currencyCodePlaceholder' | translate\n \"\n type=\"text\"\n formControlName=\"currencyCode\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.display' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.displayTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.displayPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"display\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate: {minFractionDigits: 2, maxFractionDigits: 2}\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfoPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.DATE) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.format' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.dateFormatTooltip' | translate\"\n ></v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.formatPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"format\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.DATE_TIME) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.format' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.dateTimeFormatTooltip' | translate\"\n ></v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.formatPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"format\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.ENUM) {\n <div class=\"valtimo-widget-management-collection__enum\" formArrayName=\"values\">\n @for (rowValue of cardForm.get('values')?.controls; track $index) {\n <form [formGroup]=\"rowValue\" class=\"valtimo-widget-management-collection__enum-form\">\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.enumValue' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.enumValueTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n [attr.data-carbon-theme]=\"theme\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.enumValue' | translate\"\n type=\"text\"\n formControlName=\"key\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.enumDisplay' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.enumDisplayTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.enumDisplay' | translate\"\n type=\"text\"\n formControlName=\"value\"\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger--ghost\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n class=\"valtimo-case-management-widget-field-column__delete-button enum\"\n (click)=\"onDeleteRowClick(cardForm.get('values'), $index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n cdsButton=\"primary\"\n size=\"sm\"\n (click)=\"onAddEnumValueClick(cardForm.get('values'))\"\n >\n {{ 'widgetTabManagement.content.fields.addEnum' | translate }}\n\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n </div>\n }\n @case (WidgetDisplayTypeKey.NUMBER) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate\n : {\n minFractionDigits: 0,\n maxFractionDigits: 3,\n }\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.PERCENT) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate\n : {\n minFractionDigits: 0,\n maxFractionDigits: 0,\n }\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n }\n </section>\n </form>\n\n <span class=\"valtimo-widget-management-collection__subtitle\">\n {{ 'widgetTabManagement.content.collection.cardFields' | translate }}\n </span>\n\n <valtimo-widget-management-fields-column\n [columnData]=\"$content()?.fields\"\n [fieldWidthDropdown]=\"fieldWidthDropdown\"\n [showHideWhenEmptyCheckbox]=\"true\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event)\"\n [selectedCollection]=\"selectedCollection$ | async\"\n >\n </valtimo-widget-management-fields-column>\n\n <ng-template #fieldWidthDropdown let-index=\"index\">\n <cds-dropdown\n [label]=\"'widgetTabManagement.content.collection.fieldWidth' | translate\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.collection.fieldWidthPlaceholder' | translate\"\n (selected)=\"onWidthSelected($event, index)\"\n >\n <cds-dropdown-list [items]=\"getSelectedWidthItem(index)\"></cds-dropdown-list>\n </cds-dropdown>\n </ng-template>\n</ng-container>\n", styles: [".valtimo-widget-management-collection{display:flex;flex-direction:column;gap:24px}.valtimo-widget-management-collection__form{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);align-items:flex-end;background:var(--cds-layer);padding:12px 16px 16px}.valtimo-widget-management-collection__subtitle{font-size:16px;font-weight:600;line-height:22px}.valtimo-widget-management-collection__value-field{display:flex;flex-direction:column}.valtimo-widget-management-collection__card{flex-direction:column;display:flex;gap:16px;background:var(--cds-layer);padding:16px}.valtimo-widget-management-collection__card-title{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;align-items:flex-end}.valtimo-widget-management-collection__card-options{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.valtimo-widget-management-collection__enum{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-collection__enum-form{display:grid;grid-template-columns:1fr 1fr auto;align-items:flex-end;gap:16px}.valtimo-widget-management-collection .cds--text-input,.valtimo-widget-management-collection .cds--list-box{background:var(--cds-layer-02)}\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"] }]
5761
+ ], 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 *ngIf=\"{theme: theme$ | async, params: params$ | async} as obs\">\n <form [formGroup]=\"widgetForm\" class=\"valtimo-widget-management-collection__form\">\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"title\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n\n <cds-text-label [attr.data-carbon-theme]=\"theme\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.collection.defaultPageSize' | translate\"\n [tooltip]=\"'widgetTabManagement.content.collection.defaultPageSizeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"defaultPageSize\"\n cdsText\n [placeholder]=\"\n 'widgetTabManagement.content.collection.defaultPageSizePlaceholder' | translate\n \"\n type=\"text\"\n />\n </cds-text-label>\n\n <div class=\"valtimo-widget-management-collection__value-field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.collection.collection' | translate\"\n [tooltip]=\"collectionDataTooltip$ | async\"\n >\n </v-input-label>\n\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"collection\"\n [attr.data-carbon-theme]=\"theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [type]=\"ValuePathType.COLLECTION\"\n (collectionSelected)=\"onCollectionSelected($event)\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"collection\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.collection.collection' | translate\"\n type=\"text\"\n />\n }\n </div>\n </form>\n\n <ng-content></ng-content>\n\n <span class=\"valtimo-widget-management-collection__subtitle\">\n {{ 'widgetTabManagement.content.collection.cardTitle' | translate }}\n </span>\n\n <form [formGroup]=\"cardForm\" class=\"valtimo-widget-management-collection__card\">\n <section class=\"valtimo-widget-management-collection__card-title\">\n <div class=\"valtimo-widget-management-collection__path-selector\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.value' | translate\"\n [tooltip]=\"'widgetTabManagement.content.collection.valueTooltip' | translate\"\n >\n </v-input-label>\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"value\"\n [attr.data-carbon-theme]=\"theme\"\n [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n [parentItem]=\"selectedCollection$ | async\"\n ></valtimo-value-path-selector>\n } @else {\n <input\n formControlName=\"value\"\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.value' | translate\"\n type=\"text\"\n />\n }\n </div>\n\n <cds-dropdown\n [attr.data-carbon-theme]=\"theme\"\n [label]=\"'widgetTabManagement.content.fields.type' | translate\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.fields.typePlaceholder' | translate\"\n (selected)=\"onTypeSelected(cardForm, $event)\"\n formControlName=\"type\"\n >\n <cds-dropdown-list [items]=\"getDisplayItemsSelected(cardForm)\"></cds-dropdown-list>\n </cds-dropdown>\n </section>\n\n <section class=\"valtimo-widget-management-collection__card-options\">\n @switch (cardForm.get('type').value.id) {\n @case (WidgetDisplayTypeKey.CURRENCY) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.currencyCode' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.currencyCodeTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"\n 'widgetTabManagement.content.fields.currencyCodePlaceholder' | translate\n \"\n type=\"text\"\n formControlName=\"currencyCode\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.display' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.displayTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.displayPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"display\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate: {minFractionDigits: 2, maxFractionDigits: 2}\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfoPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.DATE) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.format' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.dateFormatTooltip' | translate\"\n ></v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.formatPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"format\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.DATE_TIME) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.format' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.dateTimeFormatTooltip' | translate\"\n ></v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.formatPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"format\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.ENUM) {\n <div class=\"valtimo-widget-management-collection__enum\" formArrayName=\"values\">\n @for (rowValue of cardForm.get('values')?.controls; track $index) {\n <form [formGroup]=\"rowValue\" class=\"valtimo-widget-management-collection__enum-form\">\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.enumValue' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.enumValueTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n [attr.data-carbon-theme]=\"theme\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.enumValue' | translate\"\n type=\"text\"\n formControlName=\"key\"\n />\n </cds-text-label>\n\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.enumDisplay' | translate\"\n [tooltip]=\"'widgetTabManagement.content.fields.enumDisplayTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.enumDisplay' | translate\"\n type=\"text\"\n formControlName=\"value\"\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger--ghost\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n class=\"valtimo-case-management-widget-field-column__delete-button enum\"\n (click)=\"onDeleteRowClick(cardForm.get('values'), $index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n cdsButton=\"primary\"\n size=\"sm\"\n (click)=\"onAddEnumValueClick(cardForm.get('values'))\"\n >\n {{ 'widgetTabManagement.content.fields.addEnum' | translate }}\n\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n </div>\n }\n @case (WidgetDisplayTypeKey.NUMBER) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate\n : {\n minFractionDigits: 0,\n maxFractionDigits: 3,\n }\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n @case (WidgetDisplayTypeKey.PERCENT) {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n tooltip=\"{{\n 'widgetTabManagement.content.fields.digitsInfoTooltip'\n | translate\n : {\n minFractionDigits: 0,\n maxFractionDigits: 0,\n }\n }}\"\n >\n </v-input-label>\n\n <input\n cdsText\n [attr.data-carbon-theme]=\"theme\"\n [placeholder]=\"'widgetTabManagement.content.fields.digitsInfo' | translate\"\n type=\"text\"\n formControlName=\"digitsInfo\"\n />\n </cds-text-label>\n }\n }\n </section>\n </form>\n\n <span class=\"valtimo-widget-management-collection__subtitle\">\n {{ 'widgetTabManagement.content.collection.cardFields' | translate }}\n </span>\n\n <valtimo-widget-management-fields-column\n [columnData]=\"$content()?.fields\"\n [fieldWidthDropdown]=\"fieldWidthDropdown\"\n [showHideWhenEmptyCheckbox]=\"true\"\n (columnUpdateEvent)=\"onColumnUpdateEvent($event)\"\n [selectedCollection]=\"selectedCollection$ | async\"\n >\n </valtimo-widget-management-fields-column>\n\n <ng-template #fieldWidthDropdown let-index=\"index\">\n <cds-dropdown\n [label]=\"'widgetTabManagement.content.collection.fieldWidth' | translate\"\n [dropUp]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.collection.fieldWidthPlaceholder' | translate\"\n (selected)=\"onWidthSelected($event, index)\"\n >\n <cds-dropdown-list [items]=\"getSelectedWidthItem(index)\"></cds-dropdown-list>\n </cds-dropdown>\n </ng-template>\n</ng-container>\n", styles: [".valtimo-widget-management-collection{display:flex;flex-direction:column;gap:24px}.valtimo-widget-management-collection__form{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);align-items:flex-end;background:var(--cds-layer-02);padding:12px 16px 16px}.valtimo-widget-management-collection__subtitle{font-size:16px;font-weight:600;line-height:22px}.valtimo-widget-management-collection__value-field{display:flex;flex-direction:column}.valtimo-widget-management-collection__card{flex-direction:column;display:flex;gap:16px;background:var(--cds-layer-02);padding:16px}.valtimo-widget-management-collection__card-title{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;align-items:flex-end}.valtimo-widget-management-collection__card-options{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.valtimo-widget-management-collection__enum{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-collection__enum-form{display:grid;grid-template-columns:1fr 1fr auto;align-items:flex-end;gap:16px}.valtimo-widget-management-collection .cds--text-input,.valtimo-widget-management-collection .cds--list-box{background:var(--cds-layer-01)}\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"] }]
5749
5762
  }], ctorParameters: () => [{ type: i1$1.CdsThemeService }, { type: i1$3.FormBuilder }, { type: i2$2.TranslateService }, { type: WidgetFieldsService }, { type: WidgetWizardService }, { type: undefined, decorators: [{
5750
5763
  type: Inject,
5751
5764
  args: [WIDGET_MANAGEMENT_SERVICE]
@@ -5851,7 +5864,7 @@ class WidgetManagementCustomComponent {
5851
5864
  this.widgetWizardService.$widgetContentValid.set(true);
5852
5865
  }
5853
5866
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementCustomComponent, deps: [{ token: CUSTOM_WIDGET_TOKEN, optional: true }, { token: i1$1.CdsThemeService }, { token: i1$3.FormBuilder }, { token: WidgetWizardService }], target: i0.ɵɵFactoryTarget.Component }); }
5854
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementCustomComponent, isStandalone: true, selector: "ng-component", 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<form\n class=\"valtimo-widget-management-custom\"\n [formGroup]=\"form\"\n [attr.data-carbon-theme]=\"theme$ | async\"\n>\n <div class=\"valtimo-widget-management-custom__title-container\">\n <cds-text-label\n class=\"valtimo-widget-management-fields__input valtimo-widget-management-custom__title-input\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"0\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n\n <ng-content></ng-content>\n\n <cds-label class=\"dropdown-label\">\n {{ 'widgetTabManagement.content.custom.selectComponent' | translate }}\n\n <cds-dropdown\n *ngIf=\"componentListItems$ | async as componentListItems\"\n [appendInline]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.custom.placeholder' | translate\"\n [disabled]=\"componentListItems.length === 0\"\n (selected)=\"componentDropDownChange($event)\"\n >\n <cds-dropdown-list [items]=\"componentListItems\"> </cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n [addRowText]=\"'widgetTabManagement.content.custom.addCustomKeyValue' | translate\"\n addButtonType=\"tertiary\"\n [defaultValues]=\"$defaultComponentValues()\"\n [keyColumnTitle]=\"'interface.key' | translate\"\n [valueColumnTitle]=\"'interface.value' | translate\"\n [fullWidth]=\"true\"\n [initialAmountOfRows]=\"0\"\n [minimumAmountOfRows]=\"0\"\n (valueChange)=\"onKeyValueChange($event)\"\n [keyColumnFlex]=\"1\"\n [valueColumnFlex]=\"1\"\n ></valtimo-carbon-multi-input>\n</form>\n", styles: [".valtimo-widget-management-custom{display:flex;flex-direction:column;gap:16px;padding:16px}.valtimo-widget-management-custom ::ng-deep>*:not(:last-child){padding:16px;background:var(--cds-layer-02)}.valtimo-widget-management-custom ::ng-deep .v-multi-input__row{padding:16px;background:var(--cds-layer-02)}.valtimo-widget-management-custom ::ng-deep .v-multi-input__row .cds--text-input{background:var(--cds-layer-01)}.valtimo-widget-management-custom ::ng-deep .dropdown-label label{display:flex;flex-direction:column;width:100%}.valtimo-widget-management-custom ::ng-deep .dropdown-label cds-dropdown{margin-top:8px}.valtimo-widget-management-custom__title-container{display:flex;gap:16px}.valtimo-widget-management-custom__title-input{max-width:300px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SelectModule$1 }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: CarbonMultiInputModule }, { kind: "component", type: i1$1.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5867
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementCustomComponent, isStandalone: true, selector: "ng-component", 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<form\n class=\"valtimo-widget-management-custom\"\n [formGroup]=\"form\"\n [attr.data-carbon-theme]=\"theme$ | async\"\n>\n <div class=\"valtimo-widget-management-custom__title-container\">\n <cds-text-label\n class=\"valtimo-widget-management-fields__input valtimo-widget-management-custom__title-input\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"0\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n\n <ng-content></ng-content>\n\n <cds-label class=\"dropdown-label\">\n {{ 'widgetTabManagement.content.custom.selectComponent' | translate }}\n\n <cds-dropdown\n *ngIf=\"componentListItems$ | async as componentListItems\"\n [appendInline]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.custom.placeholder' | translate\"\n [disabled]=\"componentListItems.length === 0\"\n (selected)=\"componentDropDownChange($event)\"\n >\n <cds-dropdown-list [items]=\"componentListItems\"> </cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n [addRowText]=\"'widgetTabManagement.content.custom.addCustomKeyValue' | translate\"\n addButtonType=\"tertiary\"\n [defaultValues]=\"$defaultComponentValues()\"\n [keyColumnTitle]=\"'interface.key' | translate\"\n [valueColumnTitle]=\"'interface.value' | translate\"\n [fullWidth]=\"true\"\n [initialAmountOfRows]=\"0\"\n [minimumAmountOfRows]=\"0\"\n (valueChange)=\"onKeyValueChange($event)\"\n [keyColumnFlex]=\"1\"\n [valueColumnFlex]=\"1\"\n ></valtimo-carbon-multi-input>\n</form>\n", styles: [".valtimo-widget-management-custom{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-custom ::ng-deep .cds--text-input,.valtimo-widget-management-custom ::ng-deep .cds--list-box,.valtimo-widget-management-custom ::ng-deep .cds--list-box__field,.valtimo-widget-management-custom ::ng-deep .cds--dropdown{background-color:var(--cds-layer-02)}.valtimo-widget-management-custom ::ng-deep .v-multi-input__row{padding:12px 16px 16px;background-color:var(--cds-layer-02)}.valtimo-widget-management-custom ::ng-deep .v-multi-input__row .cds--text-input{background-color:var(--cds-layer-01)}.valtimo-widget-management-custom ::ng-deep .dropdown-label label{display:flex;flex-direction:column;width:100%}.valtimo-widget-management-custom ::ng-deep .dropdown-label cds-dropdown{margin-top:8px}.valtimo-widget-management-custom__title-container{display:flex;gap:16px}.valtimo-widget-management-custom__title-input{max-width:300px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SelectModule$1 }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: CarbonMultiInputModule }, { kind: "component", type: i1$1.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"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5855
5868
  }
5856
5869
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementCustomComponent, decorators: [{
5857
5870
  type: Component,
@@ -5866,7 +5879,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
5866
5879
  MdiIconSelectorComponent,
5867
5880
  InputLabelModule,
5868
5881
  CarbonMultiInputModule,
5869
- ], 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<form\n class=\"valtimo-widget-management-custom\"\n [formGroup]=\"form\"\n [attr.data-carbon-theme]=\"theme$ | async\"\n>\n <div class=\"valtimo-widget-management-custom__title-container\">\n <cds-text-label\n class=\"valtimo-widget-management-fields__input valtimo-widget-management-custom__title-input\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"0\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n\n <ng-content></ng-content>\n\n <cds-label class=\"dropdown-label\">\n {{ 'widgetTabManagement.content.custom.selectComponent' | translate }}\n\n <cds-dropdown\n *ngIf=\"componentListItems$ | async as componentListItems\"\n [appendInline]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.custom.placeholder' | translate\"\n [disabled]=\"componentListItems.length === 0\"\n (selected)=\"componentDropDownChange($event)\"\n >\n <cds-dropdown-list [items]=\"componentListItems\"> </cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n [addRowText]=\"'widgetTabManagement.content.custom.addCustomKeyValue' | translate\"\n addButtonType=\"tertiary\"\n [defaultValues]=\"$defaultComponentValues()\"\n [keyColumnTitle]=\"'interface.key' | translate\"\n [valueColumnTitle]=\"'interface.value' | translate\"\n [fullWidth]=\"true\"\n [initialAmountOfRows]=\"0\"\n [minimumAmountOfRows]=\"0\"\n (valueChange)=\"onKeyValueChange($event)\"\n [keyColumnFlex]=\"1\"\n [valueColumnFlex]=\"1\"\n ></valtimo-carbon-multi-input>\n</form>\n", styles: [".valtimo-widget-management-custom{display:flex;flex-direction:column;gap:16px;padding:16px}.valtimo-widget-management-custom ::ng-deep>*:not(:last-child){padding:16px;background:var(--cds-layer-02)}.valtimo-widget-management-custom ::ng-deep .v-multi-input__row{padding:16px;background:var(--cds-layer-02)}.valtimo-widget-management-custom ::ng-deep .v-multi-input__row .cds--text-input{background:var(--cds-layer-01)}.valtimo-widget-management-custom ::ng-deep .dropdown-label label{display:flex;flex-direction:column;width:100%}.valtimo-widget-management-custom ::ng-deep .dropdown-label cds-dropdown{margin-top:8px}.valtimo-widget-management-custom__title-container{display:flex;gap:16px}.valtimo-widget-management-custom__title-input{max-width:300px}\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"] }]
5882
+ ], 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<form\n class=\"valtimo-widget-management-custom\"\n [formGroup]=\"form\"\n [attr.data-carbon-theme]=\"theme$ | async\"\n>\n <div class=\"valtimo-widget-management-custom__title-container\">\n <cds-text-label\n class=\"valtimo-widget-management-fields__input valtimo-widget-management-custom__title-input\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"0\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n\n <ng-content></ng-content>\n\n <cds-label class=\"dropdown-label\">\n {{ 'widgetTabManagement.content.custom.selectComponent' | translate }}\n\n <cds-dropdown\n *ngIf=\"componentListItems$ | async as componentListItems\"\n [appendInline]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.custom.placeholder' | translate\"\n [disabled]=\"componentListItems.length === 0\"\n (selected)=\"componentDropDownChange($event)\"\n >\n <cds-dropdown-list [items]=\"componentListItems\"> </cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n [addRowText]=\"'widgetTabManagement.content.custom.addCustomKeyValue' | translate\"\n addButtonType=\"tertiary\"\n [defaultValues]=\"$defaultComponentValues()\"\n [keyColumnTitle]=\"'interface.key' | translate\"\n [valueColumnTitle]=\"'interface.value' | translate\"\n [fullWidth]=\"true\"\n [initialAmountOfRows]=\"0\"\n [minimumAmountOfRows]=\"0\"\n (valueChange)=\"onKeyValueChange($event)\"\n [keyColumnFlex]=\"1\"\n [valueColumnFlex]=\"1\"\n ></valtimo-carbon-multi-input>\n</form>\n", styles: [".valtimo-widget-management-custom{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-custom ::ng-deep .cds--text-input,.valtimo-widget-management-custom ::ng-deep .cds--list-box,.valtimo-widget-management-custom ::ng-deep .cds--list-box__field,.valtimo-widget-management-custom ::ng-deep .cds--dropdown{background-color:var(--cds-layer-02)}.valtimo-widget-management-custom ::ng-deep .v-multi-input__row{padding:12px 16px 16px;background-color:var(--cds-layer-02)}.valtimo-widget-management-custom ::ng-deep .v-multi-input__row .cds--text-input{background-color:var(--cds-layer-01)}.valtimo-widget-management-custom ::ng-deep .dropdown-label label{display:flex;flex-direction:column;width:100%}.valtimo-widget-management-custom ::ng-deep .dropdown-label cds-dropdown{margin-top:8px}.valtimo-widget-management-custom__title-container{display:flex;gap:16px}.valtimo-widget-management-custom__title-input{max-width:300px}\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"] }]
5870
5883
  }], ctorParameters: () => [{ type: undefined, decorators: [{
5871
5884
  type: Optional
5872
5885
  }, {
@@ -5957,7 +5970,7 @@ class WidgetManagementMapComponent {
5957
5970
  formArray.removeAt(index);
5958
5971
  }
5959
5972
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementMapComponent, deps: [{ token: i1$3.FormBuilder }, { token: WidgetWizardService }, { token: i1$1.CdsThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
5960
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementMapComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<form\n *ngIf=\"$showTitleInput()\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-map__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-map__input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n</form>\n\n<ng-content></ng-content>\n\n<form\n class=\"valtimo-widget-management-map-layer\"\n [formGroup]=\"form\"\n>\n <cds-accordion formArrayName=\"geoJsonSources\" align=\"start\" size=\"sm\">\n @for (formGeoJsonSource of formGeoJsonSources.controls; track $index) {\n <cds-accordion-item\n [title]=\"fieldTitle\"\n [context]=\"{count: $count, index: $index, key: formGeoJsonSource.get('key')?.value}\"\n [expanded]=\"$index === 0\"\n class=\"valtimo-widget-management-map-layer__item\"\n >\n <form\n [formGroup]=\"formGeoJsonSource\"\n class=\"valtimo-widget-management-map-layer__container\"\n >\n <div class=\"valtimo-widget-management-map-layer__content\">\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.map.key' | translate\"\n [tooltip]=\"'widgetTabManagement.content.map.keyTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n cdsLayer=\"2\"\n [attr.data-carbon-theme]=\"inputTheme$ | async\"\n [placeholder]=\"'widgetTabManagement.content.map.keyPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"key\"\n />\n </cds-text-label>\n </div>\n </form>\n </cds-accordion-item>\n }\n </cds-accordion>\n\n <button cdsButton=\"primary\" size=\"sm\" (click)=\"addField()\">\n {{ 'widgetTabManagement.content.map.add' | translate }}\n\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</form>\n\n<ng-template #fieldTitle let-count=\"count\" let-index=\"index\">\n <div class=\"valtimo-widget-management-map-layer__title\">\n {{ 'widgetTabManagement.content.map.layerTitle' | translate: {layer: index + 1} }}\n\n <button\n cdsButton=\"danger\"\n [disabled]=\"count === 1\"\n [iconOnly]=\"true\"\n (click)=\"onDeleteRowClick($event, formGeoJsonSources, index)\"\n class=\"valtimo-widget-management-map-layer__delete-button\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </div>\n</ng-template>\n", styles: [".cds--tab-content{padding:0!important}.valtimo-widget-management-map{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-map__title-form{padding:8px 0 16px 16px;background:var(--cds-layer)}.valtimo-widget-management-map__input{max-width:288px}.valtimo-widget-management-map__input input{background:var(--cds-layer-02)}.valtimo-widget-management-map__delete-button{display:flex;align-items:center;justify-content:center;padding:0;align-self:center}.valtimo-widget-management-map__delete-button.enum{align-self:flex-end}.valtimo-widget-management-map__heading{display:flex;align-items:center}.valtimo-widget-management-map .cds--tabs__nav-item{padding-right:0!important}.valtimo-widget-management-map-layer{display:flex;flex-direction:column;gap:16px;background:var(--cds-layer-02)}.valtimo-widget-management-map-layer__item,.valtimo-widget-management-map-layer__cotainer{background:var(--cds-layer-01)}.valtimo-widget-management-map-layer__item .cds--accordion__content{padding-inline-end:20px}.valtimo-widget-management-map-layer__container{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-map-layer__content{display:grid;grid-template-columns:1fr 180px 1fr;align-items:flex-end;gap:16px}.valtimo-widget-management-map-layer__title{display:flex;justify-content:space-between;align-items:center;width:100%;padding:8px}.valtimo-widget-management-map-layer__delete-button{display:flex;align-items:center;justify-content:center;padding:0;align-self:center}.valtimo-widget-management-map-layer__delete-button.enum{align-self:flex-end}.valtimo-widget-management-map-layer .cds--text-input,.valtimo-widget-management-map-layer .cds--list-box{background:var(--cds-layer-02)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: TabsModule }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i3.Accordion, selector: "cds-accordion, ibm-accordion", inputs: ["align", "size", "skeleton"] }, { kind: "component", type: i3.AccordionItem, selector: "cds-accordion-item, ibm-accordion-item", inputs: ["title", "context", "id", "skeleton", "expanded", "disabled"], outputs: ["selected"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5973
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementMapComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<form\n *ngIf=\"$showTitleInput()\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-map__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-map__input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n</form>\n\n<ng-content></ng-content>\n\n<form\n class=\"valtimo-widget-management-map-layer\"\n [formGroup]=\"form\"\n>\n <cds-accordion formArrayName=\"geoJsonSources\" align=\"start\" size=\"sm\">\n @for (formGeoJsonSource of formGeoJsonSources.controls; track $index) {\n <cds-accordion-item\n [title]=\"fieldTitle\"\n [context]=\"{count: $count, index: $index, key: formGeoJsonSource.get('key')?.value}\"\n [expanded]=\"$index === 0\"\n class=\"valtimo-widget-management-map-layer__item\"\n >\n <form\n [formGroup]=\"formGeoJsonSource\"\n class=\"valtimo-widget-management-map-layer__container\"\n >\n <div class=\"valtimo-widget-management-map-layer__content\">\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.map.key' | translate\"\n [tooltip]=\"'widgetTabManagement.content.map.keyTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n cdsLayer=\"2\"\n [attr.data-carbon-theme]=\"inputTheme$ | async\"\n [placeholder]=\"'widgetTabManagement.content.map.keyPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"key\"\n />\n </cds-text-label>\n </div>\n </form>\n </cds-accordion-item>\n }\n </cds-accordion>\n\n <button cdsButton=\"primary\" size=\"sm\" (click)=\"addField()\">\n {{ 'widgetTabManagement.content.map.add' | translate }}\n\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</form>\n\n<ng-template #fieldTitle let-count=\"count\" let-index=\"index\">\n <div class=\"valtimo-widget-management-map-layer__title\">\n {{ 'widgetTabManagement.content.map.layerTitle' | translate: {layer: index + 1} }}\n\n <button\n cdsButton=\"danger\"\n [disabled]=\"count === 1\"\n [iconOnly]=\"true\"\n (click)=\"onDeleteRowClick($event, formGeoJsonSources, index)\"\n class=\"valtimo-widget-management-map-layer__delete-button\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </div>\n</ng-template>\n", styles: [".cds--tab-content{padding:0!important}.valtimo-widget-management-map{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-map__title-form{background:var(--cds-layer-02)}.valtimo-widget-management-map__input{max-width:288px}.valtimo-widget-management-map__input input{background:var(--cds-layer-01)}.valtimo-widget-management-map__delete-button{display:flex;align-items:center;justify-content:center;padding:0;align-self:center}.valtimo-widget-management-map__delete-button.enum{align-self:flex-end}.valtimo-widget-management-map__heading{display:flex;align-items:center}.valtimo-widget-management-map .cds--tabs__nav-item{padding-right:0!important}.valtimo-widget-management-map-layer{display:flex;flex-direction:column;gap:16px;background:var(--cds-layer-02)}.valtimo-widget-management-map-layer__item,.valtimo-widget-management-map-layer__cotainer{background:var(--cds-layer-01)}.valtimo-widget-management-map-layer__item .cds--accordion__content{padding-inline-end:20px}.valtimo-widget-management-map-layer__container{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-map-layer__content{display:grid;grid-template-columns:1fr 180px 1fr;align-items:flex-end;gap:16px}.valtimo-widget-management-map-layer__title{display:flex;justify-content:space-between;align-items:center;width:100%;padding:8px}.valtimo-widget-management-map-layer__delete-button{display:flex;align-items:center;justify-content:center;padding:0;align-self:center}.valtimo-widget-management-map-layer__delete-button.enum{align-self:flex-end}.valtimo-widget-management-map-layer .cds--text-input,.valtimo-widget-management-map-layer .cds--list-box{background:var(--cds-layer-02)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: TabsModule }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i3.Accordion, selector: "cds-accordion, ibm-accordion", inputs: ["align", "size", "skeleton"] }, { kind: "component", type: i3.AccordionItem, selector: "cds-accordion-item, ibm-accordion-item", inputs: ["title", "context", "id", "skeleton", "expanded", "disabled"], outputs: ["selected"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
5961
5974
  }
5962
5975
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementMapComponent, decorators: [{
5963
5976
  type: Component,
@@ -5972,7 +5985,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
5972
5985
  InputLabelModule,
5973
5986
  AccordionModule,
5974
5987
  LayerModule,
5975
- ], 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<form\n *ngIf=\"$showTitleInput()\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-map__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-map__input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n</form>\n\n<ng-content></ng-content>\n\n<form\n class=\"valtimo-widget-management-map-layer\"\n [formGroup]=\"form\"\n>\n <cds-accordion formArrayName=\"geoJsonSources\" align=\"start\" size=\"sm\">\n @for (formGeoJsonSource of formGeoJsonSources.controls; track $index) {\n <cds-accordion-item\n [title]=\"fieldTitle\"\n [context]=\"{count: $count, index: $index, key: formGeoJsonSource.get('key')?.value}\"\n [expanded]=\"$index === 0\"\n class=\"valtimo-widget-management-map-layer__item\"\n >\n <form\n [formGroup]=\"formGeoJsonSource\"\n class=\"valtimo-widget-management-map-layer__container\"\n >\n <div class=\"valtimo-widget-management-map-layer__content\">\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.map.key' | translate\"\n [tooltip]=\"'widgetTabManagement.content.map.keyTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n cdsLayer=\"2\"\n [attr.data-carbon-theme]=\"inputTheme$ | async\"\n [placeholder]=\"'widgetTabManagement.content.map.keyPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"key\"\n />\n </cds-text-label>\n </div>\n </form>\n </cds-accordion-item>\n }\n </cds-accordion>\n\n <button cdsButton=\"primary\" size=\"sm\" (click)=\"addField()\">\n {{ 'widgetTabManagement.content.map.add' | translate }}\n\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</form>\n\n<ng-template #fieldTitle let-count=\"count\" let-index=\"index\">\n <div class=\"valtimo-widget-management-map-layer__title\">\n {{ 'widgetTabManagement.content.map.layerTitle' | translate: {layer: index + 1} }}\n\n <button\n cdsButton=\"danger\"\n [disabled]=\"count === 1\"\n [iconOnly]=\"true\"\n (click)=\"onDeleteRowClick($event, formGeoJsonSources, index)\"\n class=\"valtimo-widget-management-map-layer__delete-button\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </div>\n</ng-template>\n", styles: [".cds--tab-content{padding:0!important}.valtimo-widget-management-map{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-map__title-form{padding:8px 0 16px 16px;background:var(--cds-layer)}.valtimo-widget-management-map__input{max-width:288px}.valtimo-widget-management-map__input input{background:var(--cds-layer-02)}.valtimo-widget-management-map__delete-button{display:flex;align-items:center;justify-content:center;padding:0;align-self:center}.valtimo-widget-management-map__delete-button.enum{align-self:flex-end}.valtimo-widget-management-map__heading{display:flex;align-items:center}.valtimo-widget-management-map .cds--tabs__nav-item{padding-right:0!important}.valtimo-widget-management-map-layer{display:flex;flex-direction:column;gap:16px;background:var(--cds-layer-02)}.valtimo-widget-management-map-layer__item,.valtimo-widget-management-map-layer__cotainer{background:var(--cds-layer-01)}.valtimo-widget-management-map-layer__item .cds--accordion__content{padding-inline-end:20px}.valtimo-widget-management-map-layer__container{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-map-layer__content{display:grid;grid-template-columns:1fr 180px 1fr;align-items:flex-end;gap:16px}.valtimo-widget-management-map-layer__title{display:flex;justify-content:space-between;align-items:center;width:100%;padding:8px}.valtimo-widget-management-map-layer__delete-button{display:flex;align-items:center;justify-content:center;padding:0;align-self:center}.valtimo-widget-management-map-layer__delete-button.enum{align-self:flex-end}.valtimo-widget-management-map-layer .cds--text-input,.valtimo-widget-management-map-layer .cds--list-box{background:var(--cds-layer-02)}\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"] }]
5988
+ ], 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<form\n *ngIf=\"$showTitleInput()\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-map__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-map__input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n</form>\n\n<ng-content></ng-content>\n\n<form\n class=\"valtimo-widget-management-map-layer\"\n [formGroup]=\"form\"\n>\n <cds-accordion formArrayName=\"geoJsonSources\" align=\"start\" size=\"sm\">\n @for (formGeoJsonSource of formGeoJsonSources.controls; track $index) {\n <cds-accordion-item\n [title]=\"fieldTitle\"\n [context]=\"{count: $count, index: $index, key: formGeoJsonSource.get('key')?.value}\"\n [expanded]=\"$index === 0\"\n class=\"valtimo-widget-management-map-layer__item\"\n >\n <form\n [formGroup]=\"formGeoJsonSource\"\n class=\"valtimo-widget-management-map-layer__container\"\n >\n <div class=\"valtimo-widget-management-map-layer__content\">\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.map.key' | translate\"\n [tooltip]=\"'widgetTabManagement.content.map.keyTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n cdsText\n cdsLayer=\"2\"\n [attr.data-carbon-theme]=\"inputTheme$ | async\"\n [placeholder]=\"'widgetTabManagement.content.map.keyPlaceholder' | translate\"\n type=\"text\"\n formControlName=\"key\"\n />\n </cds-text-label>\n </div>\n </form>\n </cds-accordion-item>\n }\n </cds-accordion>\n\n <button cdsButton=\"primary\" size=\"sm\" (click)=\"addField()\">\n {{ 'widgetTabManagement.content.map.add' | translate }}\n\n <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n </button>\n</form>\n\n<ng-template #fieldTitle let-count=\"count\" let-index=\"index\">\n <div class=\"valtimo-widget-management-map-layer__title\">\n {{ 'widgetTabManagement.content.map.layerTitle' | translate: {layer: index + 1} }}\n\n <button\n cdsButton=\"danger\"\n [disabled]=\"count === 1\"\n [iconOnly]=\"true\"\n (click)=\"onDeleteRowClick($event, formGeoJsonSources, index)\"\n class=\"valtimo-widget-management-map-layer__delete-button\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </div>\n</ng-template>\n", styles: [".cds--tab-content{padding:0!important}.valtimo-widget-management-map{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-map__title-form{background:var(--cds-layer-02)}.valtimo-widget-management-map__input{max-width:288px}.valtimo-widget-management-map__input input{background:var(--cds-layer-01)}.valtimo-widget-management-map__delete-button{display:flex;align-items:center;justify-content:center;padding:0;align-self:center}.valtimo-widget-management-map__delete-button.enum{align-self:flex-end}.valtimo-widget-management-map__heading{display:flex;align-items:center}.valtimo-widget-management-map .cds--tabs__nav-item{padding-right:0!important}.valtimo-widget-management-map-layer{display:flex;flex-direction:column;gap:16px;background:var(--cds-layer-02)}.valtimo-widget-management-map-layer__item,.valtimo-widget-management-map-layer__cotainer{background:var(--cds-layer-01)}.valtimo-widget-management-map-layer__item .cds--accordion__content{padding-inline-end:20px}.valtimo-widget-management-map-layer__container{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-map-layer__content{display:grid;grid-template-columns:1fr 180px 1fr;align-items:flex-end;gap:16px}.valtimo-widget-management-map-layer__title{display:flex;justify-content:space-between;align-items:center;width:100%;padding:8px}.valtimo-widget-management-map-layer__delete-button{display:flex;align-items:center;justify-content:center;padding:0;align-self:center}.valtimo-widget-management-map-layer__delete-button.enum{align-self:flex-end}.valtimo-widget-management-map-layer .cds--text-input,.valtimo-widget-management-map-layer .cds--list-box{background:var(--cds-layer-02)}\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"] }]
5976
5989
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: WidgetWizardService }, { type: i1$1.CdsThemeService }], propDecorators: { class: [{
5977
5990
  type: HostBinding,
5978
5991
  args: ['class']
@@ -6051,7 +6064,7 @@ class WidgetManagementPersonCardComponent {
6051
6064
  this.widgetWizardService.$widgetContentValid.set(this.form.valid);
6052
6065
  }
6053
6066
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementPersonCardComponent, deps: [{ token: i1$3.FormBuilder }, { token: WidgetWizardService }, { token: WIDGET_MANAGEMENT_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
6054
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementPersonCardComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<form [formGroup]=\"form\">\n <section\n *ngIf=\"$showTitleInput()\"\n class=\"valtimo-widget-management-person-card__title-form\"\n >\n <cds-text-label class=\"valtimo-widget-management-person-card__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </section>\n\n <div class=\"valtimo-widget-management-person-card__action-button-section\">\n <ng-content></ng-content>\n </div>\n\n <section class=\"valtimo-widget-management-person-card__person-fields\">\n <div\n class=\"valtimo-widget-management-person-card__field valtimo-widget-management-person-card__field--full\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.fullNameLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.fullNameInput\"\n formControlName=\"fullName\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.birthDateLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.birthDateInput\"\n formControlName=\"birthDate\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label [title]=\"'widgetTabManagement.content.person-card.bsnLabel' | translate\">\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.bsnInput\"\n formControlName=\"bsn\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.phoneLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.phoneInput\"\n formControlName=\"phone\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.emailLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.emailInput\"\n formControlName=\"email\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label [title]=\"'widgetTabManagement.content.person-card.cityLabel' | translate\">\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.cityInput\"\n formControlName=\"city\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n </section>\n</form>\n", styles: [".valtimo-widget-management-person-card{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-person-card>form{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-person-card__title-form{padding:8px 0 16px 16px;background:var(--cds-layer);display:flex;gap:16px}.valtimo-widget-management-person-card__title-input{max-width:288px}.valtimo-widget-management-person-card__title-input input{background:var(--cds-layer-02)}.valtimo-widget-management-person-card__person-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:16px;padding:16px;background:var(--cds-layer)}.valtimo-widget-management-person-card__person-fields .cds--text-input,.valtimo-widget-management-person-card__person-fields .cds--list-box{background:var(--cds-layer-02)}.valtimo-widget-management-person-card__field{display:flex;flex-direction:column;gap:4px;min-width:0}.valtimo-widget-management-person-card__field--full{grid-column:1/-1}\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: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6067
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementPersonCardComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<form [formGroup]=\"form\">\n <section\n *ngIf=\"$showTitleInput()\"\n class=\"valtimo-widget-management-person-card__title-form\"\n >\n <cds-text-label class=\"valtimo-widget-management-person-card__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </section>\n\n <div class=\"valtimo-widget-management-person-card__action-button-section\">\n <ng-content></ng-content>\n </div>\n\n <section class=\"valtimo-widget-management-person-card__person-fields\">\n <div\n class=\"valtimo-widget-management-person-card__field valtimo-widget-management-person-card__field--full\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.fullNameLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.fullNameInput\"\n formControlName=\"fullName\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.birthDateLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.birthDateInput\"\n formControlName=\"birthDate\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label [title]=\"'widgetTabManagement.content.person-card.bsnLabel' | translate\">\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.bsnInput\"\n formControlName=\"bsn\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.phoneLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.phoneInput\"\n formControlName=\"phone\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.emailLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.emailInput\"\n formControlName=\"email\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label [title]=\"'widgetTabManagement.content.person-card.cityLabel' | translate\">\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.cityInput\"\n formControlName=\"city\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n </section>\n</form>\n", styles: [".valtimo-widget-management-person-card{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-person-card>form{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-person-card__title-form{background:var(--cds-layer-02);display:flex;gap:16px}.valtimo-widget-management-person-card__title-input{max-width:288px}.valtimo-widget-management-person-card__title-input input{background:var(--cds-layer-01)}.valtimo-widget-management-person-card__person-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:16px;background:var(--cds-layer-02)}.valtimo-widget-management-person-card__field{display:flex;flex-direction:column;gap:4px;min-width:0;padding:8px;background:var(--cds-layer-01)}.valtimo-widget-management-person-card__field .cds--text-input,.valtimo-widget-management-person-card__field .cds--list-box{background:var(--cds-layer-02)}.valtimo-widget-management-person-card__field--full{grid-column:1/-1}\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: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6055
6068
  }
6056
6069
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementPersonCardComponent, decorators: [{
6057
6070
  type: Component,
@@ -6064,7 +6077,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
6064
6077
  MdiIconSelectorComponent,
6065
6078
  ValuePathSelectorComponent,
6066
6079
  LayerModule,
6067
- ], 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<form [formGroup]=\"form\">\n <section\n *ngIf=\"$showTitleInput()\"\n class=\"valtimo-widget-management-person-card__title-form\"\n >\n <cds-text-label class=\"valtimo-widget-management-person-card__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </section>\n\n <div class=\"valtimo-widget-management-person-card__action-button-section\">\n <ng-content></ng-content>\n </div>\n\n <section class=\"valtimo-widget-management-person-card__person-fields\">\n <div\n class=\"valtimo-widget-management-person-card__field valtimo-widget-management-person-card__field--full\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.fullNameLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.fullNameInput\"\n formControlName=\"fullName\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.birthDateLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.birthDateInput\"\n formControlName=\"birthDate\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label [title]=\"'widgetTabManagement.content.person-card.bsnLabel' | translate\">\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.bsnInput\"\n formControlName=\"bsn\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.phoneLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.phoneInput\"\n formControlName=\"phone\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.emailLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.emailInput\"\n formControlName=\"email\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label [title]=\"'widgetTabManagement.content.person-card.cityLabel' | translate\">\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.cityInput\"\n formControlName=\"city\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n </section>\n</form>\n", styles: [".valtimo-widget-management-person-card{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-person-card>form{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-person-card__title-form{padding:8px 0 16px 16px;background:var(--cds-layer);display:flex;gap:16px}.valtimo-widget-management-person-card__title-input{max-width:288px}.valtimo-widget-management-person-card__title-input input{background:var(--cds-layer-02)}.valtimo-widget-management-person-card__person-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:16px;padding:16px;background:var(--cds-layer)}.valtimo-widget-management-person-card__person-fields .cds--text-input,.valtimo-widget-management-person-card__person-fields .cds--list-box{background:var(--cds-layer-02)}.valtimo-widget-management-person-card__field{display:flex;flex-direction:column;gap:4px;min-width:0}.valtimo-widget-management-person-card__field--full{grid-column:1/-1}\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"] }]
6080
+ ], 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<form [formGroup]=\"form\">\n <section\n *ngIf=\"$showTitleInput()\"\n class=\"valtimo-widget-management-person-card__title-form\"\n >\n <cds-text-label class=\"valtimo-widget-management-person-card__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </section>\n\n <div class=\"valtimo-widget-management-person-card__action-button-section\">\n <ng-content></ng-content>\n </div>\n\n <section class=\"valtimo-widget-management-person-card__person-fields\">\n <div\n class=\"valtimo-widget-management-person-card__field valtimo-widget-management-person-card__field--full\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.fullNameLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.fullNameInput\"\n formControlName=\"fullName\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.birthDateLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.birthDateInput\"\n formControlName=\"birthDate\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label [title]=\"'widgetTabManagement.content.person-card.bsnLabel' | translate\">\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.bsnInput\"\n formControlName=\"bsn\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.phoneLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.phoneInput\"\n formControlName=\"phone\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.person-card.emailLabel' | translate\"\n >\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.emailInput\"\n formControlName=\"email\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n\n <div class=\"valtimo-widget-management-person-card__field\">\n <v-input-label [title]=\"'widgetTabManagement.content.person-card.cityLabel' | translate\">\n </v-input-label>\n\n <valtimo-value-path-selector\n *ngIf=\"params$ | async as params\"\n [attr.data-test-id]=\"testIds.cityInput\"\n formControlName=\"city\"\n [caseDefinitionKey]=\"params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n </div>\n </section>\n</form>\n", styles: [".valtimo-widget-management-person-card{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-person-card>form{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-person-card__title-form{background:var(--cds-layer-02);display:flex;gap:16px}.valtimo-widget-management-person-card__title-input{max-width:288px}.valtimo-widget-management-person-card__title-input input{background:var(--cds-layer-01)}.valtimo-widget-management-person-card__person-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px;row-gap:16px;background:var(--cds-layer-02)}.valtimo-widget-management-person-card__field{display:flex;flex-direction:column;gap:4px;min-width:0;padding:8px;background:var(--cds-layer-01)}.valtimo-widget-management-person-card__field .cds--text-input,.valtimo-widget-management-person-card__field .cds--list-box{background:var(--cds-layer-02)}.valtimo-widget-management-person-card__field--full{grid-column:1/-1}\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"] }]
6068
6081
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: WidgetWizardService }, { type: undefined, decorators: [{
6069
6082
  type: Inject,
6070
6083
  args: [WIDGET_MANAGEMENT_SERVICE]
@@ -6149,7 +6162,7 @@ class WidgetManagementMetrolineComponent {
6149
6162
  }));
6150
6163
  }
6151
6164
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementMetrolineComponent, deps: [{ token: i1$3.FormBuilder }, { token: MetrolineWidgetApiService }, { token: i2$2.TranslateService }, { token: WidgetWizardService }], target: i0.ɵɵFactoryTarget.Component }); }
6152
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementMetrolineComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<form\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-metroline__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-metroline__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n</form>\n\n<ng-content></ng-content>\n\n<section\n class=\"valtimo-widget-management-metroline__settings\"\n [formGroup]=\"form\"\n>\n <cds-radio-group\n class=\"valtimo-widget-management-metroline__radio-group\"\n orientation=\"horizontal\"\n formControlName=\"orientation\"\n [attr.data-test-id]=\"testIds.displayTypeRadio\"\n [legend]=\"'widgetTabManagement.content.metroline.displayType.label' | translate\"\n >\n <cds-radio [value]=\"orientationOptions.HORIZONTAL\">\n {{ 'widgetTabManagement.content.metroline.displayType.horizontal' | translate }}\n </cds-radio>\n <cds-radio [value]=\"orientationOptions.VERTICAL\">\n {{ 'widgetTabManagement.content.metroline.displayType.vertical' | translate }}\n </cds-radio>\n </cds-radio-group>\n\n <cds-dropdown\n class=\"valtimo-widget-management-metroline__dropdown\"\n [appendInline]=\"false\"\n [dropUp]=\"false\"\n [attr.data-test-id]=\"testIds.statusSourceDropdown\"\n [label]=\"'widgetTabManagement.content.metroline.statusSource.label' | translate\"\n [placeholder]=\"'widgetTabManagement.content.metroline.statusSource.placeholder' | translate\"\n (selected)=\"onModeSelected($event)\"\n >\n <cds-dropdown-list [items]=\"modeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n</section>\n", styles: [".valtimo-widget-management-metroline{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-metroline__title-form{padding:8px 0 16px 16px;background:var(--cds-layer);display:flex;gap:16px}.valtimo-widget-management-metroline__title-input{max-width:300px}.valtimo-widget-management-metroline__title-input input{background:var(--cds-layer-02)}.valtimo-widget-management-metroline__settings{display:flex;flex-wrap:wrap;align-items:center;gap:24px;padding:16px;background:var(--cds-layer)}.valtimo-widget-management-metroline__settings>*{flex:0 0 auto}.valtimo-widget-management-metroline__dropdown{width:300px}.valtimo-widget-management-metroline__dropdown .cds--list-box{background:var(--cds-layer-02)}\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: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "ngmodule", type: RadioModule }, { kind: "component", type: i3.Radio, selector: "cds-radio, ibm-radio", inputs: ["checked", "name", "disabled", "labelPlacement", "ariaLabelledby", "ariaLabel", "required", "value", "skeleton", "id"], outputs: ["change"] }, { kind: "component", type: i3.RadioGroup, selector: "cds-radio-group, ibm-radio-group", inputs: ["selected", "value", "name", "disabled", "skeleton", "orientation", "labelPlacement", "legend", "ariaLabel", "ariaLabelledby", "helperText", "invalid", "invalidText", "warn", "warnText"], outputs: ["change"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6165
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementMetrolineComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<form\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-metroline__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-metroline__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n</form>\n\n<ng-content></ng-content>\n\n<section\n class=\"valtimo-widget-management-metroline__settings\"\n [formGroup]=\"form\"\n>\n <cds-radio-group\n class=\"valtimo-widget-management-metroline__radio-group\"\n orientation=\"horizontal\"\n formControlName=\"orientation\"\n [attr.data-test-id]=\"testIds.displayTypeRadio\"\n [legend]=\"'widgetTabManagement.content.metroline.displayType.label' | translate\"\n >\n <cds-radio [value]=\"orientationOptions.HORIZONTAL\">\n {{ 'widgetTabManagement.content.metroline.displayType.horizontal' | translate }}\n </cds-radio>\n <cds-radio [value]=\"orientationOptions.VERTICAL\">\n {{ 'widgetTabManagement.content.metroline.displayType.vertical' | translate }}\n </cds-radio>\n </cds-radio-group>\n\n <cds-dropdown\n class=\"valtimo-widget-management-metroline__dropdown\"\n [appendInline]=\"false\"\n [dropUp]=\"false\"\n [attr.data-test-id]=\"testIds.statusSourceDropdown\"\n [label]=\"'widgetTabManagement.content.metroline.statusSource.label' | translate\"\n [placeholder]=\"'widgetTabManagement.content.metroline.statusSource.placeholder' | translate\"\n (selected)=\"onModeSelected($event)\"\n >\n <cds-dropdown-list [items]=\"modeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n</section>\n", styles: [".valtimo-widget-management-metroline{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-metroline__title-form{background:var(--cds-layer-02);display:flex;gap:16px}.valtimo-widget-management-metroline__title-input{max-width:300px}.valtimo-widget-management-metroline__title-input input{background:var(--cds-layer-01)}.valtimo-widget-management-metroline__settings{display:flex;flex-wrap:wrap;align-items:stretch;gap:16px;background:var(--cds-layer-02)}.valtimo-widget-management-metroline__settings>*{flex:0 0 auto}.valtimo-widget-management-metroline__radio-group{padding:8px;background:var(--cds-layer-01)}.valtimo-widget-management-metroline__dropdown{width:300px}.valtimo-widget-management-metroline__dropdown .cds--list-box{background:var(--cds-layer-01)}\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: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "ngmodule", type: RadioModule }, { kind: "component", type: i3.Radio, selector: "cds-radio, ibm-radio", inputs: ["checked", "name", "disabled", "labelPlacement", "ariaLabelledby", "ariaLabel", "required", "value", "skeleton", "id"], outputs: ["change"] }, { kind: "component", type: i3.RadioGroup, selector: "cds-radio-group, ibm-radio-group", inputs: ["selected", "value", "name", "disabled", "skeleton", "orientation", "labelPlacement", "legend", "ariaLabel", "ariaLabelledby", "helperText", "invalid", "invalidText", "warn", "warnText"], outputs: ["change"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6153
6166
  }
6154
6167
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementMetrolineComponent, decorators: [{
6155
6168
  type: Component,
@@ -6163,7 +6176,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
6163
6176
  RadioModule,
6164
6177
  ReactiveFormsModule,
6165
6178
  TranslateModule,
6166
- ], 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<form\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-metroline__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-metroline__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n</form>\n\n<ng-content></ng-content>\n\n<section\n class=\"valtimo-widget-management-metroline__settings\"\n [formGroup]=\"form\"\n>\n <cds-radio-group\n class=\"valtimo-widget-management-metroline__radio-group\"\n orientation=\"horizontal\"\n formControlName=\"orientation\"\n [attr.data-test-id]=\"testIds.displayTypeRadio\"\n [legend]=\"'widgetTabManagement.content.metroline.displayType.label' | translate\"\n >\n <cds-radio [value]=\"orientationOptions.HORIZONTAL\">\n {{ 'widgetTabManagement.content.metroline.displayType.horizontal' | translate }}\n </cds-radio>\n <cds-radio [value]=\"orientationOptions.VERTICAL\">\n {{ 'widgetTabManagement.content.metroline.displayType.vertical' | translate }}\n </cds-radio>\n </cds-radio-group>\n\n <cds-dropdown\n class=\"valtimo-widget-management-metroline__dropdown\"\n [appendInline]=\"false\"\n [dropUp]=\"false\"\n [attr.data-test-id]=\"testIds.statusSourceDropdown\"\n [label]=\"'widgetTabManagement.content.metroline.statusSource.label' | translate\"\n [placeholder]=\"'widgetTabManagement.content.metroline.statusSource.placeholder' | translate\"\n (selected)=\"onModeSelected($event)\"\n >\n <cds-dropdown-list [items]=\"modeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n</section>\n", styles: [".valtimo-widget-management-metroline{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-metroline__title-form{padding:8px 0 16px 16px;background:var(--cds-layer);display:flex;gap:16px}.valtimo-widget-management-metroline__title-input{max-width:300px}.valtimo-widget-management-metroline__title-input input{background:var(--cds-layer-02)}.valtimo-widget-management-metroline__settings{display:flex;flex-wrap:wrap;align-items:center;gap:24px;padding:16px;background:var(--cds-layer)}.valtimo-widget-management-metroline__settings>*{flex:0 0 auto}.valtimo-widget-management-metroline__dropdown{width:300px}.valtimo-widget-management-metroline__dropdown .cds--list-box{background:var(--cds-layer-02)}\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"] }]
6179
+ ], 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<form\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-metroline__title-form\"\n>\n <cds-text-label class=\"valtimo-widget-management-metroline__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [attr.data-test-id]=\"testIds.widgetTitleInput\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n</form>\n\n<ng-content></ng-content>\n\n<section\n class=\"valtimo-widget-management-metroline__settings\"\n [formGroup]=\"form\"\n>\n <cds-radio-group\n class=\"valtimo-widget-management-metroline__radio-group\"\n orientation=\"horizontal\"\n formControlName=\"orientation\"\n [attr.data-test-id]=\"testIds.displayTypeRadio\"\n [legend]=\"'widgetTabManagement.content.metroline.displayType.label' | translate\"\n >\n <cds-radio [value]=\"orientationOptions.HORIZONTAL\">\n {{ 'widgetTabManagement.content.metroline.displayType.horizontal' | translate }}\n </cds-radio>\n <cds-radio [value]=\"orientationOptions.VERTICAL\">\n {{ 'widgetTabManagement.content.metroline.displayType.vertical' | translate }}\n </cds-radio>\n </cds-radio-group>\n\n <cds-dropdown\n class=\"valtimo-widget-management-metroline__dropdown\"\n [appendInline]=\"false\"\n [dropUp]=\"false\"\n [attr.data-test-id]=\"testIds.statusSourceDropdown\"\n [label]=\"'widgetTabManagement.content.metroline.statusSource.label' | translate\"\n [placeholder]=\"'widgetTabManagement.content.metroline.statusSource.placeholder' | translate\"\n (selected)=\"onModeSelected($event)\"\n >\n <cds-dropdown-list [items]=\"modeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n</section>\n", styles: [".valtimo-widget-management-metroline{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-metroline__title-form{background:var(--cds-layer-02);display:flex;gap:16px}.valtimo-widget-management-metroline__title-input{max-width:300px}.valtimo-widget-management-metroline__title-input input{background:var(--cds-layer-01)}.valtimo-widget-management-metroline__settings{display:flex;flex-wrap:wrap;align-items:stretch;gap:16px;background:var(--cds-layer-02)}.valtimo-widget-management-metroline__settings>*{flex:0 0 auto}.valtimo-widget-management-metroline__radio-group{padding:8px;background:var(--cds-layer-01)}.valtimo-widget-management-metroline__dropdown{width:300px}.valtimo-widget-management-metroline__dropdown .cds--list-box{background:var(--cds-layer-01)}\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"] }]
6167
6180
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: MetrolineWidgetApiService }, { type: i2$2.TranslateService }, { type: WidgetWizardService }], propDecorators: { class: [{
6168
6181
  type: HostBinding,
6169
6182
  args: ['class']
@@ -6252,7 +6265,7 @@ class WidgetManagementHighlightComponent {
6252
6265
  this.widgetWizardService.$widgetContentValid.set(this.form.valid);
6253
6266
  }
6254
6267
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementHighlightComponent, deps: [{ token: i1$3.FormBuilder }, { token: WidgetWizardService }, { token: i2$2.TranslateService }, { token: i1$1.CdsThemeService }, { token: WIDGET_MANAGEMENT_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
6255
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementHighlightComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<form\n *ngIf=\"{params: params$ | async} as data\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-highlight__form\"\n>\n <section class=\"valtimo-widget-management-highlight__panel\">\n <div class=\"valtimo-widget-management-highlight__identity-row\">\n <cds-text-label class=\"valtimo-widget-management-highlight__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n ></v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n type=\"text\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n </section>\n\n <ng-content></ng-content>\n\n <section class=\"valtimo-widget-management-highlight__panel\">\n <div class=\"valtimo-widget-management-highlight__row\">\n <div\n class=\"valtimo-widget-management-highlight__row-item valtimo-widget-management-highlight__value\"\n >\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"value\"\n [label]=\"'widgetTabManagement.content.highlight.value' | translate\"\n [caseDefinitionKey]=\"data.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"data.params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n } @else {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.highlight.value' | translate\"\n ></v-input-label>\n\n <input\n formControlName=\"value\"\n cdsText\n type=\"text\"\n [placeholder]=\"'widgetTabManagement.content.highlight.valuePlaceholder' | translate\"\n />\n </cds-text-label>\n }\n\n <span class=\"valtimo-widget-management-highlight__helper\">\n {{ 'widgetTabManagement.content.highlight.valueHelper' | translate }}\n </span>\n </div>\n\n <cds-dropdown\n class=\"valtimo-widget-management-highlight__row-item\"\n [label]=\"'widgetTabManagement.content.highlight.accentColor' | translate\"\n (selected)=\"onColorSelected($event)\"\n [dropUp]=\"false\"\n >\n <cds-dropdown-list\n [items]=\"$colorItems()\"\n [listTpl]=\"colorDropdownItemTemplate\"\n ></cds-dropdown-list>\n </cds-dropdown>\n </div>\n </section>\n</form>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n <ng-container *ngIf=\"item && item.content\">\n <cds-tag\n *ngIf=\"item.tagType; else customColorTag\"\n class=\"cds-tag--no-margin\"\n [type]=\"item.tagType\"\n >\n {{ item.content }}\n </cds-tag>\n <ng-template #customColorTag>\n <cds-tag\n class=\"cds-tag--no-margin valtimo-widget-management-highlight__color-tag\"\n [style.--widget-color-tag-bg]=\"item.tagBackground\"\n [style.--widget-color-tag-fg]=\"item.tagText\"\n >\n {{ item.content }}\n </cds-tag>\n </ng-template>\n </ng-container>\n</ng-template>\n", styles: [".valtimo-widget-management-highlight__form{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-highlight__panel{display:flex;flex-direction:column;gap:12px;padding:16px;background:var(--cds-layer)}.valtimo-widget-management-highlight__identity-row{display:flex;gap:16px;align-items:flex-end}.valtimo-widget-management-highlight__title-input{max-width:288px;flex:1 1 auto}.valtimo-widget-management-highlight__title-input input{background:var(--cds-layer-02)}.valtimo-widget-management-highlight__row{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.valtimo-widget-management-highlight__row-item{width:100%}.valtimo-widget-management-highlight__row-item .cds--list-box,.valtimo-widget-management-highlight__row-item .cds--text-input,.valtimo-widget-management-highlight__row-item input.cds--text-input{background:var(--cds-layer-02)}.valtimo-widget-management-highlight__value{display:flex;flex-direction:column}.valtimo-widget-management-highlight__helper{margin-top:4px;font-size:12px;color:var(--cds-text-helper)}.valtimo-widget-management-highlight__color-tag.cds--tag{background-color:var(--widget-color-tag-bg, var(--cds-layer-02));color:var(--widget-color-tag-fg, var(--cds-text-primary));border:none}\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: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: IconModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6268
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: WidgetManagementHighlightComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<form\n *ngIf=\"{params: params$ | async} as data\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-highlight__form\"\n>\n <section class=\"valtimo-widget-management-highlight__panel\">\n <div class=\"valtimo-widget-management-highlight__identity-row\">\n <cds-text-label class=\"valtimo-widget-management-highlight__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n ></v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n type=\"text\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n </section>\n\n <ng-content></ng-content>\n\n <section class=\"valtimo-widget-management-highlight__panel\">\n <div class=\"valtimo-widget-management-highlight__row\">\n <div\n class=\"valtimo-widget-management-highlight__row-item valtimo-widget-management-highlight__value\"\n >\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"value\"\n [label]=\"'widgetTabManagement.content.highlight.value' | translate\"\n [caseDefinitionKey]=\"data.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"data.params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n } @else {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.highlight.value' | translate\"\n ></v-input-label>\n\n <input\n formControlName=\"value\"\n cdsText\n type=\"text\"\n [placeholder]=\"'widgetTabManagement.content.highlight.valuePlaceholder' | translate\"\n />\n </cds-text-label>\n }\n\n <span class=\"valtimo-widget-management-highlight__helper\">\n {{ 'widgetTabManagement.content.highlight.valueHelper' | translate }}\n </span>\n </div>\n\n <cds-dropdown\n class=\"valtimo-widget-management-highlight__row-item\"\n [label]=\"'widgetTabManagement.content.highlight.accentColor' | translate\"\n (selected)=\"onColorSelected($event)\"\n [dropUp]=\"false\"\n >\n <cds-dropdown-list\n [items]=\"$colorItems()\"\n [listTpl]=\"colorDropdownItemTemplate\"\n ></cds-dropdown-list>\n </cds-dropdown>\n </div>\n </section>\n</form>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n <ng-container *ngIf=\"item && item.content\">\n <cds-tag\n *ngIf=\"item.tagType; else customColorTag\"\n class=\"cds-tag--no-margin\"\n [type]=\"item.tagType\"\n >\n {{ item.content }}\n </cds-tag>\n <ng-template #customColorTag>\n <cds-tag\n class=\"cds-tag--no-margin valtimo-widget-management-highlight__color-tag\"\n [style.--widget-color-tag-bg]=\"item.tagBackground\"\n [style.--widget-color-tag-fg]=\"item.tagText\"\n >\n {{ item.content }}\n </cds-tag>\n </ng-template>\n </ng-container>\n</ng-template>\n", styles: [".valtimo-widget-management-highlight__form{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-highlight__panel{display:flex;flex-direction:column;gap:12px;background:var(--cds-layer-02)}.valtimo-widget-management-highlight__identity-row{display:flex;gap:16px;align-items:flex-end}.valtimo-widget-management-highlight__title-input{max-width:288px;flex:1 1 auto}.valtimo-widget-management-highlight__title-input input{background:var(--cds-layer-01)}.valtimo-widget-management-highlight__row{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.valtimo-widget-management-highlight__row-item{width:100%}.valtimo-widget-management-highlight__row-item .cds--list-box,.valtimo-widget-management-highlight__row-item .cds--text-input,.valtimo-widget-management-highlight__row-item input.cds--text-input{background:var(--cds-layer-01)}.valtimo-widget-management-highlight__value{display:flex;flex-direction:column;padding:8px;background:var(--cds-layer-01)}.valtimo-widget-management-highlight__value .cds--list-box,.valtimo-widget-management-highlight__value .cds--text-input,.valtimo-widget-management-highlight__value input.cds--text-input{background:var(--cds-layer-02)}.valtimo-widget-management-highlight__helper{margin-top:8px;font-size:12px;color:var(--cds-text-helper)}.valtimo-widget-management-highlight__color-tag.cds--tag{background-color:var(--widget-color-tag-bg, var(--cds-layer-02));color:var(--widget-color-tag-fg, var(--cds-text-primary));border:none}\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: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: IconModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6256
6269
  }
6257
6270
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementHighlightComponent, decorators: [{
6258
6271
  type: Component,
@@ -6269,7 +6282,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
6269
6282
  TagModule,
6270
6283
  MdiIconSelectorComponent,
6271
6284
  ValuePathSelectorComponent,
6272
- ], 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<form\n *ngIf=\"{params: params$ | async} as data\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-highlight__form\"\n>\n <section class=\"valtimo-widget-management-highlight__panel\">\n <div class=\"valtimo-widget-management-highlight__identity-row\">\n <cds-text-label class=\"valtimo-widget-management-highlight__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n ></v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n type=\"text\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n </section>\n\n <ng-content></ng-content>\n\n <section class=\"valtimo-widget-management-highlight__panel\">\n <div class=\"valtimo-widget-management-highlight__row\">\n <div\n class=\"valtimo-widget-management-highlight__row-item valtimo-widget-management-highlight__value\"\n >\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"value\"\n [label]=\"'widgetTabManagement.content.highlight.value' | translate\"\n [caseDefinitionKey]=\"data.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"data.params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n } @else {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.highlight.value' | translate\"\n ></v-input-label>\n\n <input\n formControlName=\"value\"\n cdsText\n type=\"text\"\n [placeholder]=\"'widgetTabManagement.content.highlight.valuePlaceholder' | translate\"\n />\n </cds-text-label>\n }\n\n <span class=\"valtimo-widget-management-highlight__helper\">\n {{ 'widgetTabManagement.content.highlight.valueHelper' | translate }}\n </span>\n </div>\n\n <cds-dropdown\n class=\"valtimo-widget-management-highlight__row-item\"\n [label]=\"'widgetTabManagement.content.highlight.accentColor' | translate\"\n (selected)=\"onColorSelected($event)\"\n [dropUp]=\"false\"\n >\n <cds-dropdown-list\n [items]=\"$colorItems()\"\n [listTpl]=\"colorDropdownItemTemplate\"\n ></cds-dropdown-list>\n </cds-dropdown>\n </div>\n </section>\n</form>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n <ng-container *ngIf=\"item && item.content\">\n <cds-tag\n *ngIf=\"item.tagType; else customColorTag\"\n class=\"cds-tag--no-margin\"\n [type]=\"item.tagType\"\n >\n {{ item.content }}\n </cds-tag>\n <ng-template #customColorTag>\n <cds-tag\n class=\"cds-tag--no-margin valtimo-widget-management-highlight__color-tag\"\n [style.--widget-color-tag-bg]=\"item.tagBackground\"\n [style.--widget-color-tag-fg]=\"item.tagText\"\n >\n {{ item.content }}\n </cds-tag>\n </ng-template>\n </ng-container>\n</ng-template>\n", styles: [".valtimo-widget-management-highlight__form{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-highlight__panel{display:flex;flex-direction:column;gap:12px;padding:16px;background:var(--cds-layer)}.valtimo-widget-management-highlight__identity-row{display:flex;gap:16px;align-items:flex-end}.valtimo-widget-management-highlight__title-input{max-width:288px;flex:1 1 auto}.valtimo-widget-management-highlight__title-input input{background:var(--cds-layer-02)}.valtimo-widget-management-highlight__row{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.valtimo-widget-management-highlight__row-item{width:100%}.valtimo-widget-management-highlight__row-item .cds--list-box,.valtimo-widget-management-highlight__row-item .cds--text-input,.valtimo-widget-management-highlight__row-item input.cds--text-input{background:var(--cds-layer-02)}.valtimo-widget-management-highlight__value{display:flex;flex-direction:column}.valtimo-widget-management-highlight__helper{margin-top:4px;font-size:12px;color:var(--cds-text-helper)}.valtimo-widget-management-highlight__color-tag.cds--tag{background-color:var(--widget-color-tag-bg, var(--cds-layer-02));color:var(--widget-color-tag-fg, var(--cds-text-primary));border:none}\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"] }]
6285
+ ], 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<form\n *ngIf=\"{params: params$ | async} as data\"\n [formGroup]=\"form\"\n class=\"valtimo-widget-management-highlight__form\"\n>\n <section class=\"valtimo-widget-management-highlight__panel\">\n <div class=\"valtimo-widget-management-highlight__identity-row\">\n <cds-text-label class=\"valtimo-widget-management-highlight__title-input\">\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n ></v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n type=\"text\"\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"1\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n </section>\n\n <ng-content></ng-content>\n\n <section class=\"valtimo-widget-management-highlight__panel\">\n <div class=\"valtimo-widget-management-highlight__row\">\n <div\n class=\"valtimo-widget-management-highlight__row-item valtimo-widget-management-highlight__value\"\n >\n @if ($widgetContext() === 'case') {\n <valtimo-value-path-selector\n formControlName=\"value\"\n [label]=\"'widgetTabManagement.content.highlight.value' | translate\"\n [caseDefinitionKey]=\"data.params?.caseDefinitionKey\"\n [caseDefinitionVersionTag]=\"data.params?.caseDefinitionVersionTag\"\n ></valtimo-value-path-selector>\n } @else {\n <cds-text-label>\n <v-input-label\n [title]=\"'widgetTabManagement.content.highlight.value' | translate\"\n ></v-input-label>\n\n <input\n formControlName=\"value\"\n cdsText\n type=\"text\"\n [placeholder]=\"'widgetTabManagement.content.highlight.valuePlaceholder' | translate\"\n />\n </cds-text-label>\n }\n\n <span class=\"valtimo-widget-management-highlight__helper\">\n {{ 'widgetTabManagement.content.highlight.valueHelper' | translate }}\n </span>\n </div>\n\n <cds-dropdown\n class=\"valtimo-widget-management-highlight__row-item\"\n [label]=\"'widgetTabManagement.content.highlight.accentColor' | translate\"\n (selected)=\"onColorSelected($event)\"\n [dropUp]=\"false\"\n >\n <cds-dropdown-list\n [items]=\"$colorItems()\"\n [listTpl]=\"colorDropdownItemTemplate\"\n ></cds-dropdown-list>\n </cds-dropdown>\n </div>\n </section>\n</form>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n <ng-container *ngIf=\"item && item.content\">\n <cds-tag\n *ngIf=\"item.tagType; else customColorTag\"\n class=\"cds-tag--no-margin\"\n [type]=\"item.tagType\"\n >\n {{ item.content }}\n </cds-tag>\n <ng-template #customColorTag>\n <cds-tag\n class=\"cds-tag--no-margin valtimo-widget-management-highlight__color-tag\"\n [style.--widget-color-tag-bg]=\"item.tagBackground\"\n [style.--widget-color-tag-fg]=\"item.tagText\"\n >\n {{ item.content }}\n </cds-tag>\n </ng-template>\n </ng-container>\n</ng-template>\n", styles: [".valtimo-widget-management-highlight__form{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-highlight__panel{display:flex;flex-direction:column;gap:12px;background:var(--cds-layer-02)}.valtimo-widget-management-highlight__identity-row{display:flex;gap:16px;align-items:flex-end}.valtimo-widget-management-highlight__title-input{max-width:288px;flex:1 1 auto}.valtimo-widget-management-highlight__title-input input{background:var(--cds-layer-01)}.valtimo-widget-management-highlight__row{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.valtimo-widget-management-highlight__row-item{width:100%}.valtimo-widget-management-highlight__row-item .cds--list-box,.valtimo-widget-management-highlight__row-item .cds--text-input,.valtimo-widget-management-highlight__row-item input.cds--text-input{background:var(--cds-layer-01)}.valtimo-widget-management-highlight__value{display:flex;flex-direction:column;padding:8px;background:var(--cds-layer-01)}.valtimo-widget-management-highlight__value .cds--list-box,.valtimo-widget-management-highlight__value .cds--text-input,.valtimo-widget-management-highlight__value input.cds--text-input{background:var(--cds-layer-02)}.valtimo-widget-management-highlight__helper{margin-top:8px;font-size:12px;color:var(--cds-text-helper)}.valtimo-widget-management-highlight__color-tag.cds--tag{background-color:var(--widget-color-tag-bg, var(--cds-layer-02));color:var(--widget-color-tag-fg, var(--cds-text-primary));border:none}\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"] }]
6273
6286
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: WidgetWizardService }, { type: i2$2.TranslateService }, { type: i1$1.CdsThemeService }, { type: undefined, decorators: [{
6274
6287
  type: Inject,
6275
6288
  args: [WIDGET_MANAGEMENT_SERVICE]
@@ -6381,7 +6394,7 @@ class WidgetManagementInteractiveTableComponent {
6381
6394
  }));
6382
6395
  }
6383
6396
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementInteractiveTableComponent, deps: [{ token: i1$3.FormBuilder }, { token: WidgetWizardService }], target: i0.ɵɵFactoryTarget.Component }); }
6384
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementInteractiveTableComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<valtimo-widget-management-table [showFirstColumnOption]=\"false\" [sortableColumns]=\"true\">\n <ng-content></ng-content>\n\n <form [formGroup]=\"formGroup\" class=\"valtimo-widget-management-interactive-table__form\">\n <cds-checkbox formControlName=\"canStartCase\">\n {{ 'ikoManagement.canStartCase' | translate }}\n </cds-checkbox>\n\n <cds-text-label class=\"valtimo-widget-management-interactive-table__row-action\">\n {{ 'ikoManagement.rowAction' | translate }}\n\n <input\n formControlName=\"rowClickAction\"\n cdsText\n cdsLayer=\"1\"\n [placeholder]=\"'ikoManagement.rowAction' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"actions\"\n [addRowText]=\"'Add external link' | translate\"\n [keyColumnTitle]=\"'interface.name' | translate\"\n [minimumAmountOfRows]=\"0\"\n [valueColumnTitle]=\"'interface.url' | translate\"\n ></valtimo-carbon-multi-input>\n </form>\n</valtimo-widget-management-table>\n", styles: [".valtimo-widget-management-interactive-table__form,.valtimo-widget-management-interactive-table__form>div{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-interactive-table__external-links-row{display:grid;grid-template-columns:1fr 1fr 56px;gap:16px;align-items:self-end;padding:12px 16px 16px}.valtimo-widget-management-interactive-table valtimo-key-value{width:100%!important}.valtimo-widget-management-interactive-table .v-multi-input__row{padding:12px 16px 16px}.valtimo-widget-management-interactive-table__row-action{padding:16px;background-color:var(--cds-layer-01)}.valtimo-widget-management-interactive-table .v-multi-input__row{padding:12px 16px 16px;background-color:var(--cds-layer-01)}.valtimo-widget-management-interactive-table .cds--text-input,.valtimo-widget-management-interactive-table .cds--list-box{background:var(--cds-layer-02)}\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: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: WidgetManagementTableComponent, selector: "valtimo-widget-management-table", inputs: ["showFirstColumnOption", "sortableColumns"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i3.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: IconModule }, { kind: "ngmodule", type: CarbonMultiInputModule }, { kind: "component", type: i1$1.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: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6397
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementInteractiveTableComponent, isStandalone: true, selector: "ng-component", host: { properties: { "class": "this.class" } }, 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<valtimo-widget-management-table [showFirstColumnOption]=\"false\" [sortableColumns]=\"true\">\n <ng-content></ng-content>\n\n <form [formGroup]=\"formGroup\" class=\"valtimo-widget-management-interactive-table__form\">\n <cds-checkbox formControlName=\"canStartCase\">\n {{ 'ikoManagement.canStartCase' | translate }}\n </cds-checkbox>\n\n <cds-text-label class=\"valtimo-widget-management-interactive-table__row-action\">\n {{ 'ikoManagement.rowAction' | translate }}\n\n <input\n formControlName=\"rowClickAction\"\n cdsText\n cdsLayer=\"1\"\n [placeholder]=\"'ikoManagement.rowAction' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"actions\"\n [addRowText]=\"'Add external link' | translate\"\n [keyColumnTitle]=\"'interface.name' | translate\"\n [minimumAmountOfRows]=\"0\"\n [valueColumnTitle]=\"'interface.url' | translate\"\n ></valtimo-carbon-multi-input>\n </form>\n</valtimo-widget-management-table>\n", styles: [".valtimo-widget-management-interactive-table__form,.valtimo-widget-management-interactive-table__form>div{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-interactive-table__external-links-row{display:grid;grid-template-columns:1fr 1fr 56px;gap:16px;align-items:self-end;padding:12px 16px 16px}.valtimo-widget-management-interactive-table valtimo-key-value{width:100%!important}.valtimo-widget-management-interactive-table .v-multi-input__row{padding:12px 16px 16px}.valtimo-widget-management-interactive-table__row-action{padding:16px;background-color:var(--cds-layer-02)}.valtimo-widget-management-interactive-table .v-multi-input__row{padding:12px 16px 16px;background-color:var(--cds-layer-02)}.valtimo-widget-management-interactive-table .cds--text-input,.valtimo-widget-management-interactive-table .cds--list-box{background:var(--cds-layer-01)}\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: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: WidgetManagementTableComponent, selector: "valtimo-widget-management-table", inputs: ["showFirstColumnOption", "sortableColumns"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i3.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: IconModule }, { kind: "ngmodule", type: CarbonMultiInputModule }, { kind: "component", type: i1$1.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: "ngmodule", type: InputModule }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
6385
6398
  }
6386
6399
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementInteractiveTableComponent, decorators: [{
6387
6400
  type: Component,
@@ -6396,7 +6409,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
6396
6409
  CarbonMultiInputModule,
6397
6410
  InputModule,
6398
6411
  LayerModule,
6399
- ], 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<valtimo-widget-management-table [showFirstColumnOption]=\"false\" [sortableColumns]=\"true\">\n <ng-content></ng-content>\n\n <form [formGroup]=\"formGroup\" class=\"valtimo-widget-management-interactive-table__form\">\n <cds-checkbox formControlName=\"canStartCase\">\n {{ 'ikoManagement.canStartCase' | translate }}\n </cds-checkbox>\n\n <cds-text-label class=\"valtimo-widget-management-interactive-table__row-action\">\n {{ 'ikoManagement.rowAction' | translate }}\n\n <input\n formControlName=\"rowClickAction\"\n cdsText\n cdsLayer=\"1\"\n [placeholder]=\"'ikoManagement.rowAction' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"actions\"\n [addRowText]=\"'Add external link' | translate\"\n [keyColumnTitle]=\"'interface.name' | translate\"\n [minimumAmountOfRows]=\"0\"\n [valueColumnTitle]=\"'interface.url' | translate\"\n ></valtimo-carbon-multi-input>\n </form>\n</valtimo-widget-management-table>\n", styles: [".valtimo-widget-management-interactive-table__form,.valtimo-widget-management-interactive-table__form>div{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-interactive-table__external-links-row{display:grid;grid-template-columns:1fr 1fr 56px;gap:16px;align-items:self-end;padding:12px 16px 16px}.valtimo-widget-management-interactive-table valtimo-key-value{width:100%!important}.valtimo-widget-management-interactive-table .v-multi-input__row{padding:12px 16px 16px}.valtimo-widget-management-interactive-table__row-action{padding:16px;background-color:var(--cds-layer-01)}.valtimo-widget-management-interactive-table .v-multi-input__row{padding:12px 16px 16px;background-color:var(--cds-layer-01)}.valtimo-widget-management-interactive-table .cds--text-input,.valtimo-widget-management-interactive-table .cds--list-box{background:var(--cds-layer-02)}\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"] }]
6412
+ ], 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<valtimo-widget-management-table [showFirstColumnOption]=\"false\" [sortableColumns]=\"true\">\n <ng-content></ng-content>\n\n <form [formGroup]=\"formGroup\" class=\"valtimo-widget-management-interactive-table__form\">\n <cds-checkbox formControlName=\"canStartCase\">\n {{ 'ikoManagement.canStartCase' | translate }}\n </cds-checkbox>\n\n <cds-text-label class=\"valtimo-widget-management-interactive-table__row-action\">\n {{ 'ikoManagement.rowAction' | translate }}\n\n <input\n formControlName=\"rowClickAction\"\n cdsText\n cdsLayer=\"1\"\n [placeholder]=\"'ikoManagement.rowAction' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"actions\"\n [addRowText]=\"'Add external link' | translate\"\n [keyColumnTitle]=\"'interface.name' | translate\"\n [minimumAmountOfRows]=\"0\"\n [valueColumnTitle]=\"'interface.url' | translate\"\n ></valtimo-carbon-multi-input>\n </form>\n</valtimo-widget-management-table>\n", styles: [".valtimo-widget-management-interactive-table__form,.valtimo-widget-management-interactive-table__form>div{display:flex;flex-direction:column;gap:16px}.valtimo-widget-management-interactive-table__external-links-row{display:grid;grid-template-columns:1fr 1fr 56px;gap:16px;align-items:self-end;padding:12px 16px 16px}.valtimo-widget-management-interactive-table valtimo-key-value{width:100%!important}.valtimo-widget-management-interactive-table .v-multi-input__row{padding:12px 16px 16px}.valtimo-widget-management-interactive-table__row-action{padding:16px;background-color:var(--cds-layer-02)}.valtimo-widget-management-interactive-table .v-multi-input__row{padding:12px 16px 16px;background-color:var(--cds-layer-02)}.valtimo-widget-management-interactive-table .cds--text-input,.valtimo-widget-management-interactive-table .cds--list-box{background:var(--cds-layer-01)}\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"] }]
6400
6413
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: WidgetWizardService }], propDecorators: { class: [{
6401
6414
  type: HostBinding,
6402
6415
  args: ['class']
@@ -6495,7 +6508,7 @@ class WidgetManagementWidgetFormioComponent {
6495
6508
  this.widgetWizardService.$widgetContentValid.set(true);
6496
6509
  }
6497
6510
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementWidgetFormioComponent, deps: [{ token: i1$1.CdsThemeService }, { token: i1$3.FormBuilder }, { token: WidgetWizardService }, { token: i1$2.FormService }, { token: WIDGET_MANAGEMENT_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
6498
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementWidgetFormioComponent, isStandalone: true, selector: "ng-component", 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<form\n class=\"valtimo-case-management-widget-formio\"\n [formGroup]=\"form\"\n [attr.data-carbon-theme]=\"theme$ | async\"\n>\n <div class=\"valtimo-case-management-widget-formio__title-container\">\n <cds-text-label\n class=\"valtimo-case-management-widget-field__input valtimo-case-management-widget-formio__title-input\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"0\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n\n <ng-content></ng-content>\n\n <cds-label class=\"dropdown-label\">\n {{ 'widgetTabManagement.content.formio.selectForm' | translate }}\n\n <cds-dropdown\n *ngIf=\"formListItems$ | async as formListItems\"\n [appendInline]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.formio.placeholder' | translate\"\n [disabled]=\"formListItems.length === 0\"\n [dropUp]=\"false\"\n (selected)=\"componentDropDownChange($event)\"\n >\n <cds-dropdown-list [items]=\"formListItems\"> </cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n</form>\n", styles: [".valtimo-case-management-widget-formio{display:flex;flex-direction:column;gap:16px;padding:16px}.valtimo-case-management-widget-formio__title-container{display:flex;gap:16px}.valtimo-case-management-widget-formio__title-input{max-width:300px}.valtimo-case-management-widget-formio ::ng-deep>*{padding:16px;background:var(--cds-layer-02)}.valtimo-case-management-widget-formio ::ng-deep .cds--list-box,.valtimo-case-management-widget-formio ::ng-deep .cds--text-input{background:var(--cds-layer)}.valtimo-case-management-widget-formio ::ng-deep .dropdown-label label{display:flex;flex-direction:column;width:100%}.valtimo-case-management-widget-formio ::ng-deep .dropdown-label cds-dropdown{margin-top:8px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SelectModule$1 }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
6511
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: WidgetManagementWidgetFormioComponent, isStandalone: true, selector: "ng-component", 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<form\n class=\"valtimo-case-management-widget-formio\"\n [formGroup]=\"form\"\n [attr.data-carbon-theme]=\"theme$ | async\"\n>\n <div class=\"valtimo-case-management-widget-formio__title-container\">\n <cds-text-label\n class=\"valtimo-case-management-widget-field__input valtimo-case-management-widget-formio__title-input\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"0\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n\n <ng-content></ng-content>\n\n <cds-label class=\"dropdown-label\">\n {{ 'widgetTabManagement.content.formio.selectForm' | translate }}\n\n <cds-dropdown\n *ngIf=\"formListItems$ | async as formListItems\"\n [appendInline]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.formio.placeholder' | translate\"\n [disabled]=\"formListItems.length === 0\"\n [dropUp]=\"false\"\n (selected)=\"componentDropDownChange($event)\"\n >\n <cds-dropdown-list [items]=\"formListItems\"> </cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n</form>\n", styles: [".valtimo-case-management-widget-formio{display:flex;flex-direction:column;gap:16px}.valtimo-case-management-widget-formio__title-container{display:flex;gap:16px}.valtimo-case-management-widget-formio__title-input{max-width:300px}.valtimo-case-management-widget-formio ::ng-deep .cds--text-input,.valtimo-case-management-widget-formio ::ng-deep .cds--list-box,.valtimo-case-management-widget-formio ::ng-deep .cds--list-box__field,.valtimo-case-management-widget-formio ::ng-deep .cds--dropdown{background-color:var(--cds-layer-02)}.valtimo-case-management-widget-formio ::ng-deep .dropdown-label label{display:flex;flex-direction:column;width:100%}.valtimo-case-management-widget-formio ::ng-deep .dropdown-label cds-dropdown{margin-top:8px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "component", type: i3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: SelectModule$1 }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i7.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: i7.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i1$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: MdiIconSelectorComponent, selector: "valtimo-mdi-icon-selector", inputs: ["labelTranslationKey", "tooltipTranslationKey", "placeholderTranslationKey", "appendInline", "dropUp"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
6499
6512
  }
6500
6513
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: WidgetManagementWidgetFormioComponent, decorators: [{
6501
6514
  type: Component,
@@ -6509,7 +6522,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
6509
6522
  InputLabelModule,
6510
6523
  MdiIconSelectorComponent,
6511
6524
  LayerModule,
6512
- ], 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<form\n class=\"valtimo-case-management-widget-formio\"\n [formGroup]=\"form\"\n [attr.data-carbon-theme]=\"theme$ | async\"\n>\n <div class=\"valtimo-case-management-widget-formio__title-container\">\n <cds-text-label\n class=\"valtimo-case-management-widget-field__input valtimo-case-management-widget-formio__title-input\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"0\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n\n <ng-content></ng-content>\n\n <cds-label class=\"dropdown-label\">\n {{ 'widgetTabManagement.content.formio.selectForm' | translate }}\n\n <cds-dropdown\n *ngIf=\"formListItems$ | async as formListItems\"\n [appendInline]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.formio.placeholder' | translate\"\n [disabled]=\"formListItems.length === 0\"\n [dropUp]=\"false\"\n (selected)=\"componentDropDownChange($event)\"\n >\n <cds-dropdown-list [items]=\"formListItems\"> </cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n</form>\n", styles: [".valtimo-case-management-widget-formio{display:flex;flex-direction:column;gap:16px;padding:16px}.valtimo-case-management-widget-formio__title-container{display:flex;gap:16px}.valtimo-case-management-widget-formio__title-input{max-width:300px}.valtimo-case-management-widget-formio ::ng-deep>*{padding:16px;background:var(--cds-layer-02)}.valtimo-case-management-widget-formio ::ng-deep .cds--list-box,.valtimo-case-management-widget-formio ::ng-deep .cds--text-input{background:var(--cds-layer)}.valtimo-case-management-widget-formio ::ng-deep .dropdown-label label{display:flex;flex-direction:column;width:100%}.valtimo-case-management-widget-formio ::ng-deep .dropdown-label cds-dropdown{margin-top:8px}\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"] }]
6525
+ ], 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<form\n class=\"valtimo-case-management-widget-formio\"\n [formGroup]=\"form\"\n [attr.data-carbon-theme]=\"theme$ | async\"\n>\n <div class=\"valtimo-case-management-widget-formio__title-container\">\n <cds-text-label\n class=\"valtimo-case-management-widget-field__input valtimo-case-management-widget-formio__title-input\"\n >\n <v-input-label\n [title]=\"'widgetTabManagement.content.widgetTitle' | translate\"\n [tooltip]=\"'widgetTabManagement.content.widgetTitleTooltip' | translate\"\n >\n </v-input-label>\n\n <input\n formControlName=\"widgetTitle\"\n cdsText\n [placeholder]=\"'widgetTabManagement.content.widgetTitlePlaceholder' | translate\"\n type=\"text\"\n />\n </cds-text-label>\n\n <valtimo-mdi-icon-selector\n [cdsLayer]=\"0\"\n formControlName=\"widgetIcon\"\n ></valtimo-mdi-icon-selector>\n </div>\n\n <ng-content></ng-content>\n\n <cds-label class=\"dropdown-label\">\n {{ 'widgetTabManagement.content.formio.selectForm' | translate }}\n\n <cds-dropdown\n *ngIf=\"formListItems$ | async as formListItems\"\n [appendInline]=\"false\"\n [placeholder]=\"'widgetTabManagement.content.formio.placeholder' | translate\"\n [disabled]=\"formListItems.length === 0\"\n [dropUp]=\"false\"\n (selected)=\"componentDropDownChange($event)\"\n >\n <cds-dropdown-list [items]=\"formListItems\"> </cds-dropdown-list>\n </cds-dropdown>\n </cds-label>\n</form>\n", styles: [".valtimo-case-management-widget-formio{display:flex;flex-direction:column;gap:16px}.valtimo-case-management-widget-formio__title-container{display:flex;gap:16px}.valtimo-case-management-widget-formio__title-input{max-width:300px}.valtimo-case-management-widget-formio ::ng-deep .cds--text-input,.valtimo-case-management-widget-formio ::ng-deep .cds--list-box,.valtimo-case-management-widget-formio ::ng-deep .cds--list-box__field,.valtimo-case-management-widget-formio ::ng-deep .cds--dropdown{background-color:var(--cds-layer-02)}.valtimo-case-management-widget-formio ::ng-deep .dropdown-label label{display:flex;flex-direction:column;width:100%}.valtimo-case-management-widget-formio ::ng-deep .dropdown-label cds-dropdown{margin-top:8px}\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"] }]
6513
6526
  }], ctorParameters: () => [{ type: i1$1.CdsThemeService }, { type: i1$3.FormBuilder }, { type: WidgetWizardService }, { type: i1$2.FormService }, { type: undefined, decorators: [{
6514
6527
  type: Inject,
6515
6528
  args: [WIDGET_MANAGEMENT_SERVICE]