@valtimo/process-link 13.24.0 → 13.25.0

package/fesm2022/valtimo-process-link.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { Injectable, InjectionToken, Optional, Inject, Component, EventEmitter, Output, Input, ViewChild, ChangeDetectionStrategy, NgModule, ViewContainerRef } from '@angular/core';
-import { catchError, of, BehaviorSubject, combineLatest, map, Subject, switchMap, filter, Subscription, startWith, mergeMap, tap, withLatestFrom as withLatestFrom$1, take as take$1, shareReplay, distinctUntilChanged } from 'rxjs';
+import { catchError, of, BehaviorSubject, combineLatest, map, Subject, switchMap, filter, Subscription, forkJoin, startWith, mergeMap, tap, withLatestFrom as withLatestFrom$1, take as take$1, shareReplay, distinctUntilChanged } from 'rxjs';
 import * as i2 from '@angular/common/http';
 import { HttpHeaders, HttpParams } from '@angular/common/http';
 import * as i1 from '@valtimo/shared';
@@ -740,6 +740,36 @@ const formSizeToCarbonModalSizeMap = {
 };
 const UNSUPPORTED_PROCESS_LINK_TYPES_IN_BUILDING_BLOCK = ['ui-component'];
 
+/*
+ * Copyright 2015-2026 Ritense BV, the Netherlands.
+ *
+ * Licensed under EUPL, Version 1.2 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+const BB_MAPPINGS_TEST_IDS = {
+    inputSection: 'bbMappingsInputSection',
+    outputSection: 'bbMappingsOutputSection',
+    addInputButton: 'bbMappingsAddInputButton',
+    addOutputButton: 'bbMappingsAddOutputButton',
+    inputRow: 'bbMappingsInputRow',
+    outputRow: 'bbMappingsOutputRow',
+    inputDeleteButton: 'bbMappingsInputDeleteButton',
+    outputDeleteButton: 'bbMappingsOutputDeleteButton',
+    inputRequiredIndicator: 'bbMappingsInputRequiredIndicator',
+    inputRequiredTargetLabel: 'bbMappingsInputRequiredTargetLabel',
+    inputTargetSelectWrapper: 'bbMappingsInputTargetSelectWrapper',
+    outputSourceSelectWrapper: 'bbMappingsOutputSourceSelectWrapper',
+};
+
 /*
  * Copyright 2015-2025 Ritense BV, the Netherlands.
  *
@@ -1877,18 +1907,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
  * limitations under the License.
  */
 class SelectPluginActionComponent {
-    constructor(buttonService, pluginManagementService, stateService, stepService, processLinkStateService) {
+    constructor(buttonService, injector, pluginManagementService, pluginService, stateService, stepService, processLinkStateService) {
         this.buttonService = buttonService;
+        this.injector = injector;
         this.pluginManagementService = pluginManagementService;
+        this.pluginService = pluginService;
         this.stateService = stateService;
         this.stepService = stepService;
         this.processLinkStateService = processLinkStateService;
         this.pluginFunctions$ = combineLatest([
             this.stateService.selectedPluginDefinition$,
             this.processLinkStateService.modalParams$,
-        ]).pipe(switchMap$1(([selectedDefinition, modalParams]) => selectedDefinition
-            ? this.pluginManagementService.getPluginFunctions(selectedDefinition.key, modalParams.element.activityListenerType)
-            : of(undefined)));
+            this.stateService.selectedPluginConfiguration$,
+            this.pluginService.pluginSpecifications$,
+        ]).pipe(switchMap$1(([selectedDefinition, modalParams, selectedConfiguration, pluginSpecifications]) => {
+            if (!selectedDefinition)
+                return of(undefined);
+            return this.pluginManagementService
+                .getPluginFunctions(selectedDefinition.key, modalParams.element.activityListenerType)
+                .pipe(switchMap$1(functions => {
+                const specification = pluginSpecifications.find(s => s.pluginId === selectedDefinition.key);
+                if (!specification?.functionConfigurationComponentsFilter)
+                    return of(functions);
+                const props = (selectedConfiguration?.properties ?? {});
+                const filterFn = specification.functionConfigurationComponentsFilter;
+                return forkJoin(functions.map(fn => filterFn(props, fn.key, this.injector).pipe(map$1(visible => ({ fn, visible }))))).pipe(map$1(results => results.filter(r => r.visible).map(r => r.fn)));
+            }));
+        }));
         this.selectedPluginDefinition$ = this.stateService.selectedPluginDefinition$;
         this.selectedPluginFunction$ = this.stateService.selectedPluginFunction$;
         this._subscriptions = new Subscription();
@@ -1924,13 +1969,13 @@ class SelectPluginActionComponent {
             this.stepService.setConfigurePluginActionSteps();
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SelectPluginActionComponent, deps: [{ token: ProcessLinkButtonService }, { token: i1$1.PluginManagementService }, { token: PluginStateService }, { token: ProcessLinkStepService }, { token: ProcessLinkStateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SelectPluginActionComponent, deps: [{ token: ProcessLinkButtonService }, { token: i0.Injector }, { token: i1$1.PluginManagementService }, { token: i1$1.PluginService }, { token: PluginStateService }, { token: ProcessLinkStepService }, { token: ProcessLinkStateService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SelectPluginActionComponent, isStandalone: false, selector: "valtimo-select-plugin-action", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container *ngIf=\"pluginFunctions$ | async as pluginFunctions; else loading\">\n  <div class=\"choose-plugin-action\" *ngIf=\"pluginFunctions?.length > 0\">\n    <p class=\"step-description\">\n      {{ 'processLinkConfiguration.choosePluginActionDescription' | translate }}\n    </p>\n    <div class=\"action-tiles\">\n      <cds-tile-group\n        [multiple]=\"false\"\n        *ngIf=\"{selectedPluginDefinition: selectedPluginDefinition$ | async} as obs\"\n        (selected)=\"selected($event)\"\n      >\n        <cds-selection-tile\n          *ngFor=\"let pluginFunction of pluginFunctions\"\n          [value]=\"stringify(pluginFunction)\"\n          [selected]=\"false\"\n          >{{\n            pluginFunction.key | pluginTranslate: obs.selectedPluginDefinition.key | async\n          }}</cds-selection-tile\n        >\n      </cds-tile-group>\n    </div>\n  </div>\n  <ng-container *ngIf=\"!pluginFunctions || pluginFunctions?.length === 0\">\n    <ng-container *ngTemplateOutlet=\"noPluginFunctionsTemplate\"> </ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #noPluginFunctionsTemplate>\n  <p class=\"step-description\">\n    {{ 'processLink.noPluginFunctions' | translate }}\n  </p>\n</ng-template>\n\n<ng-template #loading>\n  <div class=\"loading-container\">\n    <cds-loading></cds-loading>\n  </div>\n</ng-template>\n", styles: [".btn-back{position:absolute}.cards-container{display:flex;flex-flow:row wrap;width:100%}.card{width:calc(33.3% - 20px);margin-right:30px}.card:nth-child(3n+3){margin-right:0}.card-header{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.loading-container{display:flex;justify-content:center;margin-top:40px;flex-direction:row}.action-tiles{margin-top:24px;width:calc(100% + 8px);margin-left:-8px}::ng-deep .choose-plugin-action cds-selection-tile{display:flex;width:calc(33.3% - 8px)}::ng-deep .choose-plugin-action .cds--tile{width:100%}::ng-deep .choose-plugin-action cds-tile-group fieldset{display:flex;flex-direction:row;flex-wrap:wrap}::ng-deep .choose-plugin-action cds-selection-tile{margin-left:8px}::ng-deep .choose-plugin-action cds-selection-tile:nth-child(n+4){margin-top:8px}::ng-deep .action-tiles .cds--tile{background-color:var(--cds-layer-02, #ffffff)}::ng-deep .action-tiles .cds--tile:hover{background:var(--cds-layer-hover)}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.Loading, selector: "cds-loading, ibm-loading", inputs: ["title", "isActive", "size", "overlay"] }, { kind: "component", type: i4.SelectionTile, selector: "cds-selection-tile, ibm-selection-tile", inputs: ["theme", "id", "selected", "value", "disabled"], outputs: ["change"] }, { kind: "component", type: i4.TileGroup, selector: "cds-tile-group, ibm-tile-group", inputs: ["name", "multiple", "legend"], outputs: ["selected"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1$1.PluginTranslatePipe, name: "pluginTranslate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SelectPluginActionComponent, decorators: [{
             type: Component,
             args: [{ standalone: false, selector: 'valtimo-select-plugin-action', template: "<!--\n  ~ Copyright 2015-2025 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n<ng-container *ngIf=\"pluginFunctions$ | async as pluginFunctions; else loading\">\n  <div class=\"choose-plugin-action\" *ngIf=\"pluginFunctions?.length > 0\">\n    <p class=\"step-description\">\n      {{ 'processLinkConfiguration.choosePluginActionDescription' | translate }}\n    </p>\n    <div class=\"action-tiles\">\n      <cds-tile-group\n        [multiple]=\"false\"\n        *ngIf=\"{selectedPluginDefinition: selectedPluginDefinition$ | async} as obs\"\n        (selected)=\"selected($event)\"\n      >\n        <cds-selection-tile\n          *ngFor=\"let pluginFunction of pluginFunctions\"\n          [value]=\"stringify(pluginFunction)\"\n          [selected]=\"false\"\n          >{{\n            pluginFunction.key | pluginTranslate: obs.selectedPluginDefinition.key | async\n          }}</cds-selection-tile\n        >\n      </cds-tile-group>\n    </div>\n  </div>\n  <ng-container *ngIf=\"!pluginFunctions || pluginFunctions?.length === 0\">\n    <ng-container *ngTemplateOutlet=\"noPluginFunctionsTemplate\"> </ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #noPluginFunctionsTemplate>\n  <p class=\"step-description\">\n    {{ 'processLink.noPluginFunctions' | translate }}\n  </p>\n</ng-template>\n\n<ng-template #loading>\n  <div class=\"loading-container\">\n    <cds-loading></cds-loading>\n  </div>\n</ng-template>\n", styles: [".btn-back{position:absolute}.cards-container{display:flex;flex-flow:row wrap;width:100%}.card{width:calc(33.3% - 20px);margin-right:30px}.card:nth-child(3n+3){margin-right:0}.card-header{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.loading-container{display:flex;justify-content:center;margin-top:40px;flex-direction:row}.action-tiles{margin-top:24px;width:calc(100% + 8px);margin-left:-8px}::ng-deep .choose-plugin-action cds-selection-tile{display:flex;width:calc(33.3% - 8px)}::ng-deep .choose-plugin-action .cds--tile{width:100%}::ng-deep .choose-plugin-action cds-tile-group fieldset{display:flex;flex-direction:row;flex-wrap:wrap}::ng-deep .choose-plugin-action cds-selection-tile{margin-left:8px}::ng-deep .choose-plugin-action cds-selection-tile:nth-child(n+4){margin-top:8px}::ng-deep .action-tiles .cds--tile{background-color:var(--cds-layer-02, #ffffff)}::ng-deep .action-tiles .cds--tile:hover{background:var(--cds-layer-hover)}\n/*!\n * Copyright 2015-2025 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
-        }], ctorParameters: () => [{ type: ProcessLinkButtonService }, { type: i1$1.PluginManagementService }, { type: PluginStateService }, { type: ProcessLinkStepService }, { type: ProcessLinkStateService }] });
+        }], ctorParameters: () => [{ type: ProcessLinkButtonService }, { type: i0.Injector }, { type: i1$1.PluginManagementService }, { type: i1$1.PluginService }, { type: PluginStateService }, { type: ProcessLinkStepService }, { type: ProcessLinkStateService }] });
 
 /*
  * Copyright 2015-2025 Ritense BV, the Netherlands.
@@ -2470,6 +2515,7 @@ class ConfigureBuildingBlockMappingsComponent {
         this.changeDetectorRef = changeDetectorRef;
         this.buildingBlockApiService = buildingBlockApiService;
         this.stateService = stateService;
+        this.testIds = BB_MAPPINGS_TEST_IDS;
         this.buildingBlockFields$ = this.buildingBlockStateService.buildingBlockFields$;
         this.buildingBlockFieldItems$ = this.buildingBlockFields$.pipe(map$1(buildingBlockFields => buildingBlockFields.map(buildingBlockField => {
             return {
@@ -2927,7 +2973,7 @@ class ConfigureBuildingBlockMappingsComponent {
         return fields.some(field => field.required && field.name === target);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ConfigureBuildingBlockMappingsComponent, deps: [{ token: i1$2.FormBuilder }, { token: BuildingBlockStateService }, { token: ProcessLinkButtonService }, { token: ProcessLinkStepService }, { token: ProcessLinkService }, { token: ProcessLinkStateService }, { token: i3.TranslateService }, { token: i3$2.ActivatedRoute }, { token: i0.ChangeDetectorRef }, { token: ProcessLinkBuildingBlockApiService }, { token: ProcessLinkStateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ConfigureBuildingBlockMappingsComponent, isStandalone: true, selector: "valtimo-configure-building-block-mappings", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n@let obs =\n  {\n    fields: (buildingBlockFields$ | async),\n    fieldItems: (buildingBlockFieldItems$ | async),\n    params: (params$ | async),\n    buildingBlockParams: (buildingBlockParams$ | async),\n    sourceContextName: (sourceContextName$ | async),\n    targetBuildingBlockName: (targetBuildingBlockName$ | async),\n    sourceIsCase: (sourceIsCase$ | async),\n    sourceIsIndependent: (sourceIsIndependent$ | async),\n    caseLabelTranslation: ('Case' | translate),\n    processLabelTranslation: ('processLinkConfiguration.buildingBlock.process' | translate),\n    buildingBlockLabelTranslation:\n      ('processLinkConfiguration.buildingBlock.selectLabel' | translate),\n  };\n\n<div class=\"mapping-step\">\n  <section class=\"mapping-section\">\n    <h4 class=\"section-header\">\n      {{ 'processLinkConfiguration.buildingBlock.inputTitle' | translate }}\n    </h4>\n\n    <div class=\"mapping-table\" [formGroup]=\"inputsForm\">\n      <div class=\"mapping-header input\">\n        <v-input-label\n          [title]=\"\n            (obs.sourceIsIndependent\n              ? obs.processLabelTranslation\n              : obs.sourceIsCase\n                ? obs.caseLabelTranslation\n                : obs.buildingBlockLabelTranslation) +\n            (obs.sourceIsIndependent ? '' : ': ' + obs.sourceContextName)\n          \"\n        />\n\n        <v-input-label\n          [title]=\"obs.buildingBlockLabelTranslation + ': ' + obs.targetBuildingBlockName\"\n        />\n      </div>\n\n      <div formArrayName=\"inputs\">\n        @for (group of inputs.controls; let inputIndex = $index; track inputIndex) {\n          <div class=\"mapping-row input\" [formGroup]=\"group\">\n            <div class=\"mapping-part\">\n              @if (obs.sourceIsIndependent) {\n                <input [cdsLayer]=\"2\" cdsText formControlName=\"source\" [placeholder]=\"'pv:'\" />\n              } @else {\n                <valtimo-value-path-selector\n                  [cdsLayer]=\"2\"\n                  [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [buildingBlockDefinitionKey]=\"obs.buildingBlockParams?.buildingBlockDefinitionKey\"\n                  [buildingBlockDefinitionVersionTag]=\"\n                    obs.buildingBlockParams?.buildingBlockDefinitionVersionTag\n                  \"\n                  [appendInline]=\"false\"\n                  [dropUp]=\"false\"\n                  [formControl]=\"group.get('source')\"\n                ></valtimo-value-path-selector>\n              }\n\n              <div class=\"arrow\">\u2192</div>\n            </div>\n\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\">\n                @if (isRequiredTarget(obs.fields, group.get('target')?.value)) {\n                  <div class=\"required-target\">\n                    {{ 'doc:' + group.get('target')?.value }}\n                  </div>\n                } @else {\n                  <v-select\n                    [cdsLayer]=\"2\"\n                    [appendInline]=\"false\"\n                    formControlName=\"target\"\n                    [placeholder]=\"\n                      'processLinkConfiguration.buildingBlock.selectedBuildingBlockFieldPlaceholder'\n                        | translate\n                    \"\n                    [items]=\"getBuildingBlockFieldItemsForRow$(group) | async\"\n                    [dropUp]=\"false\"\n                  >\n                  </v-select>\n                }\n              </div>\n\n              <div class=\"mapping-cell-actions\">\n                @if (!isRequiredTarget(obs.fields, group.get('target')?.value)) {\n                  <button\n                    cdsButton=\"danger--ghost\"\n                    iconOnly\n                    size=\"sm\"\n                    (click)=\"deleteInput(inputIndex)\"\n                  >\n                    <svg cdsIcon=\"trash-can\" class=\"cds--btn__icon\" size=\"16\"></svg>\n                  </button>\n                } @else {\n                  <div class=\"required-indicator\">*</div>\n\n                  <div>\n                    {{ 'interface.required' | translate }}\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <button\n      cdsButton=\"tertiary\"\n      size=\"sm\"\n      (click)=\"addInput()\"\n      [title]=\"'processLinkConfiguration.buildingBlock.addInput' | translate\"\n      [disabled]=\"allInputsMapped$ | async\"\n    >\n      {{ 'processLinkConfiguration.buildingBlock.addInput' | translate }}\n\n      <svg cdsIcon=\"add\" class=\"cds--btn__icon\" size=\"16\"></svg>\n    </button>\n  </section>\n\n  <section class=\"mapping-section\">\n    <h4 class=\"section-header\">\n      {{ 'processLinkConfiguration.buildingBlock.outputTitle' | translate }}\n    </h4>\n\n    <div class=\"mapping-table\" [formGroup]=\"outputsForm\">\n      <div class=\"mapping-header output\">\n        <v-input-label\n          [title]=\"obs.buildingBlockLabelTranslation + ': ' + obs.targetBuildingBlockName\"\n        />\n\n        <v-input-label\n          [title]=\"\n            (obs.sourceIsIndependent\n              ? obs.processLabelTranslation\n              : obs.sourceIsCase\n                ? obs.caseLabelTranslation\n                : obs.buildingBlockLabelTranslation) +\n            (obs.sourceIsIndependent ? '' : ': ' + obs.sourceContextName)\n          \"\n        />\n\n        <div class=\"sync-options\" [style.display]=\"'none'\">\n          <v-input-label\n            [title]=\"'processLinkConfiguration.buildingBlock.sync.title' | translate\"\n          />\n        </div>\n      </div>\n\n      <div formArrayName=\"outputs\">\n        @for (group of outputs.controls; let outputIndex = $index; track outputIndex) {\n          <div class=\"mapping-row output\" [formGroup]=\"group\">\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\">\n                <v-select\n                  [cdsLayer]=\"2\"\n                  [appendInline]=\"false\"\n                  formControlName=\"source\"\n                  [items]=\"obs.fieldItems || []\"\n                  [placeholder]=\"\n                    'processLinkConfiguration.buildingBlock.selectedBuildingBlockFieldPlaceholder'\n                      | translate\n                  \"\n                  [dropUp]=\"true\"\n                >\n                </v-select>\n              </div>\n\n              <div class=\"arrow\">\u2192</div>\n            </div>\n\n            <div class=\"mapping-part\">\n              @if (obs.sourceIsIndependent) {\n                <input [cdsLayer]=\"2\" cdsText formControlName=\"target\" [placeholder]=\"'pv:'\" />\n              } @else {\n                <valtimo-value-path-selector\n                  [cdsLayer]=\"2\"\n                  [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [buildingBlockDefinitionKey]=\"obs.buildingBlockParams?.buildingBlockDefinitionKey\"\n                  [buildingBlockDefinitionVersionTag]=\"\n                    obs.buildingBlockParams?.buildingBlockDefinitionVersionTag\n                  \"\n                  [formControl]=\"group.get('target')\"\n                  [appendInline]=\"false\"\n                  [filterItems]=\"getUsedCaseTargetsForRow$(group) | async\"\n                  [dropUp]=\"true\"\n                ></valtimo-value-path-selector>\n              }\n            </div>\n\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\" [style.display]=\"'none'\">\n                <cds-radio-group\n                  class=\"sync-radio-group\"\n                  formControlName=\"syncTiming\"\n                  [attr.name]=\"'syncTiming-' + outputIndex\"\n                >\n                  @for (item of syncTimingItems; track item.id) {\n                    <cds-radio [value]=\"item.id\" [checked]=\"isSyncTimingSelected(group, item.id)\">\n                      {{ item.labelKey | translate }}\n                    </cds-radio>\n                  }\n                </cds-radio-group>\n              </div>\n\n              <div class=\"mapping-cell-actions\">\n                <button\n                  cdsButton=\"danger--ghost\"\n                  iconOnly\n                  size=\"sm\"\n                  (click)=\"deleteOutput(outputIndex)\"\n                >\n                  <svg cdsIcon=\"trash-can\" class=\"cds--btn__icon\" size=\"16\"></svg>\n                </button>\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <button\n      cdsButton=\"tertiary\"\n      size=\"sm\"\n      (click)=\"addOutput()\"\n      [title]=\"'processLinkConfiguration.buildingBlock.addOutput' | translate\"\n    >\n      {{ 'processLinkConfiguration.buildingBlock.addOutput' | translate }}\n\n      <svg cdsIcon=\"add\" class=\"cds--btn__icon\" size=\"16\"></svg>\n    </button>\n  </section>\n</div>\n", styles: [".section-header{font-size:14px;line-height:18px;font-weight:600}.mapping-section{margin-bottom:16px}.mapping-row,.mapping-header{display:grid;align-items:center}.mapping-row.input,.mapping-header.input{grid-template-columns:1fr 1fr}.mapping-row.output,.mapping-header.output{grid-template-columns:5fr 6fr 58px}.mapping-header .output .sync-options{padding-left:10px;display:flex}.mapping-row{margin-bottom:8px;padding:8px;background-color:var(--cds-layer)}.mapping-row .mapping-part{display:flex}.mapping-row .arrow{text-align:center;width:40px;line-height:40px;font-size:large}.mapping-row .mapping-cell{flex:1;min-width:0}.mapping-row .mapping-cell-actions{display:flex;align-self:flex-end;text-transform:capitalize;margin-left:10px}.mapping-row .mapping-cell-actions .required-indicator{margin:0 5px;color:var(--cds-text-error)}.mapping-row .mapping-cell-actions button{margin-bottom:5px}.mapping-row .mapping-cell-actions button ::ng-deep .cds--btn__icon{margin:0!important}.mapping-row .sync-radio-group{padding-left:10px;margin-top:8px}.mapping-row .sync-radio-group .sync-radio:first-child{margin-right:0}.mapping-row .sync-radio-group ::ng-deep .cds--radio-button__label{justify-content:normal}::ng-deep .process-link-modal-container .cds--modal-container{max-width:1280px}\n/*!\n * Copyright 2015-2026 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "ngmodule", type: RadioModule }, { kind: "component", type: i4.Radio, selector: "cds-radio, ibm-radio", inputs: ["checked", "name", "disabled", "labelPlacement", "ariaLabelledby", "ariaLabel", "required", "value", "skeleton", "id"], outputs: ["change"] }, { kind: "component", type: i4.RadioGroup, selector: "cds-radio-group, ibm-radio-group", inputs: ["selected", "value", "name", "disabled", "skeleton", "orientation", "labelPlacement", "legend", "ariaLabel", "ariaLabelledby", "helperText", "invalid", "invalidText", "warn", "warnText"], outputs: ["change"] }, { kind: "ngmodule", type: InputModule }, { kind: "directive", type: i4.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i2$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i4.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i2$1.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "warn", "warnText", "dataTestId"], outputs: ["selectedChange"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i4.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ConfigureBuildingBlockMappingsComponent, isStandalone: true, selector: "valtimo-configure-building-block-mappings", ngImport: i0, template: "<!--\n  ~ Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n@let obs =\n  {\n    fields: (buildingBlockFields$ | async),\n    fieldItems: (buildingBlockFieldItems$ | async),\n    params: (params$ | async),\n    buildingBlockParams: (buildingBlockParams$ | async),\n    sourceContextName: (sourceContextName$ | async),\n    targetBuildingBlockName: (targetBuildingBlockName$ | async),\n    sourceIsCase: (sourceIsCase$ | async),\n    sourceIsIndependent: (sourceIsIndependent$ | async),\n    caseLabelTranslation: ('Case' | translate),\n    processLabelTranslation: ('processLinkConfiguration.buildingBlock.process' | translate),\n    buildingBlockLabelTranslation:\n      ('processLinkConfiguration.buildingBlock.selectLabel' | translate),\n  };\n\n<div class=\"mapping-step\">\n  <section class=\"mapping-section\" [attr.data-test-id]=\"testIds.inputSection\">\n    <h4 class=\"section-header\">\n      {{ 'processLinkConfiguration.buildingBlock.inputTitle' | translate }}\n    </h4>\n\n    <div class=\"mapping-table\" [formGroup]=\"inputsForm\">\n      <div class=\"mapping-header input\">\n        <v-input-label\n          [title]=\"\n            (obs.sourceIsIndependent\n              ? obs.processLabelTranslation\n              : obs.sourceIsCase\n                ? obs.caseLabelTranslation\n                : obs.buildingBlockLabelTranslation) +\n            (obs.sourceIsIndependent ? '' : ': ' + obs.sourceContextName)\n          \"\n        />\n\n        <v-input-label\n          [title]=\"obs.buildingBlockLabelTranslation + ': ' + obs.targetBuildingBlockName\"\n        />\n      </div>\n\n      <div formArrayName=\"inputs\">\n        @for (group of inputs.controls; let inputIndex = $index; track inputIndex) {\n          <div\n            class=\"mapping-row input\"\n            [formGroup]=\"group\"\n            [attr.data-test-id]=\"testIds.inputRow\"\n          >\n            <div class=\"mapping-part\">\n              @if (obs.sourceIsIndependent) {\n                <input [cdsLayer]=\"2\" cdsText formControlName=\"source\" [placeholder]=\"'pv:'\" />\n              } @else {\n                <valtimo-value-path-selector\n                  [cdsLayer]=\"2\"\n                  [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [buildingBlockDefinitionKey]=\"obs.buildingBlockParams?.buildingBlockDefinitionKey\"\n                  [buildingBlockDefinitionVersionTag]=\"\n                    obs.buildingBlockParams?.buildingBlockDefinitionVersionTag\n                  \"\n                  [appendInline]=\"false\"\n                  [dropUp]=\"false\"\n                  [formControl]=\"group.get('source')\"\n                ></valtimo-value-path-selector>\n              }\n\n              <div class=\"arrow\">\u2192</div>\n            </div>\n\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\" [attr.data-test-id]=\"testIds.inputTargetSelectWrapper\">\n                @if (isRequiredTarget(obs.fields, group.get('target')?.value)) {\n                  <div class=\"required-target\" [attr.data-test-id]=\"testIds.inputRequiredTargetLabel\">\n                    {{ 'doc:' + group.get('target')?.value }}\n                  </div>\n                } @else {\n                  <v-select\n                    [cdsLayer]=\"2\"\n                    [appendInline]=\"false\"\n                    formControlName=\"target\"\n                    [placeholder]=\"\n                      'processLinkConfiguration.buildingBlock.selectedBuildingBlockFieldPlaceholder'\n                        | translate\n                    \"\n                    [items]=\"getBuildingBlockFieldItemsForRow$(group) | async\"\n                    [dropUp]=\"false\"\n                  >\n                  </v-select>\n                }\n              </div>\n\n              <div class=\"mapping-cell-actions\">\n                @if (!isRequiredTarget(obs.fields, group.get('target')?.value)) {\n                  <button\n                    cdsButton=\"danger--ghost\"\n                    iconOnly\n                    size=\"sm\"\n                    (click)=\"deleteInput(inputIndex)\"\n                    [attr.data-test-id]=\"testIds.inputDeleteButton\"\n                  >\n                    <svg cdsIcon=\"trash-can\" class=\"cds--btn__icon\" size=\"16\"></svg>\n                  </button>\n                } @else {\n                  <div class=\"required-indicator\" [attr.data-test-id]=\"testIds.inputRequiredIndicator\">\n                    *\n                  </div>\n\n                  <div>\n                    {{ 'interface.required' | translate }}\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <button\n      cdsButton=\"tertiary\"\n      size=\"sm\"\n      (click)=\"addInput()\"\n      [title]=\"'processLinkConfiguration.buildingBlock.addInput' | translate\"\n      [disabled]=\"allInputsMapped$ | async\"\n      [attr.data-test-id]=\"testIds.addInputButton\"\n    >\n      {{ 'processLinkConfiguration.buildingBlock.addInput' | translate }}\n\n      <svg cdsIcon=\"add\" class=\"cds--btn__icon\" size=\"16\"></svg>\n    </button>\n  </section>\n\n  <section class=\"mapping-section\" [attr.data-test-id]=\"testIds.outputSection\">\n    <h4 class=\"section-header\">\n      {{ 'processLinkConfiguration.buildingBlock.outputTitle' | translate }}\n    </h4>\n\n    <div class=\"mapping-table\" [formGroup]=\"outputsForm\">\n      <div class=\"mapping-header output\">\n        <v-input-label\n          [title]=\"obs.buildingBlockLabelTranslation + ': ' + obs.targetBuildingBlockName\"\n        />\n\n        <v-input-label\n          [title]=\"\n            (obs.sourceIsIndependent\n              ? obs.processLabelTranslation\n              : obs.sourceIsCase\n                ? obs.caseLabelTranslation\n                : obs.buildingBlockLabelTranslation) +\n            (obs.sourceIsIndependent ? '' : ': ' + obs.sourceContextName)\n          \"\n        />\n\n        <div class=\"sync-options\" [style.display]=\"'none'\">\n          <v-input-label\n            [title]=\"'processLinkConfiguration.buildingBlock.sync.title' | translate\"\n          />\n        </div>\n      </div>\n\n      <div formArrayName=\"outputs\">\n        @for (group of outputs.controls; let outputIndex = $index; track outputIndex) {\n          <div\n            class=\"mapping-row output\"\n            [formGroup]=\"group\"\n            [attr.data-test-id]=\"testIds.outputRow\"\n          >\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\" [attr.data-test-id]=\"testIds.outputSourceSelectWrapper\">\n                <v-select\n                  [cdsLayer]=\"2\"\n                  [appendInline]=\"false\"\n                  formControlName=\"source\"\n                  [items]=\"obs.fieldItems || []\"\n                  [placeholder]=\"\n                    'processLinkConfiguration.buildingBlock.selectedBuildingBlockFieldPlaceholder'\n                      | translate\n                  \"\n                  [dropUp]=\"true\"\n                >\n                </v-select>\n              </div>\n\n              <div class=\"arrow\">\u2192</div>\n            </div>\n\n            <div class=\"mapping-part\">\n              @if (obs.sourceIsIndependent) {\n                <input [cdsLayer]=\"2\" cdsText formControlName=\"target\" [placeholder]=\"'pv:'\" />\n              } @else {\n                <valtimo-value-path-selector\n                  [cdsLayer]=\"2\"\n                  [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [buildingBlockDefinitionKey]=\"obs.buildingBlockParams?.buildingBlockDefinitionKey\"\n                  [buildingBlockDefinitionVersionTag]=\"\n                    obs.buildingBlockParams?.buildingBlockDefinitionVersionTag\n                  \"\n                  [formControl]=\"group.get('target')\"\n                  [appendInline]=\"false\"\n                  [filterItems]=\"getUsedCaseTargetsForRow$(group) | async\"\n                  [dropUp]=\"true\"\n                ></valtimo-value-path-selector>\n              }\n            </div>\n\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\" [style.display]=\"'none'\">\n                <cds-radio-group\n                  class=\"sync-radio-group\"\n                  formControlName=\"syncTiming\"\n                  [attr.name]=\"'syncTiming-' + outputIndex\"\n                >\n                  @for (item of syncTimingItems; track item.id) {\n                    <cds-radio [value]=\"item.id\" [checked]=\"isSyncTimingSelected(group, item.id)\">\n                      {{ item.labelKey | translate }}\n                    </cds-radio>\n                  }\n                </cds-radio-group>\n              </div>\n\n              <div class=\"mapping-cell-actions\">\n                <button\n                  cdsButton=\"danger--ghost\"\n                  iconOnly\n                  size=\"sm\"\n                  (click)=\"deleteOutput(outputIndex)\"\n                  [attr.data-test-id]=\"testIds.outputDeleteButton\"\n                >\n                  <svg cdsIcon=\"trash-can\" class=\"cds--btn__icon\" size=\"16\"></svg>\n                </button>\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <button\n      cdsButton=\"tertiary\"\n      size=\"sm\"\n      (click)=\"addOutput()\"\n      [title]=\"'processLinkConfiguration.buildingBlock.addOutput' | translate\"\n      [attr.data-test-id]=\"testIds.addOutputButton\"\n    >\n      {{ 'processLinkConfiguration.buildingBlock.addOutput' | translate }}\n\n      <svg cdsIcon=\"add\" class=\"cds--btn__icon\" size=\"16\"></svg>\n    </button>\n  </section>\n</div>\n", styles: [".section-header{font-size:14px;line-height:18px;font-weight:600}.mapping-section{margin-bottom:16px}.mapping-row,.mapping-header{display:grid;align-items:center}.mapping-row.input,.mapping-header.input{grid-template-columns:1fr 1fr}.mapping-row.output,.mapping-header.output{grid-template-columns:5fr 6fr 58px}.mapping-header .output .sync-options{padding-left:10px;display:flex}.mapping-row{margin-bottom:8px;padding:8px;background-color:var(--cds-layer)}.mapping-row .mapping-part{display:flex}.mapping-row .arrow{text-align:center;width:40px;line-height:40px;font-size:large}.mapping-row .mapping-cell{flex:1;min-width:0}.mapping-row .mapping-cell-actions{display:flex;align-self:flex-end;text-transform:capitalize;margin-left:10px}.mapping-row .mapping-cell-actions .required-indicator{margin:0 5px;color:var(--cds-text-error)}.mapping-row .mapping-cell-actions button{margin-bottom:5px}.mapping-row .mapping-cell-actions button ::ng-deep .cds--btn__icon{margin:0!important}.mapping-row .sync-radio-group{padding-left:10px;margin-top:8px}.mapping-row .sync-radio-group .sync-radio:first-child{margin-right:0}.mapping-row .sync-radio-group ::ng-deep .cds--radio-button__label{justify-content:normal}::ng-deep .process-link-modal-container .cds--modal-container{max-width:1280px}\n/*!\n * Copyright 2015-2026 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "ngmodule", type: RadioModule }, { kind: "component", type: i4.Radio, selector: "cds-radio, ibm-radio", inputs: ["checked", "name", "disabled", "labelPlacement", "ariaLabelledby", "ariaLabel", "required", "value", "skeleton", "id"], outputs: ["change"] }, { kind: "component", type: i4.RadioGroup, selector: "cds-radio-group, ibm-radio-group", inputs: ["selected", "value", "name", "disabled", "skeleton", "orientation", "labelPlacement", "legend", "ariaLabel", "ariaLabelledby", "helperText", "invalid", "invalidText", "warn", "warnText"], outputs: ["change"] }, { kind: "ngmodule", type: InputModule }, { kind: "directive", type: i4.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: i2$1.InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i4.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i2$1.SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "warn", "warnText", "dataTestId"], outputs: ["selectedChange"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i4.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ConfigureBuildingBlockMappingsComponent, decorators: [{
             type: Component,
@@ -2944,7 +2990,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                         IconModule,
                         SelectModule,
                         LayerModule,
-                    ], template: "<!--\n  ~ Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n@let obs =\n  {\n    fields: (buildingBlockFields$ | async),\n    fieldItems: (buildingBlockFieldItems$ | async),\n    params: (params$ | async),\n    buildingBlockParams: (buildingBlockParams$ | async),\n    sourceContextName: (sourceContextName$ | async),\n    targetBuildingBlockName: (targetBuildingBlockName$ | async),\n    sourceIsCase: (sourceIsCase$ | async),\n    sourceIsIndependent: (sourceIsIndependent$ | async),\n    caseLabelTranslation: ('Case' | translate),\n    processLabelTranslation: ('processLinkConfiguration.buildingBlock.process' | translate),\n    buildingBlockLabelTranslation:\n      ('processLinkConfiguration.buildingBlock.selectLabel' | translate),\n  };\n\n<div class=\"mapping-step\">\n  <section class=\"mapping-section\">\n    <h4 class=\"section-header\">\n      {{ 'processLinkConfiguration.buildingBlock.inputTitle' | translate }}\n    </h4>\n\n    <div class=\"mapping-table\" [formGroup]=\"inputsForm\">\n      <div class=\"mapping-header input\">\n        <v-input-label\n          [title]=\"\n            (obs.sourceIsIndependent\n              ? obs.processLabelTranslation\n              : obs.sourceIsCase\n                ? obs.caseLabelTranslation\n                : obs.buildingBlockLabelTranslation) +\n            (obs.sourceIsIndependent ? '' : ': ' + obs.sourceContextName)\n          \"\n        />\n\n        <v-input-label\n          [title]=\"obs.buildingBlockLabelTranslation + ': ' + obs.targetBuildingBlockName\"\n        />\n      </div>\n\n      <div formArrayName=\"inputs\">\n        @for (group of inputs.controls; let inputIndex = $index; track inputIndex) {\n          <div class=\"mapping-row input\" [formGroup]=\"group\">\n            <div class=\"mapping-part\">\n              @if (obs.sourceIsIndependent) {\n                <input [cdsLayer]=\"2\" cdsText formControlName=\"source\" [placeholder]=\"'pv:'\" />\n              } @else {\n                <valtimo-value-path-selector\n                  [cdsLayer]=\"2\"\n                  [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [buildingBlockDefinitionKey]=\"obs.buildingBlockParams?.buildingBlockDefinitionKey\"\n                  [buildingBlockDefinitionVersionTag]=\"\n                    obs.buildingBlockParams?.buildingBlockDefinitionVersionTag\n                  \"\n                  [appendInline]=\"false\"\n                  [dropUp]=\"false\"\n                  [formControl]=\"group.get('source')\"\n                ></valtimo-value-path-selector>\n              }\n\n              <div class=\"arrow\">\u2192</div>\n            </div>\n\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\">\n                @if (isRequiredTarget(obs.fields, group.get('target')?.value)) {\n                  <div class=\"required-target\">\n                    {{ 'doc:' + group.get('target')?.value }}\n                  </div>\n                } @else {\n                  <v-select\n                    [cdsLayer]=\"2\"\n                    [appendInline]=\"false\"\n                    formControlName=\"target\"\n                    [placeholder]=\"\n                      'processLinkConfiguration.buildingBlock.selectedBuildingBlockFieldPlaceholder'\n                        | translate\n                    \"\n                    [items]=\"getBuildingBlockFieldItemsForRow$(group) | async\"\n                    [dropUp]=\"false\"\n                  >\n                  </v-select>\n                }\n              </div>\n\n              <div class=\"mapping-cell-actions\">\n                @if (!isRequiredTarget(obs.fields, group.get('target')?.value)) {\n                  <button\n                    cdsButton=\"danger--ghost\"\n                    iconOnly\n                    size=\"sm\"\n                    (click)=\"deleteInput(inputIndex)\"\n                  >\n                    <svg cdsIcon=\"trash-can\" class=\"cds--btn__icon\" size=\"16\"></svg>\n                  </button>\n                } @else {\n                  <div class=\"required-indicator\">*</div>\n\n                  <div>\n                    {{ 'interface.required' | translate }}\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <button\n      cdsButton=\"tertiary\"\n      size=\"sm\"\n      (click)=\"addInput()\"\n      [title]=\"'processLinkConfiguration.buildingBlock.addInput' | translate\"\n      [disabled]=\"allInputsMapped$ | async\"\n    >\n      {{ 'processLinkConfiguration.buildingBlock.addInput' | translate }}\n\n      <svg cdsIcon=\"add\" class=\"cds--btn__icon\" size=\"16\"></svg>\n    </button>\n  </section>\n\n  <section class=\"mapping-section\">\n    <h4 class=\"section-header\">\n      {{ 'processLinkConfiguration.buildingBlock.outputTitle' | translate }}\n    </h4>\n\n    <div class=\"mapping-table\" [formGroup]=\"outputsForm\">\n      <div class=\"mapping-header output\">\n        <v-input-label\n          [title]=\"obs.buildingBlockLabelTranslation + ': ' + obs.targetBuildingBlockName\"\n        />\n\n        <v-input-label\n          [title]=\"\n            (obs.sourceIsIndependent\n              ? obs.processLabelTranslation\n              : obs.sourceIsCase\n                ? obs.caseLabelTranslation\n                : obs.buildingBlockLabelTranslation) +\n            (obs.sourceIsIndependent ? '' : ': ' + obs.sourceContextName)\n          \"\n        />\n\n        <div class=\"sync-options\" [style.display]=\"'none'\">\n          <v-input-label\n            [title]=\"'processLinkConfiguration.buildingBlock.sync.title' | translate\"\n          />\n        </div>\n      </div>\n\n      <div formArrayName=\"outputs\">\n        @for (group of outputs.controls; let outputIndex = $index; track outputIndex) {\n          <div class=\"mapping-row output\" [formGroup]=\"group\">\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\">\n                <v-select\n                  [cdsLayer]=\"2\"\n                  [appendInline]=\"false\"\n                  formControlName=\"source\"\n                  [items]=\"obs.fieldItems || []\"\n                  [placeholder]=\"\n                    'processLinkConfiguration.buildingBlock.selectedBuildingBlockFieldPlaceholder'\n                      | translate\n                  \"\n                  [dropUp]=\"true\"\n                >\n                </v-select>\n              </div>\n\n              <div class=\"arrow\">\u2192</div>\n            </div>\n\n            <div class=\"mapping-part\">\n              @if (obs.sourceIsIndependent) {\n                <input [cdsLayer]=\"2\" cdsText formControlName=\"target\" [placeholder]=\"'pv:'\" />\n              } @else {\n                <valtimo-value-path-selector\n                  [cdsLayer]=\"2\"\n                  [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [buildingBlockDefinitionKey]=\"obs.buildingBlockParams?.buildingBlockDefinitionKey\"\n                  [buildingBlockDefinitionVersionTag]=\"\n                    obs.buildingBlockParams?.buildingBlockDefinitionVersionTag\n                  \"\n                  [formControl]=\"group.get('target')\"\n                  [appendInline]=\"false\"\n                  [filterItems]=\"getUsedCaseTargetsForRow$(group) | async\"\n                  [dropUp]=\"true\"\n                ></valtimo-value-path-selector>\n              }\n            </div>\n\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\" [style.display]=\"'none'\">\n                <cds-radio-group\n                  class=\"sync-radio-group\"\n                  formControlName=\"syncTiming\"\n                  [attr.name]=\"'syncTiming-' + outputIndex\"\n                >\n                  @for (item of syncTimingItems; track item.id) {\n                    <cds-radio [value]=\"item.id\" [checked]=\"isSyncTimingSelected(group, item.id)\">\n                      {{ item.labelKey | translate }}\n                    </cds-radio>\n                  }\n                </cds-radio-group>\n              </div>\n\n              <div class=\"mapping-cell-actions\">\n                <button\n                  cdsButton=\"danger--ghost\"\n                  iconOnly\n                  size=\"sm\"\n                  (click)=\"deleteOutput(outputIndex)\"\n                >\n                  <svg cdsIcon=\"trash-can\" class=\"cds--btn__icon\" size=\"16\"></svg>\n                </button>\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <button\n      cdsButton=\"tertiary\"\n      size=\"sm\"\n      (click)=\"addOutput()\"\n      [title]=\"'processLinkConfiguration.buildingBlock.addOutput' | translate\"\n    >\n      {{ 'processLinkConfiguration.buildingBlock.addOutput' | translate }}\n\n      <svg cdsIcon=\"add\" class=\"cds--btn__icon\" size=\"16\"></svg>\n    </button>\n  </section>\n</div>\n", styles: [".section-header{font-size:14px;line-height:18px;font-weight:600}.mapping-section{margin-bottom:16px}.mapping-row,.mapping-header{display:grid;align-items:center}.mapping-row.input,.mapping-header.input{grid-template-columns:1fr 1fr}.mapping-row.output,.mapping-header.output{grid-template-columns:5fr 6fr 58px}.mapping-header .output .sync-options{padding-left:10px;display:flex}.mapping-row{margin-bottom:8px;padding:8px;background-color:var(--cds-layer)}.mapping-row .mapping-part{display:flex}.mapping-row .arrow{text-align:center;width:40px;line-height:40px;font-size:large}.mapping-row .mapping-cell{flex:1;min-width:0}.mapping-row .mapping-cell-actions{display:flex;align-self:flex-end;text-transform:capitalize;margin-left:10px}.mapping-row .mapping-cell-actions .required-indicator{margin:0 5px;color:var(--cds-text-error)}.mapping-row .mapping-cell-actions button{margin-bottom:5px}.mapping-row .mapping-cell-actions button ::ng-deep .cds--btn__icon{margin:0!important}.mapping-row .sync-radio-group{padding-left:10px;margin-top:8px}.mapping-row .sync-radio-group .sync-radio:first-child{margin-right:0}.mapping-row .sync-radio-group ::ng-deep .cds--radio-button__label{justify-content:normal}::ng-deep .process-link-modal-container .cds--modal-container{max-width:1280px}\n/*!\n * Copyright 2015-2026 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
+                    ], template: "<!--\n  ~ Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~\n  ~ Licensed under EUPL, Version 1.2 (the \"License\");\n  ~ you may not use this file except in compliance with the License.\n  ~ You may obtain a copy of the License at\n  ~\n  ~ https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~\n  ~ Unless required by applicable law or agreed to in writing, software\n  ~ distributed under the License is distributed on an \"AS IS\" basis,\n  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~ See the License for the specific language governing permissions and\n  ~ limitations under the License.\n  -->\n\n@let obs =\n  {\n    fields: (buildingBlockFields$ | async),\n    fieldItems: (buildingBlockFieldItems$ | async),\n    params: (params$ | async),\n    buildingBlockParams: (buildingBlockParams$ | async),\n    sourceContextName: (sourceContextName$ | async),\n    targetBuildingBlockName: (targetBuildingBlockName$ | async),\n    sourceIsCase: (sourceIsCase$ | async),\n    sourceIsIndependent: (sourceIsIndependent$ | async),\n    caseLabelTranslation: ('Case' | translate),\n    processLabelTranslation: ('processLinkConfiguration.buildingBlock.process' | translate),\n    buildingBlockLabelTranslation:\n      ('processLinkConfiguration.buildingBlock.selectLabel' | translate),\n  };\n\n<div class=\"mapping-step\">\n  <section class=\"mapping-section\" [attr.data-test-id]=\"testIds.inputSection\">\n    <h4 class=\"section-header\">\n      {{ 'processLinkConfiguration.buildingBlock.inputTitle' | translate }}\n    </h4>\n\n    <div class=\"mapping-table\" [formGroup]=\"inputsForm\">\n      <div class=\"mapping-header input\">\n        <v-input-label\n          [title]=\"\n            (obs.sourceIsIndependent\n              ? obs.processLabelTranslation\n              : obs.sourceIsCase\n                ? obs.caseLabelTranslation\n                : obs.buildingBlockLabelTranslation) +\n            (obs.sourceIsIndependent ? '' : ': ' + obs.sourceContextName)\n          \"\n        />\n\n        <v-input-label\n          [title]=\"obs.buildingBlockLabelTranslation + ': ' + obs.targetBuildingBlockName\"\n        />\n      </div>\n\n      <div formArrayName=\"inputs\">\n        @for (group of inputs.controls; let inputIndex = $index; track inputIndex) {\n          <div\n            class=\"mapping-row input\"\n            [formGroup]=\"group\"\n            [attr.data-test-id]=\"testIds.inputRow\"\n          >\n            <div class=\"mapping-part\">\n              @if (obs.sourceIsIndependent) {\n                <input [cdsLayer]=\"2\" cdsText formControlName=\"source\" [placeholder]=\"'pv:'\" />\n              } @else {\n                <valtimo-value-path-selector\n                  [cdsLayer]=\"2\"\n                  [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [buildingBlockDefinitionKey]=\"obs.buildingBlockParams?.buildingBlockDefinitionKey\"\n                  [buildingBlockDefinitionVersionTag]=\"\n                    obs.buildingBlockParams?.buildingBlockDefinitionVersionTag\n                  \"\n                  [appendInline]=\"false\"\n                  [dropUp]=\"false\"\n                  [formControl]=\"group.get('source')\"\n                ></valtimo-value-path-selector>\n              }\n\n              <div class=\"arrow\">\u2192</div>\n            </div>\n\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\" [attr.data-test-id]=\"testIds.inputTargetSelectWrapper\">\n                @if (isRequiredTarget(obs.fields, group.get('target')?.value)) {\n                  <div class=\"required-target\" [attr.data-test-id]=\"testIds.inputRequiredTargetLabel\">\n                    {{ 'doc:' + group.get('target')?.value }}\n                  </div>\n                } @else {\n                  <v-select\n                    [cdsLayer]=\"2\"\n                    [appendInline]=\"false\"\n                    formControlName=\"target\"\n                    [placeholder]=\"\n                      'processLinkConfiguration.buildingBlock.selectedBuildingBlockFieldPlaceholder'\n                        | translate\n                    \"\n                    [items]=\"getBuildingBlockFieldItemsForRow$(group) | async\"\n                    [dropUp]=\"false\"\n                  >\n                  </v-select>\n                }\n              </div>\n\n              <div class=\"mapping-cell-actions\">\n                @if (!isRequiredTarget(obs.fields, group.get('target')?.value)) {\n                  <button\n                    cdsButton=\"danger--ghost\"\n                    iconOnly\n                    size=\"sm\"\n                    (click)=\"deleteInput(inputIndex)\"\n                    [attr.data-test-id]=\"testIds.inputDeleteButton\"\n                  >\n                    <svg cdsIcon=\"trash-can\" class=\"cds--btn__icon\" size=\"16\"></svg>\n                  </button>\n                } @else {\n                  <div class=\"required-indicator\" [attr.data-test-id]=\"testIds.inputRequiredIndicator\">\n                    *\n                  </div>\n\n                  <div>\n                    {{ 'interface.required' | translate }}\n                  </div>\n                }\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <button\n      cdsButton=\"tertiary\"\n      size=\"sm\"\n      (click)=\"addInput()\"\n      [title]=\"'processLinkConfiguration.buildingBlock.addInput' | translate\"\n      [disabled]=\"allInputsMapped$ | async\"\n      [attr.data-test-id]=\"testIds.addInputButton\"\n    >\n      {{ 'processLinkConfiguration.buildingBlock.addInput' | translate }}\n\n      <svg cdsIcon=\"add\" class=\"cds--btn__icon\" size=\"16\"></svg>\n    </button>\n  </section>\n\n  <section class=\"mapping-section\" [attr.data-test-id]=\"testIds.outputSection\">\n    <h4 class=\"section-header\">\n      {{ 'processLinkConfiguration.buildingBlock.outputTitle' | translate }}\n    </h4>\n\n    <div class=\"mapping-table\" [formGroup]=\"outputsForm\">\n      <div class=\"mapping-header output\">\n        <v-input-label\n          [title]=\"obs.buildingBlockLabelTranslation + ': ' + obs.targetBuildingBlockName\"\n        />\n\n        <v-input-label\n          [title]=\"\n            (obs.sourceIsIndependent\n              ? obs.processLabelTranslation\n              : obs.sourceIsCase\n                ? obs.caseLabelTranslation\n                : obs.buildingBlockLabelTranslation) +\n            (obs.sourceIsIndependent ? '' : ': ' + obs.sourceContextName)\n          \"\n        />\n\n        <div class=\"sync-options\" [style.display]=\"'none'\">\n          <v-input-label\n            [title]=\"'processLinkConfiguration.buildingBlock.sync.title' | translate\"\n          />\n        </div>\n      </div>\n\n      <div formArrayName=\"outputs\">\n        @for (group of outputs.controls; let outputIndex = $index; track outputIndex) {\n          <div\n            class=\"mapping-row output\"\n            [formGroup]=\"group\"\n            [attr.data-test-id]=\"testIds.outputRow\"\n          >\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\" [attr.data-test-id]=\"testIds.outputSourceSelectWrapper\">\n                <v-select\n                  [cdsLayer]=\"2\"\n                  [appendInline]=\"false\"\n                  formControlName=\"source\"\n                  [items]=\"obs.fieldItems || []\"\n                  [placeholder]=\"\n                    'processLinkConfiguration.buildingBlock.selectedBuildingBlockFieldPlaceholder'\n                      | translate\n                  \"\n                  [dropUp]=\"true\"\n                >\n                </v-select>\n              </div>\n\n              <div class=\"arrow\">\u2192</div>\n            </div>\n\n            <div class=\"mapping-part\">\n              @if (obs.sourceIsIndependent) {\n                <input [cdsLayer]=\"2\" cdsText formControlName=\"target\" [placeholder]=\"'pv:'\" />\n              } @else {\n                <valtimo-value-path-selector\n                  [cdsLayer]=\"2\"\n                  [prefixes]=\"[ValuePathSelectorPrefix.DOC, ValuePathSelectorPrefix.CASE]\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [buildingBlockDefinitionKey]=\"obs.buildingBlockParams?.buildingBlockDefinitionKey\"\n                  [buildingBlockDefinitionVersionTag]=\"\n                    obs.buildingBlockParams?.buildingBlockDefinitionVersionTag\n                  \"\n                  [formControl]=\"group.get('target')\"\n                  [appendInline]=\"false\"\n                  [filterItems]=\"getUsedCaseTargetsForRow$(group) | async\"\n                  [dropUp]=\"true\"\n                ></valtimo-value-path-selector>\n              }\n            </div>\n\n            <div class=\"mapping-part\">\n              <div class=\"mapping-cell\" [style.display]=\"'none'\">\n                <cds-radio-group\n                  class=\"sync-radio-group\"\n                  formControlName=\"syncTiming\"\n                  [attr.name]=\"'syncTiming-' + outputIndex\"\n                >\n                  @for (item of syncTimingItems; track item.id) {\n                    <cds-radio [value]=\"item.id\" [checked]=\"isSyncTimingSelected(group, item.id)\">\n                      {{ item.labelKey | translate }}\n                    </cds-radio>\n                  }\n                </cds-radio-group>\n              </div>\n\n              <div class=\"mapping-cell-actions\">\n                <button\n                  cdsButton=\"danger--ghost\"\n                  iconOnly\n                  size=\"sm\"\n                  (click)=\"deleteOutput(outputIndex)\"\n                  [attr.data-test-id]=\"testIds.outputDeleteButton\"\n                >\n                  <svg cdsIcon=\"trash-can\" class=\"cds--btn__icon\" size=\"16\"></svg>\n                </button>\n              </div>\n            </div>\n          </div>\n        }\n      </div>\n    </div>\n\n    <button\n      cdsButton=\"tertiary\"\n      size=\"sm\"\n      (click)=\"addOutput()\"\n      [title]=\"'processLinkConfiguration.buildingBlock.addOutput' | translate\"\n      [attr.data-test-id]=\"testIds.addOutputButton\"\n    >\n      {{ 'processLinkConfiguration.buildingBlock.addOutput' | translate }}\n\n      <svg cdsIcon=\"add\" class=\"cds--btn__icon\" size=\"16\"></svg>\n    </button>\n  </section>\n</div>\n", styles: [".section-header{font-size:14px;line-height:18px;font-weight:600}.mapping-section{margin-bottom:16px}.mapping-row,.mapping-header{display:grid;align-items:center}.mapping-row.input,.mapping-header.input{grid-template-columns:1fr 1fr}.mapping-row.output,.mapping-header.output{grid-template-columns:5fr 6fr 58px}.mapping-header .output .sync-options{padding-left:10px;display:flex}.mapping-row{margin-bottom:8px;padding:8px;background-color:var(--cds-layer)}.mapping-row .mapping-part{display:flex}.mapping-row .arrow{text-align:center;width:40px;line-height:40px;font-size:large}.mapping-row .mapping-cell{flex:1;min-width:0}.mapping-row .mapping-cell-actions{display:flex;align-self:flex-end;text-transform:capitalize;margin-left:10px}.mapping-row .mapping-cell-actions .required-indicator{margin:0 5px;color:var(--cds-text-error)}.mapping-row .mapping-cell-actions button{margin-bottom:5px}.mapping-row .mapping-cell-actions button ::ng-deep .cds--btn__icon{margin:0!important}.mapping-row .sync-radio-group{padding-left:10px;margin-top:8px}.mapping-row .sync-radio-group .sync-radio:first-child{margin-right:0}.mapping-row .sync-radio-group ::ng-deep .cds--radio-button__label{justify-content:normal}::ng-deep .process-link-modal-container .cds--modal-container{max-width:1280px}\n/*!\n * Copyright 2015-2026 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"] }]
         }], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: BuildingBlockStateService }, { type: ProcessLinkButtonService }, { type: ProcessLinkStepService }, { type: ProcessLinkService }, { type: ProcessLinkStateService }, { type: i3.TranslateService }, { type: i3$2.ActivatedRoute }, { type: i0.ChangeDetectorRef }, { type: ProcessLinkBuildingBlockApiService }, { type: ProcessLinkStateService }] });
 
 /*
@@ -4720,5 +4766,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { BuildingBlockStateService, ChooseProcessLinkTypeComponent, FORM_CUSTOM_COMPONENT_TOKEN, FORM_FLOW_COMPONENT_TOKEN, FormFlowComponent, FormFlowComponentService, FormFlowService, PluginActionConfigurationComponent, PluginStateService, ProcessLinkBuildingBlockApiService, ProcessLinkButtonService, ProcessLinkComponent, ProcessLinkModalComponent, ProcessLinkModule, ProcessLinkService, ProcessLinkStateService, ProcessLinkStepService, SelectPluginActionComponent, SelectPluginConfigurationComponent, UNSUPPORTED_PROCESS_LINK_TYPES_IN_BUILDING_BLOCK, UrlResolverService, UrlValidatorService, ensureDocPrefix, formSizeToCarbonModalSizeMap, stripDocPrefix };
+export { BB_MAPPINGS_TEST_IDS, BuildingBlockStateService, ChooseProcessLinkTypeComponent, FORM_CUSTOM_COMPONENT_TOKEN, FORM_FLOW_COMPONENT_TOKEN, FormFlowComponent, FormFlowComponentService, FormFlowService, PluginActionConfigurationComponent, PluginStateService, ProcessLinkBuildingBlockApiService, ProcessLinkButtonService, ProcessLinkComponent, ProcessLinkModalComponent, ProcessLinkModule, ProcessLinkService, ProcessLinkStateService, ProcessLinkStepService, SelectPluginActionComponent, SelectPluginConfigurationComponent, UNSUPPORTED_PROCESS_LINK_TYPES_IN_BUILDING_BLOCK, UrlResolverService, UrlValidatorService, ensureDocPrefix, formSizeToCarbonModalSizeMap, stripDocPrefix };
 //# sourceMappingURL=valtimo-process-link.mjs.map