@valtimo/iko 13.10.0 → 13.11.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.
@@ -10,7 +10,7 @@ import { AuthGuardService } from '@valtimo/security';
10
10
  import * as i2$2 from '@valtimo/components';
11
11
  import { CarbonListModule, FormIoModule, FitPageDirective, RenderInPageHeaderDirective, SelectModule, CARBON_CONSTANTS, ValtimoCdsModalDirective, AutoKeyInputComponent, ConfirmationModalModule, ViewType, ValuePathSelectorPrefix, InputLabelModule, runAfterCarbonModalClosed, CarbonMultiInputModule, InputModule as InputModule$1, DatePickerModule, ParagraphModule, DateTimePickerComponent, FormModule } from '@valtimo/components';
12
12
  import * as i6 from 'carbon-components-angular';
13
- import { InputModule, PaginationModule, TilesModule, ButtonModule, ModalModule, TabsModule, IconModule, LayerModule, TooltipModule, DropdownModule, LoadingModule, ToggleModule, NumberModule, ProgressBarModule, CheckboxModule, FileUploaderModule, NotificationModule, TimePickerModule } from 'carbon-components-angular';
13
+ import { InputModule, PaginationModule, TilesModule, ButtonModule, ModalModule, TabsModule, IconModule, LayerModule, TooltipModule, DropdownModule, ToggleModule, LoadingModule, NumberModule, ProgressBarModule, CheckboxModule, FileUploaderModule, NotificationModule, TimePickerModule } from 'carbon-components-angular';
14
14
  import { BehaviorSubject, filter, of, switchMap, combineLatest, tap, map as map$1, startWith, take, distinctUntilChanged, Subscription, delay } from 'rxjs';
15
15
  import * as i2$1 from '@valtimo/layout';
16
16
  import { WidgetCollectionComponent, WidgetCustomComponent, WidgetFieldComponent, WidgetFormioComponent, WidgetInteractiveTableComponent, WidgetTableComponent, WidgetMapComponent, WidgetType, WidgetContainerComponent, ManagementWidgetDetailsComponent, WIDGET_MANAGEMENT_SERVICE, WidgetManagementComponent } from '@valtimo/layout';
@@ -1437,7 +1437,11 @@ class IkoManagementRepositoryModalComponent {
1437
1437
  }
1438
1438
  set prefillData(value) {
1439
1439
  this.$prefillData.set(value);
1440
- this.formGroup.patchValue(value);
1440
+ this.formGroup.patchValue({
1441
+ ...value,
1442
+ type: 'iko',
1443
+ });
1444
+ this.formGroup.get('type')?.disable({ emitEvent: false });
1441
1445
  }
1442
1446
  set modalMode(value) {
1443
1447
  this._modalMode = value;
@@ -1467,12 +1471,12 @@ class IkoManagementRepositoryModalComponent {
1467
1471
  this.formGroup = this.fb.group({
1468
1472
  title: this.fb.control('', Validators.required),
1469
1473
  key: this.fb.control('', Validators.required),
1470
- type: this.fb.control('', Validators.required),
1474
+ type: this.fb.control({ value: 'iko', disabled: true }, Validators.required),
1471
1475
  properties: this.fb.group({}, Validators.required),
1472
1476
  });
1473
1477
  this.propertyFields$ = this.formGroup
1474
1478
  .get('type')
1475
- .valueChanges.pipe(startWith(this.formGroup.get('type').value), tap(_ => this.formGroup.patchValue({ properties: {} })), filter(type => !!type && !Array.isArray(type)), switchMap(type => this.ikoManagementApiService.getIkoRepositoryPropertyFields(type)));
1479
+ .valueChanges.pipe(startWith(this.formGroup.get('type').value), tap(_ => this.formGroup.patchValue({ properties: {} }, { emitEvent: false })), filter(type => !!type && !Array.isArray(type)), switchMap(type => this.ikoManagementApiService.getIkoRepositoryPropertyFields(type)));
1476
1480
  this.enableIkoType = this.configService.getFeatureToggle('enableIkoType');
1477
1481
  }
1478
1482
  get properties() {
@@ -1497,11 +1501,16 @@ class IkoManagementRepositoryModalComponent {
1497
1501
  }
1498
1502
  resetForm() {
1499
1503
  setTimeout(() => {
1500
- this.formGroup.reset();
1504
+ this.formGroup.reset({
1505
+ title: '',
1506
+ key: '',
1507
+ type: 'iko',
1508
+ properties: {},
1509
+ });
1501
1510
  }, CARBON_CONSTANTS.modalAnimationMs);
1502
1511
  }
1503
1512
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: IkoManagementRepositoryModalComponent, deps: [{ token: i1$3.FormBuilder }, { token: IkoManagementApiService }, { token: i2.ConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
1504
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: IkoManagementRepositoryModalComponent, isStandalone: true, selector: "valtimo-iko-management-repository-modal", inputs: { open: "open", prefillData: "prefillData", modalMode: "modalMode" }, outputs: { modalClose: "modalClose" }, ngImport: i0, template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<cds-modal valtimoCdsModal [open]=\"open$ | async\" size=\"sm\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>{{ 'ikoManagement.configureIkoServer' | translate }}</h3>\n </cds-modal-header>\n\n <form cdsModalContent [cdsLayer]=\"1\" [formGroup]=\"formGroup\" class=\"iko-api-form\">\n <cds-label [invalid]=\"getControlInvalid('title')\">\n {{ 'ikoManagement.titleTitle' | translate }}\n\n <input\n [invalid]=\"getControlInvalid('title')\"\n formControlName=\"title\"\n cdsText\n placeholder=\"{{ 'ikoManagement.titlePlaceholder' | translate }}\"\n />\n </cds-label>\n\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys$ | async\"\n [sourceText]=\"title.value\"\n formControlName=\"key\"\n placeholderTranslationKey=\"interface.key\"\n >\n </valtimo-auto-key-input>\n\n @if (enableIkoType) {\n <v-select\n [invalid]=\"getControlInvalid('type')\"\n formControlName=\"type\"\n [disabled]=\"!enableIkoType\"\n [items]=\"ikoRepositoryTypeSelectItems$ | async\"\n [title]=\"'ikoManagement.typeTitle' | translate\"\n [appendInline]=\"false\"\n [dropUp]=\"false\"\n ></v-select>\n }\n\n <valtimo-iko-management-properties\n [propertiesFormGroup]=\"properties\"\n [fields]=\"propertyFields$ | async\"\n [prefillData]=\"$prefillData()?.properties\"\n />\n </form>\n\n <cds-modal-footer>\n <button cdsButton=\"ghost\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button [disabled]=\"formGroup.invalid\" cdsButton=\"primary\" (click)=\"onSave()\">\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: ["form{display:flex;flex-direction:column;gap:16px}fieldset{display:flex;gap:16px}::ng-deep label{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i6.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i6.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i6.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i6.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i6.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i6.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i6.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: ButtonModule }, { kind: "directive", type: i6.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: PropertiesFormComponent, selector: "valtimo-iko-management-properties", inputs: ["propertiesFormGroup", "fields", "prefillData"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i2$2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "dataTestId"], outputs: ["selectedChange"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i6.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: AutoKeyInputComponent, selector: "valtimo-auto-key-input", inputs: ["labelTranslationKey", "placeholderTranslationKey", "mode", "usedKeys", "sourceText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1513
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: IkoManagementRepositoryModalComponent, isStandalone: true, selector: "valtimo-iko-management-repository-modal", inputs: { open: "open", prefillData: "prefillData", modalMode: "modalMode" }, outputs: { modalClose: "modalClose" }, ngImport: i0, template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<cds-modal valtimoCdsModal [open]=\"open$ | async\" size=\"sm\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>{{ 'ikoManagement.configureIkoServer' | translate }}</h3>\n </cds-modal-header>\n\n <form cdsModalContent [cdsLayer]=\"1\" [formGroup]=\"formGroup\" class=\"iko-api-form\">\n <cds-label [invalid]=\"getControlInvalid('title')\">\n {{ 'ikoManagement.titleTitle' | translate }}\n\n <input\n [invalid]=\"getControlInvalid('title')\"\n formControlName=\"title\"\n cdsText\n placeholder=\"{{ 'ikoManagement.titlePlaceholder' | translate }}\"\n />\n </cds-label>\n\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys$ | async\"\n [sourceText]=\"title.value\"\n formControlName=\"key\"\n placeholderTranslationKey=\"interface.key\"\n >\n </valtimo-auto-key-input>\n\n <v-select\n *ngIf=\"enableIkoType\"\n [invalid]=\"getControlInvalid('type')\"\n formControlName=\"type\"\n [disabled]=\"true\"\n [items]=\"ikoRepositoryTypeSelectItems$ | async\"\n [title]=\"'ikoManagement.typeTitle' | translate\"\n [appendInline]=\"false\"\n [dropUp]=\"false\"\n ></v-select>\n\n <valtimo-iko-management-properties\n [propertiesFormGroup]=\"properties\"\n [fields]=\"propertyFields$ | async\"\n [prefillData]=\"$prefillData()?.properties\"\n />\n </form>\n\n <cds-modal-footer>\n <button cdsButton=\"ghost\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button [disabled]=\"formGroup.invalid\" cdsButton=\"primary\" (click)=\"onSave()\">\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: ["form{display:flex;flex-direction:column;gap:16px}fieldset{display:flex;gap:16px}::ng-deep label{width:100%}\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: i5.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i6.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i6.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i6.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i6.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i6.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i6.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i6.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: ButtonModule }, { kind: "directive", type: i6.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "component", type: PropertiesFormComponent, selector: "valtimo-iko-management-properties", inputs: ["propertiesFormGroup", "fields", "prefillData"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i2$2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "dataTestId"], outputs: ["selectedChange"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i6.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "component", type: AutoKeyInputComponent, selector: "valtimo-auto-key-input", inputs: ["labelTranslationKey", "placeholderTranslationKey", "mode", "usedKeys", "sourceText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1505
1514
  }
1506
1515
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: IkoManagementRepositoryModalComponent, decorators: [{
1507
1516
  type: Component,
@@ -1518,7 +1527,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
1518
1527
  SelectModule,
1519
1528
  LayerModule,
1520
1529
  AutoKeyInputComponent,
1521
- ], template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<cds-modal valtimoCdsModal [open]=\"open$ | async\" size=\"sm\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>{{ 'ikoManagement.configureIkoServer' | translate }}</h3>\n </cds-modal-header>\n\n <form cdsModalContent [cdsLayer]=\"1\" [formGroup]=\"formGroup\" class=\"iko-api-form\">\n <cds-label [invalid]=\"getControlInvalid('title')\">\n {{ 'ikoManagement.titleTitle' | translate }}\n\n <input\n [invalid]=\"getControlInvalid('title')\"\n formControlName=\"title\"\n cdsText\n placeholder=\"{{ 'ikoManagement.titlePlaceholder' | translate }}\"\n />\n </cds-label>\n\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys$ | async\"\n [sourceText]=\"title.value\"\n formControlName=\"key\"\n placeholderTranslationKey=\"interface.key\"\n >\n </valtimo-auto-key-input>\n\n @if (enableIkoType) {\n <v-select\n [invalid]=\"getControlInvalid('type')\"\n formControlName=\"type\"\n [disabled]=\"!enableIkoType\"\n [items]=\"ikoRepositoryTypeSelectItems$ | async\"\n [title]=\"'ikoManagement.typeTitle' | translate\"\n [appendInline]=\"false\"\n [dropUp]=\"false\"\n ></v-select>\n }\n\n <valtimo-iko-management-properties\n [propertiesFormGroup]=\"properties\"\n [fields]=\"propertyFields$ | async\"\n [prefillData]=\"$prefillData()?.properties\"\n />\n </form>\n\n <cds-modal-footer>\n <button cdsButton=\"ghost\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button [disabled]=\"formGroup.invalid\" cdsButton=\"primary\" (click)=\"onSave()\">\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: ["form{display:flex;flex-direction:column;gap:16px}fieldset{display:flex;gap:16px}::ng-deep label{width:100%}\n"] }]
1530
+ ], template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<cds-modal valtimoCdsModal [open]=\"open$ | async\" size=\"sm\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>{{ 'ikoManagement.configureIkoServer' | translate }}</h3>\n </cds-modal-header>\n\n <form cdsModalContent [cdsLayer]=\"1\" [formGroup]=\"formGroup\" class=\"iko-api-form\">\n <cds-label [invalid]=\"getControlInvalid('title')\">\n {{ 'ikoManagement.titleTitle' | translate }}\n\n <input\n [invalid]=\"getControlInvalid('title')\"\n formControlName=\"title\"\n cdsText\n placeholder=\"{{ 'ikoManagement.titlePlaceholder' | translate }}\"\n />\n </cds-label>\n\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys$ | async\"\n [sourceText]=\"title.value\"\n formControlName=\"key\"\n placeholderTranslationKey=\"interface.key\"\n >\n </valtimo-auto-key-input>\n\n <v-select\n *ngIf=\"enableIkoType\"\n [invalid]=\"getControlInvalid('type')\"\n formControlName=\"type\"\n [disabled]=\"true\"\n [items]=\"ikoRepositoryTypeSelectItems$ | async\"\n [title]=\"'ikoManagement.typeTitle' | translate\"\n [appendInline]=\"false\"\n [dropUp]=\"false\"\n ></v-select>\n\n <valtimo-iko-management-properties\n [propertiesFormGroup]=\"properties\"\n [fields]=\"propertyFields$ | async\"\n [prefillData]=\"$prefillData()?.properties\"\n />\n </form>\n\n <cds-modal-footer>\n <button cdsButton=\"ghost\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button [disabled]=\"formGroup.invalid\" cdsButton=\"primary\" (click)=\"onSave()\">\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: ["form{display:flex;flex-direction:column;gap:16px}fieldset{display:flex;gap:16px}::ng-deep label{width:100%}\n"] }]
1522
1531
  }], ctorParameters: () => [{ type: i1$3.FormBuilder }, { type: IkoManagementApiService }, { type: i2.ConfigService }], propDecorators: { open: [{
1523
1532
  type: Input
1524
1533
  }], prefillData: [{
@@ -1909,6 +1918,7 @@ class IkoManagementSearchFieldModalComponent {
1909
1918
  fieldType: this.fb.control(null, Validators.required),
1910
1919
  dropdownDataProvider: this.fb.control(null),
1911
1920
  dropdownValues: this.fb.array([]),
1921
+ required: this.fb.control(false),
1912
1922
  });
1913
1923
  this.SearchFieldDataType = SearchFieldDataType;
1914
1924
  this.SearchFieldFieldType = SearchFieldFieldType;
@@ -2047,6 +2057,7 @@ class IkoManagementSearchFieldModalComponent {
2047
2057
  ...(groupValue.dropdownValues && {
2048
2058
  dropdownValues: groupValue.dropdownValues.reduce((acc, curr) => ({ ...acc, ...(!!curr?.key && { [curr.key]: curr.value }) }), {}),
2049
2059
  }),
2060
+ required: groupValue.required ?? false,
2050
2061
  });
2051
2062
  this.resetForm();
2052
2063
  }
@@ -2084,6 +2095,7 @@ class IkoManagementSearchFieldModalComponent {
2084
2095
  selected: true,
2085
2096
  },
2086
2097
  dropdownValues: [],
2098
+ required: !!prefillData.required,
2087
2099
  });
2088
2100
  if (prefillData.dropdownDataProvider && prefillData.dropdownValues)
2089
2101
  this.setPrefilledDropdownValues(prefillData.dropdownValues);
@@ -2134,11 +2146,12 @@ class IkoManagementSearchFieldModalComponent {
2134
2146
  this.dropdownValuesArray.removeAt(0);
2135
2147
  }
2136
2148
  this.formGroup.reset();
2149
+ this.formGroup.patchValue({ required: false });
2137
2150
  this.formGroup.enable();
2138
2151
  }, CARBON_CONSTANTS.modalAnimationMs);
2139
2152
  }
2140
2153
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: IkoManagementSearchFieldModalComponent, deps: [{ token: i6.IconService }, { token: i1$3.FormBuilder }, { token: i5.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
2141
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: IkoManagementSearchFieldModalComponent, isStandalone: true, selector: "valtimo-iko-management-search-field-modal", inputs: { open: "open", usedKeys: "usedKeys", modalMode: "modalMode", prefillData: "prefillData" }, outputs: { closeEvent: "closeEvent" }, 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 [open]=\"open\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>\n {{ (!prefillData ? 'searchFieldsOverview.add' : 'searchFieldsOverview.edit') | translate }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [formGroup]=\"formGroup\" class=\"valtimo-search-fields-modal__content\">\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.title' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n >\n </v-input-label>\n\n <input data-testid=\"-search-title\" cdsText type=\"text\" formControlName=\"title\" cdsLayer />\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys\"\n [sourceText]=\"title.value\"\n data-testid=\"iko-search-key\"\n formControlName=\"key\"\n placeholderTranslationKey=\"interface.key\"\n >\n </valtimo-auto-key-input>\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.path' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n >\n </v-input-label>\n\n <input cdsLayer data-testid=\"iko-search-key\" cdsText type=\"text\" formControlName=\"path\" />\n\n <!-- TODO: When BE value resolver is in place -->\n <!-- <valtimo-value-path-selector\n formControlName=\"path\"\n [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n ></valtimo-value-path-selector> -->\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dataType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-dataType\" formControlName=\"dataType\">\n <cds-dropdown-list [items]=\"dataTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dataTypeValue === SearchFieldDataType.TEXT) {\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.matchType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-matchType\" formControlName=\"matchType\">\n <cds-dropdown-list [items]=\"matchTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n }\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.fieldType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-fieldType\" formControlName=\"fieldType\">\n <cds-dropdown-list [items]=\"fieldTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (\n dataTypeValue === SearchFieldDataType.TEXT &&\n (fieldTypeValue === SearchFieldFieldType.SINGLE_SELECT_DROPDOWN ||\n fieldTypeValue === SearchFieldFieldType.MULTI_SELECT_DROPDOWN)\n ) {\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n data-testid=\"-search-dropdownDataProvider\"\n formControlName=\"dropdownDataProvider\"\n cdsLayer\n >\n <cds-dropdown-list [items]=\"dataProviderItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dropdownDataProviderValue === SearchDropdownDataProvider.DATABASE) {\n <div class=\"valtimo-search-fields-modal__list\" formArrayName=\"dropdownValues\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n [noMargin]=\"true\"\n >\n </v-input-label>\n\n @for (dropdownValue of dropdownValuesArray?.controls; track $index) {\n <form [formGroup]=\"dropdownValue\" class=\"valtimo-search-fields-modal__dropdown-values\">\n <cds-text-label>\n {{ 'interface.value' | translate }}\n\n <input\n data-testid=\"iko-search-dropdownKey\"\n cdsText\n type=\"text\"\n formControlName=\"key\"\n cdsLayer\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'interface.display' | translate }}\n\n <input\n data-testid=\"-search-dropdownValue\"\n cdsText\n type=\"text\"\n formControlName=\"value\"\n cdsLayer\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger\"\n data-testid=\"iko-search-deleteEnum\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n (click)=\"removeDropdownValue($index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n data-testid=\"-search-addDropdownValue\"\n cdsButton=\"primary\"\n (click)=\"addDropdownValue()\"\n >\n {{ 'interface.addRow' | translate }}\n\n <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n </button>\n </div>\n }\n }\n </form>\n\n <cds-modal-footer>\n <button data-testid=\"-search-cancel\" cdsButton=\"ghost\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n data-testid=\"-search-save\"\n cdsButton=\"primary\"\n [disabled]=\"formGroup.invalid\"\n (click)=\"onSave()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-search-fields-modal__content,.valtimo-search-fields-modal__dropdown-values{display:flex;gap:16px}.valtimo-search-fields-modal__content{flex-direction:column}.valtimo-search-fields-modal__dropdown-values{align-items:flex-end;gap:16px}.valtimo-search-fields-modal__label{display:flex;gap:4px}.valtimo-search-fields-modal__list{display:flex;flex-direction:column;gap:16px}\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: ButtonModule }, { kind: "directive", type: i6.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i6.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: i6.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: i2$2.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i6.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i6.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i6.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i6.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i6.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i6.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i6.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i6.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { 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: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "component", type: AutoKeyInputComponent, selector: "valtimo-auto-key-input", inputs: ["labelTranslationKey", "placeholderTranslationKey", "mode", "usedKeys", "sourceText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2154
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: IkoManagementSearchFieldModalComponent, isStandalone: true, selector: "valtimo-iko-management-search-field-modal", inputs: { open: "open", usedKeys: "usedKeys", modalMode: "modalMode", prefillData: "prefillData" }, outputs: { closeEvent: "closeEvent" }, 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 [open]=\"open\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>\n {{ (!prefillData ? 'searchFieldsOverview.add' : 'searchFieldsOverview.edit') | translate }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [formGroup]=\"formGroup\" class=\"valtimo-search-fields-modal__content\">\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.title' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n >\n </v-input-label>\n\n <input data-testid=\"-search-title\" cdsText type=\"text\" formControlName=\"title\" cdsLayer />\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys\"\n [sourceText]=\"title.value\"\n data-testid=\"iko-search-key\"\n formControlName=\"key\"\n placeholderTranslationKey=\"interface.key\"\n >\n </valtimo-auto-key-input>\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.path' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n >\n </v-input-label>\n\n <input cdsLayer data-testid=\"iko-search-key\" cdsText type=\"text\" formControlName=\"path\" />\n\n <!-- TODO: When BE value resolver is in place -->\n <!-- <valtimo-value-path-selector\n formControlName=\"path\"\n [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n ></valtimo-value-path-selector> -->\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dataType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-dataType\" formControlName=\"dataType\">\n <cds-dropdown-list [items]=\"dataTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dataTypeValue === SearchFieldDataType.TEXT) {\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.matchType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-matchType\" formControlName=\"matchType\">\n <cds-dropdown-list [items]=\"matchTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n }\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.fieldType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-fieldType\" formControlName=\"fieldType\">\n <cds-dropdown-list [items]=\"fieldTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n <cds-toggle\n class=\"valtimo-search-fields-modal__input\"\n formControlName=\"required\"\n [label]=\"'searchFieldsOverview.required' | translate\"\n [onText]=\"'searchFieldsOverview.requiredEnabled' | translate\"\n [offText]=\"'searchFieldsOverview.requiredDisabled' | translate\"\n ></cds-toggle>\n\n @if (\n dataTypeValue === SearchFieldDataType.TEXT &&\n (fieldTypeValue === SearchFieldFieldType.SINGLE_SELECT_DROPDOWN ||\n fieldTypeValue === SearchFieldFieldType.MULTI_SELECT_DROPDOWN)\n ) {\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n data-testid=\"-search-dropdownDataProvider\"\n formControlName=\"dropdownDataProvider\"\n cdsLayer\n >\n <cds-dropdown-list [items]=\"dataProviderItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dropdownDataProviderValue === SearchDropdownDataProvider.DATABASE) {\n <div class=\"valtimo-search-fields-modal__list\" formArrayName=\"dropdownValues\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n [noMargin]=\"true\"\n >\n </v-input-label>\n\n @for (dropdownValue of dropdownValuesArray?.controls; track $index) {\n <form [formGroup]=\"dropdownValue\" class=\"valtimo-search-fields-modal__dropdown-values\">\n <cds-text-label>\n {{ 'interface.value' | translate }}\n\n <input\n data-testid=\"iko-search-dropdownKey\"\n cdsText\n type=\"text\"\n formControlName=\"key\"\n cdsLayer\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'interface.display' | translate }}\n\n <input\n data-testid=\"-search-dropdownValue\"\n cdsText\n type=\"text\"\n formControlName=\"value\"\n cdsLayer\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger\"\n data-testid=\"iko-search-deleteEnum\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n (click)=\"removeDropdownValue($index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n data-testid=\"-search-addDropdownValue\"\n cdsButton=\"primary\"\n (click)=\"addDropdownValue()\"\n >\n {{ 'interface.addRow' | translate }}\n\n <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n </button>\n </div>\n }\n }\n </form>\n\n <cds-modal-footer>\n <button data-testid=\"-search-cancel\" cdsButton=\"ghost\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n data-testid=\"-search-save\"\n cdsButton=\"primary\"\n [disabled]=\"formGroup.invalid\"\n (click)=\"onSave()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-search-fields-modal__content,.valtimo-search-fields-modal__dropdown-values{display:flex;gap:16px}.valtimo-search-fields-modal__content{flex-direction:column}.valtimo-search-fields-modal__dropdown-values{align-items:flex-end;gap:16px}.valtimo-search-fields-modal__label{display:flex;gap:4px}.valtimo-search-fields-modal__list{display:flex;flex-direction:column;gap:16px}\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: ButtonModule }, { kind: "directive", type: i6.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i6.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: i6.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i6.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i2$2.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i6.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i6.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i6.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i6.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i6.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i6.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i6.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i6.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { 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: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "component", type: AutoKeyInputComponent, selector: "valtimo-auto-key-input", inputs: ["labelTranslationKey", "placeholderTranslationKey", "mode", "usedKeys", "sourceText"] }, { kind: "ngmodule", type: ToggleModule }, { kind: "component", type: i6.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2142
2155
  }
2143
2156
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: IkoManagementSearchFieldModalComponent, decorators: [{
2144
2157
  type: Component,
@@ -2146,6 +2159,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
2146
2159
  ButtonModule,
2147
2160
  CommonModule,
2148
2161
  DropdownModule,
2162
+ IconModule,
2149
2163
  InputLabelModule,
2150
2164
  InputModule,
2151
2165
  LayerModule,
@@ -2154,7 +2168,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
2154
2168
  TranslateModule,
2155
2169
  ValtimoCdsModalDirective,
2156
2170
  AutoKeyInputComponent,
2157
- ], 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 [open]=\"open\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>\n {{ (!prefillData ? 'searchFieldsOverview.add' : 'searchFieldsOverview.edit') | translate }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [formGroup]=\"formGroup\" class=\"valtimo-search-fields-modal__content\">\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.title' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n >\n </v-input-label>\n\n <input data-testid=\"-search-title\" cdsText type=\"text\" formControlName=\"title\" cdsLayer />\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys\"\n [sourceText]=\"title.value\"\n data-testid=\"iko-search-key\"\n formControlName=\"key\"\n placeholderTranslationKey=\"interface.key\"\n >\n </valtimo-auto-key-input>\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.path' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n >\n </v-input-label>\n\n <input cdsLayer data-testid=\"iko-search-key\" cdsText type=\"text\" formControlName=\"path\" />\n\n <!-- TODO: When BE value resolver is in place -->\n <!-- <valtimo-value-path-selector\n formControlName=\"path\"\n [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n ></valtimo-value-path-selector> -->\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dataType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-dataType\" formControlName=\"dataType\">\n <cds-dropdown-list [items]=\"dataTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dataTypeValue === SearchFieldDataType.TEXT) {\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.matchType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-matchType\" formControlName=\"matchType\">\n <cds-dropdown-list [items]=\"matchTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n }\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.fieldType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-fieldType\" formControlName=\"fieldType\">\n <cds-dropdown-list [items]=\"fieldTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (\n dataTypeValue === SearchFieldDataType.TEXT &&\n (fieldTypeValue === SearchFieldFieldType.SINGLE_SELECT_DROPDOWN ||\n fieldTypeValue === SearchFieldFieldType.MULTI_SELECT_DROPDOWN)\n ) {\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n data-testid=\"-search-dropdownDataProvider\"\n formControlName=\"dropdownDataProvider\"\n cdsLayer\n >\n <cds-dropdown-list [items]=\"dataProviderItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dropdownDataProviderValue === SearchDropdownDataProvider.DATABASE) {\n <div class=\"valtimo-search-fields-modal__list\" formArrayName=\"dropdownValues\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n [noMargin]=\"true\"\n >\n </v-input-label>\n\n @for (dropdownValue of dropdownValuesArray?.controls; track $index) {\n <form [formGroup]=\"dropdownValue\" class=\"valtimo-search-fields-modal__dropdown-values\">\n <cds-text-label>\n {{ 'interface.value' | translate }}\n\n <input\n data-testid=\"iko-search-dropdownKey\"\n cdsText\n type=\"text\"\n formControlName=\"key\"\n cdsLayer\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'interface.display' | translate }}\n\n <input\n data-testid=\"-search-dropdownValue\"\n cdsText\n type=\"text\"\n formControlName=\"value\"\n cdsLayer\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger\"\n data-testid=\"iko-search-deleteEnum\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n (click)=\"removeDropdownValue($index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n data-testid=\"-search-addDropdownValue\"\n cdsButton=\"primary\"\n (click)=\"addDropdownValue()\"\n >\n {{ 'interface.addRow' | translate }}\n\n <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n </button>\n </div>\n }\n }\n </form>\n\n <cds-modal-footer>\n <button data-testid=\"-search-cancel\" cdsButton=\"ghost\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n data-testid=\"-search-save\"\n cdsButton=\"primary\"\n [disabled]=\"formGroup.invalid\"\n (click)=\"onSave()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-search-fields-modal__content,.valtimo-search-fields-modal__dropdown-values{display:flex;gap:16px}.valtimo-search-fields-modal__content{flex-direction:column}.valtimo-search-fields-modal__dropdown-values{align-items:flex-end;gap:16px}.valtimo-search-fields-modal__label{display:flex;gap:4px}.valtimo-search-fields-modal__list{display:flex;flex-direction:column;gap:16px}\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"] }]
2171
+ ToggleModule,
2172
+ ], 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 [open]=\"open\" showFooter=\"true\" (close)=\"onCancel()\">\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCancel()\">\n <h3 cdsModalHeaderHeading>\n {{ (!prefillData ? 'searchFieldsOverview.add' : 'searchFieldsOverview.edit') | translate }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [formGroup]=\"formGroup\" class=\"valtimo-search-fields-modal__content\">\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.title' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.title' | translate\"\n >\n </v-input-label>\n\n <input data-testid=\"-search-title\" cdsText type=\"text\" formControlName=\"title\" cdsLayer />\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys\"\n [sourceText]=\"title.value\"\n data-testid=\"iko-search-key\"\n formControlName=\"key\"\n placeholderTranslationKey=\"interface.key\"\n >\n </valtimo-auto-key-input>\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.path' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.path' | translate\"\n >\n </v-input-label>\n\n <input cdsLayer data-testid=\"iko-search-key\" cdsText type=\"text\" formControlName=\"path\" />\n\n <!-- TODO: When BE value resolver is in place -->\n <!-- <valtimo-value-path-selector\n formControlName=\"path\"\n [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n ></valtimo-value-path-selector> -->\n </div>\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dataType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dataType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-dataType\" formControlName=\"dataType\">\n <cds-dropdown-list [items]=\"dataTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dataTypeValue === SearchFieldDataType.TEXT) {\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.matchType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.matchType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-matchType\" formControlName=\"matchType\">\n <cds-dropdown-list [items]=\"matchTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n }\n\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.fieldType' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.fieldType' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown cdsLayer data-testid=\"-search-fieldType\" formControlName=\"fieldType\">\n <cds-dropdown-list [items]=\"fieldTypeItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n <cds-toggle\n class=\"valtimo-search-fields-modal__input\"\n formControlName=\"required\"\n [label]=\"'searchFieldsOverview.required' | translate\"\n [onText]=\"'searchFieldsOverview.requiredEnabled' | translate\"\n [offText]=\"'searchFieldsOverview.requiredDisabled' | translate\"\n ></cds-toggle>\n\n @if (\n dataTypeValue === SearchFieldDataType.TEXT &&\n (fieldTypeValue === SearchFieldFieldType.SINGLE_SELECT_DROPDOWN ||\n fieldTypeValue === SearchFieldFieldType.MULTI_SELECT_DROPDOWN)\n ) {\n <div class=\"valtimo-search-fields-modal__input\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownDataProvider' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownDataProvider' | translate\"\n >\n </v-input-label>\n\n <cds-dropdown\n data-testid=\"-search-dropdownDataProvider\"\n formControlName=\"dropdownDataProvider\"\n cdsLayer\n >\n <cds-dropdown-list [items]=\"dataProviderItems$ | async\"></cds-dropdown-list>\n </cds-dropdown>\n </div>\n\n @if (dropdownDataProviderValue === SearchDropdownDataProvider.DATABASE) {\n <div class=\"valtimo-search-fields-modal__list\" formArrayName=\"dropdownValues\">\n <v-input-label\n [title]=\"'searchFieldsOverview.dropdownListValues' | translate\"\n [tooltip]=\"'searchFieldsOverviewTooltips.dropdownListValues' | translate\"\n [noMargin]=\"true\"\n >\n </v-input-label>\n\n @for (dropdownValue of dropdownValuesArray?.controls; track $index) {\n <form [formGroup]=\"dropdownValue\" class=\"valtimo-search-fields-modal__dropdown-values\">\n <cds-text-label>\n {{ 'interface.value' | translate }}\n\n <input\n data-testid=\"iko-search-dropdownKey\"\n cdsText\n type=\"text\"\n formControlName=\"key\"\n cdsLayer\n />\n </cds-text-label>\n\n <cds-text-label>\n {{ 'interface.display' | translate }}\n\n <input\n data-testid=\"-search-dropdownValue\"\n cdsText\n type=\"text\"\n formControlName=\"value\"\n cdsLayer\n />\n </cds-text-label>\n\n <button\n cdsButton=\"danger\"\n data-testid=\"iko-search-deleteEnum\"\n [disabled]=\"$count === 1\"\n [iconOnly]=\"true\"\n (click)=\"removeDropdownValue($index)\"\n >\n <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n </button>\n </form>\n }\n\n <button\n data-testid=\"-search-addDropdownValue\"\n cdsButton=\"primary\"\n (click)=\"addDropdownValue()\"\n >\n {{ 'interface.addRow' | translate }}\n\n <svg cdsIcon=\"add\" size=\"16\" class=\"cds--btn__icon\"></svg>\n </button>\n </div>\n }\n }\n </form>\n\n <cds-modal-footer>\n <button data-testid=\"-search-cancel\" cdsButton=\"ghost\" (click)=\"onCancel()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n data-testid=\"-search-save\"\n cdsButton=\"primary\"\n [disabled]=\"formGroup.invalid\"\n (click)=\"onSave()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-search-fields-modal__content,.valtimo-search-fields-modal__dropdown-values{display:flex;gap:16px}.valtimo-search-fields-modal__content{flex-direction:column}.valtimo-search-fields-modal__dropdown-values{align-items:flex-end;gap:16px}.valtimo-search-fields-modal__label{display:flex;gap:4px}.valtimo-search-fields-modal__list{display:flex;flex-direction:column;gap:16px}\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"] }]
2158
2173
  }], ctorParameters: () => [{ type: i6.IconService }, { type: i1$3.FormBuilder }, { type: i5.TranslateService }], propDecorators: { open: [{
2159
2174
  type: Input,
2160
2175
  args: [{ required: true }]
@@ -2288,6 +2303,7 @@ class IkoManagementSearchFieldsComponent {
2288
2303
  this.deleteModalOpen$.next(true);
2289
2304
  }
2290
2305
  editSearchField(field) {
2306
+ this.$modalMode.set('edit');
2291
2307
  if (!!field.dropdownDataProvider) {
2292
2308
  this.params$
2293
2309
  .pipe(switchMap((params) => this.ikoManagementApiService.getDropdownData(field.dropdownDataProvider, params.aggregateKey, params.actionKey, field.key)), take(1))
@@ -2298,7 +2314,6 @@ class IkoManagementSearchFieldsComponent {
2298
2314
  });
2299
2315
  return;
2300
2316
  }
2301
- this.$modalMode.set('edit');
2302
2317
  this.prefillData$.next(field);
2303
2318
  this.fieldModalOpen$.next(true);
2304
2319
  }
@@ -3016,7 +3031,7 @@ class IkoManagementListModalComponent {
3016
3031
  };
3017
3032
  }
3018
3033
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: IkoManagementListModalComponent, deps: [{ token: IkoManagementApiService }, { token: i1$3.FormBuilder }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
3019
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: IkoManagementListModalComponent, isStandalone: true, selector: "valtimo-iko-management-list-modal", inputs: { openModal: "openModal", listColumns: "listColumns", selectedListColumn: "selectedListColumn", modalMode: "modalMode" }, outputs: { closeModalEvent: "closeModalEvent" }, ngImport: i0, template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<cds-modal\n valtimoCdsModal\n *ngIf=\"{\n title:\n (modalMode === 'add' ? 'ikoManagement.addColumn' : 'ikoManagement.editColumn') | translate,\n } as state\"\n [open]=\"$openModal()\"\n [title]=\"state.title\"\n (close)=\"closeModal()\"\n>\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n <h3 cdsModalHeaderHeading>\n {{ state.title }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [cdsLayer]=\"1\" [formGroup]=\"form\" class=\"iko-column-form\">\n <cds-label>\n {{ 'ikoManagement.titleTitle' | translate }}\n\n <input\n [invalid]=\"title.dirty && title.invalid\"\n formControlName=\"title\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnTitlePlaceholder' | translate }}\"\n />\n </cds-label>\n\n <cds-label>\n {{ 'ikoManagement.keyTitle' | translate }}\n\n <input\n [invalid]=\"key.dirty && key.invalid\"\n formControlName=\"key\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnKeyPlaceholder' | translate }}\"\n />\n </cds-label>\n\n <cds-label>\n {{ 'ikoManagement.pathTitle' | translate }}\n\n <input\n [invalid]=\"path.dirty && path.invalid\"\n formControlName=\"path\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnPathPlaceholder' | translate }}\"\n />\n </cds-label>\n\n <cds-toggle\n formControlName=\"sortable\"\n [label]=\"'ikoManagement.sortableTitle' | translate\"\n [onText]=\"'ikoManagement.sortingEnabled' | translate\"\n [offText]=\"'ikoManagement.sortingDisabled' | translate\"\n ></cds-toggle>\n\n <v-select\n [invalid]=\"defaultSort.dirty && defaultSort.invalid\"\n formControlName=\"defaultSort\"\n [items]=\"sortSelectItems\"\n titleTranslationKey=\"ikoManagement.defaultSortTitle\"\n [appendInline]=\"false\"\n ></v-select>\n\n <v-select\n [invalid]=\"displayType.dirty && displayType.invalid\"\n formControlName=\"displayType\"\n [items]=\"displayTypeSelectItems\"\n titleTranslationKey=\"ikoManagement.displayType\"\n [appendInline]=\"false\"\n ></v-select>\n\n <v-input-label\n *ngIf=\"isDateDisplayType$ | async\"\n titleTranslationKey=\"listColumn.dateFormat\"\n tooltipTranslationKey=\"listColumn.dateFormatTooltip\"\n >\n <input cdsText formControlName=\"dateFormat\" />\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isBooleanDisplayType$ | async\"\n titleTranslationKey=\"listColumn.enumTitleOptional\"\n tooltipTranslationKey=\"listColumn.enumTooltipOptional\"\n >\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"booleanDisplayTypeParameters\"\n [hideAddButton]=\"true\"\n [hideDeleteButton]=\"true\"\n [maxRows]=\"1\"\n [keyColumnTitle]=\"'viewTypeConverter.Yes' | translate\"\n [valueColumnTitle]=\"'viewTypeConverter.No' | translate\"\n ></valtimo-carbon-multi-input>\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isEnumDisplayType$ | async\"\n titleTranslationKey=\"listColumn.enumTitle\"\n tooltipTranslationKey=\"listColumn.enumTooltip\"\n >\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"enumDisplayTypeParameters\"\n ></valtimo-carbon-multi-input>\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isTagsDisplayType$ | async\"\n titleTranslationKey=\"listColumn.tagAmount\"\n tooltipTranslationKey=\"listColumn.tagAmountTooltip\"\n >\n <cds-number formControlName=\"tagAmount\" [min]=\"1\" [step]=\"1\"></cds-number>\n </v-input-label>\n </form>\n\n <cds-modal-footer>\n <button cdsButton=\"ghost\" (click)=\"closeModal()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n [disabled]=\"form.invalid || form.disabled || !form.dirty\"\n cdsButton=\"primary\"\n (click)=\"addColumn()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".iko-column-form{display:flex;flex-direction:column;gap:16px;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: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i6.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i6.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i6.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i6.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i6.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i6.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i6.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: LayerModule }, { kind: "directive", type: i6.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i2$2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "dataTestId"], outputs: ["selectedChange"] }, { kind: "ngmodule", type: ToggleModule }, { kind: "component", type: i6.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: CarbonMultiInputModule }, { kind: "component", type: i2$2.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: InputLabelModule }, { kind: "component", type: i2$2.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: NumberModule }, { kind: "component", type: i6.NumberComponent, selector: "cds-number, ibm-number", inputs: ["readonly", "theme", "disabled", "skeleton", "invalid", "id", "placeholder", "size", "required", "value", "min", "max", "label", "helperText", "invalidText", "step", "precision", "warn", "warnText", "ariaLabel", "decrementLabel", "incrementLabel", "fluid"], outputs: ["change"] }] }); }
3034
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: IkoManagementListModalComponent, isStandalone: true, selector: "valtimo-iko-management-list-modal", inputs: { openModal: "openModal", listColumns: "listColumns", selectedListColumn: "selectedListColumn", modalMode: "modalMode" }, outputs: { closeModalEvent: "closeModalEvent" }, ngImport: i0, template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<cds-modal\n valtimoCdsModal\n *ngIf=\"{\n title:\n (modalMode === 'add' ? 'ikoManagement.addColumn' : 'ikoManagement.editColumn') | translate,\n } as state\"\n [open]=\"$openModal()\"\n [title]=\"state.title\"\n (close)=\"closeModal()\"\n>\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n <h3 cdsModalHeaderHeading>\n {{ state.title }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [cdsLayer]=\"1\" [formGroup]=\"form\" class=\"iko-column-form\">\n <cds-label>\n {{ 'ikoManagement.titleTitle' | translate }}\n\n <input\n [mode]=\"modalMode\"\n [invalid]=\"title.dirty && title.invalid\"\n formControlName=\"title\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnTitlePlaceholder' | translate }}\"\n />\n </cds-label>\n\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys$ | async\"\n [sourceText]=\"title.value\"\n formControlName=\"key\"\n placeholderTranslationKey=\"ikoManagement.columnKeyPlaceholder\"\n >\n </valtimo-auto-key-input>\n\n <cds-label>\n {{ 'ikoManagement.pathTitle' | translate }}\n\n <input\n [invalid]=\"path.dirty && path.invalid\"\n formControlName=\"path\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnPathPlaceholder' | translate }}\"\n />\n </cds-label>\n\n <cds-toggle\n formControlName=\"sortable\"\n [label]=\"'ikoManagement.sortableTitle' | translate\"\n [onText]=\"'ikoManagement.sortingEnabled' | translate\"\n [offText]=\"'ikoManagement.sortingDisabled' | translate\"\n ></cds-toggle>\n\n <v-select\n [invalid]=\"defaultSort.dirty && defaultSort.invalid\"\n formControlName=\"defaultSort\"\n [items]=\"sortSelectItems\"\n titleTranslationKey=\"ikoManagement.defaultSortTitle\"\n [appendInline]=\"false\"\n ></v-select>\n\n <v-select\n [invalid]=\"displayType.dirty && displayType.invalid\"\n formControlName=\"displayType\"\n [items]=\"displayTypeSelectItems\"\n titleTranslationKey=\"ikoManagement.displayType\"\n [appendInline]=\"false\"\n ></v-select>\n\n <v-input-label\n *ngIf=\"isDateDisplayType$ | async\"\n titleTranslationKey=\"listColumn.dateFormat\"\n tooltipTranslationKey=\"listColumn.dateFormatTooltip\"\n >\n <input cdsText formControlName=\"dateFormat\" />\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isBooleanDisplayType$ | async\"\n titleTranslationKey=\"listColumn.enumTitleOptional\"\n tooltipTranslationKey=\"listColumn.enumTooltipOptional\"\n >\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"booleanDisplayTypeParameters\"\n [hideAddButton]=\"true\"\n [hideDeleteButton]=\"true\"\n [maxRows]=\"1\"\n [keyColumnTitle]=\"'viewTypeConverter.Yes' | translate\"\n [valueColumnTitle]=\"'viewTypeConverter.No' | translate\"\n ></valtimo-carbon-multi-input>\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isEnumDisplayType$ | async\"\n titleTranslationKey=\"listColumn.enumTitle\"\n tooltipTranslationKey=\"listColumn.enumTooltip\"\n >\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"enumDisplayTypeParameters\"\n ></valtimo-carbon-multi-input>\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isTagsDisplayType$ | async\"\n titleTranslationKey=\"listColumn.tagAmount\"\n tooltipTranslationKey=\"listColumn.tagAmountTooltip\"\n >\n <cds-number formControlName=\"tagAmount\" [min]=\"1\" [step]=\"1\"></cds-number>\n </v-input-label>\n </form>\n\n <cds-modal-footer>\n <button cdsButton=\"ghost\" (click)=\"closeModal()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n [disabled]=\"form.invalid || form.disabled || !form.dirty\"\n cdsButton=\"primary\"\n (click)=\"addColumn()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".iko-column-form{display:flex;flex-direction:column;gap:16px;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: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ModalModule }, { kind: "component", type: i6.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i6.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i6.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i6.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i6.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: i6.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i6.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: LayerModule }, { kind: "directive", type: i6.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i2$2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "dataTestId"], outputs: ["selectedChange"] }, { kind: "ngmodule", type: ToggleModule }, { kind: "component", type: i6.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: CarbonMultiInputModule }, { kind: "component", type: i2$2.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: InputLabelModule }, { kind: "component", type: i2$2.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: NumberModule }, { kind: "component", type: i6.NumberComponent, selector: "cds-number, ibm-number", inputs: ["readonly", "theme", "disabled", "skeleton", "invalid", "id", "placeholder", "size", "required", "value", "min", "max", "label", "helperText", "invalidText", "step", "precision", "warn", "warnText", "ariaLabel", "decrementLabel", "incrementLabel", "fluid"], outputs: ["change"] }, { kind: "component", type: AutoKeyInputComponent, selector: "valtimo-auto-key-input", inputs: ["labelTranslationKey", "placeholderTranslationKey", "mode", "usedKeys", "sourceText"] }] }); }
3020
3035
  }
3021
3036
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: IkoManagementListModalComponent, decorators: [{
3022
3037
  type: Component,
@@ -3035,7 +3050,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
3035
3050
  CarbonMultiInputModule,
3036
3051
  InputLabelModule,
3037
3052
  NumberModule,
3038
- ], template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<cds-modal\n valtimoCdsModal\n *ngIf=\"{\n title:\n (modalMode === 'add' ? 'ikoManagement.addColumn' : 'ikoManagement.editColumn') | translate,\n } as state\"\n [open]=\"$openModal()\"\n [title]=\"state.title\"\n (close)=\"closeModal()\"\n>\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n <h3 cdsModalHeaderHeading>\n {{ state.title }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [cdsLayer]=\"1\" [formGroup]=\"form\" class=\"iko-column-form\">\n <cds-label>\n {{ 'ikoManagement.titleTitle' | translate }}\n\n <input\n [invalid]=\"title.dirty && title.invalid\"\n formControlName=\"title\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnTitlePlaceholder' | translate }}\"\n />\n </cds-label>\n\n <cds-label>\n {{ 'ikoManagement.keyTitle' | translate }}\n\n <input\n [invalid]=\"key.dirty && key.invalid\"\n formControlName=\"key\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnKeyPlaceholder' | translate }}\"\n />\n </cds-label>\n\n <cds-label>\n {{ 'ikoManagement.pathTitle' | translate }}\n\n <input\n [invalid]=\"path.dirty && path.invalid\"\n formControlName=\"path\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnPathPlaceholder' | translate }}\"\n />\n </cds-label>\n\n <cds-toggle\n formControlName=\"sortable\"\n [label]=\"'ikoManagement.sortableTitle' | translate\"\n [onText]=\"'ikoManagement.sortingEnabled' | translate\"\n [offText]=\"'ikoManagement.sortingDisabled' | translate\"\n ></cds-toggle>\n\n <v-select\n [invalid]=\"defaultSort.dirty && defaultSort.invalid\"\n formControlName=\"defaultSort\"\n [items]=\"sortSelectItems\"\n titleTranslationKey=\"ikoManagement.defaultSortTitle\"\n [appendInline]=\"false\"\n ></v-select>\n\n <v-select\n [invalid]=\"displayType.dirty && displayType.invalid\"\n formControlName=\"displayType\"\n [items]=\"displayTypeSelectItems\"\n titleTranslationKey=\"ikoManagement.displayType\"\n [appendInline]=\"false\"\n ></v-select>\n\n <v-input-label\n *ngIf=\"isDateDisplayType$ | async\"\n titleTranslationKey=\"listColumn.dateFormat\"\n tooltipTranslationKey=\"listColumn.dateFormatTooltip\"\n >\n <input cdsText formControlName=\"dateFormat\" />\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isBooleanDisplayType$ | async\"\n titleTranslationKey=\"listColumn.enumTitleOptional\"\n tooltipTranslationKey=\"listColumn.enumTooltipOptional\"\n >\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"booleanDisplayTypeParameters\"\n [hideAddButton]=\"true\"\n [hideDeleteButton]=\"true\"\n [maxRows]=\"1\"\n [keyColumnTitle]=\"'viewTypeConverter.Yes' | translate\"\n [valueColumnTitle]=\"'viewTypeConverter.No' | translate\"\n ></valtimo-carbon-multi-input>\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isEnumDisplayType$ | async\"\n titleTranslationKey=\"listColumn.enumTitle\"\n tooltipTranslationKey=\"listColumn.enumTooltip\"\n >\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"enumDisplayTypeParameters\"\n ></valtimo-carbon-multi-input>\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isTagsDisplayType$ | async\"\n titleTranslationKey=\"listColumn.tagAmount\"\n tooltipTranslationKey=\"listColumn.tagAmountTooltip\"\n >\n <cds-number formControlName=\"tagAmount\" [min]=\"1\" [step]=\"1\"></cds-number>\n </v-input-label>\n </form>\n\n <cds-modal-footer>\n <button cdsButton=\"ghost\" (click)=\"closeModal()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n [disabled]=\"form.invalid || form.disabled || !form.dirty\"\n cdsButton=\"primary\"\n (click)=\"addColumn()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".iko-column-form{display:flex;flex-direction:column;gap:16px;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"] }]
3053
+ AutoKeyInputComponent
3054
+ ], template: "<!--\n ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n ~\n ~ Licensed under EUPL, Version 1.2 (the \"License\");\n ~ you may not use this file except in compliance with the License.\n ~ You may obtain a copy of the License at\n ~\n ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n ~\n ~ Unless required by applicable law or agreed to in writing, software\n ~ distributed under the License is distributed on an \"AS IS\" basis,\n ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n ~ See the License for the specific language governing permissions and\n ~ limitations under the License.\n -->\n\n<cds-modal\n valtimoCdsModal\n *ngIf=\"{\n title:\n (modalMode === 'add' ? 'ikoManagement.addColumn' : 'ikoManagement.editColumn') | translate,\n } as state\"\n [open]=\"$openModal()\"\n [title]=\"state.title\"\n (close)=\"closeModal()\"\n>\n <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n <h3 cdsModalHeaderHeading>\n {{ state.title }}\n </h3>\n </cds-modal-header>\n\n <form cdsModalContent [cdsLayer]=\"1\" [formGroup]=\"form\" class=\"iko-column-form\">\n <cds-label>\n {{ 'ikoManagement.titleTitle' | translate }}\n\n <input\n [mode]=\"modalMode\"\n [invalid]=\"title.dirty && title.invalid\"\n formControlName=\"title\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnTitlePlaceholder' | translate }}\"\n />\n </cds-label>\n\n <valtimo-auto-key-input\n [mode]=\"modalMode\"\n [usedKeys]=\"usedKeys$ | async\"\n [sourceText]=\"title.value\"\n formControlName=\"key\"\n placeholderTranslationKey=\"ikoManagement.columnKeyPlaceholder\"\n >\n </valtimo-auto-key-input>\n\n <cds-label>\n {{ 'ikoManagement.pathTitle' | translate }}\n\n <input\n [invalid]=\"path.dirty && path.invalid\"\n formControlName=\"path\"\n cdsText\n placeholder=\"{{ 'ikoManagement.columnPathPlaceholder' | translate }}\"\n />\n </cds-label>\n\n <cds-toggle\n formControlName=\"sortable\"\n [label]=\"'ikoManagement.sortableTitle' | translate\"\n [onText]=\"'ikoManagement.sortingEnabled' | translate\"\n [offText]=\"'ikoManagement.sortingDisabled' | translate\"\n ></cds-toggle>\n\n <v-select\n [invalid]=\"defaultSort.dirty && defaultSort.invalid\"\n formControlName=\"defaultSort\"\n [items]=\"sortSelectItems\"\n titleTranslationKey=\"ikoManagement.defaultSortTitle\"\n [appendInline]=\"false\"\n ></v-select>\n\n <v-select\n [invalid]=\"displayType.dirty && displayType.invalid\"\n formControlName=\"displayType\"\n [items]=\"displayTypeSelectItems\"\n titleTranslationKey=\"ikoManagement.displayType\"\n [appendInline]=\"false\"\n ></v-select>\n\n <v-input-label\n *ngIf=\"isDateDisplayType$ | async\"\n titleTranslationKey=\"listColumn.dateFormat\"\n tooltipTranslationKey=\"listColumn.dateFormatTooltip\"\n >\n <input cdsText formControlName=\"dateFormat\" />\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isBooleanDisplayType$ | async\"\n titleTranslationKey=\"listColumn.enumTitleOptional\"\n tooltipTranslationKey=\"listColumn.enumTooltipOptional\"\n >\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"booleanDisplayTypeParameters\"\n [hideAddButton]=\"true\"\n [hideDeleteButton]=\"true\"\n [maxRows]=\"1\"\n [keyColumnTitle]=\"'viewTypeConverter.Yes' | translate\"\n [valueColumnTitle]=\"'viewTypeConverter.No' | translate\"\n ></valtimo-carbon-multi-input>\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isEnumDisplayType$ | async\"\n titleTranslationKey=\"listColumn.enumTitle\"\n tooltipTranslationKey=\"listColumn.enumTooltip\"\n >\n <valtimo-carbon-multi-input\n type=\"keyValue\"\n formControlName=\"enumDisplayTypeParameters\"\n ></valtimo-carbon-multi-input>\n </v-input-label>\n\n <v-input-label\n *ngIf=\"isTagsDisplayType$ | async\"\n titleTranslationKey=\"listColumn.tagAmount\"\n tooltipTranslationKey=\"listColumn.tagAmountTooltip\"\n >\n <cds-number formControlName=\"tagAmount\" [min]=\"1\" [step]=\"1\"></cds-number>\n </v-input-label>\n </form>\n\n <cds-modal-footer>\n <button cdsButton=\"ghost\" (click)=\"closeModal()\">\n {{ 'interface.cancel' | translate }}\n </button>\n\n <button\n [disabled]=\"form.invalid || form.disabled || !form.dirty\"\n cdsButton=\"primary\"\n (click)=\"addColumn()\"\n >\n {{ 'interface.save' | translate }}\n </button>\n </cds-modal-footer>\n</cds-modal>\n", styles: [".iko-column-form{display:flex;flex-direction:column;gap:16px;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"] }]
3039
3055
  }], ctorParameters: () => [{ type: IkoManagementApiService }, { type: i1$3.FormBuilder }, { type: i1$2.ActivatedRoute }], propDecorators: { openModal: [{
3040
3056
  type: Input
3041
3057
  }], listColumns: [{
@@ -4290,7 +4306,10 @@ class IkoSearchComponent {
4290
4306
  const value = values[param.key];
4291
4307
  if (value === null)
4292
4308
  continue;
4293
- if (typeof value === 'object' && value.start !== null && value.end !== null) {
4309
+ if (typeof value === 'object' &&
4310
+ !Array.isArray(value) &&
4311
+ value.start !== null &&
4312
+ value.end !== null) {
4294
4313
  queryParams[param.key] = JSON.stringify({
4295
4314
  rangeFrom: value.start,
4296
4315
  rangeTo: value.end,
@@ -4326,6 +4345,7 @@ class IkoSearchComponent {
4326
4345
  });
4327
4346
  }
4328
4347
  multipleValueChange(searchFieldKey, value, dataType) {
4348
+ this.formValues[searchFieldKey] = value;
4329
4349
  this.values$.pipe(take(1)).subscribe(values => {
4330
4350
  if (value && typeof value === 'object' && !Array.isArray(value)) {
4331
4351
  const hasStart = value.start !== undefined && value.start !== '';
@@ -4429,7 +4449,7 @@ class IkoSearchComponent {
4429
4449
  return false;
4430
4450
  }
4431
4451
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: IkoSearchComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i1$2.Router }, { token: i2$2.PageTitleService }, { token: i6.IconService }, { token: IkoApiService }, { token: i5.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
4432
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: IkoSearchComponent, isStandalone: true, selector: "valtimo-iko-search", 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 (ikoSearchActions$ | async; as ikoSearchActions) {\n @if (ikoSearchActions.length === 0) {\n <valtimo-no-results [title]=\"'iko.searchFieldsNoResults' | translate\"></valtimo-no-results>\n\n } @else {\n <h4>{{ 'iko.searchVia' | translate }}</h4>\n\n <cds-tabs class=\"iko-search-tabs\" type=\"line\">\n @for (param of ikoSearchActions; track param.key ?? param.fields?.[0]?.key) {\n <cds-tab\n (keyup.enter)=\"!searchDisabled(param.searchFields) && searchGroup(param.key, param.searchFields)\"\n class=\"query-group\"\n [heading]=\"param.title\"\n [cdsLayer]=\"1\"\n >\n <div class=\"query-group__row\">\n @for (field of param.searchFields; track field.key) {\n <div\n class=\"query-group__field\"\n [ngClass]=\"{\n 'query-group__field--time': field.dataType === 'time',\n 'query-group__field--date': field.dataType === 'date',\n 'query-group__field--datetime': field.dataType === 'datetime',\n }\"\n >\n <v-input-label *ngIf=\"field.title\" [title]=\"field.title\"></v-input-label>\n\n @if (field.dataType === 'text' && field.fieldType === 'single') {\n <v-input\n [dataTestId]=\"'iko-search-field-' + field.key\"\n [name]=\"field.key\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n [defaultValue]=\"formValues[field.key]\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-input>\n\n } @else if (field.dataType === 'text' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <v-input\n name=\"start\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n ></v-input>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <v-input\n name=\"end\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n ></v-input>\n </v-form>\n }\n @else if (field.dataType === 'number' && field.fieldType === 'single') {\n <v-input\n type=\"number\"\n [hideNumberSpinBox]=\"true\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-input>\n\n } @else if (field.dataType === 'number' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <v-input\n type=\"number\"\n name=\"start\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n ></v-input>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <v-input\n type=\"number\"\n name=\"end\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n ></v-input>\n </v-form>\n }\n @else if (field.dataType === 'boolean' && field.fieldType === 'single') {\n <v-select\n *ngIf=\"booleanItems$ | async as booleanItems\"\n [items]=\"booleanItems\"\n (selectedChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-select>\n }\n\n @else if (field.dataType === 'time' && field.fieldType === 'single') {\n <cds-timepicker\n [placeholder]=\"'searchFields.timePlaceholder' | translate\"\n [ngModel]=\"formValues[field.key]\"\n (ngModelChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></cds-timepicker>\n\n } @else if (field.dataType === 'time' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <cds-timepicker [(ngModel)]=\"formValues[field.key + '_start']\"></cds-timepicker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <cds-timepicker [(ngModel)]=\"formValues[field.key + '_end']\"></cds-timepicker>\n </v-form>\n }\n @else if (field.dataType === 'date' && field.fieldType === 'single') {\n <valtimo-date-time-picker\n [defaultDate]=\"formValues[field.key] ?? ''\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></valtimo-date-time-picker>\n\n } @else if (field.dataType === 'date' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <valtimo-date-time-picker\n name=\"start\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <valtimo-date-time-picker\n name=\"end\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n </v-form>\n }\n @else if (field.dataType === 'datetime' && field.fieldType === 'single') {\n <valtimo-date-time-picker\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></valtimo-date-time-picker>\n\n } @else if (field.dataType === 'datetime' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <valtimo-date-time-picker\n name=\"start\"\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <valtimo-date-time-picker\n name=\"end\"\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n </v-form>\n }\n </div>\n }\n </div>\n\n <button\n cdsButton=\"primary\"\n class=\"query-group__search-button\"\n [disabled]=\"searchDisabled(param.searchFields)\"\n (click)=\"searchGroup(param.key, param.searchFields)\"\n >\n {{ 'searchFields.searchButtonText' | translate }}\n <svg cdsIcon=\"search\" size=\"16\"></svg>\n </button>\n </cds-tab>\n }\n </cds-tabs>\n }\n}\n", styles: [":host{display:flex;flex-direction:column;gap:24px}.query-group__row{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end}.query-group__field{display:flex;flex-direction:column;flex:1 1 200px;max-width:320px}.query-group__field input{width:100%}.query-group__field--time,.query-group__field--date,.query-group__field--datetime{flex:0 0 auto;max-width:none}.query-group__label{font-size:14px;font-weight:600;color:var(--cds-text-primary)}.query-group__search-button{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;height:40px;max-height:40px;min-height:40px;padding:8px 16px;min-width:120px;white-space:nowrap;overflow:hidden;margin-left:auto}:host ::ng-deep .cds--tab-content{display:flex;flex-direction:column;gap:16px;outline:none!important;background:var(--cds-layer-01)}v-input{width:100%}::ng-deep .multiple-search-fields{display:flex!important;flex-direction:row!important;align-items:center}.to-text{margin-inline-start:8px;margin-inline-end:8px}.iko-datetime{display:flex;gap:8px;align-items:flex-end}::ng-deep .iko-search-tabs .cds--tab-content{margin-top:24px}\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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "smallMargin", "disabled", "step", "min", "maxLength", "tooltip", "required", "hideNumberSpinBox", "smallLabel", "rows", "clear$", "carbonTheme", "placeholder", "dataTestId", "trim", "presetsTitle", "presetOptions"], outputs: ["valueChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: InputModule }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i6.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: CarbonListModule }, { kind: "component", type: i2$2.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i6.Tabs, selector: "cds-tabs, ibm-tabs", inputs: ["position", "cacheActive", "followFocus", "isNavigation", "ariaLabel", "ariaLabelledby", "type", "theme", "skeleton"] }, { kind: "component", type: i6.Tab, selector: "cds-tab, ibm-tab", inputs: ["heading", "title", "context", "active", "disabled", "tabIndex", "id", "cacheActive", "tabContent", "templateContext"], outputs: ["selected"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i6.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i2$2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "dataTestId"], outputs: ["selectedChange"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "ngmodule", type: ParagraphModule }, { kind: "component", type: i2$2.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "ngmodule", type: TimePickerModule }, { kind: "component", type: i6.TimePicker, selector: "cds-timepicker, ibm-timepicker", inputs: ["invalid", "invalidText", "label", "hideLabel", "placeholder", "pattern", "id", "disabled", "value", "maxLength", "skeleton", "theme", "size"], outputs: ["valueChange"] }, { kind: "component", type: DateTimePickerComponent, selector: "valtimo-date-time-picker", inputs: ["fullWidth", "margin", "name", "title", "placeholder", "titleTranslationKey", "disabled", "tooltip", "required", "smallLabel", "enableTime", "carbonTheme", "dateFormat", "showFieldLabel", "datePlaceholder", "timePlaceholder", "labelText", "defaultDate", "defaultDateIsToday", "clear$"], outputs: ["valueChange"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i2$2.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: FormModule }, { kind: "component", type: i2$2.FormComponent, selector: "v-form", inputs: ["className"], outputs: ["valueChange"] }] }); }
4452
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: IkoSearchComponent, isStandalone: true, selector: "valtimo-iko-search", 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 (ikoSearchActions$ | async; as ikoSearchActions) {\n @if (ikoSearchActions.length === 0) {\n <valtimo-no-results [title]=\"'iko.searchFieldsNoResults' | translate\"></valtimo-no-results>\n\n } @else {\n <h4>{{ 'iko.searchVia' | translate }}</h4>\n\n <cds-tabs class=\"iko-search-tabs\" type=\"line\">\n @for (param of ikoSearchActions; track param.key ?? param.fields?.[0]?.key) {\n <cds-tab\n (keyup.enter)=\"!searchDisabled(param.searchFields) && searchGroup(param.key, param.searchFields)\"\n class=\"query-group\"\n [heading]=\"param.title\"\n [cdsLayer]=\"1\"\n >\n <div class=\"query-group__row\">\n @for (field of param.searchFields; track field.key) {\n <div\n class=\"query-group__field\"\n [ngClass]=\"{\n 'query-group__field--time': field.dataType === 'time',\n 'query-group__field--date': field.dataType === 'date',\n 'query-group__field--datetime': field.dataType === 'datetime',\n }\"\n >\n <v-input-label *ngIf=\"field.title\" [title]=\"field.title\"></v-input-label>\n\n @if (field.dataType === 'text' && field.fieldType === 'single') {\n <v-input\n [dataTestId]=\"'iko-search-field-' + field.key\"\n [name]=\"field.key\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n [defaultValue]=\"formValues[field.key]\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-input>\n\n } @else if (field.dataType === 'text' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <v-input\n name=\"start\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n ></v-input>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <v-input\n name=\"end\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n ></v-input>\n </v-form>\n }\n @else if (field.dataType === 'text' && (field.fieldType === 'single-select-dropdown' || field.fieldType === 'single_select_dropdown')) {\n <v-select\n *ngIf=\"dropdownSelectItemsMap[field.key]\"\n [items]=\"dropdownSelectItemsMap[field.key]\"\n [margin]=\"false\"\n [required]=\"field.required\"\n [name]=\"field.key\"\n [clearSelectionSubject$]=\"clear$\"\n (selectedChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n [appendInline]=\"false\"\n ></v-select>\n }\n @else if (field.dataType === 'text' && (field.fieldType === 'multi-select-dropdown' || field.fieldType === 'multi_select_dropdown')) {\n <v-select\n *ngIf=\"dropdownSelectItemsMap[field.key]\"\n [items]=\"dropdownSelectItemsMap[field.key]\"\n [margin]=\"false\"\n [multiple]=\"true\"\n [required]=\"field.required\"\n [name]=\"field.key\"\n [clearSelectionSubject$]=\"clear$\"\n (selectedChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n [appendInline]=\"false\"\n ></v-select>\n }\n @else if (field.dataType === 'number' && field.fieldType === 'single') {\n <v-input\n type=\"number\"\n [hideNumberSpinBox]=\"true\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-input>\n\n } @else if (field.dataType === 'number' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <v-input\n type=\"number\"\n name=\"start\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n ></v-input>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <v-input\n type=\"number\"\n name=\"end\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n ></v-input>\n </v-form>\n }\n @else if (field.dataType === 'boolean' && field.fieldType === 'single') {\n <v-select\n *ngIf=\"booleanItems$ | async as booleanItems\"\n [items]=\"booleanItems\"\n (selectedChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-select>\n }\n\n @else if (field.dataType === 'time' && field.fieldType === 'single') {\n <cds-timepicker\n [placeholder]=\"'searchFields.timePlaceholder' | translate\"\n [ngModel]=\"formValues[field.key]\"\n (ngModelChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></cds-timepicker>\n\n } @else if (field.dataType === 'time' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <cds-timepicker [(ngModel)]=\"formValues[field.key + '_start']\"></cds-timepicker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <cds-timepicker [(ngModel)]=\"formValues[field.key + '_end']\"></cds-timepicker>\n </v-form>\n }\n @else if (field.dataType === 'date' && field.fieldType === 'single') {\n <valtimo-date-time-picker\n [defaultDate]=\"formValues[field.key] ?? ''\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></valtimo-date-time-picker>\n\n } @else if (field.dataType === 'date' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <valtimo-date-time-picker\n name=\"start\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <valtimo-date-time-picker\n name=\"end\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n </v-form>\n }\n @else if (field.dataType === 'datetime' && field.fieldType === 'single') {\n <valtimo-date-time-picker\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></valtimo-date-time-picker>\n\n } @else if (field.dataType === 'datetime' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <valtimo-date-time-picker\n name=\"start\"\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <valtimo-date-time-picker\n name=\"end\"\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n </v-form>\n }\n </div>\n }\n </div>\n\n <button\n cdsButton=\"primary\"\n class=\"query-group__search-button\"\n [disabled]=\"searchDisabled(param.searchFields)\"\n (click)=\"searchGroup(param.key, param.searchFields)\"\n >\n {{ 'searchFields.searchButtonText' | translate }}\n <svg cdsIcon=\"search\" size=\"16\"></svg>\n </button>\n </cds-tab>\n }\n </cds-tabs>\n }\n}\n", styles: [":host{display:flex;flex-direction:column;gap:24px}.query-group__row{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end}.query-group__field{display:flex;flex-direction:column;flex:1 1 200px;max-width:320px}.query-group__field input{width:100%}.query-group__field--time,.query-group__field--date,.query-group__field--datetime{flex:0 0 auto;max-width:none}.query-group__label{font-size:14px;font-weight:600;color:var(--cds-text-primary)}.query-group__search-button{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;height:40px;max-height:40px;min-height:40px;padding:8px 16px;min-width:120px;white-space:nowrap;overflow:hidden;margin-left:auto}:host ::ng-deep .cds--tab-content{display:flex;flex-direction:column;gap:16px;outline:none!important;background:var(--cds-layer-01)}v-input{width:100%}::ng-deep .multiple-search-fields{display:flex!important;flex-direction:row!important;align-items:center}.to-text{margin-inline-start:8px;margin-inline-end:8px}.iko-datetime{display:flex;gap:8px;align-items:flex-end}::ng-deep .iko-search-tabs .cds--tab-content{margin-top:24px}\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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "smallMargin", "disabled", "step", "min", "maxLength", "tooltip", "required", "hideNumberSpinBox", "smallLabel", "rows", "clear$", "carbonTheme", "placeholder", "dataTestId", "trim", "presetsTitle", "presetOptions"], outputs: ["valueChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i6.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: InputModule }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i6.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: CarbonListModule }, { kind: "component", type: i2$2.CarbonNoResultsComponent, selector: "valtimo-no-results", inputs: ["action", "description", "illustration", "title", "smallPadding", "collapseVertically", "alwaysRenderVertically"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i6.Tabs, selector: "cds-tabs, ibm-tabs", inputs: ["position", "cacheActive", "followFocus", "isNavigation", "ariaLabel", "ariaLabelledby", "type", "theme", "skeleton"] }, { kind: "component", type: i6.Tab, selector: "cds-tab, ibm-tab", inputs: ["heading", "title", "context", "active", "disabled", "tabIndex", "id", "cacheActive", "tabContent", "templateContext"], outputs: ["selected"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i6.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "ngmodule", type: ParagraphModule }, { kind: "component", type: i2$2.ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "ngmodule", type: TimePickerModule }, { kind: "component", type: i6.TimePicker, selector: "cds-timepicker, ibm-timepicker", inputs: ["invalid", "invalidText", "label", "hideLabel", "placeholder", "pattern", "id", "disabled", "value", "maxLength", "skeleton", "theme", "size"], outputs: ["valueChange"] }, { kind: "component", type: DateTimePickerComponent, selector: "valtimo-date-time-picker", inputs: ["fullWidth", "margin", "name", "title", "placeholder", "titleTranslationKey", "disabled", "tooltip", "required", "smallLabel", "enableTime", "carbonTheme", "dateFormat", "showFieldLabel", "datePlaceholder", "timePlaceholder", "labelText", "defaultDate", "defaultDateIsToday", "clear$"], outputs: ["valueChange"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i2$2.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: FormModule }, { kind: "component", type: i2$2.FormComponent, selector: "v-form", inputs: ["className"], outputs: ["valueChange"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i2$2.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "dataTestId"], outputs: ["selectedChange"] }] }); }
4433
4453
  }
4434
4454
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: IkoSearchComponent, decorators: [{
4435
4455
  type: Component,
@@ -4446,7 +4466,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
4446
4466
  TabsModule,
4447
4467
  LayerModule,
4448
4468
  AsyncPipe,
4449
- SelectModule,
4450
4469
  DatePickerModule,
4451
4470
  NgIf,
4452
4471
  NgClass,
@@ -4456,7 +4475,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImpo
4456
4475
  InputLabelModule,
4457
4476
  InputModule$1,
4458
4477
  FormModule,
4459
- ], 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 (ikoSearchActions$ | async; as ikoSearchActions) {\n @if (ikoSearchActions.length === 0) {\n <valtimo-no-results [title]=\"'iko.searchFieldsNoResults' | translate\"></valtimo-no-results>\n\n } @else {\n <h4>{{ 'iko.searchVia' | translate }}</h4>\n\n <cds-tabs class=\"iko-search-tabs\" type=\"line\">\n @for (param of ikoSearchActions; track param.key ?? param.fields?.[0]?.key) {\n <cds-tab\n (keyup.enter)=\"!searchDisabled(param.searchFields) && searchGroup(param.key, param.searchFields)\"\n class=\"query-group\"\n [heading]=\"param.title\"\n [cdsLayer]=\"1\"\n >\n <div class=\"query-group__row\">\n @for (field of param.searchFields; track field.key) {\n <div\n class=\"query-group__field\"\n [ngClass]=\"{\n 'query-group__field--time': field.dataType === 'time',\n 'query-group__field--date': field.dataType === 'date',\n 'query-group__field--datetime': field.dataType === 'datetime',\n }\"\n >\n <v-input-label *ngIf=\"field.title\" [title]=\"field.title\"></v-input-label>\n\n @if (field.dataType === 'text' && field.fieldType === 'single') {\n <v-input\n [dataTestId]=\"'iko-search-field-' + field.key\"\n [name]=\"field.key\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n [defaultValue]=\"formValues[field.key]\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-input>\n\n } @else if (field.dataType === 'text' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <v-input\n name=\"start\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n ></v-input>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <v-input\n name=\"end\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n ></v-input>\n </v-form>\n }\n @else if (field.dataType === 'number' && field.fieldType === 'single') {\n <v-input\n type=\"number\"\n [hideNumberSpinBox]=\"true\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-input>\n\n } @else if (field.dataType === 'number' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <v-input\n type=\"number\"\n name=\"start\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n ></v-input>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <v-input\n type=\"number\"\n name=\"end\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n ></v-input>\n </v-form>\n }\n @else if (field.dataType === 'boolean' && field.fieldType === 'single') {\n <v-select\n *ngIf=\"booleanItems$ | async as booleanItems\"\n [items]=\"booleanItems\"\n (selectedChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-select>\n }\n\n @else if (field.dataType === 'time' && field.fieldType === 'single') {\n <cds-timepicker\n [placeholder]=\"'searchFields.timePlaceholder' | translate\"\n [ngModel]=\"formValues[field.key]\"\n (ngModelChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></cds-timepicker>\n\n } @else if (field.dataType === 'time' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <cds-timepicker [(ngModel)]=\"formValues[field.key + '_start']\"></cds-timepicker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <cds-timepicker [(ngModel)]=\"formValues[field.key + '_end']\"></cds-timepicker>\n </v-form>\n }\n @else if (field.dataType === 'date' && field.fieldType === 'single') {\n <valtimo-date-time-picker\n [defaultDate]=\"formValues[field.key] ?? ''\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></valtimo-date-time-picker>\n\n } @else if (field.dataType === 'date' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <valtimo-date-time-picker\n name=\"start\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <valtimo-date-time-picker\n name=\"end\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n </v-form>\n }\n @else if (field.dataType === 'datetime' && field.fieldType === 'single') {\n <valtimo-date-time-picker\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></valtimo-date-time-picker>\n\n } @else if (field.dataType === 'datetime' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <valtimo-date-time-picker\n name=\"start\"\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <valtimo-date-time-picker\n name=\"end\"\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n </v-form>\n }\n </div>\n }\n </div>\n\n <button\n cdsButton=\"primary\"\n class=\"query-group__search-button\"\n [disabled]=\"searchDisabled(param.searchFields)\"\n (click)=\"searchGroup(param.key, param.searchFields)\"\n >\n {{ 'searchFields.searchButtonText' | translate }}\n <svg cdsIcon=\"search\" size=\"16\"></svg>\n </button>\n </cds-tab>\n }\n </cds-tabs>\n }\n}\n", styles: [":host{display:flex;flex-direction:column;gap:24px}.query-group__row{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end}.query-group__field{display:flex;flex-direction:column;flex:1 1 200px;max-width:320px}.query-group__field input{width:100%}.query-group__field--time,.query-group__field--date,.query-group__field--datetime{flex:0 0 auto;max-width:none}.query-group__label{font-size:14px;font-weight:600;color:var(--cds-text-primary)}.query-group__search-button{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;height:40px;max-height:40px;min-height:40px;padding:8px 16px;min-width:120px;white-space:nowrap;overflow:hidden;margin-left:auto}:host ::ng-deep .cds--tab-content{display:flex;flex-direction:column;gap:16px;outline:none!important;background:var(--cds-layer-01)}v-input{width:100%}::ng-deep .multiple-search-fields{display:flex!important;flex-direction:row!important;align-items:center}.to-text{margin-inline-start:8px;margin-inline-end:8px}.iko-datetime{display:flex;gap:8px;align-items:flex-end}::ng-deep .iko-search-tabs .cds--tab-content{margin-top:24px}\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"] }]
4478
+ SelectModule,
4479
+ ], 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 (ikoSearchActions$ | async; as ikoSearchActions) {\n @if (ikoSearchActions.length === 0) {\n <valtimo-no-results [title]=\"'iko.searchFieldsNoResults' | translate\"></valtimo-no-results>\n\n } @else {\n <h4>{{ 'iko.searchVia' | translate }}</h4>\n\n <cds-tabs class=\"iko-search-tabs\" type=\"line\">\n @for (param of ikoSearchActions; track param.key ?? param.fields?.[0]?.key) {\n <cds-tab\n (keyup.enter)=\"!searchDisabled(param.searchFields) && searchGroup(param.key, param.searchFields)\"\n class=\"query-group\"\n [heading]=\"param.title\"\n [cdsLayer]=\"1\"\n >\n <div class=\"query-group__row\">\n @for (field of param.searchFields; track field.key) {\n <div\n class=\"query-group__field\"\n [ngClass]=\"{\n 'query-group__field--time': field.dataType === 'time',\n 'query-group__field--date': field.dataType === 'date',\n 'query-group__field--datetime': field.dataType === 'datetime',\n }\"\n >\n <v-input-label *ngIf=\"field.title\" [title]=\"field.title\"></v-input-label>\n\n @if (field.dataType === 'text' && field.fieldType === 'single') {\n <v-input\n [dataTestId]=\"'iko-search-field-' + field.key\"\n [name]=\"field.key\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n [defaultValue]=\"formValues[field.key]\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-input>\n\n } @else if (field.dataType === 'text' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <v-input\n name=\"start\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n ></v-input>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <v-input\n name=\"end\"\n [placeholder]=\"'searchFields.textPlaceholder' | translate\"\n ></v-input>\n </v-form>\n }\n @else if (field.dataType === 'text' && (field.fieldType === 'single-select-dropdown' || field.fieldType === 'single_select_dropdown')) {\n <v-select\n *ngIf=\"dropdownSelectItemsMap[field.key]\"\n [items]=\"dropdownSelectItemsMap[field.key]\"\n [margin]=\"false\"\n [required]=\"field.required\"\n [name]=\"field.key\"\n [clearSelectionSubject$]=\"clear$\"\n (selectedChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n [appendInline]=\"false\"\n ></v-select>\n }\n @else if (field.dataType === 'text' && (field.fieldType === 'multi-select-dropdown' || field.fieldType === 'multi_select_dropdown')) {\n <v-select\n *ngIf=\"dropdownSelectItemsMap[field.key]\"\n [items]=\"dropdownSelectItemsMap[field.key]\"\n [margin]=\"false\"\n [multiple]=\"true\"\n [required]=\"field.required\"\n [name]=\"field.key\"\n [clearSelectionSubject$]=\"clear$\"\n (selectedChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n [appendInline]=\"false\"\n ></v-select>\n }\n @else if (field.dataType === 'number' && field.fieldType === 'single') {\n <v-input\n type=\"number\"\n [hideNumberSpinBox]=\"true\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-input>\n\n } @else if (field.dataType === 'number' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <v-input\n type=\"number\"\n name=\"start\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n ></v-input>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <v-input\n type=\"number\"\n name=\"end\"\n [placeholder]=\"'searchFields.numberPlaceholder' | translate\"\n ></v-input>\n </v-form>\n }\n @else if (field.dataType === 'boolean' && field.fieldType === 'single') {\n <v-select\n *ngIf=\"booleanItems$ | async as booleanItems\"\n [items]=\"booleanItems\"\n (selectedChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></v-select>\n }\n\n @else if (field.dataType === 'time' && field.fieldType === 'single') {\n <cds-timepicker\n [placeholder]=\"'searchFields.timePlaceholder' | translate\"\n [ngModel]=\"formValues[field.key]\"\n (ngModelChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></cds-timepicker>\n\n } @else if (field.dataType === 'time' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <cds-timepicker [(ngModel)]=\"formValues[field.key + '_start']\"></cds-timepicker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <cds-timepicker [(ngModel)]=\"formValues[field.key + '_end']\"></cds-timepicker>\n </v-form>\n }\n @else if (field.dataType === 'date' && field.fieldType === 'single') {\n <valtimo-date-time-picker\n [defaultDate]=\"formValues[field.key] ?? ''\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></valtimo-date-time-picker>\n\n } @else if (field.dataType === 'date' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <valtimo-date-time-picker\n name=\"start\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <valtimo-date-time-picker\n name=\"end\"\n [enableTime]=\"false\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n </v-form>\n }\n @else if (field.dataType === 'datetime' && field.fieldType === 'single') {\n <valtimo-date-time-picker\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n (valueChange)=\"singleValueChange(field.key, $event, field.dataType)\"\n ></valtimo-date-time-picker>\n\n } @else if (field.dataType === 'datetime' && field.fieldType === 'range') {\n <v-form\n className=\"multiple-search-fields\"\n (valueChange)=\"multipleValueChange(field.key, $event, field.dataType)\"\n >\n <valtimo-date-time-picker\n name=\"start\"\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n\n <div class=\"to-text\">\n <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n </div>\n\n <valtimo-date-time-picker\n name=\"end\"\n [enableTime]=\"true\"\n [showFieldLabel]=\"false\"\n ></valtimo-date-time-picker>\n </v-form>\n }\n </div>\n }\n </div>\n\n <button\n cdsButton=\"primary\"\n class=\"query-group__search-button\"\n [disabled]=\"searchDisabled(param.searchFields)\"\n (click)=\"searchGroup(param.key, param.searchFields)\"\n >\n {{ 'searchFields.searchButtonText' | translate }}\n <svg cdsIcon=\"search\" size=\"16\"></svg>\n </button>\n </cds-tab>\n }\n </cds-tabs>\n }\n}\n", styles: [":host{display:flex;flex-direction:column;gap:24px}.query-group__row{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end}.query-group__field{display:flex;flex-direction:column;flex:1 1 200px;max-width:320px}.query-group__field input{width:100%}.query-group__field--time,.query-group__field--date,.query-group__field--datetime{flex:0 0 auto;max-width:none}.query-group__label{font-size:14px;font-weight:600;color:var(--cds-text-primary)}.query-group__search-button{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;height:40px;max-height:40px;min-height:40px;padding:8px 16px;min-width:120px;white-space:nowrap;overflow:hidden;margin-left:auto}:host ::ng-deep .cds--tab-content{display:flex;flex-direction:column;gap:16px;outline:none!important;background:var(--cds-layer-01)}v-input{width:100%}::ng-deep .multiple-search-fields{display:flex!important;flex-direction:row!important;align-items:center}.to-text{margin-inline-start:8px;margin-inline-end:8px}.iko-datetime{display:flex;gap:8px;align-items:flex-end}::ng-deep .iko-search-tabs .cds--tab-content{margin-top:24px}\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"] }]
4460
4480
  }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: i1$2.Router }, { type: i2$2.PageTitleService }, { type: i6.IconService }, { type: IkoApiService }, { type: i5.TranslateService }] });
4461
4481
 
4462
4482
  /*