npm - @colijnit/transaction - Versions diffs - 12.1.57 → 12.1.59 - Mend

@colijnit/transaction 12.1.57 → 12.1.59

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (234) hide show

package/bundles/colijnit-transaction.umd.js CHANGED Viewed

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@colijnit/transactionapi/build/enum/pending-reason-type.enum'), require('@colijnit/transactionapi/build/enum/sequence-name.enum'), require('@colijnit/transactionapi/build/enum/transaction-kind.enum'), require('@colijnit/transactionapi/build/enum/transaction-line-type.enum'), require('rxjs'), require('@colijnit/transactionapi/build/model/transaction-info-response.bo'), require('@colijnit/transactionapi/build/model/marketing.bo'), require('@colijnit/transactionapi/build/model/customer-full-object.bo'), require('@colijnit/transactionapi/build/model/country.bo'), require('@colijnit/transactionapi/build/model/privacy-setting.bo'), require('@colijnit/transactionapi/build/model/delivery-method.bo'), require('@colijnit/transactionapi/build/model/delivery-option.bo'), require('@colijnit/transactionapi/build/model/co-domain-value.bo'), require('@colijnit/transactionapi/build/model/article-full-object'), require('@colijnit/transactionapi/build/model/customer-group.bo'), require('@colijnit/transactionapi/build/model/cash-register'), require('@colijnit/transactionapi/build/model/price-list'), require('@colijnit/transactionapi/build/model/vat'), require('@colijnit/transactionapi/build/model/branch-lov.bo'), require('@colijnit/transactionapi/build/model/sales-person.bo'), require('@colijnit/transactionapi/build/model/tag'), require('@colijnit/transactionapi/build/model/on-hold-code.bo'), require('@colijnit/transactionapi/build/model/warehouse.bo'), require('@colijnit/transactionapi/build/model/payment-method.bo'), require('@colijnit/transactionapi/build/utils/object-utils'), require('@colijnit/transactionapi/build/model/relation-privacy-setting.bo'), require('@colijnit/transactionapi/build/model/get-postal-code-retrieval-output-params'), require('@colijnit/transactionapi/build/model/relation-list-object.bo'), require('@colijnit/transactionapi/build/transaction'), require('@colijnit/transactionapi/build/utils/function/not-nill.function'), require('@colijnit/transactionapi/build/enum/yes-no-db-type.enum'), require('@colijnit/transactionapi/build/enum/true-false-db-type.enum'), require('@colijnit/transactionapi/build/enum/one-zero-bool-db-type.enum'), require('@colijnit/transactionapi/build/enum/db-boolean-value-type.enum'), require('@colijnit/transactionapi/build/utils/date-utils'), require('@colijnit/transactionapi/build/utils/number-utils'), require('@colijnit/transactionapi/build/utils/function/is-nill.function'), require('@colijnit/transactionapi/build/factory/decorators/map-property.decorator'), require('@colijnit/transactionapi/build/factory/decorators/boolean.decorator'), require('@colijnit/transactionapi/build/factory/decorators/json.decorator'), require('@colijnit/transactionapi/build/factory/decorators/complex-array.decorator'), require('@colijnit/transactionapi/build/utils/image-utils'), require('@colijnit/transactionapi/build/model/transaction-line-info.bo'), require('@colijnit/transactionapi/build/model/transaction-search-view.bo'), require('@colijnit/transactionapi/build/model/code-description'), require('@colijnit/transactionapi/build/model/goods-receipt-status-with-history.bo'), require('@colijnit/transactionapi/build/model/purchase-portal-line.bo'), require('@colijnit/transactionapi/build/model/create-payment-link-result.bo'), require('@colijnit/transactionapi/build/model/payment-link-status.bo'), require('@angular/platform-browser'), require('@colijnit/transactionapi/build/model/transaction-info.bo'), require('@colijnit/transactionapi/build/model/supplier-full-object.bo'), require('@colijnit/transactionapi/build/model/transaction-down-payment-info.bo'), require('@colijnit/transactionapi/build/enum/relation-status.enum'), require('@colijnit/transactionapi/build/model/resolve-pending-reason-request.bo'), require('@colijnit/articleapi/build/articles'), require('@colijnit/articleapi/build/model/stock-location.bo'), require('@colijnit/articleapi/build/model/article-light.bo'), require('@colijnit/articleapi/build/model/turnover-group-image.bo'), require('@colijnit/articleapi/build/model/main-article.bo'), require('@colijnit/transactionapi/build/model/resolve-header-pending-reason-request.bo'), require('@colijnit/transactionapi/build/model/doc-delivery-batch.bo'), require('@colijnit/transactionapi/build/model/nul-relation-object'), require('@colijnit/transactionapi/build/enum/relation-kind.enum'), require('@colijnit/corecomponents_v12'), require('@angular/flex-layout'), require('@colijnit/transactionapi/build/enum/address-type.enum'), require('@angular/animations'), require('@angular/common'), require('@angular/forms'), require('@colijnit/transactionapi/build/model/address.bo'), require('@colijnit/transactionapi/build/model/transaction-total.bo'), require('@colijnit/transactionapi/build/enum/discount-type.enum'), require('@angular/cdk/drag-drop'), require('@colijnit/transactionapi/build/model/transaction-add-text-line-request.bo'), require('@colijnit/transactionapi/build/model/paging-parameters'), require('@colijnit/transactionapi/build/model/transaction-search-view-request'), require('@colijnit/articleapi/build/enum/relation-kind.enum'), require('@colijnit/transactionapi/build/model/get-purchase-order-confirmation'), require('@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-request.bo'), require('@colijnit/transactionapi/build/model/purchase-order-line-receipt-details.bo'), require('@colijnit/transactionapi/build/enum/refcode/stock-status.enum'), require('@colijnit/transactionapi/build/model/relation-request'), require('@colijnit/sharedapi/build/sharedapi'), require('@colijnit/sharedapi/build/model/co-document.bo'), require('@colijnit/sharedcomponents'), require('@colijnit/transactionapi/build/enum/relation-name-kind.enum'), require('@colijnit/transactionapi/build/enum/gender-type.enum'), require('@colijnit/transactionapi/build/utils/function-utils'), require('@colijnit/transactionapi/build/enum/communication-type.enum'), require('@colijnit/transactionapi/build/model/contact-option.bo'), require('@colijnit/transactionapi/build/utils/business-object-utils'), require('@angular/cdk/scrolling'), require('@colijnit/transactionapi/build/model/relation-small-object.bo'), require('@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-correction-request.bo'), require('@colijnit/transactionapi/build/model/purchase-order-line-receipt-correction-details.bo'), require('@colijnit/transactionapi/build/model/get-purchase-portal-line'), require('@colijnit/transactionapi/build/model/purchase-portal-filters.bo'), require('@colijnit/transactionapi/build/model/goods-receipt-status.bo'), require('@colijnit/articleapi/build/model/article-extended-request'), require('@colijnit/transactionapi/build/enum/quantity-in-historic-state.enum')) :
-    typeof define === 'function' && define.amd ? define('@colijnit/transaction', ['exports', '@angular/core', '@colijnit/transactionapi/build/enum/pending-reason-type.enum', '@colijnit/transactionapi/build/enum/sequence-name.enum', '@colijnit/transactionapi/build/enum/transaction-kind.enum', '@colijnit/transactionapi/build/enum/transaction-line-type.enum', 'rxjs', '@colijnit/transactionapi/build/model/transaction-info-response.bo', '@colijnit/transactionapi/build/model/marketing.bo', '@colijnit/transactionapi/build/model/customer-full-object.bo', '@colijnit/transactionapi/build/model/country.bo', '@colijnit/transactionapi/build/model/privacy-setting.bo', '@colijnit/transactionapi/build/model/delivery-method.bo', '@colijnit/transactionapi/build/model/delivery-option.bo', '@colijnit/transactionapi/build/model/co-domain-value.bo', '@colijnit/transactionapi/build/model/article-full-object', '@colijnit/transactionapi/build/model/customer-group.bo', '@colijnit/transactionapi/build/model/cash-register', '@colijnit/transactionapi/build/model/price-list', '@colijnit/transactionapi/build/model/vat', '@colijnit/transactionapi/build/model/branch-lov.bo', '@colijnit/transactionapi/build/model/sales-person.bo', '@colijnit/transactionapi/build/model/tag', '@colijnit/transactionapi/build/model/on-hold-code.bo', '@colijnit/transactionapi/build/model/warehouse.bo', '@colijnit/transactionapi/build/model/payment-method.bo', '@colijnit/transactionapi/build/utils/object-utils', '@colijnit/transactionapi/build/model/relation-privacy-setting.bo', '@colijnit/transactionapi/build/model/get-postal-code-retrieval-output-params', '@colijnit/transactionapi/build/model/relation-list-object.bo', '@colijnit/transactionapi/build/transaction', '@colijnit/transactionapi/build/utils/function/not-nill.function', '@colijnit/transactionapi/build/enum/yes-no-db-type.enum', '@colijnit/transactionapi/build/enum/true-false-db-type.enum', '@colijnit/transactionapi/build/enum/one-zero-bool-db-type.enum', '@colijnit/transactionapi/build/enum/db-boolean-value-type.enum', '@colijnit/transactionapi/build/utils/date-utils', '@colijnit/transactionapi/build/utils/number-utils', '@colijnit/transactionapi/build/utils/function/is-nill.function', '@colijnit/transactionapi/build/factory/decorators/map-property.decorator', '@colijnit/transactionapi/build/factory/decorators/boolean.decorator', '@colijnit/transactionapi/build/factory/decorators/json.decorator', '@colijnit/transactionapi/build/factory/decorators/complex-array.decorator', '@colijnit/transactionapi/build/utils/image-utils', '@colijnit/transactionapi/build/model/transaction-line-info.bo', '@colijnit/transactionapi/build/model/transaction-search-view.bo', '@colijnit/transactionapi/build/model/code-description', '@colijnit/transactionapi/build/model/goods-receipt-status-with-history.bo', '@colijnit/transactionapi/build/model/purchase-portal-line.bo', '@colijnit/transactionapi/build/model/create-payment-link-result.bo', '@colijnit/transactionapi/build/model/payment-link-status.bo', '@angular/platform-browser', '@colijnit/transactionapi/build/model/transaction-info.bo', '@colijnit/transactionapi/build/model/supplier-full-object.bo', '@colijnit/transactionapi/build/model/transaction-down-payment-info.bo', '@colijnit/transactionapi/build/enum/relation-status.enum', '@colijnit/transactionapi/build/model/resolve-pending-reason-request.bo', '@colijnit/articleapi/build/articles', '@colijnit/articleapi/build/model/stock-location.bo', '@colijnit/articleapi/build/model/article-light.bo', '@colijnit/articleapi/build/model/turnover-group-image.bo', '@colijnit/articleapi/build/model/main-article.bo', '@colijnit/transactionapi/build/model/resolve-header-pending-reason-request.bo', '@colijnit/transactionapi/build/model/doc-delivery-batch.bo', '@colijnit/transactionapi/build/model/nul-relation-object', '@colijnit/transactionapi/build/enum/relation-kind.enum', '@colijnit/corecomponents_v12', '@angular/flex-layout', '@colijnit/transactionapi/build/enum/address-type.enum', '@angular/animations', '@angular/common', '@angular/forms', '@colijnit/transactionapi/build/model/address.bo', '@colijnit/transactionapi/build/model/transaction-total.bo', '@colijnit/transactionapi/build/enum/discount-type.enum', '@angular/cdk/drag-drop', '@colijnit/transactionapi/build/model/transaction-add-text-line-request.bo', '@colijnit/transactionapi/build/model/paging-parameters', '@colijnit/transactionapi/build/model/transaction-search-view-request', '@colijnit/articleapi/build/enum/relation-kind.enum', '@colijnit/transactionapi/build/model/get-purchase-order-confirmation', '@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-request.bo', '@colijnit/transactionapi/build/model/purchase-order-line-receipt-details.bo', '@colijnit/transactionapi/build/enum/refcode/stock-status.enum', '@colijnit/transactionapi/build/model/relation-request', '@colijnit/sharedapi/build/sharedapi', '@colijnit/sharedapi/build/model/co-document.bo', '@colijnit/sharedcomponents', '@colijnit/transactionapi/build/enum/relation-name-kind.enum', '@colijnit/transactionapi/build/enum/gender-type.enum', '@colijnit/transactionapi/build/utils/function-utils', '@colijnit/transactionapi/build/enum/communication-type.enum', '@colijnit/transactionapi/build/model/contact-option.bo', '@colijnit/transactionapi/build/utils/business-object-utils', '@angular/cdk/scrolling', '@colijnit/transactionapi/build/model/relation-small-object.bo', '@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-correction-request.bo', '@colijnit/transactionapi/build/model/purchase-order-line-receipt-correction-details.bo', '@colijnit/transactionapi/build/model/get-purchase-portal-line', '@colijnit/transactionapi/build/model/purchase-portal-filters.bo', '@colijnit/transactionapi/build/model/goods-receipt-status.bo', '@colijnit/articleapi/build/model/article-extended-request', '@colijnit/transactionapi/build/enum/quantity-in-historic-state.enum'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.colijnit = global.colijnit || {}, global.colijnit.transaction = {}), global.ng.core, global.pendingReasonType_enum, global.sequenceName_enum, global.transactionKind_enum, global.transactionLineType_enum, global.rxjs, global.transactionInfoResponse_bo, global.marketing_bo, global.customerFullObject_bo, global.country_bo, global.privacySetting_bo, global.deliveryMethod_bo, global.deliveryOption_bo, global.coDomainValue_bo, global.articleFullObject, global.customerGroup_bo, global.cashRegister, global.priceList, global.vat, global.branchLov_bo, global.salesPerson_bo, global.tag, global.onHoldCode_bo, global.warehouse_bo, global.paymentMethod_bo, global.objectUtils, global.relationPrivacySetting_bo, global.getPostalCodeRetrievalOutputParams, global.relationListObject_bo, global.transaction, global.notNill_function, global.yesNoDbType_enum, global.trueFalseDbType_enum, global.oneZeroBoolDbType_enum, global.dbBooleanValueType_enum, global.dateUtils, global.numberUtils, global.isNill_function, global.mapProperty_decorator, global.boolean_decorator, global.json_decorator, global.complexArray_decorator, global.imageUtils, global.transactionLineInfo_bo, global.transactionSearchView_bo, global.codeDescription, global.goodsReceiptStatusWithHistory_bo, global.purchasePortalLine_bo, global.createPaymentLinkResult_bo, global.paymentLinkStatus_bo, global.ng.platformBrowser, global.transactionInfo_bo, global.supplierFullObject_bo, global.transactionDownPaymentInfo_bo, global.relationStatus_enum, global.resolvePendingReasonRequest_bo, global.articles, global.stockLocation_bo, global.articleLight_bo, global.turnoverGroupImage_bo, global.mainArticle_bo, global.resolveHeaderPendingReasonRequest_bo, global.docDeliveryBatch_bo, global.nulRelationObject, global.relationKind_enum, global.corecomponents_v12, global.ng.flexLayout, global.addressType_enum, global.ng.animations, global.ng.common, global.ng.forms, global.address_bo, global.transactionTotal_bo, global.discountType_enum, global.ng.cdk.dragDrop, global.transactionAddTextLineRequest_bo, global.pagingParameters, global.transactionSearchViewRequest, global.relationKind_enum$1, global.getPurchaseOrderConfirmation, global.receiveGoodsForPurchaseOrderRequest_bo, global.purchaseOrderLineReceiptDetails_bo, global.stockStatus_enum, global.relationRequest, global.sharedapi, global.coDocument_bo, global.sharedcomponents, global.relationNameKind_enum, global.genderType_enum, global.functionUtils, global.communicationType_enum, global.contactOption_bo, global.businessObjectUtils, global.ng.cdk.scrolling, global.relationSmallObject_bo, global.receiveGoodsForPurchaseOrderCorrectionRequest_bo, global.purchaseOrderLineReceiptCorrectionDetails_bo, global.getPurchasePortalLine, global.purchasePortalFilters_bo, global.goodsReceiptStatus_bo, global.articleExtendedRequest, global.quantityInHistoricState_enum));
-})(this, (function (exports, i0, pendingReasonType_enum, sequenceName_enum, transactionKind_enum, transactionLineType_enum, rxjs, transactionInfoResponse_bo, marketing_bo, customerFullObject_bo, country_bo, privacySetting_bo, deliveryMethod_bo, deliveryOption_bo, coDomainValue_bo, articleFullObject, customerGroup_bo, cashRegister, priceList, vat, branchLov_bo, salesPerson_bo, tag, onHoldCode_bo, warehouse_bo, paymentMethod_bo, objectUtils, relationPrivacySetting_bo, getPostalCodeRetrievalOutputParams, relationListObject_bo, transaction, notNill_function, yesNoDbType_enum, trueFalseDbType_enum, oneZeroBoolDbType_enum, dbBooleanValueType_enum, dateUtils, numberUtils, isNill_function, mapProperty_decorator, boolean_decorator, json_decorator, complexArray_decorator, imageUtils, transactionLineInfo_bo, transactionSearchView_bo, codeDescription, goodsReceiptStatusWithHistory_bo, purchasePortalLine_bo, createPaymentLinkResult_bo, paymentLinkStatus_bo, i1, transactionInfo_bo, supplierFullObject_bo, transactionDownPaymentInfo_bo, relationStatus_enum, resolvePendingReasonRequest_bo, articles, stockLocation_bo, articleLight_bo, turnoverGroupImage_bo, mainArticle_bo, resolveHeaderPendingReasonRequest_bo, docDeliveryBatch_bo, nulRelationObject, relationKind_enum, corecomponents_v12, flexLayout, addressType_enum, animations, common, forms, address_bo, transactionTotal_bo, discountType_enum, dragDrop, transactionAddTextLineRequest_bo, pagingParameters, transactionSearchViewRequest, relationKind_enum$1, getPurchaseOrderConfirmation, receiveGoodsForPurchaseOrderRequest_bo, purchaseOrderLineReceiptDetails_bo, stockStatus_enum, relationRequest, sharedapi, coDocument_bo, sharedcomponents, relationNameKind_enum, genderType_enum, functionUtils, communicationType_enum, contactOption_bo, businessObjectUtils, scrolling, relationSmallObject_bo, receiveGoodsForPurchaseOrderCorrectionRequest_bo, purchaseOrderLineReceiptCorrectionDetails_bo, getPurchasePortalLine, purchasePortalFilters_bo, goodsReceiptStatus_bo, articleExtendedRequest, quantityInHistoricState_enum) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@colijnit/transactionapi/build/enum/pending-reason-type.enum'), require('@colijnit/transactionapi/build/enum/sequence-name.enum'), require('@colijnit/transactionapi/build/enum/transaction-kind.enum'), require('@colijnit/transactionapi/build/enum/transaction-line-type.enum'), require('@colijnit/transactionapi/build/model/validation-result'), require('rxjs'), require('@colijnit/transactionapi/build/model/transaction-info-response.bo'), require('@colijnit/transactionapi/build/model/marketing.bo'), require('@colijnit/transactionapi/build/model/customer-full-object.bo'), require('@colijnit/transactionapi/build/model/country.bo'), require('@colijnit/transactionapi/build/model/privacy-setting.bo'), require('@colijnit/transactionapi/build/model/delivery-method.bo'), require('@colijnit/transactionapi/build/model/delivery-option.bo'), require('@colijnit/transactionapi/build/model/co-domain-value.bo'), require('@colijnit/transactionapi/build/model/article-full-object'), require('@colijnit/transactionapi/build/model/customer-group.bo'), require('@colijnit/transactionapi/build/model/cash-register'), require('@colijnit/transactionapi/build/model/price-list'), require('@colijnit/transactionapi/build/model/vat'), require('@colijnit/transactionapi/build/model/branch-lov.bo'), require('@colijnit/transactionapi/build/model/sales-person.bo'), require('@colijnit/transactionapi/build/model/tag'), require('@colijnit/transactionapi/build/model/on-hold-code.bo'), require('@colijnit/transactionapi/build/model/warehouse.bo'), require('@colijnit/transactionapi/build/model/payment-method.bo'), require('@colijnit/transactionapi/build/utils/object-utils'), require('@colijnit/transactionapi/build/model/relation-privacy-setting.bo'), require('@colijnit/transactionapi/build/model/get-postal-code-retrieval-output-params'), require('@colijnit/transactionapi/build/model/relation-list-object.bo'), require('@colijnit/transactionapi/build/transaction'), require('@colijnit/transactionapi/build/utils/function/not-nill.function'), require('@colijnit/transactionapi/build/enum/yes-no-db-type.enum'), require('@colijnit/transactionapi/build/enum/true-false-db-type.enum'), require('@colijnit/transactionapi/build/enum/one-zero-bool-db-type.enum'), require('@colijnit/transactionapi/build/enum/db-boolean-value-type.enum'), require('@colijnit/transactionapi/build/utils/date-utils'), require('@colijnit/transactionapi/build/utils/number-utils'), require('@colijnit/transactionapi/build/utils/function/is-nill.function'), require('@colijnit/transactionapi/build/factory/decorators/map-property.decorator'), require('@colijnit/transactionapi/build/factory/decorators/boolean.decorator'), require('@colijnit/transactionapi/build/factory/decorators/json.decorator'), require('@colijnit/transactionapi/build/factory/decorators/complex-array.decorator'), require('@colijnit/transactionapi/build/utils/image-utils'), require('@colijnit/transactionapi/build/model/transaction-line-info.bo'), require('@colijnit/transactionapi/build/model/transaction-search-view.bo'), require('@colijnit/transactionapi/build/model/code-description'), require('@colijnit/transactionapi/build/model/goods-receipt-status-with-history.bo'), require('@colijnit/transactionapi/build/model/purchase-portal-line.bo'), require('@colijnit/transactionapi/build/model/create-payment-link-result.bo'), require('@colijnit/transactionapi/build/model/payment-link-status.bo'), require('@angular/platform-browser'), require('@colijnit/transactionapi/build/model/transaction-info.bo'), require('@colijnit/transactionapi/build/model/supplier-full-object.bo'), require('@colijnit/transactionapi/build/model/transaction-down-payment-info.bo'), require('@colijnit/transactionapi/build/model/transaction-lock-result.bo'), require('@colijnit/transactionapi/build/enum/relation-status.enum'), require('@colijnit/transactionapi/build/model/resolve-pending-reason-request.bo'), require('@colijnit/articleapi/build/articles'), require('@colijnit/articleapi/build/model/stock-location.bo'), require('@colijnit/articleapi/build/model/article-light.bo'), require('@colijnit/articleapi/build/model/turnover-group-image.bo'), require('@colijnit/articleapi/build/model/main-article.bo'), require('@colijnit/transactionapi/build/model/resolve-header-pending-reason-request.bo'), require('@colijnit/transactionapi/build/model/doc-delivery-batch.bo'), require('@colijnit/transactionapi/build/model/nul-relation-object'), require('@colijnit/transactionapi/build/enum/relation-kind.enum'), require('@colijnit/corecomponents_v12'), require('@angular/flex-layout'), require('@colijnit/transactionapi/build/enum/address-type.enum'), require('@angular/animations'), require('@angular/common'), require('@angular/forms'), require('@colijnit/transactionapi/build/model/address.bo'), require('@colijnit/transactionapi/build/model/transaction-total.bo'), require('@colijnit/transactionapi/build/enum/discount-type.enum'), require('@angular/cdk/drag-drop'), require('@colijnit/transactionapi/build/model/transaction-add-text-line-request.bo'), require('@colijnit/transactionapi/build/model/paging-parameters'), require('@colijnit/transactionapi/build/model/transaction-search-view-request'), require('@colijnit/articleapi/build/enum/relation-kind.enum'), require('@colijnit/transactionapi/build/model/get-purchase-order-confirmation'), require('@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-request.bo'), require('@colijnit/transactionapi/build/model/purchase-order-line-receipt-details.bo'), require('@colijnit/transactionapi/build/enum/refcode/stock-status.enum'), require('@colijnit/transactionapi/build/model/relation-request'), require('@colijnit/sharedapi/build/sharedapi'), require('@colijnit/sharedapi/build/model/co-document.bo'), require('@colijnit/sharedcomponents'), require('@colijnit/transactionapi/build/enum/relation-name-kind.enum'), require('@colijnit/transactionapi/build/enum/gender-type.enum'), require('@colijnit/transactionapi/build/utils/function-utils'), require('@colijnit/transactionapi/build/enum/communication-type.enum'), require('@colijnit/transactionapi/build/model/contact-option.bo'), require('@colijnit/transactionapi/build/utils/business-object-utils'), require('@angular/cdk/scrolling'), require('@colijnit/transactionapi/build/model/relation-small-object.bo'), require('@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-correction-request.bo'), require('@colijnit/transactionapi/build/model/purchase-order-line-receipt-correction-details.bo'), require('@colijnit/transactionapi/build/model/get-purchase-portal-line'), require('@colijnit/transactionapi/build/model/purchase-portal-filters.bo'), require('@colijnit/transactionapi/build/model/goods-receipt-status.bo'), require('@colijnit/articleapi/build/model/article-extended-request'), require('@colijnit/transactionapi/build/enum/quantity-in-historic-state.enum')) :
+    typeof define === 'function' && define.amd ? define('@colijnit/transaction', ['exports', '@angular/core', '@colijnit/transactionapi/build/enum/pending-reason-type.enum', '@colijnit/transactionapi/build/enum/sequence-name.enum', '@colijnit/transactionapi/build/enum/transaction-kind.enum', '@colijnit/transactionapi/build/enum/transaction-line-type.enum', '@colijnit/transactionapi/build/model/validation-result', 'rxjs', '@colijnit/transactionapi/build/model/transaction-info-response.bo', '@colijnit/transactionapi/build/model/marketing.bo', '@colijnit/transactionapi/build/model/customer-full-object.bo', '@colijnit/transactionapi/build/model/country.bo', '@colijnit/transactionapi/build/model/privacy-setting.bo', '@colijnit/transactionapi/build/model/delivery-method.bo', '@colijnit/transactionapi/build/model/delivery-option.bo', '@colijnit/transactionapi/build/model/co-domain-value.bo', '@colijnit/transactionapi/build/model/article-full-object', '@colijnit/transactionapi/build/model/customer-group.bo', '@colijnit/transactionapi/build/model/cash-register', '@colijnit/transactionapi/build/model/price-list', '@colijnit/transactionapi/build/model/vat', '@colijnit/transactionapi/build/model/branch-lov.bo', '@colijnit/transactionapi/build/model/sales-person.bo', '@colijnit/transactionapi/build/model/tag', '@colijnit/transactionapi/build/model/on-hold-code.bo', '@colijnit/transactionapi/build/model/warehouse.bo', '@colijnit/transactionapi/build/model/payment-method.bo', '@colijnit/transactionapi/build/utils/object-utils', '@colijnit/transactionapi/build/model/relation-privacy-setting.bo', '@colijnit/transactionapi/build/model/get-postal-code-retrieval-output-params', '@colijnit/transactionapi/build/model/relation-list-object.bo', '@colijnit/transactionapi/build/transaction', '@colijnit/transactionapi/build/utils/function/not-nill.function', '@colijnit/transactionapi/build/enum/yes-no-db-type.enum', '@colijnit/transactionapi/build/enum/true-false-db-type.enum', '@colijnit/transactionapi/build/enum/one-zero-bool-db-type.enum', '@colijnit/transactionapi/build/enum/db-boolean-value-type.enum', '@colijnit/transactionapi/build/utils/date-utils', '@colijnit/transactionapi/build/utils/number-utils', '@colijnit/transactionapi/build/utils/function/is-nill.function', '@colijnit/transactionapi/build/factory/decorators/map-property.decorator', '@colijnit/transactionapi/build/factory/decorators/boolean.decorator', '@colijnit/transactionapi/build/factory/decorators/json.decorator', '@colijnit/transactionapi/build/factory/decorators/complex-array.decorator', '@colijnit/transactionapi/build/utils/image-utils', '@colijnit/transactionapi/build/model/transaction-line-info.bo', '@colijnit/transactionapi/build/model/transaction-search-view.bo', '@colijnit/transactionapi/build/model/code-description', '@colijnit/transactionapi/build/model/goods-receipt-status-with-history.bo', '@colijnit/transactionapi/build/model/purchase-portal-line.bo', '@colijnit/transactionapi/build/model/create-payment-link-result.bo', '@colijnit/transactionapi/build/model/payment-link-status.bo', '@angular/platform-browser', '@colijnit/transactionapi/build/model/transaction-info.bo', '@colijnit/transactionapi/build/model/supplier-full-object.bo', '@colijnit/transactionapi/build/model/transaction-down-payment-info.bo', '@colijnit/transactionapi/build/model/transaction-lock-result.bo', '@colijnit/transactionapi/build/enum/relation-status.enum', '@colijnit/transactionapi/build/model/resolve-pending-reason-request.bo', '@colijnit/articleapi/build/articles', '@colijnit/articleapi/build/model/stock-location.bo', '@colijnit/articleapi/build/model/article-light.bo', '@colijnit/articleapi/build/model/turnover-group-image.bo', '@colijnit/articleapi/build/model/main-article.bo', '@colijnit/transactionapi/build/model/resolve-header-pending-reason-request.bo', '@colijnit/transactionapi/build/model/doc-delivery-batch.bo', '@colijnit/transactionapi/build/model/nul-relation-object', '@colijnit/transactionapi/build/enum/relation-kind.enum', '@colijnit/corecomponents_v12', '@angular/flex-layout', '@colijnit/transactionapi/build/enum/address-type.enum', '@angular/animations', '@angular/common', '@angular/forms', '@colijnit/transactionapi/build/model/address.bo', '@colijnit/transactionapi/build/model/transaction-total.bo', '@colijnit/transactionapi/build/enum/discount-type.enum', '@angular/cdk/drag-drop', '@colijnit/transactionapi/build/model/transaction-add-text-line-request.bo', '@colijnit/transactionapi/build/model/paging-parameters', '@colijnit/transactionapi/build/model/transaction-search-view-request', '@colijnit/articleapi/build/enum/relation-kind.enum', '@colijnit/transactionapi/build/model/get-purchase-order-confirmation', '@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-request.bo', '@colijnit/transactionapi/build/model/purchase-order-line-receipt-details.bo', '@colijnit/transactionapi/build/enum/refcode/stock-status.enum', '@colijnit/transactionapi/build/model/relation-request', '@colijnit/sharedapi/build/sharedapi', '@colijnit/sharedapi/build/model/co-document.bo', '@colijnit/sharedcomponents', '@colijnit/transactionapi/build/enum/relation-name-kind.enum', '@colijnit/transactionapi/build/enum/gender-type.enum', '@colijnit/transactionapi/build/utils/function-utils', '@colijnit/transactionapi/build/enum/communication-type.enum', '@colijnit/transactionapi/build/model/contact-option.bo', '@colijnit/transactionapi/build/utils/business-object-utils', '@angular/cdk/scrolling', '@colijnit/transactionapi/build/model/relation-small-object.bo', '@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-correction-request.bo', '@colijnit/transactionapi/build/model/purchase-order-line-receipt-correction-details.bo', '@colijnit/transactionapi/build/model/get-purchase-portal-line', '@colijnit/transactionapi/build/model/purchase-portal-filters.bo', '@colijnit/transactionapi/build/model/goods-receipt-status.bo', '@colijnit/articleapi/build/model/article-extended-request', '@colijnit/transactionapi/build/enum/quantity-in-historic-state.enum'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.colijnit = global.colijnit || {}, global.colijnit.transaction = {}), global.ng.core, global.pendingReasonType_enum, global.sequenceName_enum, global.transactionKind_enum, global.transactionLineType_enum, global.validationResult, global.rxjs, global.transactionInfoResponse_bo, global.marketing_bo, global.customerFullObject_bo, global.country_bo, global.privacySetting_bo, global.deliveryMethod_bo, global.deliveryOption_bo, global.coDomainValue_bo, global.articleFullObject, global.customerGroup_bo, global.cashRegister, global.priceList, global.vat, global.branchLov_bo, global.salesPerson_bo, global.tag, global.onHoldCode_bo, global.warehouse_bo, global.paymentMethod_bo, global.objectUtils, global.relationPrivacySetting_bo, global.getPostalCodeRetrievalOutputParams, global.relationListObject_bo, global.transaction, global.notNill_function, global.yesNoDbType_enum, global.trueFalseDbType_enum, global.oneZeroBoolDbType_enum, global.dbBooleanValueType_enum, global.dateUtils, global.numberUtils, global.isNill_function, global.mapProperty_decorator, global.boolean_decorator, global.json_decorator, global.complexArray_decorator, global.imageUtils, global.transactionLineInfo_bo, global.transactionSearchView_bo, global.codeDescription, global.goodsReceiptStatusWithHistory_bo, global.purchasePortalLine_bo, global.createPaymentLinkResult_bo, global.paymentLinkStatus_bo, global.ng.platformBrowser, global.transactionInfo_bo, global.supplierFullObject_bo, global.transactionDownPaymentInfo_bo, global.transactionLockResult_bo, global.relationStatus_enum, global.resolvePendingReasonRequest_bo, global.articles, global.stockLocation_bo, global.articleLight_bo, global.turnoverGroupImage_bo, global.mainArticle_bo, global.resolveHeaderPendingReasonRequest_bo, global.docDeliveryBatch_bo, global.nulRelationObject, global.relationKind_enum, global.corecomponents_v12, global.ng.flexLayout, global.addressType_enum, global.ng.animations, global.ng.common, global.ng.forms, global.address_bo, global.transactionTotal_bo, global.discountType_enum, global.ng.cdk.dragDrop, global.transactionAddTextLineRequest_bo, global.pagingParameters, global.transactionSearchViewRequest, global.relationKind_enum$1, global.getPurchaseOrderConfirmation, global.receiveGoodsForPurchaseOrderRequest_bo, global.purchaseOrderLineReceiptDetails_bo, global.stockStatus_enum, global.relationRequest, global.sharedapi, global.coDocument_bo, global.sharedcomponents, global.relationNameKind_enum, global.genderType_enum, global.functionUtils, global.communicationType_enum, global.contactOption_bo, global.businessObjectUtils, global.ng.cdk.scrolling, global.relationSmallObject_bo, global.receiveGoodsForPurchaseOrderCorrectionRequest_bo, global.purchaseOrderLineReceiptCorrectionDetails_bo, global.getPurchasePortalLine, global.purchasePortalFilters_bo, global.goodsReceiptStatus_bo, global.articleExtendedRequest, global.quantityInHistoricState_enum));
+})(this, (function (exports, i0, pendingReasonType_enum, sequenceName_enum, transactionKind_enum, transactionLineType_enum, validationResult, rxjs, transactionInfoResponse_bo, marketing_bo, customerFullObject_bo, country_bo, privacySetting_bo, deliveryMethod_bo, deliveryOption_bo, coDomainValue_bo, articleFullObject, customerGroup_bo, cashRegister, priceList, vat, branchLov_bo, salesPerson_bo, tag, onHoldCode_bo, warehouse_bo, paymentMethod_bo, objectUtils, relationPrivacySetting_bo, getPostalCodeRetrievalOutputParams, relationListObject_bo, transaction, notNill_function, yesNoDbType_enum, trueFalseDbType_enum, oneZeroBoolDbType_enum, dbBooleanValueType_enum, dateUtils, numberUtils, isNill_function, mapProperty_decorator, boolean_decorator, json_decorator, complexArray_decorator, imageUtils, transactionLineInfo_bo, transactionSearchView_bo, codeDescription, goodsReceiptStatusWithHistory_bo, purchasePortalLine_bo, createPaymentLinkResult_bo, paymentLinkStatus_bo, i1, transactionInfo_bo, supplierFullObject_bo, transactionDownPaymentInfo_bo, transactionLockResult_bo, relationStatus_enum, resolvePendingReasonRequest_bo, articles, stockLocation_bo, articleLight_bo, turnoverGroupImage_bo, mainArticle_bo, resolveHeaderPendingReasonRequest_bo, docDeliveryBatch_bo, nulRelationObject, relationKind_enum, corecomponents_v12, flexLayout, addressType_enum, animations, common, forms, address_bo, transactionTotal_bo, discountType_enum, dragDrop, transactionAddTextLineRequest_bo, pagingParameters, transactionSearchViewRequest, relationKind_enum$1, getPurchaseOrderConfirmation, receiveGoodsForPurchaseOrderRequest_bo, purchaseOrderLineReceiptDetails_bo, stockStatus_enum, relationRequest, sharedapi, coDocument_bo, sharedcomponents, relationNameKind_enum, genderType_enum, functionUtils, communicationType_enum, contactOption_bo, businessObjectUtils, scrolling, relationSmallObject_bo, receiveGoodsForPurchaseOrderCorrectionRequest_bo, purchaseOrderLineReceiptCorrectionDetails_bo, getPurchasePortalLine, purchasePortalFilters_bo, goodsReceiptStatus_bo, articleExtendedRequest, quantityInHistoricState_enum) { 'use strict';
     function _interopNamespace(e) {
         if (e && e.__esModule) return e;
@@ -467,6 +467,7 @@
                     "BRANCH": "Filiaal",
                     "BRANCH_NUMBER": "Filiaalnummer",
                     "BUSINESS_RULE_DISCOUNT": "Business rule korting",
+                    "BY": "Door",
                     "CANCEL": "Annuleren",
                     "CANNOT_CHANGE_NEGATIVE_QUANTITY": "Een negatieve voorraad kan niet gewijzigd worden.",
                     "CART": "Winkelwagen",
@@ -696,6 +697,7 @@
                     "REDISTRIBUTE_DISCOUNT": "Herverdeel korting",
                     "REFERENCE": "Referentie",
                     "REFERENCE_RELATION": "Ref. relatie",
+                    "RELATION_ALREADY_LOCKED": "De relatie wordt al bewerkt",
                     "RELATION_NUMBER": "Relatienummer",
                     "REMARKS": "Opmerkingen",
                     "REQUESTED_DELIVERY": "Gevraagde leverdatum",
@@ -728,6 +730,7 @@
                     "SHOPPING_CART_RESUME": "Verder winkelen",
                     "SHOW_MORE": "Toon meer",
                     "SHOW_LESS": "Toon minder",
+                    "SINCE": "Sinds",
                     "SPECIAL_DISCOUNT": "Speciale korting",
                     "SOURCE_WAREHOUSE": "Bron magazijn",
                     "STOCK": "Voorraad",
@@ -750,6 +753,7 @@
                     "TOTAL_ASSEMBLY_TIME": "Totale montagetijd",
                     "TOTAL_GROSS": "Totaal bruto",
                     "TOTAL_LINE_DISCOUNT": "Totale regelkorting",
+                    "TRANSACTION_ALREADY_LOCKED": "De transactie wordt al bewerkt",
                     "TRANSACTION_DATE": "Orderdatum",
                     "TRANSACTION_DISCOUNT": "Transactie korting",
                     "TRANSACTION_DISCOUNT_PERC": "% Trans. korting",
@@ -818,6 +822,7 @@
                     "BRANCH": "Branch",
                     "BRANCH_NUMBER": "Branch number",
                     "BUSINESS_RULE_DISCOUNT": "Business rule discount",
+                    "BY": "By",
                     "CANCEL": "Cancel",
                     "CANNOT_CHANGE_NEGATIVE_QUANTITY": "A negative supply cannot be changed.",
                     "CART": "Cart",
@@ -1034,6 +1039,7 @@
                     "RECEIVED_DELIVERED": "Received / delivered",
                     "REFERENCE": "Reference",
                     "REFERENCE_RELATION": "Ref. relation",
+                    "RELATION_ALREADY_LOCKED": "Relation is already locked",
                     "RELATION_NUMBER": "Relation number",
                     "REMARKS": "Remarks",
                     "REQUESTED_DELIVERY": "Requested delivery",
@@ -1065,6 +1071,7 @@
                     "SHOPPING_CART_RESUME": "Resume shopping",
                     "SHOW_MORE": "Show more",
                     "SHOW_LESS": "Show less",
+                    "SINCE": "Since",
                     "SPECIAL_DISCOUNT": "Special discount",
                     "SOURCE_WAREHOUSE": "Source warehouse",
                     "STOCK": "Stock",
@@ -1086,6 +1093,7 @@
                     "TOTAL_ASSEMBLY_TIME": "Total assembly time",
                     "TOTAL_GROSS": "Gross total",
                     "TOTAL_LINE_DISCOUNT": "Total linediscount",
+                    "TRANSACTION_ALREADY_LOCKED": "Transaction is already locked",
                     "TRANSACTION_DATE": "Transaction date",
                     "TRANSACTION_DISCOUNT": "Transaction discount",
                     "TRANSACTION_DISCOUNT_PERC": "% Trans. discount",
@@ -2422,6 +2430,7 @@
         Icon["DeliveryTruck"] = "delivery_truck";
         Icon["EditPencil"] = "edit_pencil";
         Icon["EllipsisLight"] = "ellipsis_light";
+        Icon["EllipsisVerticalSolid"] = "ellipsis_vertical_solid";
         Icon["FileCircleInfoSolid"] = "file_circle_info_solid";
         Icon["FilePdfSolid"] = "file_pdf_solid";
         Icon["GearSolid"] = "gear_solid";
@@ -2493,6 +2502,7 @@
         "delivery_truck": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><rect x=\"15.35\" y=\"16.56\" width=\"15.14\" height=\"10.94\" transform=\"translate(-1.83 2.08) rotate(-5)\" fill=\"#484f60\"/><path d=\"M38.5,18.1l-6.9.61L32.41,28l-7.63.67a3.76,3.76,0,0,1,1.43,2.25l7.25-.63A3.83,3.83,0,0,1,41,29.6l1-.1-.52-6Zm.29,5.84-3.91.34a.51.51,0,0,1-.55-.46L34,20.1a.49.49,0,0,1,.45-.54l2.27-.2a.5.5,0,0,1,.48.25l2,3.59A.5.5,0,0,1,38.79,23.94Z\" fill=\"#484f60\"/><path d=\"M19.66,29.09a3.8,3.8,0,0,0-1,2.46l-.74.07-1.82-.94L16,29.41Z\" fill=\"#484f60\"/><path d=\"M34.56,30.62a2.74,2.74,0,1,0,2.49-3A2.73,2.73,0,0,0,34.56,30.62Z\" fill=\"#484f60\"/><path d=\"M19.74,31.91a2.74,2.74,0,1,0,2.49-3A2.74,2.74,0,0,0,19.74,31.91Z\" fill=\"#484f60\"/><rect x=\"7.96\" y=\"17.63\" width=\"5\" height=\"1\" transform=\"translate(-1.54 0.98) rotate(-5)\" fill=\"#484f60\"/><rect x=\"11.02\" y=\"29.71\" width=\"3\" height=\"1\" transform=\"translate(-2.59 1.21) rotate(-5)\" fill=\"#484f60\"/><rect x=\"9.48\" y=\"23.53\" width=\"4\" height=\"1\" transform=\"matrix(1, -0.09, 0.09, 1, -2.05, 1.09)\" fill=\"#484f60\"/></svg>",
         "edit_pencil": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\"><polygon points=\"12.54 38.16 12 37.62 14.85 29.64 20.52 35.31 12.54 38.16\" fill=\"#484f60\"/><rect x=\"16.33\" y=\"20.52\" width=\"17.99\" height=\"8.64\" transform=\"translate(-10.15 25.18) rotate(-45)\" fill=\"#484f60\"/><path d=\"M37.54,18.73,36,20.32l-6.11-6.1,1.59-1.59a1.55,1.55,0,0,1,2.2,0l3.91,3.9A1.55,1.55,0,0,1,37.54,18.73Z\" fill=\"#484f60\"/></svg>",
         "ellipsis_light": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\"><path d=\"M352 256C352 238.3 366.3 224 384 224C401.7 224 416 238.3 416 256C416 273.7 401.7 288 384 288C366.3 288 352 273.7 352 256zM192 256C192 238.3 206.3 224 224 224C241.7 224 256 238.3 256 256C256 273.7 241.7 288 224 288C206.3 288 192 273.7 192 256zM96 256C96 273.7 81.67 288 64 288C46.33 288 32 273.7 32 256C32 238.3 46.33 224 64 224C81.67 224 96 238.3 96 256z\"/></svg>",
+        "ellipsis_vertical_solid": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 128 512\"><path d=\"M64 360c30.9 0 56 25.1 56 56s-25.1 56-56 56s-56-25.1-56-56s25.1-56 56-56zm0-160c30.9 0 56 25.1 56 56s-25.1 56-56 56s-56-25.1-56-56s25.1-56 56-56zM120 96c0 30.9-25.1 56-56 56S8 126.9 8 96S33.1 40 64 40s56 25.1 56 56z\"/></svg>",
         "file_circle_info_solid": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 576 512\"><path d=\"M0 64C0 28.65 28.65 0 64 0H224V128C224 145.7 238.3 160 256 160H384V198.6C310.1 219.5 256 287.4 256 368C256 427.1 285.1 479.3 329.7 511.3C326.6 511.7 323.3 512 320 512H64C28.65 512 0 483.3 0 448V64zM256 128V0L384 128H256zM288 368C288 288.5 352.5 224 432 224C511.5 224 576 288.5 576 368C576 447.5 511.5 512 432 512C352.5 512 288 447.5 288 368zM432 320C445.3 320 456 309.3 456 296C456 282.7 445.3 272 432 272C418.7 272 408 282.7 408 296C408 309.3 418.7 320 432 320zM416 384L416 432C407.2 432 400 439.2 400 448C400 456.8 407.2 464 416 464H448C456.8 464 464 456.8 464 448C464 439.2 456.8 432 448 432V368C448 359.2 440.8 352 432 352H416C407.2 352 400 359.2 400 368C400 376.8 407.2 384 416 384z\"/></svg>",
         "file_pdf_solid": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 384 512\"><path d=\"M88 304H80V256H88C101.3 256 112 266.7 112 280C112 293.3 101.3 304 88 304zM192 256H200C208.8 256 216 263.2 216 272V336C216 344.8 208.8 352 200 352H192V256zM224 0V128C224 145.7 238.3 160 256 160H384V448C384 483.3 355.3 512 320 512H64C28.65 512 0 483.3 0 448V64C0 28.65 28.65 0 64 0H224zM64 224C55.16 224 48 231.2 48 240V368C48 376.8 55.16 384 64 384C72.84 384 80 376.8 80 368V336H88C118.9 336 144 310.9 144 280C144 249.1 118.9 224 88 224H64zM160 368C160 376.8 167.2 384 176 384H200C226.5 384 248 362.5 248 336V272C248 245.5 226.5 224 200 224H176C167.2 224 160 231.2 160 240V368zM288 224C279.2 224 272 231.2 272 240V368C272 376.8 279.2 384 288 384C296.8 384 304 376.8 304 368V320H336C344.8 320 352 312.8 352 304C352 295.2 344.8 288 336 288H304V256H336C344.8 256 352 248.8 352 240C352 231.2 344.8 224 336 224H288zM256 0L384 128H256V0z\"/></svg>",
         "gear_solid": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path d=\"M200 0H312l17.2 78.4c15.8 6.5 30.6 15.1 44 25.4l76.5-24.4 56 97-59.4 54.1c1.1 8.3 1.7 16.8 1.7 25.4s-.6 17.1-1.7 25.4l59.4 54.1-56 97-76.5-24.4c-13.4 10.3-28.2 18.9-44 25.4L312 512H200l-17.2-78.4c-15.8-6.5-30.6-15.1-44-25.4L62.3 432.5l-56-97 59.4-54.1C64.6 273.1 64 264.6 64 256s.6-17.1 1.7-25.4L6.3 176.5l56-97 76.5 24.4c13.4-10.3 28.2-18.9 44-25.4L200 0zm56 336c44.2 0 80-35.8 80-80s-35.8-80-80-80s-80 35.8-80 80s35.8 80 80 80z\"/></svg>",
@@ -2620,7 +2630,7 @@
     ConfirmationDialogComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-confirmation-dialog",
-                    template: "\n    <co-dialog [showCloseIcon]=\"false\" [headerTemplate]=\"headerTemplate\" [footerTemplate]=\"footerTemplate\">\n      <div class=\"confirmation-dialog-wrapper\">\n        <div class=\"text\" [innerHTML]=\"text\"></div>\n        <co-collapsible [headerTitle]=\"'DETAILS' | localize\" [iconData]=\"iconCacheService.getIcon(icons.TriangleDown)\" *ngIf=\"details\">\n          <div class=\"dialog-details\" [innerHTML]=\"details\"></div>\n        </co-collapsible>\n      </div>\n    </co-dialog>\n    <ng-template #headerTemplate>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"title | localize\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"button-wrapper\">\n        <ng-container *ngIf=\"type === ptype.Confirmation\">\n          <co-button [label]=\"'YES' | localize\" (click)=\"handleYesClick($event)\"></co-button>\n          <co-button [label]=\"'NO' | localize\" (click)=\"handleNoClick($event)\"></co-button>\n        </ng-container>\n        <ng-container *ngIf=\"type === ptype.Information || type === ptype.Error\">\n          <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick($event)\"></co-button>\n        </ng-container>\n      </div>\n    </ng-template>\n  ",
+                    template: "\n    <co-dialog [showCloseIcon]=\"false\" [headerTemplate]=\"headerTemplate\" [footerTemplate]=\"footerTemplate\">\n      <div class=\"confirmation-dialog-wrapper\">\n        <div class=\"text\" [innerHTML]=\"text\"></div>\n        <co-collapsible [headerTitle]=\"'DETAILS' | localize\" [iconData]=\"iconCacheService.getIcon(icons.TriangleDown)\" *ngIf=\"details\">\n          <div class=\"dialog-details\" [innerHTML]=\"details\"></div>\n        </co-collapsible>\n      </div>\n    </co-dialog>\n    <ng-template #headerTemplate>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"title | localize\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\">\n        <ng-container *ngIf=\"type === ptype.Confirmation\">\n          <co-button [label]=\"'YES' | localize\" (click)=\"handleYesClick($event)\"></co-button>\n          <co-button [label]=\"'NO' | localize\" (click)=\"handleNoClick($event)\"></co-button>\n        </ng-container>\n        <ng-container *ngIf=\"type === ptype.Information || type === ptype.Error\">\n          <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick($event)\"></co-button>\n        </ng-container>\n      </div>\n    </ng-template>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -2685,7 +2695,7 @@
     CharacteristicAnswerComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-characteristic-answer",
-                    template: "\n    <co-dialog [showCloseIcon]=\"false\" [modal]=\"true\" [headerTemplate]=\"headerTemplate\" [footerTemplate]=\"footerTemplate\">\n      <ng-container *ngIf=\"choices && choices.length > 0\">\n        <div class=\"co-transaction-default-popup-row\" *ngFor=\"let choice of viewModels\">\n          <co-input-checkbox [model]=\"choice.checked\" [label]=\"choice.value\" (click)=\"handleChecked($event, choice.value)\"></co-input-checkbox>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!choices || choices.length === 0\">\n        <co-input-text\n          [(model)]=\"value\"\n          (enter)=\"handleOkClick()\"\n        ></co-input-text>\n      </ng-container>\n    </co-dialog>\n    <ng-template #headerTemplate>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"title\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
+                    template: "\n    <co-dialog [showCloseIcon]=\"false\" [modal]=\"true\" [headerTemplate]=\"headerTemplate\" [footerTemplate]=\"footerTemplate\">\n      <ng-container *ngIf=\"choices && choices.length > 0\">\n        <div class=\"co-transaction-default-popup-row\" *ngFor=\"let choice of viewModels\">\n          <co-input-checkbox [model]=\"choice.checked\" [label]=\"choice.value\" (click)=\"handleChecked($event, choice.value)\"></co-input-checkbox>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"!choices || choices.length === 0\">\n        <co-input-text\n          [(model)]=\"value\"\n          (enter)=\"handleOkClick()\"\n        ></co-input-text>\n      </ng-container>\n    </co-dialog>\n    <ng-template #headerTemplate>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"title\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -2700,145 +2710,11 @@
         showClass: [{ type: i0.HostBinding, args: ['class.co-characteristic-answer',] }]
     };
-    var TransactionFilterPopupBaseComponent = /** @class */ (function () {
-        function TransactionFilterPopupBaseComponent() {
-            this.autoClose = false;
-            this.useModel = true;
-            this.valueChange = new i0.EventEmitter();
-            this.closeAfterCommit = new i0.EventEmitter();
-            this.viewModels = [];
-            this.viewModelsFiltered = [];
-            this.propsForLabel = [];
-            this._collection = [];
-        }
-        Object.defineProperty(TransactionFilterPopupBaseComponent.prototype, "searchText", {
-            get: function () {
-                return this._searchText;
-            },
-            set: function (value) {
-                this._searchText = value;
-                this._doSearch();
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(TransactionFilterPopupBaseComponent.prototype, "collection", {
-            get: function () {
-                return this._collection;
-            },
-            set: function (value) {
-                this._collection = value;
-                this.prepareViewModels();
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(TransactionFilterPopupBaseComponent.prototype, "model", {
-            get: function () {
-                return undefined;
-            },
-            enumerable: false,
-            configurable: true
-        });
-        TransactionFilterPopupBaseComponent.prototype.commit = function (value) {
-            return Promise.resolve(true);
-        };
-        TransactionFilterPopupBaseComponent.prototype.handleChecked = function (row) {
-            return __awaiter(this, void 0, void 0, function () {
-                var currentModel, i;
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
-                        case 0:
-                            row.checked = true;
-                            currentModel = this.viewModels.find(function (v) { return v.value === row.value; });
-                            if (currentModel) {
-                                currentModel.checked = true;
-                            }
-                            for (i = 0; i < this.viewModels.length; i++) {
-                                if (this.viewModels[i].value !== row.value) {
-                                    this.viewModels[i].checked = false;
-                                }
-                            }
-                            if (!this.useModel) return [3 /*break*/, 4];
-                            if (!this.autoClose) return [3 /*break*/, 2];
-                            return [4 /*yield*/, this.commit(row.value)];
-                        case 1:
-                            if (_a.sent()) {
-                                this.closeAfterCommit.emit();
-                            }
-                            return [3 /*break*/, 3];
-                        case 2:
-                            this.commit(row.value);
-                            _a.label = 3;
-                        case 3: return [3 /*break*/, 5];
-                        case 4:
-                            this.valueChange.emit(row.value);
-                            _a.label = 5;
-                        case 5: return [2 /*return*/];
-                    }
-                });
-            });
-        };
-        TransactionFilterPopupBaseComponent.prototype.prepareViewModels = function () {
-            var _this = this;
-            this.collection.forEach(function (d, index) {
-                var labels = _this.propsForLabel.map(function (p) { return d[p]; });
-                _this.viewModels.push({
-                    value: d[_this.codeField],
-                    propsForLabel: labels,
-                    checked: (_this.useModel && _this.model && _this.checkField) ?
-                        _this.model[_this.checkField] === d[_this.codeField] :
-                        (_this.value ? _this.value === d[_this.codeField] : index === 0)
-                });
-            });
-            this.viewModelsFiltered = this.viewModels.slice();
-            if (!this.useModel && this.viewModels.length > 0) {
-                this.valueChange.next(this.value ? this.value : this.viewModels[0].value);
-            }
-        };
-        TransactionFilterPopupBaseComponent.prototype._doSearch = function () {
-            var _this = this;
-            this.viewModelsFiltered = JSON.parse(JSON.stringify(this.viewModels));
-            if (this.searchText) {
-                this.viewModelsFiltered = this.viewModelsFiltered.filter(function (vmf) {
-                    return vmf.propsForLabel.find(function (p) { return p && p.toString().match(new RegExp(_this.searchText, 'gi')); });
-                });
-                // if (!this.searchText) {
-                //   this.viewModelsFiltered = this.viewModels.slice();
-                // } else {
-                // this.viewModelsFiltered = JSON.parse(JSON.stringify(this.viewModels));
-                // for (let i = 0; i < this.viewModelsFiltered.length; i++) {
-                //   const vmf = this.viewModelsFiltered[i];
-                //   for (let j = 0; j < vmf.propsForLabel.length; j++) {
-                //     if (vmf.propsForLabel[j]) {
-                //       vmf.propsForLabel[j] = vmf.propsForLabel[j].replace(new RegExp(this.searchText, 'gi'), `<span class="highlight">${this.searchText}</span>`);
-                //     }
-                //   }
-                // }
-            }
-        };
-        return TransactionFilterPopupBaseComponent;
-    }());
-    TransactionFilterPopupBaseComponent.decorators = [
-        { type: i0.Directive }
-    ];
-    TransactionFilterPopupBaseComponent.propDecorators = {
-        autoClose: [{ type: i0.Input }],
-        useModel: [{ type: i0.Input }],
-        searchText: [{ type: i0.Input }],
-        value: [{ type: i0.Input }],
-        valueChange: [{ type: i0.Output }],
-        closeAfterCommit: [{ type: i0.Output }]
-    };
-    var TransactionLineBaseComponent = /** @class */ (function (_super) {
-        __extends(TransactionLineBaseComponent, _super);
+    var TransactionLineBaseComponent = /** @class */ (function () {
         function TransactionLineBaseComponent() {
-            var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
-            _this.readonly = false;
-            _this._transactionLine = new transactionLineInfo_bo.TransactionLineInfo();
-            _this._transactionInfo = new transactionInfo_bo.TransactionInfo();
-            return _this;
+            this.readonly = false;
+            this._transactionLine = new transactionLineInfo_bo.TransactionLineInfo();
+            this._transactionInfo = new transactionInfo_bo.TransactionInfo();
         }
         Object.defineProperty(TransactionLineBaseComponent.prototype, "transactionLine", {
             get: function () {
@@ -2885,7 +2761,7 @@
             event.stopPropagation();
         };
         return TransactionLineBaseComponent;
-    }(TransactionFilterPopupBaseComponent));
+    }());
     TransactionLineBaseComponent.decorators = [
         { type: i0.Directive }
     ];
@@ -2899,6 +2775,8 @@
         function DialogTransactionLineBaseComponent() {
             var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
             _this.buttonType = AppPopupButtonType;
+            _this.autoClose = false;
+            _this.useModel = true;
             _this.close = new i0.EventEmitter();
             return _this;
         }
@@ -2924,6 +2802,8 @@
         { type: i0.Directive }
     ];
     DialogTransactionLineBaseComponent.propDecorators = {
+        autoClose: [{ type: i0.Input }],
+        useModel: [{ type: i0.Input }],
         close: [{ type: i0.Output }]
     };
@@ -2940,7 +2820,7 @@
     DialogTransactionLineWarehouseComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-dialog-transaction-line-warehouse",
-                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-warehouse\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"\n      ></co-transaction-line-warehouse>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'WAREHOUSE'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
+                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-warehouse\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"\n      ></co-transaction-line-warehouse>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'WAREHOUSE'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -2961,7 +2841,7 @@
     DialogTransactionLineCommissionCodeComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-dialog-transaction-line-commission-code",
-                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-commission-code\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionInfo]=\"transactionInfo\"\n        [transactionLine]=\"transactionLine\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"></co-transaction-line-commission-code>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'COMMISSION_CODE' | localize\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
+                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-commission-code\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionInfo]=\"transactionInfo\"\n        [transactionLine]=\"transactionLine\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"></co-transaction-line-commission-code>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'COMMISSION_CODE' | localize\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -3058,7 +2938,7 @@
     DialogTransactionLineWarehouseLocationComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-dialog-transaction-line-warehouse-location",
-                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"showClose\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-warehouse-location\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        [warehouseNr]=\"warehouseNr\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"\n      ></co-transaction-line-warehouse-location>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'LOCATION'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n    ",
+                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"showClose\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-warehouse-location\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        [warehouseNr]=\"warehouseNr\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"\n      ></co-transaction-line-warehouse-location>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'LOCATION'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n    ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -3103,7 +2983,7 @@
     DialogTransactionLineWarehouseCcComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-dialog-transaction-line-warehouse-cc",
-                    template: "\n    <co-dialog\n      [customCssClass]=\"'co-transaction-small-toolbar'\"\n      [headerTemplate]=\"dialogHeader\"\n      [footerTemplate]=\"footerTemplate\"\n      (closeClick)=\"handleDialogClose()\">\n      <div class=\"transaction-line-warehouse-cc-section\">\n        <co-input-number-picker class=\"quantity-number-picker\"\n                                [(model)]=\"quantity\" [min]=\"1\"\n                                (modelChange)=\"handleQuantityChange($event)\"></co-input-number-picker>\n      </div>\n      <div class=\"transaction-line-warehouse-cc-section\">\n        <div class=\"transaction-line-warehouse-cc-section-label\" [textContent]=\"'COMMISSION_CODE' | localize\"></div>\n        <co-transaction-line-commission-code\n          [value]=\"commissionCode\"\n          [useModel]=\"false\"\n          (valueChange)=\"handleCommissionCodeChange($event)\"></co-transaction-line-commission-code>\n      </div>\n      <div class=\"transaction-line-warehouse-cc-section\">\n        <div class=\"transaction-line-warehouse-cc-section-label\" [textContent]=\"'WAREHOUSE' | localize\"></div>\n        <co-transaction-line-warehouse\n          [value]=\"warehouse\"\n          [useModel]=\"false\"\n          (valueChange)=\"handleWarehouseChange($event)\"></co-transaction-line-warehouse>\n      </div>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'COMMISSION_CODE_WAREHOUSE_SELECTION' | localize\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
+                    template: "\n    <co-dialog\n      [customCssClass]=\"'co-transaction-small-toolbar'\"\n      [headerTemplate]=\"dialogHeader\"\n      [footerTemplate]=\"footerTemplate\"\n      (closeClick)=\"handleDialogClose()\">\n      <div class=\"transaction-line-warehouse-cc-section\">\n        <co-input-number-picker class=\"quantity-number-picker\"\n                                [(model)]=\"quantity\" [min]=\"1\"\n                                (modelChange)=\"handleQuantityChange($event)\"></co-input-number-picker>\n      </div>\n      <div class=\"transaction-line-warehouse-cc-section\">\n        <div class=\"transaction-line-warehouse-cc-section-label\" [textContent]=\"'COMMISSION_CODE' | localize\"></div>\n        <co-transaction-line-commission-code\n          [value]=\"commissionCode\"\n          [useModel]=\"false\"\n          (valueChange)=\"handleCommissionCodeChange($event)\"></co-transaction-line-commission-code>\n      </div>\n      <div class=\"transaction-line-warehouse-cc-section\">\n        <div class=\"transaction-line-warehouse-cc-section-label\" [textContent]=\"'WAREHOUSE' | localize\"></div>\n        <co-transaction-line-warehouse\n          [value]=\"warehouse\"\n          [useModel]=\"false\"\n          (valueChange)=\"handleWarehouseChange($event)\"></co-transaction-line-warehouse>\n      </div>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'COMMISSION_CODE_WAREHOUSE_SELECTION' | localize\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -3538,6 +3418,26 @@
                 });
             });
         };
+        TransactionConnectorAdapterService.prototype.lockTransactionById = function (transactionId, version) {
+            return __awaiter(this, void 0, void 0, function () {
+                var result;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0: return [4 /*yield*/, this.connector.lockTransactionByTransId(transactionId, version)];
+                        case 1:
+                            result = _a.sent();
+                            if (result.validationResult && result.validationResult.success) {
+                                return [2 /*return*/, this._boFactory.makeWithRawBackendData(transactionLockResult_bo.TransactionLockResult, result.resultObject)];
+                            }
+                            else {
+                                this._handleExceptionFromResponse(result);
+                                return [2 /*return*/, null];
+                            }
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
         TransactionConnectorAdapterService.prototype.getCustomerFullObject = function (relationNo) {
             return __awaiter(this, void 0, void 0, function () {
                 var result;
@@ -4329,6 +4229,32 @@
                 });
             });
         };
+        TransactionConnectorAdapterService.prototype.changeTransactionLineSupplier = function (uuid, lineUuid, id) {
+            return __awaiter(this, void 0, void 0, function () {
+                var request, response;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            request = {
+                                transactionUuid: uuid,
+                                lineUuid: lineUuid,
+                                newSupplierId: id
+                            };
+                            return [4 /*yield*/, this.connector.changeTransactionLineSupplier(request)];
+                        case 1:
+                            response = _a.sent();
+                            if (response && response.validationResult && response.validationResult.success) {
+                                return [2 /*return*/, this._boFactory.makeWithRawBackendData(transactionInfoResponse_bo.TransactionInfoResponse, response.resultObject)];
+                            }
+                            else {
+                                this._handleExceptionFromResponse(response);
+                                return [2 /*return*/, null];
+                            }
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
         TransactionConnectorAdapterService.prototype.changeTransactionLineWarehouse = function (uuid, lineUuid, warehouseNumber) {
             return __awaiter(this, void 0, void 0, function () {
                 var request, response;
@@ -5397,6 +5323,92 @@
                 });
             });
         };
+        TransactionConnectorAdapterService.prototype.generateCommissionOrders = function (transId, onlyGenerateForDirectSellSuppliers) {
+            return __awaiter(this, void 0, void 0, function () {
+                var _this = this;
+                return __generator(this, function (_a) {
+                    return [2 /*return*/, new Promise(function (resolve, reject) {
+                            return _this.connector.generateCommissionOrders(transId, onlyGenerateForDirectSellSuppliers).then(function (result) { return __awaiter(_this, void 0, void 0, function () {
+                                return __generator(this, function (_a) {
+                                    if (result.validationResult && result.validationResult.success) {
+                                        resolve(true);
+                                    }
+                                    else {
+                                        reject(result.validationMessagesAsString);
+                                    }
+                                    return [2 /*return*/];
+                                });
+                            }); });
+                        })];
+                });
+            });
+        };
+        TransactionConnectorAdapterService.prototype.lockCustomerFullObject = function (relationNr) {
+            var _this = this;
+            return new Promise(function (resolve, reject) {
+                return _this.connector.lockCustomerById(relationNr).then(function (result) { return __awaiter(_this, void 0, void 0, function () {
+                    return __generator(this, function (_a) {
+                        resolve(result.validationResult);
+                        return [2 /*return*/];
+                    });
+                }); });
+            });
+        };
+        TransactionConnectorAdapterService.prototype.lockSupplierFullObject = function (relationNr) {
+            var _this = this;
+            return new Promise(function (resolve, reject) {
+                return _this.connector.lockSupplierById(relationNr).then(function (result) { return __awaiter(_this, void 0, void 0, function () {
+                    return __generator(this, function (_a) {
+                        resolve(result.validationResult);
+                        return [2 /*return*/];
+                    });
+                }); });
+            });
+        };
+        TransactionConnectorAdapterService.prototype.lockEmployeeFullObject = function (relationNr) {
+            var _this = this;
+            return new Promise(function (resolve, reject) {
+                return _this.connector.lockEmployeeById(relationNr).then(function (result) { return __awaiter(_this, void 0, void 0, function () {
+                    return __generator(this, function (_a) {
+                        resolve(result.validationResult);
+                        return [2 /*return*/];
+                    });
+                }); });
+            });
+        };
+        TransactionConnectorAdapterService.prototype.lockBranchFullObject = function (relationNr) {
+            var _this = this;
+            return new Promise(function (resolve, reject) {
+                return _this.connector.lockBranchById(relationNr).then(function (result) { return __awaiter(_this, void 0, void 0, function () {
+                    return __generator(this, function (_a) {
+                        resolve(result.validationResult);
+                        return [2 /*return*/];
+                    });
+                }); });
+            });
+        };
+        TransactionConnectorAdapterService.prototype.lockCompanyFullObject = function (relationNr) {
+            var _this = this;
+            return new Promise(function (resolve, reject) {
+                return _this.connector.lockCompanyById(relationNr).then(function (result) { return __awaiter(_this, void 0, void 0, function () {
+                    return __generator(this, function (_a) {
+                        resolve(result.validationResult);
+                        return [2 /*return*/];
+                    });
+                }); });
+            });
+        };
+        TransactionConnectorAdapterService.prototype.lockContactPerson = function (relationNr) {
+            var _this = this;
+            return new Promise(function (resolve, reject) {
+                return _this.connector.lockContactPersonById(relationNr).then(function (result) { return __awaiter(_this, void 0, void 0, function () {
+                    return __generator(this, function (_a) {
+                        resolve(result.validationResult);
+                        return [2 /*return*/];
+                    });
+                }); });
+            });
+        };
         TransactionConnectorAdapterService.prototype._handleExceptionFromResponse = function (result) {
             this._errorService.showValidationError(result);
         };
@@ -5531,6 +5543,9 @@
         TransactionConnectorService.prototype.getTransactionById = function (transactionId) {
             return this._adapterService.getTransactionById(transactionId);
         };
+        TransactionConnectorService.prototype.lockTransactionById = function (transId, version) {
+            return this._adapterService.lockTransactionById(transId, version);
+        };
         TransactionConnectorService.prototype.commit = function () {
             return this._adapterService.commit();
         };
@@ -5850,6 +5865,13 @@
                 });
             });
         };
+        TransactionConnectorService.prototype.changeTransactionLineSupplier = function (uuid, lineUuid, id) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    return [2 /*return*/, this._adapterService.changeTransactionLineSupplier(uuid, lineUuid, id)];
+                });
+            });
+        };
         TransactionConnectorService.prototype.changeTransactionLineWarehouse = function (uuid, lineUuid, warehouseNumber) {
             return __awaiter(this, void 0, void 0, function () {
                 return __generator(this, function (_a) {
@@ -6144,6 +6166,27 @@
                 });
             });
         };
+        TransactionConnectorService.prototype.generateCommissionOrders = function (transId, onlyGenerateForDirectSellSuppliers) {
+            return this._adapterService.generateCommissionOrders(transId, onlyGenerateForDirectSellSuppliers);
+        };
+        TransactionConnectorService.prototype.lockCustomerFullObject = function (relationNr) {
+            return this._adapterService.lockCustomerFullObject(relationNr);
+        };
+        TransactionConnectorService.prototype.lockSupplierFullObject = function (relationNr) {
+            return this._adapterService.lockSupplierFullObject(relationNr);
+        };
+        TransactionConnectorService.prototype.lockEmployeeFullObject = function (relationNr) {
+            return this._adapterService.lockEmployeeFullObject(relationNr);
+        };
+        TransactionConnectorService.prototype.lockBranchFullObject = function (relationNr) {
+            return this._adapterService.lockBranchFullObject(relationNr);
+        };
+        TransactionConnectorService.prototype.lockCompanyFullObject = function (relationNr) {
+            return this._adapterService.lockCompanyFullObject(relationNr);
+        };
+        TransactionConnectorService.prototype.lockContactPerson = function (relationNr) {
+            return this._adapterService.lockContactPerson(relationNr);
+        };
         return TransactionConnectorService;
     }());
     TransactionConnectorService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function TransactionConnectorService_Factory() { return new TransactionConnectorService(i0__namespace.ɵɵinject(TransactionConnectorAdapterService), i0__namespace.ɵɵinject(SelectSingleCacheService), i0__namespace.ɵɵinject(SelectMultipleCacheService), i0__namespace.ɵɵinject(SelectMultipleParameterizedCacheService)); }, token: TransactionConnectorService, providedIn: "root" });
@@ -6267,12 +6310,44 @@
         { type: OptionsService }
     ]; };
+    var TransactionEventService = /** @class */ (function () {
+        function TransactionEventService() {
+            this.addToCartBySku = new rxjs.Subject();
+            this.addToCartBySelectorResult = new rxjs.Subject();
+            this.openShoppingCartModule = new rxjs.Subject();
+            this.loggedIn = new rxjs.Subject();
+            this.addNewUserToShoppingCartModule = new rxjs.Subject();
+            this.addUserRelationShoppingCartModule = new rxjs.Subject();
+            this.addArticleLine = new rxjs.Subject();
+            this.addTextLine = new rxjs.Subject();
+            this.addArticleLineAt = new rxjs.Subject();
+            this.addTextLineAt = new rxjs.Subject();
+            this.changeLineSequence = new rxjs.Subject();
+            this.transactionLineClicked = new rxjs.Subject();
+            this.rightSidebarClose = new rxjs.Subject();
+            this.scrollContent = new rxjs.Subject();
+            this.commitReceivePurchaseOrders = new rxjs.Subject();
+            this.selectAllLines = new rxjs.Subject();
+            this.transactionLineChanged = new rxjs.Subject();
+            this.openSidePanel = new rxjs.Subject();
+            this.selectAllSalesOrderLinesForPurchase = new rxjs.Subject();
+            this.generateCommissionOrders = new rxjs.Subject();
+        }
+        return TransactionEventService;
+    }());
+    TransactionEventService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function TransactionEventService_Factory() { return new TransactionEventService(); }, token: TransactionEventService, providedIn: "root" });
+    TransactionEventService.decorators = [
+        { type: i0.Injectable, args: [{ providedIn: "root" },] }
+    ];
     var PendingReasonService = /** @class */ (function () {
-        function PendingReasonService(dialogService, options, connector, articleConnector) {
+        function PendingReasonService(dialogService, options, connector, articleConnector, dictionaryService, transactionEventService) {
             this.dialogService = dialogService;
             this.options = options;
             this.connector = connector;
             this.articleConnector = articleConnector;
+            this.dictionaryService = dictionaryService;
+            this.transactionEventService = transactionEventService;
             this.logout = new rxjs.Subject();
             this.transactionUpdated = new rxjs.BehaviorSubject(undefined);
             this.relationUpdated = new rxjs.BehaviorSubject(undefined);
@@ -6706,7 +6781,7 @@
         };
         return PendingReasonService;
     }());
-    PendingReasonService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function PendingReasonService_Factory() { return new PendingReasonService(i0__namespace.ɵɵinject(DialogService), i0__namespace.ɵɵinject(OptionsService), i0__namespace.ɵɵinject(TransactionConnectorService), i0__namespace.ɵɵinject(ArticleConnectorService)); }, token: PendingReasonService, providedIn: "root" });
+    PendingReasonService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function PendingReasonService_Factory() { return new PendingReasonService(i0__namespace.ɵɵinject(DialogService), i0__namespace.ɵɵinject(OptionsService), i0__namespace.ɵɵinject(TransactionConnectorService), i0__namespace.ɵɵinject(ArticleConnectorService), i0__namespace.ɵɵinject(DictionaryService), i0__namespace.ɵɵinject(TransactionEventService)); }, token: PendingReasonService, providedIn: "root" });
     PendingReasonService.decorators = [
         { type: i0.Injectable, args: [{
                     providedIn: "root"
@@ -6716,13 +6791,24 @@
         { type: DialogService },
         { type: OptionsService },
         { type: TransactionConnectorService },
-        { type: ArticleConnectorService }
+        { type: ArticleConnectorService },
+        { type: DictionaryService },
+        { type: TransactionEventService }
     ]; };
     var TransactionService = /** @class */ (function (_super) {
         __extends(TransactionService, _super);
         function TransactionService() {
-            return _super !== null && _super.apply(this, arguments) || this;
+            var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+            _this._lockMethods = new Map([
+                [relationKind_enum.RelationKind.Customer, function (relationNr) { return _this._lockCustomerFullObject(relationNr); }],
+                [relationKind_enum.RelationKind.Supplier, function (relationNr) { return _this._lockSupplierFullObject(relationNr); }],
+                [relationKind_enum.RelationKind.Personnel, function (relationNr) { return _this._lockEmployeeFullObject(relationNr); }],
+                [relationKind_enum.RelationKind.Branch, function (relationNr) { return _this._lockBranchFullObject(relationNr); }],
+                [relationKind_enum.RelationKind.Company, function (relationNr) { return _this._lockCompanyFullObject(relationNr); }],
+                [relationKind_enum.RelationKind.ContactPerson, function (relationNr) { return _this._lockContactPerson(relationNr); }],
+            ]);
+            return _this;
         }
         TransactionService.prototype.pendingLineOperationStatus = function (lineOperationStatuses) {
             var status = lineOperationStatuses.find(function (line) { return line.pendingReasonType !== pendingReasonType_enum.PendingReasonType.NONE
@@ -6731,57 +6817,48 @@
         };
         TransactionService.prototype.updatePriceTransactionLine = function (uuid, lineUuid, price) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLinePrice(uuid, lineUuid, price)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
         };
         TransactionService.prototype.updateReferenceTransactionLine = function (uuid, lineUuid, reference) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLineReference(uuid, lineUuid, reference)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
         };
         TransactionService.prototype.updateGoodDescriptionTransactionLine = function (uuid, lineUuid, goodDescription) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLineGoodDescription(uuid, lineUuid, goodDescription)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
@@ -7111,133 +7188,128 @@
         };
         TransactionService.prototype.updateQuantityTransactionLine = function (uuid, lineUuid, quantity) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLineQuantity(uuid, lineUuid, quantity)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
         };
         TransactionService.prototype.updateDeliveryDateTransactionLine = function (uuid, lineUuid, date) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLineDeliveryDate(uuid, lineUuid, date)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
         };
         TransactionService.prototype.updatePriceListTransactionLine = function (uuid, lineUuid, priceList) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLinePriceList(uuid, lineUuid, priceList)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
         };
         TransactionService.prototype.updateVatTransactionLine = function (uuid, lineUuid, id) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLineVat(uuid, lineUuid, id)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
         };
         TransactionService.prototype.updateCommissionCodeTransactionLine = function (uuid, lineUuid, code) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLineCommissionCode(uuid, lineUuid, code)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
+                    }
+                });
+            });
+        };
+        TransactionService.prototype.updateSupplierTransactionLine = function (uuid, lineUuid, id) {
+            return __awaiter(this, void 0, void 0, function () {
+                var response;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0: return [4 /*yield*/, this.connector.changeTransactionLineSupplier(uuid, lineUuid, id)];
+                        case 1:
+                            response = _a.sent();
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
         };
         TransactionService.prototype.updateWarehouseTransactionLine = function (uuid, lineUuid, warehouseNumber) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLineWarehouse(uuid, lineUuid, warehouseNumber)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
         };
         TransactionService.prototype.updateDeliveryMethodTransactionLine = function (uuid, lineUuid, method) {
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLineDeliveryMethod(uuid, lineUuid, method)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
                     }
                 });
             });
@@ -7246,19 +7318,32 @@
             if (reason === void 0) { reason = ""; }
             if (code === void 0) { code = ""; }
             return __awaiter(this, void 0, void 0, function () {
-                var response, success;
+                var response;
                 return __generator(this, function (_a) {
                     switch (_a.label) {
                         case 0: return [4 /*yield*/, this.connector.changeTransactionLineLineDiscount(uuid, lineUuid, type, discount, reason, code)];
                         case 1:
                             response = _a.sent();
-                            if (!response) return [3 /*break*/, 3];
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 2:
-                            success = _a.sent();
-                            this.rememberCurrentTransaction(response);
-                            return [2 /*return*/, success];
-                        case 3: return [2 /*return*/, false];
+                            if (response) {
+                                return [2 /*return*/, this.handleLineOperationStatuses(response)];
+                            }
+                            return [2 /*return*/, false];
+                    }
+                });
+            });
+        };
+        TransactionService.prototype.generateCommissionOrders = function (transId, onlyGenerateForDirectSellSuppliers) {
+            return __awaiter(this, void 0, void 0, function () {
+                var response;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            this.transactionEventService.generateCommissionOrders.next(true);
+                            return [4 /*yield*/, this.connector.generateCommissionOrders(transId, onlyGenerateForDirectSellSuppliers)];
+                        case 1:
+                            response = _a.sent();
+                            this.transactionEventService.generateCommissionOrders.next(false);
+                            return [2 /*return*/, response];
                     }
                 });
             });
@@ -7325,21 +7410,51 @@
             var _this = this;
             return new Promise(function (resolve, reject) {
                 _this.connector.getTransactionById(transactionId)
-                    .then(function (response) {
-                    if (response.isSuccess) {
-                        _this.rememberCurrentTransaction(response);
-                        _this.transactionUpdated.next(response);
-                        resolve(true);
-                    }
-                    else {
-                        reject(false);
-                    }
-                })
+                    .then(function (transaction) { return __awaiter(_this, void 0, void 0, function () {
+                    var lockResponse, lockDetails;
+                    return __generator(this, function (_a) {
+                        switch (_a.label) {
+                            case 0:
+                                if (!transaction.isSuccess) return [3 /*break*/, 2];
+                                return [4 /*yield*/, this.lockTransaction(transaction.transactionInfo.id, 0)];
+                            case 1:
+                                lockResponse = _a.sent();
+                                if (lockResponse && lockResponse.isLockSuccess) {
+                                    this.rememberCurrentTransaction(transaction);
+                                    this.transactionUpdated.next(transaction);
+                                }
+                                else {
+                                    lockDetails = this.dictionaryService.get("BY") + ": " + lockResponse.lockedBy + "\n              " + this.dictionaryService.get("SINCE", false) + " " + lockResponse.lockedSince.toLocaleString();
+                                    this.dialogService.showError(this.dictionaryService.get("TRANSACTION_ALREADY_LOCKED"), lockDetails);
+                                }
+                                resolve(true);
+                                return [3 /*break*/, 3];
+                            case 2:
+                                reject(false);
+                                _a.label = 3;
+                            case 3: return [2 /*return*/];
+                        }
+                    });
+                }); })
                     .catch(function (reason) {
                     reject(false);
                 });
             });
         };
+        TransactionService.prototype.lockRelation = function (relationKind, relationNr) {
+            var lockMethod = this._lockMethods.get(relationKind);
+            if (lockMethod) {
+                return lockMethod.call(this, relationNr);
+            }
+            else {
+                var result = new validationResult.ValidationResult();
+                result.success = false;
+                return Promise.resolve(result);
+            }
+        };
+        TransactionService.prototype.lockTransaction = function (transId, version) {
+            return this.connector.lockTransactionById(transId, version);
+        };
         TransactionService.prototype.commit = function () {
             return this.connector.commit();
         };
@@ -7449,12 +7564,7 @@
                             return [4 /*yield*/, this.connector.addTransactionLine(this.currentTransaction.transactionInfo.uuid, transactionLineType_enum.TransactionLineType.ArticleLine, articleNo, null, null, null, isReturn, aboveLineNr, belowLineNr)];
                         case 2:
                             response = _a.sent();
-                            return [4 /*yield*/, this.handleLineOperationStatuses(response)];
-                        case 3:
-                            if (_a.sent()) {
-                                this.rememberCurrentTransaction(response);
-                            }
-                            return [2 /*return*/, true];
+                            return [2 /*return*/, this.handleLineOperationStatuses(response)];
                     }
                 });
             });
@@ -7802,9 +7912,27 @@
                 });
             });
         };
+        TransactionService.prototype._lockCustomerFullObject = function (relationNr) {
+            return this.connector.lockCustomerFullObject(relationNr);
+        };
+        TransactionService.prototype._lockSupplierFullObject = function (relationNr) {
+            return this.connector.lockSupplierFullObject(relationNr);
+        };
+        TransactionService.prototype._lockEmployeeFullObject = function (relationNr) {
+            return this.connector.lockEmployeeFullObject(relationNr);
+        };
+        TransactionService.prototype._lockBranchFullObject = function (relationNr) {
+            return this.connector.lockBranchFullObject(relationNr);
+        };
+        TransactionService.prototype._lockCompanyFullObject = function (relationNr) {
+            return this.connector.lockCompanyFullObject(relationNr);
+        };
+        TransactionService.prototype._lockContactPerson = function (relationNr) {
+            return this.connector.lockContactPerson(relationNr);
+        };
         return TransactionService;
     }(PendingReasonService));
-    TransactionService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function TransactionService_Factory() { return new TransactionService(i0__namespace.ɵɵinject(DialogService), i0__namespace.ɵɵinject(OptionsService), i0__namespace.ɵɵinject(TransactionConnectorService), i0__namespace.ɵɵinject(ArticleConnectorService)); }, token: TransactionService, providedIn: "root" });
+    TransactionService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function TransactionService_Factory() { return new TransactionService(i0__namespace.ɵɵinject(DialogService), i0__namespace.ɵɵinject(OptionsService), i0__namespace.ɵɵinject(TransactionConnectorService), i0__namespace.ɵɵinject(ArticleConnectorService), i0__namespace.ɵɵinject(DictionaryService), i0__namespace.ɵɵinject(TransactionEventService)); }, token: TransactionService, providedIn: "root" });
     TransactionService.decorators = [
         { type: i0.Injectable, args: [{
                     providedIn: "root"
@@ -7936,7 +8064,7 @@
     CheckoutComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-checkout",
-                    template: "\n    <co-stepper #stepper [finishButtonLabel]=\"'CHECKOUT_FINISH' | localize\" (finishStep)=\"handleFinishStep()\">\n      <co-stepper-step #stepRelation [index]=\"1\" [label]=\"'YOUR_DATA' | localize\" (validateStep)=\"handleRelationValidation()\">\n        <co-checkout-overview-relation-edit #checkoutRelation *ngIf=\"stepRelation.show\" [(relation)]=\"service.relation\"\n                                            [deliveryAddressNawNr]=\"deliveryAddressNawNr\"\n                                            [invoiceAddressNawNr]=\"invoiceAddressNawNr\"\n                                            (deliveryAddressChange)=\"handleDeliveryAddressChange($event)\"\n                                            (invoiceAddressChange)=\"handleInvoiceAddressChange($event)\"\n                                            (relationChange)=\"service.relation = $event\"\n        ></co-checkout-overview-relation-edit>\n      </co-stepper-step>\n      <co-stepper-step #stepDelivery [index]=\"2\" [label]=\"'DELIVERY' | localize\" (validateStep)=\"handleDeliveryValidation()\">\n        <co-checkout-overview-delivery-edit #checkoutDelivery *ngIf=\"stepDelivery.show\"\n                                            [transaction]=\"service.currentTransaction\"\n        ></co-checkout-overview-delivery-edit>\n      </co-stepper-step>\n      <co-stepper-step #stepOverview [index]=\"3\" [label]=\"'OVERVIEW_AND_PAYMENT' | localize\">\n        <co-checkout-overview-payment *ngIf=\"stepOverview.show\"\n                                      [relation]=\"service.relation\"\n                                      [transaction]=\"service.currentTransaction\"\n                                      (changeYourDataClick)=\"stepper.goto(0)\"\n                                      (changeDeliveryClick)=\"stepper.goto(1)\"\n                                      (payed)=\"handleTransactionFinished($event)\"\n        ></co-checkout-overview-payment>\n      </co-stepper-step>\n      <div class=\"co-checkout-right-panel\">\n        <div class=\"co-checkout-right-panel-relation\">\n          <co-avatar [relationId]=\"sellerId\"></co-avatar>\n        </div>\n        <co-shopping-cart-preview [showCheckoutButton]=\"false\" [withoutBorder]=\"true\"></co-shopping-cart-preview>\n      </div>\n    </co-stepper>\n  ",
+                    template: "\n    <co-stepper #stepper [finishButtonLabel]=\"'CHECKOUT_FINISH' | localize\" (finishStep)=\"handleFinishStep()\">\n      <co-stepper-step #stepRelation [index]=\"1\" [label]=\"'YOUR_DATA' | localize\" (validateStep)=\"handleRelationValidation()\">\n        <co-checkout-overview-relation-edit #checkoutRelation *ngIf=\"stepRelation.show\" [(relation)]=\"service.relation\"\n                                            (deliveryAddressChange)=\"handleDeliveryAddressChange($event)\"\n                                            (invoiceAddressChange)=\"handleInvoiceAddressChange($event)\"\n                                            (relationChange)=\"service.relation = $event\"\n        ></co-checkout-overview-relation-edit>\n      </co-stepper-step>\n      <co-stepper-step #stepDelivery [index]=\"2\" [label]=\"'DELIVERY' | localize\" (validateStep)=\"handleDeliveryValidation()\">\n        <co-checkout-overview-delivery-edit #checkoutDelivery *ngIf=\"stepDelivery.show\"\n                                            [transaction]=\"service.currentTransaction\"\n        ></co-checkout-overview-delivery-edit>\n      </co-stepper-step>\n      <co-stepper-step #stepOverview [index]=\"3\" [label]=\"'OVERVIEW_AND_PAYMENT' | localize\">\n        <co-checkout-overview-payment *ngIf=\"stepOverview.show\"\n                                      [relation]=\"service.relation\"\n                                      [transaction]=\"service.currentTransaction\"\n                                      (changeYourDataClick)=\"stepper.goto(0)\"\n                                      (changeDeliveryClick)=\"stepper.goto(1)\"\n                                      (payed)=\"handleTransactionFinished($event)\"\n        ></co-checkout-overview-payment>\n      </co-stepper-step>\n      <div class=\"co-checkout-right-panel\">\n        <div class=\"co-checkout-right-panel-relation\">\n          <co-avatar [relationId]=\"sellerId\"></co-avatar>\n        </div>\n        <co-shopping-cart-preview [showCheckoutButton]=\"false\" [withoutBorder]=\"true\"></co-shopping-cart-preview>\n      </div>\n    </co-stepper>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -7979,8 +8107,8 @@
             // public privacySettings: RelationPrivacySetting[];
             // public addresses: Address[] = [];
             this._relation = new customerFullObject_bo.CustomerFullObject();
-            this.deliveryAddressIdx = 0;
-            this.invoiceAddressIdx = 0;
+            // public deliveryAddressIdx: number = 0;
+            // public invoiceAddressIdx: number = 0;
             this.editAddressType = addressType_enum.AddressType.DeliveryAddress;
         }
         Object.defineProperty(CheckoutOverviewRelationEditComponent.prototype, "relation", {
@@ -7993,24 +8121,9 @@
                 this._relation = value;
                 if (this._relation) {
                     this.address = this._relation.getFirstAddressOrCreateNew();
-                }
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(CheckoutOverviewRelationEditComponent.prototype, "deliveryAddressNawNr", {
-            set: function (value) {
-                if (value && this.relation && this.relation.addresses) {
-                    this.deliveryAddressIdx = this.relation.addresses.findIndex(function (a) { return a.nawNr === value; });
-                }
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(CheckoutOverviewRelationEditComponent.prototype, "invoiceAddressNawNr", {
-            set: function (value) {
-                if (value && this.relation && this.relation.addresses) {
-                    this.invoiceAddressIdx = this.relation.addresses.findIndex(function (a) { return a.nawNr === value; });
+                    var firstActiveAddress = this._relation.activeAddresses.length > 0 ? this._relation.activeAddresses[0] : undefined;
+                    this.deliveryAddressNawNr = firstActiveAddress ? firstActiveAddress.nawNr : 0;
+                    this.invoiceAddressNawNr = firstActiveAddress ? firstActiveAddress.nawNr : 0;
                 }
             },
             enumerable: false,
@@ -8070,15 +8183,16 @@
         //   this.editAddressType = deliveryAddress ? AddressType.DeliveryAddress : AddressType.BillingAddress;
         //   this.showSelectAddressDialog = true;
         // }
-        CheckoutOverviewRelationEditComponent.prototype.setIndexDeliveryAddress = function (idx) {
-            this.deliveryAddressIdx = idx;
-            this.editAddressType = addressType_enum.AddressType.DeliveryAddress;
-        };
-        CheckoutOverviewRelationEditComponent.prototype.setIndexInvoiceAddress = function (idx) {
-            this.invoiceAddressIdx = idx;
-            this.editAddressType = addressType_enum.AddressType.BillingAddress;
-            // this.selectAddress(this.relation.addresses[idx]);
-        };
+        // public setIndexDeliveryAddress(idx: number): void {
+        //   this.deliveryAddressIdx = idx;
+        //   this.editAddressType = AddressType.DeliveryAddress;
+        // }
+        //
+        // public setIndexInvoiceAddress(idx: number): void {
+        //   this.invoiceAddressIdx = idx;
+        //   this.editAddressType = AddressType.BillingAddress;
+        //   // this.selectAddress(this.relation.addresses[idx]);
+        // }
         // public editAddress(addr: Address): void {
         //   this.addressToEdit = <Address><unknown>this._boFactory.makeWithRawBackendData(Address, addr);
         //   this.showEditAddressDialog()
@@ -8176,7 +8290,7 @@
     CheckoutOverviewRelationEditComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-checkout-overview-relation-edit",
-                    template: "\n    <div class=\"relation-edit-content\">\n      <co-form>\n        <div class=\"checkout-form-wrapper\">\n          <div class=\"checkout-label-column\">\n            <span>01</span>\n            <span class=\"label\" [textContent]=\"'PERSONAL_DATA' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <co-relation-type\n              [relation]=\"relation\"\n            ></co-relation-type>\n            <div class=\"default-data-row\">\n              <relation-customer-groups [(model)]=\"relation.customerGroup\" required></relation-customer-groups>\n            </div>\n            <co-relation-general [relation]=\"relation\" (relationChange)=\"updateRelation($event)\"></co-relation-general>\n            <co-relation-address [address]=\"address\"></co-relation-address>\n          </div>\n          <div class=\"checkout-data-column\">\n            <co-relation-addresses\n              [addresses]=\"relation.activeAddresses\"\n              [type]=\"addressType.DeliveryAddress\"\n              [selectedAddressIdx]=\"deliveryAddressIdx\"\n              (selectedAddressChange)=\"setIndexDeliveryAddress($event)\"\n              (selectedAddressNawNrChange)=\"deliveryAddressChange.emit($event)\"\n            ></co-relation-addresses>\n          </div>\n          <div class=\"checkout-label-column\">\n            <span>02</span>\n            <span class=\"label\" [textContent]=\"'INVOICE_ADDRESS' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <div class=\"checkout-data-row\">\n              <co-input-checkbox [(model)]=\"service.invoiceAddressSameAsDelivery\" (modelChange)=\"checkSameAddress($event)\" [label]=\"'SAME_AS_DELIVERY' | localize\"></co-input-checkbox>\n            </div>\n            <div class=\"overview-delivery-invoice-address\" *ngIf=\"!service.invoiceAddressSameAsDelivery\" @showHideInvoiceAddress>\n              <co-relation-addresses\n                [addresses]=\"relation.activeAddresses\"\n                [type]=\"addressType.BillingAddress\"\n                [selectedAddressIdx]=\"invoiceAddressIdx\"\n                (selectedAddressChange)=\"setIndexInvoiceAddress($event)\"\n                (selectedAddressNawNrChange)=\"invoiceAddressChange.emit($event)\"\n              ></co-relation-addresses>\n            </div>\n          </div>\n          <div class=\"checkout-label-column\">\n            <span>03</span>\n            <span class=\"label\" [textContent]=\"'CONTACT_DETAILS' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <co-relation-contact-details [relation]=\"relation\"></co-relation-contact-details>\n          </div>\n          <div class=\"checkout-label-column\">\n            <span>04</span>\n            <span class=\"label\" [textContent]=\"'PRIVACY_PREFERENCES' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <co-relation-preferences [relation]=\"relation\"></co-relation-preferences>\n          </div>\n        </div>\n      </co-form>\n    </div>\n  ",
+                    template: "\n    <div class=\"relation-edit-content\">\n      <co-form>\n        <div class=\"checkout-form-wrapper\">\n          <div class=\"checkout-label-column\">\n            <span>01</span>\n            <span class=\"label\" [textContent]=\"'PERSONAL_DATA' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <div class=\"checkout-data-row\">\n              <co-relation-type\n                [relation]=\"relation\"\n              ></co-relation-type>\n            </div>\n            <div class=\"checkout-data-row\">\n              <relation-customer-groups [(model)]=\"relation.customerGroup\" required></relation-customer-groups>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-relation-general [relation]=\"relation\" (relationChange)=\"updateRelation($event)\"></co-relation-general>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-relation-address [address]=\"address\"></co-relation-address>\n            </div>\n          </div>\n          <div class=\"checkout-data-column\">\n            <div class=\"checkout-data-row\">\n              <co-relation-addresses\n                [relation]=\"relation\"\n                [addresses]=\"relation.addresses\"\n                [type]=\"addressType.DeliveryAddress\"\n                [selectedNawNr]=\"deliveryAddressNawNr\"\n                (selectedNawNrChange)=\"deliveryAddressChange.emit($event)\"\n              ></co-relation-addresses>\n            </div>\n          </div>\n          <div class=\"checkout-label-column\">\n            <span>02</span>\n            <span class=\"label\" [textContent]=\"'INVOICE_ADDRESS' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <div class=\"checkout-data-row\">\n              <co-input-checkbox [(model)]=\"service.invoiceAddressSameAsDelivery\" (modelChange)=\"checkSameAddress($event)\" [label]=\"'SAME_AS_DELIVERY' | localize\"></co-input-checkbox>\n            </div>\n            <div class=\"overview-delivery-invoice-address\" *ngIf=\"!service.invoiceAddressSameAsDelivery\" @showHideInvoiceAddress>\n              <div class=\"checkout-data-row\">\n                <co-relation-addresses\n                  [addresses]=\"relation.activeAddresses\"\n                  [type]=\"addressType.BillingAddress\"\n                  [selectedNawNr]=\"invoiceAddressNawNr\"\n                  (selectedNawNrChange)=\"invoiceAddressChange.emit($event)\"\n                ></co-relation-addresses>\n              </div>\n            </div>\n          </div>\n          <div class=\"checkout-label-column\">\n            <span>03</span>\n            <span class=\"label\" [textContent]=\"'CONTACT_DETAILS' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <div class=\"checkout-data-row\">\n              <co-relation-contact-details [relation]=\"relation\"></co-relation-contact-details>\n            </div>\n          </div>\n          <div class=\"checkout-label-column\">\n            <span>04</span>\n            <span class=\"label\" [textContent]=\"'PRIVACY_PREFERENCES' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <div class=\"checkout-data-row\">\n              <co-relation-preferences [relation]=\"relation\"></co-relation-preferences>\n            </div>\n          </div>\n        </div>\n      </co-form>\n    </div>\n  ",
                     providers: [
                         corecomponents_v12.FormMasterService
                     ],
@@ -8215,8 +8329,6 @@
     ]; };
     CheckoutOverviewRelationEditComponent.propDecorators = {
         relation: [{ type: i0.Input }],
-        deliveryAddressNawNr: [{ type: i0.Input }],
-        invoiceAddressNawNr: [{ type: i0.Input }],
         validSubmit: [{ type: i0.Output }],
         invalidSubmit: [{ type: i0.Output }],
         deliveryAddressChange: [{ type: i0.Output }],
@@ -8373,7 +8485,7 @@
     CheckoutOverviewDeliveryEditComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-checkout-overview-delivery-edit",
-                    template: "\n    <div class=\"delivery-edit-content\">\n      <co-form>\n        <div class=\"checkout-form-wrapper\">\n          <div class=\"checkout-section-wrapper\">\n            <div class=\"checkout-label-column\">\n              <span>01</span>\n              <span class=\"label\" [textContent]=\"'DELIVERY_DATA' | localize\"></span>\n            </div>\n            <div class=\"checkout-data-column\">\n              <div class=\"checkout-data-row\">\n                <co-transaction-header-delivery-method\n                  [transactionInfo]=\"transaction.transactionInfo\"\n                  [filterOnWizard]=\"true\"\n                  (deliveryMethodChange)=\"currentDeliveryMethod = $event\"\n                ></co-transaction-header-delivery-method>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-transaction-header-delivery-date class=\"header-delivery-deliverydate\"\n                                                     [transactionInfo]=\"transaction.transactionInfo\"\n                ></co-transaction-header-delivery-date>\n                <co-transaction-header-preferred-delivery-date class=\"header-delivery-deliverydate\"\n                                                     [transactionInfo]=\"transaction.transactionInfo\"\n                ></co-transaction-header-preferred-delivery-date>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-transaction-header-partial-delivery [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-partial-delivery>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-collapsible [headerTitle]=\"'ADD_DELIVERY_OPTION' | localize\" [iconData]=\"iconService.getIcon(icons.TriangleDown)\">\n                  <div class=\"checkout-data-row\">\n                    <co-transaction-header-delivery-options\n                      [transactionInfo]=\"transaction.transactionInfo\"\n                      [deliveryMethod]=\"currentDeliveryMethod\"\n                    ></co-transaction-header-delivery-options>\n                  </div>\n                </co-collapsible>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-collapsible [headerTitle]=\"'ADD_REMARK' | localize\" [iconData]=\"iconService.getIcon(icons.TriangleDown)\">\n                  <div class=\"checkout-data-row\">\n                    <co-transaction-header-remarks [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-remarks>\n                  </div>\n                </co-collapsible>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-collapsible [headerTitle]=\"'ADD_REFERENCE' | localize\" [iconData]=\"iconService.getIcon(icons.TriangleDown)\">\n                  <div class=\"checkout-data-row\">\n                    <co-transaction-header-reference [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-reference>\n                  </div>\n                  <div class=\"checkout-data-row\">\n                    <co-transaction-header-relation-reference [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-relation-reference>\n                  </div>\n                </co-collapsible>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-input-date [model]=\"'NOG_NIET_GEIMPLEMENTEERD'\" [placeholder]=\"'ASSEMBLY_DATE' | localize\"></co-input-date>\n              </div>\n            </div>\n          </div>\n          <div class=\"checkout-section-wrapper\">\n            <div class=\"checkout-label-column\">\n              <span>02</span>\n              <span class=\"label\" [textContent]=\"'DOWNPAYMENT' | localize\"></span>\n            </div>\n            <div class=\"checkout-data-column\">\n              <div class=\"checkout-data-row\">\n                <co-transaction-header-downpayment-percentage [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-downpayment-percentage>\n                <co-transaction-header-downpayment-amount [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-downpayment-amount>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-input-text [model]=\"'NOG_NIET_GEIMPLEMENTEERD'\" [placeholder]=\"'DOWNPAYMENT_BY_BR' | localize\"></co-input-text>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-input-text [model]=\"'NOG_NIET_GEIMPLEMENTEERD'\" [placeholder]=\"'DOWNPAYMENT_ON_DELIVERY' | localize\"></co-input-text>\n              </div>\n            </div>\n          </div>\n          <div class=\"checkout-section-wrapper\">\n            <div class=\"checkout-label-column\">\n              <span>03</span>\n              <span class=\"label\" [textContent]=\"'ORDER_DATA' | localize\"></span>\n            </div>\n            <div class=\"checkout-data-column\">\n              <div class=\"checkout-data-row\">\n                <co-transaction-header-branch [simple]=\"true\" [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-branch>\n                <co-transaction-header-administrative-relation [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-administrative-relation>\n              </div>\n              <div class=\"checkout-data-row\">\n                <span class=\"label\" [textContent]=\"'MARKETING_CODE' | localize\"></span>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-transaction-header-marketing [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-marketing>\n              </div>\n              <div class=\"checkout-data-row\">\n                <span class=\"label\" [textContent]=\"'ORDER_PARAMETERS' | localize\"></span>\n              </div>\n              <div class=\"checkout-data-row\">\n                <co-transaction-header-definitive [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-definitive>\n              </div>\n            </div>\n          </div>\n        </div>\n      </co-form>\n    </div>\n  ",
+                    template: "\n    <div class=\"delivery-edit-content\">\n      <co-form>\n        <div class=\"checkout-form-wrapper\">\n          <div class=\"checkout-label-column\">\n            <span>01</span>\n            <span class=\"label\" [textContent]=\"'DELIVERY_DATA' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <div class=\"checkout-data-row\">\n              <co-transaction-header-delivery-method\n                [transactionInfo]=\"transaction.transactionInfo\"\n                [filterOnWizard]=\"true\"\n                (deliveryMethodChange)=\"currentDeliveryMethod = $event\"\n              ></co-transaction-header-delivery-method>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-transaction-header-delivery-date class=\"header-delivery-deliverydate\"\n                                                   [transactionInfo]=\"transaction.transactionInfo\"\n              ></co-transaction-header-delivery-date>\n              <co-transaction-header-preferred-delivery-date class=\"header-delivery-deliverydate\"\n                                                             [transactionInfo]=\"transaction.transactionInfo\"\n              ></co-transaction-header-preferred-delivery-date>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-transaction-header-partial-delivery [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-partial-delivery>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-collapsible [headerTitle]=\"'ADD_DELIVERY_OPTION' | localize\" [iconData]=\"iconService.getIcon(icons.TriangleDown)\">\n                <div class=\"checkout-data-row\">\n                  <co-transaction-header-delivery-options\n                    [transactionInfo]=\"transaction.transactionInfo\"\n                    [deliveryMethod]=\"currentDeliveryMethod\"\n                  ></co-transaction-header-delivery-options>\n                </div>\n              </co-collapsible>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-collapsible [headerTitle]=\"'ADD_REMARK' | localize\" [iconData]=\"iconService.getIcon(icons.TriangleDown)\">\n                <div class=\"checkout-data-row\">\n                  <co-transaction-header-remarks [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-remarks>\n                </div>\n              </co-collapsible>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-collapsible [headerTitle]=\"'ADD_REFERENCE' | localize\" [iconData]=\"iconService.getIcon(icons.TriangleDown)\">\n                <div class=\"checkout-data-row\">\n                  <co-transaction-header-reference [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-reference>\n                </div>\n                <div class=\"checkout-data-row\">\n                  <co-transaction-header-relation-reference [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-relation-reference>\n                </div>\n              </co-collapsible>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-input-date [model]=\"'NOG_NIET_GEIMPLEMENTEERD'\" [placeholder]=\"'ASSEMBLY_DATE' | localize\"></co-input-date>\n            </div>\n          </div>\n          <div class=\"checkout-label-column\">\n            <span>02</span>\n            <span class=\"label\" [textContent]=\"'DOWNPAYMENT' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <div class=\"checkout-data-row\">\n              <co-transaction-header-downpayment-percentage [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-downpayment-percentage>\n              <co-transaction-header-downpayment-amount [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-downpayment-amount>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-input-text [model]=\"'NOG_NIET_GEIMPLEMENTEERD'\" [placeholder]=\"'DOWNPAYMENT_BY_BR' | localize\"></co-input-text>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-input-text [model]=\"'NOG_NIET_GEIMPLEMENTEERD'\" [placeholder]=\"'DOWNPAYMENT_ON_DELIVERY' | localize\"></co-input-text>\n            </div>\n          </div>\n          <div class=\"checkout-label-column\">\n            <span>03</span>\n            <span class=\"label\" [textContent]=\"'ORDER_DATA' | localize\"></span>\n          </div>\n          <div class=\"checkout-data-column\">\n            <div class=\"checkout-data-row\">\n              <co-transaction-header-branch [simple]=\"true\" [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-branch>\n              <co-transaction-header-administrative-relation [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-administrative-relation>\n            </div>\n            <div class=\"checkout-data-row\">\n              <span class=\"label\" [textContent]=\"'MARKETING_CODE' | localize\"></span>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-transaction-header-marketing [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-marketing>\n            </div>\n            <div class=\"checkout-data-row\">\n              <span class=\"label\" [textContent]=\"'ORDER_PARAMETERS' | localize\"></span>\n            </div>\n            <div class=\"checkout-data-row\">\n              <co-transaction-header-definitive [transactionInfo]=\"transaction.transactionInfo\"></co-transaction-header-definitive>\n            </div>\n          </div>\n        </div>\n      </co-form>\n    </div>\n  ",
                     providers: [
                         corecomponents_v12.FormMasterService
                     ],
@@ -8540,6 +8652,7 @@
     var CustomerGroupsComponent = /** @class */ (function () {
         function CustomerGroupsComponent(_connector) {
             this._connector = _connector;
+            this.readonly = false;
             this.required = false;
             this.modelChange = new i0.EventEmitter();
             this.customerGroups = [];
@@ -8561,7 +8674,7 @@
     CustomerGroupsComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "relation-customer-groups",
-                    template: "\n    <co-input-combo-box [model]=\"model\"\n                        (modelChange)=\"modelChange.emit($event)\"\n                        [collection]=\"customerGroups\"\n                        [fields]=\"fields\"\n                        [placeholder]=\"'CUSTOMER_GROUP' | localize\"\n                        [required]=\"required\"\n    ></co-input-combo-box>\n  ",
+                    template: "\n    <co-input-combo-box [model]=\"model\"\n                        [readonly]=\"readonly\"\n                        (modelChange)=\"modelChange.emit($event)\"\n                        [collection]=\"customerGroups\"\n                        [fields]=\"fields\"\n                        [placeholder]=\"'CUSTOMER_GROUP' | localize\"\n                        [required]=\"required\"\n    ></co-input-combo-box>\n  ",
                     styles: [":host{display:flex}:host .co-input-combo-box{width:100%}\n"]
                 },] }
     ];
@@ -8569,6 +8682,7 @@
         { type: TransactionConnectorService }
     ]; };
     CustomerGroupsComponent.propDecorators = {
+        readonly: [{ type: i0.Input }],
         required: [{ type: i0.Input }],
         model: [{ type: i0.Input }],
         modelChange: [{ type: i0.Output }]
@@ -8885,18 +8999,6 @@
                 },] }
     ];
-    var LoaderComponent = /** @class */ (function () {
-        function LoaderComponent() {
-        }
-        return LoaderComponent;
-    }());
-    LoaderComponent.decorators = [
-        { type: i0.Component, args: [{
-                    selector: "transaction-loader",
-                    template: "\n        <div class=\"transaction-loader\">\n            <svg width=\"38\" height=\"38\" viewBox=\"0 0 38 38\" xmlns=\"http://www.w3.org/2000/svg\">\n                <defs>\n                    <linearGradient x1=\"8.042%\" y1=\"0%\" x2=\"65.682%\" y2=\"23.865%\" id=\"a\">\n                        <stop stop-color=\"#000\" stop-opacity=\"0\" offset=\"0%\"/>\n                        <stop stop-color=\"#000\" stop-opacity=\".631\" offset=\"63.146%\"/>\n                        <stop stop-color=\"#000\" offset=\"100%\"/>\n                    </linearGradient>\n                </defs>\n                <g fill=\"none\" fill-rule=\"evenodd\">\n                    <g transform=\"translate(1 1)\">\n                        <path d=\"M36 18c0-9.94-8.06-18-18-18\" id=\"Oval-2\" stroke=\"url(#a)\" stroke-width=\"2\">\n                            <animateTransform\n                                    attributeName=\"transform\"\n                                    type=\"rotate\"\n                                    from=\"0 18 18\"\n                                    to=\"360 18 18\"\n                                    dur=\"0.9s\"\n                                    repeatCount=\"indefinite\" />\n                        </path>\n                        <circle fill=\"#000\" cx=\"36\" cy=\"18\" r=\"1\">\n                            <animateTransform\n                                    attributeName=\"transform\"\n                                    type=\"rotate\"\n                                    from=\"0 18 18\"\n                                    to=\"360 18 18\"\n                                    dur=\"0.9s\"\n                                    repeatCount=\"indefinite\" />\n                        </circle>\n                    </g>\n                </g>\n            </svg>\n        </div>\n    "
-                },] }
-    ];
     var CharacteristicAnswerModule = /** @class */ (function () {
         function CharacteristicAnswerModule() {
         }
@@ -8959,7 +9061,7 @@
     WarehouseComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-warehouse",
-                    template: "\n    <co-dialog [showCloseIcon]=\"false\" [modal]=\"true\" [headerTemplate]=\"headerTemplate\" [footerTemplate]=\"footerTemplate\">\n      <div class=\"co-transaction-default-popup-row\" *ngFor=\"let model of viewModels\">\n        <co-input-checkbox [model]=\"model.checked\" [label]=\"model.text\" (click)=\"handleChecked($event, model.value)\"></co-input-checkbox>\n      </div>\n    </co-dialog>\n    <ng-template #headerTemplate>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'WAREHOUSE' | localize\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n    ",
+                    template: "\n    <co-dialog [showCloseIcon]=\"false\" [modal]=\"true\" [headerTemplate]=\"headerTemplate\" [footerTemplate]=\"footerTemplate\">\n      <div class=\"co-transaction-default-popup-row\" *ngFor=\"let model of viewModels\">\n        <co-input-checkbox [model]=\"model.checked\" [label]=\"model.text\" (click)=\"handleChecked($event, model.value)\"></co-input-checkbox>\n      </div>\n    </co-dialog>\n    <ng-template #headerTemplate>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'WAREHOUSE' | localize\"></div>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n    ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -9102,7 +9204,6 @@
                         IconComponent,
                         CustomerGroupsComponent,
                         StockStatusIndicatorComponent,
-                        LoaderComponent,
                         LazyRenderMasterDirective,
                         LazyRenderDirective
                     ],
@@ -9111,7 +9212,6 @@
                         IconComponent,
                         CustomerGroupsComponent,
                         StockStatusIndicatorComponent,
-                        LoaderComponent,
                         LazyRenderMasterDirective,
                         LazyRenderDirective
                     ]
@@ -9400,12 +9500,16 @@
             event.stopImmediatePropagation();
             this.editAddressClicked.next(this.address);
         };
+        RelationAddressTileComponent.prototype.handleSelectedChange = function (address) {
+            this.selected = true;
+            this.selectedChange.emit(address);
+        };
         return RelationAddressTileComponent;
     }());
     RelationAddressTileComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-relation-address-tile",
-                    template: "\n    <ng-container *ngIf=\"!actAsAddTile\">\n      <co-tile [selected]=\"selected\" (selectedChange)=\"selectedChange.emit($event)\">\n        <div class=\"relation-content-wrapper\">\n          <span class=\"relation-address-type\" [textContent]=\"address.displayType | localize\"></span>\n          <span class=\"relation-address-name\" [textContent]=\"address.addressName\"></span>\n          <span class=\"relation-address-address\" [textContent]=\"address.displayAddress\"></span>\n          <span class=\"relation-address-postal\" [textContent]=\"address.displayPostal\"></span>\n          <span class=\"relation-address-country\" [textContent]=\"address.displayCountry\"></span>\n        </div>\n        <div class=\"relation-address-edit\" (click)=\"handleEditAddressClick($event)\">\n          <icon class=\"relation-address-edit-icon\" [icon]=\"icons.EditPencil\"></icon>\n        </div>\n      </co-tile>\n    </ng-container>\n    <ng-container *ngIf=\"actAsAddTile\">\n      <co-tile (click)=\"addAddressClicked.emit()\">\n        <div class=\"relation-content-wrapper\">\n          <icon class=\"relation-address-icon\" [icon]=\"icons.PlusRound\"></icon>\n          <span [textContent]=\"'ADDRESS_ADD' | localize\"></span>\n        </div>\n      </co-tile>\n    </ng-container>\n  ",
+                    template: "\n    <ng-container *ngIf=\"!actAsAddTile\">\n      <co-tile [selected]=\"selected\" (selectedChange)=\"handleSelectedChange(address)\">\n        <div class=\"relation-content-wrapper\">\n          <span class=\"relation-address-type\" [textContent]=\"address.displayType | localize\"></span>\n          <span class=\"relation-address-name\" [textContent]=\"address.addressName\"></span>\n          <span class=\"relation-address-address\" [textContent]=\"address.displayAddress\"></span>\n          <span class=\"relation-address-postal\" [textContent]=\"address.displayPostal\"></span>\n          <span class=\"relation-address-country\" [textContent]=\"address.displayCountry\"></span>\n        </div>\n        <div class=\"relation-address-edit\" (click)=\"handleEditAddressClick($event)\">\n          <icon class=\"relation-address-edit-icon\" [icon]=\"icons.EditPencil\"></icon>\n        </div>\n      </co-tile>\n    </ng-container>\n    <ng-container *ngIf=\"actAsAddTile\">\n      <co-tile (click)=\"addAddressClicked.emit()\">\n        <div class=\"relation-content-wrapper\">\n          <icon class=\"relation-address-icon\" [icon]=\"icons.PlusRound\"></icon>\n          <span [textContent]=\"'ADDRESS_ADD' | localize\"></span>\n        </div>\n      </co-tile>\n    </ng-container>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -9432,7 +9536,7 @@
     TileComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-tile",
-                    template: "\n    <div class=\"co-tile-wrapper\" (click)=\"selectedChange.emit(selected)\">\n      <div class=\"co-tile-select-wrapper\">\n        <co-input-radio-button [model]=\"selected\" (modelChange)=\"selectedChange.emit($event)\"></co-input-radio-button>\n      </div>\n      <div class=\"co-tile-content-wrapper\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n  ",
+                    template: "\n    <div class=\"co-tile-wrapper\" (click)=\"selectedChange.emit(selected)\">\n      <div class=\"co-tile-select-wrapper\">\n        <co-input-radio-button [model]=\"selected\" [readonly]=\"selected\" (modelChange)=\"selectedChange.emit($event)\"></co-input-radio-button>\n      </div>\n      <div class=\"co-tile-content-wrapper\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -9736,16 +9840,149 @@
         showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-totals",] }]
     };
-    var TransactionHeaderBaseComponent = /** @class */ (function (_super) {
-        __extends(TransactionHeaderBaseComponent, _super);
-        function TransactionHeaderBaseComponent() {
-            var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
-            _this.readonly = false;
-            _this._transactionInfo = new transactionInfo_bo.TransactionInfo();
-            _this._transactionTotal = new transactionTotal_bo.TransactionTotal();
-            return _this;
-        }
-        Object.defineProperty(TransactionHeaderBaseComponent.prototype, "transactionInfo", {
+    var TransactionHeaderFilterPopupBaseComponent = /** @class */ (function () {
+        function TransactionHeaderFilterPopupBaseComponent() {
+            this.autoClose = false;
+            this.useModel = true;
+            this.valueChange = new i0.EventEmitter();
+            this.closeAfterCommit = new i0.EventEmitter();
+            this.viewModels = [];
+            this.viewModelsFiltered = [];
+            this.propsForLabel = [];
+            this._collection = [];
+        }
+        Object.defineProperty(TransactionHeaderFilterPopupBaseComponent.prototype, "searchText", {
+            get: function () {
+                return this._searchText;
+            },
+            set: function (value) {
+                if (value !== undefined && value !== null) {
+                    this._searchText = value;
+                    this._doSearch();
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TransactionHeaderFilterPopupBaseComponent.prototype, "collection", {
+            get: function () {
+                return this._collection;
+            },
+            set: function (value) {
+                this._collection = value;
+                this.prepareViewModels();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TransactionHeaderFilterPopupBaseComponent.prototype, "model", {
+            get: function () {
+                return undefined;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        TransactionHeaderFilterPopupBaseComponent.prototype.commit = function (value) {
+            return Promise.resolve(true);
+        };
+        TransactionHeaderFilterPopupBaseComponent.prototype.handleChecked = function (row) {
+            return __awaiter(this, void 0, void 0, function () {
+                var currentModel, i;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            row.checked = true;
+                            currentModel = this.viewModels.find(function (v) { return v.value === row.value; });
+                            if (currentModel) {
+                                currentModel.checked = true;
+                            }
+                            for (i = 0; i < this.viewModels.length; i++) {
+                                if (this.viewModels[i].value !== row.value) {
+                                    this.viewModels[i].checked = false;
+                                }
+                            }
+                            if (!this.useModel) return [3 /*break*/, 4];
+                            if (!this.autoClose) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this.commit(row.value)];
+                        case 1:
+                            if (_a.sent()) {
+                                this.closeAfterCommit.emit();
+                            }
+                            return [3 /*break*/, 3];
+                        case 2:
+                            this.commit(row.value);
+                            _a.label = 3;
+                        case 3: return [3 /*break*/, 5];
+                        case 4:
+                            this.valueChange.emit(row.value);
+                            _a.label = 5;
+                        case 5: return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        TransactionHeaderFilterPopupBaseComponent.prototype.prepareViewModels = function () {
+            var _this = this;
+            this.collection.forEach(function (d, index) {
+                var labels = _this.propsForLabel.map(function (p) { return d[p]; });
+                _this.viewModels.push({
+                    value: d[_this.codeField],
+                    propsForLabel: labels,
+                    checked: (_this.useModel && _this.model && _this.checkField) ?
+                        _this.model[_this.checkField] === d[_this.codeField] :
+                        (_this.value ? _this.value === d[_this.codeField] : index === 0)
+                });
+            });
+            this.viewModelsFiltered = this.viewModels.slice();
+            if (!this.useModel && this.viewModels.length > 0) {
+                this.valueChange.next(this.value ? this.value : this.viewModels[0].value);
+            }
+        };
+        TransactionHeaderFilterPopupBaseComponent.prototype._doSearch = function () {
+            var _this = this;
+            this.viewModelsFiltered = JSON.parse(JSON.stringify(this.viewModels));
+            if (this.searchText) {
+                this.viewModelsFiltered = this.viewModelsFiltered.filter(function (vmf) {
+                    return vmf.propsForLabel.find(function (p) { return p && p.toString().match(new RegExp(_this.searchText, 'gi')); });
+                });
+                // if (!this.searchText) {
+                //   this.viewModelsFiltered = this.viewModels.slice();
+                // } else {
+                // this.viewModelsFiltered = JSON.parse(JSON.stringify(this.viewModels));
+                // for (let i = 0; i < this.viewModelsFiltered.length; i++) {
+                //   const vmf = this.viewModelsFiltered[i];
+                //   for (let j = 0; j < vmf.propsForLabel.length; j++) {
+                //     if (vmf.propsForLabel[j]) {
+                //       vmf.propsForLabel[j] = vmf.propsForLabel[j].replace(new RegExp(this.searchText, 'gi'), `<span class="highlight">${this.searchText}</span>`);
+                //     }
+                //   }
+                // }
+            }
+        };
+        return TransactionHeaderFilterPopupBaseComponent;
+    }());
+    TransactionHeaderFilterPopupBaseComponent.decorators = [
+        { type: i0.Directive }
+    ];
+    TransactionHeaderFilterPopupBaseComponent.propDecorators = {
+        autoClose: [{ type: i0.Input }],
+        useModel: [{ type: i0.Input }],
+        searchText: [{ type: i0.Input }],
+        value: [{ type: i0.Input }],
+        valueChange: [{ type: i0.Output }],
+        closeAfterCommit: [{ type: i0.Output }]
+    };
+    var TransactionHeaderBaseComponent = /** @class */ (function (_super) {
+        __extends(TransactionHeaderBaseComponent, _super);
+        function TransactionHeaderBaseComponent() {
+            var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+            _this.readonly = false;
+            _this._transactionInfo = new transactionInfo_bo.TransactionInfo();
+            _this._transactionTotal = new transactionTotal_bo.TransactionTotal();
+            return _this;
+        }
+        Object.defineProperty(TransactionHeaderBaseComponent.prototype, "transactionInfo", {
             get: function () {
                 return this._transactionInfo;
             },
@@ -9785,7 +10022,7 @@
         TransactionHeaderBaseComponent.prototype.transactionTotalSet = function () {
         };
         return TransactionHeaderBaseComponent;
-    }(TransactionFilterPopupBaseComponent));
+    }(TransactionHeaderFilterPopupBaseComponent));
     TransactionHeaderBaseComponent.decorators = [
         { type: i0.Directive }
     ];
@@ -11192,34 +11429,6 @@
         showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-quick-access-order-confirmation",] }]
     };
-    var TransactionEventService = /** @class */ (function () {
-        function TransactionEventService() {
-            this.addToCartBySku = new rxjs.Subject();
-            this.addToCartBySelectorResult = new rxjs.Subject();
-            this.openShoppingCartModule = new rxjs.Subject();
-            this.loggedIn = new rxjs.Subject();
-            this.addNewUserToShoppingCartModule = new rxjs.Subject();
-            this.addUserRelationShoppingCartModule = new rxjs.Subject();
-            this.addArticleLine = new rxjs.Subject();
-            this.addTextLine = new rxjs.Subject();
-            this.addArticleLineAt = new rxjs.Subject();
-            this.addTextLineAt = new rxjs.Subject();
-            this.changeLineSequence = new rxjs.Subject();
-            this.transactionLineClicked = new rxjs.Subject();
-            this.rightSidebarClose = new rxjs.Subject();
-            this.scrollContent = new rxjs.Subject();
-            this.commitReceivePurchaseOrders = new rxjs.Subject();
-            this.selectAllLines = new rxjs.Subject();
-            this.transactionLineChanged = new rxjs.Subject();
-            this.openSidePanel = new rxjs.Subject();
-        }
-        return TransactionEventService;
-    }());
-    TransactionEventService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function TransactionEventService_Factory() { return new TransactionEventService(); }, token: TransactionEventService, providedIn: "root" });
-    TransactionEventService.decorators = [
-        { type: i0.Injectable, args: [{ providedIn: "root" },] }
-    ];
     var TransactionReceiveGoodsService = /** @class */ (function () {
         function TransactionReceiveGoodsService(_transactionService, _transactionEventService) {
             var _this = this;
@@ -11662,7 +11871,6 @@
             this.waitingForUserAction = new i0.EventEmitter();
             this.preview = false;
             this.readonly = false;
-            this.lineSet = new rxjs.BehaviorSubject(false);
             this.lineVisible = new rxjs.BehaviorSubject(false);
         }
         Object.defineProperty(TransactionLinesLineBaseComponent.prototype, "line", {
@@ -11675,7 +11883,7 @@
                 this.isArticle = this._line.isArticle;
                 this.isSelected = this._line.isSelected;
                 this.readonly = this._line.hasInvoices;
-                this.lineSet.next(true);
+                this.transactionLineSet();
             },
             enumerable: false,
             configurable: true
@@ -11683,6 +11891,9 @@
         TransactionLinesLineBaseComponent.prototype.showClass = function () {
             return true;
         };
+        // overridden by descendents
+        TransactionLinesLineBaseComponent.prototype.transactionLineSet = function () {
+        };
         return TransactionLinesLineBaseComponent;
     }());
     TransactionLinesLineBaseComponent.decorators = [
@@ -11702,18 +11913,16 @@
     var TransactionOverviewLineComponent = /** @class */ (function (_super) {
         __extends(TransactionOverviewLineComponent, _super);
-        function TransactionOverviewLineComponent(service, iconCacheService, _dialogService, _dictionaryService) {
+        function TransactionOverviewLineComponent(service, iconCacheService, _dictionaryService) {
             var _this = _super.call(this) || this;
             _this.service = service;
             _this.iconCacheService = iconCacheService;
-            _this._dialogService = _dialogService;
             _this._dictionaryService = _dictionaryService;
             _this.stock = stockStatus_enum.StockStatus.Low;
             _this.mouseOver = false;
             _this.readonly = false;
             _this.showDialogVat = false;
             _this.showDialogDiscount = false;
-            _this.subscriptions = [];
             return _this;
         }
         TransactionOverviewLineComponent.prototype.showClass = function () {
@@ -11725,36 +11934,16 @@
         TransactionOverviewLineComponent.prototype.handleMouseLeave = function (event) {
             this.mouseOver = false;
         };
-        TransactionOverviewLineComponent.prototype.ngOnChanges = function (changes) {
-            console.log(changes);
-        };
         TransactionOverviewLineComponent.prototype.ngOnInit = function () {
-            var _this = this;
-            this.subscriptions.push(this.lineSet.subscribe(function (set) {
-                if (set) {
-                    _this.localAmount = _this._line.amount;
-                    _this._loadLineVat();
-                }
-            }));
             this.transactionKind = this.service.currentTransaction.transactionInfo.transactionKind;
         };
-        TransactionOverviewLineComponent.prototype.ngOnDestroy = function () {
-            this.subscriptions.forEach(function (subscription) { return subscription.unsubscribe(); });
-        };
-        TransactionOverviewLineComponent.prototype.changeLineAmount = function (amount) {
-            var _this = this;
-            this.service.changeTransactionLineQuantity(this.line.uuid, amount).then(function (value) {
-                if (!value || !value.isSuccess) {
-                    _this.localAmount = _this._line.amount;
-                    return;
-                }
-                // this._handleLine(value).then();
-            });
-        };
         TransactionOverviewLineComponent.prototype.handleOpenArticleText = function (text) {
             this.transactionLineActionButtons.textToEdit = text;
             this.transactionLineActionButtons.showArticleTextDialog();
         };
+        TransactionOverviewLineComponent.prototype.transactionLineSet = function () {
+            this._loadLineVat();
+        };
         TransactionOverviewLineComponent.prototype._loadLineVat = function () {
             return __awaiter(this, void 0, void 0, function () {
                 var _this = this;
@@ -11774,14 +11963,13 @@
     TransactionOverviewLineComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-overview-line",
-                    template: "\n    <co-transaction-base-line [line]=\"line\" [preview]=\"preview\">\n      <ng-container *ngIf=\"line.isArticle\">\n        <div class=\"transaction-line-wrapper\">\n          <div *ngIf=!preview class=\"transaction-line-stock\">\n            <div class=\"transaction-line-stock-wrapper\">\n              <stock-status-indicator [model]=\"stock\"></stock-status-indicator>\n            </div>\n          </div>\n          <div *ngIf=!preview class=\"transaction-line-extended-wrapper\">\n            <co-transaction-line-commission-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-commission-button>\n            <co-transaction-line-warehouse-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-warehouse-button>\n            <co-transaction-line-delivery-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-delivery-button>\n            <co-transaction-line-delivery-date-button [transactionLine]=\"line\" class=\"two-column\"></co-transaction-line-delivery-date-button>\n            <co-transaction-line-statusbar [transaction]=\"line\" [transactionKind]=\"transactionKind\"></co-transaction-line-statusbar>\n          </div>\n          <div *ngIf=\"!preview\" class=\"transaction-line-button\" (click)=\"showDialogVat = true\">\n            <span class=\"co-transaction-overflow-ellipsis\" [textContent]=\"line.vatDescription\"></span>\n          </div>\n          <div class=\"transaction-line-totals\">\n            <co-transaction-line-price class=\"transaction-line-totals-price price\"\n                                       [transactionLine]=\"line\"\n                                       [showLabel]=\"false\"\n                                       [defaultEditMode]=\"false\"\n            ></co-transaction-line-price>\n            <div class=\"transaction-line-button custom-width transaction-line-totals-discount\" (click)=\"showDialogDiscount = true\">\n              <span class=\"co-transaction-overflow-ellipsis\" [class.transaction-negative-value]=\"line.lineTotalDiscountAmount < 0\"\n                    [textContent]=\"(line.lineTotalDiscountAmount | coCurrency) || ('DISCOUNT' | localize)\"></span>\n            </div>\n            <div *ngIf=!preview class=\"transaction-line-totals-amount\">\n              <co-input-number-picker class=\"amount-number-picker\"\n                                      [(model)]=\"localAmount\" [min]=\"0\"\n                                      [readonly]=\"readonly\"\n                                      (modelChange)=\"changeLineAmount($event)\"></co-input-number-picker>\n            </div>\n            <co-editable-label class=\"transaction-line-totals-total price\"\n                               [model]=\"line.displayNetLineTotal | coCurrency\"\n                               [editModel]=\"line.displayNetLineTotal\"\n                               [readonly]=\"readonly\"\n                               [commit]=\"!readonly\"\n            ></co-editable-label>\n          </div>\n        </div>\n      </ng-container>\n    </co-transaction-base-line>\n    <co-dialog-transaction-line-vat *ngIf=\"showDialogVat\"\n                                    [autoClose]=\"true\"\n                                    [transactionInfo]=\"service.currentTransaction.transactionInfo\"\n                                    [transactionLine]=\"line\"\n                                    (close)=\"showDialogVat = false\">\n    </co-dialog-transaction-line-vat>\n    <co-dialog-transaction-line-discount *ngIf=\"showDialogDiscount\"\n                                         [transactionInfo]=\"service.currentTransaction.transactionInfo\"\n                                         [transactionLine]=\"line\"\n                                         (close)=\"showDialogDiscount = false\"\n    ></co-dialog-transaction-line-discount>\n  ",
+                    template: "\n    <co-transaction-base-line [line]=\"line\" [preview]=\"preview\">\n      <ng-container *ngIf=\"line.isArticle\">\n        <div class=\"transaction-line-wrapper\">\n          <div *ngIf=!preview class=\"transaction-line-stock\">\n            <div class=\"transaction-line-stock-wrapper\">\n              <stock-status-indicator [model]=\"stock\"></stock-status-indicator>\n            </div>\n          </div>\n          <div *ngIf=!preview class=\"transaction-line-extended-wrapper\">\n            <co-transaction-line-commission-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-commission-button>\n            <co-transaction-line-warehouse-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-warehouse-button>\n            <co-transaction-line-delivery-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-delivery-button>\n            <co-transaction-line-delivery-date-button [transactionLine]=\"line\" class=\"two-column\"></co-transaction-line-delivery-date-button>\n            <co-transaction-line-statusbar [transaction]=\"line\" [transactionKind]=\"transactionKind\"></co-transaction-line-statusbar>\n          </div>\n          <div *ngIf=\"!preview\" class=\"transaction-line-button\" (click)=\"showDialogVat = true\">\n            <span class=\"co-transaction-overflow-ellipsis\" [textContent]=\"line.vatDescription\"></span>\n          </div>\n          <div class=\"transaction-line-totals\">\n            <co-transaction-line-price class=\"transaction-line-totals-price price\"\n                                       [transactionLine]=\"line\"\n                                       [showLabel]=\"false\"\n                                       [defaultEditMode]=\"false\"\n            ></co-transaction-line-price>\n            <div class=\"transaction-line-button custom-width transaction-line-totals-discount\" (click)=\"showDialogDiscount = true\">\n              <span class=\"co-transaction-overflow-ellipsis\" [class.transaction-negative-value]=\"line.lineTotalDiscountAmount < 0\"\n                    [textContent]=\"(line.lineTotalDiscountAmount | coCurrency) || ('DISCOUNT' | localize)\"></span>\n            </div>\n            <div *ngIf=!preview class=\"transaction-line-totals-amount\">\n              <co-transaction-line-amount class=\"amount-number-picker\" [transactionLine]=\"line\"></co-transaction-line-amount>\n            </div>\n            <co-editable-label class=\"transaction-line-totals-total price\"\n                               [model]=\"line.displayNetLineTotal | coCurrency\"\n                               [editModel]=\"line.displayNetLineTotal\"\n                               [readonly]=\"readonly\"\n                               [commit]=\"!readonly\"\n            ></co-editable-label>\n          </div>\n        </div>\n      </ng-container>\n    </co-transaction-base-line>\n    <co-dialog-transaction-line-vat *ngIf=\"showDialogVat\"\n                                    [autoClose]=\"true\"\n                                    [transactionInfo]=\"service.currentTransaction.transactionInfo\"\n                                    [transactionLine]=\"line\"\n                                    (close)=\"showDialogVat = false\">\n    </co-dialog-transaction-line-vat>\n    <co-dialog-transaction-line-discount *ngIf=\"showDialogDiscount\"\n                                         [transactionInfo]=\"service.currentTransaction.transactionInfo\"\n                                         [transactionLine]=\"line\"\n                                         (close)=\"showDialogDiscount = false\"\n    ></co-dialog-transaction-line-discount>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
     TransactionOverviewLineComponent.ctorParameters = function () { return [
         { type: TransactionService },
         { type: IconCacheService },
-        { type: DialogService },
         { type: DictionaryService }
     ]; };
     TransactionOverviewLineComponent.propDecorators = {
@@ -11843,16 +12031,11 @@
             _this.iconService = iconService;
             _this.service = service;
             _this._transactionEventService = _transactionEventService;
-            _this.icons = Icon;
-            _this.showDialog = false;
             return _this;
         }
         TransactionQuickAccessOrderDeliveryComponent.prototype.showClass = function () {
             return true;
         };
-        TransactionQuickAccessOrderDeliveryComponent.prototype.openDeliveryDocumentDialog = function () {
-            this.showDialog = !this.showDialog;
-        };
         TransactionQuickAccessOrderDeliveryComponent.prototype.handleSelectAllLines = function (value) {
             this._transactionEventService.selectAllLines.next(value);
         };
@@ -11861,7 +12044,7 @@
     TransactionQuickAccessOrderDeliveryComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-quick-access-order-delivery",
-                    template: "\n    <div class=\"order-delivery-wrapper\">\n      <div class=\"select-all-wrapper\">\n        <co-input-checkbox\n            (modelChange)=\"handleSelectAllLines($event)\"\n        ></co-input-checkbox>\n        <span class=\"select-all-text\" [textContent]=\"'SELECT_ALL_LINES' | localize\"></span>\n      </div>\n      <div class=\"send-button-wrapper\">\n        <div class=\"button-wrapper\">\n          <co-icon class=\"button-icon\" [iconData]=\"iconService.getIcon(icons.ArrowPointRight)\"></co-icon>\n          <span class=\"button-title\" [textContent]=\"'SEND' | localize\"></span>\n        </div>\n        <co-icon class=\"hover-icon\" [iconData]=\"iconService.getIcon(icons.GripDotsVerticalSolid)\" (click)=\"openDeliveryDocumentDialog()\"></co-icon>\n      </div>\n    </div>\n\n    <ione-send-method-dialog\n      [showDialog]=\"showDialog\"\n    ></ione-send-method-dialog>\n  ",
+                    template: "\n    <div class=\"quick-access-content-wrapper\">\n      <div class=\"select-all-wrapper\">\n        <co-input-checkbox\n          [label]=\"'SELECT_ALL_LINES' | localize\"\n          (modelChange)=\"handleSelectAllLines($event)\"\n        ></co-input-checkbox>\n      </div>\n      <div class=\"send-button-wrapper\">\n        <co-transaction-send-button-dialog></co-transaction-send-button-dialog>\n      </div>\n    </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -11966,6 +12149,167 @@
         showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-receive-goods-line",] }]
     };
+    var TransactionPurchaseLineComponent = /** @class */ (function (_super) {
+        __extends(TransactionPurchaseLineComponent, _super);
+        function TransactionPurchaseLineComponent(service, iconCacheService, _transactionEventService) {
+            var _this = _super.call(this) || this;
+            _this.service = service;
+            _this.iconCacheService = iconCacheService;
+            _this._transactionEventService = _transactionEventService;
+            _this.selected = false;
+            _this.showDialogDiscount = false;
+            _this.showCheckboxForLine = false;
+            _this._subs = [];
+            return _this;
+        }
+        TransactionPurchaseLineComponent.prototype.showClass = function () {
+            return true;
+        };
+        TransactionPurchaseLineComponent.prototype.ngOnInit = function () {
+            var _this = this;
+            this._subs.push(this._transactionEventService.selectAllSalesOrderLinesForPurchase.subscribe(function (value) {
+                _this.selected = value;
+            }));
+        };
+        TransactionPurchaseLineComponent.prototype.ngOnDestroy = function () {
+            this._subs.forEach(function (s) { return s.unsubscribe(); });
+        };
+        TransactionPurchaseLineComponent.prototype.transactionLineSet = function () {
+            this.showCheckboxForLine = this.line.commissionCode === "0";
+        };
+        return TransactionPurchaseLineComponent;
+    }(TransactionLinesLineBaseComponent));
+    TransactionPurchaseLineComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-transaction-purchase-line",
+                    template: "\n    <co-transaction-base-line [line]=\"line\" [preview]=\"preview\" [checkbox]=\"showCheckboxForLine\" [checkboxValue]=\"selected\" (checkboxValueChanged)=\"selected = $event\">\n      <ng-container *ngIf=\"line.isArticle\">\n        <div class=\"transaction-line-wrapper\">\n          <div *ngIf=!preview class=\"transaction-line-extended-wrapper\">\n            <co-transaction-line-supplier-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-supplier-button>\n            <co-transaction-line-commission-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-commission-button>\n            <co-transaction-line-warehouse-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-warehouse-button>\n            <co-transaction-line-delivery-button [transactionLine]=\"line\" [transactionInfo]=\"service.currentTransaction.transactionInfo\"></co-transaction-line-delivery-button>\n            <co-transaction-line-delivery-date-button [transactionLine]=\"line\" class=\"two-column\"></co-transaction-line-delivery-date-button>\n            <co-transaction-line-statusbar [transaction]=\"line\" [transactionKind]=\"service.currentTransaction.transactionInfo.transactionKind\"></co-transaction-line-statusbar>\n          </div>\n          <div class=\"transaction-line-totals\">\n            <co-transaction-line-price class=\"transaction-line-totals-price price\"\n                                       [transactionLine]=\"line\"\n                                       [showLabel]=\"false\"\n                                       [defaultEditMode]=\"false\"\n            ></co-transaction-line-price>\n            <div class=\"transaction-line-button custom-width transaction-line-totals-discount\" (click)=\"showDialogDiscount = true\">\n              <span class=\"co-transaction-overflow-ellipsis\" [class.transaction-negative-value]=\"line.lineTotalDiscountAmount < 0\"\n                    [textContent]=\"(line.lineTotalDiscountAmount | coCurrency) || ('DISCOUNT' | localize)\"></span>\n            </div>\n            <div *ngIf=!preview class=\"transaction-line-totals-amount\">\n              <co-transaction-line-amount class=\"amount-number-picker\" [transactionLine]=\"line\"></co-transaction-line-amount>\n            </div>\n            <co-editable-label class=\"transaction-line-totals-total price\"\n                               [model]=\"line.displayNetLineTotal | coCurrency\"\n                               [editModel]=\"line.displayNetLineTotal\"\n                               [readonly]=\"readonly\"\n                               [commit]=\"!readonly\"\n            ></co-editable-label>\n          </div>\n        </div>\n      </ng-container>\n    </co-transaction-base-line>\n    <co-dialog-transaction-line-discount *ngIf=\"showDialogDiscount\"\n                                         [transactionInfo]=\"service.currentTransaction.transactionInfo\"\n                                         [transactionLine]=\"line\"\n                                         (close)=\"showDialogDiscount = false\"\n    ></co-dialog-transaction-line-discount>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    TransactionPurchaseLineComponent.ctorParameters = function () { return [
+        { type: TransactionService },
+        { type: IconCacheService },
+        { type: TransactionEventService }
+    ]; };
+    TransactionPurchaseLineComponent.propDecorators = {
+        showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-purchase-line",] }]
+    };
+    var TransactionQuickAccessOrderPurchaseComponent = /** @class */ (function (_super) {
+        __extends(TransactionQuickAccessOrderPurchaseComponent, _super);
+        function TransactionQuickAccessOrderPurchaseComponent(service, _transactionEventService) {
+            var _this = _super.call(this, service) || this;
+            _this.service = service;
+            _this._transactionEventService = _transactionEventService;
+            _this.icons = Icon;
+            return _this;
+        }
+        TransactionQuickAccessOrderPurchaseComponent.prototype.showClass = function () {
+            return true;
+        };
+        TransactionQuickAccessOrderPurchaseComponent.prototype.handleSelectAllLines = function (value) {
+            this._transactionEventService.selectAllSalesOrderLinesForPurchase.next(value);
+        };
+        TransactionQuickAccessOrderPurchaseComponent.prototype.handleSendButtonClick = function (event) {
+            this.service.generateCommissionOrders(this.transactionInfo.id, false);
+        };
+        return TransactionQuickAccessOrderPurchaseComponent;
+    }(TransactionBaseComponent));
+    TransactionQuickAccessOrderPurchaseComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-transaction-quick-access-order-purchase",
+                    template: "\n    <div class=\"quick-access-content-wrapper\">\n      <div class=\"select-all-wrapper\">\n        <co-input-checkbox\n          [label]=\"'SELECT_ALL_LINES' | localize\"\n          (modelChange)=\"handleSelectAllLines($event)\"\n        ></co-input-checkbox>\n      </div>\n      <div class=\"send-button-wrapper\">\n        <co-transaction-send-button-dialog\n          [showSendIcon]=\"false\"\n          [showHoverIcon]=\"false\"\n          (sendButtonClick)=\"handleSendButtonClick($event)\"></co-transaction-send-button-dialog>\n      </div>\n    </div>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    TransactionQuickAccessOrderPurchaseComponent.ctorParameters = function () { return [
+        { type: TransactionService },
+        { type: TransactionEventService }
+    ]; };
+    TransactionQuickAccessOrderPurchaseComponent.propDecorators = {
+        showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-quick-access-order-purchase",] }]
+    };
+    var TransactionButtonBarButtonBaseComponent = /** @class */ (function () {
+        function TransactionButtonBarButtonBaseComponent() {
+            this.showLoaderChange = new rxjs.BehaviorSubject(undefined);
+            this.checkedChange = new rxjs.BehaviorSubject(undefined);
+            this._showLoader = false;
+            this._checked = false;
+        }
+        Object.defineProperty(TransactionButtonBarButtonBaseComponent.prototype, "showLoader", {
+            get: function () {
+                return this._showLoader;
+            },
+            set: function (value) {
+                this._showLoader = value;
+                this.showLoaderChange.next(this._showLoader);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TransactionButtonBarButtonBaseComponent.prototype, "checked", {
+            get: function () {
+                return this._checked;
+            },
+            set: function (value) {
+                this._checked = value;
+                this.checkedChange.next(this._checked);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        return TransactionButtonBarButtonBaseComponent;
+    }());
+    TransactionButtonBarButtonBaseComponent.decorators = [
+        { type: i0.Directive }
+    ];
+    TransactionButtonBarButtonBaseComponent.propDecorators = {
+        title: [{ type: i0.Input }],
+        iconName: [{ type: i0.Input }],
+        transactionInfoResponse: [{ type: i0.Input }],
+        showLoader: [{ type: i0.Input }],
+        checked: [{ type: i0.Input }],
+        showLoaderChange: [{ type: i0.Output }],
+        checkedChange: [{ type: i0.Output }]
+    };
+    var TransactionSalesPurchaseButtonBarButtonComponent = /** @class */ (function (_super) {
+        __extends(TransactionSalesPurchaseButtonBarButtonComponent, _super);
+        function TransactionSalesPurchaseButtonBarButtonComponent(iconCacheService, _transactionEventService) {
+            var _this = _super.call(this) || this;
+            _this.iconCacheService = iconCacheService;
+            _this._transactionEventService = _transactionEventService;
+            _this.showClass = true;
+            _this._subs = [];
+            _this._subs.push(_this._transactionEventService.generateCommissionOrders.subscribe(function (generating) {
+                _this.showLoader = generating;
+                if (!_this.showLoader) {
+                    _this.checked = true;
+                }
+            }));
+            return _this;
+        }
+        TransactionSalesPurchaseButtonBarButtonComponent.prototype.ngOnDestroy = function () {
+            this._subs.forEach(function (s) { return s.unsubscribe(); });
+        };
+        return TransactionSalesPurchaseButtonBarButtonComponent;
+    }(TransactionButtonBarButtonBaseComponent));
+    TransactionSalesPurchaseButtonBarButtonComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-transaction-sales-purchase-button-bar-button",
+                    template: "\n    <co-icon class=\"co-transaction-button-bar-icon\" [iconData]=\"iconCacheService.getIcon(iconName)\"></co-icon>\n    <span class=\"button-title\" [textContent]=\"title | localize\"></span>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    TransactionSalesPurchaseButtonBarButtonComponent.ctorParameters = function () { return [
+        { type: IconCacheService },
+        { type: TransactionEventService }
+    ]; };
+    TransactionSalesPurchaseButtonBarButtonComponent.propDecorators = {
+        showClass: [{ type: i0.HostBinding, args: ['class.co-transaction-sales-purchase-button-bar-button',] }]
+    };
     var TransactionMappingService = /** @class */ (function () {
         function TransactionMappingService() {
             this._buttonBarTransaction = new Map([
@@ -11979,7 +12323,7 @@
                     ]],
                 [transactionKind_enum.TransactionKind.SalesOrder, [
                         { title: 'OVERVIEW', icon: Icon.CartShoppingSolid, category: TransactionTypeCategory.SalesOrderOverview },
-                        { title: 'PURCHASE', icon: Icon.PalletBoxesSolid, category: TransactionTypeCategory.SalesOrderPurchase },
+                        { title: 'PURCHASE', icon: Icon.PalletBoxesSolid, category: TransactionTypeCategory.SalesOrderPurchase, component: TransactionSalesPurchaseButtonBarButtonComponent },
                         { title: 'LOGISTICS', icon: Icon.ShelvesSolid, category: TransactionTypeCategory.SalesOrderLogistics },
                         { title: 'PLANNING', icon: Icon.TruckMovingSolid, category: TransactionTypeCategory.SalesOrderPlanning },
                         { title: 'DELIVERY_NOTE', icon: Icon.MemoCircleCheckSolid, category: TransactionTypeCategory.SalesOrderDeliveryNote },
@@ -11990,6 +12334,7 @@
                 [{ type: transactionKind_enum.TransactionKind.PurchaseOrder, category: TransactionTypeCategory.PurchaseOrderOrderConfirmation }, TransactionQuickAccessOrderConfirmationComponent],
                 [{ type: transactionKind_enum.TransactionKind.PurchaseOrder, category: TransactionTypeCategory.PurchaseOrderReceivedGoods }, TransactionQuickAccessReceivedGoodsComponent],
                 [{ type: transactionKind_enum.TransactionKind.SalesOrder, category: TransactionTypeCategory.SalesOrderOverview }, TransactionQuickAccessOverviewComponent],
+                [{ type: transactionKind_enum.TransactionKind.SalesOrder, category: TransactionTypeCategory.SalesOrderPurchase }, TransactionQuickAccessOrderPurchaseComponent],
                 [{ type: transactionKind_enum.TransactionKind.SalesOrder, category: TransactionTypeCategory.SalesOrderDeliveryNote }, TransactionQuickAccessOrderDeliveryComponent]
             ]);
             this._transactionGridComponent = new Map([
@@ -11999,6 +12344,7 @@
             ]);
             this._transactionLineComponent = new Map([
                 [{ type: transactionKind_enum.TransactionKind.SalesOrder, category: TransactionTypeCategory.SalesOrderOverview }, TransactionOverviewLineComponent],
+                [{ type: transactionKind_enum.TransactionKind.SalesOrder, category: TransactionTypeCategory.SalesOrderPurchase }, TransactionPurchaseLineComponent],
                 [{ type: transactionKind_enum.TransactionKind.SalesOrder, category: TransactionTypeCategory.SalesOrderDeliveryNote }, TransactionOrderDeliveryLineComponent],
                 [{ type: transactionKind_enum.TransactionKind.PurchaseOrder, category: TransactionTypeCategory.PurchaseOrderReceivedGoods }, TransactionReceiveGoodsLineComponent],
             ]);
@@ -12981,15 +13327,18 @@
         PaymentComponent.prototype._getDownpaymentInfo = function () {
             var _this = this;
             this.downPayments.length = 0;
-            this._paymentService.getDownPaymentInfo(this.transactionUuid).then(function (info) {
-                _this.amountToPay = (info.toDownPayAmount ? info.toDownPayAmount : 0) - (info.payedDownAmount ? info.payedDownAmount : 0);
-                if (info.downPayments) {
-                    info.downPayments.forEach(function (dp) {
-                        var paymentMethod = _this.paymentMethods.find(function (pm) { return pm.payment.code === dp.paymentMethodCode; });
-                        _this.downPayments.push(new DownPaymentViewModel(dp, paymentMethod));
-                    });
-                }
-                _this.showLoaderDownPayments = false;
+            return new Promise(function (resolve) {
+                _this._paymentService.getDownPaymentInfo(_this.transactionUuid).then(function (info) {
+                    _this.amountToPay = (info.toDownPayAmount ? info.toDownPayAmount : 0) - (info.payedDownAmount ? info.payedDownAmount : 0);
+                    if (info.downPayments) {
+                        info.downPayments.forEach(function (dp) {
+                            var paymentMethod = _this.paymentMethods.find(function (pm) { return pm.payment.code === dp.paymentMethodCode; });
+                            _this.downPayments.push(new DownPaymentViewModel(dp, paymentMethod));
+                        });
+                    }
+                    _this.showLoaderDownPayments = false;
+                    resolve();
+                });
             });
         };
         PaymentComponent.prototype._dataUriToBase64 = function (uri, mimeType) {
@@ -13075,7 +13424,7 @@
     PaymentComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-payment",
-                    template: "\n    <div class=\"payment-wrapper\">\n      <div class=\"payment-methods-header\">\n        <span class=\"payment-header-title\" [textContent]=\"'SELECT_A' | localize\"></span>\n        <span class=\"payment-header-title extra\" [textContent]=\"'FREE' | localize:false\"></span>\n        <span class=\"payment-header-title\" [textContent]=\"'PAYMENT_METHOD' | localize:false\"></span>\n      </div>\n      <div class=\"payment-methods\">\n        <transaction-loader class=\"loader\" *ngIf=\"showLoader\"></transaction-loader>\n        <ng-container *ngIf=\"!showLoader\">\n          <co-payment-tile *ngFor=\"let paymentMethod of paymentMethods; let index = index\"\n                           [image]=\"paymentMethod.image\"\n                           [description]=\"paymentMethod.payment.description\"\n                           [selected]=\"paymentMethodIdx === index\"\n                           (selectedChange)=\"paymentMethodSelected(paymentMethod.payment, index)\"\n          ></co-payment-tile>\n        </ng-container>\n      </div>\n      <div class=\"payment-cash-register-wrapper\" *ngIf=\"showCashRegisters\">\n        <div class=\"payment-cash-register-header\">\n          <span class=\"payment-header-title\" [textContent]=\"'SELECT_CASH_REGISTER' | localize\"></span>\n        </div>\n        <div class=\"payment-methods\">\n          <co-payment-tile *ngFor=\"let cashRegister of cashRegisters; let index = index\"\n                           [icon]=\"cashRegister.icon\"\n                           [description]=\"cashRegister.description\"\n                           [selected]=\"cashRegisterIdx === index\"\n                           (selectedChange)=\"cashRegisterSelected(cashRegister, index)\"\n          ></co-payment-tile>\n        </div>\n      </div>\n      <div class=\"payment-to-pay-wrapper\">\n        <div class=\"payment-to-pay\">\n          <div [textContent]=\"'TO_PAY' | localize\"></div>\n          <div class=\"payment-amount\" [textContent]=\"amountToPay === 0 ? amountToPay : (amountToPay | priceDisplay)\"></div>\n        </div>\n        <div class=\"payment-downpayment\" [class.no-display]=\"!downPayments || downPayments.length === 0\">\n          <co-down-payment [transactionUuid]=\"transactionUuid\" [downPayments]=\"downPayments\" [showLoader]=\"showLoaderDownPayments\"></co-down-payment>\n        </div>\n        <div class=\"payment-to-pay-button\" [class.no-downpayments]=\"!downPayments || downPayments.length === 0\">\n            <co-button [label]=\"'PAY' | localize\" (click)=\"handlePayment()\" [disabled]=\"amountToPay === 0\"></co-button>\n        </div>\n        <co-key-pad class=\"payment-to-pay-keypad\"\n          [showValue]=\"false\"\n          [emitModelChangeOnEnter]=\"false\"\n          [model]=\"amountToPay\"\n          (modelChange)=\"handleKeyPadModelChange($event)\"\n          (enterClick)=\"handlePayment()\"\n        ></co-key-pad>\n      </div>\n    </div>\n    <co-dialog *ngIf=\"showPspQrCode\" (closeClick)=\"showPspQrCode = false\">\n      <co-payment-qr-code\n        [qrCodeImage]=\"qrCodeImage\"\n      ></co-payment-qr-code>\n    </co-dialog>\n  ",
+                    template: "\n    <div class=\"payment-wrapper\">\n      <div class=\"payment-methods-header\">\n        <span class=\"payment-header-title\" [textContent]=\"'SELECT_A' | localize\"></span>\n        <span class=\"payment-header-title extra\" [textContent]=\"'FREE' | localize:false\"></span>\n        <span class=\"payment-header-title\" [textContent]=\"'PAYMENT_METHOD' | localize:false\"></span>\n      </div>\n      <div class=\"payment-methods\">\n        <co-loader class=\"loader\" *ngIf=\"showLoader\"></co-loader>\n        <ng-container *ngIf=\"!showLoader\">\n          <co-payment-tile *ngFor=\"let paymentMethod of paymentMethods; let index = index\"\n                           [image]=\"paymentMethod.image\"\n                           [description]=\"paymentMethod.payment.description\"\n                           [selected]=\"paymentMethodIdx === index\"\n                           (selectedChange)=\"paymentMethodSelected(paymentMethod.payment, index)\"\n          ></co-payment-tile>\n        </ng-container>\n      </div>\n      <div class=\"payment-cash-register-wrapper\" *ngIf=\"showCashRegisters\">\n        <div class=\"payment-cash-register-header\">\n          <span class=\"payment-header-title\" [textContent]=\"'SELECT_CASH_REGISTER' | localize\"></span>\n        </div>\n        <div class=\"payment-methods\">\n          <co-payment-tile *ngFor=\"let cashRegister of cashRegisters; let index = index\"\n                           [icon]=\"cashRegister.icon\"\n                           [description]=\"cashRegister.description\"\n                           [selected]=\"cashRegisterIdx === index\"\n                           (selectedChange)=\"cashRegisterSelected(cashRegister, index)\"\n          ></co-payment-tile>\n        </div>\n      </div>\n      <div class=\"payment-to-pay-wrapper\">\n        <div class=\"payment-to-pay\">\n          <div [textContent]=\"'TO_PAY' | localize\"></div>\n          <div class=\"payment-amount\" [textContent]=\"amountToPay === 0 ? amountToPay : (amountToPay | priceDisplay)\"></div>\n        </div>\n        <div class=\"payment-downpayment\" [class.no-display]=\"!downPayments || downPayments.length === 0\">\n          <co-down-payment [transactionUuid]=\"transactionUuid\" [downPayments]=\"downPayments\" [showLoader]=\"showLoaderDownPayments\"></co-down-payment>\n        </div>\n        <div class=\"payment-to-pay-button\" [class.no-downpayments]=\"!downPayments || downPayments.length === 0\">\n            <co-button [label]=\"'PAY' | localize\" (click)=\"handlePayment()\" [disabled]=\"amountToPay === 0\"></co-button>\n        </div>\n        <co-key-pad class=\"payment-to-pay-keypad\"\n          [showValue]=\"false\"\n          [emitModelChangeOnEnter]=\"false\"\n          [model]=\"amountToPay\"\n          (modelChange)=\"handleKeyPadModelChange($event)\"\n          (enterClick)=\"handlePayment()\"\n        ></co-key-pad>\n      </div>\n    </div>\n    <co-dialog *ngIf=\"showPspQrCode\" (closeClick)=\"showPspQrCode = false\">\n      <co-payment-qr-code\n        [qrCodeImage]=\"qrCodeImage\"\n      ></co-payment-qr-code>\n    </co-dialog>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -13151,7 +13500,7 @@
     PaymentQrCodeComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-payment-qr-code",
-                    template: "\n    <div class=\"payment-qr-code-wrapper\">\n      <transaction-loader *ngIf=\"!qrCodeImage\"></transaction-loader>\n      <img *ngIf=\"qrCodeImage\" [src]=\"qrCodeImage\"/>\n    </div>\n  ",
+                    template: "\n    <div class=\"payment-qr-code-wrapper\">\n      <co-loader *ngIf=\"!qrCodeImage\"></co-loader>\n      <img *ngIf=\"qrCodeImage\" [src]=\"qrCodeImage\"/>\n    </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -13160,6 +13509,44 @@
         showClass: [{ type: i0.HostBinding, args: ["class.co-payment-qr-code",] }]
     };
+    var LoaderComponent = /** @class */ (function () {
+        function LoaderComponent() {
+        }
+        LoaderComponent.prototype.showClass = function () {
+            return true;
+        };
+        return LoaderComponent;
+    }());
+    LoaderComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-loader",
+                    template: "\n    <div class=\"transaction-loader\">\n      <svg width=\"38\" height=\"38\" viewBox=\"0 0 38 38\" xmlns=\"http://www.w3.org/2000/svg\">\n        <defs>\n          <linearGradient x1=\"8.042%\" y1=\"0%\" x2=\"65.682%\" y2=\"23.865%\" id=\"a\">\n            <stop stop-color=\"#000\" stop-opacity=\"0\" offset=\"0%\"/>\n            <stop stop-color=\"#000\" stop-opacity=\".631\" offset=\"63.146%\"/>\n            <stop stop-color=\"#000\" offset=\"100%\"/>\n          </linearGradient>\n        </defs>\n        <g fill=\"none\" fill-rule=\"evenodd\">\n          <g transform=\"translate(1 1)\">\n            <path d=\"M36 18c0-9.94-8.06-18-18-18\" id=\"Oval-2\" stroke=\"url(#a)\" stroke-width=\"2\">\n              <animateTransform\n                attributeName=\"transform\"\n                type=\"rotate\"\n                from=\"0 18 18\"\n                to=\"360 18 18\"\n                dur=\"0.9s\"\n                repeatCount=\"indefinite\"/>\n            </path>\n            <circle fill=\"#000\" cx=\"36\" cy=\"18\" r=\"1\">\n              <animateTransform\n                attributeName=\"transform\"\n                type=\"rotate\"\n                from=\"0 18 18\"\n                to=\"360 18 18\"\n                dur=\"0.9s\"\n                repeatCount=\"indefinite\"/>\n            </circle>\n          </g>\n        </g>\n      </svg>\n    </div>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    LoaderComponent.propDecorators = {
+        showClass: [{ type: i0.HostBinding, args: ["class.co-loader",] }]
+    };
+    var LoaderModule = /** @class */ (function () {
+        function LoaderModule() {
+        }
+        return LoaderModule;
+    }());
+    LoaderModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule
+                    ],
+                    declarations: [
+                        LoaderComponent
+                    ],
+                    exports: [
+                        LoaderComponent
+                    ]
+                },] }
+    ];
     var PaymentQrCodeModule = /** @class */ (function () {
         function PaymentQrCodeModule() {
         }
@@ -13169,7 +13556,8 @@
         { type: i0.NgModule, args: [{
                     imports: [
                         common.CommonModule,
-                        CoreModule
+                        CoreModule,
+                        LoaderModule
                     ],
                     declarations: [
                         PaymentQrCodeComponent
@@ -13222,7 +13610,7 @@
     DownPaymentComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-down-payment",
-                    template: "\n      <transaction-loader class=\"loader\" *ngIf=\"showLoader\"></transaction-loader>\n      <div class=\"down-payment-payments-title\" [textContent]=\"'PAYMENTS_MADE' | localize\" *ngIf=\"downPayments && downPayments.length > 0\"></div>\n      <div class=\"down-payment-payments-wrapper\">\n        <div class=\"down-payment-payments\" *ngFor=\"let payment of downPayments\">\n          <co-payment-tile\n            [image]=\"payment.paymentMethod.image\"\n            [description]=\"payment.paymentMethod.payment.description\"\n          ></co-payment-tile>\n          <div class=\"down-payment-amount-wrapper\">\n            <div class=\"down-payment-amount\" [textContent]=\"payment.downPayment.downPaymentAmount | coCurrency\"></div>\n            <div class=\"down-payment-date\" [textContent]=\"payment.downPayment.date | date:'d MMMM yyyy'\"></div>\n          </div>\n        </div>\n      </div>\n    ",
+                    template: "\n      <co-loader class=\"loader\" *ngIf=\"showLoader\"></co-loader>\n      <div class=\"down-payment-payments-title\" [textContent]=\"'PAYMENTS_MADE' | localize\" *ngIf=\"downPayments && downPayments.length > 0\"></div>\n      <div class=\"down-payment-payments-wrapper\">\n        <div class=\"down-payment-payments\" *ngFor=\"let payment of downPayments\">\n          <co-payment-tile\n            [image]=\"payment.paymentMethod.image\"\n            [description]=\"payment.paymentMethod.payment.description\"\n          ></co-payment-tile>\n          <div class=\"down-payment-amount-wrapper\">\n            <div class=\"down-payment-amount\" [textContent]=\"payment.downPayment.downPaymentAmount | coCurrency\"></div>\n            <div class=\"down-payment-date\" [textContent]=\"payment.downPayment.date | date:'d MMMM yyyy'\"></div>\n          </div>\n        </div>\n      </div>\n    ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -13247,7 +13635,8 @@
                         common.CommonModule,
                         CoreModule,
                         PipeModule,
-                        PaymentTileModule
+                        PaymentTileModule,
+                        LoaderModule
                     ],
                     declarations: [
                         DownPaymentComponent
@@ -13275,7 +13664,8 @@
                         corecomponents_v12.CoDialogModule,
                         corecomponents_v12.ButtonModule,
                         PaymentQrCodeModule,
-                        DownPaymentModule
+                        DownPaymentModule,
+                        LoaderModule
                     ],
                     declarations: [
                         PaymentComponent
@@ -13289,6 +13679,7 @@
     var RelationTypeComponent = /** @class */ (function () {
         function RelationTypeComponent() {
             this.relType = relationNameKind_enum.RelationNameKind;
+            this.readonly = false;
             this.relation = nulRelationObject.NULL_RELATION_OBJECT;
             this.relationChange = new i0.EventEmitter();
         }
@@ -13304,11 +13695,12 @@
     RelationTypeComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-relation-type",
-                    template: "\n    <div class=\"default-data-row\">\n      <co-input-radio-button class=\"default-width\"\n                             [label]=\"'PRIVATE_PERSON' | localize\"\n                             [model]=\"relation.type === relType.Private\"\n                             (modelChange)=\"handleChangeRelationType(relType.Private)\"\n      ></co-input-radio-button>\n      <co-input-radio-button class=\"default-width\"\n                             [label]=\"'COMPANY' | localize\"\n                             [model]=\"relation.type === relType.Company\"\n                             (modelChange)=\"handleChangeRelationType(relType.Company)\"\n      ></co-input-radio-button>\n    </div>\n    ",
+                    template: "\n    <div class=\"default-data-row\">\n      <co-input-radio-button class=\"default-width\"\n                             [readonly]=\"readonly\"\n                             [label]=\"'PRIVATE_PERSON' | localize\"\n                             [model]=\"relation.type === relType.Private\"\n                             (modelChange)=\"handleChangeRelationType(relType.Private)\"\n      ></co-input-radio-button>\n      <co-input-radio-button class=\"default-width\"\n                             [readonly]=\"readonly\"\n                             [label]=\"'COMPANY' | localize\"\n                             [model]=\"relation.type === relType.Company\"\n                             (modelChange)=\"handleChangeRelationType(relType.Company)\"\n      ></co-input-radio-button>\n    </div>\n    ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
     RelationTypeComponent.propDecorators = {
+        readonly: [{ type: i0.Input }],
         relation: [{ type: i0.Input }],
         relationChange: [{ type: i0.Output }],
         showClass: [{ type: i0.HostBinding, args: ["class.co-relation-type",] }]
@@ -13337,11 +13729,14 @@
     var RelationGeneralComponent = /** @class */ (function (_super) {
         __extends(RelationGeneralComponent, _super);
-        function RelationGeneralComponent(_service) {
+        function RelationGeneralComponent(_service, _dictionaryService, _dialogService) {
             var _this = _super.call(this) || this;
             _this._service = _service;
+            _this._dictionaryService = _dictionaryService;
+            _this._dialogService = _dialogService;
             _this.relType = relationNameKind_enum.RelationNameKind;
             _this.genderType = genderType_enum.GenderType;
+            _this.readonly = false;
             _this.relationSuggestions = [];
             _this.showSuggestionsSidebar = false;
             // fetches relation suggestions
@@ -13378,7 +13773,9 @@
             }
         };
         RelationGeneralComponent.prototype.showSidebar = function () {
-            this.showSuggestionsSidebar = true;
+            if (!this.readonly) {
+                this.showSuggestionsSidebar = true;
+            }
         };
         // Hide sidebar with a little timeout to prevent missing the click
         RelationGeneralComponent.prototype.hideSidebar = function () {
@@ -13389,21 +13786,26 @@
         };
         RelationGeneralComponent.prototype.onRelationSuggestionClick = function (relationSuggested) {
             return __awaiter(this, void 0, void 0, function () {
-                var _a;
+                var lockResult, _a;
                 return __generator(this, function (_b) {
                     switch (_b.label) {
                         case 0:
-                            if (!relationSuggested) return [3 /*break*/, 2];
+                            if (!relationSuggested) return [3 /*break*/, 4];
+                            return [4 /*yield*/, this._service.lockRelation(relationSuggested.relationType, parseInt(relationSuggested.relationNr, 0))];
+                        case 1:
+                            lockResult = _b.sent();
+                            if (!!lockResult.success) return [3 /*break*/, 2];
+                            this._dialogService.showError(this._dictionaryService.get("RELATION_ALREADY_LOCKED"), lockResult.messages[0].message);
+                            return [3 /*break*/, 4];
+                        case 2:
                             this.hideSidebar();
-                            // await this._service.addRelationToTransaction(relationSuggested.relationId);
                             _a = this;
                             return [4 /*yield*/, this._service.getCustomerFullObjectByRelationId(relationSuggested.relationId)];
-                        case 1:
-                            // await this._service.addRelationToTransaction(relationSuggested.relationId);
+                        case 3:
                             _a.relation = _b.sent();
                             this.relationChange.next(this.relation);
-                            _b.label = 2;
-                        case 2: return [2 /*return*/];
+                            _b.label = 4;
+                        case 4: return [2 /*return*/];
                     }
                 });
             });
@@ -13452,7 +13854,7 @@
     RelationGeneralComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-relation-general",
-                    template: "\n    <div *ngIf=\"relation.type === relType.Private\" class=\"collapseable\" @showHidePrivateRelationFields>\n      <div class=\"default-data-row\">\n        <co-input-text\n          class=\"checkout-first-name\"\n          [(model)]=\"relation.firstName\"\n          [placeholder]=\"'FIRST_NAME' | localize\"\n          (modelChange)=\"firstNameChange($event)\"\n          (blur)=\"checkVisibilitySuggestions()\"\n          [required]=\"true\"\n        ></co-input-text>\n        <co-input-text\n          class=\"checkout-prefix-name default-width\"\n          [(model)]=\"relation.prefix\"\n          [placeholder]=\"'PREFIX' | localize\"\n        ></co-input-text>\n        <co-input-text\n          class=\"checkout-last-name\"\n          [(model)]=\"relation.familyName\"\n          [placeholder]=\"'LAST_NAME' | localize\"\n          (modelChange)=\"familyNameChange($event)\"\n          (blur)=\"checkVisibilitySuggestions()\"\n          [required]=\"true\"></co-input-text>\n      </div>\n      <div class=\"default-data-row\">\n        <co-input-radio-button class=\"default-width\"\n                               [label]=\"'MALE' | localize\"\n                               [model]=\"relation.gender === genderType.Male\"\n                               (modelChange)=\"changeGenderType(genderType.Male)\"\n        ></co-input-radio-button>\n        <co-input-radio-button class=\"default-width\"\n                               [label]=\"'FEMALE' | localize \"\n                               [model]=\"relation.gender === genderType.Female\"\n                               (modelChange)=\"changeGenderType(genderType.Female)\"\n        ></co-input-radio-button>\n        <co-input-radio-button class=\"default-width\"\n                               [label]=\"'UNKNOWN' | localize\"\n                               [model]=\"relation.gender === genderType.Unspecified\"\n                               (modelChange)=\"changeGenderType(genderType.Unspecified)\"\n        ></co-input-radio-button>\n      </div>\n      <div class=\"default-data-row\">\n        <co-input-date [placeholder]=\"'DATE_OF_BIRTH' | localize \" [(model)]=\"dateOfBirth\"></co-input-date>\n      </div>\n    </div>\n    <div *ngIf=\"relation?.type === relType.Company\" class=\"default-data-row collapseable\" @showHideCompanyRelationFields>\n      <co-input-text [(model)]=\"relation.familyName\" [placeholder]=\"'COMPANY_NAME' | localize\" [required]=\"true\"></co-input-text>\n    </div>\n\n    <div class=\"suggestions-sidebar\" *ngIf=\"showSuggestionsSidebar\" @showHideSidebar>\n      <div class=\"relation-sidebar-header\">\n        <label class=\"checkout-label-h3\" [textContent]=\"'SUGGESTIONS' | localize\"></label>\n      </div>\n      <co-relation-suggestions-list\n        [suggestions]=\"relationSuggestions\"\n        (suggestionSelected)=\"onRelationSuggestionClick($event)\"\n      ></co-relation-suggestions-list>\n    </div>\n  ",
+                    template: "\n    <div *ngIf=\"relation.type === relType.Private\" class=\"collapseable\" @showHidePrivateRelationFields>\n      <div class=\"default-data-row\">\n        <co-input-text\n          class=\"checkout-first-name\"\n          [readonly]=\"readonly\"\n          [(model)]=\"relation.firstName\"\n          [placeholder]=\"'FIRST_NAME' | localize\"\n          (modelChange)=\"firstNameChange($event)\"\n          (blur)=\"checkVisibilitySuggestions()\"\n          [required]=\"true\"\n        ></co-input-text>\n        <co-input-text\n          class=\"checkout-prefix-name default-width\"\n          [readonly]=\"readonly\"\n          [(model)]=\"relation.prefix\"\n          [placeholder]=\"'PREFIX' | localize\"\n        ></co-input-text>\n        <co-input-text\n          class=\"checkout-last-name\"\n          [readonly]=\"readonly\"\n          [(model)]=\"relation.familyName\"\n          [placeholder]=\"'LAST_NAME' | localize\"\n          (modelChange)=\"familyNameChange($event)\"\n          (blur)=\"checkVisibilitySuggestions()\"\n          [required]=\"true\"></co-input-text>\n      </div>\n      <div class=\"default-data-row\">\n        <co-input-radio-button class=\"default-width\"\n                               [readonly]=\"readonly\"\n                               [label]=\"'MALE' | localize\"\n                               [model]=\"relation.gender === genderType.Male\"\n                               (modelChange)=\"changeGenderType(genderType.Male)\"\n        ></co-input-radio-button>\n        <co-input-radio-button class=\"default-width\"\n                               [readonly]=\"readonly\"\n                               [label]=\"'FEMALE' | localize \"\n                               [model]=\"relation.gender === genderType.Female\"\n                               (modelChange)=\"changeGenderType(genderType.Female)\"\n        ></co-input-radio-button>\n        <co-input-radio-button class=\"default-width\"\n                               [readonly]=\"readonly\"\n                               [label]=\"'UNKNOWN' | localize\"\n                               [model]=\"relation.gender === genderType.Unspecified\"\n                               (modelChange)=\"changeGenderType(genderType.Unspecified)\"\n        ></co-input-radio-button>\n      </div>\n      <div class=\"default-data-row\">\n        <co-input-date [readonly]=\"readonly\" [placeholder]=\"'DATE_OF_BIRTH' | localize \" [(model)]=\"dateOfBirth\"></co-input-date>\n      </div>\n    </div>\n    <div *ngIf=\"relation?.type === relType.Company\" class=\"default-data-row collapseable\" @showHideCompanyRelationFields>\n      <co-input-text [readonly]=\"readonly\" [(model)]=\"relation.familyName\" [placeholder]=\"'COMPANY_NAME' | localize\" [required]=\"true\"></co-input-text>\n    </div>\n\n    <div class=\"suggestions-sidebar\" *ngIf=\"showSuggestionsSidebar\" @showHideSidebar>\n      <div class=\"relation-sidebar-header\">\n        <label class=\"checkout-label-h3\" [textContent]=\"'SUGGESTIONS' | localize\"></label>\n      </div>\n      <co-relation-suggestions-list\n        [suggestions]=\"relationSuggestions\"\n        (suggestionSelected)=\"onRelationSuggestionClick($event)\"\n      ></co-relation-suggestions-list>\n    </div>\n  ",
                     animations: [
                         animations.trigger("showHidePrivateRelationFields", [
                             animations.state("void", animations.style({ height: 0 })),
@@ -13476,9 +13878,12 @@
                 },] }
     ];
     RelationGeneralComponent.ctorParameters = function () { return [
-        { type: TransactionService }
+        { type: TransactionService },
+        { type: DictionaryService },
+        { type: DialogService }
     ]; };
     RelationGeneralComponent.propDecorators = {
+        readonly: [{ type: i0.Input }],
         showClass: [{ type: i0.HostBinding, args: ["class.co-relation-general",] }]
     };
@@ -13604,11 +14009,12 @@
             _this._boFactory = _boFactory;
             _this._formMasterService = _formMasterService;
             _this.icons = Icon;
+            _this.readonly = false;
             _this.addresses = [];
+            _this.showOnlyActive = true;
             _this.type = addressType_enum.AddressType.DeliveryAddress;
-            _this.selectedAddressIdx = 0;
-            _this.selectedAddressChange = new i0.EventEmitter();
-            _this.selectedAddressNawNrChange = new i0.EventEmitter();
+            _this.selectedNawNr = 0;
+            _this.selectedNawNrChange = new i0.EventEmitter();
             _this.showEditAddressDialog = false;
             return _this;
         }
@@ -13637,22 +14043,24 @@
             this.addressToEdit = new address_bo.Address();
             this.showEditAddressDialog = true;
         };
-        RelationAddressesComponent.prototype.setIndexAddress = function (idx) {
-            this.selectedAddressIdx = idx;
-            this.selectedAddressChange.emit(idx);
-            var nawNr = this.addresses[this.selectedAddressIdx].nawNr;
-            this.selectedAddressNawNrChange.emit(nawNr);
+        RelationAddressesComponent.prototype.changeAddress = function (address) {
+            if (address && !this.readonly) {
+                this.selectedNawNr = address.nawNr;
+                this.selectedNawNrChange.emit(this.selectedNawNr);
+            }
         };
         RelationAddressesComponent.prototype.editAddress = function (addr) {
-            this.addressToEdit = this._boFactory.makeWithRawBackendData(address_bo.Address, addr);
-            this.showEditAddressDialog = true;
+            if (!this.readonly) {
+                this.addressToEdit = this._boFactory.makeWithRawBackendData(address_bo.Address, addr);
+                this.showEditAddressDialog = true;
+            }
         };
         return RelationAddressesComponent;
     }(RelationBaseComponent));
     RelationAddressesComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-relation-addresses",
-                    template: "\n    <div class=\"default-data-row\">\n      <co-carousel-3d *ngIf=\"addresses && addresses.length > 1\"\n                      [tileWidth]=\"200\"\n                      [tileHeight]=\"100\"\n                      [selectedIndex]=\"selectedAddressIdx\"\n                      (indexSelected)=\"setIndexAddress($event)\">\n        <co-relation-address-tile #carouselItem *ngFor=\"let address of addresses; let index = index\"\n                                  [address]=\"address\"\n                                  [selected]=\"selectedAddressIdx === index\"\n                                  (editAddressClicked)=\"editAddress($event)\"\n        ></co-relation-address-tile>\n      </co-carousel-3d>\n    </div>\n    <div class=\"default-data-row\">\n      <div class=\"relation-address-new\">\n        <icon class=\"relation-address-icon\" [icon]=\"icons.ArrowPointRight\"></icon>\n        <div [textContent]=\"'ADDRESS_ADD' | localize\" (click)=\"showNewAddressDialog()\"></div>\n      </div>\n    </div>\n    <co-dialog class=\"dialog-relation-addresses-create-address\" *ngIf=\"showEditAddressDialog\"\n               [footerTemplate]=\"templateFooter\"\n               [headerTemplate]=\"templateHeader\">\n      <co-form>\n        <co-relation-address\n          [relation]=\"relation\"\n          [(address)]=\"addressToEdit\"\n        ></co-relation-address>\n      </co-form>\n      <ng-template #templateHeader>\n        <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'NEW_ADDRESS' | localize\"></div>\n      </ng-template>\n      <ng-template #templateFooter>\n        <div class=\"dialog-footer-button-wrapper\">\n          <co-button [label]=\"'SAVE' | localize\" (click)=\"submitForm()\"></co-button>\n          <co-button [label]=\"'CANCEL' | localize\" (click)=\"showEditAddressDialog = false\"></co-button>\n        </div>\n      </ng-template>\n    </co-dialog>\n  ",
+                    template: "\n    <div class=\"default-data-row\">\n      <co-carousel *ngIf=\"addresses && addresses.length > 1\">\n        <co-relation-address-tile #carouselItem *ngFor=\"let address of addresses | filter:'isActive':true; let index = index\"\n                                  [address]=\"address\"\n                                  [selected]=\"selectedNawNr === address.nawNr\"\n                                  (editAddressClicked)=\"editAddress($event)\"\n                                  (selectedChange)=\"changeAddress($event)\"\n        ></co-relation-address-tile>\n      </co-carousel>\n    </div>\n    <div class=\"default-data-row\" *ngIf=\"!readonly\">\n      <div class=\"relation-address-new\">\n        <icon class=\"relation-address-icon\" [icon]=\"icons.ArrowPointRight\"></icon>\n        <div [textContent]=\"'ADDRESS_ADD' | localize\" (click)=\"showNewAddressDialog()\"></div>\n      </div>\n    </div>\n    <co-dialog class=\"dialog-relation-addresses-create-address\" *ngIf=\"showEditAddressDialog\"\n               [footerTemplate]=\"templateFooter\"\n               [headerTemplate]=\"templateHeader\"\n               (closeClick)=\"showEditAddressDialog = false\"\n    >\n      <co-form>\n        <co-relation-address\n          [relation]=\"relation\"\n          [(address)]=\"addressToEdit\"\n        ></co-relation-address>\n      </co-form>\n      <ng-template #templateHeader>\n        <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'NEW_ADDRESS' | localize\"></div>\n      </ng-template>\n      <ng-template #templateFooter>\n        <div class=\"co-transaction-dialog-footer-button-wrapper\">\n          <co-button [label]=\"'OK' | localize\" (click)=\"submitForm()\"></co-button>\n        </div>\n      </ng-template>\n    </co-dialog>\n  ",
                     providers: [
                         corecomponents_v12.FormMasterService
                     ],
@@ -13664,11 +14072,12 @@
         { type: corecomponents_v12.FormMasterService }
     ]; };
     RelationAddressesComponent.propDecorators = {
+        readonly: [{ type: i0.Input }],
         addresses: [{ type: i0.Input }],
+        showOnlyActive: [{ type: i0.Input }],
         type: [{ type: i0.Input }],
-        selectedAddressIdx: [{ type: i0.Input }],
-        selectedAddressChange: [{ type: i0.Output }],
-        selectedAddressNawNrChange: [{ type: i0.Output }],
+        selectedNawNr: [{ type: i0.Input }],
+        selectedNawNrChange: [{ type: i0.Output }],
         showClass: [{ type: i0.HostBinding, args: ["class.co-relation-addresses",] }]
     };
@@ -13688,7 +14097,9 @@
                         corecomponents_v12.CoDialogModule,
                         RelationAddressModule,
                         corecomponents_v12.FormModule,
-                        corecomponents_v12.ButtonModule
+                        corecomponents_v12.ButtonModule,
+                        corecomponents_v12.CarouselModule,
+                        corecomponents_v12.FilterPipeModule
                     ],
                     declarations: [
                         RelationAddressesComponent
@@ -13703,6 +14114,7 @@
         __extends(RelationContactDetailsComponent, _super);
         function RelationContactDetailsComponent() {
             var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+            _this.readonly = false;
             _this.emailAddress = new contactOption_bo.ContactOption();
             _this.phoneNumber = new contactOption_bo.ContactOption();
             _this.inviteToAccount = false;
@@ -13742,11 +14154,12 @@
     RelationContactDetailsComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-relation-contact-details",
-                    template: "\n    <div class=\"default-data-row\">\n      <co-input-text [(model)]=\"phoneNumber.value\" [placeholder]=\"'PHONE_NO' | localize \" [required]=\"true\"></co-input-text>\n    </div>\n    <div class=\"default-data-row\">\n      <co-input-text [(model)]=\"emailAddress.value\" [placeholder]=\"'EMAIL_ADDRESS' | localize \" [type]=\"'email'\" [required]=\"true\"></co-input-text>\n    </div>\n    <div class=\"default-data-row\">\n      <co-input-checkbox [label]=\"'INVITE_TO_ACCOUNT' | localize\" [(model)]=\"inviteToAccount\"></co-input-checkbox>\n    </div>\n  ",
+                    template: "\n    <div class=\"default-data-row\">\n      <co-input-text [readonly]=\"readonly\" [(model)]=\"phoneNumber.value\" [placeholder]=\"'PHONE_NO' | localize \" [required]=\"true\"></co-input-text>\n    </div>\n    <div class=\"default-data-row\">\n      <co-input-text [readonly]=\"readonly\" [(model)]=\"emailAddress.value\" [placeholder]=\"'EMAIL_ADDRESS' | localize \" [type]=\"'email'\" [required]=\"true\"></co-input-text>\n    </div>\n    <div class=\"default-data-row\">\n      <co-input-checkbox [readonly]=\"readonly\" [label]=\"'INVITE_TO_ACCOUNT' | localize\" [(model)]=\"inviteToAccount\"></co-input-checkbox>\n    </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
     RelationContactDetailsComponent.propDecorators = {
+        readonly: [{ type: i0.Input }],
         showClass: [{ type: i0.HostBinding, args: ["class.co-relation-contact-details",] }]
     };
@@ -13777,6 +14190,7 @@
         function RelationPreferencesComponent(_service) {
             var _this = _super.call(this) || this;
             _this._service = _service;
+            _this.readonly = false;
             return _this;
         }
         RelationPreferencesComponent.prototype.showClass = function () {
@@ -13830,7 +14244,7 @@
     RelationPreferencesComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-relation-preferences",
-                    template: "\n    <div class=\"two-column-grid\">\n      <ng-container *ngFor=\"let privacySetting of privacySettings\">\n        <co-input-checkbox class=\"first-column\"\n                           [label]=\"privacySetting.description\"\n                           [model]=\"isShared(privacySetting)\"\n                           (modelChange)=\"changePrivacySetting(privacySetting, $event)\"\n        ></co-input-checkbox>\n        <span class=\"second-column\" [textContent]=\"privacySetting.explanation\"></span>\n      </ng-container>\n    </div>\n    ",
+                    template: "\n    <div class=\"two-column-grid\">\n      <ng-container *ngFor=\"let privacySetting of privacySettings\">\n        <co-input-checkbox class=\"first-column\"\n                           [readonly]=\"readonly\"\n                           [label]=\"privacySetting.description\"\n                           [model]=\"isShared(privacySetting)\"\n                           (modelChange)=\"changePrivacySetting(privacySetting, $event)\"\n        ></co-input-checkbox>\n        <span class=\"second-column\" [textContent]=\"privacySetting.explanation\"></span>\n      </ng-container>\n    </div>\n    ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -13838,6 +14252,7 @@
         { type: TransactionService }
     ]; };
     RelationPreferencesComponent.propDecorators = {
+        readonly: [{ type: i0.Input }],
         showClass: [{ type: i0.HostBinding, args: ["class.co-relation-preferences",] }]
     };
@@ -14505,6 +14920,27 @@
                 });
             });
         };
+        TransactionHeaderDeliveryMethodComponent.prototype.setDeliveryType = function (method) {
+            return __awaiter(this, void 0, void 0, function () {
+                var idx, success;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            idx = this.collection.findIndex(function (d) { return d.code === method.code; });
+                            if (!method) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this.commit(method.code)];
+                        case 1:
+                            success = _a.sent();
+                            if (success) {
+                                this.selectedIdx = idx;
+                                this.deliveryMethodChange.emit(method);
+                            }
+                            _a.label = 2;
+                        case 2: return [2 /*return*/];
+                    }
+                });
+            });
+        };
         TransactionHeaderDeliveryMethodComponent.prototype.transactionInfoSet = function () {
             this.readonly = this.readonly || this.transactionInfo.deliveryDateDefinitive;
         };
@@ -14513,7 +14949,7 @@
     TransactionHeaderDeliveryMethodComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-header-delivery-method",
-                    template: "\n    <ng-container *ngIf=\"showAsCarousel\">\n      <co-carousel-3d [tileWidth]=\"200\"\n                      [tileHeight]=\"100\"\n                      [selectedIndex]=\"selectedIdx\"\n                      (indexSelected)=\"setIndexDeliveryType($event)\">\n        <co-delivery-type-tile #carouselItem *ngFor=\"let method of collection; let index = index\"\n                               [method]=\"method\"\n                               [selected]=\"selectedIdx === index\"\n        ></co-delivery-type-tile>\n      </co-carousel-3d>\n    </ng-container>\n    <ng-container *ngIf=\"!showAsCarousel\">\n      <co-transaction-line-checkbox-list\n        [collection]=\"viewModelsFiltered\"\n        [readonly]=\"readonly\"\n        (checked)=\"handleChecked($event)\"\n      ></co-transaction-line-checkbox-list>\n    </ng-container>\n  ",
+                    template: "\n    <ng-container *ngIf=\"showAsCarousel\">\n      <co-carousel>\n        <co-delivery-type-tile #carouselItem *ngFor=\"let method of collection; let index = index\"\n                               [method]=\"method\"\n                               [selected]=\"selectedIdx === index\"\n                               (selectedChange)=\"setDeliveryType($event)\"\n        ></co-delivery-type-tile>\n      </co-carousel>\n    </ng-container>\n    <ng-container *ngIf=\"!showAsCarousel\">\n      <co-transaction-line-checkbox-list\n        [collection]=\"viewModelsFiltered\"\n        [readonly]=\"readonly\"\n        (checked)=\"handleChecked($event)\"\n      ></co-transaction-line-checkbox-list>\n    </ng-container>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -14552,7 +14988,7 @@
     TransactionLineCheckboxListComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-line-checkbox-list",
-                    template: "\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" class=\"virtual-scroll-container co-transaction-small-toolbar\">\n      <div *cdkVirtualFor=\"let row of collection\" #scrollingItem class=\"virtual-scroll-item\" (click)=\"handleChecked($event, row)\">\n        <div class=\"checkbox-wrapper\">\n          <co-input-checkbox\n            [model]=\"row.checked\"\n            [readonly]=\"readonly\"\n            (modelChange)=\"handleCheckboxChecked($event, row)\"\n          ></co-input-checkbox>\n        </div>\n        <div class=\"label-wrapper\">\n          <span *ngFor=\"let label of row.propsForLabel\" [innerHTML]=\"label\" class=\"label\"></span>\n        </div>\n      </div>\n    </cdk-virtual-scroll-viewport>\n  ",
+                    template: "\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" class=\"virtual-scroll-container co-transaction-small-toolbar\">\n      <div *cdkVirtualFor=\"let row of collection\" #scrollingItem class=\"virtual-scroll-item\" (click)=\"handleChecked($event, row)\">\n        <div class=\"checkbox-wrapper\">\n          <co-input-checkbox\n            [model]=\"row.checked\"\n            [readonly]=\"readonly\"\n            (modelChange)=\"handleCheckboxChecked($event, row)\"\n          ></co-input-checkbox>\n        </div>\n        <div class=\"label-wrapper\">\n          <span *ngFor=\"let label of row.propsForLabel; let index = index\" [innerHTML]=\"label\" [class.first]=\"index === 0\" class=\"label\"></span>\n        </div>\n      </div>\n    </cdk-virtual-scroll-viewport>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -14599,7 +15035,8 @@
                         corecomponents_v12.Carousel3dModule,
                         DeliveryTypeTileModule,
                         corecomponents_v12.InputCheckboxModule,
-                        TransactionLineCheckboxModule
+                        TransactionLineCheckboxModule,
+                        corecomponents_v12.CarouselModule
                     ],
                     declarations: [
                         TransactionHeaderDeliveryMethodComponent
@@ -14734,7 +15171,7 @@
     DialogTransactionHeaderDeliveryMethodComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-dialog-transaction-header-delivery-method",
-                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-header-delivery-method\n        [autoClose]=\"autoClose\"\n        [showAsCarousel]=\"false\"\n        [useModel]=\"useModel\"\n        [transactionInfo]=\"transactionInfo\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"></co-transaction-header-delivery-method>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'DELIVERY_METHOD'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
+                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-header-delivery-method\n        [autoClose]=\"autoClose\"\n        [showAsCarousel]=\"false\"\n        [useModel]=\"useModel\"\n        [transactionInfo]=\"transactionInfo\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"></co-transaction-header-delivery-method>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'DELIVERY_METHOD'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -15835,7 +16272,7 @@
     TransactionComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction",
-                    template: "\n    <co-transaction-header *ngIf=\"showHeader\" [transaction]=\"transaction\" [relation]=\"relation\"></co-transaction-header>\n\n    <div class=\"transaction-lines-header\">\n      <co-transaction-quick-access *ngIf=\"showQuickAccess\" class=\"transaction-lines-header-item\"\n                                   [transactionType]=\"transaction.transactionInfo.transactionKind\"\n                                   [activeCategory]=\"activeCategory\"\n      ></co-transaction-quick-access>\n\n      <co-transaction-button-bar *ngIf=\"showButtonBar\" class=\"transaction-lines-header-item\"\n                                 [transactionType]=\"transaction.transactionInfo.transactionKind\"\n                                 [selectedCategory]=\"activeCategory\"\n                                 (buttonClicked)=\"handleButtonBarButtonClicked($event)\"\n      ></co-transaction-button-bar>\n\n      <co-view-mode-buttons class=\"transaction-lines-header-item\"\n                            [showViewModes]=\"[viewModes.List, viewModes.Grid, viewModes.Tiles]\" (viewModeChange)=\"activeViewMode = $event\"></co-view-mode-buttons>\n    </div>\n\n    <div class=\"transaction-tiles-wrapper\" *ngIf=\"activeViewMode === viewModes.Tiles\">\n      <co-transaction-tile\n        *ngFor=\"let transaction of transaction.transactionLines\"\n        [transactionLine]=\"transaction\"\n        (showSidePanelClicked)=\"handleShowSidePanel($event)\"\n      ></co-transaction-tile>\n    </div>\n    <div class=\"transaction-lines-wrapper\" *ngIf=\"activeViewMode === viewModes.List\">\n      <co-transaction-lines\n        [transactionInfo]=\"transaction.transactionInfo\"\n        [transactionLines]=\"transaction.transactionLines\"\n        [transactionId]=\"transactionId\"\n        [activeCategory]=\"activeCategory\"\n        (saveTransactionLine)=\"saveTransactionLine($event)\"\n      ></co-transaction-lines>\n    </div>\n    <div class=\"transaction-lines-grid-wrapper\" *ngIf=\"activeViewMode === viewModes.Grid\">\n      <co-transaction-grid\n        [transactionLines]=\"transaction.transactionLines\"\n        [transactionId]=\"transactionId\"\n        [transactionType]=\"transaction.transactionInfo.transactionKind\"\n        [activeCategory]=\"activeCategory\"\n        (sidePanelClicked)=\"handleShowSidePanel($event)\"\n      ></co-transaction-grid>\n      <!--\n            <co-transaction-order-confirmation-grid\n              *ngIf=\"activeCategory === 1\"\n              [transactionLines]=\"transaction.transactionLines\"\n              (sidePanelClicked)=\"handleShowSidePanel($event)\"\n            ></co-transaction-order-confirmation-grid>\n      -->\n    </div>\n    <div class=\"transaction-footer-wrapper\">\n      <co-transaction-totals\n        [transactionInfo]=\"transaction.transactionInfo\"\n        [transactionTotal]=\"transaction.transactionTotal\"\n        [showDiscount]=\"true\"\n      ></co-transaction-totals>\n    </div>\n  ",
+                    template: "\n    <co-transaction-header *ngIf=\"showHeader\" [transaction]=\"transaction\" [relation]=\"relation\"></co-transaction-header>\n\n    <div class=\"transaction-lines-header\">\n      <co-transaction-quick-access *ngIf=\"showQuickAccess\" class=\"transaction-lines-header-item\"\n                                   [transaction]=\"transaction\"\n                                   [activeCategory]=\"activeCategory\"\n      ></co-transaction-quick-access>\n\n      <co-transaction-button-bar *ngIf=\"showButtonBar\" class=\"transaction-lines-header-item\"\n                                 [transactionType]=\"transaction.transactionInfo.transactionKind\"\n                                 [selectedCategory]=\"activeCategory\"\n                                 (buttonClicked)=\"handleButtonBarButtonClicked($event)\"\n      ></co-transaction-button-bar>\n\n      <co-view-mode-buttons class=\"transaction-lines-header-item\"\n                            [showViewModes]=\"[viewModes.List, viewModes.Grid, viewModes.Tiles]\" (viewModeChange)=\"activeViewMode = $event\"></co-view-mode-buttons>\n    </div>\n\n    <div class=\"transaction-tiles-wrapper\" *ngIf=\"activeViewMode === viewModes.Tiles\">\n      <co-transaction-tile\n        *ngFor=\"let transaction of transaction.transactionLines\"\n        [transactionLine]=\"transaction\"\n        (showSidePanelClicked)=\"handleShowSidePanel($event)\"\n      ></co-transaction-tile>\n    </div>\n    <div class=\"transaction-lines-wrapper\" *ngIf=\"activeViewMode === viewModes.List\">\n      <co-transaction-lines\n        [transactionInfo]=\"transaction.transactionInfo\"\n        [transactionLines]=\"transaction.transactionLines\"\n        [transactionId]=\"transactionId\"\n        [activeCategory]=\"activeCategory\"\n        (saveTransactionLine)=\"saveTransactionLine($event)\"\n      ></co-transaction-lines>\n    </div>\n    <div class=\"transaction-lines-grid-wrapper\" *ngIf=\"activeViewMode === viewModes.Grid\">\n      <co-transaction-grid\n        [transactionLines]=\"transaction.transactionLines\"\n        [transactionId]=\"transactionId\"\n        [transactionType]=\"transaction.transactionInfo.transactionKind\"\n        [activeCategory]=\"activeCategory\"\n        (sidePanelClicked)=\"handleShowSidePanel($event)\"\n      ></co-transaction-grid>\n      <!--\n            <co-transaction-order-confirmation-grid\n              *ngIf=\"activeCategory === 1\"\n              [transactionLines]=\"transaction.transactionLines\"\n              (sidePanelClicked)=\"handleShowSidePanel($event)\"\n            ></co-transaction-order-confirmation-grid>\n      -->\n    </div>\n    <div class=\"transaction-footer-wrapper\">\n      <co-transaction-totals\n        [transactionInfo]=\"transaction.transactionInfo\"\n        [transactionTotal]=\"transaction.transactionTotal\"\n        [showDiscount]=\"true\"\n      ></co-transaction-totals>\n    </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -15895,10 +16332,11 @@
     var TransactionHeaderRelationComponent = /** @class */ (function (_super) {
         __extends(TransactionHeaderRelationComponent, _super);
-        function TransactionHeaderRelationComponent(service, _dictionary) {
+        function TransactionHeaderRelationComponent(service, _dictionary, _dialogService) {
             var _this = _super.call(this, service) || this;
             _this.service = service;
             _this._dictionary = _dictionary;
+            _this._dialogService = _dialogService;
             _this.addressType = addressType_enum.AddressType;
             _this.deliveryAddressIdx = 0;
             _this.invoiceAddressIdx = 0;
@@ -15906,6 +16344,7 @@
             _this.showDialog = false;
             _this.categories = [_this._dictionary.get('CLIENT_DATA'), _this._dictionary.get('PRIVACY_PREFERENCES')];
             _this.relationType = relationKind_enum.RelationKind.Customer;
+            _this.readonly = false;
             _this._relation = new customerFullObject_bo.CustomerFullObject();
             return _this;
         }
@@ -15958,6 +16397,32 @@
                 this.relation.customerGroup = this.customerGroup;
             }
         };
+        TransactionHeaderRelationComponent.prototype.handleShowDialog = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var lockResult, question;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0: return [4 /*yield*/, this.service.lockRelation(this.relation.relationType, parseInt(this.relation.relationNumber, 0))];
+                        case 1:
+                            lockResult = _a.sent();
+                            if (!!lockResult.success) return [3 /*break*/, 3];
+                            return [4 /*yield*/, this._dialogService.showYesNo("LOCKED", lockResult.messages[0].message)];
+                        case 2:
+                            question = _a.sent();
+                            if (question) {
+                                this.readonly = true;
+                                this.showDialog = true;
+                            }
+                            return [3 /*break*/, 4];
+                        case 3:
+                            this.readonly = false;
+                            this.showDialog = true;
+                            _a.label = 4;
+                        case 4: return [2 /*return*/];
+                    }
+                });
+            });
+        };
         TransactionHeaderRelationComponent.prototype.relationSet = function () {
             if (this.relationType === relationKind_enum.RelationKind.Customer) {
                 this.customerGroup = this.relation.customerGroup;
@@ -15968,7 +16433,7 @@
     TransactionHeaderRelationComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-header-relation",
-                    template: "\n    <co-transaction-header-block\n      [headerBlockTemplate]=\"headerBlock\"\n      [firstBlockTemplate]=\"firstBlock\"\n      [secondBlockTemplate]=\"secondBlock\"\n      [hasDetails]=\"true\"\n      (headerClick)=\"showDialog = true\"\n    >\n    </co-transaction-header-block>\n    <ng-template #headerBlock>\n      <div class=\"header-block-label\" [textContent]=\"relation.displayName\"></div>\n    </ng-template>\n    <ng-template #firstBlock>\n      <div class=\"header-relation-address\" [textContent]=\"relation.displayFirstAddress\"></div>\n      <div class=\"header-relation-postal\" [textContent]=\"relation.displayFirstPostal\"></div>\n    </ng-template>\n    <ng-template #secondBlock>\n      <div class=\"header-relation-email\" [textContent]=\"relation.primaryEmail\"></div>\n      <div class=\"header-relation-phone\" [textContent]=\"relation.primaryPhoneOrMobileNumber\"></div>\n    </ng-template>\n    <co-dialog class=\"transaction-header-relation-dialog\" [customCssClass]=\"'co-transaction-small-toolbar'\" *ngIf=\"showDialog\" [headerTemplate]=\"dialogHeader\" (closeClick)=\"showDialog = false\">\n      <ng-template #dialogHeader>\n        <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'CLIENT_INFORMATION' | localize\"></div>\n        <co-transaction-header-block\n          [headerBlockTemplate]=\"headerBlock\"\n          [firstBlockTemplate]=\"firstBlock\"\n          [secondBlockTemplate]=\"secondBlock\"\n        ></co-transaction-header-block>\n        <co-transaction-filter-categories [categories]=\"categories\" (categoryClick)=\"handleNavigationClick($event)\"></co-transaction-filter-categories>\n      </ng-template>\n      <div #navigationItems class=\"header-relation-navigation-wrapper\">\n        <div #mainItems class=\"header-relation-navigation-content\">\n          <div class=\"header-relation-section\">\n            <div class=\"header-relation-section-label\" [textContent]=\"'PERSONAL_DATA' | localize\"></div>\n            <co-relation-type\n              [relation]=\"relation\"\n            ></co-relation-type>\n            <ng-container *ngIf=\"relationType === relationKind.Customer\">\n                <relation-customer-groups [model]=\"customerGroup\" (modelChange)=\"handleChangeCustomGroup($event)\" required></relation-customer-groups>\n            </ng-container>\n            <co-relation-general [relation]=\"relation\" (relationChange)=\"updateRelation($event)\"></co-relation-general>\n          </div>\n          <div class=\"header-relation-section\">\n            <div class=\"header-relation-section-label\" [textContent]=\"'ADDRESSES' | localize\"></div>\n            <co-relation-addresses\n              [addresses]=\"relation.activeAddresses\"\n              [type]=\"addressType.DeliveryAddress\"\n              [selectedAddressIdx]=\"deliveryAddressIdx\"\n              (selectedAddressChange)=\"setIndexDeliveryAddress($event)\"\n            ></co-relation-addresses>\n            <div class=\"header-relation-section-label\" [textContent]=\"'INVOICE_ADDRESS' | localize\"></div>\n            <co-input-checkbox [(model)]=\"invoiceAddressSameAsDeliveryAddress\" (modelChange)=\"checkSameAddress($event)\" [label]=\"'SAME_AS_DELIVERY' | localize\"></co-input-checkbox>\n            <div class=\"overview-delivery-invoice-address\" *ngIf=\"!invoiceAddressSameAsDeliveryAddress\" @showHideInvoiceAddress>\n              <co-relation-addresses\n                [addresses]=\"relation.activeAddresses\"\n                [type]=\"addressType.BillingAddress\"\n                [selectedAddressIdx]=\"invoiceAddressIdx\"\n                (selectedAddressChange)=\"setIndexInvoiceAddress($event)\"\n              ></co-relation-addresses>\n            </div>\n          </div>\n          <div class=\"header-relation-section\">\n            <div class=\"header-relation-section-label\" [textContent]=\"'CONTACT_DETAILS' | localize\"></div>\n            <co-relation-contact-details [relation]=\"relation\"></co-relation-contact-details>\n          </div>\n        </div>\n        <div #preferenceItems class=\"header-relation-navigation-content\">\n          <co-relation-preferences [relation]=\"relation\"></co-relation-preferences>\n        </div>\n      </div>\n    </co-dialog>\n  ",
+                    template: "\n    <co-transaction-header-block\n      [headerBlockTemplate]=\"headerBlock\"\n      [firstBlockTemplate]=\"firstBlock\"\n      [secondBlockTemplate]=\"secondBlock\"\n      [hasDetails]=\"true\"\n      (headerClick)=\"handleShowDialog()\"\n    >\n    </co-transaction-header-block>\n    <ng-template #headerBlock>\n      <div class=\"header-block-label\" [textContent]=\"relation.displayName\"></div>\n    </ng-template>\n    <ng-template #firstBlock>\n      <div class=\"header-relation-address\" [textContent]=\"relation.displayFirstAddress\"></div>\n      <div class=\"header-relation-postal\" [textContent]=\"relation.displayFirstPostal\"></div>\n    </ng-template>\n    <ng-template #secondBlock>\n      <div class=\"header-relation-email\" [textContent]=\"relation.primaryEmail\"></div>\n      <div class=\"header-relation-phone\" [textContent]=\"relation.primaryPhoneOrMobileNumber\"></div>\n    </ng-template>\n    <co-dialog class=\"transaction-header-relation-dialog\" [customCssClass]=\"'co-transaction-small-toolbar'\" *ngIf=\"showDialog\" [headerTemplate]=\"dialogHeader\" (closeClick)=\"showDialog = false\">\n      <ng-template #dialogHeader>\n        <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'CLIENT_INFORMATION' | localize\"></div>\n        <co-transaction-header-block\n          [headerBlockTemplate]=\"headerBlock\"\n          [firstBlockTemplate]=\"firstBlock\"\n          [secondBlockTemplate]=\"secondBlock\"\n        ></co-transaction-header-block>\n        <co-transaction-filter-categories [categories]=\"categories\" (categoryClick)=\"handleNavigationClick($event)\"></co-transaction-filter-categories>\n      </ng-template>\n      <div #navigationItems class=\"header-relation-navigation-wrapper\">\n        <div #mainItems class=\"header-relation-navigation-content\">\n          <div class=\"header-relation-section\">\n            <div class=\"header-relation-section-label\" [textContent]=\"'PERSONAL_DATA' | localize\"></div>\n            <co-relation-type\n              [readonly]=\"readonly\"\n              [relation]=\"relation\"\n            ></co-relation-type>\n            <ng-container *ngIf=\"relationType === relationKind.Customer\">\n                <relation-customer-groups [readonly]=\"readonly\" [model]=\"customerGroup\" (modelChange)=\"handleChangeCustomGroup($event)\" required></relation-customer-groups>\n            </ng-container>\n            <co-relation-general [readonly]=\"readonly\" [relation]=\"relation\" (relationChange)=\"updateRelation($event)\"></co-relation-general>\n          </div>\n          <div class=\"header-relation-section\">\n            <div class=\"header-relation-section-label\" [textContent]=\"'ADDRESSES' | localize\"></div>\n            <co-relation-addresses\n              [readonly]=\"readonly\"\n              [addresses]=\"relation.activeAddresses\"\n              [type]=\"addressType.DeliveryAddress\"\n              [selectedNawNr]=\"deliveryAddressIdx\"\n              (selectedAddressChange)=\"setIndexDeliveryAddress($event)\"\n            ></co-relation-addresses>\n            <div class=\"header-relation-section-label\" [textContent]=\"'INVOICE_ADDRESS' | localize\"></div>\n            <co-input-checkbox [readonly]=\"readonly\" [(model)]=\"invoiceAddressSameAsDeliveryAddress\" (modelChange)=\"checkSameAddress($event)\" [label]=\"'SAME_AS_DELIVERY' | localize\"></co-input-checkbox>\n            <div class=\"overview-delivery-invoice-address\" *ngIf=\"!invoiceAddressSameAsDeliveryAddress\" @showHideInvoiceAddress>\n              <co-relation-addresses\n                [readonly]=\"readonly\"\n                [addresses]=\"relation.activeAddresses\"\n                [type]=\"addressType.BillingAddress\"\n                [selectedNawNr]=\"invoiceAddressIdx\"\n                (selectedAddressChange)=\"setIndexInvoiceAddress($event)\"\n              ></co-relation-addresses>\n            </div>\n          </div>\n          <div class=\"header-relation-section\">\n            <div class=\"header-relation-section-label\" [textContent]=\"'CONTACT_DETAILS' | localize\"></div>\n            <co-relation-contact-details [readonly]=\"readonly\" [relation]=\"relation\"></co-relation-contact-details>\n          </div>\n        </div>\n        <div #preferenceItems class=\"header-relation-navigation-content\">\n          <co-relation-preferences [readonly]=\"readonly\" [relation]=\"relation\"></co-relation-preferences>\n        </div>\n      </div>\n    </co-dialog>\n  ",
                     animations: [
                         animations.trigger("showHideInvoiceAddress", [
                             animations.state("void", animations.style({ height: 0, opacity: 0 })),
@@ -15982,7 +16447,8 @@
     ];
     TransactionHeaderRelationComponent.ctorParameters = function () { return [
         { type: TransactionService },
-        { type: DictionaryService }
+        { type: DictionaryService },
+        { type: DialogService }
     ]; };
     TransactionHeaderRelationComponent.propDecorators = {
         navigationItems: [{ type: i0.ViewChild, args: ['navigationItems', { read: i0.ElementRef },] }],
@@ -16175,7 +16641,7 @@
     TransactionHeaderPaymentComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-header-payment",
-                    template: "\n    <co-transaction-header-block\n      [headerBlockTemplate]=\"headerBlock\"\n      [firstBlockTemplate]=\"firstBlock\"\n      [secondBlockTemplate]=\"secondBlock\"\n      [hasDetails]=\"true\"\n      (headerClick)=\"showDialog = true\"\n    >\n    </co-transaction-header-block>\n    <ng-template #headerBlock>\n      <div class=\"header-block-label\" [textContent]=\"'BALANCE' | localize\"></div>\n      <div class=\"header-block-balance\" *ngIf=\"transactionInfo.transactionKind !== transactionKind.PurchaseOrder\" (click)=\"openPayment($event)\">\n        <co-icon class=\"payment-icon\" [iconData]=\"iconService.getIcon(icons.CreditCardSolid)\"></co-icon>\n        <div class=\"payment-payed-wrapper\">\n          <ng-container *ngIf=\"toPay === paid\">\n            <span class=\"payment-paid\" [textContent]=\"paid | priceDisplay\"></span>\n          </ng-container>\n          <ng-container *ngIf=\"toPay !== paid\">\n            <span class=\"payment-paid\" [textContent]=\"paid | priceDisplay\"></span>\n            <span class=\"payment-divider\" [textContent]=\"'/'\"></span>\n            <span class=\"payment-to-pay\" [textContent]=\"toPay | priceDisplay\"></span>\n          </ng-container>\n        </div>\n      </div>\n    </ng-template>\n    <ng-template #firstBlock>\n      <div class=\"header-downpayment-label co-transaction-label\" [textContent]=\"'DOWNPAYMENT_PERCENTAGE' | localize\"></div>\n      <co-transaction-header-downpayment-percentage class=\"transaction-header-downpayment\"\n                                                    [transactionInfo]=\"transactionInfo\"\n                                                    [defaultEditMode]=\"false\"\n                                                    [showLabel]=\"false\"\n      ></co-transaction-header-downpayment-percentage>\n    </ng-template>\n    <ng-template #secondBlock>\n      <div class=\"header-downpayment-label co-transaction-label\" [textContent]=\"'DOWNPAYMENT_AMOUNT' | localize\"></div>\n      <co-transaction-header-downpayment-amount class=\"transaction-header-downpayment\"\n                                                [transactionInfo]=\"transactionInfo\"\n                                                [defaultEditMode]=\"false\"\n                                                [showLabel]=\"false\"\n      ></co-transaction-header-downpayment-amount>\n    </ng-template>\n    <co-dialog class=\"transaction-header-payment-dialog\" [headerTemplate]=\"headerTemplate\" *ngIf=\"showDialog\" (closeClick)=\"showDialog = false\">\n      <ng-template #headerTemplate>\n        <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'PAYMENT_INFORMATION' | localize\"></div>\n        <co-transaction-header-block\n          [headerBlockTemplate]=\"headerBlock\"\n          [firstBlockTemplate]=\"firstBlock\"\n          [secondBlockTemplate]=\"secondBlock\"\n        >\n        </co-transaction-header-block>\n      </ng-template>\n      <div class=\"payment-dialog-section\">\n        <span [textContent]=\"'NOG_NIET_GEIMPLEMENTEERD'\"></span>\n      </div>\n      <div class=\"payment-dialog-section\">\n        <span [textContent]=\"'NOG_NIET_GEIMPLEMENTEERD'\"></span>\n      </div>\n    </co-dialog>\n    <co-dialog class=\"payment-dialog\" *ngIf=\"showPaymentDialog\"\n               [modal]=\"true\"\n               (closeClick)=\"showPaymentDialog = false\"\n    >\n      <co-payment\n        [transactionUuid]=\"transactionInfo.uuid\"\n        [amount]=\"transactionTotal.netAmount\"\n        [currencyId]=\"transactionInfo.currencyId\"\n      ></co-payment>\n    </co-dialog>\n  ",
+                    template: "\n    <co-transaction-header-block\n      [headerBlockTemplate]=\"headerBlock\"\n      [firstBlockTemplate]=\"firstBlock\"\n      [secondBlockTemplate]=\"secondBlock\"\n      [hasDetails]=\"true\"\n      (headerClick)=\"showDialog = true\"\n    >\n    </co-transaction-header-block>\n    <ng-template #headerBlock>\n      <div class=\"header-block-label\" [textContent]=\"'BALANCE' | localize\"></div>\n      <div class=\"header-block-balance\" *ngIf=\"transactionInfo.transactionKind !== transactionKind.PurchaseOrder\" (click)=\"openPayment($event)\">\n        <co-icon class=\"payment-icon\" [iconData]=\"iconService.getIcon(icons.CreditCardSolid)\"></co-icon>\n        <div class=\"payment-payed-wrapper\">\n          <span class=\"payment-to-pay\" [textContent]=\"toPay | priceDisplay\"></span>\n          <span class=\"payment-divider\" [textContent]=\"'/'\"></span>\n          <span class=\"payment-paid\" [class.success]=\"paid >= toPay\" [textContent]=\"paid | priceDisplay\"></span>\n        </div>\n      </div>\n    </ng-template>\n    <ng-template #firstBlock>\n      <div class=\"header-downpayment-label co-transaction-label\" [textContent]=\"'DOWNPAYMENT_PERCENTAGE' | localize\"></div>\n      <co-transaction-header-downpayment-percentage class=\"transaction-header-downpayment\"\n                                                    [transactionInfo]=\"transactionInfo\"\n                                                    [defaultEditMode]=\"false\"\n                                                    [showLabel]=\"false\"\n      ></co-transaction-header-downpayment-percentage>\n    </ng-template>\n    <ng-template #secondBlock>\n      <div class=\"header-downpayment-label co-transaction-label\" [textContent]=\"'DOWNPAYMENT_AMOUNT' | localize\"></div>\n      <co-transaction-header-downpayment-amount class=\"transaction-header-downpayment\"\n                                                [transactionInfo]=\"transactionInfo\"\n                                                [defaultEditMode]=\"false\"\n                                                [showLabel]=\"false\"\n      ></co-transaction-header-downpayment-amount>\n    </ng-template>\n    <co-dialog class=\"transaction-header-payment-dialog\" [headerTemplate]=\"headerTemplate\" *ngIf=\"showDialog\" (closeClick)=\"showDialog = false\">\n      <ng-template #headerTemplate>\n        <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'PAYMENT_INFORMATION' | localize\"></div>\n        <co-transaction-header-block\n          [headerBlockTemplate]=\"headerBlock\"\n          [firstBlockTemplate]=\"firstBlock\"\n          [secondBlockTemplate]=\"secondBlock\"\n        >\n        </co-transaction-header-block>\n      </ng-template>\n      <div class=\"payment-dialog-section\">\n        <span [textContent]=\"'NOG_NIET_GEIMPLEMENTEERD'\"></span>\n      </div>\n      <div class=\"payment-dialog-section\">\n        <span [textContent]=\"'NOG_NIET_GEIMPLEMENTEERD'\"></span>\n      </div>\n    </co-dialog>\n    <co-dialog class=\"payment-dialog\" *ngIf=\"showPaymentDialog\"\n               [modal]=\"true\"\n               (closeClick)=\"showPaymentDialog = false\"\n    >\n      <co-payment\n        [transactionUuid]=\"transactionInfo.uuid\"\n        [amount]=\"transactionTotal.netAmount\"\n        [currencyId]=\"transactionInfo.currencyId\"\n      ></co-payment>\n    </co-dialog>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -16653,6 +17119,135 @@
                 },] }
     ];
+    var TransactionFilterPopupBaseComponent = /** @class */ (function (_super) {
+        __extends(TransactionFilterPopupBaseComponent, _super);
+        function TransactionFilterPopupBaseComponent() {
+            var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+            _this.autoClose = false;
+            _this.useModel = true;
+            _this.valueChange = new i0.EventEmitter();
+            _this.closeAfterCommit = new i0.EventEmitter();
+            _this.viewModels = [];
+            _this.viewModelsFiltered = [];
+            _this.propsForLabel = [];
+            _this._collection = [];
+            return _this;
+        }
+        Object.defineProperty(TransactionFilterPopupBaseComponent.prototype, "searchText", {
+            get: function () {
+                return this._searchText;
+            },
+            set: function (value) {
+                if (value !== undefined && value !== null) {
+                    this._searchText = value;
+                    this._doSearch();
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TransactionFilterPopupBaseComponent.prototype, "collection", {
+            get: function () {
+                return this._collection;
+            },
+            set: function (value) {
+                this._collection = value;
+                this.prepareViewModels();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        TransactionFilterPopupBaseComponent.prototype.commit = function (value) {
+            return Promise.resolve(true);
+        };
+        TransactionFilterPopupBaseComponent.prototype.handleChecked = function (row) {
+            return __awaiter(this, void 0, void 0, function () {
+                var currentModel, i;
+                return __generator(this, function (_a) {
+                    switch (_a.label) {
+                        case 0:
+                            row.checked = true;
+                            currentModel = this.viewModels.find(function (v) { return v.value === row.value; });
+                            if (currentModel) {
+                                currentModel.checked = true;
+                            }
+                            for (i = 0; i < this.viewModels.length; i++) {
+                                if (this.viewModels[i].value !== row.value) {
+                                    this.viewModels[i].checked = false;
+                                }
+                            }
+                            if (!this.useModel) return [3 /*break*/, 4];
+                            if (!this.autoClose) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this.commit(row.value)];
+                        case 1:
+                            if (_a.sent()) {
+                                this.closeAfterCommit.emit();
+                            }
+                            return [3 /*break*/, 3];
+                        case 2:
+                            this.commit(row.value);
+                            _a.label = 3;
+                        case 3: return [3 /*break*/, 5];
+                        case 4:
+                            this.valueChange.emit(row.value);
+                            _a.label = 5;
+                        case 5: return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        TransactionFilterPopupBaseComponent.prototype.prepareViewModels = function () {
+            var _this = this;
+            this.collection.forEach(function (d, index) {
+                var labels = _this.propsForLabel.map(function (p) { return d[p]; });
+                _this.viewModels.push({
+                    value: d[_this.codeField],
+                    propsForLabel: labels,
+                    checked: (_this.useModel && _this.model && _this.checkField) ?
+                        _this.model[_this.checkField] === d[_this.codeField] :
+                        (_this.value ? _this.value === d[_this.codeField] : index === 0)
+                });
+            });
+            this.viewModelsFiltered = this.viewModels.slice();
+            if (!this.useModel && this.viewModels.length > 0) {
+                this.valueChange.next(this.value ? this.value : this.viewModels[0].value);
+            }
+        };
+        TransactionFilterPopupBaseComponent.prototype._doSearch = function () {
+            var _this = this;
+            this.viewModelsFiltered = JSON.parse(JSON.stringify(this.viewModels));
+            if (this.searchText) {
+                this.viewModelsFiltered = this.viewModelsFiltered.filter(function (vmf) {
+                    return vmf.propsForLabel.find(function (p) { return p && p.toString().match(new RegExp(_this.searchText, 'gi')); });
+                });
+                // if (!this.searchText) {
+                //   this.viewModelsFiltered = this.viewModels.slice();
+                // } else {
+                // this.viewModelsFiltered = JSON.parse(JSON.stringify(this.viewModels));
+                // for (let i = 0; i < this.viewModelsFiltered.length; i++) {
+                //   const vmf = this.viewModelsFiltered[i];
+                //   for (let j = 0; j < vmf.propsForLabel.length; j++) {
+                //     if (vmf.propsForLabel[j]) {
+                //       vmf.propsForLabel[j] = vmf.propsForLabel[j].replace(new RegExp(this.searchText, 'gi'), `<span class="highlight">${this.searchText}</span>`);
+                //     }
+                //   }
+                // }
+            }
+        };
+        return TransactionFilterPopupBaseComponent;
+    }(TransactionLineBaseComponent));
+    TransactionFilterPopupBaseComponent.decorators = [
+        { type: i0.Directive }
+    ];
+    TransactionFilterPopupBaseComponent.propDecorators = {
+        autoClose: [{ type: i0.Input }],
+        useModel: [{ type: i0.Input }],
+        searchText: [{ type: i0.Input }],
+        value: [{ type: i0.Input }],
+        valueChange: [{ type: i0.Output }],
+        closeAfterCommit: [{ type: i0.Output }]
+    };
     var TransactionLineVatComponent = /** @class */ (function (_super) {
         __extends(TransactionLineVatComponent, _super);
         function TransactionLineVatComponent(_transactionService) {
@@ -16691,7 +17286,7 @@
             });
         };
         return TransactionLineVatComponent;
-    }(TransactionLineBaseComponent));
+    }(TransactionFilterPopupBaseComponent));
     TransactionLineVatComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-line-vat",
@@ -16768,7 +17363,7 @@
             this.readonly = this.readonly || !this.transactionInfo.transactionDefinitive;
         };
         return TransactionLinePriceListComponent;
-    }(TransactionLineBaseComponent));
+    }(TransactionFilterPopupBaseComponent));
     TransactionLinePriceListComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-line-price-list",
@@ -16844,7 +17439,7 @@
             this.readonly = this.readonly || !this.transactionInfo.transactionDefinitive;
         };
         return TransactionLineDeliveryMethodComponent;
-    }(TransactionLineBaseComponent));
+    }(TransactionFilterPopupBaseComponent));
     TransactionLineDeliveryMethodComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-line-delivery-method",
@@ -17109,7 +17704,7 @@
             this.readonly = this.readonly || this.transactionInfo.transactionDefinitive;
         };
         return TransactionLineCommissionCodeComponent;
-    }(TransactionLineBaseComponent));
+    }(TransactionFilterPopupBaseComponent));
     TransactionLineCommissionCodeComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-line-commission-code",
@@ -17182,7 +17777,7 @@
             });
         };
         return TransactionLineWarehouseComponent;
-    }(TransactionLineBaseComponent));
+    }(TransactionFilterPopupBaseComponent));
     TransactionLineWarehouseComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-line-warehouse",
@@ -17451,7 +18046,9 @@
         function TransactionLineSupplierComponent(_transactionService) {
             var _this = _super.call(this) || this;
             _this._transactionService = _transactionService;
-            _this.fields = { text: "displayName", value: "relationId" };
+            _this.codeField = 'relationId';
+            _this.checkField = 'supplierId';
+            _this.propsForLabel = ['relationNr', 'displayName'];
             return _this;
         }
         TransactionLineSupplierComponent.prototype.ngOnInit = function () {
@@ -17462,18 +18059,23 @@
                 _this.collection = relationListObjects;
             });
         };
-        TransactionLineSupplierComponent.prototype.commit = function (code) {
+        TransactionLineSupplierComponent.prototype.commit = function (id) {
             return __awaiter(this, void 0, void 0, function () {
+                var oldId, success;
                 return __generator(this, function (_a) {
-                    // if (this.transactionLine.supplier !== code) {
-                    //   const oldCode = this.transactionLine.supplier;
-                    //   const success = await this._transactionService.updateSupplierTransactionLine(this._transactionService.currentTransaction.transactionInfo.uuid, this.transactionLine.uuid, code);
-                    //   if (!success) {
-                    //     // this.transactionLine.supplier = code;
-                    //   }
-                    //   return success;
-                    // }
-                    return [2 /*return*/, true];
+                    switch (_a.label) {
+                        case 0:
+                            if (!(this.transactionLine.supplierId !== id)) return [3 /*break*/, 2];
+                            oldId = this.transactionLine.supplierId;
+                            return [4 /*yield*/, this._transactionService.updateSupplierTransactionLine(this._transactionService.currentTransaction.transactionInfo.uuid, this.transactionLine.uuid, id)];
+                        case 1:
+                            success = _a.sent();
+                            if (!success) {
+                                this.transactionLine.supplierId = oldId;
+                            }
+                            return [2 /*return*/, success];
+                        case 2: return [2 /*return*/];
+                    }
                 });
             });
         };
@@ -17481,11 +18083,11 @@
             this.readonly = this.readonly || !this.transactionLine.articleFreeSupplier;
         };
         return TransactionLineSupplierComponent;
-    }(TransactionLineBaseComponent));
+    }(TransactionFilterPopupBaseComponent));
     TransactionLineSupplierComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-line-supplier",
-                    template: "\n    <co-input-combo-box\n      [collection]=\"collection\"\n      [placeholder]=\"'SUPPLIER' | localize\"\n      [fields]=\"fields\"\n      [readonly]=\"readonly\"\n      [model]=\"tempSupplier\"\n      (modelChange)=\"commit($event)\"\n    ></co-input-combo-box>\n  ",
+                    template: "\n    <co-transaction-line-checkbox-list\n      [collection]=\"viewModelsFiltered\"\n      [readonly]=\"readonly\"\n      (checked)=\"handleChecked($event)\"\n    ></co-transaction-line-checkbox-list>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -17503,7 +18105,8 @@
                     imports: [
                         common.CommonModule,
                         PipeModule,
-                        corecomponents_v12.InputComboBoxModule
+                        corecomponents_v12.InputComboBoxModule,
+                        TransactionLineCheckboxModule
                     ],
                     declarations: [
                         TransactionLineSupplierComponent
@@ -17986,43 +18589,136 @@
     TransactionButtonBarComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-button-bar",
-                    template: "\n    <div class=\"button-bar-wrapper\">\n      <co-transaction-button-bar-button *ngFor=\"let button of buttons; let index = index\"\n                                        [class.selected]=\"selectedCategory === button.category\"\n                                        [title]=\"button.title\"\n                                        [iconName]=\"button.icon\"\n                                        (click)=\"selectCategory(index)\"\n      ></co-transaction-button-bar-button>\n    </div>\n  ",
+                    template: "\n    <div class=\"button-bar-wrapper\">\n      <co-transaction-button-bar-button *ngFor=\"let button of buttons; let index = index\"\n                                        [transactionInfoResponse]=\"transactionInfoResponse\"\n                                        [component]=\"button.component\"\n                                        [class.selected]=\"selectedCategory === button.category\"\n                                        [title]=\"button.title\"\n                                        [iconName]=\"button.icon\"\n                                        (click)=\"selectCategory(index)\"\n      ></co-transaction-button-bar-button>\n    </div>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    TransactionButtonBarComponent.ctorParameters = function () { return [
+        { type: TransactionMappingService }
+    ]; };
+    TransactionButtonBarComponent.propDecorators = {
+        transactionType: [{ type: i0.Input }],
+        transactionInfoResponse: [{ type: i0.Input }],
+        selectedCategory: [{ type: i0.Input }],
+        buttonClicked: [{ type: i0.Output }],
+        showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-button-bar",] }]
+    };
+    var TransactionButtonBarButtonComponent = /** @class */ (function (_super) {
+        __extends(TransactionButtonBarButtonComponent, _super);
+        function TransactionButtonBarButtonComponent(iconCacheService, _compFactoryResolver, appRef, injector) {
+            var _this = _super.call(this) || this;
+            _this.iconCacheService = iconCacheService;
+            _this._compFactoryResolver = _compFactoryResolver;
+            _this.appRef = appRef;
+            _this.injector = injector;
+            _this.showClass = true;
+            _this.useComponent = false;
+            return _this;
+        }
+        Object.defineProperty(TransactionButtonBarButtonComponent.prototype, "child", {
+            set: function (content) {
+                this.buttonWrapper = content;
+                this._checkAndCreateComponent();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(TransactionButtonBarButtonComponent.prototype, "isLoaderShowing", {
+            get: function () {
+                return this.showLoader;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        TransactionButtonBarButtonComponent.prototype.ngOnInit = function () {
+            this._checkAndCreateComponent();
+        };
+        TransactionButtonBarButtonComponent.prototype._checkAndCreateComponent = function () {
+            var _this = this;
+            if (this.component && this.buttonWrapper && this.buttonWrapper.nativeElement) {
+                this.useComponent = true;
+                var componentRef_1 = this._compFactoryResolver.resolveComponentFactory(this.component).create(this.injector);
+                componentRef_1.instance.transactionInfoResponse = this.transactionInfoResponse;
+                componentRef_1.instance.iconName = this.iconName;
+                componentRef_1.instance.title = this.title;
+                componentRef_1.instance.showLoader = this.showLoader;
+                componentRef_1.instance.checked = this.checked;
+                componentRef_1.instance.showLoaderChange.subscribe(function (value) { return _this.showLoader = value; });
+                componentRef_1.instance.checkedChange.subscribe(function (value) { return _this.checked = value; });
+                this.appRef.attachView(componentRef_1.hostView);
+                var domElem = componentRef_1.hostView
+                    .rootNodes[0];
+                this.buttonWrapper.nativeElement.appendChild(domElem);
+                componentRef_1.onDestroy(function () {
+                    _this.appRef.detachView(componentRef_1.hostView);
+                });
+            }
+        };
+        return TransactionButtonBarButtonComponent;
+    }(TransactionButtonBarButtonBaseComponent));
+    TransactionButtonBarButtonComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-transaction-button-bar-button",
+                    template: "\n    <co-loader *ngIf=\"showLoader\"></co-loader>\n    <div class=\"button-wrapper\" #buttonWrapper>\n      <co-animated-checkbox [checked]=\"checked\"></co-animated-checkbox>\n      <ng-container *ngIf=\"!useComponent\">\n        <co-icon class=\"co-transaction-button-bar-icon\" [iconData]=\"iconCacheService.getIcon(iconName)\"></co-icon>\n        <span class=\"button-title\" [textContent]=\"title | localize\"></span>\n      </ng-container>\n    </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
-    TransactionButtonBarComponent.ctorParameters = function () { return [
-        { type: TransactionMappingService }
+    TransactionButtonBarButtonComponent.ctorParameters = function () { return [
+        { type: IconCacheService },
+        { type: i0.ComponentFactoryResolver },
+        { type: i0.ApplicationRef },
+        { type: i0.Injector }
     ]; };
-    TransactionButtonBarComponent.propDecorators = {
-        transactionType: [{ type: i0.Input }],
-        selectedCategory: [{ type: i0.Input }],
-        buttonClicked: [{ type: i0.Output }],
-        showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-button-bar",] }]
+    TransactionButtonBarButtonComponent.propDecorators = {
+        child: [{ type: i0.ViewChild, args: ["buttonWrapper", { read: i0.ElementRef },] }],
+        component: [{ type: i0.Input }],
+        showClass: [{ type: i0.HostBinding, args: ['class.co-transaction-button-bar-button',] }],
+        isLoaderShowing: [{ type: i0.HostBinding, args: ['class.show-loader',] }]
     };
-    var TransactionButtonBarButtonComponent = /** @class */ (function () {
-        function TransactionButtonBarButtonComponent(iconCacheService) {
-            this.iconCacheService = iconCacheService;
-            this.showClass = true;
+    var AnimatedCheckboxComponent = /** @class */ (function () {
+        function AnimatedCheckboxComponent() {
+            this.checked = false;
         }
-        return TransactionButtonBarButtonComponent;
+        AnimatedCheckboxComponent.prototype.showClass = function () {
+            return true;
+        };
+        return AnimatedCheckboxComponent;
     }());
-    TransactionButtonBarButtonComponent.decorators = [
+    AnimatedCheckboxComponent.decorators = [
         { type: i0.Component, args: [{
-                    selector: "co-transaction-button-bar-button",
-                    template: "\n    <div class=\"button-wrapper\">\n      <co-icon class=\"co-transaction-button-bar-icon\" [iconData]=\"iconCacheService.getIcon(iconName)\"></co-icon>\n      <span class=\"button-title\" [textContent]=\"title | localize\"></span>\n    </div>\n  ",
+                    selector: "co-animated-checkbox",
+                    template: "\n    <div class=\"checkbox\">\n      <div class=\"checkmark\" [class.show]=\"checked\"></div>\n    </div>\n    <div class=\"label\" *ngIf=\"label\" [textContent]=\"label | localize\"></div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
-    TransactionButtonBarButtonComponent.ctorParameters = function () { return [
-        { type: IconCacheService }
-    ]; };
-    TransactionButtonBarButtonComponent.propDecorators = {
-        title: [{ type: i0.Input }],
-        iconName: [{ type: i0.Input }],
-        showClass: [{ type: i0.HostBinding, args: ['class.co-transaction-button-bar-button',] }]
+    AnimatedCheckboxComponent.propDecorators = {
+        checked: [{ type: i0.Input }],
+        label: [{ type: i0.Input }],
+        showClass: [{ type: i0.HostBinding, args: ["class.co-animated-checkbox",] }]
     };
+    var AnimatedCheckboxModule = /** @class */ (function () {
+        function AnimatedCheckboxModule() {
+        }
+        return AnimatedCheckboxModule;
+    }());
+    AnimatedCheckboxModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        PipeModule
+                    ],
+                    declarations: [
+                        AnimatedCheckboxComponent
+                    ],
+                    exports: [
+                        AnimatedCheckboxComponent
+                    ]
+                },] }
+    ];
     var TransactionButtonBarModule = /** @class */ (function () {
         function TransactionButtonBarModule() {
         }
@@ -18035,14 +18731,18 @@
                         CoreModule,
                         corecomponents_v12.IconModule,
                         PipeModule,
+                        LoaderModule,
+                        AnimatedCheckboxModule,
                     ],
                     declarations: [
                         TransactionButtonBarComponent,
-                        TransactionButtonBarButtonComponent
+                        TransactionButtonBarButtonComponent,
+                        TransactionSalesPurchaseButtonBarButtonComponent
                     ],
                     exports: [
                         TransactionButtonBarComponent,
-                        TransactionButtonBarButtonComponent
+                        TransactionButtonBarButtonComponent,
+                        TransactionSalesPurchaseButtonBarButtonComponent
                     ]
                 },] }
     ];
@@ -18689,7 +19389,7 @@
     DialogTransactionLineDeliveryMethodComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-dialog-transaction-line-delivery-method",
-                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-delivery-method\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionInfo]=\"transactionInfo\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"></co-transaction-line-delivery-method>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'DELIVERY_METHOD'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
+                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-delivery-method\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionInfo]=\"transactionInfo\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"></co-transaction-line-delivery-method>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'DELIVERY_METHOD'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -18734,7 +19434,7 @@
     DialogTransactionLineVatComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-dialog-transaction-line-vat",
-                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-vat\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"\n      ></co-transaction-line-vat>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'VAT'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n    ",
+                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-vat\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"\n      ></co-transaction-line-vat>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'VAT'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n    ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -18806,7 +19506,7 @@
     DialogTransactionLineDiscountComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-dialog-transaction-line-discount",
-                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <div class=\"transaction-line-discount-wrapper co-transaction-small-toolbar\">\n        <div class=\"two-column-grid\">\n          <co-transaction-line-line-discount [transactionLine]=\"transactionLine\"></co-transaction-line-line-discount>\n          <co-transaction-line-discount-amount [transactionLine]=\"transactionLine\"></co-transaction-line-discount-amount>\n        </div>\n        <div class=\"two-column-grid\">\n          <co-transaction-line-special-discount [transactionLine]=\"transactionLine\"></co-transaction-line-special-discount>\n          <co-transaction-line-quantum-discount [transactionLine]=\"transactionLine\"></co-transaction-line-quantum-discount>\n        </div>\n        <div class=\"two-column-grid\">\n          <co-input-text [placeholder]=\"'SURCHARGE_AMOUNT' | localize\" [model]=\"transactionLine.surchargeAmount\" [readonly]=\"readonly\"></co-input-text>\n          <co-input-text [placeholder]=\"'BUSINESS_RULE_DISCOUNT' | localize\" [model]=\"'NIET_GEIMPLEMENTEERD'\" [readonly]=\"readonly\"></co-input-text>\n        </div>\n        <div class=\"transaction-line-discount-overview\">\n          <div class=\"transaction-line-discount-overview-item\">\n            <div class=\"title\" [textContent]=\"'TRANSACTION_DISCOUNT' | localize\"></div>\n            <div class=\"value\" [class.transaction-negative-value]=\"transactionLine.discountAmount < 0\" [textContent]=\"transactionLine.discountAmount | coCurrency\"></div>\n          </div>\n          <div class=\"transaction-line-discount-overview-item\">\n            <div class=\"title\" [textContent]=\"'BUSINESS_RULE_DISCOUNT' | localize\"></div>\n            <div class=\"value\" [textContent]=\"'NIET_GEIMPLEMENTEERD'\"></div>\n          </div>\n          <div class=\"transaction-line-discount-overview-item\">\n            <div class=\"title\" [textContent]=\"'QUANTUM_DISCOUNT' | localize\"></div>\n            <div class=\"value\" [class.transaction-negative-value]=\"transactionLine.quantumDiscount < 0\" [textContent]=\"transactionLine.quantumDiscount | coCurrency\"></div>\n          </div>\n          <div class=\"transaction-line-discount-overview-item\">\n            <div class=\"title\" [textContent]=\"'SURCHARGE_AMOUNT' | localize\"></div>\n            <div class=\"value\" [class.transaction-negative-value]=\"transactionLine.surchargeAmount < 0\" [textContent]=\"transactionLine.surchargeAmount | coCurrency\"></div>\n          </div>\n          <div class=\"transaction-line-discount-overview-item total\">\n            <div class=\"title\" [textContent]=\"'TOTAL_LINE_DISCOUNT' | localize\"></div>\n            <div class=\"value\" [class.transaction-negative-value]=\"transactionLine.lineTotalDiscountAmount < 0\" [textContent]=\"transactionLine.lineTotalDiscountAmount | coCurrency\"></div>\n          </div>\n        </div>\n      </div>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'DISCOUNT_PRICE_INFORMATION' | localize\"></div>\n      <div class=\"transaction-line-button big\" (click)=\"openThePriceListDialog()\">\n        <span class=\"co-transaction-overflow-ellipsis\" [textContent]=\"transactionLine.priceListDescription\"></span>\n      </div>\n    </ng-template>\n    <co-dialog-transaction-line-price-list *ngIf=\"showPriceListDialog\"\n        [transactionLine]=\"transactionLine\"\n        (close)=\"showPriceListDialog = false\"\n    ></co-dialog-transaction-line-price-list>\n  ",
+                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <div class=\"transaction-line-discount-wrapper co-transaction-small-toolbar\">\n        <div class=\"two-column-grid\">\n          <co-transaction-line-line-discount [transactionLine]=\"transactionLine\"></co-transaction-line-line-discount>\n          <co-transaction-line-discount-amount [transactionLine]=\"transactionLine\"></co-transaction-line-discount-amount>\n        </div>\n        <div class=\"two-column-grid\">\n          <co-transaction-line-special-discount [transactionLine]=\"transactionLine\"></co-transaction-line-special-discount>\n          <co-transaction-line-quantum-discount [transactionLine]=\"transactionLine\"></co-transaction-line-quantum-discount>\n        </div>\n        <div class=\"transaction-line-discount-overview\">\n          <div class=\"transaction-line-discount-overview-item\">\n            <div class=\"title\" [textContent]=\"'TRANSACTION_DISCOUNT' | localize\"></div>\n            <div class=\"value\" [class.transaction-negative-value]=\"transactionLine.discountAmount < 0\" [textContent]=\"transactionLine.discountAmount | coCurrency\"></div>\n          </div>\n          <div class=\"transaction-line-discount-overview-item\">\n            <div class=\"title\" [textContent]=\"'BUSINESS_RULE_DISCOUNT' | localize\"></div>\n            <div class=\"value\" [class.transaction-negative-value]=\"transactionLine.transBusinessRuleDiscount < 0\" [textContent]=\"transactionLine.transBusinessRuleDiscount | coCurrency\"></div>\n          </div>\n          <div class=\"transaction-line-discount-overview-item\">\n            <div class=\"title\" [textContent]=\"'QUANTUM_DISCOUNT' | localize\"></div>\n            <div class=\"value\" [class.transaction-negative-value]=\"transactionLine.quantumDiscount < 0\" [textContent]=\"transactionLine.quantumDiscount | coCurrency\"></div>\n          </div>\n          <div class=\"transaction-line-discount-overview-item\">\n            <div class=\"title\" [textContent]=\"'SURCHARGE_AMOUNT' | localize\"></div>\n            <div class=\"value\" [class.transaction-negative-value]=\"transactionLine.surchargeAmount < 0\" [textContent]=\"transactionLine.surchargeAmount | coCurrency\"></div>\n          </div>\n          <div class=\"transaction-line-discount-overview-item total\">\n            <div class=\"title\" [textContent]=\"'TOTAL_LINE_DISCOUNT' | localize\"></div>\n            <div class=\"value\" [class.transaction-negative-value]=\"transactionLine.lineTotalDiscountAmount < 0\" [textContent]=\"transactionLine.lineTotalDiscountAmount | coCurrency\"></div>\n          </div>\n        </div>\n      </div>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <div class=\"co-transaction-dialog-header-title\" [textContent]=\"'DISCOUNT_PRICE_INFORMATION' | localize\"></div>\n      <div class=\"transaction-line-button full-width\" (click)=\"openThePriceListDialog()\">\n        <span class=\"co-transaction-overflow-ellipsis\" [textContent]=\"transactionLine.priceListDescription\"></span>\n      </div>\n    </ng-template>\n    <co-dialog-transaction-line-price-list *ngIf=\"showPriceListDialog\"\n        [transactionLine]=\"transactionLine\"\n        (close)=\"showPriceListDialog = false\"\n    ></co-dialog-transaction-line-price-list>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -18831,7 +19531,7 @@
     DialogTransactionLinePriceListComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-dialog-transaction-line-price-list",
-                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-price-list\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"></co-transaction-line-price-list>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'PRICE_LIST'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
+                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-price-list\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [transactionLine]=\"transactionLine\"\n        [searchText]=\"searchText\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"></co-transaction-line-price-list>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'PRICE_LIST'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -19057,12 +19757,13 @@
             this.appRef = appRef;
             this.injector = injector;
         }
-        Object.defineProperty(TransactionQuickAccessComponent.prototype, "transactionType", {
+        Object.defineProperty(TransactionQuickAccessComponent.prototype, "transaction", {
             get: function () {
-                return this._transactionType;
+                return this._transaction;
             },
             set: function (value) {
-                this._transactionType = value;
+                this._transaction = value;
+                this.transactionType = this._transaction.transactionInfo ? this._transaction.transactionInfo.transactionKind : transactionKind_enum.TransactionKind.SalesOrder;
                 this._prepareContent();
             },
             enumerable: false,
@@ -19084,7 +19785,7 @@
         };
         TransactionQuickAccessComponent.prototype._prepareContent = function () {
             var _this = this;
-            if (!this._transactionType || !this._activeCategory || !this.quickAccessContainer) {
+            if (!this.transactionType || !this._activeCategory || !this.quickAccessContainer) {
                 return;
             }
             var componentClass = this._mappingService.getQuickAccessComponent(this.transactionType, this.activeCategory);
@@ -19097,6 +19798,7 @@
             this._componentRef = this._compFactoryResolver
                 .resolveComponentFactory(componentClass)
                 .create(this.injector);
+            this._componentRef.instance.transaction = this.transaction;
             this.appRef.attachView(this._componentRef.hostView);
             var domElem = this._componentRef.hostView
                 .rootNodes[0];
@@ -19122,7 +19824,7 @@
     ]; };
     TransactionQuickAccessComponent.propDecorators = {
         quickAccessContainer: [{ type: i0.ViewChild, args: ['quickAccessContent', { read: i0.ElementRef },] }],
-        transactionType: [{ type: i0.Input }],
+        transaction: [{ type: i0.Input }],
         activeCategory: [{ type: i0.Input }],
         showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-quick-access",] }]
     };
@@ -19196,6 +19898,82 @@
                 },] }
     ];
+    var TransactionSendButtonDialogComponent = /** @class */ (function () {
+        function TransactionSendButtonDialogComponent(iconService) {
+            this.iconService = iconService;
+            this.icons = Icon;
+            this.label = 'SEND';
+            this.showSendIcon = true;
+            this.showHoverIcon = true;
+            this.sendButtonClick = new i0.EventEmitter();
+            // @HostListener("mouseenter", ["$event"])
+            // public mouseEnter(event: MouseEvent) {
+            //   this.showOpenDialogIcon = true;
+            // }
+            //
+            // @HostListener("mouseleave", ["$event"])
+            // public mouseLeave(event: MouseEvent) {
+            //   this.showOpenDialogIcon = false;
+            // }
+            this.showDialog = false;
+            this.showOpenDialogIcon = false;
+        }
+        TransactionSendButtonDialogComponent.prototype.showClass = function () {
+            return true;
+        };
+        TransactionSendButtonDialogComponent.prototype.openDialog = function () {
+            this.showDialog = !this.showDialog;
+        };
+        return TransactionSendButtonDialogComponent;
+    }());
+    TransactionSendButtonDialogComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-transaction-send-button-dialog",
+                    template: "\n    <div class=\"transaction-send-button-content-wrapper\" (mouseenter)=\"showOpenDialogIcon = true\" (mouseleave)=\"showOpenDialogIcon = false\">\n      <div class=\"transaction-send-button-wrapper\" (click)=\"sendButtonClick.emit($event)\">\n        <div class=\"transaction-send-button-icon-wrapper\">\n          <co-icon class=\"button-icon\" [iconData]=\"iconService.getIcon(icons.ShareSolid)\"></co-icon>\n          <co-icon *ngIf=\"showSendIcon\" class=\"button-icon send-type-icon\" [iconData]=\"iconService.getIcon(icons.AtSolid)\"></co-icon>\n        </div>\n        <span class=\"button-title\" [textContent]=\"label | localize\"></span>\n      </div>\n      <div class=\"transaction-send-button-hover-icon-wrapper\" *ngIf=\"showHoverIcon\">\n        <co-icon *ngIf=\"showOpenDialogIcon\" class=\"hover-icon\" @showHideHoverIcon\n                 [iconData]=\"iconService.getIcon(icons.EllipsisVerticalSolid)\" (click)=\"openDialog()\">\n        </co-icon>\n      </div>\n    </div>\n    <ione-send-method-dialog\n      [showDialog]=\"showDialog\"\n    ></ione-send-method-dialog>\n  ",
+                    animations: [
+                        animations.trigger("showHideHoverIcon", [
+                            animations.state("void", animations.style({ width: 0, opacity: 0 })),
+                            animations.state("*", animations.style({ width: "*", opacity: 1 })),
+                            animations.transition("void => *", animations.animate("200ms ease-in-out")),
+                            animations.transition("* => void", animations.animate("200ms ease-out"))
+                        ])
+                    ],
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    TransactionSendButtonDialogComponent.ctorParameters = function () { return [
+        { type: IconCacheService }
+    ]; };
+    TransactionSendButtonDialogComponent.propDecorators = {
+        label: [{ type: i0.Input }],
+        showSendIcon: [{ type: i0.Input }],
+        showHoverIcon: [{ type: i0.Input }],
+        sendButtonClick: [{ type: i0.Output }],
+        showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-send-button-dialog",] }]
+    };
+    var TransactionSendButtonDialogModule = /** @class */ (function () {
+        function TransactionSendButtonDialogModule() {
+        }
+        return TransactionSendButtonDialogModule;
+    }());
+    TransactionSendButtonDialogModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        corecomponents_v12.IconModule,
+                        PipeModule,
+                        sharedcomponents.SendMethodDialogModule
+                    ],
+                    declarations: [
+                        TransactionSendButtonDialogComponent
+                    ],
+                    exports: [
+                        TransactionSendButtonDialogComponent
+                    ]
+                },] }
+    ];
     var TransactionQuickAccessOrderDeliveryModule = /** @class */ (function () {
         function TransactionQuickAccessOrderDeliveryModule() {
         }
@@ -19209,7 +19987,8 @@
                         corecomponents_v12.IconModule,
                         PipeModule,
                         corecomponents_v12.InputCheckboxModule,
-                        sharedcomponents.SendMethodDialogModule
+                        sharedcomponents.SendMethodDialogModule,
+                        TransactionSendButtonDialogModule
                     ],
                     declarations: [
                         TransactionQuickAccessOrderDeliveryComponent
@@ -19220,6 +19999,30 @@
                 },] }
     ];
+    var TransactionQuickAccessOrderPurchaseModule = /** @class */ (function () {
+        function TransactionQuickAccessOrderPurchaseModule() {
+        }
+        return TransactionQuickAccessOrderPurchaseModule;
+    }());
+    TransactionQuickAccessOrderPurchaseModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        corecomponents_v12.InputCheckboxModule,
+                        corecomponents_v12.IconModule,
+                        PipeModule,
+                        sharedcomponents.SendMethodDialogModule,
+                        TransactionSendButtonDialogModule
+                    ],
+                    declarations: [
+                        TransactionQuickAccessOrderPurchaseComponent
+                    ],
+                    exports: [
+                        TransactionQuickAccessOrderPurchaseComponent
+                    ]
+                },] }
+    ];
     var TransactionQuickAccessModule = /** @class */ (function () {
         function TransactionQuickAccessModule() {
         }
@@ -19237,7 +20040,8 @@
                         TransactionQuickAccessOrderConfirmationModule,
                         TransactionQuickAccessReceivedGoodsModule,
                         TransactionQuickAccessOverviewModule,
-                        TransactionQuickAccessOrderDeliveryModule
+                        TransactionQuickAccessOrderDeliveryModule,
+                        TransactionQuickAccessOrderPurchaseModule
                     ],
                     declarations: [
                         TransactionQuickAccessComponent
@@ -19606,7 +20410,7 @@
             });
         };
         return TransactionLineWarehouseLocationComponent;
-    }(TransactionLineBaseComponent));
+    }(TransactionFilterPopupBaseComponent));
     TransactionLineWarehouseLocationComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-line-warehouse-location",
@@ -19922,6 +20726,7 @@
             _this.checkbox = false;
             _this.checkboxValue = false;
             _this.actionButtons = true;
+            _this.checkboxValueChanged = new i0.EventEmitter();
             return _this;
         }
         TransactionBaseLineComponent.prototype.showClass = function () {
@@ -19944,14 +20749,12 @@
             this._transactionEventService.openSidePanel.next(line);
             this.waitingForUserAction.next(true);
         };
-        TransactionBaseLineComponent.prototype.handleCheckboxValueChanged = function () {
-        };
         return TransactionBaseLineComponent;
     }(TransactionLinesLineBaseComponent));
     TransactionBaseLineComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-base-line",
-                    template: "\n    <div class=\"transaction-base-line-wrapper\" data-action=\"openSidePanel\">\n      <ng-container *ngIf=\"line.isArticle\">\n        <div class=\"transaction-base-line-section\">\n          <co-input-checkbox *ngIf=\"checkbox\" class=\"transaction-line-checkbox\"\n                             [model]=\"checkboxValue\"\n                             (modelChange)=\"handleCheckboxValueChanged()\"\n          ></co-input-checkbox>\n          <co-transaction-line-image-and-description\n            *ngIf=\"line.isArticle\" class=\"transaction-line-image-and-description-wrapper\"\n            [preview]=\"preview\"\n            [line]=\"line\"\n            (handleDeleteLine)=\"deleteTransactionLineClick()\"\n          ></co-transaction-line-image-and-description>\n        </div>\n        <div class=\"transaction-base-line-section\">\n          <ng-content></ng-content>\n          <div *ngIf=\"!preview && actionButtons\" class=\"transaction-line-buttons\">\n            <co-transaction-line-action-buttons\n              [transactionLine]=\"line\"\n              (waitingForUserAction)=\"waitingForUserAction.next($event)\"\n              (sidePanelButtonClicked)=\"handleShowSidePanel($event)\"\n            ></co-transaction-line-action-buttons>\n          </div>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"line.isText\">\n        <div [textContent]=\"line.text\"></div>\n        <div class=\"transaction-line-delete\" *ngIf=\"!preview\">\n          <co-icon class=\"delete-icon\" [iconData]=\"iconCacheService.getIcon(icons.TrashCanLight)\" (click)=\"deleteTransactionLineClick()\"></co-icon>\n        </div>\n      </ng-container>\n    </div>\n  ",
+                    template: "\n    <div class=\"transaction-base-line-wrapper\" data-action=\"openSidePanel\">\n      <ng-container *ngIf=\"line.isArticle\">\n        <div class=\"transaction-base-line-section\">\n          <co-input-checkbox *ngIf=\"checkbox\" class=\"transaction-line-checkbox\"\n                             [model]=\"checkboxValue\"\n                             (modelChange)=\"checkboxValueChanged.emit($event)\"\n          ></co-input-checkbox>\n          <co-transaction-line-image-and-description\n            *ngIf=\"line.isArticle\" class=\"transaction-line-image-and-description-wrapper\"\n            [preview]=\"preview\"\n            [line]=\"line\"\n            (handleDeleteLine)=\"deleteTransactionLineClick()\"\n          ></co-transaction-line-image-and-description>\n        </div>\n        <div class=\"transaction-base-line-section\">\n          <ng-content></ng-content>\n          <div *ngIf=\"!preview && actionButtons\" class=\"transaction-line-buttons\">\n            <co-transaction-line-action-buttons\n              [transactionLine]=\"line\"\n              (waitingForUserAction)=\"waitingForUserAction.next($event)\"\n              (sidePanelButtonClicked)=\"handleShowSidePanel($event)\"\n            ></co-transaction-line-action-buttons>\n          </div>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"line.isText\">\n        <div [textContent]=\"line.text\"></div>\n        <div class=\"transaction-line-delete\" *ngIf=\"!preview\">\n          <co-icon class=\"delete-icon\" [iconData]=\"iconCacheService.getIcon(icons.TrashCanLight)\" (click)=\"deleteTransactionLineClick()\"></co-icon>\n        </div>\n      </ng-container>\n    </div>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
@@ -19964,6 +20767,7 @@
         checkbox: [{ type: i0.Input }],
         checkboxValue: [{ type: i0.Input }],
         actionButtons: [{ type: i0.Input }],
+        checkboxValueChanged: [{ type: i0.Output }],
         showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-base-line",] }]
     };
@@ -20234,6 +21038,71 @@
                 },] }
     ];
+    var TransactionLineAmountComponent = /** @class */ (function (_super) {
+        __extends(TransactionLineAmountComponent, _super);
+        function TransactionLineAmountComponent(_service) {
+            var _this = _super.call(this) || this;
+            _this._service = _service;
+            return _this;
+        }
+        TransactionLineAmountComponent.prototype.showClass = function () {
+            return true;
+        };
+        TransactionLineAmountComponent.prototype.changeLineAmount = function (amount) {
+            var _this = this;
+            this._service.changeTransactionLineQuantity(this.transactionLine.uuid, amount).then(function (value) {
+                if (!value || !value.isSuccess) {
+                    _this.localAmount = _this.transactionLine.amount;
+                    return;
+                }
+            });
+        };
+        TransactionLineAmountComponent.prototype.transactionLineSet = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_a) {
+                    if (this.transactionLine && this.transactionLine.isArticle) {
+                        this.localAmount = this.transactionLine.amount;
+                    }
+                    return [2 /*return*/];
+                });
+            });
+        };
+        return TransactionLineAmountComponent;
+    }(TransactionLineBaseComponent));
+    TransactionLineAmountComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-transaction-line-amount",
+                    template: "\n    <co-input-number-picker class=\"amount-number-picker\"\n                            [(model)]=\"localAmount\" [min]=\"0\"\n                            [readonly]=\"readonly\"\n                            (modelChange)=\"changeLineAmount($event)\"></co-input-number-picker>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    TransactionLineAmountComponent.ctorParameters = function () { return [
+        { type: TransactionService }
+    ]; };
+    TransactionLineAmountComponent.propDecorators = {
+        showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-line-amount",] }]
+    };
+    var TransactionLineAmountModule = /** @class */ (function () {
+        function TransactionLineAmountModule() {
+        }
+        return TransactionLineAmountModule;
+    }());
+    TransactionLineAmountModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        corecomponents_v12.InputNumberPickerModule
+                    ],
+                    declarations: [
+                        TransactionLineAmountComponent
+                    ],
+                    exports: [
+                        TransactionLineAmountComponent
+                    ]
+                },] }
+    ];
     var TransactionOverviewLineModule = /** @class */ (function () {
         function TransactionOverviewLineModule() {
         }
@@ -20262,7 +21131,8 @@
                         TransactionLineDeliveryDateButtonModule,
                         DialogTransactionLineVatModule,
                         DialogTransactionLineDiscountModule,
-                        TransactionLineStatusbarModule
+                        TransactionLineStatusbarModule,
+                        TransactionLineAmountModule
                     ],
                     declarations: [
                         TransactionOverviewLineComponent
@@ -20328,6 +21198,147 @@
                 },] }
     ];
+    var TransactionLineSupplierButtonComponent = /** @class */ (function (_super) {
+        __extends(TransactionLineSupplierButtonComponent, _super);
+        function TransactionLineSupplierButtonComponent(_service) {
+            var _this = _super.call(this) || this;
+            _this._service = _service;
+            _this.showDialogSupplier = false;
+            return _this;
+        }
+        TransactionLineSupplierButtonComponent.prototype.showClass = function () {
+            return true;
+        };
+        TransactionLineSupplierButtonComponent.prototype.transactionLineSet = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var _this = this;
+                return __generator(this, function (_a) {
+                    if (this.transactionLine && this.transactionLine.isArticle) {
+                        this._service.getSupplierFullObjectByRelationId(this.transactionLine.supplierId).then(function (supp) {
+                            _this.transactionLine.supplierDescription = supp ? supp.displayName : "";
+                        });
+                    }
+                    return [2 /*return*/];
+                });
+            });
+        };
+        return TransactionLineSupplierButtonComponent;
+    }(TransactionLineBaseComponent));
+    TransactionLineSupplierButtonComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-transaction-line-supplier-button",
+                    template: "\n    <div class=\"transaction-line-button big\" (click)=\"showDialogSupplier = true\">\n      <span class=\"co-transaction-overflow-ellipsis\" [textContent]=\"transactionLine.supplierDescription\"></span>\n    </div>\n    <co-dialog-transaction-line-supplier *ngIf=\"showDialogSupplier\"\n                                                [autoClose]=\"true\"\n                                                [transactionInfo]=\"transactionInfo\"\n                                                [transactionLine]=\"transactionLine\"\n                                                (close)=\"showDialogSupplier = false\"\n    ></co-dialog-transaction-line-supplier>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    TransactionLineSupplierButtonComponent.ctorParameters = function () { return [
+        { type: TransactionService }
+    ]; };
+    TransactionLineSupplierButtonComponent.propDecorators = {
+        showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-line-supplier-button",] }]
+    };
+    var DialogTransactionLineSupplierComponent = /** @class */ (function (_super) {
+        __extends(DialogTransactionLineSupplierComponent, _super);
+        function DialogTransactionLineSupplierComponent() {
+            return _super !== null && _super.apply(this, arguments) || this;
+        }
+        DialogTransactionLineSupplierComponent.prototype.showClass = function () {
+            return true;
+        };
+        return DialogTransactionLineSupplierComponent;
+    }(DialogTransactionLineBaseComponent));
+    DialogTransactionLineSupplierComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: "co-dialog-transaction-line-supplier",
+                    template: "\n    <co-dialog [headerTemplate]=\"dialogHeader\" [footerTemplate]=\"footerTemplate\" [showCloseIcon]=\"useModel\" (closeClick)=\"handleClose(buttonType.Ok)\">\n      <co-transaction-line-supplier\n        [autoClose]=\"autoClose\"\n        [useModel]=\"useModel\"\n        [searchText]=\"searchText\"\n        [transactionInfo]=\"transactionInfo\"\n        [transactionLine]=\"transactionLine\"\n        (closeAfterCommit)=\"handleClose(buttonType.Ok)\"\n        (valueChange)=\"handleValueChange($event)\"></co-transaction-line-supplier>\n    </co-dialog>\n    <ng-template #dialogHeader>\n      <co-dialog-header-search [title]=\"'SUPPLIER'\" (search)=\"handleSearch($event)\"></co-dialog-header-search>\n    </ng-template>\n    <ng-template #footerTemplate>\n      <div class=\"co-transaction-dialog-footer-button-wrapper\" *ngIf=\"!useModel\">\n        <co-button [label]=\"'OK' | localize\" (click)=\"handleOkClick()\"></co-button>\n      </div>\n    </ng-template>\n  ",
+                    encapsulation: i0.ViewEncapsulation.None
+                },] }
+    ];
+    DialogTransactionLineSupplierComponent.propDecorators = {
+        showClass: [{ type: i0.HostBinding, args: ["class.co-dialog-transaction-line-supplier",] }]
+    };
+    var DialogTransactionLineSupplierModule = /** @class */ (function () {
+        function DialogTransactionLineSupplierModule() {
+        }
+        return DialogTransactionLineSupplierModule;
+    }());
+    DialogTransactionLineSupplierModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        corecomponents_v12.CoDialogModule,
+                        TransactionLineSupplierModule,
+                        PipeModule,
+                        corecomponents_v12.ButtonModule,
+                        DialogHeaderSearchModule
+                    ],
+                    declarations: [
+                        DialogTransactionLineSupplierComponent
+                    ],
+                    exports: [
+                        DialogTransactionLineSupplierComponent
+                    ]
+                },] }
+    ];
+    var TransactionLineSupplierButtonModule = /** @class */ (function () {
+        function TransactionLineSupplierButtonModule() {
+        }
+        return TransactionLineSupplierButtonModule;
+    }());
+    TransactionLineSupplierButtonModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        corecomponents_v12.CoDialogModule,
+                        TransactionLineSupplierModule,
+                        PipeModule,
+                        corecomponents_v12.ButtonModule,
+                        DialogTransactionLineSupplierModule
+                    ],
+                    declarations: [
+                        TransactionLineSupplierButtonComponent
+                    ],
+                    exports: [
+                        TransactionLineSupplierButtonComponent
+                    ]
+                },] }
+    ];
+    var TransactionPurchaseLineModule = /** @class */ (function () {
+        function TransactionPurchaseLineModule() {
+        }
+        return TransactionPurchaseLineModule;
+    }());
+    TransactionPurchaseLineModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    imports: [
+                        common.CommonModule,
+                        TransactionBaseLineModule,
+                        TransactionLineWarehouseButtonModule,
+                        TransactionLineDeliveryButtonModule,
+                        TransactionLineDeliveryDateButtonModule,
+                        TransactionLineStatusbarModule,
+                        TransactionLinePriceModule,
+                        PipeModule,
+                        corecomponents_v12.InputNumberPickerModule,
+                        EditableLabelModule,
+                        DialogTransactionLineDiscountModule,
+                        TransactionLineAmountModule,
+                        TransactionLineCommissionButtonModule,
+                        TransactionLineSupplierButtonModule
+                    ],
+                    declarations: [
+                        TransactionPurchaseLineComponent
+                    ],
+                    exports: [
+                        TransactionPurchaseLineComponent
+                    ]
+                },] }
+    ];
     var TransactionModule = /** @class */ (function () {
         function TransactionModule() {
         }
@@ -20359,7 +21370,8 @@
                         TransactionTileModule,
                         TransactionOverviewLineModule,
                         TransactionOrderDeliveryLineModule,
-                        TransactionReceiveGoodsLineModule
+                        TransactionReceiveGoodsLineModule,
+                        TransactionPurchaseLineModule
                     ],
                     declarations: [
                         TransactionComponent
@@ -21057,7 +22069,7 @@
     TransactionPurchaseOrderFilterContentLogisticsComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-transaction-purchase-order-filter-content-logistics',
-                    template: "\n    <div class=\"transaction-filter-content-logistics-wrapper transaction-filter-content-wrapper\" lazyRenderMaster>\n\n      <!--Bevestigde leverdatum-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderConfirmedDeliveryDate=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderConfirmedDeliveryDate.isShowing\"\n                        [placeholder]=\"'CONFIRMED_DELIVERY_DATE'\"\n                        [customContent]=\"true\">\n          <co-input-date-range\n            [startDate]=\"confirmedDeliveryStartDate\"\n            [endDate]=\"confirmedDeliveryEndDate\"\n            (dateRangeChange)=\"onDateRangeChange($event, 'confirmedDeliveryDateRange')\"\n            (cleared)=\"onClearedDateRangeChange('confirmedDeliveryDateRange')\"\n            [placeholder]=\"'SELECT_DATE' | localize\">\n          </co-input-date-range>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Serienummer-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderSerialNumber=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderSerialNumber.isShowing\"\n                        [placeholder]=\"'SERIAL_NUMBER'\"\n                        [customContent]=\"true\">\n          <co-input-text [(model)]=\"searchRequest.serialNumber\"\n                         [placeholder]=\"searchPlaceholder | localize\"></co-input-text>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Batchnummer-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderBatchNumber=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderBatchNumber.isShowing\"\n                        [placeholder]=\"'BATCH_NUMBER'\"\n                        [customContent]=\"true\">\n          <co-input-text [(model)]=\"searchRequest.batchNumber\"\n                         [placeholder]=\"searchPlaceholder | localize\"></co-input-text>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Geleverd-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDelivered=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderDelivered.isShowing\"\n                                              [label]=\"'DELIVERED'\"\n                                              (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityDelivered')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Gefactureerd-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderInvoiced=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderInvoiced.isShowing\"\n                                              [label]=\"'INVOICED'\"\n                                              (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityInvoiced')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Binnengemeld / Geleverd -->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderReceived=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderReceived.isShowing\"\n                                              [label]=\"'RECEIVED_DELIVERED'\"\n                                              (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityReceived')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Bevestigd-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderConfirmed=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderConfirmed.isShowing\"\n                                              [label]=\"'CONFIRMED'\"\n                                              (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityConfirmed')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Aankomstdatum-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderArrivalDate=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderArrivalDate.isShowing\"\n                        [placeholder]=\"'ARRIVAL_DATE'\"\n                        [customContent]=\"true\">\n          <co-input-date-range\n            [startDate]=\"arrivalStartDate\"\n            [endDate]=\"arrivalEndDate\"\n            (dateRangeChange)=\"onDateRangeChange($event, 'arrivalDateRange')\"\n            (cleared)=\"onClearedDateRangeChange('arrivalDateRange')\"\n            [placeholder]=\"'SELECT_DATE' | localize\">\n          </co-input-date-range>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Toegewezen-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderAllocated=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderAllocated.isShowing\"\n                                              [label]=\"'ALLOCATED'\"\n                                              (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityAllocated')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Te picken-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderToBePicked=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderToBePicked.isShowing\"\n                                              [label]=\"'TO_BE_PICKED'\"\n                                              (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityToBePicked')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Gepicked-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderPicked=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderPicked.isShowing\"\n                                              [label]=\"'PICKED'\"\n                                              (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityPicked')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Deellevering-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderPartialDelivery=\"lazyRender\">\n        <co-filter-item *ngIf=\"lazyRenderPartialDelivery.isShowing\"\n                        [placeholder]=\"'PART_DELIVERY' | localize\"\n                        [customContent]=\"true\"\n                        [filterButtonLabel]=\"filterButtonLabel | localize\"\n                        [expanded]=\"true\">\n          <co-input-checkbox\n            [model]=\"searchRequest.partialDelivery === 'J'\"\n            (modelChange)=\"filterRequestService.handleCheckboxValueChangeForString($event, 'partialDelivery')\"\n            [label]=\"'PART_DELIVERY' | localize\">\n          </co-input-checkbox>\n        </co-filter-item>\n      </div>\n\n      <!--Magazijn-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderWarehouse=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderWarehouse.isShowing\"\n                        [placeholder]=\"'WAREHOUSE'\"\n                        [singleSelect]=\"true\"\n                        [collection]=\"warehouses\"\n                        (collectionChange)=\"filterRequestService.handleCollectionChangeForSingleSelect($event, 'warehouse')\">\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Bron magazijn-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderSourceWarehouse=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderSourceWarehouse.isShowing\"\n                        [placeholder]=\"'SOURCE_WAREHOUSE'\"\n                        [singleSelect]=\"true\"\n                        [collection]=\"sourceWarehouses\"\n                        (collectionChange)=\"filterRequestService.handleCollectionChangeForSingleSelect($event, 'sourceWarehouse')\">\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Levermethode-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDeliveryMethod=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderDeliveryMethod.isShowing\"\n                        [placeholder]=\"'DELIVERY_METHOD'\"\n                        [collection]=\"deliveryMethods\"\n                        (collectionChange)=\"filterRequestService.handleCollectionChangeForRange($event, 'rangeDeliveryMethod')\">\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Leverdatum definitief-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDeliveryDateDefinitive=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderDeliveryDateDefinitive.isShowing\"\n                        [placeholder]=\"'DELIVERY_DATE_FINAL'\"\n                        [customContent]=\"true\">\n          <co-input-checkbox\n            [model]=\"searchRequest.deliveryDateDefinitive === 'J'\"\n            (modelChange)=\"filterRequestService.handleCheckboxValueChangeForString($event, 'deliveryDateDefinitive')\"\n            [label]=\"'DELIVERY_DATE_FINAL' | localize\"></co-input-checkbox>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Uitvoerbaar: todo: vraag staat uit wat hiermee bedoeld wordt. Daarna hier aanvullen -->\n    </div>\n  "
+                    template: "\n    <div class=\"transaction-filter-content-logistics-wrapper transaction-filter-content-wrapper\" lazyRenderMaster>\n\n      <!--Bevestigde leverdatum-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderConfirmedDeliveryDate=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderConfirmedDeliveryDate.isShowing\"\n                                    [placeholder]=\"'CONFIRMED_DELIVERY_DATE'\"\n                                    [customContent]=\"true\">\n          <co-input-date-range\n            [startDate]=\"confirmedDeliveryStartDate\"\n            [endDate]=\"confirmedDeliveryEndDate\"\n            (dateRangeChange)=\"onDateRangeChange($event, 'confirmedDeliveryDateRange')\"\n            (cleared)=\"onClearedDateRangeChange('confirmedDeliveryDateRange')\"\n            [placeholder]=\"'SELECT_DATE' | localize\">\n          </co-input-date-range>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Serienummer-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderSerialNumber=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderSerialNumber.isShowing\"\n                                    [placeholder]=\"'SERIAL_NUMBER'\"\n                                    [customContent]=\"true\">\n          <co-input-text [(model)]=\"searchRequest.serialNumber\"\n                         [placeholder]=\"searchPlaceholder | localize\"></co-input-text>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Batchnummer-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderBatchNumber=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderBatchNumber.isShowing\"\n                                    [placeholder]=\"'BATCH_NUMBER'\"\n                                    [customContent]=\"true\">\n          <co-input-text [(model)]=\"searchRequest.batchNumber\"\n                         [placeholder]=\"searchPlaceholder | localize\"></co-input-text>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Geleverd-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDelivered=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderDelivered.isShowing\"\n                                              [label]=\"'DELIVERED'\"\n                                              (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityDelivered')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Gefactureerd-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderInvoiced=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderInvoiced.isShowing\"\n                                              [label]=\"'INVOICED'\"\n                                              (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityInvoiced')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Binnengemeld / Geleverd -->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderReceived=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderReceived.isShowing\"\n                                              [label]=\"'RECEIVED_DELIVERED'\"\n                                              (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityReceived')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Bevestigd-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderConfirmed=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderConfirmed.isShowing\"\n                                              [label]=\"'CONFIRMED'\"\n                                              (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityConfirmed')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Aankomstdatum-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderArrivalDate=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderArrivalDate.isShowing\"\n                                    [placeholder]=\"'ARRIVAL_DATE'\"\n                                    [customContent]=\"true\">\n          <co-input-date-range\n            [startDate]=\"arrivalStartDate\"\n            [endDate]=\"arrivalEndDate\"\n            (dateRangeChange)=\"onDateRangeChange($event, 'arrivalDateRange')\"\n            (cleared)=\"onClearedDateRangeChange('arrivalDateRange')\"\n            [placeholder]=\"'SELECT_DATE' | localize\">\n          </co-input-date-range>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Toegewezen-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderAllocated=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderAllocated.isShowing\"\n                                              [label]=\"'ALLOCATED'\"\n                                              (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityAllocated')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Te picken-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderToBePicked=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderToBePicked.isShowing\"\n                                              [label]=\"'TO_BE_PICKED'\"\n                                              (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityToBePicked')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Gepicked-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderPicked=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderPicked.isShowing\"\n                                              [label]=\"'PICKED'\"\n                                              (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityPicked')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Deellevering-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderPartialDelivery=\"lazyRender\">\n        <co-filter-item *ngIf=\"lazyRenderPartialDelivery.isShowing\"\n                        [placeholder]=\"'PART_DELIVERY' | localize\"\n                        [customContent]=\"true\"\n                        [filterButtonLabel]=\"filterButtonLabel | localize\"\n                        [expanded]=\"true\">\n          <co-input-checkbox\n            [model]=\"searchRequest.partialDelivery === 'J'\"\n            (modelChange)=\"filterRequestService.handleCheckboxValueChangeForString($event, 'partialDelivery')\"\n            [label]=\"'PART_DELIVERY' | localize\">\n          </co-input-checkbox>\n        </co-filter-item>\n      </div>\n\n      <!--Magazijn-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderWarehouse=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderWarehouse.isShowing\"\n                                    [placeholder]=\"'WAREHOUSE'\"\n                                    [singleSelect]=\"true\"\n                                    [collection]=\"warehouses\"\n                                    (collectionChange)=\"filterRequestService.handleCollectionChangeForSingleSelect($event, 'warehouse')\">\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Bron magazijn-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderSourceWarehouse=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderSourceWarehouse.isShowing\"\n                                    [placeholder]=\"'SOURCE_WAREHOUSE'\"\n                                    [singleSelect]=\"true\"\n                                    [collection]=\"sourceWarehouses\"\n                                    (collectionChange)=\"filterRequestService.handleCollectionChangeForSingleSelect($event, 'sourceWarehouse')\">\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Levermethode-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDeliveryMethod=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderDeliveryMethod.isShowing\"\n                                    [placeholder]=\"'DELIVERY_METHOD'\"\n                                    [collection]=\"deliveryMethods\"\n                                    (collectionChange)=\"filterRequestService.handleCollectionChangeForRange($event, 'rangeDeliveryMethod')\">\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Leverdatum definitief-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDeliveryDateDefinitive=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderDeliveryDateDefinitive.isShowing\"\n                                    [placeholder]=\"'DELIVERY_DATE_FINAL'\"\n                                    [customContent]=\"true\">\n          <co-input-checkbox\n            [model]=\"searchRequest.deliveryDateDefinitive === 'J'\"\n            (modelChange)=\"filterRequestService.handleCheckboxValueChangeForString($event, 'deliveryDateDefinitive')\"\n            [label]=\"'DELIVERY_DATE_FINAL' | localize\"></co-input-checkbox>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Uitvoerbaar: todo: vraag staat uit wat hiermee bedoeld wordt. Daarna hier aanvullen -->\n    </div>\n  "
                 },] }
     ];
     TransactionPurchaseOrderFilterContentLogisticsComponent.ctorParameters = function () { return [
@@ -21070,9 +22082,10 @@
     };
     var TransactionFilterHistoricStateComponent = /** @class */ (function () {
-        function TransactionFilterHistoricStateComponent() {
+        function TransactionFilterHistoricStateComponent(_dictionary) {
+            this._dictionary = _dictionary;
             this.expanded = true;
-            this.filterClicked = new i0.EventEmitter();
+            this.collectionChange = new i0.EventEmitter();
             this.states = [];
         }
         Object.defineProperty(TransactionFilterHistoricStateComponent.prototype, "label", {
@@ -21093,14 +22106,11 @@
         TransactionFilterHistoricStateComponent.prototype.showClass = function () {
             return true;
         };
-        TransactionFilterHistoricStateComponent.prototype.handleStateChange = function (value) {
-            this.filterClicked.emit(value);
-        };
         TransactionFilterHistoricStateComponent.prototype._setStates = function () {
             this.states = [
-                { label: this.labelNothing, value: quantityInHistoricState_enum.QuantityInHistoricState.Nothing, checked: false },
-                { label: this.labelPartly, value: quantityInHistoricState_enum.QuantityInHistoricState.Partly, checked: false },
-                { label: this.labelFully, value: quantityInHistoricState_enum.QuantityInHistoricState.Fully, checked: false }
+                { description: this._dictionary.get(this.labelNothing), code: quantityInHistoricState_enum.QuantityInHistoricState.Nothing, checked: false },
+                { description: this._dictionary.get(this.labelPartly), code: quantityInHistoricState_enum.QuantityInHistoricState.Partly, checked: false },
+                { description: this._dictionary.get(this.labelFully), code: quantityInHistoricState_enum.QuantityInHistoricState.Fully, checked: false }
             ];
         };
         return TransactionFilterHistoricStateComponent;
@@ -21108,14 +22118,17 @@
     TransactionFilterHistoricStateComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: "co-transaction-filter-historic-state",
-                    template: "\n    <co-transaction-filter-item\n      [placeholder]=\"label\"\n      [customContent]=\"true\">\n      <co-input-radio-button *ngFor=\"let state of states\"\n                             [model]=\"state.checked\"\n                             [label]=\"state.label | localize\"\n                             (modelChange)=\"handleStateChange(state.value)\"\n      ></co-input-radio-button>\n    </co-transaction-filter-item>\n  ",
+                    template: "\n    <co-transaction-filter-item\n      [placeholder]=\"label\"\n      [collection]=\"states\"\n      (collectionChange)=\"collectionChange.emit($event)\">\n    </co-transaction-filter-item>\n  ",
                     encapsulation: i0.ViewEncapsulation.None
                 },] }
     ];
+    TransactionFilterHistoricStateComponent.ctorParameters = function () { return [
+        { type: DictionaryService }
+    ]; };
     TransactionFilterHistoricStateComponent.propDecorators = {
         label: [{ type: i0.Input }],
         expanded: [{ type: i0.Input }],
-        filterClicked: [{ type: i0.Output }],
+        collectionChange: [{ type: i0.Output }],
         showClass: [{ type: i0.HostBinding, args: ["class.co-transaction-filter-historic-state",] }]
     };
@@ -22077,7 +23090,7 @@
     TransactionSalesOrderFilterContentLogisticsComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-transaction-sales-order-filter-content-logistics',
-                    template: "\n    <div class=\"transaction-filter-content-logistics-wrapper transaction-filter-content-wrapper\" lazyRenderMaster>\n\n      <!--Levermethode-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDeliveryMethod=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderDeliveryMethod.isShowing\"\n                        [placeholder]=\"'DELIVERY_METHOD'\"\n                        [collection]=\"deliveryMethods\"\n                        (collectionChange)=\"filterRequestService.handleCollectionChangeForRange($event, 'rangeDeliveryMethod')\"\n        >\n        </co-transaction-filter-item>\n      </div>\n\n\n      <!--Leverdatum definitief-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDeliveryDateFinal=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderDeliveryDateFinal.isShowing\"\n                        [placeholder]=\"'DELIVERY_DATE_FINAL'\"\n                        [customContent]=\"true\"\n        >\n          <co-input-checkbox\n            [model]=\"searchRequest.deliveryDateDefinitive === 'J'\"\n            (modelChange)=\"filterRequestService.handleCheckboxValueChangeForString($event, 'deliveryDateDefinitive')\"\n            [label]=\"'DELIVERY_DATE_FINAL' | localize\"></co-input-checkbox>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Toegewezen-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderAllocated=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderAllocated.isShowing\"\n                                              [label]=\"'ALLOCATED'\"\n                                              (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityAllocated')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Geleverd-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDelivered=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderDelivered.isShowing\"\n                                              [label]=\"'DELIVERED'\"\n                                              (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityDelivered')\"\n        ></co-transaction-filter-historic-state>\n        </div>\n\n        <!--Gefactureerd-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderInvoiced=\"lazyRender\">\n          <co-transaction-filter-historic-state *ngIf=\"lazyRenderInvoiced.isShowing\"\n                                                [label]=\"'INVOICED'\"\n                                                (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityInvoiced')\"\n          ></co-transaction-filter-historic-state>\n        </div>\n\n        <!--Te picken-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderToBePicked=\"lazyRender\">\n          <co-transaction-filter-historic-state *ngIf=\"lazyRenderToBePicked.isShowing\"\n                                                [label]=\"'TO_BE_PICKED'\"\n                                                (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityToBePicked')\"\n          ></co-transaction-filter-historic-state>\n        </div>\n\n        <!--Gepicked-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderPicked=\"lazyRender\">\n          <co-transaction-filter-historic-state *ngIf=\"lazyRenderPicked.isShowing\"\n                                                [label]=\"'PICKED'\"\n                                                (filterClicked)=\"filterRequestService.handleCollectionChangeForSingleNumber($event, 'quantityPicked')\"\n          ></co-transaction-filter-historic-state>\n        </div>\n\n        <!--Bevestigde leverdatum-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderConfirmedDeliveryDate=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderConfirmedDeliveryDate.isShowing\"\n                          [placeholder]=\"'CONFIRMED_DELIVERY_DATE'\"\n                          [customContent]=\"true\">\n            <co-input-date-range\n              [startDate]=\"confirmedDeliveryStartDate\"\n              [endDate]=\"confirmedDeliveryEndDate\"\n              (dateRangeChange)=\"onDateRangeChange($event, 'confirmedDeliveryDateRange')\"\n              (cleared)=\"onClearedDateRangeChange('confirmedDeliveryDateRange')\"\n              [placeholder]=\"'SELECT_DATE' | localize\">\n            </co-input-date-range>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Aankomstdatum-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderArrivalDate=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderArrivalDate.isShowing\"\n                          [placeholder]=\"'ARRIVAL_DATE'\"\n                          [customContent]=\"true\">\n            <co-input-date-range\n              [startDate]=\"arrivalStartDate\"\n              [endDate]=\"arrivalEndDate\"\n              (dateRangeChange)=\"onDateRangeChange($event, 'arrivalDateRange')\"\n              (cleared)=\"onClearedDateRangeChange('arrivalDateRange')\"\n              [placeholder]=\"'SELECT_DATE' | localize\">\n            </co-input-date-range>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Deellevering-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderPartialDelivery=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderPartialDelivery.isShowing\"\n                          [placeholder]=\"'PART_DELIVERY'\"\n                          [customContent]=\"true\">\n            <co-input-checkbox\n              [model]=\"searchRequest.partialDelivery === 'J'\"\n              (modelChange)=\"filterRequestService.handleCheckboxValueChangeForString($event, 'partialDelivery')\"\n              [label]=\"'PART_DELIVERY' | localize\">\n            </co-input-checkbox>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Magazijn -->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderWarehouse=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderWarehouse.isShowing\"\n                          [placeholder]=\"'WAREHOUSE'\"\n                          [singleSelect]=\"true\"\n                          [collection]=\"warehouses\"\n                          (collectionChange)=\"filterRequestService.handleCollectionChangeForSingleSelect($event, 'warehouse')\">\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Bron magazijn-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderSourceWarehouse=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderSourceWarehouse.isShowing\"\n                          [placeholder]=\"'SOURCE_WAREHOUSE'\"\n                          [singleSelect]=\"true\"\n                          [collection]=\"sourceWarehouses\"\n                          (collectionChange)=\"filterRequestService.handleCollectionChangeForSingleSelect($event, 'sourceWarehouse')\">\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Serienummer -->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderSerialNumber=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderSerialNumber.isShowing\"\n                          [placeholder]=\"'SERIAL_NUMBER'\"\n                          [customContent]=\"true\">\n            <co-input-text [(model)]=\"searchRequest.serialNumber\"\n                           [placeholder]=\"searchPlaceholder | localize\"></co-input-text>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Batchnummer -->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderBatchNumber=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderBatchNumber.isShowing\"\n                          [placeholder]=\"'BATCH_NUMBER'\"\n                          [customContent]=\"true\">\n            <co-input-text [(model)]=\"searchRequest.batchNumber\"\n                           [placeholder]=\"searchPlaceholder | localize\"></co-input-text>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Inclusief retouren-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderIncludingReturns=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderIncludingReturns.isShowing\"\n                          [placeholder]=\"'INCLUDING_RETURNS'\"\n                          [customContent]=\"true\">\n            <co-input-checkbox\n              [label]=\"'INCLUDING_RETURNS' | localize\"\n              [model]=\"searchRequest.includingReturns === 1\"\n              (modelChange)=\"filterRequestService.handleCheckboxValueChangeForNumber($event, 'includingReturns')\"\n            >\n            </co-input-checkbox>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Levermethode op (regel/header): todo: nog uitzoeken welke filter dit is-->\n      </div>\n  "
+                    template: "\n    <div class=\"transaction-filter-content-logistics-wrapper transaction-filter-content-wrapper\" lazyRenderMaster>\n\n      <!--Levermethode-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDeliveryMethod=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderDeliveryMethod.isShowing\"\n                        [placeholder]=\"'DELIVERY_METHOD'\"\n                        [collection]=\"deliveryMethods\"\n                        (collectionChange)=\"filterRequestService.handleCollectionChangeForRange($event, 'rangeDeliveryMethod')\"\n        >\n        </co-transaction-filter-item>\n      </div>\n\n\n      <!--Leverdatum definitief-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDeliveryDateFinal=\"lazyRender\">\n        <co-transaction-filter-item *ngIf=\"lazyRenderDeliveryDateFinal.isShowing\"\n                        [placeholder]=\"'DELIVERY_DATE_FINAL'\"\n                        [customContent]=\"true\"\n        >\n          <co-input-checkbox\n            [model]=\"searchRequest.deliveryDateDefinitive === 'J'\"\n            (modelChange)=\"filterRequestService.handleCheckboxValueChangeForString($event, 'deliveryDateDefinitive')\"\n            [label]=\"'DELIVERY_DATE_FINAL' | localize\"></co-input-checkbox>\n        </co-transaction-filter-item>\n      </div>\n\n      <!--Toegewezen-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderAllocated=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderAllocated.isShowing\"\n                                              [label]=\"'ALLOCATED'\"\n                                              (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityAllocated')\"\n        ></co-transaction-filter-historic-state>\n      </div>\n\n      <!--Geleverd-->\n      <div class=\"filter-item-wrapper\" lazyRender #lazyRenderDelivered=\"lazyRender\">\n        <co-transaction-filter-historic-state *ngIf=\"lazyRenderDelivered.isShowing\"\n                                              [label]=\"'DELIVERED'\"\n                                              (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityDelivered')\"\n        ></co-transaction-filter-historic-state>\n        </div>\n\n        <!--Gefactureerd-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderInvoiced=\"lazyRender\">\n          <co-transaction-filter-historic-state *ngIf=\"lazyRenderInvoiced.isShowing\"\n                                                [label]=\"'INVOICED'\"\n                                                (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityInvoiced')\"\n          ></co-transaction-filter-historic-state>\n        </div>\n\n        <!--Te picken-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderToBePicked=\"lazyRender\">\n          <co-transaction-filter-historic-state *ngIf=\"lazyRenderToBePicked.isShowing\"\n                                                [label]=\"'TO_BE_PICKED'\"\n                                                (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityToBePicked')\"\n          ></co-transaction-filter-historic-state>\n        </div>\n\n        <!--Gepicked-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderPicked=\"lazyRender\">\n          <co-transaction-filter-historic-state *ngIf=\"lazyRenderPicked.isShowing\"\n                                                [label]=\"'PICKED'\"\n                                                (collectionChange)=\"filterRequestService.handleCollectionChangeForArray($event, 'quantityPicked')\"\n          ></co-transaction-filter-historic-state>\n        </div>\n\n        <!--Bevestigde leverdatum-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderConfirmedDeliveryDate=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderConfirmedDeliveryDate.isShowing\"\n                          [placeholder]=\"'CONFIRMED_DELIVERY_DATE'\"\n                          [customContent]=\"true\">\n            <co-input-date-range\n              [startDate]=\"confirmedDeliveryStartDate\"\n              [endDate]=\"confirmedDeliveryEndDate\"\n              (dateRangeChange)=\"onDateRangeChange($event, 'confirmedDeliveryDateRange')\"\n              (cleared)=\"onClearedDateRangeChange('confirmedDeliveryDateRange')\"\n              [placeholder]=\"'SELECT_DATE' | localize\">\n            </co-input-date-range>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Aankomstdatum-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderArrivalDate=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderArrivalDate.isShowing\"\n                          [placeholder]=\"'ARRIVAL_DATE'\"\n                          [customContent]=\"true\">\n            <co-input-date-range\n              [startDate]=\"arrivalStartDate\"\n              [endDate]=\"arrivalEndDate\"\n              (dateRangeChange)=\"onDateRangeChange($event, 'arrivalDateRange')\"\n              (cleared)=\"onClearedDateRangeChange('arrivalDateRange')\"\n              [placeholder]=\"'SELECT_DATE' | localize\">\n            </co-input-date-range>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Deellevering-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderPartialDelivery=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderPartialDelivery.isShowing\"\n                          [placeholder]=\"'PART_DELIVERY'\"\n                          [customContent]=\"true\">\n            <co-input-checkbox\n              [model]=\"searchRequest.partialDelivery === 'J'\"\n              (modelChange)=\"filterRequestService.handleCheckboxValueChangeForString($event, 'partialDelivery')\"\n              [label]=\"'PART_DELIVERY' | localize\">\n            </co-input-checkbox>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Magazijn -->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderWarehouse=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderWarehouse.isShowing\"\n                          [placeholder]=\"'WAREHOUSE'\"\n                          [singleSelect]=\"true\"\n                          [collection]=\"warehouses\"\n                          (collectionChange)=\"filterRequestService.handleCollectionChangeForSingleSelect($event, 'warehouse')\">\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Bron magazijn-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderSourceWarehouse=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderSourceWarehouse.isShowing\"\n                          [placeholder]=\"'SOURCE_WAREHOUSE'\"\n                          [singleSelect]=\"true\"\n                          [collection]=\"sourceWarehouses\"\n                          (collectionChange)=\"filterRequestService.handleCollectionChangeForSingleSelect($event, 'sourceWarehouse')\">\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Serienummer -->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderSerialNumber=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderSerialNumber.isShowing\"\n                          [placeholder]=\"'SERIAL_NUMBER'\"\n                          [customContent]=\"true\">\n            <co-input-text [(model)]=\"searchRequest.serialNumber\"\n                           [placeholder]=\"searchPlaceholder | localize\"></co-input-text>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Batchnummer -->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderBatchNumber=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderBatchNumber.isShowing\"\n                          [placeholder]=\"'BATCH_NUMBER'\"\n                          [customContent]=\"true\">\n            <co-input-text [(model)]=\"searchRequest.batchNumber\"\n                           [placeholder]=\"searchPlaceholder | localize\"></co-input-text>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Inclusief retouren-->\n        <div class=\"filter-item-wrapper\" lazyRender #lazyRenderIncludingReturns=\"lazyRender\">\n          <co-transaction-filter-item *ngIf=\"lazyRenderIncludingReturns.isShowing\"\n                          [placeholder]=\"'INCLUDING_RETURNS'\"\n                          [customContent]=\"true\">\n            <co-input-checkbox\n              [label]=\"'INCLUDING_RETURNS' | localize\"\n              [model]=\"searchRequest.includingReturns === 1\"\n              (modelChange)=\"filterRequestService.handleCheckboxValueChangeForNumber($event, 'includingReturns')\"\n            >\n            </co-input-checkbox>\n          </co-transaction-filter-item>\n        </div>\n\n        <!--Levermethode op (regel/header): todo: nog uitzoeken welke filter dit is-->\n      </div>\n  "
                 },] }
     ];
     TransactionSalesOrderFilterContentLogisticsComponent.ctorParameters = function () { return [
@@ -22352,6 +23365,8 @@
     exports.CheckoutComponent = CheckoutComponent;
     exports.CheckoutModule = CheckoutModule;
+    exports.LoaderComponent = LoaderComponent;
+    exports.LoaderModule = LoaderModule;
     exports.ShoppingCartComponent = ShoppingCartComponent;
     exports.ShoppingCartModule = ShoppingCartModule;
     exports.ShoppingCartPreviewComponent = ShoppingCartPreviewComponent;
@@ -22392,16 +23407,16 @@
     exports.TransactionTotalsModule = TransactionTotalsModule;
     exports["ɵa"] = PendingReasonService;
     exports["ɵb"] = DialogService;
-    exports["ɵba"] = IconCacheService;
-    exports["ɵbb"] = CharacteristicAnswerModule;
-    exports["ɵbc"] = CharacteristicAnswerComponent;
-    exports["ɵbd"] = WarehouseModule;
-    exports["ɵbe"] = WarehouseComponent;
-    exports["ɵbf"] = ImageDisplayComponent;
-    exports["ɵbg"] = IconComponent;
-    exports["ɵbh"] = CustomerGroupsComponent;
-    exports["ɵbi"] = StockStatusIndicatorComponent;
-    exports["ɵbj"] = LoaderComponent;
+    exports["ɵba"] = DialogBaseComponent;
+    exports["ɵbb"] = IconCacheService;
+    exports["ɵbc"] = CharacteristicAnswerModule;
+    exports["ɵbd"] = CharacteristicAnswerComponent;
+    exports["ɵbe"] = WarehouseModule;
+    exports["ɵbf"] = WarehouseComponent;
+    exports["ɵbg"] = ImageDisplayComponent;
+    exports["ɵbh"] = IconComponent;
+    exports["ɵbi"] = CustomerGroupsComponent;
+    exports["ɵbj"] = StockStatusIndicatorComponent;
     exports["ɵbk"] = LazyRenderMasterDirective;
     exports["ɵbl"] = LazyRenderDirective;
     exports["ɵbm"] = RelationAddressModule;
@@ -22426,109 +23441,109 @@
     exports["ɵce"] = TransactionLineDescriptionModule;
     exports["ɵcf"] = TransactionLineDescriptionComponent;
     exports["ɵcg"] = TransactionLineBaseComponent;
-    exports["ɵch"] = TransactionFilterPopupBaseComponent;
-    exports["ɵci"] = TransactionLineImageAndDescriptionComponent;
-    exports["ɵcj"] = TransactionImageService;
-    exports["ɵck"] = TransactionArticleTextComponent;
-    exports["ɵcl"] = TransactionReceiveGoodsService;
-    exports["ɵcm"] = TransactionEventService;
-    exports["ɵcn"] = DialogTransactionHeaderDiscountModule;
-    exports["ɵco"] = TransactionHeaderDiscountPercentageModule;
-    exports["ɵcp"] = TransactionHeaderDiscountPercentageComponent;
-    exports["ɵcq"] = TransactionHeaderBaseComponent;
-    exports["ɵcr"] = TransactionHeaderDiscountAmountModule;
-    exports["ɵcs"] = TransactionHeaderDiscountAmountComponent;
-    exports["ɵct"] = TransactionHeaderDiscountTransactionTotalModule;
-    exports["ɵcu"] = TransactionHeaderDiscountTransactionTotalComponent;
-    exports["ɵcv"] = DialogTransactionHeaderDiscountComponent;
-    exports["ɵcw"] = DialogTransactionHeaderBaseComponent;
-    exports["ɵcx"] = AvatarModule;
-    exports["ɵcy"] = AvatarComponent;
-    exports["ɵcz"] = SharedService;
+    exports["ɵch"] = TransactionLineImageAndDescriptionComponent;
+    exports["ɵci"] = TransactionImageService;
+    exports["ɵcj"] = TransactionArticleTextComponent;
+    exports["ɵck"] = TransactionReceiveGoodsService;
+    exports["ɵcl"] = DialogTransactionHeaderDiscountModule;
+    exports["ɵcm"] = TransactionHeaderDiscountPercentageModule;
+    exports["ɵcn"] = TransactionHeaderDiscountPercentageComponent;
+    exports["ɵco"] = TransactionHeaderBaseComponent;
+    exports["ɵcp"] = TransactionHeaderFilterPopupBaseComponent;
+    exports["ɵcq"] = TransactionHeaderDiscountAmountModule;
+    exports["ɵcr"] = TransactionHeaderDiscountAmountComponent;
+    exports["ɵcs"] = TransactionHeaderDiscountTransactionTotalModule;
+    exports["ɵct"] = TransactionHeaderDiscountTransactionTotalComponent;
+    exports["ɵcu"] = DialogTransactionHeaderDiscountComponent;
+    exports["ɵcv"] = DialogTransactionHeaderBaseComponent;
+    exports["ɵcw"] = AvatarModule;
+    exports["ɵcx"] = AvatarComponent;
+    exports["ɵcy"] = SharedService;
+    exports["ɵcz"] = SharedConnectorService;
     exports["ɵd"] = OptionsService;
-    exports["ɵda"] = SharedConnectorService;
-    exports["ɵdb"] = DeliveryTypeTileModule;
-    exports["ɵdc"] = DeliveryTypeTileComponent;
-    exports["ɵdd"] = PaymentModule;
-    exports["ɵde"] = PaymentTileModule;
-    exports["ɵdf"] = PaymentTileComponent;
-    exports["ɵdg"] = PaymentQrCodeModule;
-    exports["ɵdh"] = PaymentQrCodeComponent;
-    exports["ɵdi"] = DownPaymentModule;
-    exports["ɵdj"] = DownPaymentComponent;
-    exports["ɵdk"] = PaymentService;
-    exports["ɵdl"] = PaymentComponent;
-    exports["ɵdm"] = RelationTypeModule;
-    exports["ɵdn"] = RelationTypeComponent;
-    exports["ɵdo"] = RelationGeneralModule;
-    exports["ɵdp"] = RelationSuggestionsListModule;
-    exports["ɵdq"] = RelationSuggestionsListItemModule;
-    exports["ɵdr"] = RelationSuggestionsListItemComponent;
-    exports["ɵds"] = RelationSuggestionsListComponent;
-    exports["ɵdt"] = RelationGeneralComponent;
-    exports["ɵdu"] = RelationAddressesModule;
-    exports["ɵdv"] = RelationAddressesComponent;
-    exports["ɵdw"] = RelationContactDetailsModule;
-    exports["ɵdx"] = RelationContactDetailsComponent;
-    exports["ɵdy"] = RelationPreferencesModule;
-    exports["ɵdz"] = RelationPreferencesComponent;
+    exports["ɵda"] = DeliveryTypeTileModule;
+    exports["ɵdb"] = DeliveryTypeTileComponent;
+    exports["ɵdc"] = PaymentModule;
+    exports["ɵdd"] = PaymentTileModule;
+    exports["ɵde"] = PaymentTileComponent;
+    exports["ɵdf"] = PaymentQrCodeModule;
+    exports["ɵdg"] = PaymentQrCodeComponent;
+    exports["ɵdh"] = DownPaymentModule;
+    exports["ɵdi"] = DownPaymentComponent;
+    exports["ɵdj"] = PaymentService;
+    exports["ɵdk"] = PaymentComponent;
+    exports["ɵdl"] = RelationTypeModule;
+    exports["ɵdm"] = RelationTypeComponent;
+    exports["ɵdn"] = RelationGeneralModule;
+    exports["ɵdo"] = RelationSuggestionsListModule;
+    exports["ɵdp"] = RelationSuggestionsListItemModule;
+    exports["ɵdq"] = RelationSuggestionsListItemComponent;
+    exports["ɵdr"] = RelationSuggestionsListComponent;
+    exports["ɵds"] = RelationGeneralComponent;
+    exports["ɵdt"] = RelationAddressesModule;
+    exports["ɵdu"] = RelationAddressesComponent;
+    exports["ɵdv"] = RelationContactDetailsModule;
+    exports["ɵdw"] = RelationContactDetailsComponent;
+    exports["ɵdx"] = RelationPreferencesModule;
+    exports["ɵdy"] = RelationPreferencesComponent;
+    exports["ɵdz"] = TransactionHeaderBlockModule;
     exports["ɵe"] = DictionaryService;
-    exports["ɵea"] = TransactionHeaderBlockModule;
-    exports["ɵeb"] = TransactionHeaderBlockComponent;
-    exports["ɵec"] = TransactionHeaderDeliveryDateModule;
-    exports["ɵed"] = TransactionHeaderDeliveryDateComponent;
-    exports["ɵee"] = TransactionHeaderDeliveryOptionsModule;
-    exports["ɵef"] = TransactionHeaderDeliveryOptionsComponent;
-    exports["ɵeg"] = TransactionHeaderRemarksModule;
-    exports["ɵeh"] = TransactionHeaderRemarksComponent;
-    exports["ɵei"] = TransactionHeaderReferenceModule;
-    exports["ɵej"] = TransactionHeaderReferenceComponent;
-    exports["ɵek"] = TransactionHeaderRelationReferenceModule;
-    exports["ɵel"] = TransactionHeaderRelationReferenceComponent;
-    exports["ɵem"] = TransactionHeaderDeliveryMethodModule;
-    exports["ɵen"] = TransactionLineCheckboxModule;
-    exports["ɵeo"] = TransactionLineCheckboxListComponent;
-    exports["ɵep"] = TransactionHeaderDeliveryMethodComponent;
-    exports["ɵeq"] = TransactionHeaderPreferredDeliveryDateModule;
-    exports["ɵer"] = TransactionHeaderPreferredDeliveryDateComponent;
-    exports["ɵes"] = DialogTransactionHeaderDeliveryMethodModule;
-    exports["ɵet"] = DialogHeaderSearchModule;
-    exports["ɵeu"] = DialogHeaderSearchComponent;
-    exports["ɵev"] = DialogTransactionHeaderDeliveryMethodComponent;
-    exports["ɵew"] = TransactionHeaderPartialDeliveryModule;
-    exports["ɵex"] = TransactionHeaderPartialDeliveryComponent;
-    exports["ɵey"] = TransactionBaseComponent;
-    exports["ɵez"] = TransactionHeaderDownpaymentPercentageModule;
+    exports["ɵea"] = TransactionHeaderBlockComponent;
+    exports["ɵeb"] = TransactionHeaderDeliveryDateModule;
+    exports["ɵec"] = TransactionHeaderDeliveryDateComponent;
+    exports["ɵed"] = TransactionHeaderDeliveryOptionsModule;
+    exports["ɵee"] = TransactionHeaderDeliveryOptionsComponent;
+    exports["ɵef"] = TransactionHeaderRemarksModule;
+    exports["ɵeg"] = TransactionHeaderRemarksComponent;
+    exports["ɵeh"] = TransactionHeaderReferenceModule;
+    exports["ɵei"] = TransactionHeaderReferenceComponent;
+    exports["ɵej"] = TransactionHeaderRelationReferenceModule;
+    exports["ɵek"] = TransactionHeaderRelationReferenceComponent;
+    exports["ɵel"] = TransactionHeaderDeliveryMethodModule;
+    exports["ɵem"] = TransactionLineCheckboxModule;
+    exports["ɵen"] = TransactionLineCheckboxListComponent;
+    exports["ɵeo"] = TransactionHeaderDeliveryMethodComponent;
+    exports["ɵep"] = TransactionHeaderPreferredDeliveryDateModule;
+    exports["ɵeq"] = TransactionHeaderPreferredDeliveryDateComponent;
+    exports["ɵer"] = DialogTransactionHeaderDeliveryMethodModule;
+    exports["ɵes"] = DialogHeaderSearchModule;
+    exports["ɵet"] = DialogHeaderSearchComponent;
+    exports["ɵeu"] = DialogTransactionHeaderDeliveryMethodComponent;
+    exports["ɵev"] = TransactionHeaderPartialDeliveryModule;
+    exports["ɵew"] = TransactionHeaderPartialDeliveryComponent;
+    exports["ɵex"] = TransactionBaseComponent;
+    exports["ɵey"] = TransactionHeaderDownpaymentPercentageModule;
+    exports["ɵez"] = TransactionHeaderDownpaymentPercentageComponent;
     exports["ɵf"] = TransactionConnectorService;
-    exports["ɵfa"] = TransactionHeaderDownpaymentPercentageComponent;
-    exports["ɵfb"] = TransactionHeaderDownpaymentAmountModule;
-    exports["ɵfc"] = TransactionHeaderDownpaymentAmountComponent;
-    exports["ɵfd"] = TransactionHeaderDefinitiveModule;
-    exports["ɵfe"] = TransactionHeaderDefinitiveComponent;
-    exports["ɵff"] = TransactionHeaderBranchModule;
-    exports["ɵfg"] = TransactionHeaderBranchComponent;
-    exports["ɵfh"] = TransactionHeaderAdministrativeRelationModule;
-    exports["ɵfi"] = TransactionHeaderAdministrativeRelationComponent;
-    exports["ɵfj"] = TransactionHeaderMarketingModule;
-    exports["ɵfk"] = TransactionHeaderMarketingComponent;
-    exports["ɵfl"] = CheckoutOverviewRelationEditComponent;
-    exports["ɵfm"] = CheckoutOverviewDeliveryEditComponent;
-    exports["ɵfn"] = CheckoutOverviewDeliveryAddressComponent;
-    exports["ɵfo"] = CheckoutOverviewPaymentComponent;
-    exports["ɵfp"] = CheckoutLoginComponent;
-    exports["ɵfq"] = TransactionFilterCategoriesModule;
-    exports["ɵfr"] = TransactionFilterCategoriesComponent;
-    exports["ɵfs"] = TransactionHeaderPaymentModule;
-    exports["ɵft"] = TransactionHeaderPaymentComponent;
-    exports["ɵfu"] = TransactionLinesGridModule;
-    exports["ɵfv"] = TransactionBaseGridModule;
-    exports["ɵfw"] = TransactionLineSidePanelModule;
-    exports["ɵfx"] = TransactionLineSidePanelDefaultModule;
-    exports["ɵfy"] = TransactionLinePriceModule;
-    exports["ɵfz"] = TransactionLinePriceComponent;
+    exports["ɵfa"] = TransactionHeaderDownpaymentAmountModule;
+    exports["ɵfb"] = TransactionHeaderDownpaymentAmountComponent;
+    exports["ɵfc"] = TransactionHeaderDefinitiveModule;
+    exports["ɵfd"] = TransactionHeaderDefinitiveComponent;
+    exports["ɵfe"] = TransactionHeaderBranchModule;
+    exports["ɵff"] = TransactionHeaderBranchComponent;
+    exports["ɵfg"] = TransactionHeaderAdministrativeRelationModule;
+    exports["ɵfh"] = TransactionHeaderAdministrativeRelationComponent;
+    exports["ɵfi"] = TransactionHeaderMarketingModule;
+    exports["ɵfj"] = TransactionHeaderMarketingComponent;
+    exports["ɵfk"] = CheckoutOverviewRelationEditComponent;
+    exports["ɵfl"] = CheckoutOverviewDeliveryEditComponent;
+    exports["ɵfm"] = CheckoutOverviewDeliveryAddressComponent;
+    exports["ɵfn"] = CheckoutOverviewPaymentComponent;
+    exports["ɵfo"] = CheckoutLoginComponent;
+    exports["ɵfp"] = TransactionFilterCategoriesModule;
+    exports["ɵfq"] = TransactionFilterCategoriesComponent;
+    exports["ɵfr"] = TransactionHeaderPaymentModule;
+    exports["ɵfs"] = TransactionHeaderPaymentComponent;
+    exports["ɵft"] = TransactionLinesGridModule;
+    exports["ɵfu"] = TransactionBaseGridModule;
+    exports["ɵfv"] = TransactionLineSidePanelModule;
+    exports["ɵfw"] = TransactionLineSidePanelDefaultModule;
+    exports["ɵfx"] = TransactionLinePriceModule;
+    exports["ɵfy"] = TransactionLinePriceComponent;
+    exports["ɵfz"] = TransactionLinePriceListModule;
     exports["ɵg"] = TransactionConnectorAdapterService;
-    exports["ɵga"] = TransactionLinePriceListModule;
-    exports["ɵgb"] = TransactionLinePriceListComponent;
+    exports["ɵga"] = TransactionLinePriceListComponent;
+    exports["ɵgb"] = TransactionFilterPopupBaseComponent;
     exports["ɵgc"] = TransactionLineVatModule;
     exports["ɵgd"] = TransactionLineVatComponent;
     exports["ɵge"] = TransactionLineQuantityModule;
@@ -22565,138 +23580,154 @@
     exports["ɵhi"] = TransactionReceivingGoodsDetailsComponent;
     exports["ɵhj"] = ArticleService;
     exports["ɵhk"] = TransactionButtonBarModule;
-    exports["ɵhl"] = TransactionButtonBarComponent;
-    exports["ɵhm"] = TransactionButtonBarButtonComponent;
-    exports["ɵhn"] = TransactionLineSidePanelPurchaseModule;
-    exports["ɵho"] = DefaultOkCancelButtonsModule;
-    exports["ɵhp"] = DefaultOkCancelButtonsComponent;
-    exports["ɵhq"] = TransactionLineSidePanelPurchaseComponent;
-    exports["ɵhr"] = TransactionLineSidePanelComponent;
-    exports["ɵhs"] = DynamicBaseComponent;
-    exports["ɵht"] = TransactionLineActionButtonsModule;
-    exports["ɵhu"] = TransactionArticleTextOverviewModule;
-    exports["ɵhv"] = TransactionArticleTextOverviewComponent;
-    exports["ɵhw"] = TransactionLineActionButtonsComponent;
-    exports["ɵhx"] = TransactionBaseGridComponent;
-    exports["ɵhy"] = TransactionGridBaseComponent;
-    exports["ɵhz"] = DialogTransactionLineCommissionCodeModule;
+    exports["ɵhl"] = AnimatedCheckboxModule;
+    exports["ɵhm"] = AnimatedCheckboxComponent;
+    exports["ɵhn"] = TransactionButtonBarComponent;
+    exports["ɵho"] = TransactionButtonBarButtonComponent;
+    exports["ɵhp"] = TransactionButtonBarButtonBaseComponent;
+    exports["ɵhq"] = TransactionSalesPurchaseButtonBarButtonComponent;
+    exports["ɵhr"] = TransactionLineSidePanelPurchaseModule;
+    exports["ɵhs"] = DefaultOkCancelButtonsModule;
+    exports["ɵht"] = DefaultOkCancelButtonsComponent;
+    exports["ɵhu"] = TransactionLineSidePanelPurchaseComponent;
+    exports["ɵhv"] = TransactionLineSidePanelComponent;
+    exports["ɵhw"] = DynamicBaseComponent;
+    exports["ɵhx"] = TransactionLineActionButtonsModule;
+    exports["ɵhy"] = TransactionArticleTextOverviewModule;
+    exports["ɵhz"] = TransactionArticleTextOverviewComponent;
     exports["ɵi"] = BusinessObjectCacheManagerService;
-    exports["ɵia"] = DialogTransactionLineCommissionCodeComponent;
-    exports["ɵib"] = DialogTransactionLineBaseComponent;
-    exports["ɵic"] = DialogTransactionLineWarehouseModule;
-    exports["ɵid"] = DialogTransactionLineWarehouseComponent;
-    exports["ɵie"] = DialogTransactionLineWarehouseCcModule;
-    exports["ɵif"] = DialogTransactionLineWarehouseCcComponent;
-    exports["ɵig"] = DialogTransactionLineDeliveryMethodModule;
-    exports["ɵih"] = DialogTransactionLineDeliveryMethodComponent;
-    exports["ɵii"] = DialogTransactionLineVatModule;
-    exports["ɵij"] = DialogTransactionLineVatComponent;
-    exports["ɵik"] = DialogTransactionLineDiscountModule;
-    exports["ɵil"] = DialogTransactionLinePriceListModule;
-    exports["ɵim"] = DialogTransactionLinePriceListComponent;
-    exports["ɵin"] = DialogTransactionLineDiscountComponent;
-    exports["ɵio"] = TransactionLinesGridComponent;
-    exports["ɵip"] = DiscountModule;
-    exports["ɵiq"] = DiscountComponent;
-    exports["ɵir"] = TransactionQuickAccessOverviewModule;
-    exports["ɵis"] = TransactionQuickAccessOverviewComponent;
-    exports["ɵit"] = TransactionQuickAccessOrderDeliveryModule;
-    exports["ɵiu"] = TransactionQuickAccessOrderDeliveryComponent;
-    exports["ɵiv"] = TransactionOrderConfirmationGridModule;
-    exports["ɵiw"] = TransactionOrderConfirmationGridComponent;
-    exports["ɵix"] = TransactionReceivedGoodsGridModule;
-    exports["ɵiy"] = DialogTransactionLineWarehouseLocationModule;
-    exports["ɵiz"] = TransactionLineWarehouseLocationModule;
+    exports["ɵia"] = TransactionLineActionButtonsComponent;
+    exports["ɵib"] = TransactionBaseGridComponent;
+    exports["ɵic"] = TransactionGridBaseComponent;
+    exports["ɵid"] = DialogTransactionLineCommissionCodeModule;
+    exports["ɵie"] = DialogTransactionLineCommissionCodeComponent;
+    exports["ɵif"] = DialogTransactionLineBaseComponent;
+    exports["ɵig"] = DialogTransactionLineWarehouseModule;
+    exports["ɵih"] = DialogTransactionLineWarehouseComponent;
+    exports["ɵii"] = DialogTransactionLineWarehouseCcModule;
+    exports["ɵij"] = DialogTransactionLineWarehouseCcComponent;
+    exports["ɵik"] = DialogTransactionLineDeliveryMethodModule;
+    exports["ɵil"] = DialogTransactionLineDeliveryMethodComponent;
+    exports["ɵim"] = DialogTransactionLineVatModule;
+    exports["ɵin"] = DialogTransactionLineVatComponent;
+    exports["ɵio"] = DialogTransactionLineDiscountModule;
+    exports["ɵip"] = DialogTransactionLinePriceListModule;
+    exports["ɵiq"] = DialogTransactionLinePriceListComponent;
+    exports["ɵir"] = DialogTransactionLineDiscountComponent;
+    exports["ɵis"] = TransactionLinesGridComponent;
+    exports["ɵit"] = DiscountModule;
+    exports["ɵiu"] = DiscountComponent;
+    exports["ɵiv"] = TransactionQuickAccessOverviewModule;
+    exports["ɵiw"] = TransactionQuickAccessOverviewComponent;
+    exports["ɵix"] = TransactionQuickAccessOrderDeliveryModule;
+    exports["ɵiy"] = TransactionSendButtonDialogModule;
+    exports["ɵiz"] = TransactionSendButtonDialogComponent;
     exports["ɵj"] = CacheField;
-    exports["ɵja"] = TransactionLineWarehouseLocationComponent;
-    exports["ɵjb"] = DialogTransactionLineWarehouseLocationComponent;
-    exports["ɵjc"] = TransactionLineWarehouseLocationButtonModule;
-    exports["ɵjd"] = TransactionLineWarehouseLocationButtonComponent;
-    exports["ɵje"] = TransactionReceivedGoodsGridComponent;
-    exports["ɵjf"] = ViewModeButtonsModule;
-    exports["ɵjg"] = ViewModeButtonsComponent;
-    exports["ɵjh"] = TransactionGridModule;
-    exports["ɵji"] = TransactionGridComponent;
-    exports["ɵjj"] = TransactionTileModule;
-    exports["ɵjk"] = TransactionTileComponent;
-    exports["ɵjl"] = TransactionOverviewLineModule;
-    exports["ɵjm"] = EditableLabelModule;
-    exports["ɵjn"] = EditableLabelComponent;
-    exports["ɵjo"] = TransactionBaseLineModule;
-    exports["ɵjp"] = TransactionBaseLineComponent;
-    exports["ɵjq"] = TransactionLinesLineBaseComponent;
-    exports["ɵjr"] = TransactionLineCommissionButtonModule;
-    exports["ɵjs"] = TransactionLineCommissionButtonComponent;
-    exports["ɵjt"] = TransactionLineWarehouseButtonModule;
-    exports["ɵju"] = TransactionLineWarehouseButtonComponent;
-    exports["ɵjv"] = TransactionLineDeliveryButtonModule;
-    exports["ɵjw"] = TransactionLineDeliveryButtonComponent;
-    exports["ɵjx"] = TransactionLineDeliveryDateButtonModule;
-    exports["ɵjy"] = TransactionLineDeliveryDateButtonComponent;
-    exports["ɵjz"] = TransactionOverviewLineComponent;
+    exports["ɵja"] = TransactionQuickAccessOrderDeliveryComponent;
+    exports["ɵjb"] = TransactionQuickAccessOrderPurchaseModule;
+    exports["ɵjc"] = TransactionQuickAccessOrderPurchaseComponent;
+    exports["ɵjd"] = TransactionOrderConfirmationGridModule;
+    exports["ɵje"] = TransactionOrderConfirmationGridComponent;
+    exports["ɵjf"] = TransactionReceivedGoodsGridModule;
+    exports["ɵjg"] = DialogTransactionLineWarehouseLocationModule;
+    exports["ɵjh"] = TransactionLineWarehouseLocationModule;
+    exports["ɵji"] = TransactionLineWarehouseLocationComponent;
+    exports["ɵjj"] = DialogTransactionLineWarehouseLocationComponent;
+    exports["ɵjk"] = TransactionLineWarehouseLocationButtonModule;
+    exports["ɵjl"] = TransactionLineWarehouseLocationButtonComponent;
+    exports["ɵjm"] = TransactionReceivedGoodsGridComponent;
+    exports["ɵjn"] = ViewModeButtonsModule;
+    exports["ɵjo"] = ViewModeButtonsComponent;
+    exports["ɵjp"] = TransactionGridModule;
+    exports["ɵjq"] = TransactionGridComponent;
+    exports["ɵjr"] = TransactionTileModule;
+    exports["ɵjs"] = TransactionTileComponent;
+    exports["ɵjt"] = TransactionOverviewLineModule;
+    exports["ɵju"] = EditableLabelModule;
+    exports["ɵjv"] = EditableLabelComponent;
+    exports["ɵjw"] = TransactionBaseLineModule;
+    exports["ɵjx"] = TransactionBaseLineComponent;
+    exports["ɵjy"] = TransactionLinesLineBaseComponent;
+    exports["ɵjz"] = TransactionLineCommissionButtonModule;
     exports["ɵk"] = SelectMultipleParameterizedCacheService;
-    exports["ɵka"] = TransactionOrderDeliveryLineModule;
-    exports["ɵkb"] = TransactionOrderDeliveryLineComponent;
-    exports["ɵkc"] = TransactionReceiveGoodsLineModule;
-    exports["ɵkd"] = TransactionReceiveGoodsLineComponent;
-    exports["ɵke"] = TransactionSearchResultModule;
-    exports["ɵkf"] = TransactionSearchSalesOrderTileModule;
-    exports["ɵkg"] = TransactionSearchSalesOrderTileComponent;
-    exports["ɵkh"] = TransactionSearchTileBaseComponent;
-    exports["ɵki"] = TransactionSearchPurchaseOrderTileModule;
-    exports["ɵkj"] = TransactionSearchPurchaseOrderTileComponent;
-    exports["ɵkk"] = TransactionSearchSalesOrderGridModule;
-    exports["ɵkl"] = TransactionSearchSalesOrderGridComponent;
-    exports["ɵkm"] = TransactionSearchGridBaseComponent;
-    exports["ɵkn"] = TransactionSearchPurchaseOrderGridModule;
-    exports["ɵko"] = TransactionSearchPurchaseOrderGridComponent;
-    exports["ɵkp"] = TransactionSearchHeaderModule;
-    exports["ɵkq"] = TransactionSearchHeaderComponent;
-    exports["ɵkr"] = TransactionSearchGridModule;
-    exports["ɵks"] = TransactionSearchGridComponent;
-    exports["ɵkt"] = TransactionSearchTileModule;
-    exports["ɵku"] = TransactionSearchTileComponent;
-    exports["ɵkv"] = TransactionSearchResultComponent;
-    exports["ɵkw"] = TransactionSalesOrderFilterModule;
-    exports["ɵkx"] = TransactionSalesOrderFilterContentOrderModule;
-    exports["ɵky"] = TransactionFilterItemModule;
-    exports["ɵkz"] = TransactionFilterItemComponent;
+    exports["ɵka"] = TransactionLineCommissionButtonComponent;
+    exports["ɵkb"] = TransactionLineWarehouseButtonModule;
+    exports["ɵkc"] = TransactionLineWarehouseButtonComponent;
+    exports["ɵkd"] = TransactionLineDeliveryButtonModule;
+    exports["ɵke"] = TransactionLineDeliveryButtonComponent;
+    exports["ɵkf"] = TransactionLineDeliveryDateButtonModule;
+    exports["ɵkg"] = TransactionLineDeliveryDateButtonComponent;
+    exports["ɵkh"] = TransactionLineAmountModule;
+    exports["ɵki"] = TransactionLineAmountComponent;
+    exports["ɵkj"] = TransactionOverviewLineComponent;
+    exports["ɵkk"] = TransactionOrderDeliveryLineModule;
+    exports["ɵkl"] = TransactionOrderDeliveryLineComponent;
+    exports["ɵkm"] = TransactionReceiveGoodsLineModule;
+    exports["ɵkn"] = TransactionReceiveGoodsLineComponent;
+    exports["ɵko"] = TransactionPurchaseLineModule;
+    exports["ɵkp"] = TransactionLineSupplierButtonModule;
+    exports["ɵkq"] = DialogTransactionLineSupplierModule;
+    exports["ɵkr"] = DialogTransactionLineSupplierComponent;
+    exports["ɵks"] = TransactionLineSupplierButtonComponent;
+    exports["ɵkt"] = TransactionPurchaseLineComponent;
+    exports["ɵku"] = TransactionSearchResultModule;
+    exports["ɵkv"] = TransactionSearchSalesOrderTileModule;
+    exports["ɵkw"] = TransactionSearchSalesOrderTileComponent;
+    exports["ɵkx"] = TransactionSearchTileBaseComponent;
+    exports["ɵky"] = TransactionSearchPurchaseOrderTileModule;
+    exports["ɵkz"] = TransactionSearchPurchaseOrderTileComponent;
     exports["ɵl"] = ErrorService;
-    exports["ɵla"] = TransactionSalesOrderFilterContentOrderComponent;
-    exports["ɵlb"] = TransactionFilterContentBaseComponent;
-    exports["ɵlc"] = FilterRequestService;
-    exports["ɵld"] = TransactionSalesOrderFilterContentLogisticsModule;
-    exports["ɵle"] = TransactionFilterHistoricStateModule;
-    exports["ɵlf"] = TransactionFilterHistoricStateComponent;
-    exports["ɵlg"] = TransactionSalesOrderFilterContentLogisticsComponent;
-    exports["ɵlh"] = TransactionSalesOrderFilterContentArticleModule;
-    exports["ɵli"] = TransactionSalesOrderFilterContentArticleComponent;
-    exports["ɵlj"] = TransactionSalesOrderFilterComponent;
-    exports["ɵlk"] = TransactionFilterBaseComponent;
-    exports["ɵll"] = TransactionPurchaseOrderFilterModule;
-    exports["ɵlm"] = TransactionPurchaseOrderFilterContentOrderModule;
-    exports["ɵln"] = TransactionPurchaseOrderFilterContentOrderComponent;
-    exports["ɵlo"] = TransactionPurchaseOrderFilterContentLogisticsModule;
-    exports["ɵlp"] = TransactionPurchaseOrderFilterContentLogisticsComponent;
-    exports["ɵlq"] = TransactionPurchaseOrderFilterContentArticleModule;
-    exports["ɵlr"] = TransactionPurchaseOrderFilterContentArticleComponent;
-    exports["ɵls"] = TransactionPurchaseOrderFilterComponent;
-    exports["ɵlt"] = TransactionFilterModule;
-    exports["ɵlu"] = TransactionFilterComponent;
+    exports["ɵla"] = TransactionSearchSalesOrderGridModule;
+    exports["ɵlb"] = TransactionSearchSalesOrderGridComponent;
+    exports["ɵlc"] = TransactionSearchGridBaseComponent;
+    exports["ɵld"] = TransactionSearchPurchaseOrderGridModule;
+    exports["ɵle"] = TransactionSearchPurchaseOrderGridComponent;
+    exports["ɵlf"] = TransactionSearchHeaderModule;
+    exports["ɵlg"] = TransactionSearchHeaderComponent;
+    exports["ɵlh"] = TransactionSearchGridModule;
+    exports["ɵli"] = TransactionSearchGridComponent;
+    exports["ɵlj"] = TransactionSearchTileModule;
+    exports["ɵlk"] = TransactionSearchTileComponent;
+    exports["ɵll"] = TransactionSearchResultComponent;
+    exports["ɵlm"] = TransactionSalesOrderFilterModule;
+    exports["ɵln"] = TransactionSalesOrderFilterContentOrderModule;
+    exports["ɵlo"] = TransactionFilterItemModule;
+    exports["ɵlp"] = TransactionFilterItemComponent;
+    exports["ɵlq"] = TransactionSalesOrderFilterContentOrderComponent;
+    exports["ɵlr"] = TransactionFilterContentBaseComponent;
+    exports["ɵls"] = FilterRequestService;
+    exports["ɵlt"] = TransactionSalesOrderFilterContentLogisticsModule;
+    exports["ɵlu"] = TransactionFilterHistoricStateModule;
+    exports["ɵlv"] = TransactionFilterHistoricStateComponent;
+    exports["ɵlw"] = TransactionSalesOrderFilterContentLogisticsComponent;
+    exports["ɵlx"] = TransactionSalesOrderFilterContentArticleModule;
+    exports["ɵly"] = TransactionSalesOrderFilterContentArticleComponent;
+    exports["ɵlz"] = TransactionSalesOrderFilterComponent;
     exports["ɵm"] = SelectSingleCacheService;
+    exports["ɵma"] = TransactionFilterBaseComponent;
+    exports["ɵmb"] = TransactionPurchaseOrderFilterModule;
+    exports["ɵmc"] = TransactionPurchaseOrderFilterContentOrderModule;
+    exports["ɵmd"] = TransactionPurchaseOrderFilterContentOrderComponent;
+    exports["ɵme"] = TransactionPurchaseOrderFilterContentLogisticsModule;
+    exports["ɵmf"] = TransactionPurchaseOrderFilterContentLogisticsComponent;
+    exports["ɵmg"] = TransactionPurchaseOrderFilterContentArticleModule;
+    exports["ɵmh"] = TransactionPurchaseOrderFilterContentArticleComponent;
+    exports["ɵmi"] = TransactionPurchaseOrderFilterComponent;
+    exports["ɵmj"] = TransactionFilterModule;
+    exports["ɵmk"] = TransactionFilterComponent;
     exports["ɵn"] = ArticleConnectorService;
-    exports["ɵo"] = CoreModule;
-    exports["ɵp"] = ConfirmationDialogModule;
-    exports["ɵq"] = PipeModule;
-    exports["ɵr"] = AppendPipe;
-    exports["ɵs"] = DeliveryTimePipe;
-    exports["ɵt"] = DateDurationPipe;
-    exports["ɵu"] = LocalizePipe;
-    exports["ɵv"] = CoCurrencyPipe;
-    exports["ɵw"] = SafeStylePipe;
-    exports["ɵx"] = SafeHtmlPipe;
-    exports["ɵy"] = ConfirmationDialogComponent;
-    exports["ɵz"] = DialogBaseComponent;
+    exports["ɵo"] = TransactionEventService;
+    exports["ɵp"] = CoreModule;
+    exports["ɵq"] = ConfirmationDialogModule;
+    exports["ɵr"] = PipeModule;
+    exports["ɵs"] = AppendPipe;
+    exports["ɵt"] = DeliveryTimePipe;
+    exports["ɵu"] = DateDurationPipe;
+    exports["ɵv"] = LocalizePipe;
+    exports["ɵw"] = CoCurrencyPipe;
+    exports["ɵx"] = SafeStylePipe;
+    exports["ɵy"] = SafeHtmlPipe;
+    exports["ɵz"] = ConfirmationDialogComponent;
     Object.defineProperty(exports, '__esModule', { value: true });