@valtimo/process-link 13.34.0 → 13.36.0

package/fesm2022/valtimo-process-link.mjs

@@ -654,22 +654,25 @@ class ProcessLinkService {
         return this.http.get(`${this.VALTIMO_ENDPOINT_URI}v1/process-link/types?activityType=${activityType}`);
     }
     createProcessDefinition(processLinks = [], processXml) {
-        return this.http.post(`${this.VALTIMO_ENDPOINT_URI}management/v1/process-definition`, this.buildProcessDefinitionFormData(processLinks, processXml, null), { headers: new HttpHeaders().set(InterceptorSkip, '409') });
+        return this.http.post(`${this.VALTIMO_ENDPOINT_URI}management/v1/process-definition`, this.buildProcessDefinitionFormData(processLinks, processXml, null), { headers: new HttpHeaders().set(InterceptorSkip, '409,422') });
     }
     updateProcessDefinition(processLinks = [], processDefinitionId, processXml) {
-        return this.http.put(`${this.VALTIMO_ENDPOINT_URI}management/v1/process-definition`, this.buildProcessDefinitionFormData(processLinks, processXml, processDefinitionId));
+        return this.http.put(`${this.VALTIMO_ENDPOINT_URI}management/v1/process-definition`, this.buildProcessDefinitionFormData(processLinks, processXml, processDefinitionId), { headers: new HttpHeaders().set(InterceptorSkip, '422') });
     }
     createProcessDefinitionForCase(processLinks = [], processXml, caseDefinitionKey, caseDefinitionVersionTag, canInitializeDocument = false, startableByUser = false) {
-        return this.http.post(`${this.VALTIMO_ENDPOINT_URI}management/v1/case-definition/${caseDefinitionKey}/version/${caseDefinitionVersionTag}/process-definition`, this.buildCaseProcessDefinitionFormData(processLinks, processXml, null, canInitializeDocument, startableByUser), { headers: new HttpHeaders().set(InterceptorSkip, '409') });
+        return this.http.post(`${this.VALTIMO_ENDPOINT_URI}management/v1/case-definition/${caseDefinitionKey}/version/${caseDefinitionVersionTag}/process-definition`, this.buildCaseProcessDefinitionFormData(processLinks, processXml, null, canInitializeDocument, startableByUser), { headers: new HttpHeaders().set(InterceptorSkip, '409,422') });
     }
     updateProcessDefinitionForCase(processLinks = [], processDefinitionId, processXml, caseDefinitionKey, caseDefinitionVersionTag, canInitializeDocument = false, startableByUser = false) {
-        return this.http.put(`${this.VALTIMO_ENDPOINT_URI}management/v1/case-definition/${caseDefinitionKey}/version/${caseDefinitionVersionTag}/process-definition`, this.buildCaseProcessDefinitionFormData(processLinks, processXml, processDefinitionId, canInitializeDocument, startableByUser));
+        return this.http.put(`${this.VALTIMO_ENDPOINT_URI}management/v1/case-definition/${caseDefinitionKey}/version/${caseDefinitionVersionTag}/process-definition`, this.buildCaseProcessDefinitionFormData(processLinks, processXml, processDefinitionId, canInitializeDocument, startableByUser), { headers: new HttpHeaders().set(InterceptorSkip, '422') });
     }
     createProcessDefinitionForBuildingBlock(processLinks = [], processXml, buildingBlockKey, buildingBlockVersionTag) {
-        return this.http.post(`${this.VALTIMO_ENDPOINT_URI}management/v1/building-block/${buildingBlockKey}/version/${buildingBlockVersionTag}/process-definition`, this.buildBuildingBlockFormData(processLinks, processXml, buildingBlockKey, buildingBlockVersionTag), { headers: new HttpHeaders().set(InterceptorSkip, '409') });
+        return this.http.post(`${this.VALTIMO_ENDPOINT_URI}management/v1/building-block/${buildingBlockKey}/version/${buildingBlockVersionTag}/process-definition`, this.buildBuildingBlockFormData(processLinks, processXml, buildingBlockKey, buildingBlockVersionTag), { headers: new HttpHeaders().set(InterceptorSkip, '409,422') });
     }
     updateProcessDefinitionForBuildingBlock(processLinks = [], processDefinitionId, processXml, buildingBlockKey, buildingBlockVersionTag, replace = false) {
-        return this.http.put(`${this.VALTIMO_ENDPOINT_URI}management/v1/building-block/${buildingBlockKey}/version/${buildingBlockVersionTag}/process-definition/${processDefinitionId}`, this.buildBuildingBlockFormData(processLinks, processXml, buildingBlockKey, buildingBlockVersionTag), { params: replace ? new HttpParams().set('replace', 'true') : undefined });
+        return this.http.put(`${this.VALTIMO_ENDPOINT_URI}management/v1/building-block/${buildingBlockKey}/version/${buildingBlockVersionTag}/process-definition/${processDefinitionId}`, this.buildBuildingBlockFormData(processLinks, processXml, buildingBlockKey, buildingBlockVersionTag), {
+            headers: new HttpHeaders().set(InterceptorSkip, '422'),
+            params: replace ? new HttpParams().set('replace', 'true') : undefined,
+        });
     }
     /** @deprecated Use createProcessDefinition() or updateProcessDefinition() */
     deployProcessWithProcessLinks(processLinks = [], processDefinitionId, processXml) {
@@ -3010,7 +3013,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\" [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                  [notation]=\"'slashes'\"\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                    {{ 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                  [notation]=\"'slashes'\"\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 }); }
+    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                  [notation]=\"'slashes'\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [excludePrefixes]=\"[ValuePathSelectorPrefix.TASK]\"\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                    {{ 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                  [notation]=\"'slashes'\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [excludePrefixes]=\"[ValuePathSelectorPrefix.TASK]\"\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", "excludePrefixes", "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,
@@ -3027,7 +3030,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\" [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                  [notation]=\"'slashes'\"\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                    {{ 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                  [notation]=\"'slashes'\"\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"] }]
+                    ], 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                  [notation]=\"'slashes'\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [excludePrefixes]=\"[ValuePathSelectorPrefix.TASK]\"\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                    {{ 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                  [notation]=\"'slashes'\"\n                  [caseDefinitionKey]=\"obs.params?.caseDefinitionKey\"\n                  [caseDefinitionVersionTag]=\"obs.params?.caseDefinitionVersionTag\"\n                  [excludePrefixes]=\"[ValuePathSelectorPrefix.TASK]\"\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 }] });
 
 /*